
/* ------------------------------------------------------------------
   [kiosque-header] En-tête responsive (2026-10-19)
   Quatre états, sans aucune ligne de menu qui passe à la ligne :
     >= 1700   : logo, menu, recherche, pastille « S'abonner » complète, « Se connecter »
     1400-1699 : même chose, resserrée (menu plus serré, argumentaire de la pastille sur deux lignes)
     1300-1399 : encore plus serré (portables 1366 px)
     < 1300    : menu burger + panneau latéral (bascule forcée entre 1200 et 1299 : le point de rupture
                 « l » d'UIkit est à 1200 px, trop bas pour tenir sur un portable).
   Chaque état garde au moins ~40 px de marge réelle (vérifié avec _chantier/tools/mesure_header.mjs).
   Cause du soulignement qui traverse le texte : le trait de survol est un ::before posé à 25 px du bas
   du lien ; dès qu'un libellé passait sur deux lignes, il tombait au milieu. Les libellés ne passent
   donc plus à la ligne (nowrap), et la barre ne se replie plus sous le logo.
   ------------------------------------------------------------------ */

.tm-header .uk-navbar { flex-wrap: nowrap; }
.tm-header .uk-navbar-left,
.tm-header .uk-navbar-right { flex-wrap: nowrap; min-width: 0; }
.tm-header .uk-navbar-nav > li > a { white-space: nowrap; }

/* Pastille d'abonnement : jamais de texte hors de sa capsule */
.tm-header .k-abo { max-width: 100%; box-sizing: border-box; }
.tm-header .k-abo .uk-button,
.tm-header .k-login.uk-button { white-space: nowrap; }
.tm-header .k-abo-txt { min-width: 0; }

@media (min-width: 1300px) and (max-width: 1699px) {
    .tm-header .uk-navbar-nav { gap: clamp(20px, 2.2vw, 32px); }
    .tm-header .uk-navbar-nav > li > a { font-size: 14px; }
    .tm-header .uk-logo img { width: auto; height: auto; max-width: 140px; }
    .tm-header .k-header-actions { gap: 8px; }
    .tm-header .k-abo { gap: 10px; padding: 4px 14px 4px 4px; }
    .tm-header .k-abo .uk-button,
    .tm-header .k-login.uk-button { padding: 0 16px; font-size: 14px; }
    .tm-header .k-abo-price { font-size: 15px; }
    .tm-header .k-abo-note { white-space: normal; font-size: 11px; max-width: 124px; line-height: 1.2; }
}

/* Bascule burger entre 1200 et 1299 px (au-dessus de 1200, UIkit affiche l'en-tête bureau par défaut). */
@media (min-width: 1200px) and (max-width: 1299px) {
    .tm-header.uk-visible\@l { display: none !important; }
    .tm-header-mobile.uk-hidden\@l { display: block !important; }
}

/* Portables étroits (1300-1399 px). */
@media (min-width: 1300px) and (max-width: 1399px) {
    .tm-header .uk-navbar-nav { gap: 18px; }
    .tm-header .uk-logo img { max-width: 112px; }
    .tm-header .k-header-actions { gap: 6px; }
    .tm-header .k-abo { gap: 8px; padding: 3px 10px 3px 3px; }
    .tm-header .k-abo .uk-button,
    .tm-header .k-login.uk-button { padding: 0 13px; }
    .tm-header .k-abo-note { max-width: 108px; }
}
.tm-header .uk-navbar-right { padding-left: 16px; }

/* [kiosque-header] Pastille d'abonnement + « Se connecter » : règles de base.
   Elles étaient dans un <style> collé au contenu des modules d'en-tête (« Header - pastille abonnement »,
   invités et connectés) ; centralisées ici le 2026-10-19 pour que le responsive vive à un seul endroit.
   Les variantes serrées ci-dessus passent par `.tm-header …` (spécificité supérieure). */
.k-header-actions { display: inline-flex; align-items: center; gap: 12px; }
.k-abo {
    display: inline-flex;
    align-items: center;
    gap: 16px;
    background: #E4F8FA;
    border: 1px solid #4DD0DE;
    border-radius: 500px;
    padding: 6px 20px 6px 6px;
}
.k-abo .uk-button { margin: 0; flex-shrink: 0; }
.k-abo-txt {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    line-height: 1.25;
    text-align: left;
}
.k-abo-price {
    font-family: 'Poppins', sans-serif;
    font-weight: 700;
    font-size: 17px;
    color: #023859;
    white-space: nowrap;
}
.k-abo-note {
    font-size: 12px;
    font-weight: 500;
    color: #1E3A54;
    white-space: nowrap;
}
.k-login.uk-button { margin: 0; border-radius: 500px; white-space: nowrap; }

/* [kiosque-header] Panneau burger (< 1280 px) : abonnement et connexion, avec le même prix et la même
   promesse que la pastille du bureau. */
.k-panel-abo { display: grid; gap: 10px; margin: 8px 0 24px; }
.k-panel-abo .uk-button { margin: 0; border-radius: 500px; white-space: nowrap; }
.k-panel-abo__offre {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 2px;
    margin: 0;
    padding: 8px 12px;
    background: #E4F8FA;
    border: 1px solid #4DD0DE;
    border-radius: 14px;
    text-align: center;
    line-height: 1.25;
}
.k-panel-abo__offre .k-abo-note { white-space: normal; }

/* [kiosque-header] Liens légaux du panneau burger : discrets, sous les réseaux sociaux. */
.k-panel-legal { margin-top: 8px; }
.k-panel-legal .uk-nav > li > a,
.k-panel-legal a { font-size: 13px; line-height: 1.4; padding: 3px 0; color: #64748B !important; }
.k-panel-legal a:hover { color: #03BCCF !important; }
