@font-face {
  font-family: "Poppins";
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("../fuentes/poppins-400.woff2") format("woff2");
}
@font-face {
  font-family: "Poppins";
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url("../fuentes/poppins-500.woff2") format("woff2");
}
@font-face {
  font-family: "Poppins";
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url("../fuentes/poppins-600.woff2") format("woff2");
}

:root {
  color-scheme: light;

  --ground: #F4F6F9;
  --surface: #FFFFFF;
  --surface-2: #EEF1F5;
  --ink: #393939;
  --ink-2: #5E6470;
  --ink-3: #686E7B;
  --title: #004d40;
  --line: #E2E6EC;
  --line-2: #CDD3DC;
  --line-control: #8695AB;
  --borde-tarjeta: #FFFFFF;

  --blue: #00796b;
  --blue-ink: #00796b;
  --blue-soft: #e3f2f0;
  --blue-line: #b9dfda;
  --on-blue: #FFFFFF;
  --cielo: #009688;

  --ok: #2E7D4F;
  --ok-soft: #EAF5EE;
  --warn: #955F00;
  --warn-soft: #FBEFD6;
  --bad: #B3261E;
  --bad-soft: #FBE3E1;
  --bad-fill: #B3261E;
  --on-bad: #FFFFFF;
  --slate: #4D5870;
  --slate-soft: #E3E7EF;

  --velo: rgba(28,36,75,.45);
  --sombra: 0 1px 2px rgba(16,47,115,.10), 0 4px 14px rgba(16,47,115,.10);
  --sombra-2: 0 18px 40px -20px rgba(28,36,75,.35);

  --r-caja: 0;
  --r-chip: 3px;
  --f: "Poppins", system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  --gutter: clamp(16px, 4vw, 48px);
  --logo-l: inline-block;
  --logo-d: none;

  --side-bg: #004d40;
  --side-hover: #00695c;
  --side-activo: #00796b;
  --side-ink: #FFFFFF;
  --side-ink-2: #E0ECF4;
  --side-ink-3: #CCE0EC;
  --side-line: #26776a;
  --logo-bloque: #004d40;
}

@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    color-scheme: dark;
    --ground: #0E1322;
    --surface: #161C30;
    --surface-2: #1F2740;
    --ink: #E4E7EE;
    --ink-2: #B3B9C7;
    --ink-3: #8790A3;
    --title: #EEF1F8;
    --line: #283049;
    --line-2: #36405E;
    --line-control: #576797;
    --borde-tarjeta: #283049;
    --blue: #26a69a;
    --blue-ink: #80cbc4;
    --blue-soft: #10332f;
    --blue-line: #1e5a53;
    --on-blue: #FFFFFF;
    --cielo: #10332f;
    --ok: #7CC49A;
    --ok-soft: #173327;
    --warn: #E0AE55;
    --warn-soft: #3A2D15;
    --bad: #F08A80;
    --bad-soft: #3E211E;
    --bad-fill: #B3261E;
    --on-bad: #FFFFFF;
    --slate: #A9B3CD;
    --slate-soft: #262B38;
    --velo: rgba(0,0,0,.6);
    --sombra: none;
    --sombra-2: 0 18px 40px -20px rgba(0,0,0,.8);
    --logo-l: none;
    --logo-d: inline-block;
  }
}

:root[data-theme="dark"] {
    color-scheme: dark;
    --ground: #0E1322;
    --surface: #161C30;
    --surface-2: #1F2740;
    --ink: #E4E7EE;
    --ink-2: #B3B9C7;
    --ink-3: #8790A3;
    --title: #EEF1F8;
    --line: #283049;
    --line-2: #36405E;
    --line-control: #576797;
    --borde-tarjeta: #283049;
    --blue: #26a69a;
    --blue-ink: #80cbc4;
    --blue-soft: #10332f;
    --blue-line: #1e5a53;
    --on-blue: #FFFFFF;
    --cielo: #10332f;
    --ok: #7CC49A;
    --ok-soft: #173327;
    --warn: #E0AE55;
    --warn-soft: #3A2D15;
    --bad: #F08A80;
    --bad-soft: #3E211E;
    --bad-fill: #B3261E;
    --on-bad: #FFFFFF;
    --slate: #A9B3CD;
    --slate-soft: #262B38;
    --velo: rgba(0,0,0,.6);
    --sombra: none;
    --sombra-2: 0 18px 40px -20px rgba(0,0,0,.8);
    --logo-l: none;
    --logo-d: inline-block;
}

:root[data-sidebar="marino"] {
  --side-bg: #1C244B;
  --side-hover: #27305C;
  --side-activo: #2B3668;
  --side-ink: #E6E9F2;
  --side-ink-2: #C3C9DA;
  --side-ink-3: #99A2BF;
  --side-line: #2E3866;
  --logo-bloque: #1C244B;
}