/* ============================================================================
   РАЦИН-портал — тема Orchid «Графит + Янтарь»
   Источник дизайна: docs/40-ui/portal_main_maket.zip (k27-mock, схема GRAPHITE).
   Накладывается поверх precompiled-ассетов Orchid 14 (Bootstrap 5) как
   override-стиль. Подключается через resources/views/vendor/platform/header.blade.php
   (@push('head')). Сборка не требуется — обычный статический CSS.

   Это также seed дизайн-токенов набора ps-ui-orchid (docs/40-ui/spec-ps-ui-orchid-primitives.md):
   токены ниже (--rp-*) — единый источник цветов/радиусов/шрифта для будущих
   компонентов Sandbox.
   Раунд: F · f1 (Фаза 5 Этап 5.2). Палитра вынута из brand.jsx + GRAPHITE-схемы макета.
   ========================================================================= */

/* ---- 1. Дизайн-токены (палитра «Графит + Янтарь») ------------------------- */
:root {
    /* поверхности */
    --rp-bg:            #EFEEEA;  /* фон рабочей области */
    --rp-card:          #FFFFFF;  /* карточки / поля */
    --rp-line:          #E5E4E0;  /* границы */
    --rp-line-2:        #F4F3F0;  /* мягкая граница / зебра */

    /* текст */
    --rp-ink:           #23262B;  /* основной текст / заголовки */
    --rp-sub:           #5E646C;  /* вторичный текст */
    --rp-faint:         #99A0A8;  /* третичный / подсказки */

    /* графит (primary) */
    --rp-primary:       #2C2F36;
    --rp-primary-ink:   #FFFFFF;
    --rp-primary-soft:  #E9EAEC;
    --rp-primary-deep:  #1B1D22;

    /* янтарь (accent) */
    --rp-accent:        #F5B301;
    --rp-accent-deep:   #C98F00;
    --rp-accent-soft:   #FBF1D6;

    /* семантика */
    --rp-green:         #1F9D55;
    --rp-red:           #E2483D;
    --rp-blue:          #2C7BE5;

    /* сайдбар (тёмный графит) */
    --rp-sidebar:        #1F2228;
    --rp-sidebar-line:   #313640;
    --rp-sidebar-ink:    #ECEEF1;
    --rp-sidebar-sub:    #A2A9B2;
    --rp-sidebar-faint:  #6B727C;
    --rp-sidebar-active-bg:  rgba(245, 179, 1, 0.16);
    --rp-sidebar-active-ink: #F5C24A;

    /* геометрия / шрифт */
    --rp-radius:         12px;
    --rp-radius-lg:      16px;
    --rp-font: "Manrope", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
}

/* ---- 2. Глобальные переменные Bootstrap (Orchid) -------------------------- */
:root {
    --bs-body-bg:           var(--rp-bg);
    --bs-body-color:        var(--rp-ink);
    --bs-body-font-family:  var(--rp-font);
    --bs-emphasis-color:    var(--rp-ink);
    --bs-secondary-color:   var(--rp-sub);
    --bs-tertiary-color:    var(--rp-faint);
    --bs-border-color:      var(--rp-line);
    --bs-border-radius:        var(--rp-radius);
    --bs-border-radius-sm:     8px;
    --bs-border-radius-lg:     var(--rp-radius-lg);
    --bs-primary:           var(--rp-primary);
    --bs-primary-rgb:       44, 47, 54;
    --bs-link-color:        var(--rp-accent-deep);
    --bs-link-hover-color:  var(--rp-accent);
    --bs-success:           var(--rp-green);
    --bs-danger:            var(--rp-red);
    --bs-info:              var(--rp-blue);
    --bs-warning:           var(--rp-accent);
}

/* ---- 3. Типографика ------------------------------------------------------- */
body {
    font-family: var(--rp-font);
    background: var(--rp-bg);
    color: var(--rp-ink);
    -webkit-font-smoothing: antialiased;
    text-rendering: optimizeLegibility;
}

h1, h2, h3, h4, h5, h6,
.h1, .h2, .h3, .h4, .h5, .h6 {
    font-family: var(--rp-font);
    letter-spacing: -0.01em;
    color: var(--rp-ink);
}

/* в макете крупные заголовки экранов жирные (fw 800), Orchid ставит fw-light */
.workspace header h1,
h1.fw-light {
    font-weight: 800 !important;
}

/* ---- 3a. Бренд РАЦИН (wordmark с тремя золотыми штрихами вместо хвоста «Ц») */
.rp-brand {
    font-weight: 800;
    letter-spacing: -0.01em;
    line-height: 1;
    color: currentColor;
}
.rp-brand .rp-wordmark { display: inline-flex; align-items: baseline; }
.rp-brand .rp-c { position: relative; display: inline-block; }
.rp-brand .rp-stripes {
    position: absolute;
    left: 46%;
    top: 64%;
    width: 0.62em;
    height: 0.4em;
    overflow: visible;
}

/* ---- 4. Сайдбар (тёмный графит) ------------------------------------------ */
.aside {
    background: var(--rp-sidebar) !important;
    border-right: 1px solid var(--rp-sidebar-line);
    --bs-emphasis-color: #FFFFFF;
    --bs-emphasis-color-rgb: 255, 255, 255;
}

