/* Bale dark / light theme */

/* :root[…] beats the plain :root block below regardless of source order */
:root[data-bale-theme="dark"] {
    color-scheme: dark;
    --bale-primary-light: #005C4B;
    --bale-bg: #0B141A;
    --bale-sidebar: #111B21;
    --bale-nav: #202C33;
    --bale-text: #E9EDEF;
    --bale-text-secondary: #8696A0;
    --bale-border: #222D34;
    --bale-bubble-in: #243440;
    --bale-bubble-out: #0B6E5C;
    --bale-link: #53BDEB;
    --bale-shadow: 0 8px 32px rgba(0, 0, 0, 0.45);
    --bale-surface: #111B21;
    --bale-surface-alt: #202C33;
    --bale-hover: #202C33;
    --bale-active-bg: #182229;
    --bale-highlight-bg: #182229;
    --bale-avatar-bg: #374955;
    --bale-main-bg: #14222C;
    --bale-pinned-bg: #182229;
    --bale-separator: #202C33;
}

:root {
    --bale-surface: #FFFFFF;
    --bale-surface-alt: #F0F2F5;
    --bale-hover: #F0F2F5;
    --bale-active-bg: #E7F8F5;
    --bale-highlight-bg: #E7F8F5;
    --bale-avatar-bg: #DFE5E7;
    --bale-main-bg: #E4DDD6;
    --bale-pinned-bg: #F8FAFA;
    --bale-separator: #F0F2F5;
}

/* Chat list & sidebar */
[data-bale-theme="dark"] .bale-notify-banner {
    background: var(--bale-highlight-bg);
}

[data-bale-theme="dark"] .bale-chat-item:hover,
[data-bale-theme="dark"] .bale-chat-item.active {
    background: var(--bale-hover);
}

[data-bale-theme="dark"] .bale-chat-item.active {
    background: var(--bale-active-bg);
}

[data-bale-theme="dark"] .bale-avatar {
    background: var(--bale-avatar-bg);
}

[data-bale-theme="dark"] .bale-main {
    background-color: var(--bale-main-bg);
    background-image: url("data:image/svg+xml,%3Csvg width='60' height='60' viewBox='0 0 60 60' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='none' fill-rule='evenodd'%3E%3Cg fill='%23223540' fill-opacity='0.6'%3E%3Cpath d='M36 34v-4h-2v4h-4v2h4v4h2v-4h4v-2h-4zm0-30V0h-2v4h-4v2h4v4h2V6h4V4h-4zM6 34v-4H4v4H0v2h4v4h2v-4h4v-2H6zM6 4V0H4v4H0v2h4v4h2V6h4V4H6z'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E");
}

[data-bale-theme="dark"] .bale-pinned-bar {
    background: var(--bale-pinned-bg);
}

[data-bale-theme="dark"] .bale-msg-menu-btn:active,
[data-bale-theme="dark"] .bale-msg-menu-btn:focus-visible {
    background: rgba(255, 255, 255, 0.08);
}

[data-bale-theme="dark"] .bale-composer,
[data-bale-theme="dark"] .bale-modal,
[data-bale-theme="dark"] .bale-emoji-picker,
[data-bale-theme="dark"] .bale-attach-menu,
[data-bale-theme="dark"] .bale-context-menu,
[data-bale-theme="dark"] .bale-search-panel,
[data-bale-theme="dark"] .bale-forward-modal .bale-modal,
[data-bale-theme="dark"] .bale-reply-preview,
[data-bale-theme="dark"] .bale-input-wrap {
    background: var(--bale-surface);
}

[data-bale-theme="dark"] .bale-composer-input {
    background: var(--bale-surface-alt);
}

[data-bale-theme="dark"] .bale-bubble.in {
    background: var(--bale-bubble-in);
}

[data-bale-theme="dark"] .bale-bubble.out {
    background: var(--bale-bubble-out);
}

