/*
 * XtraChat v0.2 theme.
 * Visual tokens match xtrachat-local-v0.2.0; layout lives in frontend/messenger-shell.css.
 */

:root {
    --xc-bg: #e9ebf1;
    --xc-bg-2: #fbfbfd;
    --xc-surface: #ffffff;
    --xc-surface-2: #f2f3f7;
    --xc-surface-3: #edf0ff;
    --xc-sidebar-surface: #ffffff;
    --xc-text: #181a22;
    --xc-text-2: #4e5363;
    --xc-text-3: #7d8292;
    --xc-border: #e7e8ee;
    --xc-border-strong: #d7d9e2;
    --xc-input: #ffffff;
    --xc-input-muted: #f2f3f7;
    --xc-primary: #536dfe;
    --xc-primary-2: #4359e8;
    --xc-primary-soft: #edf0ff;
    --xc-primary-text: #ffffff;
    --xc-success: #299270;
    --xc-success-2: #1d6f55;
    --xc-success-soft: #e7f6f1;
    --xc-warning: #e59a36;
    --xc-warning-2: #9a5d0a;
    --xc-warning-soft: #fff3df;
    --xc-danger: #e85d70;
    --xc-danger-2: #b83248;
    --xc-danger-soft: #ffeaee;
    --xc-muted: #cfd2dc;
    --xc-rail-bg: #171a22;
    --xc-bubble-in: #ffffff;
    --xc-bubble-out: linear-gradient(145deg, #6479ff, #536dfe);
    --xc-bubble-out-border: rgba(83, 109, 254, .18);
    --xc-bubble-out-text: #ffffff;
    --xc-bubble-out-muted: rgba(255, 255, 255, .72);
    --xc-bubble-out-attachment-bg: rgba(255, 255, 255, .12);
    --xc-bubble-out-attachment-border: rgba(255, 255, 255, .18);
    --xc-bubble-out-action-bg: rgba(255, 255, 255, .16);
    --xc-bubble-out-action-text: #ffffff;
    --xc-attachment-bg: rgba(255, 255, 255, .88);
    --xc-composer-bg: #ffffff;
    --xc-message-shadow: rgba(40, 45, 70, .14);
    --xc-message-own-shadow: rgba(83, 109, 254, .18);
    --xc-message-meta: #7d8292;
    --xc-waveform-idle: #cfd2dc;
    --xc-waveform-active: #536dfe;
    --xc-glass: rgba(255, 255, 255, .93);
    --xc-glass-border: rgba(231, 232, 238, .88);
    --xc-scrollbar: #d7d9e2;
    --xc-focus-ring: rgba(83, 109, 254, .32);
    --xc-brand-gradient: linear-gradient(145deg, #6c55ff, #4c7cff);
    --xc-bubble-gradient: linear-gradient(145deg, #6479ff, #536dfe);
    --xc-shadow-soft: 0 12px 30px rgba(38, 43, 65, .10);
    --xc-shadow-panel: none;
    --xc-radius-sm: 11px;
    --xc-radius-md: 14px;
    --xc-radius-lg: 17px;
    --xc-radius-xl: 0px;
    --xc-radius-full: 999px;
    --xc-sidebar-w: 330px;
    --xc-topbar-h: 68px;
    --xc-mobile-nav-h: 64px;
    --xc-edge-swipe-width: 120px;
    --xc-swipe-offset: 0px;
    --xc-underlay-offset: 0px;
    --xc-underlay-shift: 96px;
    --xc-swipe-open-duration: 250ms;
    --xc-swipe-close-duration: 165ms;
    --xc-swipe-easing: cubic-bezier(.32, .94, .6, 1);
    --xc-swipe-close-easing: cubic-bezier(.32, .16, .72, .62);
    --xc-row-line: rgba(231, 232, 238, .82);
    --xc-bottom-bar: rgba(255, 255, 255, .96);
    --xc-hover-soft: #f2f3f7;
    --xc-press-soft: #eceef5;
    --xc-active-soft: #edf0ff;
    --xc-filter-active: #edf0ff;
    --xc-wallpaper: #fbfbfd;
    --xc-wallpaper-paper: #f2f3f6;
    --xc-wallpaper-sky: #e7f3fb;
    --xc-wallpaper-sage: #e8f2eb;
    --xc-wallpaper-lavender: #efecf8;
    --xc-wallpaper-dot: rgba(125, 130, 146, .12);
    --xc-wallpaper-gloss-start: rgba(255, 255, 255, .26);
    --xc-wallpaper-gloss-end: rgba(255, 255, 255, 0);
    --xc-header-line: rgba(231, 232, 238, .92);
}

@media (prefers-color-scheme: dark) {
    :root:not([data-theme="light"]) {
        --xc-bg: #090a0d;
        --xc-bg-2: #111217;
        --xc-surface: #15161b;
        --xc-surface-2: #1c1e25;
        --xc-surface-3: #222944;
        --xc-sidebar-surface: #1a1c23;
        --xc-text: #f2f3f7;
        --xc-text-2: #c5c8d2;
        --xc-text-3: #9095a5;
        --xc-border: #292b33;
        --xc-border-strong: #373a45;
        --xc-input: #15161b;
        --xc-input-muted: #1c1e25;
        --xc-primary: #6f83ff;
        --xc-primary-2: #91a0ff;
        --xc-primary-soft: #222944;
        --xc-success: #42d9a4;
        --xc-success-2: #a8f0d7;
        --xc-success-soft: rgba(66, 217, 164, .14);
        --xc-warning: #f2b45a;
        --xc-warning-2: #ffe1aa;
        --xc-warning-soft: rgba(242, 180, 90, .16);
        --xc-danger: #ff7889;
        --xc-danger-2: #ffc2ca;
        --xc-danger-soft: rgba(255, 120, 137, .16);
        --xc-muted: #3a3d47;
        --xc-rail-bg: #0c0d11;
        --xc-bubble-in: #272d48;
        --xc-bubble-out: linear-gradient(145deg, #6f83ff, #536dfe);
        --xc-bubble-out-border: rgba(111, 131, 255, .24);
        --xc-bubble-out-text: #ffffff;
        --xc-bubble-out-muted: rgba(255, 255, 255, .72);
        --xc-bubble-out-attachment-bg: rgba(255, 255, 255, .10);
        --xc-bubble-out-attachment-border: rgba(255, 255, 255, .16);
        --xc-bubble-out-action-bg: rgba(255, 255, 255, .14);
        --xc-bubble-out-action-text: #ffffff;
        --xc-attachment-bg: rgba(21, 22, 27, .92);
        --xc-composer-bg: #15161b;
        --xc-message-shadow: rgba(0, 0, 0, .12);
        --xc-message-own-shadow: rgba(0, 0, 0, .10);
        --xc-message-meta: #9095a5;
        --xc-waveform-idle: #3a3d47;
        --xc-waveform-active: #6f83ff;
        --xc-glass: rgba(21, 22, 27, .92);
        --xc-glass-border: rgba(41, 43, 51, .94);
        --xc-scrollbar: #3a3d47;
        --xc-focus-ring: rgba(111, 131, 255, .34);
        --xc-brand-gradient: linear-gradient(145deg, #6c55ff, #4c7cff);
        --xc-bubble-gradient: linear-gradient(145deg, #6f83ff, #536dfe);
        --xc-shadow-soft: 0 14px 34px rgba(0, 0, 0, .34);
        --xc-shadow-panel: none;
        --xc-row-line: rgba(41, 43, 51, .84);
        --xc-bottom-bar: rgba(21, 22, 27, .96);
        --xc-hover-soft: #1c1e25;
        --xc-press-soft: #22242b;
        --xc-active-soft: #222944;
        --xc-filter-active: #222944;
        --xc-wallpaper: #0a0c11;
        --xc-wallpaper-paper: #0d0f14;
        --xc-wallpaper-sky: #08131d;
        --xc-wallpaper-sage: #0a1711;
        --xc-wallpaper-lavender: #12101d;
        --xc-wallpaper-dot: rgba(144, 149, 165, .12);
        --xc-wallpaper-gloss-start: rgba(255, 255, 255, .025);
        --xc-wallpaper-gloss-end: rgba(255, 255, 255, 0);
        --xc-header-line: rgba(41, 43, 51, .96);
    }
}

:root[data-theme="dark"] {
    --xc-bg: #090a0d;
    --xc-bg-2: #111217;
    --xc-surface: #15161b;
    --xc-surface-2: #1c1e25;
    --xc-surface-3: #222944;
    --xc-sidebar-surface: #1a1c23;
    --xc-text: #f2f3f7;
    --xc-text-2: #c5c8d2;
    --xc-text-3: #9095a5;
    --xc-border: #292b33;
    --xc-border-strong: #373a45;
    --xc-input: #15161b;
    --xc-input-muted: #1c1e25;
    --xc-primary: #6f83ff;
    --xc-primary-2: #91a0ff;
    --xc-primary-soft: #222944;
    --xc-success: #42d9a4;
    --xc-success-2: #a8f0d7;
    --xc-success-soft: rgba(66, 217, 164, .14);
    --xc-warning: #f2b45a;
    --xc-warning-2: #ffe1aa;
    --xc-warning-soft: rgba(242, 180, 90, .16);
    --xc-danger: #ff7889;
    --xc-danger-2: #ffc2ca;
    --xc-danger-soft: rgba(255, 120, 137, .16);
    --xc-muted: #3a3d47;
    --xc-rail-bg: #0c0d11;
    --xc-bubble-in: #272d48;
    --xc-bubble-out: linear-gradient(145deg, #6f83ff, #536dfe);
    --xc-bubble-out-border: rgba(111, 131, 255, .24);
    --xc-bubble-out-text: #ffffff;
    --xc-bubble-out-muted: rgba(255, 255, 255, .72);
    --xc-bubble-out-attachment-bg: rgba(255, 255, 255, .10);
    --xc-bubble-out-attachment-border: rgba(255, 255, 255, .16);
    --xc-bubble-out-action-bg: rgba(255, 255, 255, .14);
    --xc-bubble-out-action-text: #ffffff;
    --xc-attachment-bg: rgba(21, 22, 27, .92);
    --xc-composer-bg: #15161b;
    --xc-message-shadow: rgba(0, 0, 0, .12);
    --xc-message-own-shadow: rgba(0, 0, 0, .10);
    --xc-message-meta: #9095a5;
    --xc-waveform-idle: #3a3d47;
    --xc-waveform-active: #6f83ff;
    --xc-glass: rgba(21, 22, 27, .92);
    --xc-glass-border: rgba(41, 43, 51, .94);
    --xc-scrollbar: #3a3d47;
    --xc-focus-ring: rgba(111, 131, 255, .34);
    --xc-brand-gradient: linear-gradient(145deg, #6c55ff, #4c7cff);
    --xc-bubble-gradient: linear-gradient(145deg, #6f83ff, #536dfe);
    --xc-shadow-soft: 0 14px 34px rgba(0, 0, 0, .34);
    --xc-shadow-panel: none;
    --xc-row-line: rgba(41, 43, 51, .84);
    --xc-bottom-bar: rgba(21, 22, 27, .96);
    --xc-hover-soft: #1c1e25;
    --xc-press-soft: #22242b;
    --xc-active-soft: #222944;
    --xc-filter-active: #222944;
    --xc-wallpaper: #0a0c11;
    --xc-wallpaper-paper: #0d0f14;
    --xc-wallpaper-sky: #08131d;
    --xc-wallpaper-sage: #0a1711;
    --xc-wallpaper-lavender: #12101d;
    --xc-wallpaper-dot: rgba(144, 149, 165, .12);
    --xc-wallpaper-gloss-start: rgba(255, 255, 255, .025);
    --xc-wallpaper-gloss-end: rgba(255, 255, 255, 0);
    --xc-header-line: rgba(41, 43, 51, .96);
}