/*
 * Модуль «Календарь» (GL-340 Ф1, эпик-спайк GL-275) — ФИРМЕННЫЙ хром поверх FullCalendar v7.
 * Свой ассет (public/css/gl-calendar.css), НЕ theme.css — ВСЁ скоупим к `.gl-cal-wrap`, чтобы не
 * задеть другие экраны.
 *
 * ⚠⚠ FullCalendar v7 = CSS-in-JS с ХЕШИРОВАННЫМИ именами классов (`fc-Fa`, `fc-classic-1Wx` — НЕ
 * стабильные `.fc-event`/`.fc-col-header-cell-cushion` как в v6; проверено живым замером GL-340).
 * Поэтому ретема идёт ТОЛЬКО через CSS-переменные темы `--fc-classic-*` (их читают внутренние
 * хеш-классы) — селекторы по именам fc-классов бесполезны. Цвет КОНКРЕТНЫХ событий задаёт сервер
 * ИНЛАЙНОМ (проекция: color/textColor per-event), а не CSS-классом — по той же причине.
 */

/* ── Каркас страницы ──────────────────────────────────────────────────────────
   GL-355: карточка-рамка (border/radius/shadow) переехала на ОБЩИЙ обод
   `.fi-page-header-main-ctn` (resources/css/filament/theme.css, скоуп `.gl-calendar-sticky-card`) —
   `.gl-cal-wrap` теперь ТОЛЬКО тело карточки (контент, скроллится под липкой шапкой). Легенда — тоже
   переехала, в шапку (`.gl-cal-sticky-head .gl-cal-legend`, theme.css); здесь её больше нет. */
