/**
 * @file general.css
 * @brief Estilos comunes.
 * - Mantiene una variable global de tamaño de letra (–user-font-size)
 * - Mejora los temas Oscuro y Daltonismo para que todo quede legible
 * - Añade herencia tipográfica en cabeceras/navbars/dropdowns
 */
*{ margin:0; padding:0; box-sizing:border-box; }

:root{
  --navbar-height: 60px;

  /* Tamaño base ajustable por el usuario (persistido por tu JS preferenciasUsuario.js) */
  --user-font-size: 16px;
}

/* Toda la plataforma hereda de aquí; tu JS solo cambia esta variable */
html{ font-size: var(--user-font-size,16px); }

body{
  font-family: Arial, sans-serif;
  background:#f4f4f4;
  color:#222;
  line-height:1.5;
}

/* Asegura herencia tipográfica en zonas habituales (incluye cabeceras) */
body, button, input, select, textarea,
.navbar, .navbar *,
.navbar-login, .navbar-login *,
.submenu, .submenu * ,
.dropdown-content-login, .dropdown-content-login * {
  font-size: 1rem;
}

a{ color:inherit; text-decoration:none; }
a:hover{ text-decoration:underline; }

button{ cursor:pointer; border:none; outline:none; }
button:disabled{ opacity:.6; cursor:not-allowed; }

input,select,textarea{
  padding:.5rem; border:1px solid #ccc; border-radius:4px; width:100%;
  background:#fff; color:#222; font-size:1rem;
}
input:focus,select:focus,textarea:focus{ border-color:#00BDFF; outline:none; }

.text-center{ text-align:center; }
.mt-1{ margin-top:.5rem; } .mt-2{ margin-top:1rem; } .mt-3{ margin-top:1.5rem; }
.mb-1{ margin-bottom:.5rem; } .mb-2{ margin-bottom:1rem; } .mb-3{ margin-bottom:1.5rem; }

.wrapper{ margin-top: var(--navbar-height); }

/* ======================
   Tema OSCURO (global)
   ====================== */
body.modo-oscuro{ background:#0f1115; color:#e5e7eb; }
body.modo-oscuro .wrapper{ background:#0f1115; }
body.modo-oscuro a{ color:#93c5fd; }

/* Navbars */
body.modo-oscuro .navbar,
body.modo-oscuro .navbar-login{
  background:#1f2937; color:#fff;
}
body.modo-oscuro .navbar a,
body.modo-oscuro .navbar .nav-item,
body.modo-oscuro .navbar-login a,
body.modo-oscuro .navbar-login .dropbtn-login{ color:#fff; }

/* Submenús / dropdowns */
body.modo-oscuro .submenu,
body.modo-oscuro .dropdown-content-login{
  background:#1f2430; color:#e5e7eb; border:1px solid #303846;
}
body.modo-oscuro .submenu > div:hover,
body.modo-oscuro .dropdown-content-login a:hover{ background:#222a36; }

/* Formularios / tablas / alerts / botones */
body.modo-oscuro input,
body.modo-oscuro select,
body.modo-oscuro textarea{
  background:#151a22; color:#e5e7eb; border-color:#2b3340;
}
body.modo-oscuro .tabla-grid{ background:#151a22; }
body.modo-oscuro .tabla-grid th,
body.modo-oscuro .tabla-grid td{ border-color:#2b3340; color:#e5e7eb; }

body.modo-oscuro .alerta{ background:#1b2130; color:#e5e7eb; }
body.modo-oscuro .nuevo-btn,
body.modo-oscuro .btn{
  background:#2b3340; color:#fff;
}
body.modo-oscuro .nuevo-btn:hover,
body.modo-oscuro .btn:hover{ background:#364155; }

/* =========================
   Tema DALTONISMO (global)
   ========================= */
body.daltonismo{ background:#fffdf3; color:#000; }
body.daltonismo .wrapper{ background:#fffdf3; }
body.daltonismo a{ color:#0000EE; }

/* Navbars alto contraste */
body.daltonismo .navbar,
body.daltonismo .navbar-login{
  background:#0000FF; color:#fff;
}
body.daltonismo .navbar a,
body.daltonismo .navbar .nav-item,
body.daltonismo .navbar-login a,
body.daltonismo .navbar-login .dropbtn-login{ color:#fff; }

/* Submenús / dropdowns (fondo claro + texto negro) */
body.daltonismo .submenu,
body.daltonismo .dropdown-content-login{
  background:#E6F0FF; color:#000; border:1px solid #98b3ff;
}
body.daltonismo .submenu > div:hover,
body.daltonismo .dropdown-content-login a:hover{ background:#d7e7ff; }

/* Formularios / tablas / alerts / botones */
body.daltonismo input,
body.daltonismo select,
body.daltonismo textarea{
  background:#fff; color:#000; border-color:#666;
}
body.daltonismo .tabla-grid{ background:#fff; }
body.daltonismo .tabla-grid th,
body.daltonismo .tabla-grid td{ border-color:#666; color:#000; }

body.daltonismo .alerta{ background:#FFF9C4; color:#000; }
body.daltonismo .nuevo-btn,
body.daltonismo .btn{
  background:#0000FF; color:#fff;
}
body.daltonismo .nuevo-btn:hover,
body.daltonismo .btn:hover{ background:#0000d6; }

/* ======================
   Botones genéricos
   ====================== */
.nuevo-btn, .btn{
  display:inline-flex; align-items:center; gap:.5rem;
  background:#00BDFF; color:#fff; padding:.55rem .9rem;
  border-radius:8px; text-decoration:none; font-weight:600;
  transition: filter .15s ease, background .15s ease;
}
.nuevo-btn:hover, .btn:hover{ filter:brightness(.95); }

/* Evita textos “invisibles” dentro de badges/badges coloreados */
.badge, .pill, .tag{ color:#fff; }

/* Utilidades pequeñas que suelen aparecer en vistas */
.table { width:100%; border-collapse:collapse; }
.table th, .table td{ padding:.5rem; border:1px solid #ddd; }
