/* TIS / Санарип Ош — единый стиль кабинета (Account Console, PatternFly 5).
   Три секции: ОБЩЕЕ · только СВЕТЛАЯ (html:not(.pf-v5-theme-dark)) · только ТЁМНАЯ (.pf-v5-theme-dark).
   Тёмная тема — родная PatternFly (класс pf-v5-theme-dark), мы её перебрендируем в фиолет.
   Переключатель темы (js/tis-theme.js) синхронизирован с localStorage 'tis-theme' — как на входе. */

/* ===================== ШРИФТ GOLOS TEXT (вариативный, Paratype) ===================== */
/* cyrillic-ext обязателен для кыргызских ң/ө/ү (U+04A3/04E9/04AF) */
@font-face {
    font-family: 'Golos Text'; font-style: normal; font-weight: 400 800; font-display: swap;
    src: url("../fonts/golos-latin.woff2") format("woff2");
    unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
    font-family: 'Golos Text'; font-style: normal; font-weight: 400 800; font-display: swap;
    src: url("../fonts/golos-cyrillic.woff2") format("woff2");
    unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
@font-face {
    font-family: 'Golos Text'; font-style: normal; font-weight: 400 800; font-display: swap;
    src: url("../fonts/golos-cyrillicext.woff2") format("woff2");
    unicode-range: U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
}

/* ===================== ОБЩЕЕ (обе темы) ===================== */
:root {
    /* фирменный фиолет — акцент для обеих тем */
    --pf-v5-global--primary-color--100: #4a4aff;
    --pf-v5-global--primary-color--200: #3a3ae0;
    --pf-v5-global--link--Color: #4a4aff;
    --pf-v5-global--link--Color--hover: #3a3ae0;
    --pf-v5-global--active-color--100: #4a4aff;
    --pf-v5-global--active-color--200: #3a3ae0;
    /* шрифт Golos Text во всём кабинете */
    --pf-v5-global--FontFamily--text: 'Golos Text', 'Segoe UI', Arial, sans-serif;
    --pf-v5-global--FontFamily--heading: 'Golos Text', 'Segoe UI', Arial, sans-serif;
    --pf-v5-global--FontFamily--sans-serif: 'Golos Text', 'Segoe UI', Arial, sans-serif;
}

/* контент-контейнеры прозрачны — фон задаёт html/body (см. секции тем) */
.pf-v5-c-page,
.pf-v5-c-page__main,
.pf-v5-c-page__main-section {
    background: transparent !important;
}

/* логотип «Санарип Ош» */
.pf-v5-c-brand,
.pf-v5-c-masthead__brand img,
img.pf-v5-c-brand {
    height: 40px !important;
    max-height: 40px !important;
    width: auto !important;
}

/* основная кнопка */
.pf-v5-c-button.pf-m-primary {
    border-radius: 8px;
    font-weight: 600;
    transition: background-color .15s ease, transform .15s ease, box-shadow .15s ease;
}
.pf-v5-c-button.pf-m-primary:hover { transform: translateY(-1px); }

/* фокус полей — фиолетовое свечение */
.pf-v5-c-form-control:focus,
.pf-v5-c-form-control:focus-within,
input.pf-v5-c-form-control:focus {
    outline: none;
    border-color: #6a6aff !important;
    box-shadow: 0 0 0 3px rgba(106, 106, 255, 0.25) !important;
}

/* карточки */
.pf-v5-c-card { border-radius: 12px; }

/* индикатор-полоска текущего пункта меню — фиолет в обеих темах */
.pf-v5-c-nav__link.pf-m-current::after {
    --pf-v5-c-nav__link--after--BorderColor: #4a4aff;
    border-color: #4a4aff !important;
}

/* ---- ШАПКА: строго один ряд, контент прижат вправо, всё по центру по вертикали.
   PatternFly раскладывает masthead через grid; на мобильном шаблон «съезжает» —
   принудительно переводим в flex с предсказуемым порядком. ---- */
.pf-v5-c-masthead {
    display: flex !important;
    align-items: center !important;
    flex-wrap: nowrap !important;
    gap: 12px;
}
.pf-v5-c-masthead__toggle { flex: 0 0 auto; }
.pf-v5-c-masthead__main {
    flex: 0 1 auto;
    min-width: 0;
    display: flex;
    align-items: center;
    overflow: hidden;
}
.pf-v5-c-masthead__content {
    flex: 0 0 auto;
    margin-left: auto !important;
    display: flex;
    align-items: center;
}
.pf-v5-c-masthead__content .pf-v5-c-toolbar,
.pf-v5-c-masthead__content .pf-v5-c-toolbar__content,
.pf-v5-c-masthead__content .pf-v5-c-toolbar__content-section {
    flex-wrap: nowrap !important;
    align-items: center !important;
    padding: 0 !important;
    background: transparent !important;
}

/* ---- меню пользователя (имя + выход): чистая кнопка без коробки и жёсткой синей обводки ---- */
.pf-v5-c-masthead .pf-v5-c-menu-toggle,
.pf-v5-c-masthead .pf-v5-c-dropdown__toggle {
    background: transparent !important;
    border: none !important;
    box-shadow: none !important;
    border-radius: 8px !important;
    padding: 6px 10px !important;
    transition: background-color .15s ease;
}
/* PatternFly рисует рамку кнопки псевдоэлементом ::before — гасим и его */
.pf-v5-c-masthead .pf-v5-c-menu-toggle::before,
.pf-v5-c-masthead .pf-v5-c-dropdown__toggle::before { border: none !important; }
.pf-v5-c-masthead .pf-v5-c-menu-toggle:focus,
.pf-v5-c-masthead .pf-v5-c-menu-toggle.pf-m-expanded,
.pf-v5-c-masthead .pf-v5-c-dropdown__toggle:focus,
.pf-v5-c-masthead .pf-v5-c-dropdown__toggle.pf-m-expanded {
    box-shadow: none !important;
    outline: none !important;
}
/* фокус с клавиатуры — мягкая фиолетовая обводка вместо жёсткой синей коробки */
.pf-v5-c-masthead .pf-v5-c-menu-toggle:focus-visible,
.pf-v5-c-masthead .pf-v5-c-dropdown__toggle:focus-visible {
    outline: 2px solid rgba(74, 74, 255, 0.45) !important;
    outline-offset: 2px;
}

/* ===================== ТОЛЬКО СВЕТЛАЯ ===================== */
/* ВАЖНО: базовый шаблон ставит <meta color-scheme="light dark">, и на тёмном
   устройстве браузер красит текст без явного цвета белым (подписи полей исчезали).
   Принудительно фиксируем схему под фактическую тему. */
html:not(.pf-v5-theme-dark) { color-scheme: light; }
html:not(.pf-v5-theme-dark) body {
    background: linear-gradient(180deg, #f7f7ff 0%, #f1f1fc 100%) !important;
}
/* верхняя панель — светлая */
html:not(.pf-v5-theme-dark) .pf-v5-c-masthead {
    background-color: #ffffff !important;
    border-bottom: 1px solid #ececf6;
    box-shadow: 0 1px 6px rgba(74, 74, 255, 0.05);
}
html:not(.pf-v5-theme-dark) .pf-v5-c-masthead .pf-v5-c-button,
html:not(.pf-v5-theme-dark) .pf-v5-c-masthead__toggle .pf-v5-c-button { color: #4a4aff !important; }
/* тулбар по умолчанию тёмный — гасим в светлой */
html:not(.pf-v5-theme-dark) .pf-v5-c-masthead .pf-v5-c-toolbar,
html:not(.pf-v5-theme-dark) .pf-v5-c-masthead .pf-v5-c-toolbar__content,
html:not(.pf-v5-theme-dark) .pf-v5-c-masthead .pf-v5-c-toolbar__item { background-color: transparent !important; }
html:not(.pf-v5-theme-dark) .pf-v5-c-masthead .pf-v5-c-toolbar,
html:not(.pf-v5-theme-dark) .pf-v5-c-masthead .pf-v5-c-toolbar .pf-v5-c-menu-toggle,
html:not(.pf-v5-theme-dark) .pf-v5-c-masthead .pf-v5-c-toolbar .pf-v5-c-dropdown__toggle,
html:not(.pf-v5-theme-dark) .pf-v5-c-masthead .pf-v5-c-toolbar .pf-v5-c-button,
html:not(.pf-v5-theme-dark) .pf-v5-c-masthead__content,
html:not(.pf-v5-theme-dark) .pf-v5-c-masthead__content .pf-v5-c-dropdown__toggle,
html:not(.pf-v5-theme-dark) .pf-v5-c-masthead__content .pf-v5-c-menu-toggle { color: #1c1c28 !important; }
html:not(.pf-v5-theme-dark) .pf-v5-c-masthead .pf-v5-c-menu-toggle:hover,
html:not(.pf-v5-theme-dark) .pf-v5-c-masthead .pf-v5-c-dropdown__toggle:hover { background: rgba(74, 74, 255, 0.08) !important; }
/* боковая панель — светлая */
html:not(.pf-v5-theme-dark) .pf-v5-c-page__sidebar {
    background-color: #ffffff !important;
    border-right: 1px solid #ececf6;
}
html:not(.pf-v5-theme-dark) .pf-v5-c-nav,
html:not(.pf-v5-theme-dark) .pf-v5-c-nav__list { background-color: transparent !important; }
html:not(.pf-v5-theme-dark) .pf-v5-c-nav__link { color: #52526b !important; }
html:not(.pf-v5-theme-dark) .pf-v5-c-nav__link:hover,
html:not(.pf-v5-theme-dark) .pf-v5-c-nav__link:focus,
html:not(.pf-v5-theme-dark) .pf-v5-c-nav__link:focus-visible {
    background-color: #f5f5ff !important;
    color: #4a4aff !important;
}
html:not(.pf-v5-theme-dark) .pf-v5-c-nav__link.pf-m-current {
    background-color: #f0f0ff !important;
    color: #4a4aff !important;
    font-weight: 600;
    box-shadow: inset 3px 0 0 #4a4aff;
}
html:not(.pf-v5-theme-dark) .pf-v5-c-title,
html:not(.pf-v5-theme-dark) .pf-v5-c-content h1,
html:not(.pf-v5-theme-dark) .pf-v5-c-content h2 { color: #1c1c28; }
html:not(.pf-v5-theme-dark) .pf-v5-c-button.pf-m-primary { background-color: #4a4aff !important; }
html:not(.pf-v5-theme-dark) .pf-v5-c-button.pf-m-primary:hover { background-color: #3a3ae0 !important; }
html:not(.pf-v5-theme-dark) .pf-v5-c-button.pf-m-link { color: #4a4aff !important; }
html:not(.pf-v5-theme-dark) .pf-v5-c-card {
    border: 1px solid #ececf6;
    box-shadow: 0 4px 20px rgba(74, 74, 255, 0.06);
}

/* ===================== ТОЛЬКО ТЁМНАЯ ===================== */
html.pf-v5-theme-dark { color-scheme: dark; }
/* фон — как на входе */
html.pf-v5-theme-dark body {
    background: linear-gradient(180deg, #0e0e1a 0%, #14142a 100%) !important;
}
/* тулбар шапки по умолчанию почти чёрный (rgb 3,3,3) — гасим, чтобы был фон шапки #16162c */
html.pf-v5-theme-dark .pf-v5-c-masthead .pf-v5-c-toolbar,
html.pf-v5-theme-dark .pf-v5-c-masthead .pf-v5-c-toolbar__content,
html.pf-v5-theme-dark .pf-v5-c-masthead .pf-v5-c-toolbar__item {
    background-color: transparent !important;
}
/* меню пользователя в шапке — прозрачное (не коробка), светлый текст, мягкий ховер */
html.pf-v5-theme-dark .pf-v5-c-masthead .pf-v5-c-menu-toggle,
html.pf-v5-theme-dark .pf-v5-c-masthead .pf-v5-c-dropdown__toggle {
    background-color: transparent !important;
    border-color: transparent !important;
    color: #e2e2f2 !important;
}
html.pf-v5-theme-dark .pf-v5-c-masthead .pf-v5-c-menu-toggle:hover,
html.pf-v5-theme-dark .pf-v5-c-masthead .pf-v5-c-dropdown__toggle:hover { background-color: rgba(122, 122, 255, 0.14) !important; }

/* поля ввода и дропдауны: заметно светлее фона (#232340), яркий текст, видимая граница —
   иначе на тёмном фоне сливались в «чёрные блоки» и были нечитаемы */
html.pf-v5-theme-dark .pf-v5-c-form-control,
html.pf-v5-theme-dark input.pf-v5-c-form-control,
html.pf-v5-theme-dark .pf-v5-c-form-control input,
html.pf-v5-theme-dark .pf-v5-c-form-control__text-input,
html.pf-v5-theme-dark .pf-v5-c-page__main .pf-v5-c-menu-toggle {
    background-color: #232340 !important;
    color: #f0f0f8 !important;
    border-color: #3a3a5e !important;
}
html.pf-v5-theme-dark .pf-v5-c-form-control::placeholder { color: #8a8ab0 !important; }
/* строки-списки (пароль, 2FA) — единая фиолетово-тёмная поверхность вместо сероватой #1b1d21 */
html.pf-v5-theme-dark .pf-v5-c-data-list__item {
    background-color: #1a1a30 !important;
    border-color: #2a2a44 !important;
}
html.pf-v5-theme-dark .pf-v5-c-data-list { border-color: #2a2a44 !important; }
/* выпадающие меню (список языков) */
html.pf-v5-theme-dark .pf-v5-c-menu,
html.pf-v5-theme-dark .pf-v5-c-menu__content {
    background-color: #1a1a30 !important;
    border: 1px solid #2a2a44;
}
html.pf-v5-theme-dark .pf-v5-c-menu__list-item .pf-v5-c-menu__item { color: #d8d8ec !important; }
html.pf-v5-theme-dark .pf-v5-c-menu__item:hover { background-color: rgba(122, 122, 255, 0.14) !important; }
/* верхняя панель и боковая — тёмные поверхности с фиолетовой границей */
html.pf-v5-theme-dark .pf-v5-c-masthead {
    background-color: #16162c !important;
    border-bottom: 1px solid #2a2a44;
    box-shadow: 0 1px 8px rgba(0, 0, 0, 0.4);
}
html.pf-v5-theme-dark .pf-v5-c-page__sidebar {
    background-color: #16162c !important;
    border-right: 1px solid #2a2a44;
}
html.pf-v5-theme-dark .pf-v5-c-nav,
html.pf-v5-theme-dark .pf-v5-c-nav__list { background-color: transparent !important; }
/* пункты меню */
html.pf-v5-theme-dark .pf-v5-c-nav__link { color: #b8b8ce !important; }
html.pf-v5-theme-dark .pf-v5-c-nav__link:hover,
html.pf-v5-theme-dark .pf-v5-c-nav__link:focus,
html.pf-v5-theme-dark .pf-v5-c-nav__link:focus-visible {
    background-color: rgba(122, 122, 255, 0.12) !important;
    color: #cfcfff !important;
}
html.pf-v5-theme-dark .pf-v5-c-nav__link.pf-m-current {
    background-color: rgba(122, 122, 255, 0.16) !important;
    color: #cfcfff !important;
    font-weight: 600;
    box-shadow: inset 3px 0 0 #7a7aff;
}
/* заголовки и ссылки */
html.pf-v5-theme-dark .pf-v5-c-title,
html.pf-v5-theme-dark .pf-v5-c-content h1,
html.pf-v5-theme-dark .pf-v5-c-content h2 { color: #ececf7; }
html.pf-v5-theme-dark .pf-v5-c-button.pf-m-link,
html.pf-v5-theme-dark .pf-v5-c-masthead .pf-v5-c-button { color: #9a9aff !important; }
/* кнопка — чуть ярче на тёмном */
html.pf-v5-theme-dark .pf-v5-c-button.pf-m-primary { background-color: #5a5aff !important; }
html.pf-v5-theme-dark .pf-v5-c-button.pf-m-primary:hover {
    background-color: #6d6dff !important;
    box-shadow: 0 8px 22px rgba(122, 122, 255, 0.4);
}
/* карточки — тёмные поверхности */
html.pf-v5-theme-dark .pf-v5-c-card {
    background-color: #1a1a30 !important;
    border: 1px solid #2a2a44;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.4);
}

/* ===================== ПЕРЕКЛЮЧАТЕЛЬ ТЕМЫ (строка внизу ЛЕВОГО бокового меню) ===================== */
#tis-theme-toggle {
    display: flex;
    align-items: center;
    gap: 12px;
    width: 100%;
    box-sizing: border-box;
    padding: 14px 16px;
    margin-top: 8px;
    border: none;
    border-top: 1px solid #ececf6;
    background: transparent;
    cursor: pointer;
    color: #52526b;
    font-family: inherit;
    font-size: 15px;
    text-align: left;
    transition: background-color 0.15s ease, color 0.15s ease;
}
#tis-theme-toggle:hover { background: #f5f5ff; color: #4a4aff; }
#tis-theme-toggle .tis-tt-icon { display: inline-flex; flex: 0 0 auto; }
#tis-theme-toggle svg { width: 18px; height: 18px; }
#tis-theme-toggle .tis-sun  { display: none; }
#tis-theme-toggle .tis-moon { display: block; }
html.pf-v5-theme-dark #tis-theme-toggle { color: #b8b8ce; border-top-color: #2a2a44; }
html.pf-v5-theme-dark #tis-theme-toggle:hover { background: rgba(122, 122, 255, 0.12); color: #cfcfff; }
html.pf-v5-theme-dark #tis-theme-toggle .tis-sun  { display: block; }
html.pf-v5-theme-dark #tis-theme-toggle .tis-moon { display: none; }

/* ===================== МОБИЛЬНАЯ ВЕРХНЯЯ ПАНЕЛЬ ===================== */
/* Раскладку (один ряд, контент вправо) задаёт общий flex-блок выше.
   Здесь только компактный масштаб под узкий экран. */
@media (max-width: 768px) {
    .pf-v5-c-masthead { gap: 8px; padding-left: 10px !important; padding-right: 10px !important; }
    /* логотип уже, чтобы поместиться рядом с гамбургером и меню пользователя */
    .pf-v5-c-brand,
    .pf-v5-c-masthead__brand img,
    img.pf-v5-c-brand { height: 28px !important; }
    /* меню пользователя компактнее */
    .pf-v5-c-masthead .pf-v5-c-menu-toggle,
    .pf-v5-c-masthead .pf-v5-c-dropdown__toggle { padding: 6px !important; }
}