/* ========================================================= */
/* THEME: DEFAULT                                            */
/* Sistema Unificado de Variables                            */
/* ========================================================= */

/* Valores fallback y clases utilitarias */
:root {

    /* ================= PRIMARY ================= */
    --color-primary: #0f766e;
    --color-primary-hover: #115e59;
    --color-navy: #000080;

    /* ================= BACKGROUNDS ================= */
    --color-background-light: #f3f7f6;
    --color-background-dark: #0b1417;
    --color-surface-dark: #102027;
    --color-surface-light: #ffffff;
    --color-surface-muted: #eef4f2;
    --color-surface-subtle: #e6efec;
    --color-surface-muted-dark: #16272d;
    --color-surface-subtle-dark: #1a2d34;
    --color-border-dark: #22343d;
    --color-border-light: #d9e4e1;
    --color-border-strong: #b8c8c4;
    --color-border-strong-dark: #35515d;

    /* ================= TEXT ================= */
    --color-text-primary-light: #102027;
    --color-text-primary-dark: #ecf5f2;
    --color-text-muted-light: #5f746f;
    --color-text-muted-dark: #9fb2ad;
    --color-text-secondary-light: #28413c;
    --color-text-secondary-dark: #c7d8d4;
    --color-list-item-bg-light: #f8fbfa;
    --color-list-item-bg-hover-light: #f2f8f7;
    --color-list-item-bg-selected-light: #e6f3f1;
    --color-list-item-text-light: #102027;
    --color-list-item-text-muted-light: #5f746f;
    --color-list-item-bg-dark: #132228;
    --color-list-item-bg-hover-dark: #173038;
    --color-list-item-bg-selected-dark: #1b3a43;
    --color-list-item-text-dark: #ecf5f2;
    --color-list-item-text-muted-dark: #b5c7c2;
    --color-text-primary: var(--color-text-primary-light);
    --color-text-muted: var(--color-text-muted-light);
    --color-text-secondary: var(--color-text-secondary-light);
    --color-text-white: #ffffff;

    /* ================= STATES ================= */
    --color-success: #16a34a;
    --color-error: #dc2626;
    --color-warning: #d97706;
    --color-info: #0284c7;

    /* ================= RADIUS ================= */
    --radius-sm: 6px;
    --radius-md: 10px;
    --radius-lg: 16px;

    /* ================= SHADOW ================= */
    --shadow-sm: 0 1px 2px rgba(0, 0, 0, 0.05);
    --shadow-md: 0 4px 10px rgba(0, 0, 0, 0.08);

    /* ================= ACTIVE ALIASES ================= */
    --color-background: var(--color-background-light);
    --color-surface: var(--color-surface-light);
    --color-border: var(--color-border-light);
    --color-surface-raised: color-mix(in srgb, var(--color-surface-light) 92%, white);
    --color-surface-muted-active: var(--color-surface-muted);
    --color-surface-subtle-active: var(--color-surface-subtle);
    --color-list-item-bg: var(--color-list-item-bg-light);
    --color-list-item-bg-hover: var(--color-list-item-bg-hover-light);
    --color-list-item-bg-selected: var(--color-list-item-bg-selected-light);
    --color-list-item-text: var(--color-list-item-text-light);
    --color-list-item-text-muted: var(--color-list-item-text-muted-light);
    --sidebar-bg: color-mix(in srgb, var(--color-surface-light) 90%, var(--color-background-light));
    --sidebar-surface: color-mix(in srgb, var(--color-primary) 8%, var(--color-surface-light));
    --sidebar-border: var(--color-border-light);
    --sidebar-text: var(--color-text-primary);
    --sidebar-text-muted: var(--color-text-muted);
    --sidebar-text-hover: var(--color-text-primary);
    --sidebar-primary: var(--color-primary);
    --sideactionbar-light-bg: #f8fbfa;
    --sideactionbar-light-surface: #f2f8f7;
    --sideactionbar-light-border: #d9e4e1;
    --sideactionbar-light-text: #102027;
    --sideactionbar-light-text-muted: #5f746f;
    --sideactionbar-light-text-hover: #102027;
    --sideactionbar-light-primary: #0f766e;
    --sideactionbar-dark-bg: #0b1417;
    --sideactionbar-dark-surface: #16272d;
    --sideactionbar-dark-border: #22343d;
    --sideactionbar-dark-text: #d7e2df;
    --sideactionbar-dark-text-muted: #9eb0ab;
    --sideactionbar-dark-text-hover: #ffffff;
    --sideactionbar-dark-primary: #4fd1c5;
    --sideactionbar-bg: var(--sideactionbar-light-bg);
    --sideactionbar-surface: var(--sideactionbar-light-surface);
    --sideactionbar-border: var(--sideactionbar-light-border);
    --sideactionbar-text: var(--sideactionbar-light-text);
    --sideactionbar-text-muted: var(--sideactionbar-light-text-muted);
    --sideactionbar-text-hover: var(--sideactionbar-light-text-hover);
    --sideactionbar-primary: var(--sideactionbar-light-primary);
    --actionbar-light-shell-bg: #ffffff;
    --actionbar-light-shell-border: #d9e4e1;
    --actionbar-light-tooltip-bg: #0f172a;
    --actionbar-light-tooltip-text: #ffffff;
    --actionbar-light-neutral-color: #475569;
    --actionbar-light-neutral-bg: #e2e8f0;
    --actionbar-light-create-color: #15803d;
    --actionbar-light-create-bg: #dcfce7;
    --actionbar-light-edit-color: #1d4ed8;
    --actionbar-light-edit-bg: #dbeafe;
    --actionbar-light-save-color: #4338ca;
    --actionbar-light-save-bg: #e0e7ff;
    --actionbar-light-delete-color: #b91c1c;
    --actionbar-light-delete-bg: #fee2e2;
    --actionbar-light-cancel-color: #475569;
    --actionbar-light-cancel-bg: #e2e8f0;
    --actionbar-light-export-color: #0369a1;
    --actionbar-light-export-bg: #e0f2fe;
    --actionbar-light-apply-color: #a16207;
    --actionbar-light-apply-bg: #fef3c7;
    --actionbar-light-reset-color: #7c3aed;
    --actionbar-light-reset-bg: #f3e8ff;
    --actionbar-light-audit-color: #9a3412;
    --actionbar-light-audit-bg: #ffedd5;
    --actionbar-dark-shell-bg: #102027;
    --actionbar-dark-shell-border: #22343d;
    --actionbar-dark-tooltip-bg: #020617;
    --actionbar-dark-tooltip-text: #ecf5f2;
    --actionbar-dark-neutral-color: #c7d8d4;
    --actionbar-dark-neutral-bg: #22343d;
    --actionbar-dark-create-color: #86efac;
    --actionbar-dark-create-bg: #13311f;
    --actionbar-dark-edit-color: #93c5fd;
    --actionbar-dark-edit-bg: #14253c;
    --actionbar-dark-save-color: #c4b5fd;
    --actionbar-dark-save-bg: #26214a;
    --actionbar-dark-delete-color: #fca5a5;
    --actionbar-dark-delete-bg: #3f1818;
    --actionbar-dark-cancel-color: #c7d8d4;
    --actionbar-dark-cancel-bg: #22343d;
    --actionbar-dark-export-color: #7dd3fc;
    --actionbar-dark-export-bg: #133446;
    --actionbar-dark-apply-color: #fcd34d;
    --actionbar-dark-apply-bg: #3d2d12;
    --actionbar-dark-reset-color: #d8b4fe;
    --actionbar-dark-reset-bg: #302048;
    --actionbar-dark-audit-color: #fdba74;
    --actionbar-dark-audit-bg: #402313;
    --actionbar-shell-bg: var(--actionbar-light-shell-bg);
    --actionbar-shell-border: var(--actionbar-light-shell-border);
    --actionbar-tooltip-bg: var(--actionbar-light-tooltip-bg);
    --actionbar-tooltip-text: var(--actionbar-light-tooltip-text);
    --actionbar-neutral-color: var(--actionbar-light-neutral-color);
    --actionbar-neutral-bg: var(--actionbar-light-neutral-bg);
    --actionbar-create-color: var(--actionbar-light-create-color);
    --actionbar-create-bg: var(--actionbar-light-create-bg);
    --actionbar-edit-color: var(--actionbar-light-edit-color);
    --actionbar-edit-bg: var(--actionbar-light-edit-bg);
    --actionbar-save-color: var(--actionbar-light-save-color);
    --actionbar-save-bg: var(--actionbar-light-save-bg);
    --actionbar-delete-color: var(--actionbar-light-delete-color);
    --actionbar-delete-bg: var(--actionbar-light-delete-bg);
    --actionbar-cancel-color: var(--actionbar-light-cancel-color);
    --actionbar-cancel-bg: var(--actionbar-light-cancel-bg);
    --actionbar-export-color: var(--actionbar-light-export-color);
    --actionbar-export-bg: var(--actionbar-light-export-bg);
    --actionbar-apply-color: var(--actionbar-light-apply-color);
    --actionbar-apply-bg: var(--actionbar-light-apply-bg);
    --actionbar-reset-color: var(--actionbar-light-reset-color);
    --actionbar-reset-bg: var(--actionbar-light-reset-bg);
    --actionbar-audit-color: var(--actionbar-light-audit-color);
    --actionbar-audit-bg: var(--actionbar-light-audit-bg);
    --navbar-light-shell-bg: var(--color-surface-light);
    --navbar-light-shell-border: var(--color-border-light);
    --navbar-light-shell-shadow: #0f172a;
    --navbar-light-transparent: 0;
    --navbar-light-opacity: 0;
    --navbar-light-color-transparency: 0;
    --navbar-light-shell-bg-effective: rgba(255, 255, 255, 1);
    --navbar-light-shell-border-effective: rgba(217, 228, 225, 1);
    --navbar-light-shell-shadow-effective: #0f172a;
    --navbar-light-brand-bg: var(--color-primary);
    --navbar-light-brand-text: var(--color-text-primary-light);
    --navbar-light-link: var(--color-text-secondary-light);
    --navbar-light-link-hover: var(--color-primary);
    --navbar-light-text-outline-color: var(--color-text-primary-light);
    --navbar-light-text-outline-enabled: 1;
    --navbar-light-text-outline-width: 0px;
    --navbar-light-panel-bg: var(--color-surface-light);
    --navbar-light-panel-border: var(--color-border-light);
    --navbar-light-panel-bg-effective: rgba(255, 255, 255, 1);
    --navbar-light-panel-border-effective: rgba(217, 228, 225, 1);
    --navbar-dark-shell-bg: #0f172a;
    --navbar-dark-shell-border: #334155;
    --navbar-dark-shell-shadow: #020617;
    --navbar-dark-transparent: 0;
    --navbar-dark-opacity: 0;
    --navbar-dark-color-transparency: 0;
    --navbar-dark-shell-bg-effective: rgba(15, 23, 42, 1);
    --navbar-dark-shell-border-effective: rgba(51, 65, 85, 1);
    --navbar-dark-shell-shadow-effective: #020617;
    --navbar-dark-brand-bg: #14b8a6;
    --navbar-dark-brand-text: #f8fafc;
    --navbar-dark-link: #e2e8f0;
    --navbar-dark-link-hover: #5eead4;
    --navbar-dark-text-outline-color: #f8fafc;
    --navbar-dark-text-outline-enabled: 1;
    --navbar-dark-text-outline-width: 0px;
    --navbar-dark-panel-bg: #0f172a;
    --navbar-dark-panel-border: #334155;
    --navbar-dark-panel-bg-effective: rgba(15, 23, 42, 1);
    --navbar-dark-panel-border-effective: rgba(51, 65, 85, 1);
}

