/**
 * MONO.CSS — QR SBP: мягкая графитовая тема.
 * Подключается последним и перекрывает жёстко заданные цвета старой темы.
 * Акцент — приглушённый стальной, статусы — десатурированные.
 */

/* Текстовый логотип */
.header-logo-text {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    height: 34px;
    padding: 0 12px;
    border: 1px solid var(--border-light);
    border-radius: 8px;
    font-family: var(--font-family);
    font-size: 15px;
    font-weight: 800;
    letter-spacing: 0.14em;
    color: var(--text-primary);
    background: transparent;
    text-transform: uppercase;
    white-space: nowrap;
}

.header-logo-text:hover { border-color: var(--accent-primary); }

/* Кнопки */
.btn-primary,
[class*="btn-primary"] {
    background: var(--accent-primary) !important;
    color: var(--accent-contrast) !important;
    border: 1px solid var(--accent-primary) !important;
    box-shadow: none !important;
    background-image: none !important;
}

.btn-primary:hover,
[class*="btn-primary"]:hover {
    background: var(--accent-secondary) !important;
    border-color: var(--accent-secondary) !important;
}

.btn-secondary,
.btn-outline,
[class*="btn-secondary"],
[class*="btn-outline"] {
    background: transparent !important;
    color: var(--text-primary) !important;
    border: 1px solid var(--border-light) !important;
    box-shadow: none !important;
    background-image: none !important;
}

.btn-secondary:hover,
.btn-outline:hover {
    border-color: var(--accent-primary) !important;
    color: var(--accent-secondary) !important;
}

/* Ссылки и фокус */
a { color: var(--accent-secondary); }
a:hover { color: var(--accent-primary); text-decoration-color: currentColor; }

:focus-visible,
input:focus,
select:focus,
textarea:focus {
    outline: none;
    border-color: var(--accent-primary) !important;
    box-shadow: 0 0 0 2px rgba(127, 157, 179, 0.22) !important;
}

/* Поля ввода */
input,
select,
textarea {
    background: var(--bg-input) !important;
    color: var(--text-primary) !important;
    border: 1px solid var(--border-color) !important;
}

/* Иконки/плашки, которые были цветными */
[class*="history-icon"] {
    background: rgba(127, 157, 179, 0.16) !important;
    color: var(--accent-secondary) !important;
    background-image: none !important;
}

[class*="operator-shop-kpi"] {
    color: var(--accent-secondary) !important;
    border-color: rgba(var(--ui-contrast-rgb), 0.18) !important;
    background: rgba(var(--ui-contrast-rgb), 0.06) !important;
}

/* Статусы: мягкая цветовая кодировка */
[class*="status-badge"] {
    background: rgba(var(--ui-contrast-rgb), 0.10) !important;
    color: var(--text-primary) !important;
    border: 1px solid rgba(var(--ui-contrast-rgb), 0.28) !important;
}

.status-paid,
.status-approved,
.status-confirmed {
    background: rgba(122, 168, 137, 0.16) !important;
    border-color: rgba(122, 168, 137, 0.45) !important;
    color: var(--success) !important;
}

.status-pending,
.status-processing {
    background: rgba(196, 160, 106, 0.16) !important;
    border-color: rgba(196, 160, 106, 0.45) !important;
    color: var(--warning) !important;
}

.status-failed,
.status-canceled,
.status-expired,
.status-blocked {
    background: rgba(192, 138, 140, 0.16) !important;
    border-color: rgba(192, 138, 140, 0.45) !important;
    color: var(--error) !important;
}

/* Баннеры проверки/валидации */
[class*="validation-banner"] {
    background: rgba(var(--ui-contrast-rgb), 0.06) !important;
    border: 1px solid rgba(var(--ui-contrast-rgb), 0.18) !important;
    color: var(--text-primary) !important;
}

[class*="validation-banner--success"] {
    border-color: rgba(122, 168, 137, 0.45) !important;
    background: rgba(122, 168, 137, 0.10) !important;
}

