/**
 * Sublima App - Dark Theme
 * Area profilo cliente - OLED friendly
 */

[data-theme="dark"] {
    /* Background colors */
    --app-bg-primary: #1a1a1a;
    --app-bg-secondary: #0f0f0f;
    --app-bg-tertiary: #2d2d2d;
    --app-bg-hover: #262626;
    --app-bg-active: #333333;

    /* Text colors */
    --app-text-primary: #f5f5f5;
    --app-text-secondary: #a3a3a3;
    --app-text-tertiary: #737373;
    --app-text-inverse: #1a1a1a;

    /* Border colors */
    --app-border-color: #333333;
    --app-border-light: #262626;
    --app-border-dark: #404040;

    /* Brand - Sublima burgundy (adjusted for dark) */
    --app-brand: #c2355e;
    --app-brand-hover: #d94d74;
    --app-brand-light: #3d1525;

    /* Primary action (brighter for dark) */
    --app-primary: #3b82f6;
    --app-primary-hover: #60a5fa;
    --app-primary-light: #1e3a8a;
    --app-secondary: #94a3b8;
    --app-secondary-hover: #cbd5e1;

    /* Status colors (adjusted for dark) */
    --app-success: #22c55e;
    --app-success-light: #14532d;
    --app-warning: #fbbf24;
    --app-warning-light: #78350f;
    --app-danger: #f87171;
    --app-danger-light: #7f1d1d;
    --app-info: #60a5fa;
    --app-info-light: #1e3a8a;

    /* Component specific */
    --app-navbar-bg: rgba(26, 26, 26, 0.97);
    --app-navbar-border: #333333;
    --app-card-bg: #1a1a1a;
    --app-card-hover-bg: #262626;
    --app-sidebar-bg: #1a1a1a;
    --app-sidebar-active: #262626;
    --app-bottombar-bg: rgba(15, 15, 15, 0.97);

    /* Shadows */
    --app-shadow-sm: 0 1px 2px rgba(0, 0, 0, 0.3);
    --app-shadow-md: 0 4px 6px -1px rgba(0, 0, 0, 0.4);
    --app-shadow-lg: 0 10px 15px -3px rgba(0, 0, 0, 0.5);

    /* Text selection - High contrast for dark theme */
    --app-selection-bg: #fbbf24;  /* Amber highlight */
    --app-selection-text: #1a1a1a; /* Dark text */
}

/* Text selection - Dark theme with high contrast */
[data-theme="dark"]::selection {
    background-color: var(--app-selection-bg);
    color: var(--app-selection-text);
}

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

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

/* Body */
body[data-theme="dark"] {
    background-color: var(--app-bg-secondary);
    color: var(--app-text-primary);
}

/* Navbar */
[data-theme="dark"] .app-navbar {
    background-color: var(--app-navbar-bg);
    border-bottom: 1px solid var(--app-navbar-border);
    backdrop-filter: blur(8px);
}

/* Cards */
[data-theme="dark"] .app-card {
    background-color: var(--app-card-bg);
    border: 1px solid var(--app-border-color);
    box-shadow: var(--app-shadow-sm);
}

[data-theme="dark"] .app-card:hover {
    box-shadow: var(--app-shadow-md);
}

/* Sidebar nav */
[data-theme="dark"] .app-sidebar .nav-link {
    color: var(--app-text-secondary);
}

[data-theme="dark"] .app-sidebar .nav-link:hover {
    color: var(--app-text-primary);
    background-color: var(--app-bg-hover);
}

[data-theme="dark"] .app-sidebar .nav-link.active {
    color: var(--app-primary);
    background-color: var(--app-sidebar-active);
    font-weight: 600;
}

/* Buttons */
/* Override: [data-theme="dark"] a { color: --app-primary } sovrascrive color:#fff sui bottoni <a>.
   Con specificità (0,2,0) vs (0,1,1) vinciamo la regola generica dei link. */