html.dark {
    --color-background: var(--color-background-dark);
    --color-surface: var(--color-surface-dark);
    --color-border: var(--color-border-dark);
    --color-surface-muted: var(--color-surface-muted-dark);
    --color-surface-subtle: var(--color-surface-subtle-dark);
    --color-border-strong: var(--color-border-strong-dark);
    --color-text-primary: var(--color-text-primary-dark);
    --color-text-muted: var(--color-text-muted-dark);
    --color-text-secondary: var(--color-text-secondary-dark);
    --color-surface-raised: color-mix(in srgb, var(--color-surface-dark) 92%, black);
    --color-surface-muted-active: var(--color-surface-muted-dark);
    --color-surface-subtle-active: var(--color-surface-subtle-dark);
    --color-list-item-bg: var(--color-list-item-bg-dark);
    --color-list-item-bg-hover: var(--color-list-item-bg-hover-dark);
    --color-list-item-bg-selected: var(--color-list-item-bg-selected-dark);
    --color-list-item-text: var(--color-list-item-text-dark);
    --color-list-item-text-muted: var(--color-list-item-text-muted-dark);
    --sidebar-bg: color-mix(in srgb, var(--color-surface-dark) 88%, black);
    --sidebar-surface: color-mix(in srgb, var(--color-primary) 12%, var(--color-surface-dark));
    --sidebar-border: var(--color-border-dark);
    --sidebar-text: #d7e2df;
    --sidebar-text-muted: #9eb0ab;
    --sidebar-text-hover: #ffffff;
    --sidebar-primary: #4fd1c5;
    --sideactionbar-bg: var(--sideactionbar-dark-bg);
    --sideactionbar-surface: var(--sideactionbar-dark-surface);
    --sideactionbar-border: var(--sideactionbar-dark-border);
    --sideactionbar-text: var(--sideactionbar-dark-text);
    --sideactionbar-text-muted: var(--sideactionbar-dark-text-muted);
    --sideactionbar-text-hover: var(--sideactionbar-dark-text-hover);
    --sideactionbar-primary: var(--sideactionbar-dark-primary);
    --actionbar-shell-bg: var(--actionbar-dark-shell-bg);
    --actionbar-shell-border: var(--actionbar-dark-shell-border);
    --actionbar-tooltip-bg: var(--actionbar-dark-tooltip-bg);
    --actionbar-tooltip-text: var(--actionbar-dark-tooltip-text);
    --actionbar-neutral-color: var(--actionbar-dark-neutral-color);
    --actionbar-neutral-bg: var(--actionbar-dark-neutral-bg);
    --actionbar-create-color: var(--actionbar-dark-create-color);
    --actionbar-create-bg: var(--actionbar-dark-create-bg);
    --actionbar-edit-color: var(--actionbar-dark-edit-color);
    --actionbar-edit-bg: var(--actionbar-dark-edit-bg);
    --actionbar-save-color: var(--actionbar-dark-save-color);
    --actionbar-save-bg: var(--actionbar-dark-save-bg);
    --actionbar-delete-color: var(--actionbar-dark-delete-color);
    --actionbar-delete-bg: var(--actionbar-dark-delete-bg);
    --actionbar-cancel-color: var(--actionbar-dark-cancel-color);
    --actionbar-cancel-bg: var(--actionbar-dark-cancel-bg);
    --actionbar-export-color: var(--actionbar-dark-export-color);
    --actionbar-export-bg: var(--actionbar-dark-export-bg);
    --actionbar-apply-color: var(--actionbar-dark-apply-color);
    --actionbar-apply-bg: var(--actionbar-dark-apply-bg);
    --actionbar-reset-color: var(--actionbar-dark-reset-color);
    --actionbar-reset-bg: var(--actionbar-dark-reset-bg);
    --actionbar-audit-color: var(--actionbar-dark-audit-color);
    --actionbar-audit-bg: var(--actionbar-dark-audit-bg);
}

