/* ═══════════════════════════════════════════════════════════════════════
   css/login.css — la hoja de entrar
   (maquetas `landing_v5.html`, `buscador_v1.html`: banda roja, título
   gigante en Archivo, prosa en Newsreader, avisos en tres registros).
   Vía `views/_chrome.php` + `css/base.css`. Acá sólo lo propio de login.
   ═══════════════════════════════════════════════════════════════════════ */

/* ── Banda roja, mismo lenguaje que el buscador ─────────────────────── */
.entrar { background: var(--rojo); color: var(--blanco); padding: clamp(2.5rem, 5vw, 5rem) var(--margen); }
.entrar-grid { display: grid; grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); gap: 2.5rem clamp(2rem, 5vw, 5rem); align-items: center; max-width: 1600px; margin: 0 auto; }
.entrar h1 { font-size: clamp(3rem, 7vw, 7rem); }
.entrar .bajada { margin-top: 1.25rem; font-size: clamp(1.1rem, 1.5vw, 1.35rem); max-width: 38ch; opacity: .95; }
.entrar .bajada a { text-decoration: underline; text-underline-offset: .2em; text-decoration-color: rgba(255,255,255,.55); }
.entrar .bajada a:hover { text-decoration-color: currentColor; }

/* ── La hoja blanca con el formulario ───────────────────────────────── */
.hoja-entrar { background: var(--blanco); color: var(--tinta); border-radius: var(--r); box-shadow: 0 2px 0 rgba(0,0,0,.2), 0 30px 60px -30px rgba(0,0,0,.45); padding: clamp(1.5rem, 2.5vw, 2.5rem); display: grid; gap: 1.25rem; align-content: start; }
.hoja-entrar form { display: grid; gap: 1.25rem; }
.hoja-entrar .campo-grupo { display: grid; gap: .45rem; }
.hoja-entrar .etiqueta { color: var(--tinta); }
.hoja-entrar input.campo { width: 100%; border: 1.5px solid var(--gris-3); border-radius: var(--r); background: var(--blanco); padding: .95rem 1.1rem; font: 500 1.2rem/1.2 var(--f-titulo); color: var(--tinta); }
.hoja-entrar input.campo::placeholder { color: var(--tinta-3); font-weight: 400; }
.hoja-entrar input.campo:focus { outline: none; border-color: var(--tinta); box-shadow: 0 0 0 3px rgba(166,27,43,.18); }
/* F6 registro — el motivo es un textarea con la misma caja que los inputs. */
.hoja-entrar textarea.campo { min-height: 7rem; resize: vertical; font: 400 1.1rem/1.5 var(--f-texto); }
.hoja-entrar textarea.campo:focus { outline: none; border-color: var(--tinta); box-shadow: 0 0 0 3px rgba(166,27,43,.18); }
.hoja-entrar .boton { width: 100%; }
.cuenta-nota { font-family: var(--f-texto); font-size: 1.08rem; line-height: 1.45; color: var(--tinta-2); border-top: 1px solid var(--gris-2); padding-top: 1rem; }
.cuenta-nota a { color: var(--tinta); text-decoration: underline; text-underline-offset: .2em; }

/* La leyenda del reCAPTCHA y el badge oculto viven en `css/base.css` (los usa también /buscar). */

/* ── Avisos: los tres registros del buscador, en blanco sobre rojo ──── */
.avisos { display: grid; gap: .6rem; }
.avisos:empty { display: none; }
.aviso { display: grid; grid-template-columns: auto 1fr; gap: 1rem; align-items: baseline; padding: .9rem 1.1rem; background: var(--gris); border-left: 3px solid var(--tinta); border-radius: 0 var(--r) var(--r) 0; font-family: var(--f-texto); font-size: 1.1rem; line-height: 1.4; color: var(--tinta); }
.aviso .rotulo { font: 700 .72rem/1.4 var(--f-titulo); letter-spacing: .12em; text-transform: uppercase; white-space: nowrap; }
.aviso-adv { border-left-color: var(--rojo); }
.aviso-adv .rotulo { color: var(--rojo); }
.aviso-err { background: var(--tinta); color: var(--blanco); border-left-color: var(--tinta); }
/* F6 registro — confirmación neutra (no hay verde en la paleta). */
.aviso-ok { border-left-color: var(--tinta); }
.aviso-ok .rotulo { color: var(--tinta); }

@media (max-width: 900px) {
  .entrar-grid { grid-template-columns: 1fr; }
  .entrar h1 { font-size: clamp(2.6rem, 12vw, 4rem); }
}
/* 2026-09-28 (T3) — mismo arreglo que los avisos de /buscar: en la hoja de
   un teléfono el rótulo al costado le dejaba al texto una columna de ~100 px. */
@media (max-width: 640px) {
  .aviso { grid-template-columns: minmax(0, 1fr); gap: .25rem; font-size: 1.02rem; }
  .aviso > span:last-child { overflow-wrap: break-word; }
}
