/**
 * WebLaunch app shell — light theme overrides (paired with html[data-wl-theme]).
 * Dark values live in _Layout.cshtml :root; default is dark.
 */
html[data-wl-theme="light"] {
    color-scheme: light;
}

html[data-wl-theme="light"] {
    --wl-bg: #f3f4f6;
    --wl-surface: #ffffff;
    --wl-surface-2: #f9fafb;
    --wl-surface-3: #f3f4f6;
    --wl-border: #e5e7eb;
    --wl-border-2: #d1d5db;
    --wl-text: #111827;
    --wl-text-2: #4b5563;
    --wl-text-3: #6b7280;
    --wl-accent-bg: color-mix(in srgb, var(--wl-accent) 12%, transparent);
}

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

html[data-wl-theme="light"] .wl-manage-menu {
    box-shadow: 0 10px 40px rgba(15, 23, 42, 0.12);
}

html[data-wl-theme="light"] .wl-card {
    box-shadow:
        0 0 0 1px color-mix(in srgb, var(--wl-accent) 8%, transparent),
        0 8px 24px rgba(15, 23, 42, 0.06);
}

html[data-wl-theme="light"] .wl-content:not(.full-bleed)::before {
    opacity: 0.85;
}

/* Leads (and similar) empty states — avoid dark gradients on light shell */
html[data-wl-theme="light"] .wl-leads-empty-card {
    background: linear-gradient(180deg, #ffffff 0%, #f8fafc 100%);
    border-color: rgba(15, 23, 42, 0.1);
    box-shadow: 0 12px 40px rgba(15, 23, 42, 0.06);
}

html[data-wl-theme="light"] .wl-leads-empty-icon {
    background: color-mix(in srgb, var(--wl-accent) 10%, #ffffff);
    border-color: color-mix(in srgb, var(--wl-accent) 22%, var(--wl-border));
}

html[data-wl-theme="light"] .wl-leads-empty-title {
    color: var(--wl-text);
}

html[data-wl-theme="light"] .wl-leads-empty-text {
    color: var(--wl-text-2);
}

/* Primary nav active tab — readable on light topbar */
html[data-wl-theme="light"] .wl-app-nav-link.active:not(.wl-app-nav-link--wm) {
    background: linear-gradient(180deg, #e0e7ff 0%, #c7d2fe 45%, #a5b4fc 100%);
    color: #1e1b4b;
    text-shadow: none;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.6);
}

html[data-wl-theme="light"] .wl-app-nav-link--wm.active {
    background: linear-gradient(180deg, #fce7f3 0%, #fbcfe8 35%, #f9a8d4 65%, #e879f9 100%);
    color: #4c0519;
    text-shadow: none;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.5);
}

/* Theme toggle — matches marketing /home control */
.wl-theme-toggle {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 36px;
    padding: 0;
    border-radius: 10px;
    border: 1px solid var(--wl-border);
    background: var(--wl-surface-2);
    color: var(--wl-text-2);
    cursor: pointer;
    transition: background 0.15s ease, border-color 0.15s ease, color 0.15s ease;
    flex-shrink: 0;
}

.wl-theme-toggle:hover {
    background: var(--wl-surface-3);
    color: var(--wl-text);
    border-color: var(--wl-border-2);
}

.wl-theme-toggle:focus {
    outline: none;
}

.wl-theme-toggle:focus-visible {
    outline: 2px solid color-mix(in srgb, var(--wl-accent) 45%, transparent);
    outline-offset: 2px;
}

.wl-theme-toggle .wl-theme-toggle-icon--moon,
.wl-theme-toggle .wl-theme-toggle-icon--sun {
    font-size: 18px;
    line-height: 1;
}

html[data-wl-theme="dark"] .wl-theme-toggle-icon--sun {
    display: none;
}

html[data-wl-theme="light"] .wl-theme-toggle-icon--moon {
    display: none;
}

/* Primary CTA — light mode hover: avoid brightness() washing the gradient to white on white cards */
html[data-wl-theme="light"] .wl-btn-primary {
    color: #fff;
    text-shadow: 0 1px 1px rgba(0, 0, 0, 0.18);
}
html[data-wl-theme="light"] .wl-btn-primary:hover {
    filter: none;
    color: #fff;
    background: linear-gradient(135deg, #0058b8 0%, #008faf 48%, #05946f 100%);
    border-color: color-mix(in srgb, #0077b6 55%, rgba(15, 23, 42, 0.2));
    box-shadow:
        0 4px 18px rgba(0, 100, 140, 0.28),
        inset 0 1px 0 rgba(255, 255, 255, 0.15);
}
html[data-wl-theme="light"] .wl-btn-primary:active {
    filter: brightness(0.97);
    box-shadow: 0 2px 10px rgba(0, 80, 120, 0.22);
}