/* Вынесено из site.css (Important C, фаза D / PLAN_css_refactor_v2.md):
   палитро-агностичные «корпоративные» плашки через --vd-chrome-*.
   .vd-chrome-surface — основной API; .bg-unified — legacy-имя той же плашки
   (используется в KB-head и Calendar header). Никаких дублей с vd-shell.css. */
/* ========== Corporate: площадки «как сайдбар» + заголовки-витрины ========== */
.vd-chrome-surface {
    background: var(--vd-chrome-bg) !important;
    color: var(--vd-chrome-text) !important;
    border-color: var(--vd-chrome-border) !important;
}
.card-header.vd-chrome-surface {
    background: linear-gradient(180deg, var(--vd-chrome-bg-soft) 0%, var(--vd-chrome-bg) 100%) !important;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.07);
}
.vd-chrome-surface .text-muted {
    color: var(--vd-chrome-text-muted) !important;
}
.vd-chrome-surface .bi.text-primary {
    color: var(--vd-chrome-active-text) !important;
}
.vd-chrome-surface .badge.bg-primary-subtle {
    background: rgba(255, 255, 255, 0.12) !important;
    color: var(--vd-chrome-active-text) !important;
    border: 1px solid rgba(255, 255, 255, 0.2);
}
.vd-chrome-surface .btn-outline-secondary {
    color: #fff !important;
    border-color: rgba(255, 255, 255, 0.55) !important;
    background: rgba(255, 255, 255, 0.06) !important;
}
.vd-chrome-surface .btn-outline-secondary:hover {
    background: rgba(255, 255, 255, 0.14) !important;
    border-color: #fff !important;
    color: #fff !important;
}
.vd-chrome-surface .form-control,
.vd-chrome-surface .form-select {
    border-color: rgba(255, 255, 255, 0.25);
}
.bg-unified {
    background: var(--vd-chrome-flat) !important;
    background-color: var(--vd-chrome-flat) !important;
    color: #ffffff !important;
    border-color: rgba(255, 255, 255, 0.2) !important;
}
.bg-unified .text-muted {
    color: rgba(255, 255, 255, 0.82) !important;
}
.bg-unified a {
    color: #ffffff !important;
}
.bg-unified .badge.bg-primary-subtle {
    background: rgba(255, 255, 255, 0.12) !important;
    color: #ffffff !important;
    border: 1px solid rgba(255, 255, 255, 0.2) !important;
}
.bg-unified .btn-outline-secondary {
    color: #fff !important;
    border-color: rgba(255, 255, 255, 0.55) !important;
    background: rgba(255, 255, 255, 0.06) !important;
}
.bg-unified .btn-outline-secondary:hover {
    background: rgba(255, 255, 255, 0.14) !important;
    border-color: #fff !important;
    color: #fff !important;
}
.bg-unified .btn-outline-light {
    color: #fff !important;
    border-color: rgba(255, 255, 255, 0.55) !important;
    background: rgba(255, 255, 255, 0.06) !important;
}
.bg-unified .btn-outline-light:hover {
    background: rgba(255, 255, 255, 0.16) !important;
    border-color: #fff !important;
    color: #fff !important;
}
body[data-color-palette] .vd-kb-root-head.bg-unified {
    background: var(--vd-chrome-flat) !important;
    background-color: var(--vd-chrome-flat) !important;
    border-bottom-color: rgba(255, 255, 255, 0.2) !important;
}
body[data-color-palette] #calendar-container > .card-header.bg-unified {
    background: var(--vd-chrome-flat) !important;
    background-color: var(--vd-chrome-flat) !important;
    border-bottom-color: rgba(255, 255, 255, 0.2) !important;
}