body {
    background-color: var(--color-background);
    color: var(--color-text-primary);
}

/* ================= CLASES ================= */
.bg-primary {
    background-color: var(--color-primary) !important;
}

.hover\:bg-primary-hover:hover {
    background-color: var(--color-primary-hover) !important;
}

.text-primary {
    color: var(--color-primary) !important;
}

.bg-background {
    background-color: var(--color-background) !important;
}

.bg-surface {
    background-color: var(--color-surface) !important;
}

.bg-surface-muted {
    background-color: var(--color-surface-muted-active) !important;
}

.bg-surface-subtle {
    background-color: var(--color-surface-subtle-active) !important;
}

.text-text-primary {
    color: var(--color-text-primary) !important;
}

.text-text-muted {
    color: var(--color-text-muted) !important;
}

.border-border {
    border-color: var(--color-border) !important;
}

.border-border-light {
    border-color: var(--color-border-light) !important;
}

.bg-white {
    background-color: var(--color-surface) !important;
}

.bg-gray-50,
.bg-slate-50,
.bg-slate-100 {
    background-color: var(--color-surface-muted-active) !important;
}

.text-slate-900,
.text-slate-800,
.text-slate-700,
.text-slate-600 {
    color: var(--color-text-primary) !important;
}

.text-slate-500,
.text-slate-400 {
    color: var(--color-text-muted) !important;
}

