/**
 * Avisos del Lote A — 14-sep-2026.
 *
 * Fichero NUEVO, con peso posterior al de su librería: ni `style.css` ni
 * `panel-v3.css` ni `inscripcion-2026-09.css` se editan, y así no hace falta un
 * solo `!important` para ganar la especificidad. Mismo patrón que
 * `perfil-camper-viaje-2026.css`.
 *
 * Cuelga de DOS librerías porque cubre dos pantallas distintas:
 *   · `frontend/inscripcion-2026-09` → el paso 6 del funnel (plazas agotadas)
 *   · `frontend/panel-v3`            → la ficha del camper (tarjeta sanitaria)
 *
 * 🎨 El color de alerta es `--terracota` (#D2603A), que es el de la paleta v3. No
 *    se usa un rojo de Bootstrap ni uno inventado: la primera versión de esto
 *    llevaba una clase `G-color--rojo` **que no existe en ninguna hoja**, así que
 *    el aviso de «Plazas agotadas» se pintaba del color del texto normal y no
 *    avisaba de nada. Medido el 14-sep con un grep sobre todo el tema.
 */

/* ── Paso 6 del funnel: una actividad sin plazas ────────────────────────────
   La casilla ya va `#disabled` desde PHP; esto es solo que se vea por qué. */
.lc-aviso--agotado {
  color: #D2603A;
  font-weight: 600;
}

.lc-actividad--agotada,
.form-item:has(> .lc-actividad--agotada) {
  opacity: 0.55;
}

/* ── Ficha del camper: la tarjeta sanitaria ────────────────────────────────
   Marcado PROPIO. No hereda de `.panelv3-card`, que es `flex-direction: column`
   con el título a `flex: 1` para empujar el enlace al fondo de una celda de
   rejilla: a todo lo ancho, eso estiraba el recuadro media pantalla. */
.lc-tarjeta-sanitaria {
  display: flex;
  align-items: center;
  gap: 16px;
  padding: 18px 20px;
  /* ⚠️ `margin-block`, NUNCA el atajo `margin`. El panel centra sus hijos con
     `.panelv3 > * { max-width: 1060px; margin-inline: auto }` (panel-v3.css:18), y
     un `margin: 0 0 18px` en una hoja de peso mayor MATA ese `margin-inline: auto`:
     el bloque se pega al borde izquierdo mientras el resto de la página sigue
     centrado. A 1280 px no se ve —el contenedor ocupa casi todo— y en una pantalla
     ancha salta a la cara. Es el mismo fallo que tuvo `.editorial__body` el
     12-sep-2026, y por el mismo motivo: se midió estrecho.
     Sin `!important`: no hay que ganarle a nada, solo no pisarlo. */
  margin-block: 0 18px;
  border: 1px solid rgba(49, 86, 45, .12);
  border-radius: 18px;
  background: #fff;
}

.lc-tarjeta-sanitaria--falta {
  border-color: #D2603A;
  background: #FDF4F1;
}

.lc-tarjeta-sanitaria__icono {
  flex: 0 0 auto;
  width: 44px;
  height: 44px;
  display: grid;
  place-items: center;
  border-radius: 14px;
  background: #F8EFDC;
  color: #D2603A;
  font-size: 1.4rem;
}

/* El texto es lo que se estira, no el recuadro. */
.lc-tarjeta-sanitaria__texto {
  flex: 1 1 auto;
  min-width: 0;
}

.lc-tarjeta-sanitaria__titulo {
  margin: 0 0 2px;
  font-size: 1.02rem;
  font-weight: 700;
  line-height: 1.3;
  color: #22401F;
}

.lc-tarjeta-sanitaria__texto p {
  margin: 0;
  font-size: .875rem;
  line-height: 1.45;
  color: #272725;
}

.lc-tarjeta-sanitaria__ok {
  color: #5A5A56;
}

.lc-tarjeta-sanitaria__ok::before {
  content: '✓';
  color: #026936;
  font-weight: 700;
  margin-right: 6px;
}

.lc-tarjeta-sanitaria__boton {
  flex: 0 0 auto;
  display: inline-block;
  padding: 10px 18px;
  border-radius: 999px;
  background: #31562D;
  color: #fff;
  font-size: .87rem;
  font-weight: 700;
  text-decoration: none;
  white-space: nowrap;
}

.lc-tarjeta-sanitaria__boton:hover { background: #026936; color: #fff; }

.lc-tarjeta-sanitaria__boton--suave {
  background: transparent;
  color: #31562D;
  border: 1px solid rgba(49, 86, 45, .3);
}

.lc-tarjeta-sanitaria__boton--suave:hover { background: #F8EFDC; color: #22401F; }

/* En móvil, en columna y el botón a todo el ancho: es la acción de la pantalla. */
@media (max-width: 640px) {
  .lc-tarjeta-sanitaria {
    flex-direction: column;
    align-items: flex-start;
  }
  .lc-tarjeta-sanitaria__boton {
    width: 100%;
    text-align: center;
  }
}

/* ── Paso 7 del funnel: el seguro de accidentes va INCLUIDO ─────────────────
   En plano se leía como una línea más de la ayuda del paso. Es una cobertura que
   la familia YA tiene, así que se presenta como tal y fuera de la elección. */
.lc-seguro-incluido {
  display: flex;
  align-items: flex-start;
  gap: 14px;
  padding: 16px 18px;
  margin: 0 0 18px;
  border: 1px solid rgba(2, 105, 54, .28);
  border-radius: 16px;
  background: #F3F8F2;
}

.lc-seguro-incluido__marca {
  flex: 0 0 auto;
  padding: 4px 12px;
  border-radius: 999px;
  background: #026936;
  color: #fff;
  font-size: .74rem;
  font-weight: 700;
  letter-spacing: .02em;
  text-transform: uppercase;
}

.lc-seguro-incluido__texto { flex: 1 1 auto; min-width: 0; }

.lc-seguro-incluido__titulo {
  margin: 0 0 3px;
  font-weight: 700;
  color: #22401F;
}

.lc-seguro-incluido__texto p {
  margin: 0;
  font-size: .875rem;
  line-height: 1.45;
  color: #272725;
}

@media (max-width: 640px) {
  .lc-seguro-incluido { flex-direction: column; }
}

/* ── Paso 7: una prenda que va incluida ─────────────────────────────────────
   La camiseta staff del Curso de Monitores va a 0 € y preseleccionada, y sin
   letrero se lee como una más de pago que alguien marcó por error. */
.lc-prenda-gratis {
  display: inline-block;
  margin-left: 8px;
  padding: 2px 9px;
  border-radius: 999px;
  background: #026936;
  color: #fff;
  font-size: .68rem;
  font-weight: 700;
  letter-spacing: .04em;
  vertical-align: middle;
}