/* ============================================================
   KONDOMINIUS — HOJA DE ESTILO MATRIZ (css/kondominius.css)
   ------------------------------------------------------------
   Fuente única de la marca: colores, tipografía, radios,
   sombras y medidas del layout. Se carga ANTES que
   dashboard.css y que los estilos de cada página.

   Para cambiar la marca del sistema completo, cambia los
   valores de este archivo. El resto del CSS usa estas
   variables con un color de respaldo, así que si algún día
   esta hoja no carga, nada se rompe.
============================================================ */

:root {
    /* ── Marca (azul Microsoft) ───────────────────────────── */
    --knd-blue:          #0078d4;   /* principal: botones, enlaces, menú   */
    --knd-blue-rgb:      0, 120, 212; /* para rgba(var(--knd-blue-rgb), .1) */
    --knd-blue-dark:     #005a9e;   /* hover, degradados                    */
    --knd-blue-deep:     #004578;   /* fondos profundos (login)             */
    --knd-blue-soft:     #2b88d8;   /* acentos claros                       */
    --knd-blue-light:    #e5f1fb;   /* fondos suaves, chips                 */
    --knd-blue-lightest: #f3f8fd;   /* fondos muy suaves                    */
    --knd-gray-brand:    #a6a7a9;   /* gris del logo                        */

    /* ── Estados (se mantienen sus colores de siempre) ───── */
    --knd-success: #10b981;
    --knd-warning: #f59e0b;
    --knd-danger:  #ef4444;
    --knd-info:    #8b5cf6;

    /* ── Tipografía (estilo Microsoft / Segoe UI) ─────────── */
    --knd-font: 'Segoe UI', 'Segoe UI Variable', system-ui, -apple-system,
                BlinkMacSystemFont, Roboto, 'Helvetica Neue', Arial, sans-serif;

    /* ── Forma ────────────────────────────────────────────── */
    --knd-radius-sm: 8px;
    --knd-radius-md: 12px;
    --knd-radius-lg: 18px;
    --knd-shadow-sm: 0 1px 3px rgba(0, 0, 0, .08);
    --knd-shadow-md: 0 5px 15px rgba(0, 0, 0, .06);
    --knd-shadow-lg: 0 12px 32px rgba(0, 0, 0, .12);

    /* ── Layout ───────────────────────────────────────────── */
    --knd-sidebar-w: 256px;
    --knd-topbar-h:  64px;

    /* ── Alias para el CSS antiguo ───────────────────────────
       dashboard.css y las páginas usan estos nombres.
       Apuntan a la marca para no tener que renombrar nada. */
    --primary:       var(--knd-blue);
    --primary-dark:  var(--knd-blue-dark);
    --primary-light: var(--knd-blue-light);
}

/* Tipografía base de todo el sistema */
body {
    font-family: var(--knd-font);
}

/* Utilidades de marca (para HTML nuevo) */
.text-brand { color: var(--knd-blue) !important; }
.bg-brand   { background: var(--knd-blue) !important; color: #fff; }
.bg-brand-light { background: var(--knd-blue-light) !important; }
.border-brand { border-color: var(--knd-blue) !important; }