[data-theme="dark"] .w20-prd-btn,
[data-theme="dark"] .w20-btn-primary,
[data-theme="dark"] .btn-primary {
    color: #fff;
}
[data-theme="dark"] .w20-prd-btn:hover,
[data-theme="dark"] .w20-btn-primary:hover,
[data-theme="dark"] .btn-primary:hover {
    color: #fff;
}

[data-theme="dark"] .btn-app-primary {
    background-color: var(--app-primary);
    border-color: var(--app-primary);
    color: var(--app-text-inverse);
}

[data-theme="dark"] .btn-app-primary:hover {
    background-color: var(--app-primary-hover);
    border-color: var(--app-primary-hover);
}

/* Button text selection - ensuring high contrast when text is selected inside buttons */
[data-theme="dark"] .w20-prd-btn::selection,
[data-theme="dark"] .btn::selection,
[data-theme="dark"] button::selection {
    background-color: var(--app-selection-bg);
    color: var(--app-selection-text);
}

[data-theme="dark"] .w20-prd-btn::-moz-selection,
[data-theme="dark"] .btn::-moz-selection,
[data-theme="dark"] button::-moz-selection {
    background-color: var(--app-selection-bg);
    color: var(--app-selection-text);
}

[data-theme="dark"] .w20-prd-btn::-webkit-selection,
[data-theme="dark"] .btn::-webkit-selection,
[data-theme="dark"] button::-webkit-selection {
    background-color: var(--app-selection-bg);
    color: var(--app-selection-text);
}

[data-theme="dark"] .btn-app-brand {
    background-color: var(--app-brand);
    border-color: var(--app-brand);
    color: #ffffff;
}

[data-theme="dark"] .btn-app-brand:hover {
    background-color: var(--app-brand-hover);
    border-color: var(--app-brand-hover);
    color: #ffffff;
}

/* Forms */
[data-theme="dark"] .form-control,
[data-theme="dark"] .form-select {
    background-color: var(--app-bg-tertiary);
    border-color: var(--app-border-color);
    color: var(--app-text-primary);
}

[data-theme="dark"] .form-control:focus,
[data-theme="dark"] .form-select:focus {
    border-color: var(--app-primary);
    box-shadow: 0 0 0 0.25rem var(--app-primary-light);
    background-color: var(--app-bg-primary);
}

/* Tables */
[data-theme="dark"] .app-table thead {
    background-color: var(--app-bg-tertiary);
    color: var(--app-text-primary);
}

[data-theme="dark"] .app-table tbody tr:hover {
    background-color: var(--app-bg-hover);
}

[data-theme="dark"] .app-table td,
[data-theme="dark"] .app-table th {
    border-color: var(--app-border-color);
}

/* Badges */
[data-theme="dark"] .badge {
    background-color: var(--app-bg-tertiary);
    color: var(--app-text-primary);
}

/* Links */
[data-theme="dark"] a {
    color: var(--app-primary);
}

[data-theme="dark"] a:hover {
    color: var(--app-primary-hover);
}

/* Modals & Dropdowns */
[data-theme="dark"] .modal-content,
[data-theme="dark"] .dropdown-menu {
    background-color: var(--app-bg-primary);
    border-color: var(--app-border-color);
    color: var(--app-text-primary);
}

[data-theme="dark"] .dropdown-item {
    color: var(--app-text-primary);
}

[data-theme="dark"] .dropdown-item:hover {
    background-color: var(--app-bg-hover);
}

/* Text helpers */
[data-theme="dark"] .text-muted {
    color: var(--app-text-secondary) !important;
}

/* Scrollbar */
[data-theme="dark"] ::-webkit-scrollbar-thumb {
    background-color: var(--app-border-dark);
    border-radius: 4px;
}

[data-theme="dark"] ::-webkit-scrollbar-thumb:hover {
    background-color: var(--app-text-secondary);
}

/* OLED: reduce blue light */
@media (prefers-color-scheme: dark) {
    [data-theme="dark"] {
        --app-primary: #5b8ef7;
    }
}