/*
 * En-tête du site (style 15), chargé sur TOUTES les pages par src/Listener/ThemeSombre.php : lc-commun.css ne vient
 * qu'avec les éléments lc_ (absente de Tarifs, Accessibilité, Mentions…). 8/11.
 */
/* Infobulles : la loupe et la bascule clair/sombre, sous l'icône (au-dessus, elles sortiraient de l'écran). Règles de base
   de lc-commun.css (qui peut ne pas être là), limitées à l'en-tête. */
:is(.tm-header,.tm-header-mobile) [data-infobulle]{position:relative}
:is(.tm-header,.tm-header-mobile) [data-infobulle]::after{content:attr(data-infobulle);position:absolute;bottom:calc(100% + 6px);left:50%;z-index:20;width:max-content;max-width:220px;padding:4px 8px;border-radius:4px;background:#111;color:#fff;font-family:inherit;font-size:.72rem;font-weight:600;line-height:1.3;text-align:center;white-space:normal;letter-spacing:0;text-transform:none;opacity:0;visibility:hidden;transform:translate(-50%,4px);transition:opacity .2s ease,transform .2s ease,visibility 0s .2s;pointer-events:none}
:is(.tm-header,.tm-header-mobile) [data-infobulle]:hover::after,:is(.tm-header,.tm-header-mobile) [data-infobulle]:focus-visible::after{opacity:1;visibility:visible;transform:translate(-50%,0);transition:opacity .2s ease,transform .2s ease}
:is(.tm-header,.tm-header-mobile) [data-infobulle]::after{top:calc(100% + 6px);bottom:auto;transform:translate(-50%,-4px)}
@media (hover:none){:is(.tm-header,.tm-header-mobile) [data-infobulle]::after{display:none}}
/* Menu (repris de Polygon 65d90ca) : sur les pages du menu de pied, Joomla marque « Accueil » actif faute d'entrée du menu
   principal. Hors de l'accueil (classe lc-page-accueil, posée par le script de tête de ThemeSombre.php), son trait redevient
   celui d'une entrée ordinaire ; le survol et le focus le montrent toujours. Menu du téléphone (fenêtre déplacée hors de l'en-tête par UIkit) : plus de fond. */
html:not(.lc-page-accueil) .tm-header .uk-navbar-nav>li.uk-active:has(>a[href="/"]):not(:hover)>a:not(:focus-visible)::before{left:50%!important;right:50%!important;background-color:transparent!important}
html:not(.lc-page-accueil) .uk-nav-secondary>li.uk-active:has(>a[href="/"])>a{background-color:transparent!important}
/* Dates d'une période, forme commune du site (8/11, LcCommun::dates) : filet à gauche, numéro en grand, jour, mois et année
   dessous, trait fin entre deux dates. Tailles en em : la forme suit le texte autour. Sur un fond coloré, le contexte pose
   --lc-dates-filet, --lc-dates-jour et --lc-dates-trait. Ici parce que cette feuille est chargée sur toutes les pages. */
.lc-dates{display:inline-flex;flex-wrap:wrap;align-items:center;gap:.5em .9em;padding-left:.7em;border-left:3px solid var(--lc-dates-filet,#d21e08);line-height:1;text-align:left;vertical-align:middle}
.lc-dates-date{display:inline-flex;align-items:center;gap:.5em}
.lc-dates-date+.lc-dates-date{padding-left:.9em;border-left:1px solid var(--lc-dates-trait,#d8d1ce)}
.lc-dates-num{font-size:2.1em;font-weight:700}
.lc-dates-mots{display:flex;flex-direction:column;gap:.25em}
.lc-dates-jour{font-size:.95em;font-weight:700;color:var(--lc-dates-jour,#d21e08)}
.lc-dates-mois{font-size:.85em;opacity:.75;white-space:nowrap}
html.lc-sombre .lc-dates-jour{color:var(--lc-dates-jour,#ff4a33)}
html.lc-sombre .lc-dates-date+.lc-dates-date{border-left-color:var(--lc-dates-trait,#4a4341)}
/* Sur les panneaux de couleur (accueil, Rencontres, Événements) : filet, jour et trait dans la couleur du texte du panneau,
   un peu plus petit pour tenir sur une ligne. Pied de page (fond sombre) : trait clair. */
:is(.lc-acc-panneau,.lc-ren-panneau) .lc-dates,html.lc-sombre :is(.lc-acc-panneau,.lc-ren-panneau) .lc-dates{--lc-dates-filet:currentColor;--lc-dates-jour:currentColor;--lc-dates-trait:currentColor;font-size:.8em;flex-wrap:nowrap}
/* Panneau étroit (page Événements, téléphone) : la largeur du panneau décide, pas celle de l'écran. Dates empilées sans trait. */
:is(.lc-acc-panneau-quand,.lc-ren-quand):has(.lc-dates){display:block;container-type:inline-size;width:100%}
@container (max-width:14em){:is(.lc-acc-panneau,.lc-ren-panneau) .lc-dates{flex-direction:column;align-items:flex-start;gap:.35em}
:is(.lc-acc-panneau,.lc-ren-panneau) .lc-dates-date+.lc-dates-date{padding-left:0;border-left:0}}
:is(.lc-acc-panneau,.lc-ren-panneau) .lc-dates-date+.lc-dates-date{border-left-color:color-mix(in srgb,currentColor 55%,transparent)}
.lc-pied .lc-dates,html.lc-sombre .lc-pied .lc-dates{--lc-dates-trait:rgba(255,255,255,.25);--lc-dates-jour:#ff4a33}
/* Contextes étroits (tuiles d'Archives, lignes d'événement, listes) : les deux dates l'une sous l'autre, sans le trait. */
:is(.lc-prg-tuile-dates,.lc-prg-item-dates,.lc-pgm-evenement,.lc-eva-ligne,.lc-prg-ligne) .lc-dates{flex-direction:column;align-items:flex-start;gap:.35em}
:is(.lc-prg-tuile-dates,.lc-prg-item-dates,.lc-pgm-evenement,.lc-eva-ligne,.lc-prg-ligne) .lc-dates-date+.lc-dates-date{padding-left:0;border-left:0}
/* Dates empilées : numéros sur une même largeur, chiffres à chasse fixe, les jours s'alignent. */
:is(.lc-prg-tuile-dates,.lc-prg-item-dates,.lc-pgm-evenement,.lc-eva-ligne,.lc-prg-ligne) .lc-dates-num{min-width:1.15em;text-align:right;font-variant-numeric:tabular-nums}
.lc-dates-heure{font-size:1.45em;font-weight:700}

/* Pages pratiques et pages « Le Cratère ? » : un gabarit commun (choix du 8/11). Repère : la classe lc-page-<alias> posée
   sur <body> par ThemeSombre.php, sans toucher aux mises en page du constructeur.
   1. Pages de texte sur 900 px centrés (Tarifs l'est déjà par son élément) ; les grilles (Contact, Partenaires) restent larges. */
:is(.lc-page-accessibilite,.lc-page-mentions-legales,.lc-page-education-au-cinema,.lc-page-histoire-du-cratere) #tm-main .uk-container{max-width:900px}
@media (min-width:960px){.lc-page-education-au-cinema #tm-main .uk-width-1-4\@m{width:50%}}
/* 2. Titres de section : ceux de Tarifs et d'Accessibilité, petits, à gauche, un filet rouge dessous. */
:is(.lc-page-mentions-legales,.lc-page-education-au-cinema,.lc-page-histoire-du-cratere) #tm-main h2:not(.lc-titre *){display:block;margin:0 0 14px!important;padding-bottom:10px;background:linear-gradient(#d21e08,#d21e08) left bottom/40px 4px no-repeat;color:inherit!important;font-family:inherit;font-size:1.35rem!important;font-weight:700;line-height:1.3;text-align:left!important;text-transform:none;letter-spacing:0}
:is(.lc-page-mentions-legales,.lc-page-education-au-cinema,.lc-page-histoire-du-cratere) #tm-main * + h2:not(.lc-titre *){margin-top:32px!important}
:is(.lc-page-mentions-legales,.lc-page-education-au-cinema,.lc-page-histoire-du-cratere) #tm-main h2:not(.lc-titre *) *{color:inherit!important}
.lc-page-nous-contacter-venir .lc-ctc-titre{padding-bottom:8px;background:linear-gradient(#d21e08,#d21e08) left bottom/32px 3px no-repeat}
/* 3. Histoire : l'en-tête sort de sa bande noire, comme celui des autres pages. */
.lc-page-histoire-du-cratere #tm-main .uk-section-secondary:has(.lc-titre){background:transparent!important;color:inherit}
.lc-page-histoire-du-cratere #tm-main .uk-section-secondary:has(.lc-titre) :is(.lc-titre-titre,.lc-titre-intro,.uk-panel){color:inherit!important}
.lc-page-histoire-du-cratere #tm-main .uk-section-secondary:has(.lc-titre) .lc-titre-rubrique{color:#d21e08!important}
html:not(.lc-sombre) .lc-page-histoire-du-cratere #tm-main .uk-section-secondary:has(.lc-titre) .lc-titre-titre{color:#222!important}
