/* ============================================================
   MOTEUR COMMUN CARTE VIVE — Module "carte" (menu de plats : sections,
   navigation, galerie photo avec lightbox, "poster du jour").

   Extrait et généralisé à partir du code réel du Garden Bar (04/10/2026).
   Toutes les couleurs passent par les variables sémantiques définies
   dans moteur/theme.css et redéfinies par chaque client dans
   clients/<id>/theme.css — ce fichier ne contient AUCUNE couleur en dur
   ni AUCUNE donnée propre à un client (aucun nom de plat, aucun prix :
   tout ça reste dans le HTML de chaque client, comme avant). Quelques
   légers dégradés/ombres restent en rgba() neutre (noir/blanc), ce qui
   est volontaire et sans impact visuel significatif quel que soit le
   thème du client.

   Charger dans cet ordre : moteur/theme.css, clients/<id>/theme.css,
   moteur/core.css (bouton/modale gérance + sélecteur de langue),
   moteur/carte.css, puis éventuellement moteur/cave.css si le client a
   aussi le module cave (cas du Garden Bar).

   Ce que ce fichier NE contient PAS (reste propre au Garden Bar pour
   l'instant, non généralisé — voir README) : les "Côtes de Bœuf"
   vendues au poids (#cotes-list, .cote-*) et son déclencheur gérance par
   appui long, ainsi que le second compte "employés" à accès restreint.
   ============================================================ */

/* ── HEADER (texte, sans logo image — un client avec logo image peut
   simplement ne pas utiliser .header-logo/.header-ornament) ── */
header {
  background: var(--couleur-primaire-profonde, var(--couleur-primaire-sombre));
  padding: 2rem 1.5rem 1.5rem;
  text-align: center;
  position: relative;
  overflow: hidden;
}
header::before {
  content: '';
  position: absolute; inset: 0;
  background: radial-gradient(ellipse at 50% 0%, rgba(255,255,255,0.1) 0%, transparent 70%);
  pointer-events: none;
}
.header-ornament {
  color: var(--couleur-accent);
  font-size: 1.2rem;
  letter-spacing: 8px;
  margin-bottom: 0.5rem;
  opacity: 0.7;
}
.header-logo {
  font-family: 'Playfair Display', serif;
  font-size: 2.8rem;
  font-weight: 900;
  color: var(--couleur-accent);
  letter-spacing: 4px;
  text-transform: uppercase;
  line-height: 1;
}
.header-sub {
  font-family: 'Cormorant Garamond', serif;
  font-size: 0.85rem;
  color: var(--couleur-accent-pale);
  letter-spacing: 4px;
  text-transform: uppercase;
  margin-top: 0.4rem;
  opacity: 0.8;
  font-style: italic;
}
.header-line {
  width: 120px;
  height: 1px;
  background: linear-gradient(90deg, transparent, var(--couleur-accent), transparent);
  margin: 1rem auto 0;
}

/* ── NAVIGATION (onglets de sections) ── */
nav {
  position: sticky; top: 0; z-index: 100;
  background: var(--couleur-primaire);
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: none;
  box-shadow: 0 2px 12px rgba(0,0,0,0.3);
}
nav::-webkit-scrollbar { display: none; }
.nav-inner {
  display: flex;
  white-space: nowrap;
  padding: 0 0.5rem;
}
.nav-btn {
  display: inline-flex;
  align-items: center;
  gap: 0.4rem;
  padding: 0.85rem 1rem;
  font-family: 'Montserrat', sans-serif;
  font-size: 0.65rem;
  font-weight: 600;
  letter-spacing: 1.5px;
  text-transform: uppercase;
  color: var(--couleur-accent-pale);
  opacity: 0.65;
  text-decoration: none;
  border-bottom: 2px solid transparent;
  transition: all 0.2s;
  cursor: pointer;
  background: none;
  border-top: none;
  border-left: none;
  border-right: none;
  white-space: nowrap;
}
.nav-btn:hover, .nav-btn.active {
  opacity: 1;
  color: var(--couleur-accent);
  border-bottom-color: var(--couleur-accent);
}

/* ── SÉLECTEUR DE LANGUE (moteur/i18n.js) ── générique, partagé par tous
   les clients du moteur commun — ajouté le 10/10/2026 en même temps que
   le câblage de l'i18n pour Chez Nous (le module existait déjà dans
   i18n.js mais n'était utilisé par aucun client moteur commun). Flottant,
   indépendant du flux de la nav (comme sur Garden Bar/Jardin), pour ne
   pas avoir à toucher au balisage de <nav> de chaque client. */