.gl-cal-wrap {
    background: var(--gl-surface, #fff);
    border-radius: 0 0 0.75rem 0.75rem;
    padding: 0 1.15rem 1.25rem;
}

/* ── Ремап палитры темы FullCalendar (classic) → роли --gl-* (СВЕТЛАЯ тема) ────── */
.gl-cal-wrap {
    /* GL-664: линия сетки календаря СИЛЬНЕЕ общего `--gl-hairline`. Замер в светлой теме: hairline
       `rgb(12 39 24 / 0.08)` даёт на белом ≈ rgb(236,238,237) — светлее заливки нерабочих часов, то
       есть на затенённом (нерабочем) дне линия пропадала целиком. Здесь сетка — не декоративный
       разделитель блоков, а рабочая шкала времени, поэтому в скоупе календаря она плотнее; за его
       пределы значение не выходит. */
    --fc-classic-border: rgb(12 39 24 / 0.14);
    --fc-classic-foreground: var(--gl-text, #111827);
    --fc-classic-strong: var(--gl-text, #111827);
    /* GL-664: `muted`/`faint` — ЗАЛИВКА нерабочих часов и нерабочих дней (`.fc-classic-k3f`/`-iYS`,
       плюс hover/focus ячеек), лежащая ПОД линиями сетки (`--fc-classic-border`). Непрозрачный
       `--gl-surface-2` вставал почти в цвет линии и сетка пропадала. Вендор здесь не случайно держит
       ПОЛУПРОЗРАЧНЫЕ наложения (`#0000000A`/`#00000014`): граница остаётся видимой поверх любой
       поверхности. Возвращаем механику, но оттенком нашей роли текста, а не чистым чёрным; две роли
       разведены (нерабочий день заметнее нерабочего часа).
       ⚠ Правим ТОЛЬКО маппинг внутри `.gl-cal-wrap` — сам `--gl-surface-2` глобальный (шапки таблиц,
       hover строк, Brand.php) и его правка разъехалась бы по всей системе. */
    --fc-classic-muted: rgb(17 24 39 / 0.045);
    --fc-classic-muted-foreground: var(--gl-muted, #6b7280);
    --fc-classic-faint: rgb(17 24 39 / 0.022);
    --fc-classic-faint-foreground: var(--gl-muted, #6b7280);
    --fc-classic-background: var(--gl-surface, #fff);

    /* кнопки тулбара → брендовый зелёный. ⚠ Именно --gl-primary-STRONG (#007f36 = 5.14:1 с белым);
       --gl-primary (#009a44) под белым даёт 3.68:1 — провал AA (контраст-аудит GL-340). Активная
       кнопка (button-strong) — ещё темнее (derived, источник всё равно центральная роль). */
    --fc-classic-button: var(--gl-primary-strong, #007f36);
    --fc-classic-button-border: var(--gl-primary-strong, #007f36);
    --fc-classic-button-strong: color-mix(in srgb, var(--gl-primary-strong, #007f36) 82%, #000);
    --fc-classic-button-strong-border: color-mix(in srgb, var(--gl-primary-strong, #007f36) 82%, #000);
    --fc-classic-button-foreground: var(--gl-on-primary, #fff);
    --fc-classic-button-outline: var(--gl-primary-strong, #007f36);

    /* акценты */
    --fc-classic-primary: var(--gl-primary, #009a44);
    --fc-classic-primary-foreground: var(--gl-on-primary, #fff);
    --fc-classic-ring-color: var(--gl-primary, #009a44);
    --fc-classic-highlight: rgb(0 154 68 / 0.10);
    --fc-classic-today: rgb(0 154 68 / 0.08); /* мягкая заливка «сегодня» */
    --fc-classic-now: #ef4444;                /* индикатор текущего времени */

    /* дефолт-событие (сервер обычно задаёт цвет per-event; это фолбэк) */
    --fc-classic-event: var(--gl-primary-strong, #007f36);
    --fc-classic-event-contrast: var(--gl-on-primary, #fff);
}

/* ── Тёмная тема: ремап на словарь --gl-dark-* ────────────────────────────────── */
.dark .gl-cal-wrap {
    background: var(--gl-dark-surface, #1a2027);

    --fc-classic-border: var(--gl-dark-border, #2b333c);
    --fc-classic-foreground: var(--gl-dark-text, #e6eaed);
    --fc-classic-strong: var(--gl-dark-text, #e6eaed);
    /* GL-664 (тёмная): живой замер `getComputedStyle` — `--gl-dark-surface-2` резолвится в #2a2e34
       (42,46,52), линия `--gl-dark-border` в #383c43 (56,60,67): разница ≈14 на канал, сетка была
       неразличима (литералы-фолбэки в строках ниже — не действующие значения, реальные роли темы
       определены централизованно). На тёмной поверхности нерабочее время читается
       естественнее ЗАТЕМНЕНИЕМ, а не осветлением: полупрозрачный чёрный уводит заливку ВНИЗ от
       поверхности (композит 27,30,34 — Δ до линии ≈29), сетка проявляется. Маппинг локальный (`.gl-cal-wrap`),
       глобальные роли не тронуты. */
    --fc-classic-muted: rgb(0 0 0 / 0.32);
    --fc-classic-muted-foreground: var(--gl-dark-text-muted, #9aa4ad);
    --fc-classic-faint: rgb(0 0 0 / 0.17);
    --fc-classic-faint-foreground: var(--gl-dark-text-muted, #9aa4ad);
    --fc-classic-background: var(--gl-dark-surface, #1a2027);

    /* ⚠ Текст кнопок FC — белый (тема FC), поэтому фон обязан быть тёмным (WCAG ≥ 4.5). --gl-dark-primary
       (#007f36) под белым = 5.14:1 ✓; --gl-dark-primary-HOVER (#009040) провалил бы (4.15:1 — аудит
       GL-340), поэтому активную кнопку берём как ЗАТЕМНЕНИЕ --gl-dark-primary, а не светлее. */
    --fc-classic-button: var(--gl-dark-primary, #007f36);
    --fc-classic-button-border: var(--gl-dark-primary, #007f36);
    --fc-classic-button-strong: color-mix(in srgb, var(--gl-dark-primary, #007f36) 80%, #000);
    --fc-classic-button-strong-border: color-mix(in srgb, var(--gl-dark-primary, #007f36) 80%, #000);
    --fc-classic-button-foreground: #ffffff;
    --fc-classic-button-outline: var(--gl-dark-primary, #007f36);

    --fc-classic-primary: var(--gl-dark-primary, #12b257);
    --fc-classic-primary-foreground: var(--gl-dark-on-primary, #0b0f14);
    --fc-classic-ring-color: var(--gl-dark-primary, #12b257);
    --fc-classic-highlight: rgb(18 178 87 / 0.16);
    --fc-classic-today: rgb(18 178 87 / 0.12);
    --fc-classic-now: #f87171;

    --fc-classic-event: var(--gl-dark-primary, #12b257);
    --fc-classic-event-contrast: var(--gl-dark-on-primary, #0b0f14);
}

/* ── GL-343 Ф2: фоновые слои (рабочее время / произв.календарь / отсутствия) ─────
 * Фон-события (display:'background') FullCalendar заливает per-event `color` (наши источники
 * OfficeCalendarDay/EmployeeAbsence), смешанным темой до `--fc-classic-background-event-opacity`.
 * Дефолт вендора 15% на белой поверхности почти незаметен — в скоупе .gl-cal-wrap поднимаем
 * непрозрачность заливки до читаемой, а подпись фон-события (напр. «Отсутствие — Отпуск») делаем
 * полностью непрозрачной, чтобы название отсутствия/праздника читалось (иначе 50%-текст на 15%-фоне).
 * Всё скоуплено к .gl-cal-wrap — другие экраны не задеты. */
.gl-cal-wrap {
    --fc-classic-background-event-opacity: 20%;
    --fc-classic-background-event-foreground-opacity: 100%;
}
.dark .gl-cal-wrap {
    /* На тёмной поверхности та же доля цвета читается ярче — держим чуть ниже, чтобы не «кричало». */
    --fc-classic-background-event-opacity: 26%;
    --fc-classic-background-event-foreground-opacity: 100%;
}

/* ── ⭐ GL-1109 · ВСТРЕЧИ ИЗ OUTLOOK: видимое «это не наше и правится не здесь» ─────
 * Цвет (violet-700) задаёт сервер инлайном, как у всех источников. Одного цвета мало: он говорит
 * «другой источник», но не говорит «только для чтения». Отличие несёт ШТРИХОВАЯ левая кромка —
 * приём, который читается и в месяце (узкая полоса), и в неделе (блок), и не зависит от хешированных
 * классов вендора: цепляется за НАШ класс из DTO источника.
 * ⚠ Кромка рисуется `border-left`, а не псевдоэлементом: у события FullCalendar внутренняя разметка
 * своя, и `::before` в разных видах садится в разные узлы. Ширину компенсируем отрицательным полем
 * — иначе полоса события в месяце стала бы на 3px уже соседних и колонка «поехала» бы.
 * ⚠ Обводка НЕ `outline`: он рисуется поверх соседей и в плотном месяце наложился бы на них. */
.gl-cal .gl-cal--outlook {
    border-left: 3px dashed rgb(255 255 255 / 0.72);
    margin-left: -3px;
}

/* Приватная встреча («Занято» без содержимого) — та же кромка, но заливка приглушена: у неё нечего
 * читать, и притягивать к ней взгляд наравне с обычной встречей незачем. Прозрачность, а не второй
 * цвет: тон источника обязан остаться узнаваемым (легенда одна). */
.gl-cal .gl-cal--outlook-private {
    opacity: 0.78;
}

/* ⭐ GL-1109 · ПЛАШКА ПРИЧИНЫ (ящик не сопоставлен / Microsoft 365 не ответил / период плотный).
 * Роль-токены, а не литералы (CLAUDE.md: `var(--x, #fallback)` с несуществующей ролью молча
 * рендерит fallback), тёмная тема — отдельным правилом, как у `.gl-cal-tz` ниже. Тон НЕ красный:
 * это не ошибка работы человека и не потеря его данных — свои события на месте, внешние подтянутся
 * сами; красный здесь читался бы как «сломалось у вас». */
.gl-cal-outlook-notice {
    margin: 0 0 0.625rem;
    padding: 0.5rem 0.75rem;
    border-radius: 0.5rem;
    background: var(--gl-hairline, #f3f4f6);
    color: var(--gl-muted, #6b7280);
    font-size: 0.8125rem;
    line-height: 1.35;
}

.dark .gl-cal-outlook-notice {
    background: var(--gl-dark-surface-2, #1b2027);
    color: var(--gl-dark-text-muted, #9aa4ad);
}

/* ── GL-663 · МИНИ-МЕНЮ действий события ─────────────────────────────────────────
 * Панель у точки клика по событию. `position: fixed` — координаты клиентские (их считает
 * `placeEventMenu()` с загоном в вьюпорт), и ни один скролл-предок сетки её не обрезает.
 * ⚠ Слой: у модалок Filament z-index 40-й ступени; меню живёт НАД сеткой, но НИЖЕ модалки — оно
 * закрывается ДО монтирования действия (`runEventMenuItem`), пересекаться им негде.
 * Цвета — только роли `--gl-*` (литералы рядом — фолбэки, а не действующие значения). */
.gl-cal-menu {
    position: fixed;
    z-index: 30;
    min-width: 12rem;
    padding: 0.25rem;
    border: 1px solid var(--gl-hairline, rgb(12 39 24 / 0.08));
    border-radius: 0.6rem;
    background: var(--gl-surface, #fff);
    box-shadow: 0 8px 24px rgb(12 39 24 / 0.14);
}

.gl-cal-menu__item {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    width: 100%;
    padding: 0.4rem 0.55rem;
    border-radius: 0.4rem;
    font-size: 0.8125rem;
    line-height: 1.25rem;
    text-align: start;
    color: var(--gl-text, #111827);
    background: transparent;
    cursor: pointer;
}

.gl-cal-menu__item:hover,
.gl-cal-menu__item:focus-visible {
    background: var(--gl-hairline, rgb(12 39 24 / 0.08));
}

/* Цвет несёт смысл ТОЛЬКО у деструктива (§3.1 «монохром + акценты»): прочие пункты нейтральны.
   ⚠ Роль именно `--gl-destructive` (ДЕЙСТВИЕ «удалить», GL-636), а НЕ `--gl-tone-negative` (та —
   оценочная ЦИФРА «убыток/просрочка», GL-492): смыслов два, красок две. Роль сама несёт тёмную
   тему, поэтому `.dark`-переопределения у пункта нет. */
.gl-cal-menu__item--danger {
    color: var(--gl-destructive, rgb(220 38 38));
}

.gl-cal-menu__item--danger:hover,
.gl-cal-menu__item--danger:focus-visible {
    background: var(--gl-destructive-tint, rgb(220 38 38 / 0.1));
}

.gl-cal-menu__icon {
    display: inline-flex;
    flex: 0 0 auto;
    color: var(--gl-muted, #6b7280);
}

.gl-cal-menu__item--danger .gl-cal-menu__icon {
    color: inherit;
}

.gl-cal-menu__glyph {
    width: 1rem;
    height: 1rem;
}

.dark .gl-cal-menu {
    border-color: var(--gl-dark-border, #2b333c);
    background: var(--gl-dark-surface-2, #2a2e34);
    box-shadow: 0 8px 24px rgb(0 0 0 / 0.45);
}

.dark .gl-cal-menu__item {
    color: var(--gl-dark-text, #e6eaed);
}

.dark .gl-cal-menu__item:hover,
.dark .gl-cal-menu__item:focus-visible {
    background: rgb(255 255 255 / 0.07);
}

.dark .gl-cal-menu__icon {
    color: var(--gl-dark-text-muted, #9aa4ad);
}

/* ⚠ Специфичность: `.dark .gl-cal-menu__item:hover` выше, чем `.gl-cal-menu__item--danger:hover`,
   и без этой строки деструктивный пункт в тёмной теме получал бы нейтральную подсветку. */
.dark .gl-cal-menu__item--danger:hover,
.dark .gl-cal-menu__item--danger:focus-visible {
    background: var(--gl-destructive-tint, rgb(220 38 38 / 0.1));
}

/* ── GL-663 · строки СВОЕГО окна дня (замена нативного поповера «+ ещё N») ────────
 * Список внутри модалки Filament — поэтому фон/рамку окна даёт сама модалка, здесь только строки.
 * Скоуп `.gl-cal-day` не пересекается с сеткой (`.gl-cal-wrap`) и другими экранами. */
.gl-cal-day__row {
    display: flex;
    align-items: center;
    gap: 0.6rem;
    padding: 0.4rem 0;
    border-bottom: 1px solid var(--gl-hairline, rgb(12 39 24 / 0.08));
}

.gl-cal-day__row:last-child {
    border-bottom: 0;
}

.gl-cal-day__dot {
    flex: 0 0 auto;
    width: 0.6rem;
    height: 0.6rem;
    border-radius: 999px;
    background: var(--gl-muted, #6b7280);
}

.gl-cal-day__time {
    flex: 0 0 auto;
    min-width: 5.5rem;
    font-size: 0.8125rem;
    font-variant-numeric: tabular-nums;
    color: var(--gl-muted, #6b7280);
}

.gl-cal-day__title {
    flex: 1 1 auto;
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-size: 0.875rem;
    color: var(--gl-text, #111827);
}

.gl-cal-day__actions {
    flex: 0 0 auto;
}

/* ⭐ GL-1109 · метка источника у внешней встречи в окне дня. Нейтральная «пилюля», а не цветной
   акцент: цвет в этом проекте несёт смысл только у деструктива (§3.1 «монохром + акценты»), а тут
   надо просто назвать источник. `flex: 0 0 auto` — метка не сжимается, длинное название события
   ужимается многоточием само (`.gl-cal-day__title` выше). */
.gl-cal-day__badge {
    flex: 0 0 auto;
    padding: 0.05rem 0.4rem;
    border-radius: var(--gl-radius-xs, 0.25rem);
    background: var(--gl-hairline, #f3f4f6);
    color: var(--gl-muted, #6b7280);
    font-size: 0.6875rem;
    line-height: 1.5;
    white-space: nowrap;
}

.dark .gl-cal-day__badge {
    background: var(--gl-dark-surface-2, #2a2e34);
    color: var(--gl-dark-text-muted, #a6acb5);
}

.dark .gl-cal-day__row {
    border-bottom-color: var(--gl-dark-border, #2b333c);
}

.dark .gl-cal-day__time {
    color: var(--gl-dark-text-muted, #9aa4ad);
}

.dark .gl-cal-day__title {
    color: var(--gl-dark-text, #e6eaed);
}

/* GL-705 Ф2 — подпись действующего часового пояса под календарём. Роль-токены, а не литералы
   (CLAUDE.md: цвет задаётся ролью из Brand::rootTokens(), иначе `var(--x, #fallback)` молча
   рендерит fallback); тёмная тема — отдельным правилом, как у соседей в этом файле. */
.gl-cal-tz {
    margin: 0.75rem 0 0;
    font-size: 0.8125rem;
    color: var(--gl-muted, #6b7280);
}

.gl-cal-tz a {
    color: var(--gl-primary, #16a34a);
    text-decoration: underline;
    text-underline-offset: 2px;
}

.dark .gl-cal-tz {
    color: var(--gl-dark-text-muted, #9aa4ad);
}

/* ══════════════════════════════════════════════════════════════════════════════════════════
   ⭐ GL-736 · ТЕЛЕФОННАЯ ВЕТКА КАЛЕНДАРЯ (≤ 640px) — аудит GL-726 §4.3 + §5.2
   Точка перелома 640px — та же единственная «телефонная», что у GL-733/734/735/741; блок живёт
   в СВОЁМ ассете календаря (не в theme.css), потому что весь хром этого экрана — здесь.
   Начальный вид («Повестка дня» вместо «Месяца») решается НЕ отсюда, а в блейде страницы:
   это выбор вида, а не оформление, и CSS его выразить не может.
   ══════════════════════════════════════════════════════════════════════════════════════════ */
@media (max-width: 640px) {
    /* ── §5.2 · «Повестка дня»: название события обрезалось БЕЗ многоточия ──
       Замер ДО (390×844, неделя 25–31 мая 2026): колонка времени 146.6 px из 317 доступных (46 %),
       колонка названия — 112.6 px при содержимом 197–429 px, `white-space:nowrap; overflow:hidden`
       и `text-overflow: clip` ⇒ пользователь видел «Task-00814 Провест» и не мог узнать, что за
       задача.
       ФИКС — ПЕРЕНОС, а не ellipsis+подсказка (ТЗ разрешает любой из двух): на телефоне нет hover,
       подсказка потребовала бы тапа и оставила бы название нечитаемым до него — то есть лечила бы
       симптом. Перенос показывает название ЦЕЛИКОМ сразу; строка растёт по ВЫСОТЕ, а не по ширине,
       поэтому горизонтального скролла не появляется.

       ⚠ Селекторы цепляются за НАШ класс `gl-cal-list-ev` ({@see public/js/gl-calendar.js},
       `eventDidMount`), а НЕ за хеш-классы вендора (`fc-classic-1El` — см. шапку файла: они
       меняются со сборкой FullCalendar).
       ⚠⚠ ГЛУБИНА ВЛОЖЕННОСТИ — не догадка, а ЖИВОЙ ЗАМЕР DOM (первая редакция правила её угадала
       и попала в ЧУЖИЕ узлы: колонка названия сжалась 112.6 → 46.6 px, то есть стало ХУЖЕ, чем
       было). Фактическая строка «Повестки дня»:
           .gl-cal-list-ev            flex, 317.2 px  ← сюда вешается класс
             ├─ [0] кружок-маркер     block,  ~12 px  ← НЕ трогаем
             └─ [1] обёртка           display: contents  ← сама ширины не имеет
                  ├─ [0] время / «Весь день»
                  └─ [1] название
       Обёртка `display: contents` означает, что флекс-итемами строки являются её ВНУКИ, а не дети,
       — отсюда двухуровневые селекторы ниже. */
    .gl-cal .gl-cal-list-ev > :last-child > :first-child {
        /* Время/«Весь день» — узкая фиксированная колонка вместо 46 % ширины экрана. 4.75rem хватает
           «Весь день» и «10:00 – 11:00» в две строки; `white-space: normal` разрешает этот перенос
           (иначе колонка распёрлась бы обратно содержимым). */
        flex: 0 0 4.75rem;
        width: 4.75rem;
        min-width: 0;
        white-space: normal;
        overflow: visible;
    }

    .gl-cal .gl-cal-list-ev > :last-child > :last-child {
        /* Название — весь остаток строки, с переносом. `overflow-wrap: anywhere` нужен ради длинных
           неразрывных токенов (артикулы, ссылки): без него одно такое слово снова распёрло бы строку
           и вернуло горизонтальный вылет, ради ухода от которого правило и пишется. */
        flex: 1 1 auto;
        min-width: 0;
        white-space: normal;
        overflow: visible;
        overflow-wrap: anywhere;
    }
}