/* Règles communes à toutes les maquettes (chargées avant le style du modèle). */
@font-face { font-family: "Figtree"; src: url("figtree-var.woff2") format("woff2"); font-weight: 300 900; font-display: swap; }
@font-face { font-family: "Caveat Brush"; src: url("caveat-brush.woff2") format("woff2"); font-display: swap; }

[hidden] { display: none !important; }

/* Texte encore à remplir : surligné pour qu'on ne l'oublie pas */
.a-completer { background: #ffe58a; color: #1d1d1d !important; padding: 0 .2em; -webkit-box-decoration-break: clone; box-decoration-break: clone; }

/* Texte inventé pour la démo ("[EXEMPLE]" dans contenu.js) : une étiquette lisible, collée au texte */
.etiquette-exemple { display: inline-block; vertical-align: middle; font: 700 .7rem/1 "Figtree", system-ui, sans-serif; font-style: normal; text-transform: uppercase; letter-spacing: .1em; padding: .3em .55em; border: 1.5px solid currentColor; border-radius: 3px; white-space: nowrap; }
h1 .etiquette-exemple { font-size: .8rem; transform: translateY(-.2em); }
/* Offre inventée : atténuée en plus de l'étiquette (un client pourrait la réclamer) */
.offre-exemple .f-titre, .offre-exemple .f-prix, .offre-exemple .f-detail { opacity: .72; }

/* Cadres photo à remplacer : pictogramme + légende */
.vide { display: grid !important; place-items: center; align-content: center; gap: .6rem; text-align: center; padding: 1rem; }
.vide .picto { width: 3rem; height: 3rem; background: currentColor; opacity: .5; -webkit-mask: var(--picto) center / contain no-repeat; mask: var(--picto) center / contain no-repeat; }
.vide .a-remplacer { font-size: .75rem; text-transform: uppercase; letter-spacing: .12em; }
.photos > .photo:only-child { grid-column: 1 / -1; grid-row: auto; aspect-ratio: 21 / 9; }

/* Badge d'ouverture (calculé à l'heure de Paris dans remplir.js) */
.ouvert-badge { display: inline-flex; align-items: center; gap: .5rem; font-weight: 700; font-size: .95rem; margin: 0 0 1.1rem; }
.ouvert-badge::before { content: ""; width: .6rem; height: .6rem; border-radius: 50%; flex: none; }
.ouvert-badge.ouvert::before { background: #37b24d; }
.ouvert-badge.bientot::before { background: #f08c00; }
.ouvert-badge.ferme::before { background: #e03131; }

/* Horaires : la ligne du jour */
.horaires li.aujourdhui .jours, .horaires li.aujourdhui .heures { font-weight: 800; }
.horaires .auj { display: inline-block; font-size: .7rem; text-transform: uppercase; letter-spacing: .08em; margin-left: .45rem; opacity: .75; }

/* Focus clavier et retour au toucher */
a:focus-visible, button:focus-visible { outline: 3px solid currentColor; outline-offset: 3px; }
a:active, button:active { opacity: .75; }

/* Barre du bas : autant de colonnes que de boutons visibles */
.barre-mobile { grid-auto-flow: column; grid-auto-columns: 1fr; }