/* ==========================================================================
   Тема resspb · консоль аккаунта Keycloak (account) — поверх keycloak.v3
   Keycloak 26.7.0, account-консоль v3 (React SPA, PatternFly 5).
   Подключается последним: index.ftl рендерит entryStyles SPA раньше
   themeResources.styles (styles.resspb=css/styles.css), поэтому правила
   ниже перекрывают дефолты PatternFly (включая :where(:root)-токены).

   Дизайн: единый бренд с login-темой resspb — графит #141619 (шапка,
   сайдбар, загрузочный экран) + светлые поверхности #f4f5f7/#ffffff,
   оранжевый акцент #ea5621 (кнопки/фокус/активные состояния),
   ссылки #cc4514 (AA 4.74:1), Montserrat (self-hosted, 12 woff2).

   ДОМ v3 (сверено с jar keycloak-account-ui 26.7.0):
     .pf-v5-c-page
       header.pf-v5-c-masthead
         .pf-v5-c-masthead__toggle   (гамбургер)
         .pf-v5-c-masthead__brand > img  (логотип, alt=${msg("logo")})
         .pf-v5-c-masthead__content  (ссылка «назад в приложение», меню,
                                      аватар)
       .pf-v5-c-page__sidebar > .pf-v5-c-nav > .pf-v5-c-nav__list
         .pf-v5-c-nav__item > a.pf-v5-c-nav__link.pf-m-current
       .pf-v5-c-page__main#kc-main-content-page-container (скролл-контейнер)
         .pf-v5-c-page__main-section
           .pf-v5-c-grid (контент md:8 + правый рельс jump-links md:4)
             .pf-v5-c-card._panel_1cdve_1 > .kc-form-panel__header/.kc-form-panel__body
             .pf-v5-c-jump-links (оглавление раздела, sticky)
   Кастомные классы консоли: .kc-main-content-page-container (id),
   .kc-form-panel__header, .kc-form-panel__body, ._title_180i0_2 (h1 раздела),
   ._sticky_1cdve_5 (sticky-рельс), .keycloak__loading-container (загрузка).
   ========================================================================== */

:root {
  /* --- Бренд-токены (канон mail/admin resspb, как в login-теме) --- */
  --rs-ink: #141619;
  --rs-ink-soft: #1b1b1b;
  --rs-surface-dark: #232527;
  --rs-accent: #ea5621;
  --rs-accent-hover: #d64a15;
  --rs-accent-soft: #ff7a3d;
  --rs-accent-text: #cc4514;        /* ссылки на светлом, AA 4.74:1 */
  --rs-accent-text-hover: #b93a10;
  --rs-maroon: #90463e;
  --rs-text: #3d3f43;
  --rs-text-strong: #141619;
  --rs-muted: #6c6d74;
  --rs-subtle: #9a9ca1;
  --rs-border: #e5e5e7;
  --rs-border-input: #d4d5d8;
  --rs-border-card: #e0e1e3;
  --rs-error: #E44E56;
  --rs-error-strong: #c52e3e;
  --rs-radius: 6px;
  --rs-radius-card: 16px;
  --rs-font: "Montserrat", "Segoe UI", system-ui, -apple-system, sans-serif;

  /* --- Консоль аккаунта --- */
  --rs-page-bg: #141619;            /* фон загрузочного экрана */
  --rs-surface-page: #f4f5f7;       /* фон контентной области (канон admin --page) */
  --rs-surface-sidebar: #1b1b1b;    /* сайдбар (графит, ступень от шапки) */
  --rs-masthead-bg: #141619;        /* шапка */
  --rs-link-on-dark: #ff7a3d;       /* ссылки на тёмном (шапка), ~5:1 на #141619 */
  --rs-link-on-dark-hover: #ff9466;
  --rs-card-radius: 12px;
  --rs-focus-ring: 0 0 0 3px rgba(234, 86, 33, 0.16);
  --rs-error-ring: 0 0 0 3px rgba(228, 78, 86, 0.14);

  /* --- Мост в PatternFly 5: переопределяем глобальные токены PF5.
     :where(:root) в PF5 имеет нулевую специфичность — наш :root,
     загруженный последним, перекрывает дефолты (#06c -> #ea5621 и т.д.) --- */
  --pf-v5-global--primary-color--100: #ea5621;        /* кнопки/активные */
  --pf-v5-global--primary-color--200: #d64a15;        /* hover */
  --pf-v5-global--primary-color--300: #b93a10;        /* active/click */
  --pf-v5-global--primary-color--dark-100: #ea5621;   /* primary внутри тёмных зон (masthead) */
  --pf-v5-global--primary-color--light-100: #ea5621;  /* светлая ветка (для тёмных зон PF5) */
  --pf-v5-global--active-color--100: #ea5621;         /* фокус-подчёркивания, табы */
  --pf-v5-global--link--Color: #cc4514;
  --pf-v5-global--link--Color--hover: #b93a10;
  --pf-v5-global--link--Color--visited: #cc4514;
  --pf-v5-global--link--Color--light: #ff7a3d;        /* ссылки на тёмном (masthead) */
  --pf-v5-global--link--Color--light--hover: #ff9466;
  --pf-v5-global--Color--100: #141619;                /* основной текст */
  --pf-v5-global--Color--200: #6c6d74;                /* вторичный текст */
  --pf-v5-global--BackgroundColor--light-300: #f4f5f7; /* фон страницы/секций */
  --pf-v5-global--BorderColor--100: #e5e5e7;          /* рамки/разделители */
  --pf-v5-global--FontFamily--heading: var(--rs-font);
  --pf-v5-global--FontFamily--text: var(--rs-font);

  color-scheme: light;
}