[class*="validation-banner--warning"] {
    border-color: rgba(196, 160, 106, 0.45) !important;
    background: rgba(196, 160, 106, 0.10) !important;
}

[class*="validation-banner--error"] {
    border-color: rgba(192, 138, 140, 0.45) !important;
    background: rgba(192, 138, 140, 0.10) !important;
}

/* Тосты */
[class*="toast-success"] { border-color: rgba(122, 168, 137, 0.5) !important; }
[class*="toast-error"] { border-color: rgba(192, 138, 140, 0.5) !important; }

.toast-icon,
[class*="toast-icon"] {
    background: rgba(var(--ui-contrast-rgb), 0.14) !important;
    color: var(--text-primary) !important;
}

/* Активный пункт меню / табы */
.drawer-item[aria-current="true"],
.drawer-item.is-active,
.drawer-item.active,
[class*="drawer-item"][aria-current="true"] {
    background: rgba(127, 157, 179, 0.18) !important;
    color: var(--accent-secondary) !important;
}

/* Бейджи, чипы, «пилюли» */
[class*="badge"],
[class*="chip"],
[class*="pill"] {
    background: rgba(var(--ui-contrast-rgb), 0.08) !important;
    color: var(--text-secondary) !important;
    border-color: rgba(var(--ui-contrast-rgb), 0.2) !important;
}

/* Ползунки/переключатели */
input[type="checkbox"],
input[type="radio"],
input[type="range"] { accent-color: var(--accent-primary) !important; }

/* Карточки — тонкие нейтральные рамки */
[class*="operator-shop-card"],
[class*="operator-action-card"] {
    background: var(--bg-card) !important;
    border: 1px solid var(--border-color) !important;
    box-shadow: none !important;
    border-radius: var(--radius-lg) !important;
}

[class*="operator-shop-card"]:hover,
[class*="operator-action-card"]:hover {
    border-color: var(--border-light) !important;
}

/* Таблицы */
table th { color: var(--text-secondary) !important; }
table td, table th { border-color: var(--border-color) !important; }

/* ============================================================
   Публичные страницы (вход / регистрация / KYC):
   карточка по центру и не растягивается на весь экран.
   ============================================================ */
.auth-page .app { min-height: 100vh; }

.auth-page .main {
    display: flex;
    justify-content: center;
    align-items: flex-start;
    padding: 32px 16px 56px;
}

.auth-page .screen {
    width: 100%;
    max-width: 440px;
}

.auth-page .card {
    width: 100%;
    background: var(--bg-card) !important;
    border: 1px solid var(--border-color) !important;
}

.auth-page .screen-title {
    font-size: 20px;
    margin-bottom: 14px;
}

.auth-page .form-group { margin-bottom: 14px; }

.auth-page .form-group input {
    width: 100%;
    padding: 12px 14px;
    border-radius: 10px;
    font-size: 15px;
}

.auth-page .btn-full { padding: 12px 16px; font-size: 15px; }

.auth-page .theme-row { margin-top: 14px; }

.auth-page .header { justify-content: flex-start; }

@media (max-width: 520px) {
    .auth-page .main { padding: 16px 12px 40px; }
    .auth-page .screen { max-width: 100%; }
    .auth-page .card { padding: 16px; }
}

/* Светлая тема: не «слепнуть» на белом */
html[data-theme="light"] .header,
body[data-theme="light"] .header { border-bottom-color: var(--border-color); }

html[data-theme="light"] .toast,
body[data-theme="light"] .toast {
    background: var(--bg-card) !important;
    border: 1px solid var(--border-color) !important;
}

/* Всё, что залито акцентом, получает контрастный (тёмный/белый) текст */
.lang-switch-btn.active,
.drawer-item-badge,
.home-action-btn.primary,
.profile-avatar {
    background: var(--accent-primary) !important;
    background-image: none !important;
    color: var(--accent-contrast) !important;
    box-shadow: none !important;
}

.lang-switch-btn.active:hover { opacity: 0.92; }
