/* Base ------------------------------------------------------------------ */
body {
  margin: 0;
  background: var(--tlb-fond);
  color: var(--tlb-texte);
  font-family: var(--tlb-police-ui);
  font-size: 1rem;
  line-height: 1.6;
}

h1, h2, h3 {
  font-family: var(--tlb-police-editorial);
  font-weight: 600;          /* jamais au-delà de 700 */
  line-height: 1.2;
  color: var(--tlb-encre);
}

a { color: var(--tlb-lien); text-decoration-thickness: .08em; text-underline-offset: .18em; }
a:hover { color: var(--tlb-lien-survol); }

/* Focus visible partout — exigence WCAG 2.1 AA. */
:focus-visible {
  outline: 3px solid var(--tlb-focus);
  outline-offset: 2px;
  border-radius: 4px;
}

.tlb-container {
  width: min(100% - 2rem, var(--tlb-largeur));
  margin-inline: auto;
}

/* Lien d'évitement */
.tlb-skip {
  position: absolute;
  left: -9999px;
}
.tlb-skip:focus {
  left: 1rem;
  top: 1rem;
  z-index: 1000;
  padding: .75rem 1rem;
  background: var(--tlb-surface);
  border-radius: var(--tlb-rayon-bouton);
  box-shadow: var(--tlb-ombre-carte);
}

/* En-tête --------------------------------------------------------------- */
.tlb-header {
  background: var(--tlb-surface);
  border-bottom: 1px solid var(--tlb-filet);
}
.tlb-header__inner {
  display: flex;
  align-items: center;
  gap: var(--tlb-gouttiere);
  min-height: 68px;
}
.tlb-branding__link {
  font-weight: 700;
  font-size: 1.15rem;
  color: var(--tlb-encre);
  text-decoration: none;
}
/* Logo personnalisé. Sans borne, WordPress rend l'image à sa taille
   intrinsèque et fait exploser la hauteur de l'en-tête : les valeurs de
   add_theme_support('custom-logo') ne servent qu'au recadrage dans
   l'administration, elles ne contraignent pas le rendu public.
   36px reprend le gabarit de la maquette C (pastille de 32px + marge). */
.tlb-branding .custom-logo-link { display: block; line-height: 0; }
.tlb-branding .custom-logo {
  display: block;
  height: auto;
  width: auto;
  max-height: 36px;
  max-width: 200px;
}
.tlb-nav__list {
  display: flex;
  gap: 1.25rem;
  list-style: none;
  margin: 0;
  padding: 0;
}
.tlb-nav__list a {
  display: block;
  padding: .5rem 0;
  color: var(--tlb-encre);
  text-decoration: none;
}
.tlb-nav__list a:hover,
.tlb-nav__list .current-menu-item > a {
  color: var(--tlb-violet-500);
}

/* Boutons --------------------------------------------------------------- */
.tlb-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 44px;             /* zone tactile mobile */
  padding: .625rem 1.25rem;
  border: 0;
  border-radius: var(--tlb-rayon-bouton);
  font: inherit;
  font-weight: 600;
  text-decoration: none;
  cursor: pointer;
}
.tlb-btn--cta {
  background: var(--tlb-cta-fond);
  color: var(--tlb-cta-texte);
}
.tlb-btn--cta:hover { background: var(--tlb-cta-survol); color: var(--tlb-cta-texte); }
.tlb-btn--primaire { background: var(--tlb-violet-500); color: #fff; }
.tlb-btn--primaire:hover { background: var(--tlb-violet-600); color: #fff; }

/* Vignettes carrées (sources 222x222) ----------------------------------- */
.tlb-vignette {
  aspect-ratio: 1;
  width: 100%;
  object-fit: cover;
  border-radius: var(--tlb-rayon-carte);
  background: var(--tlb-placeholder);
}

/* Fil d'Ariane ---------------------------------------------------------- */
.tlb-fil { padding: .75rem 0; font-size: .875rem; color: var(--tlb-attenue); }
.tlb-fil ol { display: flex; flex-wrap: wrap; gap: .4rem; list-style: none; margin: 0; padding: 0; }
.tlb-fil li + li::before { content: "›"; margin-right: .4rem; color: var(--tlb-filet); }

/* Pied de page ---------------------------------------------------------- */
.tlb-footer {
  margin-top: 3rem;
  padding: 2rem 0;
  background: var(--tlb-encre);
  color: #fff;
}
.tlb-footer a { color: var(--tlb-jaune-300); }

/* Mouvement réduit ------------------------------------------------------ */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: .01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: .01ms !important;
    scroll-behavior: auto !important;
  }
}

/* --- Carte-billet ---------------------------------------------------------
   Composant PARTAGÉ : accueil (section-spectacles), fiche salle et page de
   favoris. Il vivait dans home.css, qui n'est chargé que sur l'accueil — les
   cartes des fiches salle s'affichaient donc sans style. */
.tlb-billet { background: var(--tlb-surface); border-radius: var(--tlb-rayon-carte); box-shadow: var(--tlb-ombre-carte); overflow: hidden; }
.tlb-billet__lien { display: flex; flex-direction: column; height: 100%; color: inherit; text-decoration: none; }
.tlb-billet__visuel { display: block; }
.tlb-billet__visuel .tlb-vignette { display: block; }
.tlb-vignette--placeholder { display: block; aspect-ratio: 1; width: 100%; background: var(--tlb-placeholder-visuel); }
.tlb-billet__corps { display: block; padding: .875rem 1rem; flex: 1; }
.tlb-billet__titre { display: block; font-weight: 600; line-height: 1.3; }
.tlb-billet__date { display: block; margin-top: .25rem; font-size: .875rem; color: var(--tlb-attenue); }
.tlb-billet__souche {
  display: flex; align-items: center; justify-content: space-between; gap: .5rem;
  padding: .75rem 1rem;
  border-top: 2px dashed var(--tlb-filet);
}
.tlb-billet__prix { font-size: .875rem; color: var(--tlb-attenue); }
.tlb-billet__prix b { color: var(--tlb-encre); font-size: 1rem; }