/* logo.css — Lanora London, Direction C corrigee (11/09/2026).
   Charge apres app.css : ne modifie QUE la mise en forme du logo, jamais le reste de app.css.
   Le mot-symbole est un SEUL fichier (LANORA + LONDON empiles, largeurs calees au pixel dans le
   generateur) : on ne fixe QUE la largeur en CSS, la hauteur suit le ratio naturel du SVG (pas de
   distorsion possible). LONDON est en currentColor via la classe .ll-mark-city : olive sur creme
   (valeur par defaut ci-dessous), creme sur marine (regle pied de page plus bas, jamais l'inverse
   — contraste olive-sur-marine mesure 3,03:1, illisible). */

.ll-logo__mark { display: flex; align-items: center; justify-content: center; line-height: 0; }
.ll-logo__mark svg { display: block; height: auto; }

/* mobile = "small" (traits legerement epaissis, poids 560) ; desktop = poids normal (480) */
.ll-logo__mark--desktop { display: none; }
.ll-logo__mark--small svg { width: 122px; }

@media (min-width: 1024px) {
  .ll-logo__mark--small { display: none; }
  .ll-logo__mark--desktop { display: flex; }
  .ll-logo__mark--desktop svg { width: 152px; }
}

.ll-mark-city { fill: var(--accent); }
/* Sur fond marine (pied de page) : LONDON en creme, jamais l'olive (contraste 3,03:1, illisible). */
.ll-footer .ll-mark-city { fill: var(--bg); }

/* Pied de page : le mot-symbole n'a ni --small ni --desktop (toujours visible, poids normal) ;
   sans cette regle le SVG s'affiche a sa taille intrinseque (~1600px, logo enorme). */
.ll-footer .ll-logo__mark svg { width: 150px; }
@media (min-width: 640px) {
  .ll-footer .ll-logo__mark svg { width: 190px; }
}

/* Monogramme (tiroir mobile) : LL seul sans cercle dans le fichier, le cercle reste un
   habillage CSS (badge de navigation), donc pas de double-cercle a neutraliser ici. */
.ll-monogram svg { display: block; width: 100%; height: 100%; fill: currentColor; }

/* Pied de page : mot-symbole clair (herite de .ll-footer .ll-logo, deja en --bg) + sceau simplifie
   en grand a cote, >= 64px (correction : jamais de sceau en dessous de ce seuil). */
.ll-footer__seal { display: block; width: 72px; height: 72px; color: var(--bg); flex: 0 0 auto; }
.ll-footer__seal svg { display: block; width: 100%; height: 100%; fill: currentColor; }
@media (min-width: 640px) {
  .ll-footer__seal { width: 88px; height: 88px; }
}

/* --- Correctif 11/09 (Claude) : hauteur explicite (Safari iOS rognait LONDON avec height:auto)
   + centrage absolu du logo sur l'écran en mobile (la grille 1fr auto 1fr décalait le logo
   de 34 px vers la gauche parce que la colonne des icônes est plus large que celle du burger). */
.ll-logo__mark--small svg { width: 122px; height: 27px; }
.ll-logo__mark--desktop svg { width: 152px; height: 34px; }
.ll-footer .ll-logo__mark svg { width: 150px; height: 33px; }
@media (min-width: 640px) { .ll-footer .ll-logo__mark svg { width: 190px; height: 42px; } }
@media (max-width: 1023px) {
  .ll-header__inner { position: relative; }
  .ll-header__inner > .ll-logo { position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); padding: 0; margin: 0; }
  .ll-logo__mark--small svg { width: 108px; height: 24px; }
}
@media (max-width: 1023px) {
  .ll-header__inner { display: flex; justify-content: space-between; align-items: center; }
}
@media (max-width: 1023px) {
  /* icônes plus serrées à droite pour laisser l'air au logo centré (108 px) */
  .ll-header__side--right { gap: 0; }
  .ll-header__side--right .ll-icon-btn { width: 40px; min-width: 40px; }
  .ll-logo__mark--small svg { width: 100px; height: 22px; }
}

/* --- Caisse (11/09, Claude) : logo seul, centré ; plus d'icônes par-dessus le logo --- */
body.woocommerce-checkout .ll-header__side--left,
body.woocommerce-checkout .ll-header__side--right { display: none !important; }
body.woocommerce-checkout .ll-header__inner { justify-content: center; }