/* бренд РАЦИН белый в тёмном сайдбаре (на светлой странице логина — currentColor) */
.aside .rp-brand { color: #FFFFFF; }

/* пункты навигации */
.aside .nav-link {
    color: var(--rp-sidebar-sub);
    border-radius: 10px;
    padding: 10px 12px;
    font-weight: 600;
    transition: background 0.15s ease, color 0.15s ease;
    position: relative;
}
.aside .nav-link .orchid-icon,
.aside .nav-link svg {
    color: var(--rp-sidebar-faint);
    transition: color 0.15s ease;
}
.aside .nav-link:hover {
    background: rgba(255, 255, 255, 0.06);
    color: var(--rp-sidebar-ink);
}
.aside .nav-link:hover .orchid-icon,
.aside .nav-link:hover svg {
    color: var(--rp-sidebar-ink);
}

/* активный пункт — янтарная подсветка + золотой акцент слева */
.aside .nav-link.active,
.aside .nav-pills .nav-link.active,
.aside .nav-item.active > .nav-link {
    background: var(--rp-sidebar-active-bg) !important;
    color: var(--rp-sidebar-active-ink) !important;
    font-weight: 700;
}
.aside .nav-link.active::before {
    content: "";
    position: absolute;
    left: 0;
    top: 9px;
    bottom: 9px;
    width: 3px;
    border-radius: 3px;
    background: var(--rp-sidebar-active-ink);
}
.aside .nav-link.active .orchid-icon,
.aside .nav-link.active svg {
    color: var(--rp-sidebar-active-ink) !important;
}

/* заголовки групп меню */
.aside .nav-item small.text-muted {
    color: var(--rp-sidebar-faint) !important;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    font-size: 11px;
    font-weight: 700;
}

/* блок профиля внизу сайдбара */
.aside .profile-container {
    background: rgba(255, 255, 255, 0.04);
    border: 1px solid var(--rp-sidebar-line);
}
.aside .profile-container .text-white { color: #FFFFFF !important; }
.aside .profile-container .text-muted { color: var(--rp-sidebar-sub) !important; }

/* ---- 5. Поверхности / карточки ------------------------------------------- */
.bg-white { background-color: var(--rp-card) !important; }
.bg-light { background-color: var(--rp-line-2) !important; }

.workspace .bg-white.rounded,
.workspace .rounded.shadow-sm,
.card {
    border-radius: var(--rp-radius-lg) !important;
    border: 1px solid var(--rp-line);
    box-shadow: 0 1px 2px rgba(35, 38, 43, 0.04);
}

/* ---- 6. Кнопки ------------------------------------------------------------ */
.btn {
    font-weight: 600;
    border-radius: var(--rp-radius);
}
.btn-primary,
.btn-dark {
    --bs-btn-bg: var(--rp-primary);
    --bs-btn-border-color: var(--rp-primary);
    --bs-btn-hover-bg: var(--rp-primary-deep);
    --bs-btn-hover-border-color: var(--rp-primary-deep);
    --bs-btn-active-bg: var(--rp-primary-deep);
    --bs-btn-color: var(--rp-primary-ink);
    --bs-btn-hover-color: var(--rp-primary-ink);
}
.btn-warning {
    --bs-btn-bg: var(--rp-accent);
    --bs-btn-border-color: var(--rp-accent);
    --bs-btn-hover-bg: var(--rp-accent-deep);
    --bs-btn-hover-border-color: var(--rp-accent-deep);
    --bs-btn-color: #FFFFFF;
    --bs-btn-hover-color: #FFFFFF;
}
.btn-link { color: var(--rp-accent-deep); }

/* ---- 7. Поля ввода -------------------------------------------------------- */
.form-control,
.form-select {
    border-radius: var(--rp-radius);
    border-color: var(--rp-line);
    color: var(--rp-ink);
    font-weight: 500;
}
.form-control:focus,
.form-select:focus {
    border-color: var(--rp-accent);
    box-shadow: 0 0 0 3px rgba(245, 179, 1, 0.2);
}
.form-control::placeholder { color: var(--rp-faint); }
.form-label { font-weight: 700; color: var(--rp-ink); }

/* ---- 8. Бейджи / статусы -------------------------------------------------- */
.badge { font-weight: 600; border-radius: 999px; }
.bg-success { background-color: var(--rp-green) !important; }
.bg-danger  { background-color: var(--rp-red) !important; }
.bg-warning { background-color: var(--rp-accent) !important; color: #FFFFFF !important; }
.bg-info    { background-color: var(--rp-blue) !important; }
.text-success { color: var(--rp-green) !important; }
.text-danger  { color: var(--rp-red) !important; }
.text-warning { color: var(--rp-accent-deep) !important; }

/* ---- 9. Хлебные крошки / заголовок экрана --------------------------------- */
.breadcrumb { font-size: 13px; }
.breadcrumb-item a { color: var(--rp-sub); text-decoration: none; }
.breadcrumb-item.active { color: var(--rp-ink); font-weight: 600; }

/* золотой акцент-подчёрк под заголовком экрана (как в макете) */
.command-bar-wrapper header h1 {
    position: relative;
    padding-bottom: 10px;
}
.command-bar-wrapper header h1::after {
    content: "";
    position: absolute;
    left: 0;
    bottom: 0;
    width: 54px;
    height: 3px;
    border-radius: 2px;
    background: var(--rp-accent);
}

/* ---- 10. Таблицы ---------------------------------------------------------- */
.table { --bs-table-border-color: var(--rp-line); color: var(--rp-ink); }
.table > thead th {
    color: var(--rp-faint);
    font-weight: 700;
    font-size: 12.5px;
    text-transform: uppercase;
    letter-spacing: 0.02em;
}

/* ---- 11. Кастомный скроллбар (BR: примитив дизайн-системы) ---------------- */
* { scrollbar-width: thin; scrollbar-color: rgba(35, 38, 43, 0.22) transparent; }
::-webkit-scrollbar { width: 12px; height: 12px; }
::-webkit-scrollbar-thumb {
    background: rgba(35, 38, 43, 0.18);
    border-radius: 7px;
    border: 3px solid transparent;
    background-clip: padding-box;
}
::-webkit-scrollbar-thumb:hover { background: rgba(35, 38, 43, 0.32); background-clip: padding-box; }

/* ---- 12. Sandbox-витрина (служебные утилиты показа компонентов) ----------- */
.rp-sandbox-note {
    border: 1px dashed var(--rp-line);
    background: var(--rp-card);
    border-radius: var(--rp-radius-lg);
    padding: 32px;
    color: var(--rp-sub);
}
.rp-sandbox-note .rp-sandbox-badge {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    background: var(--rp-accent-soft);
    color: var(--rp-accent-deep);
    font-weight: 700;
    font-size: 12.5px;
    padding: 4px 11px;
    border-radius: 999px;
    margin-bottom: 14px;
}
.rp-sandbox-note h2 { font-weight: 800; margin: 0 0 8px; }

/* ---- 13. Адаптив (BR-18) -------------------------------------------------- */
@media (max-width: 991.98px) {
    .aside { border-right: none; border-bottom: 1px solid var(--rp-sidebar-line); }
    .command-bar-wrapper header h1 { font-size: 1.4rem; }
}

/* ============================================================================
   14. Экраны авторизации (Fortify-views) — макет auth_maket.zip
   Сплит-экран: брендовая графит-панель + аграрное фото слева, форма справа.
   На общих токенах --rp-* (единый набор с ps-ui-orchid / Sandbox). Раунд: F · f2.
   ========================================================================= */
.auth-root {
    min-height: 100vh;
    display: flex;
    font-family: var(--rp-font);
    color: var(--rp-ink);
    background: var(--rp-card);
}

/* — левая брендовая панель — */
.auth-brand {
    position: relative;
    width: 560px;
    flex-shrink: 0;
    overflow: hidden;
    background: var(--rp-sidebar);
}
.auth-brand__photo {
    position: absolute; inset: 0;
    background-image: var(--auth-photo, none);
    background-size: cover;
    background-position: 55% 64%;
    filter: grayscale(0.45) brightness(1.05) contrast(0.95);
}
.auth-brand__overlay {
    position: absolute; inset: 0;
    background: linear-gradient(178deg,
        var(--rp-sidebar) 0%, var(--rp-sidebar) 30%,
        rgba(31,34,40,0.9) 46%, rgba(31,34,40,0.5) 66%,
        rgba(31,34,40,0.12) 88%, rgba(31,34,40,0) 100%);
}
.auth-brand__stripe { position: absolute; top: 0; left: 0; right: 0; height: 4px; background: var(--rp-accent); }
.auth-brand__inner {
    position: relative; z-index: 1;
    height: 100%; min-height: 100vh;
    padding: 44px 52px;
    display: flex; flex-direction: column;
}
.auth-brand__logo { color: #fff; font-size: 29px; }
.auth-brand__pitch { margin-top: auto; }
.auth-brand__tag {
    display: inline-flex; align-items: center; gap: 8px;
    background: rgba(255,255,255,0.1);
    border: 1px solid rgba(255,255,255,0.18);
    border-radius: 999px; padding: 6px 13px 6px 11px;
    backdrop-filter: blur(6px); -webkit-backdrop-filter: blur(6px);
    margin-bottom: 20px;
    font-size: 12.5px; font-weight: 700; color: rgba(255,255,255,0.9);
}
.auth-brand__tag .dot { width: 7px; height: 7px; border-radius: 4px; background: var(--rp-accent); }
.auth-brand__h1 {
    font-size: 36px; line-height: 1.12; font-weight: 800; letter-spacing: -0.02em;
    margin: 0; color: #fff; max-width: 430px; text-wrap: balance;
}
.auth-brand__sub { font-size: 15.5px; line-height: 1.5; color: rgba(255,255,255,0.78); margin: 16px 0 0; max-width: 400px; }

/* — правая колонка с формой — */
.auth-col { flex: 1; min-width: 0; display: flex; flex-direction: column; max-height: 100vh; overflow-y: auto; }
.auth-support { display: flex; align-items: center; justify-content: flex-end; gap: 8px; padding: 24px 40px 0; }
.auth-support .lbl { font-size: 13px; color: var(--rp-faint); }
.auth-support .num { font-size: 13px; font-weight: 700; color: var(--rp-sub); }
.auth-form-area { flex: 1; display: flex; align-items: center; justify-content: center; padding: 32px 40px 48px; }
.auth-form-wrap { width: 408px; max-width: 100%; }

/* — заголовки формы — */
.auth-title { font-size: 27px; font-weight: 800; letter-spacing: -0.015em; margin: 0; color: var(--rp-ink); }
.auth-accent { width: 46px; height: 3px; border-radius: 2px; background: var(--rp-accent); margin: 12px 0 0; }
.auth-lead { font-size: 14.5px; color: var(--rp-sub); margin: 13px 0 24px; line-height: 1.45; }

/* — поля — */
.auth-field { margin-bottom: 16px; }
.auth-label { display: block; font-size: 13.5px; font-weight: 700; margin-bottom: 8px; color: var(--rp-ink); }
.auth-label-row { display: flex; align-items: center; justify-content: space-between; margin-bottom: 8px; }
.auth-label-row .auth-label { margin-bottom: 0; }
.auth-input-shell {
    display: flex; align-items: center; gap: 11px;
    background: var(--rp-card);
    border: 1.6px solid var(--rp-line);
    border-radius: 12px; height: 52px; padding: 0 14px;
    transition: border-color .15s, box-shadow .15s;
}
.auth-input-shell:focus-within { border-color: var(--rp-accent); box-shadow: 0 0 0 3px rgba(245,179,1,0.2); }
.auth-input-shell.is-error { border-color: var(--rp-red); box-shadow: 0 0 0 3px rgba(226,72,61,0.13); }
.auth-input-shell.is-ok { border-color: var(--rp-green); box-shadow: 0 0 0 3px rgba(31,157,85,0.1); }
.auth-input {
    flex: 1; min-width: 0; border: none; outline: none; background: transparent;
    font-family: var(--rp-font); font-size: 15.5px; font-weight: 500; color: var(--rp-ink);
}
.auth-input::placeholder { color: var(--rp-faint); }
.auth-field-icon { color: var(--rp-faint); flex-shrink: 0; }
.is-error .auth-field-icon { color: var(--rp-red); }
.is-ok .auth-field-icon { color: var(--rp-green); }
.auth-eye { display: flex; background: none; border: none; cursor: pointer; padding: 2px; color: var(--rp-faint); }
.auth-hint { margin-top: 7px; font-size: 12.5px; color: var(--rp-faint); }
.auth-ok-hint { margin-top: 7px; font-size: 12.5px; font-weight: 600; color: var(--rp-green); display: flex; align-items: center; gap: 6px; }
.auth-error { display: flex; align-items: center; gap: 6px; margin-top: 7px; font-size: 12.5px; font-weight: 600; color: var(--rp-red); }
.auth-error-icon { flex-shrink: 0; }

/* — индикатор парольной политики — */
.auth-pwd-policy { display: flex; flex-wrap: wrap; gap: 7px 14px; margin: -6px 0 16px; }
.auth-pwd-policy .chk { display: inline-flex; align-items: center; gap: 5px; font-size: 12px; font-weight: 600; color: var(--rp-faint); }
.auth-pwd-policy .chk .box { width: 14px; height: 14px; border-radius: 7px; border: 1.5px solid var(--rp-line); display: flex; align-items: center; justify-content: center; }
.auth-pwd-policy .chk.on { color: var(--rp-green); }
.auth-pwd-policy .chk.on .box { background: var(--rp-green); border-color: var(--rp-green); color: #fff; }

/* — капча (визуальный плейсхолдер; серверная сверка — за B) — */
.auth-captcha { margin-bottom: 16px; }
.auth-captcha__row { display: flex; gap: 10px; }
.auth-captcha__img {
    width: 132px; height: 52px; border-radius: 12px; flex-shrink: 0;
    background: repeating-linear-gradient(135deg, #EDEBE5 0 6px, #F6F5F1 6px 12px);
    border: 1.6px solid var(--rp-line);
    display: flex; align-items: center; justify-content: center; overflow: hidden;
    position: relative; user-select: none;
}
.auth-captcha__img .ch {
    display: inline-block; font-family: "JetBrains Mono", ui-monospace, monospace;
    font-size: 25px; font-weight: 700; color: var(--rp-ink); opacity: 0.82;
}
.auth-captcha__refresh {
    width: 52px; height: 52px; border-radius: 12px; flex-shrink: 0;
    border: 1.6px solid var(--rp-line); background: var(--rp-card); cursor: pointer; color: var(--rp-sub);
    display: flex; align-items: center; justify-content: center;
}
.auth-captcha__input { flex: 1; }
.auth-captcha__input input { font-family: "JetBrains Mono", ui-monospace, monospace; font-weight: 700; letter-spacing: 0.15em; text-transform: uppercase; }

/* — кнопки / ссылки — */
.auth-btn {
    width: 100%; height: 54px; margin-top: 6px;
    display: flex; align-items: center; justify-content: center; gap: 9px;
    background: var(--rp-primary); color: var(--rp-primary-ink);
    border: none; border-radius: 13px;
    font-family: var(--rp-font); font-size: 16px; font-weight: 800; cursor: pointer;
    transition: background .15s;
}
.auth-btn:hover { background: var(--rp-primary-deep); }
.auth-btn:disabled { background: var(--rp-line); color: var(--rp-faint); cursor: not-allowed; }
.auth-btn--ghost { background: var(--rp-card); color: var(--rp-ink); border: 1.6px solid var(--rp-line); }
.auth-btn--ghost:hover { background: var(--rp-line-2); }
.auth-link { color: var(--rp-accent-deep); font-weight: 600; text-decoration: none; }
.auth-link:hover { color: var(--rp-accent); }
.auth-foot { font-size: 14px; color: var(--rp-sub); text-align: center; margin: 22px 0 0; }
.auth-foot a { color: var(--rp-accent-deep); font-weight: 700; text-decoration: none; }
.auth-back { display: inline-flex; align-items: center; gap: 7px; background: none; border: none; color: var(--rp-sub); font-family: var(--rp-font); font-size: 13.5px; font-weight: 700; cursor: pointer; padding: 0; margin-bottom: 20px; text-decoration: none; }

/* — баннеры/состояния — */
.auth-banner { display: flex; gap: 11px; align-items: flex-start; border-radius: 12px; padding: 12px 14px; margin-bottom: 18px; }
.auth-banner.ok  { background: rgba(31,157,85,0.08); border: 1px solid rgba(31,157,85,0.28); }
.auth-banner.err { background: rgba(226,72,61,0.08); border: 1px solid rgba(226,72,61,0.28); }
.auth-banner.info{ background: rgba(245,179,1,0.09); border: 1px solid rgba(245,179,1,0.3); }
.auth-banner .ico-ok  { color: var(--rp-green); flex-shrink: 0; }
.auth-banner .ico-err { color: var(--rp-red); flex-shrink: 0; }
.auth-banner .ico-info{ color: var(--rp-accent-deep); flex-shrink: 0; }
.auth-banner .ttl { font-size: 13.5px; font-weight: 700; color: var(--rp-ink); margin-bottom: 2px; }
.auth-banner .txt { font-size: 13px; color: var(--rp-sub); line-height: 1.45; }
.auth-centered { text-align: center; }
.auth-centered__icon { width: 64px; height: 64px; border-radius: 32px; display: flex; align-items: center; justify-content: center; margin: 0 auto 20px; }
.auth-centered__icon.ok  { background: rgba(31,157,85,0.12); color: var(--rp-green); }
.auth-centered__icon.err { background: rgba(226,72,61,0.12); color: var(--rp-red); }
.auth-centered h2 { font-size: 24px; font-weight: 800; letter-spacing: -0.01em; margin: 0 0 10px; }
.auth-centered p { font-size: 14.5px; color: var(--rp-sub); line-height: 1.5; margin: 0 auto 24px; max-width: 360px; }
.auth-centered__actions { display: flex; flex-direction: column; gap: 10px; }

/* — адаптив (BR-18): на узких экранах брендовая панель скрывается — */
@media (max-width: 880px) {
    .auth-brand { display: none; }
    .auth-col { max-height: none; }
    .auth-support { padding: 16px 20px 0; }
    .auth-form-area { padding: 24px 20px 40px; }
}

/* ============================================================================
   15. Набор компонентов ps-ui-orchid (Sandbox-витрина)
   Источник: docs/40-ui/portal_main_maket.zip (wizard-*.jsx) + spec-ps-ui-orchid-primitives.md.
   Переиспользуемая коллекция на токенах --rp-*. Раунд: F · f3 (ЦР-75).
   Используется Blade-компонентами resources/views/components/ps/* и витриной Sandbox.
   ========================================================================= */

/* — витрина: каркас секций — */
.ps-toolbar { position: sticky; top: 0; z-index: 5; display: flex; flex-wrap: wrap; gap: 8px; padding: 12px 0 16px; background: var(--rp-bg); margin-bottom: 8px; }
.ps-toolbar a { font-size: 13px; font-weight: 600; color: var(--rp-sub); text-decoration: none; padding: 6px 11px; border-radius: 8px; border: 1px solid var(--rp-line); background: var(--rp-card); }
.ps-toolbar a:hover { border-color: var(--rp-accent-deep); color: var(--rp-accent-deep); }
.ps-section { background: var(--rp-card); border: 1px solid var(--rp-line); border-radius: var(--rp-radius-lg); padding: 22px 24px; margin-bottom: 18px; scroll-margin-top: 16px; }
.ps-section > h2 { font-size: 18px; font-weight: 800; margin: 0 0 4px; color: var(--rp-ink); }
.ps-section > .ps-section__sub { font-size: 13px; color: var(--rp-faint); margin: 0 0 18px; }
.ps-group { margin-bottom: 22px; }
.ps-group:last-child { margin-bottom: 0; }
.ps-group__label { font-size: 11px; font-weight: 700; letter-spacing: 0.05em; text-transform: uppercase; color: var(--rp-faint); margin-bottom: 10px; }
.ps-row { display: flex; flex-wrap: wrap; align-items: center; gap: 12px; }
.ps-col { display: flex; flex-direction: column; gap: 14px; max-width: 380px; }
.ps-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); gap: 16px; }

/* — кнопки — */
.ps-btn {
    display: inline-flex; align-items: center; justify-content: center; gap: 8px;
    height: 44px; padding: 0 18px; border-radius: var(--rp-radius);
    font-family: var(--rp-font); font-size: 14.5px; font-weight: 700;
    border: 1.5px solid transparent; cursor: pointer; white-space: nowrap;
    transition: background .15s, border-color .15s, filter .12s, transform .06s, box-shadow .15s;
    user-select: none; text-decoration: none;
}
.ps-btn:active { transform: translateY(1px); }
.ps-btn--primary { background: var(--rp-primary); color: var(--rp-primary-ink); }
.ps-btn--primary:hover { background: var(--rp-primary-deep); }
.ps-btn--secondary { background: var(--rp-card); color: var(--rp-ink); border-color: var(--rp-line); }
.ps-btn--secondary:hover { background: var(--rp-line-2); border-color: var(--rp-faint); }
.ps-btn--accent { background: var(--rp-accent); color: #fff; }
.ps-btn--accent:hover { background: var(--rp-accent-deep); }
.ps-btn--danger { background: transparent; color: var(--rp-red); border-color: rgba(226,72,61,0.45); }
.ps-btn--danger:hover { background: rgba(226,72,61,0.08); }
.ps-btn--ghost { background: transparent; color: var(--rp-sub); border-color: transparent; }
.ps-btn--ghost:hover { background: var(--rp-line-2); color: var(--rp-ink); }
.ps-btn--sm { height: 36px; padding: 0 13px; font-size: 13px; border-radius: 9px; }
.ps-btn--lg { height: 52px; padding: 0 24px; font-size: 16px; border-radius: 13px; }
.ps-btn--icon { width: 44px; padding: 0; }
.ps-btn--icon.ps-btn--sm { width: 36px; }
.ps-btn:disabled, .ps-btn.is-disabled { background: var(--rp-line); color: var(--rp-faint); border-color: transparent; cursor: not-allowed; transform: none; }
.ps-btn.is-loading { color: transparent !important; position: relative; pointer-events: none; }
.ps-btn.is-loading::after {
    content: ""; position: absolute; width: 17px; height: 17px; border-radius: 50%;
    border: 2.5px solid currentColor; border-top-color: transparent;
    color: var(--rp-primary-ink); animation: ps-spin .6s linear infinite;
}
.ps-btn--secondary.is-loading::after, .ps-btn--danger.is-loading::after, .ps-btn--ghost.is-loading::after { color: var(--rp-sub); }
@keyframes ps-spin { to { transform: rotate(360deg); } }

/* — поля ввода — */
.ps-field { display: flex; flex-direction: column; }
.ps-field__label { font-size: 13.5px; font-weight: 700; color: var(--rp-ink); margin-bottom: 7px; }
.ps-field__label .req { color: var(--rp-red); margin-left: 3px; }
.ps-input-shell {
    display: flex; align-items: center; gap: 11px;
    background: var(--rp-card); border: 1.6px solid var(--rp-line);
    border-radius: var(--rp-radius); height: 50px; padding: 0 14px;
    transition: border-color .15s, box-shadow .15s;
}
.ps-input-shell:focus-within { border-color: var(--rp-accent); box-shadow: 0 0 0 3px rgba(245,179,1,0.2); }
.ps-input-shell.is-error { border-color: var(--rp-red); box-shadow: 0 0 0 3px rgba(226,72,61,0.13); }
.ps-input-shell.is-ok { border-color: var(--rp-green); box-shadow: 0 0 0 3px rgba(31,157,85,0.1); }
.ps-input-shell.is-disabled { background: var(--rp-line-2); border-color: var(--rp-line); cursor: not-allowed; opacity: .75; }
.ps-input { flex: 1; min-width: 0; border: none; outline: none; background: transparent; font-family: var(--rp-font); font-size: 15px; font-weight: 500; color: var(--rp-ink); }
.ps-input::placeholder { color: var(--rp-faint); }
.ps-input:disabled { cursor: not-allowed; }
.ps-field__icon { color: var(--rp-faint); flex-shrink: 0; }
.is-error .ps-field__icon { color: var(--rp-red); }
.is-ok .ps-field__icon { color: var(--rp-green); }
.ps-field__hint { margin-top: 7px; font-size: 12.5px; color: var(--rp-faint); }
.ps-field__error { display: flex; align-items: center; gap: 6px; margin-top: 7px; font-size: 12.5px; font-weight: 600; color: var(--rp-red); }
.ps-field__ico-btn { display: flex; background: none; border: none; cursor: pointer; padding: 2px; color: var(--rp-faint); }

/* — селекты (нативный, стилизованный) — */
.ps-select-shell { position: relative; }
.ps-select { appearance: none; -webkit-appearance: none; width: 100%; height: 50px; padding: 0 40px 0 14px; border: 1.6px solid var(--rp-line); border-radius: var(--rp-radius); background: var(--rp-card); font-family: var(--rp-font); font-size: 15px; font-weight: 500; color: var(--rp-ink); cursor: pointer; }
.ps-select:focus { outline: none; border-color: var(--rp-accent); box-shadow: 0 0 0 3px rgba(245,179,1,0.2); }
.ps-select-shell::after { content: ""; position: absolute; right: 16px; top: 50%; width: 9px; height: 9px; border-right: 2px solid var(--rp-faint); border-bottom: 2px solid var(--rp-faint); transform: translateY(-70%) rotate(45deg); pointer-events: none; }

/* — поисковый select (BR-3.2: поиск по нескольким полям) — */
.ps-combo { position: relative; }
.ps-combo__menu { position: absolute; top: calc(100% + 6px); left: 0; right: 0; z-index: 20; background: var(--rp-card); border: 1px solid var(--rp-line); border-radius: 12px; box-shadow: 0 16px 44px rgba(35,38,43,0.14); padding: 6px; max-height: 280px; overflow-y: auto; display: none; }
.ps-combo.is-open .ps-combo__menu { display: block; }
.ps-combo__opt { display: flex; align-items: center; gap: 11px; width: 100%; text-align: left; border: none; background: transparent; border-radius: 9px; padding: 9px 11px; cursor: pointer; font-family: var(--rp-font); }
.ps-combo__opt:hover, .ps-combo__opt.is-active { background: var(--rp-accent-soft); }
.ps-combo__opt .t { font-size: 14px; font-weight: 700; color: var(--rp-ink); }
.ps-combo__opt .s { font-size: 12.5px; color: var(--rp-sub); }
.ps-combo__opt .av { width: 36px; height: 36px; border-radius: 9px; background: var(--rp-accent-soft); color: var(--rp-accent-deep); display: flex; align-items: center; justify-content: center; flex-shrink: 0; }
.ps-combo__empty { padding: 14px; text-align: center; font-size: 13px; color: var(--rp-faint); }

/* — чекбокс / радио / switch — */
.ps-check { display: inline-flex; align-items: center; gap: 10px; cursor: pointer; font-size: 14px; color: var(--rp-ink); user-select: none; }
.ps-check input { position: absolute; opacity: 0; width: 0; height: 0; }
.ps-check__box { width: 20px; height: 20px; border-radius: 6px; border: 1.8px solid var(--rp-line); background: var(--rp-card); display: flex; align-items: center; justify-content: center; flex-shrink: 0; transition: background .15s, border-color .15s; color: #fff; }
.ps-check__box svg { opacity: 0; transition: opacity .12s; }
.ps-check input:checked + .ps-check__box { background: var(--rp-primary); border-color: var(--rp-primary); }
.ps-check input:checked + .ps-check__box svg { opacity: 1; }
.ps-check input:focus-visible + .ps-check__box { box-shadow: 0 0 0 3px rgba(245,179,1,0.25); }
.ps-check--radio .ps-check__box { border-radius: 50%; }
.ps-check--radio input:checked + .ps-check__box { background: var(--rp-card); border-color: var(--rp-primary); }
.ps-check--radio .ps-check__box::after { content: ""; width: 10px; height: 10px; border-radius: 50%; background: var(--rp-primary); opacity: 0; transition: opacity .12s; }
.ps-check--radio input:checked + .ps-check__box::after { opacity: 1; }
.ps-check input:disabled + .ps-check__box { background: var(--rp-line-2); border-color: var(--rp-line); }
.ps-check.is-disabled { color: var(--rp-faint); cursor: not-allowed; }

.ps-switch { display: inline-flex; align-items: center; gap: 10px; cursor: pointer; font-size: 14px; color: var(--rp-ink); user-select: none; }
.ps-switch input { position: absolute; opacity: 0; width: 0; height: 0; }
.ps-switch__track { width: 42px; height: 24px; border-radius: 999px; background: var(--rp-line); position: relative; transition: background .18s; flex-shrink: 0; }
.ps-switch__track::after { content: ""; position: absolute; top: 3px; left: 3px; width: 18px; height: 18px; border-radius: 50%; background: #fff; box-shadow: 0 1px 3px rgba(0,0,0,.25); transition: transform .18s; }
.ps-switch input:checked + .ps-switch__track { background: var(--rp-green); }
.ps-switch input:checked + .ps-switch__track::after { transform: translateX(18px); }
.ps-switch input:focus-visible + .ps-switch__track { box-shadow: 0 0 0 3px rgba(245,179,1,0.25); }
.ps-switch input:disabled + .ps-switch__track { opacity: .5; }

/* — бейджи статусов — */
.ps-badge { display: inline-flex; align-items: center; gap: 6px; font-size: 12.5px; font-weight: 600; padding: 4px 11px 4px 9px; border-radius: 999px; line-height: 1.1; white-space: nowrap; }
.ps-badge .dot { width: 7px; height: 7px; border-radius: 4px; flex-shrink: 0; }
.ps-badge--neutral { background: var(--rp-primary-soft); color: var(--rp-sub); } .ps-badge--neutral .dot { background: var(--rp-faint); }
.ps-badge--info    { background: rgba(44,123,229,0.12); color: var(--rp-blue); } .ps-badge--info .dot { background: var(--rp-blue); }
.ps-badge--warning { background: var(--rp-accent-soft); color: var(--rp-accent-deep); } .ps-badge--warning .dot { background: var(--rp-accent); }
.ps-badge--success { background: rgba(31,157,85,0.12); color: var(--rp-green); } .ps-badge--success .dot { background: var(--rp-green); }
.ps-badge--danger  { background: rgba(226,72,61,0.12); color: var(--rp-red); } .ps-badge--danger .dot { background: var(--rp-red); }

/* — табы — */
.ps-tabs__nav { display: flex; gap: 4px; border-bottom: 1px solid var(--rp-line); margin-bottom: 16px; }
.ps-tabs__tab { background: none; border: none; padding: 10px 14px; font-family: var(--rp-font); font-size: 14px; font-weight: 600; color: var(--rp-sub); cursor: pointer; position: relative; border-bottom: 2px solid transparent; margin-bottom: -1px; }
.ps-tabs__tab:hover { color: var(--rp-ink); }
.ps-tabs__tab.is-active { color: var(--rp-ink); font-weight: 700; border-bottom-color: var(--rp-accent); }
.ps-tabs__panel { display: none; font-size: 14px; color: var(--rp-sub); line-height: 1.5; }
.ps-tabs__panel.is-active { display: block; }

/* — аккордеон — */
.ps-acc__item { border: 1px solid var(--rp-line); border-radius: var(--rp-radius); margin-bottom: 10px; overflow: hidden; }
.ps-acc__head { display: flex; align-items: center; gap: 10px; width: 100%; text-align: left; background: var(--rp-card); border: none; padding: 14px 16px; font-family: var(--rp-font); font-size: 14.5px; font-weight: 700; color: var(--rp-ink); cursor: pointer; }
.ps-acc__head .chev { margin-left: auto; transition: transform .2s; color: var(--rp-faint); }
.ps-acc__item.is-open .ps-acc__head .chev { transform: rotate(90deg); }
.ps-acc__body { display: none; padding: 0 16px 16px; font-size: 13.5px; color: var(--rp-sub); line-height: 1.55; }
.ps-acc__item.is-open .ps-acc__body { display: block; }

/* — тултип — */
.ps-tip { position: relative; display: inline-flex; }
.ps-tip::after { content: attr(data-tip); position: absolute; left: 50%; bottom: calc(100% + 8px); transform: translate(-50%, 5px); background: var(--rp-primary-deep); color: #fff; font-size: 11.5px; font-weight: 600; line-height: 1.35; padding: 6px 10px; border-radius: 8px; white-space: nowrap; opacity: 0; pointer-events: none; box-shadow: 0 8px 24px rgba(0,0,0,.3); transition: opacity .14s, transform .14s; z-index: 60; }
.ps-tip:hover::after { opacity: 1; transform: translate(-50%, 0); }

/* — тосты — */
.ps-toast-host { position: fixed; left: 50%; bottom: 28px; transform: translateX(-50%); z-index: 2000; display: flex; flex-direction: column; gap: 10px; align-items: center; }
.ps-toast { display: flex; align-items: center; gap: 10px; background: var(--rp-primary-deep); color: #fff; padding: 13px 18px; border-radius: 12px; box-shadow: 0 12px 40px rgba(0,0,0,.3); font-size: 14px; font-weight: 600; animation: ps-toast-in .25s ease; }
.ps-toast .dot { width: 8px; height: 8px; border-radius: 4px; flex-shrink: 0; }
.ps-toast--success .dot { background: var(--rp-green); } .ps-toast--error .dot { background: var(--rp-red); } .ps-toast--info .dot { background: var(--rp-accent); }
@keyframes ps-toast-in { from { opacity: 0; transform: translateY(8px); } to { opacity: 1; transform: none; } }

/* — алерт-баннеры (инлайн уведомления с семантикой) — */
.ps-alert { display: flex; gap: 11px; align-items: flex-start; border-radius: 12px; padding: 12px 14px; }
.ps-alert .ttl { font-size: 13.5px; font-weight: 700; color: var(--rp-ink); }
.ps-alert .txt { font-size: 13px; color: var(--rp-sub); line-height: 1.45; }
.ps-alert--success { background: rgba(31,157,85,0.08); border: 1px solid rgba(31,157,85,0.28); } .ps-alert--success .i { color: var(--rp-green); }
.ps-alert--error   { background: rgba(226,72,61,0.08); border: 1px solid rgba(226,72,61,0.28); } .ps-alert--error .i { color: var(--rp-red); }
.ps-alert--info    { background: rgba(245,179,1,0.09); border: 1px solid rgba(245,179,1,0.3); } .ps-alert--info .i { color: var(--rp-accent-deep); }
.ps-alert .i { flex-shrink: 0; }

/* — прогресс-бар оформления (шаги заявки, BR-3.1) — */
.ps-steps { display: flex; align-items: center; }
.ps-steps__item { display: flex; align-items: center; gap: 9px; }
.ps-steps__dot { width: 30px; height: 30px; border-radius: 50%; display: flex; align-items: center; justify-content: center; font-size: 13px; font-weight: 800; flex-shrink: 0; border: 2px solid var(--rp-line); color: var(--rp-faint); background: var(--rp-card); }
.ps-steps__item.is-done .ps-steps__dot { background: var(--rp-primary); border-color: var(--rp-primary); color: #fff; }
.ps-steps__item.is-active .ps-steps__dot { background: var(--rp-accent); border-color: var(--rp-accent); color: #fff; }
.ps-steps__label { font-size: 13px; font-weight: 600; color: var(--rp-sub); white-space: nowrap; }
.ps-steps__item.is-active .ps-steps__label { color: var(--rp-ink); font-weight: 700; }
.ps-steps__bar { flex: 1; height: 2px; background: var(--rp-line); margin: 0 12px; min-width: 24px; }
.ps-steps__item.is-done + .ps-steps__bar, .ps-steps__bar.is-filled { background: var(--rp-primary); }
.ps-progress { height: 8px; background: var(--rp-line); border-radius: 4px; overflow: hidden; }
.ps-progress__fill { height: 100%; background: var(--rp-accent); border-radius: 4px; }

/* — кастомный скроллбар (демо-бокс) — */
.ps-scrollbox { max-height: 150px; overflow-y: auto; border: 1px solid var(--rp-line); border-radius: var(--rp-radius); padding: 14px; font-size: 13.5px; color: var(--rp-sub); line-height: 1.6; }

/* — модалка / диалог — */
.ps-modal-backdrop { position: fixed; inset: 0; z-index: 1500; background: rgba(20,22,26,0.5); backdrop-filter: blur(2px); display: none; align-items: center; justify-content: center; padding: 24px; }
.ps-modal-backdrop.is-open { display: flex; }
.ps-modal { width: 460px; max-width: 100%; background: var(--rp-card); border-radius: 18px; box-shadow: 0 24px 70px rgba(0,0,0,.35); overflow: hidden; animation: ps-pop .2s cubic-bezier(.2,.8,.2,1); }
@keyframes ps-pop { from { transform: scale(.97); opacity: .6; } to { transform: none; opacity: 1; } }
.ps-modal__head { display: flex; align-items: flex-start; gap: 12px; padding: 20px 24px 0; }
.ps-modal__head h3 { margin: 0; font-size: 19px; font-weight: 800; color: var(--rp-ink); }
.ps-modal__head p { margin: 5px 0 0; font-size: 13.5px; color: var(--rp-sub); }
.ps-modal__x { margin-left: auto; width: 32px; height: 32px; border-radius: 8px; border: none; background: var(--rp-line-2); color: var(--rp-sub); cursor: pointer; font-size: 18px; line-height: 1; flex-shrink: 0; }
.ps-modal__body { padding: 18px 24px; font-size: 14px; color: var(--rp-sub); line-height: 1.5; }
.ps-modal__foot { display: flex; gap: 10px; justify-content: flex-end; padding: 16px 24px; border-top: 1px solid var(--rp-line); background: #FAFAF8; }

/* — меню / навигация (ховер-подсветка) — */
.ps-menu { background: var(--rp-card); border: 1px solid var(--rp-line); border-radius: var(--rp-radius); padding: 8px; width: 240px; }
.ps-menu__item { display: flex; align-items: center; gap: 11px; padding: 10px 12px; border-radius: 9px; font-size: 14px; font-weight: 600; color: var(--rp-sub); cursor: pointer; transition: background .12s, color .12s; }
.ps-menu__item:hover { background: var(--rp-line-2); color: var(--rp-ink); }
.ps-menu__item.is-active { background: var(--rp-accent-soft); color: var(--rp-accent-deep); }
.ps-menu__item .ico { color: var(--rp-faint); } .ps-menu__item:hover .ico, .ps-menu__item.is-active .ico { color: inherit; }

/* — аватар / блок пользователя — */
.ps-avatar { width: 40px; height: 40px; border-radius: 50%; background: var(--rp-primary); color: #fff; display: inline-flex; align-items: center; justify-content: center; font-weight: 800; font-size: 14px; flex-shrink: 0; }
.ps-avatar--sm { width: 30px; height: 30px; font-size: 12px; }
.ps-avatar--accent { background: var(--rp-accent-soft); color: var(--rp-accent-deep); }
.ps-userblock { display: inline-flex; align-items: center; gap: 11px; padding: 8px 12px; border: 1px solid var(--rp-line); border-radius: var(--rp-radius); background: var(--rp-card); }
.ps-userblock .n { font-size: 14px; font-weight: 700; color: var(--rp-ink); line-height: 1.2; }
.ps-userblock .r { font-size: 12px; color: var(--rp-faint); }

/* — date-picker: нативный input[type=date], стилизованный как поле — */
.ps-input[type="date"] { cursor: pointer; }
.ps-input[type="date"]::-webkit-calendar-picker-indicator { cursor: pointer; opacity: .55; }