/* ============================================================
   Pulido visual global — Mi Salud También es Mental
   Sobrio y minimalista, respetando la paleta de marca:
   azul profundo #031b71 · azul acción #274196 · rosa #c680a4
   teal #9ddbed · neutrales fríos
   Se carga al final (head.php) para refinar main/master.css.
   ============================================================ */

/* ---------- Base ---------- */
body {
  background-color: #f6f7fb;
  color: #334155;
}

h1, h2, h3, h4, h5, h6 {
  color: #1f2a5e;
}

.text-gray-800 {
  color: #1f2a5e !important;
}

/* Contenido centrado y con aire en pantallas grandes */
#contenido {
  max-width: 960px;
  margin-left: auto;
  margin-right: auto;
}

/* ---------- Tarjetas ---------- */
.card {
  border: 1px solid #e6e9f2;
  border-radius: 14px;
  box-shadow: 0 1px 2px rgba(15, 23, 42, 0.04);
}

.card.shadow,
.card.shadow-sm {
  box-shadow: 0 1px 3px rgba(15, 23, 42, 0.06) !important;
}

.card-header {
  background-color: #ffffff;
  border-bottom: 1px solid #eef1f7;
  border-radius: 14px 14px 0 0 !important;
  padding: 14px 20px;
}

.card-header h6 {
  letter-spacing: 0.01em;
}

.card-body {
  padding: 20px;
}

/* Tarjetas anidadas (resultados individuales) */
.card .card {
  border-radius: 12px;
  box-shadow: none;
}

.card .card .card-header {
  padding: 12px 16px;
}

/* ---------- Botones ---------- */
.btn {
  border-radius: 10px;
  font-weight: 600;
}

.btn-accion:focus,
.btn-accion:active {
  box-shadow: 0 0 0 3px rgba(39, 65, 150, 0.18);
}

.btn-unam:focus,
.btn-unam:active {
  box-shadow: 0 0 0 3px rgba(17, 41, 65, 0.18);
}

/* ---------- Listas (menú de cuestionarios, materiales) ---------- */
.list-group-item {
  border-color: #eef1f7;
  padding: 14px 16px;
  color: #1f2a5e;
  font-weight: 600;
  transition: background-color 0.15s ease;
}

.list-group-item:hover {
  background-color: #f4f6fb;
}

/* ---------- Alertas ---------- */
.alert {
  border-radius: 12px;
}

.alert-info {
  background-color: #eaf6fb;
  border-color: #d3ecf6;
  color: #1f2a5e;
}

/* ---------- Formularios ---------- */
.form-control {
  border-radius: 10px;
  border-color: #dfe3ee;
}

.form-control:focus {
  border-color: #9ddbed;
  box-shadow: 0 0 0 3px rgba(157, 219, 237, 0.25);
}

/* ---------- Barra superior ---------- */
.topbar {
  box-shadow: none !important;
  border-bottom: 1px solid #e6e9f2;
}

/* ---------- Cuestionario ---------- */
.pregunta {
  color: #1e293b;
  font-size: 1.05rem;
  font-weight: 600;
  line-height: 1.55;
}

/* Loader alineado a la marca (antes morado ajeno a la paleta) */
.loader {
  border: 6px solid #edf0f7;
  border-top: 6px solid #274196;
  border-bottom: 6px solid #274196;
  width: 44px;
  height: 44px;
}

/* ---------- Modales ---------- */
.modal-content {
  border: none;
  border-radius: 16px;
  box-shadow: 0 12px 40px rgba(15, 23, 42, 0.16);
}

.modal-header {
  border-bottom: 1px solid #eef1f7;
}

.modal-footer {
  border-top: 1px solid #eef1f7;
}

/* ---------- Botón volver arriba ---------- */
.scroll-to-top {
  background: rgba(39, 65, 150, 0.55);
  border-radius: 10px;
}

.scroll-to-top:hover {
  background: #274196;
}