.lang-switcher {
  position: fixed;
  top: 10px;
  right: 10px;
  z-index: 2000;
}
.lang-toggle {
  display: flex;
  align-items: center;
  gap: 0.4rem;
  background: rgba(0,0,0,0.55);
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
  border-radius: 12px;
  border: 1px solid rgba(255,255,255,0.25);
  box-shadow: 0 4px 16px rgba(0,0,0,0.35);
  padding: 0.45rem 0.7rem;
  cursor: pointer;
  color: var(--couleur-accent);
  font-size: 0.85rem;
  font-weight: 600;
  -webkit-tap-highlight-color: transparent;
}
.lang-toggle-flag { font-size: 1.3rem; line-height: 1; }
.lang-toggle-caret { font-size: 0.65rem; opacity: 0.75; transition: transform 0.15s; }
.lang-switcher.open .lang-toggle-caret { transform: rotate(180deg); }
.lang-menu {
  position: absolute;
  top: calc(100% + 8px);
  right: 0;
  min-width: 175px;
  background: rgba(0,0,0,0.75);
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
  border-radius: 12px;
  border: 1px solid rgba(255,255,255,0.25);
  box-shadow: 0 4px 16px rgba(0,0,0,0.35);
  padding: 0.4rem;
  display: none;
  flex-direction: column;
  gap: 0.15rem;
  max-height: 70vh;
  overflow-y: auto;
}
.lang-switcher.open .lang-menu { display: flex; }
.lang-option {
  display: flex;
  align-items: center;
  gap: 0.55rem;
  background: none;
  border: none;
  border-radius: 8px;
  padding: 0.45rem 0.6rem;
  font-size: 0.9rem;
  color: #fff;
  text-align: left;
  cursor: pointer;
  transition: background 0.15s;
  -webkit-tap-highlight-color: transparent;
}
.lang-option:hover { background: rgba(255,255,255,0.12); }
.lang-option.active { color: var(--couleur-accent); font-weight: 600; }

/* ── SECTIONS (une seule visible à la fois, pilotée par showSection()) ── */
section {
  padding: 2rem 1.2rem;
  display: none;
}
section.active { display: block; }

.section-header {
  text-align: center;
  margin-bottom: 1.8rem;
  position: relative;
}
.section-icon {
  font-size: 2rem;
  display: block;
  margin-bottom: 0.5rem;
}
.section-title {
  font-family: 'Playfair Display', serif;
  font-size: 1.8rem;
  font-weight: 900;
  color: var(--couleur-primaire);
  text-transform: uppercase;
  letter-spacing: 2px;
}
.section-divider {
  display: flex;
  align-items: center;
  gap: 0.8rem;
  margin: 0.8rem auto;
  max-width: 280px;
}
.section-divider::before, .section-divider::after {
  content: '';
  flex: 1;
  height: 1px;
  background: var(--couleur-accent);
  opacity: 0.5;
}
.section-divider span {
  color: var(--couleur-accent);
  font-size: 0.7rem;
}

.cat-label {
  font-family: 'Playfair Display', serif;
  font-size: 1rem;
  font-weight: 700;
  color: var(--couleur-primaire);
  text-transform: uppercase;
  letter-spacing: 2px;
  margin: 1.5rem 0 0.8rem;
  padding-bottom: 0.4rem;
  border-bottom: 1px solid rgba(0,0,0,0.12);
  display: flex;
  align-items: center;
  gap: 0.6rem;
}
.cat-label::after {
  content: '';
  flex: 1;
  height: 1px;
  background: rgba(0,0,0,0.1);
}

/* ── FICHE PLAT (un article du menu) ── */
.menu-item {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 0.8rem;
  padding: 0.75rem 0;
  border-bottom: 1px dashed rgba(0,0,0,0.1);
  position: relative;
}
.menu-item:last-child { border-bottom: none; }

