/* Alternativa autoalojada: si el sitio debe funcionar sin Google Fonts,
   copiar space-grotesk-var.woff2 e instrument-sans-var.woff2 a
   app/assets/fonts/, declararlos aquí con @font-face y quitar el <link>
   de index.html. Ver ../README-fuentes.md.

   =================================================================== */
/* =========================================================================
   ATBC 2027 — Capa de marca Connect
   Se carga DESPUÉS de views.css. Cubre lo que no vive en tokens.css:
   valores fijos en components.css, el bloque de marca del encabezado y
   los detalles de canto recto. No cambia ningún contenido ni estructura.
   ========================================================================= */

/* ------------------------- Banner del congreso ---------------------- */
/* El vino #6e0f17 se sustituye por el verde de la marca. */
.site-banner { background: #0B3B36; }

/* Filete dorado bajo el banner: la única línea de acento de la página. */
.site-banner { border-bottom: 3px solid #E5C46B; }

/* ------------------------------ Encabezado -------------------------- */
.site-header { border-bottom: 1px solid var(--border); }

/* Marca Connect a la izquierda del nav (ver README para el marcado). */
.brand__mark {
  background: #0B3B36;
  border-radius: 0;
  box-shadow: none;
}
.brand__name { font-family: var(--font-display); letter-spacing: -.03em; font-weight: 500; }
.brand__name b { color: var(--green-800); font-weight: 500; }
.brand__sub {
  font-family: var(--font-display); font-weight: 500;
  letter-spacing: .18em; text-transform: uppercase; font-size: 10px;
}

/* Nav: el activo se marca con línea dorada, no con pastilla. */
.nav a {
  border-radius: 0;
  border-bottom: 2px solid transparent;
  font-family: var(--font-display);
  font-weight: 500;
}
.nav a.is-active {
  background: transparent;
  color: var(--green-800);
  border-bottom-color: #E5C46B;
}
.nav a:hover { background: var(--surface-3); }
.nav__ext { color: var(--muted); font-size: var(--fs-sm); font-weight: 500; padding: var(--sp-2) var(--sp-3); }

/* --------------------------- Tipografía ----------------------------- */
h1, h2, h3, h4 { font-family: var(--font-display); font-weight: 500; letter-spacing: -.025em; }
.eyebrow { font-family: var(--font-display); letter-spacing: .2em; color: #C79B2E; }
.stat__num { font-family: var(--font-display); font-weight: 300; letter-spacing: -.03em; }
.mono, .band__time { font-family: var(--font-display); font-weight: 500; }

/* ------------------------------ Botones ----------------------------- */
.btn { font-family: var(--font-display); font-weight: 500; border-radius: 0; }
.btn:hover { transform: none; }
.btn--primary { box-shadow: none; }
.btn--primary:hover { background: var(--green-900); }
.nav__upload { background: #E5C46B; border-color: #E5C46B; color: #0B3B36; }
.nav__upload:hover { background: #EBD79B; border-color: #EBD79B; color: #0B3B36; }

/* ------------------------- Chips y distintivos ---------------------- */
.chip { border-radius: 999px; }
.badge { border-radius: 0; font-family: var(--font-display); letter-spacing: .06em; }
.chip--btn.is-active { background: var(--green-800); color: #F2EFE6; }

/* ------------------------------ Tarjetas ---------------------------- */
.card { border-radius: 0; box-shadow: none; }
a.card:hover, .card--link:hover { transform: none; border-color: var(--green-800); box-shadow: none; }

/* -------------------------------- Tabs ------------------------------ */
.tabs { border-radius: 0; background: transparent; border: 0; border-bottom: 1px solid var(--border); padding: 0; gap: 0; }
.tab { border-radius: 0; font-family: var(--font-display); font-weight: 500; border-bottom: 2px solid transparent; }
.tab.is-active { background: transparent; color: var(--green-800); box-shadow: none; border-bottom-color: #E5C46B; }
.tab.is-active small { color: var(--muted); opacity: 1; }

/* ------------------------------ Formularios ------------------------- */
.searchbar input { border-radius: 0; box-shadow: none; }
.searchbar input:focus { border-color: var(--green-800); }
.select {
  border-radius: 0;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 24 24' fill='none' stroke='%236E6A63' stroke-width='2.5' stroke-linecap='round'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E");
}
.select:focus { border-color: var(--green-800); }

/* --------------------------- Modal y avisos ------------------------- */
.modal { border-radius: 0; }
.toast { border-radius: 0; background: #0B3B36; color: #F2EFE6; }

/* ------------------------------- Footer ----------------------------- */
.site-footer { background: #0B3B36; border-top: 0; color: #F2EFE6; }
.site-footer strong { font-family: var(--font-display); font-weight: 500; color: #F2EFE6; }
.site-footer small, .site-footer .muted { color: rgba(242, 239, 230, .6); }
.site-footer .btn {
  background: transparent; border-color: rgba(242, 239, 230, .35); color: #F2EFE6;
}
.site-footer .btn:hover { background: rgba(242, 239, 230, .08); border-color: #E5C46B; }

/* ------------------------- Fondo sin degradados --------------------- */
/* La marca no usa fondos con gradiente: papel plano. */
body { background-image: none; }

/* Alternativa autoalojada: si el sitio debe funcionar sin Google Fonts,
   copiar space-grotesk-var.woff2 e instrument-sans-var.woff2 a
   app/assets/fonts/, declararlos aquí con @font-face y quitar el <link>
   de index.html. Ver ../README-fuentes.md.

   =================================================================== */
/* ===================================================================
   views.css — lo que no depende de tokens
   Radios fijos, degradados de banda y tipografía de las horas.
   =================================================================== */

/* Bloque de marca del encabezado (ui.js) */
.brand__stack { display: inline-flex; flex-direction: column; gap: 2px; }

/* Radios en duro */
.legend__sw,
.facet__opt .sw,
.talk__id,
.prose code,
.talk__num,
.session-card__stripe,
.tt__cell::before { border-radius: 0 !important; }

/* Barra de días: pestañas subrayadas, sin cápsula */
.daybar {
  background: transparent; border: 0; border-bottom: 1px solid var(--border);
  border-radius: 0; padding: 0; gap: 0;
}
.daybar .tab { border-bottom: 2px solid transparent; }
.daybar .tab.is-active { border-bottom-color: #E5C46B; }

/* Encabezado de bloque horario */
.prog-slot-time { font-family: var(--font-display); font-weight: 500; color: var(--green-800); }
.prog-slot-label h3 { font-family: var(--font-display); font-weight: 500; }
.slot-head .time, .tt__time, .now-clock { font-family: var(--font-display); font-weight: 500; }

/* Bandas de tiempo: tinte plano y filete, sin degradado */
.band--plenary,
.band--ceremony,
.band--poster { background-image: none; }
.band--plenary { background-color: #FBF3DC; border-color: #EBD79B; border-left: 3px solid #E5C46B; }
.band--plenary .band__title { color: #8A6A16; }
.band--ceremony { background-color: #E8EDE9; border-color: #C3D3CA; border-left: 3px solid var(--green-800); }
.band--ceremony .band__title { color: var(--green-800); }
.band--poster { background-color: #FBF3DC; border-color: #EBD79B; border-left: 3px solid #C79B2E; }
.band--poster .band__title { color: #8A6A16; }
.band__icon { border-radius: 0; }

/* Tarjeta de sesión */
.session-card__head:hover { background: var(--surface-2); }
.session-card__time,
.pentry__time,
.talk__num--time { font-family: var(--font-display); font-weight: 500; }
.session-card__code { font-family: var(--font-display); font-weight: 500; }
.session-card__title { font-family: var(--font-display); font-weight: 500; letter-spacing: -.02em; }
.room-tag { border-radius: 0; font-weight: 600; border-color: var(--border-strong); }
.room-tag svg { color: var(--green-800); }
.talk:hover { background: var(--surface-2); }
.scard:hover, .tt__cell:hover { transform: none; box-shadow: none; }

/* Avisos y llamadas */
.search-banner, .callout { border-radius: 0; }
.callout { border-left-width: 3px; border-left-color: #E5C46B; }
.linkish { color: var(--green-800); }

/* Índice de autores y facetas */
.az__l:hover { border-color: var(--green-800); color: var(--green-800); }
.az__h { font-family: var(--font-display); font-weight: 500; color: var(--green-800); }
.author { border-radius: 999px; }

/* Rejilla del at-a-glance */
.tt-wrap { border-radius: 0; box-shadow: none; }
.tt__cell, .scard { border-radius: 0; }
.now-bar { border-radius: 0; box-shadow: none; }