/* UI surfaces contract — docs/PLAN_UI_CONSISTENCY.md (Sprint S0) */

/* Panel chrome: мессенджер, календарь (стили в messenger.css / calendar.css).
   Алиас: .zen-chat-panel-head = .vd-panel-chrome-head */
.vd-panel-chrome-head {
    color: var(--vd-chrome-text, #f8fafc);
}

/* Заголовок секции внутри vd-glass-card (профиль, дашборд, модалки) */
.vd-card-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.75rem;
    flex-wrap: wrap;
    padding: 1rem 1.25rem 0.75rem;
    margin: 0;
    background: var(--vd-card-head-bg, transparent);
    border: none;
    border-bottom: 1px solid var(--vd-card-head-border, var(--vd-border-soft));
    color: var(--vd-card-head-fg, var(--vd-text));
}

.vd-card-head--subtle {
    border-bottom-color: transparent;
    padding-bottom: 0.5rem;
}

.vd-card-head-title,
.vd-card-head .vd-card-head-title {
    margin: 0;
    font-size: 1.05rem;
    font-weight: 700;
    line-height: 1.3;
    color: inherit;
}

.vd-card-head-actions {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    flex-shrink: 0;
}

.vd-glass-card > .vd-card-head:first-child,
.vd-glass-card > .card-header.vd-card-head:first-child {
    border-top-left-radius: var(--vd-radius-lg);
    border-top-right-radius: var(--vd-radius-lg);
}

.vd-card-body {
    padding: 1.25rem;
}

.vd-glass-card > .vd-card-body:last-child,
.vd-glass-card > .card-body.vd-card-body:last-child {
    border-bottom-left-radius: var(--vd-radius-lg);
    border-bottom-right-radius: var(--vd-radius-lg);
}

/* Bootstrap card-header внутри glass — выравнивание с контрактом */
.vd-glass-card > .card-header.vd-card-head {
    background: var(--vd-card-head-bg, transparent) !important;
    border-color: var(--vd-card-head-border, var(--vd-border-soft)) !important;
    color: var(--vd-card-head-fg, var(--vd-text)) !important;
}

/* S4: заголовки секций на тёмных glass-карточках — не наследуют chrome-белый */
body[data-color-palette="dark"] .vd-glass-card > .card-header.vd-card-head,
body[data-color-palette="vibe"] .vd-glass-card > .card-header.vd-card-head,
body[data-color-palette="dark"] .vd-glass-card > .vd-card-head,
body[data-color-palette="vibe"] .vd-glass-card > .vd-card-head {
    color: var(--vd-card-head-fg, var(--vd-text)) !important;
}

body[data-color-palette="dark"] .vd-glass-card .vd-card-head-title,
body[data-color-palette="vibe"] .vd-glass-card .vd-card-head-title {
    color: inherit !important;
}

/* S4: метрики главной на glass — читаемый текст */
body[data-color-palette="dark"] .vd-home .vd-stat-card.vd-glass-card,
body[data-color-palette="vibe"] .vd-home .vd-stat-card.vd-glass-card {
    color: var(--vd-text);
}

/* QA-006: единые токены контраста для tw-surface-card на всех палитрах */
body.zen-body .main-wrapper .tw-surface-card:not(.vd-glass-card) {
    background: linear-gradient(135deg, var(--vd-glass-card-from, var(--vd-panel)) 0%, var(--vd-glass-card-to, var(--vd-panel)) 100%) !important;
    color: var(--vd-text) !important;
    border-color: var(--vd-border-soft, var(--vd-border)) !important;
}

body.zen-body .main-wrapper .tw-surface-card .text-muted,
body.zen-body .main-wrapper .tw-surface-card .form-text {
    color: var(--vd-text-muted) !important;
}

body.zen-body .main-wrapper .tw-surface-card .card-header:not([class*="bg-"]):not(.zen-chat-panel-head):not(.vd-kb-root-head) {
    color: var(--vd-card-head-fg, var(--vd-text)) !important;
    background: var(--vd-card-head-bg, transparent) !important;
    border-color: var(--vd-border-soft, var(--vd-border)) !important;
}

/* Только тело карточки — не шапка chrome (иначе .text-dark / h* остаются чёрными на navy). */
body.zen-body .main-wrapper .tw-surface-card > .card-body .card-title,
body.zen-body .main-wrapper .tw-surface-card > .card-body h1,
body.zen-body .main-wrapper .tw-surface-card > .card-body h2,
body.zen-body .main-wrapper .tw-surface-card > .card-body h3,
body.zen-body .main-wrapper .tw-surface-card > .card-body h4,
body.zen-body .main-wrapper .tw-surface-card > .card-body h5 {
    color: var(--vd-text-strong, var(--vd-text));
}

/* Chrome / тёмная шапка: Bootstrap .text-dark не должен бить белый контраст. */
body.zen-body .main-wrapper .card > .card-header:not(.bg-transparent):not(.bg-white):not(.bg-light):not(.bg-body) .text-dark,
body.zen-body .main-wrapper .card > .card-header:not(.bg-transparent):not(.bg-white):not(.bg-light):not(.bg-body) .fw-bold.text-dark,
body.zen-body .main-wrapper .tw-surface-card > .card-header:not(.bg-transparent):not(.bg-white):not(.bg-light):not(.bg-body) .text-dark,
body.zen-body .main-wrapper .tw-surface-card > .card-header:not(.bg-transparent):not(.bg-white):not(.bg-light):not(.bg-body) .fw-bold.text-dark {
    color: inherit !important;
}

/* Активный nav на тёмном chrome: светлый текст; на светлом фоне — тёмный. */
body.zen-body .vd-nav-link.active {
    color: var(--vd-chrome-active-text, #f8fafc) !important;
}
body.zen-body .vd-topbar .nav-link.active,
body.zen-body .vd-topbar .nav-pills .nav-link.active {
    color: var(--vd-chrome-active-text, #f8fafc) !important;
}
