/* VibeDesk — сгенерировано tools/extract_css_palettes.py; править вручную / см. docs/UI_STYLES_AND_THEMES.md */

/* VibeDesk — фиолетовый glass (DLC), акцент как на референс-скриншотах (#a855f7) */
body[data-color-palette="vibe"]{
    --vd-bg: #0b0816;
    --vd-bg-deep: #060410;
    --vd-panel: rgba(30, 20, 50, 0.72);
    --vd-panel-strong: rgba(30, 20, 50, 0.86);
    --vd-panel-soft: rgba(40, 30, 60, 0.48);
    --vd-border: rgba(168, 85, 247, 0.24);
    --vd-border-soft: rgba(168, 85, 247, 0.12);
    --vd-border-strong: rgba(168, 85, 247, 0.48);
    --vd-accent: #a855f7;
    --vd-accent-strong: #9333ea;
    --vd-accent-soft: rgba(168, 85, 247, 0.18);
    --vd-accent-soft-2: rgba(168, 85, 247, 0.34);
    --vd-accent-glow: 0 0 22px rgba(168, 85, 247, 0.38), 0 0 48px rgba(168, 85, 247, 0.14);
    --vd-chrome-bg: #120c24;
    --vd-chrome-bg-soft: #1a1333;
    --vd-chrome-flat: #251843;
    --vd-chrome-gradient-135-from: rgba(24, 16, 38, 0.94);
    --vd-chrome-gradient-135-to: rgba(18, 12, 28, 0.9);
    --vd-chrome-sidebar-glass-from: rgba(60, 79, 102, 0.72);
    --vd-chrome-sidebar-glass-to: rgba(52, 70, 93, 0.68);
    --vd-chrome-panel-180-from: rgba(60, 79, 102, 0.96);
    --vd-chrome-panel-180-to: rgba(52, 70, 93, 0.94);
    --vd-chrome-kb-head-180-from: rgba(60, 79, 102, 0.95);
    --vd-chrome-kb-head-180-to: rgba(52, 70, 93, 0.92);
    --vd-glass-card-from: rgba(30, 20, 50, 0.82);
    --vd-glass-card-to: rgba(20, 15, 35, 0.62);
    /* UI consistency — home / chat / profile (S4) */
    --vd-card-head-bg: transparent;
    --vd-card-head-fg: var(--vd-text);
    --vd-card-head-border: var(--vd-border-soft);
    --vd-stat-delta-up: #6ee7b7;
    --vd-stat-delta-dn: #fdba74;
    --zen-msg-area-bg: linear-gradient(180deg, rgba(32, 24, 52, 0.94) 0%, rgba(14, 10, 26, 0.98) 100%);
    --zen-msg-area-fg: var(--vd-text);
    --zen-msg-area-muted: var(--vd-text-muted);
    --zen-msg-composer-bg: var(--vd-panel-strong);
    --zen-msg-border: var(--vd-border);
    --zen-msg-row-active-bg: linear-gradient(90deg, rgba(168, 85, 247, 0.26) 0%, rgba(168, 85, 247, 0.1) 100%);
    --zen-msg-row-active-ring: rgba(168, 85, 247, 0.38);
    --zen-msg-panel-surface: rgba(20, 14, 34, 0.72);
    --zen-msg-panel-surface-soft: rgba(28, 20, 48, 0.55);
    --vd-profile-panel-glass-bg: rgba(30, 20, 50, 0.72);
    --vd-profile-panel-glass-border: rgba(168, 85, 247, 0.22);
    --vd-profile-tabs-bar-bg: rgba(28, 20, 48, 0.55);
    --vd-chrome-shadow-rgb: 0, 0, 0;
    --vd-chrome-text: #f5f1ff;
    --vd-chrome-text-muted: rgba(245, 241, 255, 0.65);
    --vd-chrome-text-faint: rgba(245, 241, 255, 0.42);
    --vd-chrome-border: rgba(168, 85, 247, 0.22);
    --vd-chrome-active-bg: rgba(168, 85, 247, 0.22);
    --vd-chrome-active-text: #ede9fe;
    --vd-text: #f5f1ff;
    --vd-text-strong: #ffffff;
    --vd-text-muted: rgba(245, 241, 255, 0.68);
    --vd-text-faint: rgba(245, 241, 255, 0.42);
    --vd-shadow-sm: 0 4px 12px rgba(0, 0, 0, 0.25);
    --vd-shadow-md: 0 8px 32px rgba(0, 0, 0, 0.35);
    --vd-shadow-lg: 0 18px 48px rgba(0, 0, 0, 0.45);

    --vd-chip-violet-bg: rgba(168, 85, 247, 0.16);
    --vd-chip-violet-text: #e9d5ff;
    --vd-chip-violet-border: rgba(168, 85, 247, 0.34);
    --vd-chip-blue-text: #93c5fd;
    --vd-chip-emerald-text: #6ee7b7;
    --vd-chip-orange-text: #fdba74;
    --vd-chip-red-text: #fca5a5;
    --vd-chip-yellow-text: #fde68a;
    --vd-chip-gray-text: #cbd5e1;
}

