/* Módulo 11 — Otros / Mail / Mensuales. Vanilla, sin frameworks.
   Botones grandes, responsive. El coordinador puede prefijar o fusionar
   con el CSS global de la app; las clases mod11-* no colisionan. */
.mod11-seccion { max-width: 720px; margin: 0 auto; padding: 16px; font-size: 18px; line-height: 1.45; }
.mod11-seccion h2 { font-size: 28px; margin: 8px 0 16px; }
.mod11-seccion h3 { font-size: 22px; margin: 24px 0 8px; }
.mod11-resumen { border: 1px solid #ccc; border-radius: 8px; padding: 12px 16px; margin: 16px 0; }
.mod11-resumen p { margin: 6px 0; }
.mod11-filtros { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; margin: 16px 0; }
.mod11-filtros label { font-weight: bold; }
.mod11-lista { padding-left: 20px; }
.mod11-lista li { margin: 10px 0; }
.mod11-vacio { color: #555; font-style: italic; }
.mod11-cartel { font-size: 24px; font-weight: bold; border: 2px solid #888; border-radius: 8px; padding: 16px; text-align: center; }
.mod11-form { display: flex; flex-direction: column; gap: 8px; margin-top: 16px; }
.mod11-form label { font-weight: bold; margin-top: 8px; }
.mod11-form input, .mod11-form select, .mod11-filtros input, .mod11-filtros select {
  font-size: 18px; padding: 12px; border: 1px solid #999; border-radius: 8px; width: 100%; box-sizing: border-box;
}
.mod11-form input[type="checkbox"] { width: auto; }
.btn-grande { font-size: 20px; padding: 16px; border-radius: 10px; cursor: pointer; margin-top: 12px; }
.btn-volver { font-size: 18px; padding: 12px 18px; border-radius: 10px; cursor: pointer; }
.btn-chico { font-size: 16px; padding: 8px 12px; border-radius: 8px; cursor: pointer; margin-left: 6px; }
.btn-peligro { color: #900; }
.mod11-error { color: #900; font-weight: bold; }
.mod11-reglas { border-top: 1px solid #ccc; margin-top: 24px; }
@media (max-width: 480px) {
  .mod11-seccion { padding: 12px; font-size: 17px; }
  .btn-grande, .btn-volver { width: 100%; }
}
