/*
  Sistema de Diseño DGAIA
  Fase 1 · Núcleo visual
  Principio: Simple por fuera. Inteligente por dentro.
*/

:root{
  color-scheme:light dark;

  /* Tipografía */
  --dgaia-fuente:
    Inter,
    ui-sans-serif,
    system-ui,
    -apple-system,
    BlinkMacSystemFont,
    "Segoe UI",
    sans-serif;

  --dgaia-peso-normal:400;
  --dgaia-peso-medio:600;
  --dgaia-peso-fuerte:750;
  --dgaia-peso-maximo:850;

  --dgaia-texto-xs:.78rem;
  --dgaia-texto-sm:.88rem;
  --dgaia-texto-md:1rem;
  --dgaia-texto-lg:1.18rem;
  --dgaia-texto-xl:1.55rem;
  --dgaia-texto-2xl:clamp(2rem,4vw,3.5rem);

  /* Espaciado */
  --dgaia-espacio-1:4px;
  --dgaia-espacio-2:8px;
  --dgaia-espacio-3:12px;
  --dgaia-espacio-4:16px;
  --dgaia-espacio-5:20px;
  --dgaia-espacio-6:24px;
  --dgaia-espacio-7:32px;
  --dgaia-espacio-8:40px;
  --dgaia-espacio-9:52px;
  --dgaia-espacio-10:68px;

  /* Forma */
  --dgaia-radio-sm:9px;
  --dgaia-radio-md:13px;
  --dgaia-radio-lg:18px;
  --dgaia-radio-xl:24px;
  --dgaia-radio-redondo:999px;

  /* Movimiento */
  --dgaia-transicion-rapida:140ms ease;
  --dgaia-transicion-normal:220ms ease;

  /* Modo claro */
  --dgaia-fondo:#f2f6f4;
  --dgaia-superficie:#ffffff;
  --dgaia-superficie-secundaria:#edf3f0;
  --dgaia-superficie-elevada:#ffffff;

  --dgaia-texto:#16241f;
  --dgaia-texto-secundario:#596c65;
  --dgaia-texto-suave:#778983;
  --dgaia-inverso:#f7fffc;

  --dgaia-borde:#d5e1dc;
  --dgaia-borde-fuerte:#b9cbc4;

  --dgaia-marca:#087f72;
  --dgaia-marca-fuerte:#05675e;
  --dgaia-marca-suave:#dcefeb;
  --dgaia-marca-contraste:#ffffff;

  --dgaia-correcto:#28764f;
  --dgaia-correcto-fondo:#e5f4eb;
  --dgaia-aviso:#846000;
  --dgaia-aviso-fondo:#f8efd4;
  --dgaia-error:#a63636;
  --dgaia-error-fondo:#f8e5e5;
  --dgaia-informacion:#245f91;
  --dgaia-informacion-fondo:#e4eef7;

  --dgaia-sombra-sm:0 5px 18px rgba(24,54,46,.07);
  --dgaia-sombra-md:0 16px 40px rgba(24,54,46,.11);
  --dgaia-sombra-lg:0 28px 75px rgba(24,54,46,.15);

  --dgaia-ancho-contenido:1440px;
  --dgaia-ancho-texto:760px;
}

[data-dgaia-tema="oscuro"]{
  color-scheme:dark;

  --dgaia-fondo:#0d1714;
  --dgaia-superficie:#16221e;
  --dgaia-superficie-secundaria:#1b2a25;
  --dgaia-superficie-elevada:#20302a;

  --dgaia-texto:#f1faf7;
  --dgaia-texto-secundario:#b1c2bc;
  --dgaia-texto-suave:#8fa39c;
  --dgaia-inverso:#10201b;

  --dgaia-borde:#31433c;
  --dgaia-borde-fuerte:#476057;

  --dgaia-marca:#3fc2ae;
  --dgaia-marca-fuerte:#69d4c3;
  --dgaia-marca-suave:#173b34;
  --dgaia-marca-contraste:#09221d;

  --dgaia-correcto:#76c99a;
  --dgaia-correcto-fondo:#183529;
  --dgaia-aviso:#e4bd63;
  --dgaia-aviso-fondo:#3b3118;
  --dgaia-error:#ef9292;
  --dgaia-error-fondo:#3e2020;
  --dgaia-informacion:#8bbcea;
  --dgaia-informacion-fondo:#193149;

  --dgaia-sombra-sm:0 5px 18px rgba(0,0,0,.18);
  --dgaia-sombra-md:0 16px 40px rgba(0,0,0,.26);
  --dgaia-sombra-lg:0 28px 75px rgba(0,0,0,.34);
}

@media(prefers-color-scheme:dark){
  :root:not([data-dgaia-tema="claro"]){
    color-scheme:dark;

    --dgaia-fondo:#0d1714;
    --dgaia-superficie:#16221e;
    --dgaia-superficie-secundaria:#1b2a25;
    --dgaia-superficie-elevada:#20302a;

    --dgaia-texto:#f1faf7;
    --dgaia-texto-secundario:#b1c2bc;
    --dgaia-texto-suave:#8fa39c;
    --dgaia-inverso:#10201b;

    --dgaia-borde:#31433c;
    --dgaia-borde-fuerte:#476057;

    --dgaia-marca:#3fc2ae;
    --dgaia-marca-fuerte:#69d4c3;
    --dgaia-marca-suave:#173b34;
    --dgaia-marca-contraste:#09221d;

    --dgaia-correcto:#76c99a;
    --dgaia-correcto-fondo:#183529;
    --dgaia-aviso:#e4bd63;
    --dgaia-aviso-fondo:#3b3118;
    --dgaia-error:#ef9292;
    --dgaia-error-fondo:#3e2020;
    --dgaia-informacion:#8bbcea;
    --dgaia-informacion-fondo:#193149;

    --dgaia-sombra-sm:0 5px 18px rgba(0,0,0,.18);
    --dgaia-sombra-md:0 16px 40px rgba(0,0,0,.26);
    --dgaia-sombra-lg:0 28px 75px rgba(0,0,0,.34);
  }
}

*,
*::before,
*::after{
  box-sizing:border-box;
}

html{
  min-height:100%;
  background:var(--dgaia-fondo);
}

body{
  margin:0;
  min-height:100vh;
  font-family:var(--dgaia-fuente);
  color:var(--dgaia-texto);
  background:var(--dgaia-fondo);
  line-height:1.55;
  text-rendering:optimizeLegibility;
  -webkit-font-smoothing:antialiased;
}

button,
input,
select,
textarea{
  font:inherit;
}

img,
svg{
  max-width:100%;
}

a{
  color:inherit;
}

:focus-visible{
  outline:3px solid color-mix(in srgb,var(--dgaia-marca) 48%,transparent);
  outline-offset:3px;
}

::selection{
  color:var(--dgaia-marca-contraste);
  background:var(--dgaia-marca);
}
