/**
 * SLIQ — Sistema de temas
 * Tokens semánticos consumidos por todos los componentes.
 * Temas: light (default), dark, corporate*, custom* (* reservados)
 */

/* —— Tema Claro —— */
html:not([data-theme]),
[data-theme="light"] {
    color-scheme: light;

    --background: #f3f2f1;
    --surface: #ffffff;
    --surface-elevated: #faf9f8;
    --card: #ffffff;
    --border: #d2d0ce;
    --border-subtle: rgba(0, 0, 0, 0.05);

    --text-primary: #1b1b1b;
    --text-secondary: #616161;
    --text-muted: #8a8886;
    --text-inverse: #ffffff;

    --primary: #0078d4;
    --primary-hover: #005a9e;
    --primary-subtle: #deecf9;

    --success: #107c10;
    --success-bg: #dff6dd;
    --success-border: #a7e3a5;

    --warning: #ca5010;
    --warning-bg: #fff4ce;
    --warning-border: #fde7a0;

    --danger: #d13438;
    --danger-bg: #fde7e9;
    --danger-border: #f1aeb5;

    --info: #0078d4;
    --info-bg: #deecf9;

    --sidebar-bg: #242424;
    --sidebar-text: rgba(255, 255, 255, 0.88);
    --sidebar-text-muted: rgba(255, 255, 255, 0.58);
    --sidebar-border: rgba(255, 255, 255, 0.08);
    --sidebar-hover: rgba(255, 255, 255, 0.1);
    --sidebar-hover-text: rgba(255, 255, 255, 0.95);
    --sidebar-active-bg: var(--primary);
    --sidebar-active-text: #ffffff;
    --sidebar-focus-ring: rgba(255, 255, 255, 0.45);

    --shadow-sm: 0 1px 3px rgba(0, 0, 0, 0.08);
    --shadow-md: 0 4px 16px rgba(0, 0, 0, 0.1);
    --shadow-lg: 0 8px 32px rgba(0, 0, 0, 0.12);

    --focus-ring: rgba(0, 120, 212, 0.15);
    --row-hover: rgba(0, 120, 212, 0.04);
    --overlay: rgba(0, 0, 0, 0.45);

    --auth-gradient: linear-gradient(135deg, #0078d4 0%, #004578 50%, #1b1b1b 100%);
    --total-gradient-end: #e8f4fd;

    --accent-blue: #0078d4;
    --accent-teal: #008272;
    --accent-purple: #5c2d91;
    --accent-orange: #ca5010;
    --accent-green: #107c10;
    --accent-indigo: #004e8c;
    --accent-cyan: #0099bc;
    --accent-red: #d13438;
    --accent-gray: #616161;

    --sign-suma: #2e7d32;
    --sign-resta: #c62828;
}

/* —— Tema Oscuro —— */
[data-theme="dark"] {
    color-scheme: dark;

    --background: #0d0d0d;
    --surface: #161616;
    --surface-elevated: #1f1f1f;
    --card: #1a1a1a;
    --border: #333333;
    --border-subtle: rgba(255, 255, 255, 0.06);

    --text-primary: #f3f2f1;
    --text-secondary: #b0b0b0;
    --text-muted: #8a8886;
    --text-inverse: #1b1b1b;

    --primary: #4da3ff;
    --primary-hover: #78b9ff;
    --primary-subtle: #1a3a5c;

    --success: #6ccb5f;
    --success-bg: #1a3320;
    --success-border: #2d5a34;

    --warning: #ffb366;
    --warning-bg: #3d2a14;
    --warning-border: #5c4018;

    --danger: #f1707a;
    --danger-bg: #3d1f22;
    --danger-border: #5c2a2e;

    --info: #4da3ff;
    --info-bg: #1a3a5c;

    --sidebar-bg: #111111;
    --sidebar-text: rgba(255, 255, 255, 0.88);
    --sidebar-text-muted: rgba(255, 255, 255, 0.52);
    --sidebar-border: rgba(255, 255, 255, 0.07);
    --sidebar-hover: rgba(255, 255, 255, 0.12);
    --sidebar-hover-text: #ffffff;
    --sidebar-active-bg: #2563a8;
    --sidebar-active-text: #ffffff;
    --sidebar-focus-ring: rgba(77, 163, 255, 0.55);

    --shadow-sm: 0 1px 3px rgba(0, 0, 0, 0.45);
    --shadow-md: 0 4px 16px rgba(0, 0, 0, 0.5);
    --shadow-lg: 0 8px 32px rgba(0, 0, 0, 0.55);

    --focus-ring: rgba(77, 163, 255, 0.22);
    --row-hover: rgba(77, 163, 255, 0.08);
    --overlay: rgba(0, 0, 0, 0.65);

    --auth-gradient: linear-gradient(135deg, #1a3a5c 0%, #0d2137 50%, #0d0d0d 100%);
    --total-gradient-end: #1a3a5c;

    --accent-blue: #4da3ff;
    --accent-teal: #3db89a;
    --accent-purple: #9b7bd4;
    --accent-orange: #ffb366;
    --accent-green: #6ccb5f;
    --accent-indigo: #6b9fd4;
    --accent-cyan: #5cc8e0;
    --accent-red: #f1707a;
    --accent-gray: #8a8886;

    --sign-suma: #6ccb5f;
    --sign-resta: #f1707a;
}

/* —— Tema Corporativo —— */
[data-theme="corporate"] {
    color-scheme: light;

    --background: #f4f7fa;
    --surface: #ffffff;
    --surface-elevated: #ffffff;
    --card: #ffffff;
    --border: #d0dbe8;
    --border-subtle: rgba(44, 62, 80, 0.08);

    --text-primary: #2c3e50;
    --text-secondary: #5a6c7d;
    --text-muted: #7f8c9a;
    --text-inverse: #ffffff;

    --primary: #2f80ed;
    --primary-hover: #2568c7;
    --primary-subtle: #e8f1fd;

    --success: #1e7e34;
    --success-bg: #e6f4ea;
    --success-border: #a8dab5;

    --warning: #b86e00;
    --warning-bg: #fff4e5;
    --warning-border: #f5d9a8;

    --danger: #c0392b;
    --danger-bg: #fdecea;
    --danger-border: #f5b7b1;

    --info: #3a86ff;
    --info-bg: #e8f1fd;

    --header-bg: #27496d;
    --header-border: rgba(255, 255, 255, 0.12);
    --header-text: #ffffff;
    --header-text-muted: rgba(255, 255, 255, 0.72);
    --header-icon: rgba(255, 255, 255, 0.88);
    --header-icon-hover-bg: rgba(255, 255, 255, 0.12);

    --sidebar-bg: #1e3a5f;
    --sidebar-text: rgba(255, 255, 255, 0.92);
    --sidebar-text-muted: rgba(255, 255, 255, 0.62);
    --sidebar-border: rgba(255, 255, 255, 0.1);
    --sidebar-hover: rgba(255, 255, 255, 0.12);
    --sidebar-hover-text: #ffffff;
    --sidebar-active-bg: #2f80ed;
    --sidebar-active-text: #ffffff;
    --sidebar-focus-ring: rgba(58, 134, 255, 0.55);

    --shadow-sm: 0 1px 3px rgba(30, 58, 95, 0.08);
    --shadow-md: 0 4px 16px rgba(30, 58, 95, 0.1);
    --shadow-lg: 0 8px 32px rgba(30, 58, 95, 0.12);

    --focus-ring: rgba(47, 128, 237, 0.18);
    --row-hover: rgba(47, 128, 237, 0.05);
    --overlay: rgba(30, 58, 95, 0.45);

    --auth-gradient: linear-gradient(135deg, #27496d 0%, #1e3a5f 50%, #2c3e50 100%);
    --total-gradient-end: #e8f1fd;

    --accent-blue: #3a86ff;
    --accent-teal: #2a9d8f;
    --accent-purple: #5c6bc0;
    --accent-orange: #b86e00;
    --accent-green: #1e7e34;
    --accent-indigo: #27496d;
    --accent-cyan: #2a9d8f;
    --accent-red: #c0392b;
    --accent-gray: #5a6c7d;

    --sign-suma: #1e7e34;
    --sign-resta: #c0392b;
}

/* —— Reservado: Tema Personalizado —— */
[data-theme="custom"] {
    /* Variables definidas por configuración futura */
}

/* Alias legacy — compatibilidad con componentes existentes */
[data-theme="light"],
[data-theme="dark"],
[data-theme="corporate"],
[data-theme="custom"] {
    --color-primary: var(--primary);
    --color-primary-dark: var(--primary-hover);
    --color-primary-light: var(--primary-subtle);
    --color-black: var(--text-primary);
    --color-gray-900: var(--sidebar-bg);
    --color-gray-700: var(--text-secondary);
    --color-gray-500: var(--text-muted);
    --color-gray-300: var(--border);
    --color-gray-100: var(--surface-elevated);
    --color-white: var(--surface);
    --color-success: var(--success);
    --color-success-bg: var(--success-bg);
    --color-error: var(--danger);
    --color-error-bg: var(--danger-bg);
    --color-warning: var(--warning);
}

/* Transición suave al cambiar tema */
html.theme-transition,
html.theme-transition *,
html.theme-transition *::before,
html.theme-transition *::after {
    transition:
        background-color 0.25s ease,
        color 0.2s ease,
        border-color 0.25s ease,
        box-shadow 0.25s ease,
        fill 0.2s ease,
        stroke 0.2s ease !important;
}