/* Анти-FOUC: бандл Chainlit подключается ПОСЛЕ custom.css и несёт розовый
   --primary (340 92% 52%) — до применения theme.json кнопки мигали розовым.
   Дублируем фирменные переменные с повышенной специфичностью. */
:root:root {
    --primary: 151 70% 41%;
    --primary-foreground: 0 0% 100%;
    --ring: 151 70% 41%;
}
html.dark {
    --primary: 150 69% 48%;
    --primary-foreground: 0 0% 13%;
    --ring: 150 69% 48%;
}

/* Правая панель логина: CSS-точки (чёткие, 1:1) с плавным проявлением от стыка.
   Встроенный <img> (фолбэк на favicon) скрываем. */
.min-h-svh > .bg-muted img {
    display: none;
}
.min-h-svh > .bg-muted {
    background-color: hsl(var(--background));
    background-image:
        linear-gradient(90deg, hsl(var(--background)) 0%, hsl(var(--background) / 0) 45%),
        linear-gradient(180deg, rgb(255 255 255 / 0.02), rgb(0 0 0 / 0.10)),
        radial-gradient(circle, rgb(255 255 255 / 0.16) 1.2px, transparent 1.5px);
    background-size: auto, auto, 28px 28px;
}
/* «VDI» в заголовках (логин и welcome): однократный shimmer при открытии —
   волна света пробегает по буквам и замирает на фирменном зелёном. */
.vdi-word {
    background: linear-gradient(100deg,
        #26D07C 0%, #26D07C 35%, #D6FFEA 50%, #26D07C 65%, #26D07C 100%);
    background-size: 300% 100%;
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
    animation: vdi-shimmer 6s linear 0.4s infinite;
    background-position: 100% 0;
}
/* Цикл 6с: волна ~1.6с, остальное — пауза (слово залито ровным #26D07C:
   вне волны на краях градиента сплошной фирменный зелёный). */
@keyframes vdi-shimmer {
    0%   { background-position: 100% 0; animation-timing-function: ease-out; }
    27%  { background-position: 0% 0; }
    100% { background-position: 0% 0; }
}

/* Логотип — марка cloud.ru, внизу колонки по центру (под кнопкой «Войти»):
   переворачиваем порядок колонки, форма остаётся в центре за счёт flex-1 */
img.logo {
    width: auto;
    height: 18px;
}
.min-h-svh > div:first-child {
    flex-direction: column-reverse;
}
.min-h-svh > div:first-child > .md\:justify-start {
    justify-content: center;
}

/* Аватар ассистента в чате крупнее (дефолт 20px) */
span.rounded-full.h-5.w-5:has(> img[alt^="Avatar"]) {
    height: 28px;
    width: 28px;
    margin-top: 0;
}

/* Светлая тема отключена: прячем переключатель */
#theme-toggle { display: none !important; }

/* Фон чата: приглушённая версия логин-панели (сетка тусклее, под звёзды из stars.js) */
.dark .h-screen.w-screen:not([role="dialog"]) {
    position: relative;
    background-color: hsl(var(--background));
    background-image: radial-gradient(circle, rgb(255 255 255 / 0.09) 1.2px, transparent 1.5px);
    background-size: 30px 30px;
}

/* Реплики пользователя — в цвете кнопки «Войти» (primary), текст контрастный */
/* Пузырь пользователя: bg-accent rounded-3xl есть и у поля ввода — сужаем
   до :has(.message-content), это только сообщение, не composer. */
.bg-accent.rounded-3xl:has(.message-content) {
    background-color: hsl(var(--primary));
}
.bg-accent.rounded-3xl:has(.message-content),
.bg-accent.rounded-3xl:has(.message-content) .prose,
.bg-accent.rounded-3xl:has(.message-content) .prose * {
    color: hsl(var(--primary-foreground));
}

/* Реплики ассистента — нейтральный пузырь-карточка (чуть светлее фона).
   Контейнер .items-start с прямым .message-content = блок ответа ассистента
   (у пользователя message-content лежит в .rounded-3xl, сюда не попадает). */
.flex.flex-col.items-start:has(> .message-content) {
    background-color: hsl(var(--card));
    padding: 12px 20px;
    border-radius: 22px;
    max-width: 78%;
}

/* Кнопка «Поддержка» — в цвет иконки нового чата (muted-foreground) */
button[data-vdi-support] {
    color: hsl(var(--muted-foreground));
}

/* Заголовок welcome-экрана чата (замена логотипа); пульс логина тут отключён */
.vdi-welcome-title {
    font-family: 'SB Sans UI', Inter, sans-serif;
    font-weight: 700;
    font-size: 21px;
    color: hsl(var(--foreground));
    text-align: center;
}
}
