/* ═══════════════════════════════════════════════════════════════════
   LW Support — Dark Theme
   ═══════════════════════════════════════════════════════════════════ */

[data-theme="dark"] {
    --bg:            #0a0a1a;
    --card:          #12122a;
    --border:        #2a2a4a;
    --text:          #e0e0e0;
    --text-muted:    #9a9a9a;
    --text-light:    #6a6a8a;
    --primary-bg:    #1a2540;
    --success-bg:    #0a2a1a;
    --success:       #34D399;
    --warning-bg:    #2a1a0a;
    --danger-bg:     #2a0a0a;
}

[data-theme="dark"] body { background: var(--bg); color: var(--text); }

[data-theme="dark"] header {
    background: rgba(10, 10, 26, 0.92);
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
    border-bottom-color: var(--border);
}

[data-theme="dark"] footer {
    background: var(--card);
    border-top-color: var(--border);
}

/* Logo */
[data-theme="dark"] .logo svg .lw-a { fill: #e0e0e0; }
[data-theme="dark"] .logo svg .lw-n { fill: #7a7a9a; }
[data-theme="dark"] .logo-sub { border-left-color: var(--border); }
[data-theme="dark"] .logo-sub strong { color: var(--text); }

/* Burger */
[data-theme="dark"] .burger {
    background: transparent;
    border-color: var(--border);
}
[data-theme="dark"] .burger span { background: var(--text); }

/* Cards */
[data-theme="dark"] .card,
[data-theme="dark"] .feat-card,
[data-theme="dark"] .faq-item,
[data-theme="dark"] .ticket-item {
    background: var(--card);
    border-color: var(--border);
}
[data-theme="dark"] .card-hover:hover,
[data-theme="dark"] .feat-card:hover,
[data-theme="dark"] .ticket-item:hover {
    box-shadow: 0 2px 16px rgba(100,100,255,0.06);
    border-color: #3a3a6a;
}

/* Buttons */
[data-theme="dark"] .btn-outline {
    border-color: var(--border);
    color: var(--text);
}
[data-theme="dark"] .btn-outline:hover {
    border-color: var(--primary);
    color: var(--primary);
}
[data-theme="dark"] .filter-btn {
    background: var(--card);
    border-color: var(--border);
    color: var(--text-muted);
}
[data-theme="dark"] .filter-btn:hover {
    border-color: var(--primary);
    color: var(--primary);
}

/* Forms */
[data-theme="dark"] .form-input,
[data-theme="dark"] .form-select,
[data-theme="dark"] .form-textarea {
    background: var(--bg);
    border-color: var(--border);
    color: var(--text);
}
[data-theme="dark"] .form-input:focus,
[data-theme="dark"] .form-select:focus,
[data-theme="dark"] .form-textarea:focus {
    border-color: var(--primary);
    box-shadow: 0 0 0 3px rgba(6, 147, 227, 0.15);
}

/* Chat */
[data-theme="dark"] .chat-msg-user {
    background: var(--card);
    border-color: var(--border);
}
[data-theme="dark"] .chat-msg-support {
    background: var(--primary-bg);
    border-color: rgba(6, 147, 227, 0.2);
}

/* Status */
[data-theme="dark"] .status-ok { background: #0a2a1a; color: #34D399; border-color: #1a3a2a; }
[data-theme="dark"] .status-warn { background: #2a1a0a; color: #FBBF24; border-color: #3a2a1a; }
[data-theme="dark"] .status-bad { background: #2a0a0a; color: #F87171; border-color: #3a1a1a; }
[data-theme="dark"] .service-row { border-bottom-color: var(--border); }

/* Alerts */
[data-theme="dark"] .alert-success { background: #0a2a1a; color: #34D399; border-color: #1a3a2a; }
[data-theme="dark"] .alert-error { background: #2a0a0a; color: #F87171; border-color: #3a1a1a; }
[data-theme="dark"] .alert-warning { background: #2a1a0a; color: #FBBF24; border-color: #3a2a1a; }
[data-theme="dark"] .alert-info { background: #0a1a3a; color: var(--primary-light); border-color: #1a2a4a; }

/* Badges - dark overrides */
[data-theme="dark"] .badge-open { background: #1a2540; color: var(--primary-light); }
[data-theme="dark"] .badge-replied { background: #2a1a0a; color: #FBBF24; }
[data-theme="dark"] .badge-answered { background: #0a2a1a; color: #34D399; }
[data-theme="dark"] .badge-closed { background: #1a1a2a; color: var(--text-light); }

/* Changelog */
[data-theme="dark"] .changelog-item { border-bottom-color: var(--border); }

/* Theme toggle */
[data-theme="dark"] .theme-toggle {
    background: var(--card);
    border-color: var(--border);
    color: var(--text-muted);
}

/* Nav mobile */
[data-theme="dark"] nav {
    background: var(--card);
    border-top-color: var(--border);
}
