/* ==========================================================================
   OnnixConnect — Design tokens (variables CSS)
   Sistema de diseño Sneat/Bootstrap5. Migración visual onnix-v2.
   NO modifica markup existente. Aplica solo cuando body tiene clase .onnix-v2
   (salvo excepciones marcadas, ver comentarios).
   ========================================================================== */

:root {
    --bg-page: #F1F5F9;
    --bg-surface: #FFFFFF;
    --bg-elevated: #E7ECF1;
    /* Antes #E2E8F0 casi igual a --bg-elevated: cajas de sección sin delineado. */
    --border-color: #CBD5E1;
    --input-border: #94A3B8;

    --text-heading: #0F172A;
    --text-body: #1E293B;
    --text-label: #334155;
    --text-muted: #64748B;

    --primary: #2563EB;
    --primary-hover: #1D4ED8;
    --primary-shadow: rgba(37,99,235,0.15);
    --primary-tint: rgba(37,99,235,0.10);

    --success: #16A34A;
    --danger: #DC2626;

    --warning: #F59E0B;
    --warning-bg: #FFEDD5;
    --warning-text: #9A3412;

    --shadow-card: 0 10px 15px rgba(15,23,42,0.05), 0 4px 6px rgba(15,23,42,0.03);

    --sidebar-width: 260px;
    --sidebar-width-collapsed: 72px;
    --navbar-height: 64px;
}

html.dark {
    --bg-page: #0F172A;
    --bg-surface: #1E293B;
    --bg-elevated: #334155;
    /* Antes #334155 (= --bg-elevated): cajas alert-secondary / cards / inputs
       sin borde visible en dark (presupuesto y resto de forms). */
    --border-color: #475569;
    --input-border: #64748B;

    --text-heading: #F8FAFC;
    --text-body: #E2E8F0;
    --text-label: #CBD5E1;
    --text-muted: #94A3B8;

    --primary: #60A5FA;
    --primary-hover: #3B82F6;
    --primary-shadow: rgba(96,165,250,0.25);
    --primary-tint: rgba(96,165,250,0.15);

    --success: #22C55E;
    --danger: #EF4444;

    --warning: #FBBF24;
    --warning-bg: rgba(67,20,7,0.4);
    --warning-text: #FB923C;

    --shadow-card: 0 10px 15px rgba(0,0,0,0.3);
}

/* --------------------------------------------------------------------------
   Reglas base — scopeadas a body.onnix-v2 para no afectar las vistas
   actuales hasta que se active explícitamente el nuevo sistema de diseño.
   -------------------------------------------------------------------------- */

/* html no tenía fondo propio: quedaba blanco del canvas del navegador y se
   veía como una línea/franja clara pegada al borde superior en modo oscuro
   (el body sí cambiaba, html no). Se fuerza acá para los dos temas. */
html {
    background-color: var(--bg-page);
    margin: 0;
}

body.onnix-v2 {
    font-family: 'Public Sans', system-ui, sans-serif;
    background-color: var(--bg-page);
    color: var(--text-body);
    margin: 0;
}

/* Scrollbar custom (thin). scrollbar-width no se puede scopear de forma
   confiable a un selector de descendiente en todos los navegadores, se deja
   global porque no altera la apariencia visual de las vistas existentes. */
* {
    scrollbar-width: thin;
    scrollbar-color: var(--border-color) transparent;
}

*::-webkit-scrollbar {
    width: 6px;
    height: 6px;
}

*::-webkit-scrollbar-track {
    background: transparent;
}

*::-webkit-scrollbar-thumb {
    background-color: var(--border-color);
    border-radius: 20px;
}

/* Fix de foco pegado en botones Bootstrap (evita que el estado :focus
   quede "pegado" tras un click con mouse) */
body.onnix-v2 .btn:focus,
body.onnix-v2 .btn:focus-visible {
    box-shadow: none;
}

body.onnix-v2 .btn:focus:not(:focus-visible) {
    box-shadow: none;
    outline: none;
}