[data-bale-theme="dark"] .bale-login-page {
    background: linear-gradient(135deg, #182229 0%, #0B141A 100%);
}

[data-bale-theme="dark"] .bale-login-card {
    background: var(--bale-sidebar);
}

[data-bale-theme="dark"] .bale-error-page {
    background: linear-gradient(135deg, #182229 0%, #0B141A 100%);
}

[data-bale-theme="dark"] .bale-error-card {
    background: var(--bale-sidebar);
}

[data-bale-theme="dark"] .bale-error-icon {
    background: var(--bale-surface-alt);
}

[data-bale-theme="dark"] .bale-error-retry {
    background: rgba(245, 158, 11, 0.15);
    color: #FCD34D;
}

[data-bale-theme="dark"] .bale-login-input {
    background: var(--bale-surface-alt);
    color: var(--bale-text);
    border-color: var(--bale-border);
}

[data-bale-theme="dark"] .bale-switch::after {
    background: var(--bale-text);
}

/* Profile drawer */
[data-bale-theme="dark"] .bale-drawer-panel {
    background: var(--bale-sidebar);
    box-shadow: -4px 0 24px rgba(0, 0, 0, 0.35);
}

[data-bale-theme="dark"] .bale-drawer-profile {
    border-bottom-color: var(--bale-separator);
}

[data-bale-theme="dark"] .bale-drawer-menu-secondary {
    border-top-color: var(--bale-separator);
}

[data-bale-theme="dark"] .bale-drawer-item:hover {
    background: var(--bale-hover);
}

[data-bale-theme="dark"] .bale-drawer-moon {
    opacity: 0.9;
}

[data-bale-theme="dark"] .bale-drawer-moon:hover {
    background: var(--bale-hover);
    border-radius: 50%;
}

/* Story bar & extensions */
[data-bale-theme="dark"] .bale-story-bar {
    background: linear-gradient(180deg, var(--bale-sidebar) 0%, var(--bale-bg) 100%);
}

[data-bale-theme="dark"] .bale-story-avatar {
    border-color: var(--bale-sidebar);
    background: var(--bale-avatar-bg);
}

[data-bale-theme="dark"] .bale-story-add-ring {
    background: var(--bale-surface-alt);
}

/* No filter here — it would dim the bubbles/text inside, not just the wallpaper */
[data-bale-theme="dark"] .bale-chat-pattern {
    background-color: var(--bale-main-bg);
    background-image: url("data:image/svg+xml,%3Csvg width='60' height='60' viewBox='0 0 60 60' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='none' fill-rule='evenodd'%3E%3Cg fill='%23223540' fill-opacity='0.6'%3E%3Cpath d='M36 34v-4h-2v4h-4v2h4v4h2v-4h4v-2h-4zm0-30V0h-2v4h-4v2h4v4h2V6h4V4h-4zM6 34v-4H4v4H0v2h4v4h2v-4h4v-2H6zM6 4V0H4v4H0v2h4v4h2V6h4V4H6z'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E");
    background-size: 60px;
    filter: none;
}

[data-bale-theme="dark"] .bale-main-plain {
    background: var(--bale-bg);
}

[data-bale-theme="dark"] .bale-avatar.has-story {
    box-shadow:
        0 0 0 2px var(--bale-sidebar),
        0 0 0 4px var(--bale-primary),
        0 0 0 5px rgba(0, 166, 147, 0.25);
}

[data-bale-theme="dark"] .bale-profile-form input,
[data-bale-theme="dark"] .bale-profile-form textarea {
    background: var(--bale-sidebar);
    border-color: var(--bale-border);
    color: var(--bale-text);
}

[data-bale-theme="dark"] .bale-profile-form .bale-input-disabled {
    background: #1a252d;
}

[data-bale-theme="dark"] .bale-profile-alert-success {
    background: rgba(0, 166, 147, 0.2);
    color: var(--bale-text);
}

[data-bale-theme="dark"] .bale-profile-alert-error {
    background: rgba(234, 0, 56, 0.15);
    color: var(--bale-text);
}

/* Services, magazine, modals */
[data-bale-theme="dark"] .bale-wallet-card,
[data-bale-theme="dark"] .bale-profile-card,
[data-bale-theme="dark"] .bale-service-card,
[data-bale-theme="dark"] .bale-service-tile,
[data-bale-theme="dark"] .bale-magazine-card,
[data-bale-theme="dark"] .bale-magazine-sidebar-card,
[data-bale-theme="dark"] .bale-discover-card,
[data-bale-theme="dark"] .bale-channel-card,
[data-bale-theme="dark"] .bale-group-card,
[data-bale-theme="dark"] .bale-story-viewer,
[data-bale-theme="dark"] .bale-story-create-panel,
[data-bale-theme="dark"] .bale-shop-product-card,
[data-bale-theme="dark"] .bale-cart-item,
[data-bale-theme="dark"] .bale-order-card,
[data-bale-theme="dark"] .bale-checkout-card,
[data-bale-theme="dark"] .bale-notif-item,
[data-bale-theme="dark"] .bale-profile-panel,
[data-bale-theme="dark"] .bale-admin-card,
[data-bale-theme="dark"] .bale-admin-stat,
[data-bale-theme="dark"] .bale-admin-table-wrap {
    background: var(--bale-surface);
}

[data-bale-theme="dark"] .bale-magazine-app,
[data-bale-theme="dark"] .bale-story-create-app,
[data-bale-theme="dark"] .bale-discover-scroll,
[data-bale-theme="dark"] .bale-profile-scroll {
    background: var(--bale-bg);
}

[data-bale-theme="dark"] .bale-services-scroll .bale-service-card:hover,
[data-bale-theme="dark"] .bale-magazine-item:hover,
[data-bale-theme="dark"] .bale-settings-item:hover {
    background: var(--bale-hover);
}

/* Store */
[data-bale-theme="dark"] .bale-store-app {
    --store-bg: #0B141A;
    --store-card: #111B21;
    --store-text: #E9EDEF;
    --store-muted: #8696A0;
    --store-shadow: 0 1px 4px rgba(0, 0, 0, 0.35);
    --store-border: #222D34;
    --store-soft: #182229;
    --store-field: #202C33;
    --store-skeleton: #202C33;
}

[data-bale-theme="dark"] .bale-store-search {
    background: var(--bale-surface-alt);
}

[data-bale-theme="dark"] .bale-store-search input {
    color: var(--bale-text);
}

[data-bale-theme="dark"] .bale-store-search input::placeholder {
    color: var(--bale-text-secondary);
}

[data-bale-theme="dark"] .bale-store-category-chip {
    background: var(--bale-surface-alt);
    color: var(--bale-text);
}

[data-bale-theme="dark"] .bale-store-product-card {
    background: var(--store-card);
}

[data-bale-theme="dark"] .bale-store-bottom-nav {
    background: var(--bale-sidebar);
    border-top-color: var(--bale-border);
}

[data-bale-theme="dark"] .bale-store-cat-modal-sheet {
    background: #111B21;
    color: #E9EDEF;
}

[data-bale-theme="dark"] .bale-store-cat-modal-header {
    border-bottom-color: #222D34;
}

[data-bale-theme="dark"] .bale-store-cat-modal-item {
    color: #E9EDEF;
}

[data-bale-theme="dark"] .bale-store-cat-modal-item:hover {
    background: #202C33;
}

[data-bale-theme="dark"] .bale-store-cat-modal-img {
    background: #202C33;
}

[data-bale-theme="dark"] .bale-store-banner-dots span {
    background: rgba(255, 255, 255, 0.35);
}

[data-bale-theme="dark"] .bale-store-banner-dots span.active {
    background: #fff;
}

/* Admin (light-on-dark nav stays; content adapts) */
[data-bale-theme="dark"] .bale-admin-main {
    background: var(--bale-bg);
}

[data-bale-theme="dark"] .bale-admin-content {
    background: var(--bale-surface);
}

[data-bale-theme="dark"] input,
[data-bale-theme="dark"] textarea,
[data-bale-theme="dark"] select {
    color-scheme: dark;
}

[data-bale-theme="dark"] .bale-form-input,
[data-bale-theme="dark"] .bale-search-input,
[data-bale-theme="dark"] .bale-modal input,
[data-bale-theme="dark"] .bale-modal textarea,
[data-bale-theme="dark"] .bale-modal select {
    background: var(--bale-surface-alt);
    color: var(--bale-text);
    border-color: var(--bale-border);
}

[data-bale-theme="dark"] .connection-banner {
    background: #3d3422;
    color: #f0d78c;
}

[data-bale-theme="dark"] .connection-banner.reconnected {
    background: #1a3a2a;
    color: #8fd4a8;
}

/* Chat composer & messages — dark mode polish */
[data-bale-theme="dark"] .bale-reply-bar {
    background: var(--bale-surface-alt);
}

[data-bale-theme="dark"] .bale-date-separator {
    background: var(--bale-surface-alt);
    box-shadow: none;
}

[data-bale-theme="dark"] .bale-reaction-chip {
    background: var(--bale-surface-alt);
}

[data-bale-theme="dark"] .bale-voice-recording {
    background: var(--bale-sidebar);
}

[data-bale-theme="dark"] .bale-reply-preview {
    background: rgba(255, 255, 255, 0.06);
}

[data-bale-theme="dark"] .bale-file-download:hover {
    background: rgba(255, 255, 255, 0.06);
}

[data-bale-theme="dark"] .bale-search-box {
    background: var(--bale-surface-alt);
}

[data-bale-theme="dark"] .bale-search-box input {
    color: var(--bale-text);
    background: transparent;
}

[data-bale-theme="dark"] .bale-input-wrap textarea,
[data-bale-theme="dark"] .bale-input-wrap input {
    color: var(--bale-text);
}

[data-bale-theme="dark"] .bale-media-compose {
    background: var(--bale-sidebar);
}

[data-bale-theme="dark"] .bale-context-item:hover,
[data-bale-theme="dark"] .bale-attach-item:hover,
[data-bale-theme="dark"] .bale-emoji-grid span:hover {
    background: var(--bale-hover);
}

[data-bale-theme="dark"] .bale-emoji-cat.active {
    background: var(--bale-active-bg);
}

[data-bale-theme="dark"] .bale-copy-toast {
    background: rgba(32, 44, 51, 0.95);
    border: 1px solid var(--bale-border);
}

[data-bale-theme="dark"] .bale-chat-header,
[data-bale-theme="dark"] .bale-input-area {
    background: var(--bale-sidebar);
}

/* Teal-tinted accents — keep the tint visible on dark surfaces */
[data-bale-theme="dark"] .bale-wallet-icon,
[data-bale-theme="dark"] .bale-service-card-tag,
[data-bale-theme="dark"] .bale-otp-display,
[data-bale-theme="dark"] .bale-poll-option.selected,
[data-bale-theme="dark"] .bale-notification-item.unread,
[data-bale-theme="dark"] .mag-join-btn.joined:hover {
    background: rgba(0, 166, 147, 0.15);
}

[data-bale-theme="dark"] .bale-otp-display {
    color: #4DD0BD;
}

[data-bale-theme="dark"] .bale-messages-loader {
    background: rgba(11, 20, 26, 0.85);
}

[data-bale-theme="dark"] .bale-outlined-input {
    border-color: var(--bale-border);
}

[data-bale-theme="dark"] .bale-phone-prefix {
    border-left-color: var(--bale-border);
}

[data-bale-theme="dark"] .bale-channel-comment-btn {
    background: rgba(255, 255, 255, 0.08);
}

[data-bale-theme="dark"] .bale-error-card--rate-limit .bale-error-icon {
    background: rgba(245, 158, 11, 0.15);
}

/* Admin panel alerts & insights */
[data-bale-theme="dark"] .bale-admin-alert-success {
    background: rgba(0, 166, 147, 0.18);
    color: #4DD0BD;
}

[data-bale-theme="dark"] .bale-admin-alert-error {
    background: rgba(234, 0, 56, 0.15);
    color: #FF8B9E;
}

[data-bale-theme="dark"] .bale-admin-insight--success {
    background: rgba(0, 184, 148, 0.12);
}

[data-bale-theme="dark"] .bale-admin-insight--warning {
    background: rgba(243, 156, 18, 0.12);
}

[data-bale-theme="dark"] .bale-admin-insight--info {
    background: rgba(9, 132, 227, 0.12);
}

[data-bale-theme="dark"] .bale-pinned-bar {
    border-bottom-color: var(--bale-border);
}