body[data-color-palette="vibe"] .vd-text-gradient{
    background: linear-gradient(135deg, #faf5ff 0%, #e879f9 38%, #a855f7 68%, #7c3aed 100%);
}

body[data-color-palette="vibe"] .vd-glow-border{
    box-shadow: 0 0 18px rgba(168, 85, 247, 0.28), inset 0 0 18px rgba(168, 85, 247, 0.08);
}

body[data-color-palette="vibe"] .zen-auth-card,
body[data-color-palette="vibe"] .zen-auth-card.tw-surface-card{
    background: linear-gradient(135deg, var(--vd-glass-card-from) 0%, var(--vd-glass-card-to) 100%) !important;
    backdrop-filter: blur(20px);
    -webkit-backdrop-filter: blur(20px);
}

body[data-color-palette="vibe"] .zen-auth-submit{
    background: linear-gradient(135deg, var(--vd-accent) 0%, var(--vd-accent-strong) 100%) !important;
    border: none !important;
    box-shadow: var(--vd-accent-glow);
}

body[data-color-palette="vibe"] ::-webkit-scrollbar-thumb{
    background: rgba(168, 85, 247, 0.42);
    background-clip: padding-box;
    border: 2px solid transparent;
}

body[data-color-palette="vibe"] ::-webkit-scrollbar-thumb:hover{
    background: rgba(168, 85, 247, 0.72);
    background-clip: padding-box;
    border: 2px solid transparent;
}

body[data-color-palette="vibe"] .dropdown-menu:not(.bg-white):not(.dropdown-menu-light){
    backdrop-filter: blur(20px);
    -webkit-backdrop-filter: blur(20px);
}

body[data-color-palette="vibe"] .zen-chat-group-scroll .list-group-item.active{
    color: var(--vd-chrome-active-text);
}

body[data-color-palette="vibe"] .main-wrapper .btn-primary{
    background: linear-gradient(135deg, var(--vd-accent) 0%, var(--vd-accent-strong) 100%);
    border: none;
    box-shadow: var(--vd-accent-glow);
}

body[data-color-palette="vibe"] .main-wrapper .btn-primary:hover{ filter: brightness(1.06); }

body[data-color-palette="vibe"] .main-wrapper .card:not(.bg-primary):not(.bg-success):not(.bg-danger):not(.bg-warning):not(.bg-info):not(.bg-dark):not(.vd-glass-card):not(.zen-auth-card),
body[data-color-palette="vibe"] .tw-surface-card{
    background: linear-gradient(135deg, rgba(30, 20, 50, 0.78) 0%, rgba(20, 15, 35, 0.62) 100%) !important;
    backdrop-filter: blur(16px);
    -webkit-backdrop-filter: blur(16px);
}

body[data-color-palette="vibe"] .main-wrapper .card-header,
body[data-color-palette="vibe"] .main-wrapper .card-footer{
    background: rgba(30, 20, 50, 0.35) !important;
}

body[data-color-palette="vibe"] .modal-content{
    background: linear-gradient(135deg, rgba(24, 16, 38, 0.94) 0%, rgba(18, 12, 28, 0.9) 100%);
}

body[data-color-palette="vibe"] .vd-home .vd-home-hero.zen-ticket-hero{
    background: linear-gradient(135deg, rgba(52, 32, 88, 0.52) 0%, rgba(16, 10, 28, 0.76) 100%) !important;
    border: 1px solid rgba(168, 85, 247, 0.28) !important;
    box-shadow: 0 10px 36px rgba(0, 0, 0, 0.42), 0 0 28px rgba(168, 85, 247, 0.12) !important;
    backdrop-filter: blur(20px);
    -webkit-backdrop-filter: blur(20px);
}

body[data-color-palette="vibe"] .vd-glass-card:not(.vd-glass-card--guest-cta){
    background: linear-gradient(135deg, rgba(42, 28, 72, 0.76) 0%, rgba(22, 14, 38, 0.66) 100%) !important;
    border-color: rgba(168, 85, 247, 0.24) !important;
    box-shadow: var(--vd-shadow-md), 0 0 22px rgba(168, 85, 247, 0.09), inset 0 1px 0 rgba(255, 255, 255, 0.06);
}

body[data-color-palette="vibe"] .vd-sla-ribbon{
    background: linear-gradient(135deg, rgba(30, 20, 50, 0.78) 0%, rgba(20, 15, 35, 0.62) 100%);
    backdrop-filter: blur(14px);
    -webkit-backdrop-filter: blur(14px);
}

body[data-color-palette="vibe"] .vd-cmdk-item-icon{
    color: #e9d5ff;
}

body[data-color-palette="vibe"] .vd-glass-card--guest-cta{
    background: linear-gradient(145deg, rgba(255, 253, 248, 0.92) 0%, rgba(248, 245, 238, 0.88) 55%, rgba(241, 248, 255, 0.86) 100%) !important;
    border: 1px solid rgba(140, 162, 187, 0.28) !important;
    backdrop-filter: blur(22px);
    -webkit-backdrop-filter: blur(22px);
    box-shadow: 0 18px 44px rgba(var(--vd-chrome-shadow-rgb), 0.12), inset 0 1px 0 rgba(255, 255, 255, 0.85) !important;
    color: #1e293b !important;
}

body[data-color-palette="vibe"] .vd-glass-card--guest-cta .vd-guest-cta-lead{
    color: rgba(51, 65, 85, 0.92) !important;
}

body[data-color-palette="vibe"] .vd-glass-card--guest-cta .vd-guest-cta-icon-wrap:not(.vd-guest-cta-icon-wrap--brand){
    width: 72px;
    height: 72px;
    border-radius: 20px;
    background: linear-gradient(135deg, #2563eb 0%, #1d4ed8 100%);
    box-shadow: 0 0 0 3px rgba(37, 99, 235, 0.15);
}

body[data-color-palette="vibe"] .vd-glass-card--guest-cta .vd-guest-cta-icon-symbol{
    color: #fff !important;
}

body[data-color-palette="vibe"] .vd-glass-card--guest-cta .vd-guest-brand-task,
body[data-color-palette="vibe"] .vd-glass-card--guest-cta .vd-guest-brand-be{
    color: #ffffff !important;
    text-shadow: 0 1px 2px rgba(15, 23, 42, 0.35), 0 2px 8px rgba(15, 23, 42, 0.18);
}

body[data-color-palette="vibe"] .vd-glass-card--guest-cta a.vd-guest-cta-login-btn.vd-accent-gradient-bg{
    background: linear-gradient(135deg, #2563eb 0%, #1d4ed8 100%) !important;
    color: #fff !important;
    box-shadow: 0 8px 22px rgba(37, 99, 235, 0.28);
}

body[data-color-palette="vibe"] .vd-glass-card--guest-cta a.vd-guest-cta-login-btn.vd-accent-gradient-bg:hover,
body[data-color-palette="vibe"] .vd-glass-card--guest-cta a.vd-guest-cta-login-btn.vd-accent-gradient-bg:focus{
    filter: brightness(1.06);
    box-shadow: 0 10px 26px rgba(37, 99, 235, 0.35);
}

body.zen-body:not(.auth-bg):not(.zen-guest)[data-color-palette="vibe"] .footer{
    background: linear-gradient(180deg, var(--vd-chrome-sidebar-glass-from) 0%, var(--vd-chrome-sidebar-glass-to) 100%) !important;
    color: rgba(237, 244, 251, 0.85) !important;
    border-top: 1px solid rgba(255, 255, 255, 0.08) !important;
    box-shadow: none !important;
}

body.zen-body:not(.auth-bg):not(.zen-guest)[data-color-palette="vibe"] .footer .vd-chip{
    border-color: rgba(255, 255, 255, 0.14) !important;
}

body.zen-body:not(.auth-bg):not(.zen-guest)[data-color-palette="vibe"] .footer .vd-chip-violet,
body.zen-body:not(.auth-bg):not(.zen-guest)[data-color-palette="vibe"] .footer .vd-chip-blue{
    background: rgba(255, 255, 255, 0.1) !important;
    color: #edf4fb !important;
    border-color: rgba(255, 255, 255, 0.18) !important;
}

/* --- VibeDesk: убрать «чёрный» Bootstrap-текст на тёмных поверхностях --- */

body[data-color-palette="vibe"] .main-wrapper .text-dark,
body[data-color-palette="vibe"] .main-wrapper .text-body{
    color: var(--vd-text-muted) !important;
}

body[data-color-palette="vibe"] .main-wrapper .card .card-title,
body[data-color-palette="vibe"] .main-wrapper .card-title,
body[data-color-palette="vibe"] .main-wrapper h1:not(.vd-text-gradient):not(.vd-feed-title),
body[data-color-palette="vibe"] .main-wrapper h2:not(.vd-text-gradient),
body[data-color-palette="vibe"] .main-wrapper h3:not(.vd-text-gradient),
body[data-color-palette="vibe"] .main-wrapper h4:not(.vd-text-gradient),
body[data-color-palette="vibe"] .main-wrapper h5:not(.vd-text-gradient),
body[data-color-palette="vibe"] .main-wrapper .h1:not(.vd-text-gradient):not(.vd-feed-title),
body[data-color-palette="vibe"] .main-wrapper .h2:not(.vd-text-gradient),
body[data-color-palette="vibe"] .main-wrapper .h3:not(.vd-text-gradient),
body[data-color-palette="vibe"] .main-wrapper .h4:not(.vd-text-gradient),
body[data-color-palette="vibe"] .main-wrapper .h5:not(.vd-text-gradient){
    color: var(--vd-text-strong) !important;
}

/* Feed: светлый header — тёмный заголовок (перебивает общий h1 → white) */
body[data-color-palette="vibe"] .main-wrapper .vd-feed-header h1.vd-feed-title,
body[data-color-palette="vibe"] .main-wrapper .vd-feed-header h1 {
    color: #0f172a !important;
}

body[data-color-palette="vibe"] .main-wrapper .table,
body[data-color-palette="vibe"] .main-wrapper .table td,
body[data-color-palette="vibe"] .main-wrapper .table th{
    color: var(--vd-text) !important;
}

body[data-color-palette="vibe"] .main-wrapper .table-striped > tbody > tr:nth-of-type(odd) > *{
    color: var(--vd-text) !important;
}

body[data-color-palette="vibe"] .vd-kb-root-head{
    background: linear-gradient(135deg, rgba(168, 85, 247, 0.28), rgba(59, 130, 246, 0.12));
    color: var(--vd-text-strong);
    border-bottom-color: var(--vd-border) !important;
}

body[data-color-palette="vibe"] .vd-kb-sidebar{
    background: rgba(0, 0, 0, 0.2);
}

body[data-color-palette="vibe"] .vd-kb-modal-head{
    background: rgba(15, 23, 42, 0.55);
    color: var(--vd-text-strong);
}

body[data-color-palette="vibe"] .vd-kb-modal-head .vd-kb-modal-close{
    filter: invert(1) grayscale(100%) brightness(1.8);
    opacity: 0.85;
}

body[data-color-palette="vibe"] .vd-kb-details-sidebar-head{
    background: rgba(0, 0, 0, 0.22);
}

body[data-color-palette="vibe"] .vd-kb-details-main-head{
    background: rgba(0, 0, 0, 0.18);
}

body.zen-body[data-color-palette="vibe"] .vd-btn-primary{
    border-radius: 0.85rem;
}

/* Таблицы заявок — тёмные строки, не белые */

body[data-color-palette="vibe"] .main-wrapper .zen-data-table{
    --bs-table-bg: transparent;
    --bs-table-color: var(--vd-text);
    --bs-table-border-color: var(--vd-border);
    --bs-table-striped-bg: rgba(255, 255, 255, 0.04);
    --bs-table-hover-bg: var(--vd-accent-soft);
    --bs-table-hover-color: var(--vd-text-strong);
}

body[data-color-palette="vibe"] .main-wrapper .zen-data-table thead th{
    background: rgba(30, 20, 50, 0.72) !important;
    color: rgba(245, 241, 255, 0.82) !important;
    border-color: var(--vd-border) !important;
}

body[data-color-palette="vibe"] .main-wrapper .zen-data-table tbody td,
body[data-color-palette="vibe"] .main-wrapper .zen-data-table tbody th{
    background-color: rgba(30, 20, 50, 0.38) !important;
    color: var(--vd-text) !important;
    border-color: var(--vd-border) !important;
}

body[data-color-palette="vibe"] .main-wrapper .zen-data-table.table-hover > tbody > tr:hover > *{
    background-color: var(--vd-accent-soft) !important;
    color: var(--vd-text-strong) !important;
}

body[data-color-palette="vibe"] .main-wrapper .tw-surface-card .card-body{
    color: var(--vd-text) !important;
}

body[data-color-palette="vibe"] .main-wrapper .tw-surface-card .text-body,
body[data-color-palette="vibe"] .main-wrapper .tw-surface-card .text-dark{
    color: var(--vd-text) !important;
}

/* База знаний — glass внутри */

body[data-color-palette="vibe"] .vd-kb-main{
    background: linear-gradient(180deg, rgba(30, 20, 50, 0.55) 0%, rgba(18, 12, 28, 0.48) 100%) !important;
    backdrop-filter: blur(16px) saturate(1.08);
    -webkit-backdrop-filter: blur(16px) saturate(1.08);
    color: var(--vd-text-strong) !important;
}

body[data-color-palette="vibe"] .vd-kb-main .vd-kb-welcome-title,
body[data-color-palette="vibe"] .vd-kb-main h1,
body[data-color-palette="vibe"] .vd-kb-main h2,
body[data-color-palette="vibe"] .vd-kb-main h3{
    color: var(--vd-text-strong) !important;
}

body[data-color-palette="vibe"] .vd-kb-main .vd-kb-welcome-lead,
body[data-color-palette="vibe"] .vd-kb-main .text-muted{
    color: var(--vd-text-muted) !important;
}

body[data-color-palette="vibe"] .vd-kb-article-card{
    background: linear-gradient(145deg, rgba(42, 28, 72, 0.72) 0%, rgba(22, 14, 38, 0.62) 100%) !important;
    border-color: rgba(168, 85, 247, 0.28) !important;
    color: var(--vd-text) !important;
}

body[data-color-palette="vibe"] .vd-kb-article-card .btn-outline-primary{
    border-color: rgba(168, 85, 247, 0.45) !important;
    color: #e9d5ff !important;
    background: rgba(168, 85, 247, 0.18) !important;
}

/* Формы: file input */

body[data-color-palette="vibe"] .main-wrapper .form-control[type="file"]{
    color: var(--vd-text-muted) !important;
    background: rgba(30, 20, 50, 0.55) !important;
    border-color: var(--vd-border-strong) !important;
}

body[data-color-palette="vibe"] .main-wrapper .form-control[type="file"]::file-selector-button{
    background: linear-gradient(135deg, var(--vd-accent) 0%, var(--vd-accent-strong) 100%) !important;
    color: #ffffff !important;
    border: none !important;
    border-radius: 0.45rem;
    margin-right: 0.65rem;
    padding: 0.35rem 0.85rem;
    font-weight: 600;
}

/* --- scoped isolation (auto-split) --- */

body[data-color-palette="vibe"] .modal-content .btn-close{
    filter: invert(1) grayscale(100%) brightness(200%);
}

/* --- messenger theme tokens (from vd-messenger-theme.css) --- */

body.zen-body[data-color-palette="vibe"]{
    --zen-msg-area-bg: linear-gradient(180deg, rgba(32, 24, 52, 0.94) 0%, rgba(14, 10, 26, 0.98) 100%);
    --zen-msg-area-fg: var(--vd-text);
    --zen-msg-area-muted: var(--vd-text-muted);
    --zen-msg-area-empty-icon: var(--vd-accent);
    --zen-msg-panel-surface: rgba(20, 14, 34, 0.72);
    --zen-msg-panel-surface-soft: rgba(28, 20, 48, 0.55);
    --zen-msg-composer-bg: var(--vd-panel-strong);
    --zen-msg-border: var(--vd-border);
    --zen-msg-head-search-bg: rgba(255, 255, 255, 0.12);
    --zen-msg-head-search-fg: var(--vd-chrome-text);
    --zen-msg-head-search-muted: var(--vd-chrome-text-muted);
    --zen-msg-head-badge-bg: rgba(255, 255, 255, 0.16);
    --zen-msg-head-badge-fg: var(--vd-chrome-text);
    --zen-msg-row-active-bg: linear-gradient(90deg, rgba(168, 85, 247, 0.26) 0%, rgba(168, 85, 247, 0.10) 100%);
    --zen-msg-row-active-ring: rgba(168, 85, 247, 0.38);
    --zen-msg-wallpaper-office:
        radial-gradient(circle at 1px 1px, rgba(168, 85, 247, 0.08) 1px, transparent 0),
        var(--zen-msg-area-bg);
    --zen-msg-wallpaper-paper:
        radial-gradient(circle at 1px 1px, rgba(168, 85, 247, 0.10) 1px, transparent 0),
        linear-gradient(180deg, rgba(36, 28, 48, 0.92) 0%, rgba(18, 12, 28, 0.97) 100%);
    --zen-msg-wallpaper-telegram:
        radial-gradient(circle at 10px 10px, rgba(59, 130, 246, 0.14) 1px, transparent 0),
        radial-gradient(circle at 1px 1px, rgba(168, 85, 247, 0.10) 1px, transparent 0),
        linear-gradient(180deg, rgba(22, 32, 56, 0.94) 0%, rgba(14, 10, 28, 0.98) 100%);
    --zen-msg-wallpaper-doodle-violet-base: linear-gradient(180deg, #2e1065 0%, #1e1b4b 55%, #0f0a1a 100%);
    --zen-msg-wallpaper-doodle-blue-base: linear-gradient(180deg, #1e293b 0%, #312e81 100%);
    --zen-msg-wallpaper-doodle-mint-base: linear-gradient(180deg, #134e4a 0%, #1e1b4b 100%);
    --zen-msg-tg-bubble-mine-fg: #ecfdf5;
    --zen-msg-tg-bubble-other-bg: var(--vd-panel-strong);
    --zen-msg-tg-bubble-other-fg: var(--vd-text);
}

body.zen-body[data-color-palette="vibe"] .zen-messenger-bubbles--telegram .zen-messenger-bubble-mine{
    color: var(--zen-msg-tg-bubble-mine-fg) !important;
}

body.zen-body[data-color-palette="vibe"] .zen-messenger-bubbles--telegram .zen-messenger-bubble-other{
    background: var(--zen-msg-tg-bubble-other-bg) !important;
    color: var(--zen-msg-tg-bubble-other-fg) !important;
    border-color: var(--zen-msg-border) !important;
}

body.zen-body[data-color-palette="vibe"] .zen-messenger-msg-area .btn-outline-secondary{
    color: var(--zen-msg-area-fg) !important;
    border-color: var(--zen-msg-border) !important;
    background: transparent !important;
}

body.zen-body[data-color-palette="vibe"] .zen-messenger-msg-area .btn-outline-secondary:hover{
    background: var(--zen-msg-panel-surface-soft) !important;
}