/* ==========================================================================
   Montserrat, self-hosted — latin + cyrillic + cyrillic-ext, веса 300/400/500/600
   (12 файлов; имена и unicode-range сверены с rupochta/resspb-theme.css
   и специей 02; те же файлы, что в login-теме resspb)
   ========================================================================== */
@font-face { font-family:'Montserrat'; font-style:normal; font-weight:300; font-display:swap;
  src:url('../fonts/montserrat-300-montserrat-88e65f67.woff2') format('woff2');
  unicode-range:U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F; } /* cyrillic-ext */
@font-face { font-family:'Montserrat'; font-style:normal; font-weight:300; font-display:swap;
  src:url('../fonts/montserrat-300-montserrat-0f73558f.woff2') format('woff2');
  unicode-range:U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116; } /* cyrillic */
@font-face { font-family:'Montserrat'; font-style:normal; font-weight:300; font-display:swap;
  src:url('../fonts/montserrat-300-montserrat-0dc98610.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; } /* latin */
@font-face { font-family:'Montserrat'; font-style:normal; font-weight:400; font-display:swap;
  src:url('../fonts/montserrat-400-montserrat-67146b73.woff2') format('woff2');
  unicode-range:U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F; } /* cyrillic-ext */
@font-face { font-family:'Montserrat'; font-style:normal; font-weight:400; font-display:swap;
  src:url('../fonts/montserrat-400-montserrat-e081619b.woff2') format('woff2');
  unicode-range:U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116; } /* cyrillic */
@font-face { font-family:'Montserrat'; font-style:normal; font-weight:400; font-display:swap;
  src:url('../fonts/montserrat-400-montserrat-ab105b20.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; } /* latin */
@font-face { font-family:'Montserrat'; font-style:normal; font-weight:500; font-display:swap;
  src:url('../fonts/montserrat-500-montserrat-afa71617.woff2') format('woff2');
  unicode-range:U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F; } /* cyrillic-ext */
@font-face { font-family:'Montserrat'; font-style:normal; font-weight:500; font-display:swap;
  src:url('../fonts/montserrat-500-montserrat-28321cff.woff2') format('woff2');
  unicode-range:U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116; } /* cyrillic */
@font-face { font-family:'Montserrat'; font-style:normal; font-weight:500; font-display:swap;
  src:url('../fonts/montserrat-500-montserrat-552d3dce.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; } /* latin */
@font-face { font-family:'Montserrat'; font-style:normal; font-weight:600; font-display:swap;
  src:url('../fonts/montserrat-600-montserrat-f05a0e21.woff2') format('woff2');
  unicode-range:U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F; } /* cyrillic-ext */
@font-face { font-family:'Montserrat'; font-style:normal; font-weight:600; font-display:swap;
  src:url('../fonts/montserrat-600-montserrat-77cf04c9.woff2') format('woff2');
  unicode-range:U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116; } /* cyrillic */
@font-face { font-family:'Montserrat'; font-style:normal; font-weight:600; font-display:swap;
  src:url('../fonts/montserrat-600-montserrat-a77dae9d.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; } /* latin */

/* ==========================================================================
   Базовая типографика (Montserrat по всему интерфейсу; иконочные шрифты
   PF5 — pf-v5-pficon и mono — не трогаем, в отличие от login-темы:
   в SPA-консоли они реально используются)
   ========================================================================== */
html, body {
  font-family: var(--rs-font);
  color: var(--rs-text);
  -webkit-font-smoothing: antialiased;
}
:focus-visible {
  outline: 2px solid var(--rs-accent-soft);
  outline-offset: 2px;
}

/* ==========================================================================
   Загрузочный экран (index.ftl v3: .keycloak__loading-container) —
   графит + оранжевый спиннер, без правок шаблона (CSS-only)
   ========================================================================== */
.keycloak__loading-container {
  background: var(--rs-page-bg) !important;
  color: var(--rs-subtle) !important;
}
.keycloak__loading-container .pf-v5-c-spinner {
  --pf-v5-c-spinner--Color: var(--rs-accent);
}
#loading-text {
  color: var(--rs-subtle) !important;
}

/* ==========================================================================
   Шапка (masthead): графит, логотип 34px (как в login), белые иконки,
   оранжевый hover
   ========================================================================== */
.pf-v5-c-masthead {
  --pf-v5-c-masthead--BackgroundColor: var(--rs-masthead-bg);
}
.pf-v5-c-masthead__brand {
  margin-inline-end: var(--pf-v5-global--spacer--md);
}
.pf-v5-c-masthead__brand img {
  height: 34px;
  width: auto;
  display: inline-block;
  vertical-align: middle;
}
/* гамбургер и plain-кнопки шапки (меню пользователя) */
.pf-v5-c-masthead .pf-v5-c-button.pf-m-plain,
.pf-v5-c-masthead__toggle .pf-v5-c-button {
  color: #ffffff;
}
.pf-v5-c-masthead .pf-v5-c-button.pf-m-plain:hover,
.pf-v5-c-masthead__toggle .pf-v5-c-button:hover {
  color: var(--rs-accent-soft);
}
/* ссылка «назад в приложение» (masthead, тёмный контекст) */
.pf-v5-c-masthead .pf-v5-c-button.pf-m-link {
  color: var(--rs-link-on-dark);
}
.pf-v5-c-masthead .pf-v5-c-button.pf-m-link:hover {
  color: var(--rs-link-on-dark-hover);
}
/* выпадающее меню пользователя: светлая панель, читаемая на графите */
.pf-v5-c-masthead .pf-v5-c-dropdown__menu,
.pf-v5-c-masthead .pf-v5-c-menu {
  color: var(--rs-text);
}

/* ==========================================================================
   Сайдбар: графит #1b1b1b (ступень от шапки #141619), навигация v3
   (дефолт v3 — тёмный сайдбар: ссылки светлые); активный пункт —
   оранжевая подсветка
   ========================================================================== */
.pf-v5-c-page__sidebar {
  --pf-v5-c-page__sidebar--BackgroundColor: var(--rs-surface-sidebar);
}
.pf-v5-c-nav__link {
  font-weight: 500;
}
.pf-v5-c-nav__link:hover {
  --pf-v5-c-nav__link--BackgroundColor: rgba(255, 255, 255, 0.08);
}
.pf-v5-c-nav__link.pf-m-current,
.pf-v5-c-nav__link.pf-m-current:hover {
  --pf-v5-c-nav__link--m-current--BackgroundColor: rgba(234, 86, 33, 0.22);
  --pf-v5-c-nav__link--m-current--Color: #ffffff;
}

/* ==========================================================================
   Контентная область: светлая #f4f5f7 (канон admin --page), карточки
   белые с тонкой рамкой и скруглением
   ========================================================================== */
.pf-v5-c-page__main,
#kc-main-content-page-container {
  background: var(--rs-surface-page);
}
.pf-v5-c-page__main-section {
  --pf-v5-c-page__main-section--BackgroundColor: transparent;
}

/* --- Карточки разделов (формы, сессии, приложения) --- */
.pf-v5-c-card {
  border: 1px solid var(--rs-border-card);
  border-radius: var(--rs-card-radius);
  box-shadow: 0 1px 2px rgba(20, 22, 25, 0.04), 0 6px 16px rgba(20, 22, 25, 0.05);
}
.pf-v5-c-card._panel_1cdve_1 {
  margin-top: var(--pf-v5-global--spacer--lg);
}

/* --- Заголовки разделов (Title v3, класс ._title_180i0_2) --- */
._title_180i0_2,
.kc-form-panel__header .pf-v5-c-title {
  font-weight: 600;
  letter-spacing: -0.01em;
  color: var(--rs-text-strong);
}

/* ==========================================================================
   Кнопки: primary — фирменный оранжевый (#ea5621/hover #d64a15/active
   #b93a10), danger — бренд-красный, остальные — нейтральные
   ========================================================================== */
.pf-v5-c-button.pf-m-primary {
  background-color: var(--rs-accent);
  border-color: var(--rs-accent);
  color: #ffffff;
  font-weight: 600;
}
.pf-v5-c-button.pf-m-primary:hover {
  background-color: var(--rs-accent-hover);
  border-color: var(--rs-accent-hover);
}
.pf-v5-c-button.pf-m-primary:active,
.pf-v5-c-button.pf-m-primary.pf-m-active {
  background-color: var(--rs-accent-text-hover);
  border-color: var(--rs-accent-text-hover);
}
.pf-v5-c-button.pf-m-primary:focus-visible {
  outline: 2px solid var(--rs-accent-soft);
  outline-offset: 2px;
}
.pf-v5-c-button.pf-m-danger {
  background-color: var(--rs-error);
  border-color: var(--rs-error);
}
.pf-v5-c-button.pf-m-danger:hover {
  background-color: var(--rs-error-strong);
  border-color: var(--rs-error-strong);
}
/* вторичные/ссылочные кнопки: акцент на тексте, без синевы */
.pf-v5-c-button.pf-m-secondary,
.pf-v5-c-button.pf-m-link {
  color: var(--rs-accent-text);
}
.pf-v5-c-button.pf-m-secondary:hover,
.pf-v5-c-button.pf-m-link:hover {
  color: var(--rs-accent-text-hover);
}

/* ==========================================================================
   Поля форм: как в login — бордер #d4d5d8, radius 6px, оранжевый фокус,
   красная рамка ошибки; подписи — muted 600 (стиль login-темы, без капса)
   ========================================================================== */
.pf-v5-c-form__label-text {
  color: var(--rs-muted);
  font-weight: 600;
}
.pf-v5-c-form-control {
  border: 1px solid var(--rs-border-input);
  border-radius: var(--rs-radius);
  box-shadow: none;
}
.pf-v5-c-form-control:hover {
  border-color: #b4b5ba;
}
.pf-v5-c-form-control:focus-within {
  border-color: var(--rs-accent) !important;
  box-shadow: var(--rs-focus-ring) !important;
}
.pf-v5-c-form-control.pf-m-error,
.pf-v5-c-form-control.pf-m-invalid {
  border-color: var(--rs-error) !important;
  box-shadow: var(--rs-error-ring) !important;
}
.pf-v5-c-form-control input,
.pf-v5-c-form-control textarea,
.pf-v5-c-form-control select {
  font-size: 14px;
  color: var(--rs-text-strong);
}
.pf-v5-c-form-control input::placeholder,
.pf-v5-c-form-control textarea::placeholder {
  color: var(--rs-subtle);
  opacity: 1;
}
/* поиск/фильтры (text-input-group v5) */
.pf-v5-c-text-input-group {
  border: 1px solid var(--rs-border-input);
  border-radius: var(--rs-radius);
}
.pf-v5-c-text-input-group:focus-within {
  border-color: var(--rs-accent) !important;
  box-shadow: var(--rs-focus-ring) !important;
}

/* ==========================================================================
   Таблицы (сессии, приложения): светлые линии, muted-шапка, мягкий hover
   ========================================================================== */
.pf-v5-c-table {
  --pf-v5-c-table--BorderColor: var(--rs-border);
}
.pf-v5-c-table thead th {
  font-size: 12px;
  font-weight: 600;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: var(--rs-muted);
}
.pf-v5-c-table tbody > tr:hover {
  background: rgba(20, 22, 25, 0.03);
}

/* ==========================================================================
   Label/бейджи: нейтральные поверхности (не синие); status-модификаторы
   оставляем семантическими, blue-модификатор приводим к бренд-оранжевому
   ========================================================================== */
.pf-v5-c-label {
  --pf-v5-c-label--BackgroundColor: #f0f1f3;
  --pf-v5-c-label--Color: var(--rs-text);
  border-radius: var(--rs-radius);
}
.pf-v5-c-label.pf-m-blue {
  --pf-v5-c-label--BackgroundColor: rgba(234, 86, 33, 0.12);
  --pf-v5-c-label--Color: var(--rs-accent-text);
}

/* ==========================================================================
   Alerts: danger — бренд-красный акцент; остальные семантические
   ========================================================================== */
.pf-v5-c-alert.pf-m-danger {
  --pf-v5-c-alert--m-danger--BackgroundColor: rgba(228, 78, 86, 0.08);
  --pf-v5-c-alert--m-danger--BorderTopColor: var(--rs-error);
  --pf-v5-c-alert__title--m-danger--Color: var(--rs-error-strong);
}

/* ==========================================================================
   Прочее: меню/дропдауны, табы, jump-links, модалки, чекбоксы, спиннер
   ========================================================================== */
/* чекбоксы/радио — оранжевый акцент (как в login) */
.pf-v5-c-check__input,
.pf-v5-c-radio__input,
.pf-v5-c-switch__input {
  accent-color: var(--rs-accent);
}
/* активный таб — оранжевое подчёркивание (через active-color токен) */
.pf-v5-c-tabs__item.pf-m-current .pf-v5-c-tabs__link {
  font-weight: 600;
}
/* jump-links (оглавление справа) */
.pf-v5-c-jump-links__link {
  color: var(--rs-muted);
}
.pf-v5-c-jump-links__link:hover {
  color: var(--rs-accent-text);
}
.pf-v5-c-jump-links__item.pf-m-current .pf-v5-c-jump-links__link {
  color: var(--rs-accent-text);
  font-weight: 600;
}
/* спиннеры в контенте — оранжевые */
.pf-v5-c-spinner {
  --pf-v5-c-spinner--Color: var(--rs-accent);
}

/* ==========================================================================
   Адаптивность и состояния
   ========================================================================== */
@media (max-width: 768px) {
  .pf-v5-c-masthead__brand img {
    height: 28px;
  }
}

@media (prefers-reduced-motion: reduce) {
  .pf-v5-c-button,
  .pf-v5-c-form-control,
  .pf-v5-c-text-input-group,
  .pf-v5-c-nav__link,
  .pf-v5-c-card {
    transition: none !important;
  }
}