:root {
  --tinta: #050335;
  --menta: #17C3A5;
  --menta-700: #0B7A67;
  --menta-100: #D5F3EC;
  --papel: #F2F5F8;
  --superficie: #FFFFFF;
  --linea: #D8E0E8;
  --borde-campo: #74859B;
  --texto: #1E293B;
  --texto-2: #475569;
  --ambar-fondo: #FFF4D6;
  --ambar-texto: #8A4B00;
  --rojo: #B42318;
}

/* ==============================================================
   FOCO VISIBLE GLOBAL (UI-02)
   Anillo de enfoque accesible por teclado (:focus-visible)
   ============================================================== */
:where(a, button, input, select, textarea, [tabindex]):focus-visible {
  outline: 3px solid var(--menta-700) !important;
  outline-offset: 2px !important;
}

/* Sobre fondos oscuros o de tipo tinta, se usa la variable --menta para mayor contraste */
body.dark-theme :where(a, button, input, select, textarea, [tabindex]):focus-visible,
.dark-mode :where(a, button, input, select, textarea, [tabindex]):focus-visible {
  outline-color: var(--menta) !important;
}