.border-gray-100,
.border-gray-200,
.border-gray-300,
.border-slate-200,
.border-slate-300 {
    border-color: var(--color-border-light) !important;
}

html.dark .dark\:bg-slate-800,
html.dark .dark\:bg-slate-900,
html.dark .dark\:bg-slate-900\/20,
html.dark .dark\:bg-slate-900\/30,
html.dark .dark\:bg-slate-900\/40,
html.dark .dark\:bg-background-dark,
html.dark .dark\:bg-background-dark\/20,
html.dark .dark\:bg-background-dark\/30,
html.dark .dark\:bg-background-dark\/50,
html.dark .dark\:bg-surface-dark,
html.dark .dark\:bg-surface-dark\/95 {
    background-color: var(--color-surface-dark) !important;
}

html.dark .dark\:text-white,
html.dark .dark\:text-slate-300,
html.dark .dark\:text-slate-400 {
    color: var(--color-text-white) !important;
}

html.dark .dark\:border-slate-600,
html.dark .dark\:border-slate-700,
html.dark .dark\:border-slate-800,
html.dark .dark\:border-border-dark {
    border-color: var(--color-border-dark) !important;
}

.bg-background-light {
    background-color: var(--color-background-light) !important;
}

.bg-background-dark {
    background-color: var(--color-background-dark) !important;
}

.bg-surface-dark {
    background-color: var(--color-surface-dark) !important;
}

.border-border-dark {
    border-color: var(--color-border-dark) !important;
}

.text-white {
    color: var(--color-text-white) !important;
}