.item-info { flex: 1; }
.item-name {
  font-family: 'Playfair Display', serif;
  font-size: 0.95rem;
  font-weight: 700;
  color: var(--couleur-primaire-sombre);
  line-height: 1.3;
}
.item-desc {
  font-family: 'Cormorant Garamond', serif;
  font-size: 0.85rem;
  color: var(--couleur-texte-doux, #6b4c4c);
  margin-top: 0.2rem;
  font-style: italic;
  line-height: 1.4;
}
.item-note {
  font-family: 'Cormorant Garamond', serif;
  font-size: 0.78rem;
  color: var(--couleur-accent);
  margin-top: 0.3rem;
  font-style: italic;
  line-height: 1.4;
}
.item-price {
  font-family: 'Playfair Display', serif;
  font-size: 0.95rem;
  font-weight: 700;
  color: var(--couleur-primaire);
  white-space: nowrap;
  flex-shrink: 0;
}
.item-price-duo {
  font-family: 'Montserrat', sans-serif;
  font-size: 0.72rem;
  color: var(--couleur-texte-doux, #6b4c4c);
  text-align: right;
  margin-top: 2px;
}

.menu-item.highlight {
  background: rgba(0,0,0,0.04);
  border: 1px solid rgba(0,0,0,0.1);
  border-radius: 8px;
  padding: 0.9rem;
  margin: 0.4rem 0;
}
.highlight .item-name::before {
  content: '★ ';
  color: var(--couleur-accent);
  font-size: 0.8rem;
}

.badge-maison {
  display: inline-block;
  background: var(--couleur-accent);
  color: var(--couleur-primaire-profonde, var(--couleur-primaire-sombre));
  font-size: 0.55rem;
  font-weight: 700;
  letter-spacing: 1px;
  text-transform: uppercase;
  padding: 2px 6px;
  border-radius: 3px;
  margin-left: 6px;
  vertical-align: middle;
}

.info-box {
  background: rgba(0,0,0,0.04);
  border-left: 3px solid var(--couleur-accent);
  padding: 0.8rem 1rem;
  border-radius: 0 6px 6px 0;
  margin: 0.8rem 0;
  font-size: 0.78rem;
  color: var(--couleur-texte-doux, #5a3a3a);
  font-style: italic;
}

/* ── Blocs utilitaires génériques réutilisables par n'importe quel client :
   formule (type petit-déjeuner), cocktail/mise en avant, grilles de boissons ── */
.formule-box {
  background: var(--couleur-primaire);
  border-radius: 12px;
  padding: 1.4rem;
  text-align: center;
  margin: 0.5rem 0 1.2rem;
}
.formule-title {
  font-family: 'Playfair Display', serif;
  font-size: 1.4rem;
  color: var(--couleur-accent);
  font-weight: 900;
}
.formule-price {
  font-size: 2rem;
  color: var(--couleur-accent-clair);
  font-weight: 800;
  font-family: 'Playfair Display', serif;
  margin: 0.3rem 0;
}
.formule-content {
  font-family: 'Cormorant Garamond', serif;
  font-size: 0.95rem;
  color: var(--couleur-accent-pale);
  line-height: 1.7;
  font-style: italic;
}

.cocktail-box {
  background: rgba(0,0,0,0.05);
  border: 1px solid rgba(0,0,0,0.1);
  border-radius: 8px;
  padding: 0.9rem 1rem;
  margin: 0.5rem 0;
}
.cocktail-name {
  font-family: 'Playfair Display', serif;
  font-weight: 700;
  color: var(--couleur-primaire);
  font-size: 0.95rem;
}
.cocktail-desc {
  font-family: 'Cormorant Garamond', serif;
  color: var(--couleur-texte-doux, #6b4c4c);
  font-style: italic;
  font-size: 0.85rem;
  margin-top: 2px;
}
.cocktail-price {
  font-weight: 700;
  color: var(--couleur-primaire);
  margin-top: 0.3rem;
  font-size: 0.9rem;
}

.boisson-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 0.4rem;
}
.boisson-item {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 0.5rem 0.6rem;
  background: rgba(0,0,0,0.035);
  border-radius: 6px;
  font-size: 0.78rem;
}
.boisson-name { color: var(--couleur-primaire-sombre); font-weight: 500; }
.boisson-price { color: var(--couleur-primaire); font-weight: 700; font-size: 0.82rem; }

.biere-row {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 0.55rem 0;
  border-bottom: 1px dashed rgba(0,0,0,0.08);
  font-size: 0.85rem;
}
.biere-name { color: var(--couleur-primaire-sombre); font-weight: 500; font-style: italic; }
.biere-prices { text-align: right; color: var(--couleur-primaire); font-weight: 600; font-size: 0.78rem; }

.vin-item {
  display: flex;
  justify-content: space-between;
  padding: 0.5rem 0;
  border-bottom: 1px dashed rgba(0,0,0,0.08);
  font-size: 0.85rem;
}
.vin-name { color: var(--couleur-primaire-sombre); font-style: italic; }
.vin-price { color: var(--couleur-primaire); font-weight: 700; }

/* ── FOOTER ── */
footer {
  background: var(--couleur-primaire-profonde, var(--couleur-primaire-sombre));
  color: var(--couleur-accent-pale);
  text-align: center;
  padding: 1.5rem;
  font-size: 0.7rem;
  letter-spacing: 1px;
  opacity: 0.8;
  font-family: 'Cormorant Garamond', serif;
  font-style: italic;
}
.footer-line {
  width: 80px; height: 1px;
  background: linear-gradient(90deg, transparent, var(--couleur-accent-pale), transparent);
  margin: 0 auto 1rem;
  opacity: 0.7;
}
.footer-powered a {
  color: var(--couleur-accent-pale);
  font-weight: 600;
  text-decoration: none;
  border-bottom: 1px solid var(--couleur-accent-pale);
}

/* ── Réseaux sociaux + avis Google en pied de carte (générique, ajouté le
   11/10/2026 — reprend la convention visuelle déjà en place sur le Garden
   Bar, pour tout client moteur commun : il suffit d'ajouter le bloc HTML
   .footer-social avec les vrais liens du client). ── */
.footer-social {
  display: flex;
  justify-content: center;
  gap: 1.3rem;
  margin: 1.1rem 0 0.3rem;
  flex-wrap: wrap;
}
.footer-social-btn {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0.35rem;
  text-decoration: none;
  color: var(--couleur-accent-pale);
  font-family: 'Montserrat', sans-serif;
  font-size: 0.62rem;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  font-style: normal;
  opacity: 1;
}
.footer-social-icon {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 2.6rem;
  height: 2.6rem;
  border-radius: 50%;
  box-shadow: 0 2px 8px rgba(0,0,0,0.35);
}
.footer-social-icon.icon-instagram {
  background: linear-gradient(135deg,#f09433,#e6683c,#dc2743,#cc2366,#bc1888);
}
.footer-social-icon.icon-facebook { background: #1877F2; }
.footer-social-icon.icon-google { background: #fff; }

/* ── CTA "vous êtes restaurateur" vers le site vitrine Carte Vive
   (générique, même convention que ci-dessus). ── */
.footer-pro {
  margin-top: 1.5rem;
  padding-top: 1.2rem;
  border-top: 1px solid rgba(255,255,255,0.12);
}
.footer-pro-label {
  font-family: 'Montserrat', sans-serif;
  font-size: 0.54rem;
  letter-spacing: 2.5px;
  text-transform: uppercase;
  color: rgba(255,255,255,0.45);
  margin-bottom: 0.6rem;
  font-style: normal;
}
.footer-pro-text {
  font-family: 'Cormorant Garamond', serif;
  font-style: italic;
  font-size: 0.88rem;
  color: var(--couleur-accent-pale);
  margin-bottom: 0.9rem;
  opacity: 0.9;
}
.footer-pro-btn {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  background: rgba(255,255,255,0.08);
  border: 1px solid var(--couleur-accent-pale);
  border-radius: 999px;
  padding: 0.6rem 1.3rem;
  text-decoration: none;
  color: var(--couleur-accent-pale);
  font-family: 'Montserrat', sans-serif;
  font-size: 0.66rem;
  letter-spacing: 0.06em;
  text-transform: uppercase;
}

/* ── Bouton d'appel telephonique en pied de carte (generique, ajoute le
   16/10/2026, demande de Virgil) : remplace le texte "propulse par Carte
   Vive" sur Chez Nous, qui garde volontairement une forme RECTANGULAIRE
   (pas de border-radius en pilule comme .footer-pro-btn) et plus large,
   pour que "Reservez par telephone" tienne sur une seule ligne, bien
   lisible. Generique : tout futur client avec un numero de reservation
   peut l'utiliser via <a class="footer-call-btn" href="tel:+...">. ── */
.footer-call-btn {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0.6rem;
  width: fit-content;
  min-width: 250px;
  max-width: 90%;
  margin: 0 auto 1.1rem;
  background: rgba(255,255,255,0.08);
  border: 1px solid var(--couleur-accent-pale);
  border-radius: 8px;
  padding: 0.8rem 2rem;
  text-decoration: none;
  color: var(--couleur-accent-pale);
  font-family: 'Montserrat', sans-serif;
  font-size: 0.72rem;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  font-style: normal;
  white-space: nowrap;
}
.footer-call-icon {
  font-size: 1rem;
  line-height: 1;
}

/* ── ADMIN GÉNÉRIQUE PAR PLAT : suspension (indisponible), note, prix,
   photo — s'applique à n'importe quel .menu-item muni d'un data-i18n,
   quel que soit son contenu (voir moteur/carte.js, getItemKey()). ── */
.item-suspended { opacity: 0.5; }
.item-suspended .item-name { text-decoration: line-through; color: #999; }
.item-suspended .item-desc { text-decoration: line-through; color: #bbb; }
.item-suspended .item-price,
.item-suspended .item-price-duo { text-decoration: line-through; color: #bbb; }
.suspended-badge {
  font-size: 0.68rem;
  color: #c0392b;
  font-weight: 600;
  margin-top: 0.25rem;
  letter-spacing: 0.3px;
}
.note-badge {
  font-size: 0.68rem;
  color: var(--couleur-accent);
  font-weight: 600;
  font-style: italic;
  margin-top: 0.25rem;
  letter-spacing: 0.3px;
}
.admin-mode .menu-item {
  cursor: pointer;
  transition: background 0.15s;
}
.admin-mode .menu-item:active { background: rgba(0,0,0,0.06); }
.admin-mode .menu-item::after {
  content: '✎';
  position: absolute;
  right: 0.2rem;
  top: 0.6rem;
  font-size: 0.75rem;
  color: var(--couleur-accent);
  opacity: 0.45;
  pointer-events: none;
}
body:not(.admin-mode) .menu-item.has-photo-produit {
  cursor: pointer;
}
.price-edit-icon, .note-edit-icon, .photo-produit-icon, .photo-upload-icon {
  display: inline-block;
  margin-left: 0.4rem;
  cursor: pointer;
  font-size: 0.85rem;
  opacity: 0.75;
  vertical-align: middle;
}
.price-edit-icon:active, .note-edit-icon:active, .photo-produit-icon:active, .photo-upload-icon:active { opacity: 1; }
.photo-delete-icon {
  display: inline-block;
  margin-left: 0.4rem;
  cursor: pointer;
  font-size: 0.85rem;
  opacity: 0.75;
  vertical-align: middle;
  color: #e74c3c;
}
.photo-delete-icon:active { opacity: 1; }

/* ── "Poster du jour" : affiche/photo mise à jour par l'admin, pattern
   générique réutilisé par la Tapas du Jour, le Dessert du jour, ou tout
   autre "plat du jour" qu'un client voudrait ajouter (voir
   moteur/carte.js, initPosterDuJour()). ── */
.poster-du-jour-wrap {
  position: relative;
  max-width: min(460px, 92vw);
  margin: 0.6rem auto 1.4rem;
  border-radius: 16px;
  overflow: hidden;
  box-shadow: 0 10px 36px rgba(0,0,0,0.22);
  border: 1px solid rgba(0,0,0,0.12);
  background: rgba(0,0,0,0.06);
}
.poster-du-jour-wrap img { display: block; width: 100%; height: auto; }
/* ── Flèches de défilement MANUEL + compteur (11/10/2026, demande
   explicite de Virgil : le client fait défiler lui-même les photos du
   jour, comme le carrousel "Tapas du jour" du Garden Bar — pas de
   rotation automatique). Masquées par défaut en HTML (style="display:none")
   et affichées par moteur/carte.js uniquement à partir de 2 photos. ── */
.poster-du-jour-nav {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  background: rgba(0,0,0,0.42);
  border: 1px solid rgba(255,255,255,0.35);
  color: #fff;
  font-size: 1.6rem;
  line-height: 1;
  width: 2.4rem;
  height: 2.4rem;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  transition: background 0.15s;
  padding: 0;
}
.poster-du-jour-nav:active { background: rgba(0,0,0,0.6); }
.poster-du-jour-prev { left: 0.5rem; }
.poster-du-jour-next { right: 0.5rem; }
.poster-du-jour-compteur {
  position: absolute;
  bottom: 0.5rem;
  right: 0.6rem;
  background: rgba(0,0,0,0.55);
  color: #fff;
  font-family: 'Montserrat', sans-serif;
  font-size: 0.72rem;
  font-weight: 600;
  letter-spacing: 0.3px;
  padding: 0.18rem 0.55rem;
  border-radius: 20px;
}
.poster-du-jour-fallback {
  max-width: min(360px, 88vw);
  margin: 0.8rem auto 1.4rem;
  font-family: 'Cormorant Garamond', serif;
  font-style: italic;
  font-size: 1rem;
  color: var(--couleur-texte-doux, #5a3a3a);
  text-align: center;
  line-height: 1.55;
}
.carte-admin-box {
  display: flex;
  flex-direction: column;
  gap: 0.55rem;
  padding: 0.9rem;
  background: rgba(0,0,0,0.04);
  border: 1px dashed rgba(0,0,0,0.2);
  border-radius: 8px;
  margin: 0.8rem auto 0.4rem;
  max-width: min(360px, 90vw);
}
/* ── Grille admin "du jour" — plusieurs photos (ajouté le 10/10/2026) :
   gestion individuelle (ajout/suppression) de chaque photo, visible
   uniquement en mode gérance. Le cadre visiteur (.poster-du-jour-wrap)
   affiche des flèches de défilement MANUEL dès qu'il y a plus d'une
   photo (revu le 11/10/2026 — voir .poster-du-jour-nav ci-dessus) — avec
   une seule photo, affichage statique inchangé, flèches masquées. ── */
.poster-du-jour-admin-grid {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
  margin-top: 0.3rem;
}
.poster-du-jour-admin-thumb {
  position: relative;
  width: 72px;
  height: 72px;
  border-radius: 8px;
  overflow: hidden;
  border: 1px solid rgba(0,0,0,0.18);
}
.poster-du-jour-admin-thumb img { width: 100%; height: 100%; object-fit: cover; display: block; }
.poster-du-jour-admin-thumb-del {
  position: absolute;
  top: 2px;
  right: 2px;
  background: rgba(0,0,0,0.55);
  color: #fff;
  border: none;
  border-radius: 50%;
  width: 22px;
  height: 22px;
  font-size: 0.75rem;
  line-height: 1;
  cursor: pointer;
}
.carte-admin-btn {
  font-family: 'Montserrat', sans-serif;
  font-size: 0.72rem;
  font-weight: 600;
  letter-spacing: 0.5px;
  padding: 0.55rem 0.9rem;
  border-radius: 6px;
  border: 1px solid var(--couleur-accent);
  background: transparent;
  color: var(--couleur-primaire-sombre);
  cursor: pointer;
}
.carte-upload-status {
  font-family: 'Montserrat', sans-serif;
  font-size: 0.75rem;
  color: var(--couleur-accent);
  min-height: 1.1em;
}

/* ── GALERIE (photos statiques du client + photos ajoutées par l'admin) ── */
.galerie-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 0.6rem;
  margin-top: 1rem;
}
.galerie-card {
  border-radius: 10px;
  overflow: hidden;
  position: relative;
  background: rgba(0,0,0,0.05);
  border: 1px solid rgba(0,0,0,0.1);
  aspect-ratio: 1;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  transition: transform 0.15s ease, box-shadow 0.15s ease;
}
.galerie-card:active { transform: scale(0.97); }
.galerie-card img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}
.galerie-label {
  position: absolute;
  bottom: 0; left: 0; right: 0;
  background: linear-gradient(transparent, rgba(0,0,0,0.75));
  color: var(--couleur-accent-pale);
  font-family: 'Cormorant Garamond', serif;
  font-size: 0.8rem;
  font-style: italic;
  padding: 0.5rem 0.6rem 0.4rem;
  text-align: center;
}
.galerie-placeholder {
  color: rgba(0,0,0,0.25);
  font-size: 2rem;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0.3rem;
}
.galerie-placeholder span {
  font-family: 'Cormorant Garamond', serif;
  font-size: 0.7rem;
  color: rgba(0,0,0,0.35);
  font-style: italic;
}
.galerie-delete-btn {
  position: absolute;
  top: 0.3rem;
  right: 0.3rem;
  background: rgba(0,0,0,0.75);
  border: 1px solid rgba(192,57,43,0.6);
  color: #e74c3c;
  font-size: 0.85rem;
  line-height: 1;
  padding: 0.28rem 0.42rem;
  border-radius: 6px;
  cursor: pointer;
  z-index: 2;
}
.galerie-delete-btn:hover { background: rgba(192,57,43,0.28); }
#galerie-admin-section { margin: 1rem auto 0.4rem; max-width: min(360px, 90vw); }

/* ── LIGHTBOX (galerie + photo d'un plat) ── */
#lb-overlay {
  display: none;
  position: fixed;
  inset: 0;
  background: rgba(10,10,10,0.94);
  z-index: 9999;
  align-items: center;
  justify-content: center;
  flex-direction: column;
}
#lb-overlay.lb-active { display: flex; }
#lb-img {
  max-width: 96vw;
  max-height: 80vh;
  border-radius: 8px;
  object-fit: contain;
  box-shadow: 0 8px 40px rgba(0,0,0,0.7);
  transition: opacity 0.2s ease;
}
#lb-caption {
  color: var(--couleur-accent);
  font-family: 'Cormorant Garamond', serif;
  font-size: 1rem;
  font-style: italic;
  margin-top: 0.8rem;
  text-align: center;
}
#lb-counter {
  color: rgba(255,255,255,0.45);
  font-family: 'Montserrat', sans-serif;
  font-size: 0.72rem;
  margin-top: 0.3rem;
  letter-spacing: 0.05em;
}
.lb-close {
  position: absolute;
  top: 1rem; right: 1.2rem;
  color: rgba(255,255,255,0.7);
  font-size: 2rem;
  line-height: 1;
  cursor: pointer;
  background: none;
  border: none;
  padding: 0.2rem 0.5rem;
}
.lb-close:active { color: #fff; }
.lb-arrow {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  background: rgba(255,255,255,0.08);
  border: 1px solid rgba(255,255,255,0.15);
  color: rgba(255,255,255,0.8);
  font-size: 1.6rem;
  width: 2.8rem;
  height: 2.8rem;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  transition: background 0.15s;
}
.lb-arrow:active { background: rgba(255,255,255,0.2); }
#lb-prev { left: 0.6rem; }
#lb-next { right: 0.6rem; }

/* ── ÉCRAN PUBLICITAIRE (diaporama d'inactivité — ajouté le 16/10/2026,
   généralisé depuis le Garden Bar/moteur/cave.js : après 30s sans
   interaction, fait défiler les posters "du jour" (ex. Suggestion du
   jour), l'affiche événementielle (si une a été envoyée par la gérance),
   puis les photos individuelles des plats illustrés. Ce module "carte"
   ne gère aucun vin : contrairement au Garden Bar (qui exclut
   explicitement les vins depuis le 15/10/2026) et à moteur/cave.js (qui
   les garde volontairement), la question ne se pose simplement pas ici.
   Couleurs 100% via les variables sémantiques du thème, comme le reste
   de ce fichier. ── */
#pub-overlay {
  display: none;
  position: fixed; inset: 0;
  z-index: 10000;
  background: var(--couleur-primaire-profonde, var(--couleur-primaire-sombre));
  color: rgba(255,255,255,0.92);
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-align: center;
  padding: 2rem 1.5rem;
  cursor: pointer;
}
#pub-overlay.pub-active { display: flex; }
#pub-slide {
  position: relative;
  max-width: 420px;
  width: 100%;
  opacity: 1;
  transition: opacity 0.5s ease;
}
#pub-slide.pub-fading { opacity: 0; }
.pub-affiche-img {
  max-width: 100%;
  max-height: 72vh;
  width: auto;
  height: auto;
  border-radius: 10px;
  box-shadow: 0 10px 40px rgba(0,0,0,0.5);
}
.pub-caption {
  margin-top: 1rem;
  font-family: 'Cormorant Garamond', serif;
  font-style: italic;
  font-size: 1.05rem;
  color: var(--couleur-accent-pale, var(--couleur-accent-clair));
}
.pub-dots { display: flex; gap: 0.4rem; justify-content: center; margin-top: 1.8rem; }
.pub-dot { width: 6px; height: 6px; border-radius: 50%; background: rgba(255,255,255,0.3); }
.pub-dot.pub-dot-active { background: var(--couleur-accent); }
.pub-hint {
  position: absolute;
  bottom: 1.6rem; left: 0; right: 0;
  font-size: 0.68rem;
  letter-spacing: 0.5px;
  text-transform: uppercase;
  color: rgba(255,255,255,0.5);
}
.lb-arrow.lb-hidden { opacity: 0; pointer-events: none; }

/* ── STATISTIQUES & INSIGHTS (24/10/2026) ── — voir moteur/carte.js pour
   le bloc HTML attendu. Déclencheur placé sur la même rangée que
   #admin-trigger (core.css, right:1rem) / #avis-admin-trigger
   (cave.css, right:4.1rem, pas chargé par un client "carte" sans cave) :
   right:7.4rem laisse la place libre pour un futur client "carte + cave"
   qui chargerait les deux boutons à la fois.
   MISE À JOUR (25/10/2026) : #avis-admin-trigger était par erreur à
   right:7.4rem (en collision directe avec ce bouton) — corrigé dans
   moteur/cave.css. Un 4e bouton, #stats-admin-trigger-cave (Stats pour
   le module cave/sommelier, voir moteur/cave.js et moteur/cave.css),
   prend la suite de la rangée à right:10.7rem. */
#stats-admin-trigger {
  position: fixed;
  bottom: 1rem; right: 7.4rem;
  width: 2.6rem; height: 2.6rem;
  border-radius: 50%;
  background: var(--couleur-primaire);
  color: var(--couleur-accent-pale);
  border: 1px solid rgba(185,146,79,0.4);
  font-size: 1.1rem;
  cursor: pointer;
  opacity: 0.55;
  z-index: 500;
}
#stats-admin-trigger:hover { opacity: 1; }
#stats-admin-overlay {
  display: none;
  position: fixed; inset: 0;
  background: rgba(20,20,16,0.85);
  z-index: 9999;
  align-items: center;
  justify-content: center;
}
#stats-admin-overlay.stats-active { display: flex; }
#stats-admin-box {
  background: var(--couleur-fond-carte, var(--couleur-fond));
  border-radius: 14px;
  max-width: 420px; width: 92%;
  max-height: 86vh;
  overflow-y: auto;
  padding: 1.6rem 1.4rem;
  position: relative;
}
#stats-admin-box .stats-close {
  position: absolute;
  top: 0.6rem; right: 0.8rem;
  background: none; border: none;
  font-size: 1.4rem;
  line-height: 1;
  color: var(--couleur-texte-doux, #6b4c4c);
  cursor: pointer;
}
#stats-admin-title {
  font-family: 'Playfair Display', serif;
  font-weight: 700;
  color: var(--couleur-primaire-sombre);
  text-align: center;
  margin-bottom: 1rem;
}
.stats-periodes { display: flex; gap: 0.4rem; justify-content: center; margin-bottom: 1rem; }
.stats-periode-btn {
  font-family: 'Montserrat', sans-serif;
  font-size: 0.68rem;
  font-weight: 600;
  letter-spacing: 0.3px;
  padding: 0.4rem 0.8rem;
  border-radius: 999px;
  border: 1px solid var(--couleur-primaire-sombre);
  background: none;
  color: var(--couleur-primaire-sombre);
  cursor: pointer;
}
.stats-periode-btn.active { background: var(--couleur-primaire-sombre); color: #fff; }
.stats-visites { font-size: 1rem; color: var(--couleur-primaire-sombre); margin: 0.2rem 0 0.8rem; text-align: center; }
.stats-bloc-titre {
  font-family: 'Montserrat', sans-serif;
  font-size: 0.68rem;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  color: var(--couleur-primaire);
  border-top: 1px solid rgba(185,146,79,0.3);
  padding-top: 0.7rem;
  margin-top: 0.9rem;
  margin-bottom: 0.4rem;
}
.stats-top-item { display: flex; justify-content: space-between; gap: 0.5rem; font-size: 0.85rem; padding: 0.15rem 0; color: var(--couleur-texte, #2b2320); }
.stats-top-item .stats-top-rang { color: var(--couleur-texte-pale, #9b8a8a); min-width: 1.2rem; }
.stats-top-item .stats-top-nom { flex: 1; }
.stats-top-item .stats-top-compte { font-weight: 700; color: var(--couleur-primaire); white-space: nowrap; }
.stats-bar-row { margin: 0.4rem 0; }
.stats-bar-label { display: flex; justify-content: space-between; font-family: 'Montserrat', sans-serif; font-size: 0.68rem; color: var(--couleur-texte-doux, #6b4c4c); margin-bottom: 0.15rem; }
.stats-bar-track { height: 6px; border-radius: 3px; background: rgba(185,146,79,0.18); overflow: hidden; }
.stats-bar-fill { height: 100%; background: var(--couleur-primaire); }
.stats-vide { font-family: 'Cormorant Garamond', serif; font-size: 0.9rem; color: var(--couleur-texte-pale, #9b8a8a); }
#stats-admin-pdf {
  display: block;
  width: 100%;
  margin: 1.1rem 0 0;
  background: var(--couleur-primaire);
  border: none;
  border-radius: 999px;
  padding: 0.55rem 1rem;
  font-family: 'Montserrat', sans-serif;
  font-size: 0.75rem;
  letter-spacing: 0.03em;
  color: var(--couleur-accent-pale);
  cursor: pointer;
}
#stats-admin-pdf:disabled { opacity: 0.6; cursor: wait; }
#stats-admin-reset {
  display: block;
  margin: 0.8rem auto 0;
  background: none;
  border: none;
  text-decoration: underline;
  font-family: 'Montserrat', sans-serif;
  font-size: 0.68rem;
  color: var(--couleur-texte-pale, #9b8a8a);
  cursor: pointer;
}
/* Podium (uniquement rendu dans le rapport PDF, voir moteur/carte.js) —
   styles ici pour la cohérence visuelle avec la carte elle-même si un
   jour affiché aussi dans la modale ; le rapport PDF définit sa propre
   feuille de style autonome (STATS_RAPPORT_CSS, pas de dépendance à
   Google Fonts/aux variables de thème du client dans la fenêtre imprimée). */
.rapport-podium { display: flex; justify-content: center; align-items: flex-end; gap: 0.6rem; margin: 0.6rem 0 1rem; }
.podium-place { flex: 1; max-width: 9.4rem; text-align: center; border-radius: 6px 6px 0 0; padding: 0.6rem 0.4rem; background: rgba(185,146,79,0.15); }
.podium-medal { font-size: 1.4rem; line-height: 1; }
.podium-marche { font-size: 0.6rem; text-transform: uppercase; letter-spacing: 0.05em; color: var(--couleur-texte-pale, #9b8a8a); margin-top: 0.1rem; }
.podium-nom { font-size: 0.78rem; font-weight: 700; color: var(--couleur-texte, #2b2320); margin: 0.25rem 0 0.1rem; word-break: break-word; }
.podium-compte { font-size: 0.68rem; color: var(--couleur-texte-doux, #6b4c4c); }
.podium-1 { background: rgba(185,146,79,0.3); padding-top: 1.1rem; order: 2; border: 1px solid var(--couleur-accent); }
.podium-2 { padding-top: 0.7rem; order: 1; }
.podium-3 { padding-top: 0.4rem; order: 3; }