/* Boutique Allgäu — catalogue vitrine (classes préfixées .boutique-*) */

/* Filtres : deux groupes (type, contenance), style aligné sur .carte-filters */
.boutique-filters { display:flex; flex-direction:column; gap:8px; align-items:center; margin:8px 0 20px; }
.boutique-filter-group { display:flex; flex-wrap:wrap; gap:8px; justify-content:center; }
.boutique-filter-group button { background:var(--bg-card); border:1px solid var(--border-gold); color:var(--text-muted); padding:7px 14px; border-radius:18px; font-size:13px; cursor:pointer; transition:var(--transition); }
.boutique-filter-group button:hover { color:var(--gold); }
.boutique-filter-group button:focus-visible { outline:2px solid var(--gold); outline-offset:2px; }
.boutique-filter-group button.active { background:var(--gold); color:#110e0a; font-weight:700; }
.boutique-filter-n { opacity:.65; font-size:11px; }
.boutique-filter-group button.active .boutique-filter-n { opacity:.8; }

/* Grille de cartes produit */
.boutique-grid { display:grid; grid-template-columns:repeat(auto-fill, minmax(230px, 1fr)); gap:18px; max-width:1100px; margin:18px auto 0; padding:0 4px; }
.boutique-card { background:var(--bg-card); border:1px solid var(--border-gold); border-radius:var(--radius-lg); padding:16px 16px 18px; display:flex; flex-direction:column; text-align:center; }
.boutique-card[hidden] { display:none; }

/* Zone image : packshots studio UNIFORMES 480×660 (ratio 8:11, fond dégradé
   clair + ombre, opaques). aspect-ratio réserve l'espace (pas de CLS) et rend
   la grille strictement régulière : même cadre, bouteilles à taille homogène. */
.boutique-card-img { aspect-ratio:8/11; display:flex; align-items:center; justify-content:center; margin-bottom:12px; border-radius:10px; overflow:hidden; background:#eef0f2; }
.boutique-card-img img { width:100%; height:100%; object-fit:cover; display:block; }
.boutique-noimg { color:#8a8f96; font-size:28px; }

/* Textes de la carte */
.boutique-nom { font-family:var(--font-display); font-size:16.5px; color:var(--text); margin:0 0 2px; line-height:1.3; overflow-wrap:anywhere; }
.boutique-nom-fr { color:var(--gold); font-size:12.5px; margin:0 0 6px; }
.boutique-desc { color:var(--text-muted); font-size:12.5px; line-height:1.5; margin:0; }
/* Allergènes (règl. UE 1169/2011) : information de sécurité alimentaire →
   contraste normal et taille lisible, jamais en petit gris. */
.boutique-allergenes { align-self:center; margin:8px 0 0; padding:4px 12px; font-size:13px; line-height:1.45; color:var(--text); background:rgba(212,168,67,.12); border:1px solid rgba(212,168,67,.45); border-radius:99px; }

/* Prix : réutilise le format unifié prix-unit de la carte (label au-dessus, valeur or) */
.boutique-vols { margin-top:auto; padding-top:12px; display:flex; flex-direction:column; gap:8px; }
.boutique-vol { display:flex; flex-direction:column; align-items:center; gap:2px; }
.boutique-vol .prix-unit { display:inline-flex; flex-direction:column; align-items:center; line-height:1.15; }
.boutique-vol .prix-unit-lab { font-size:10px; text-transform:uppercase; letter-spacing:1.2px; color:var(--text-muted); margin-bottom:2px; }
.boutique-vol .prix-unit-val { color:var(--gold); font-weight:700; font-size:17px; font-variant-numeric:tabular-nums; }
/* Dégressif : modalité de vente, présentée factuellement en petit */
.boutique-paliers { color:var(--text-muted); font-size:11px; font-variant-numeric:tabular-nums; }
/* Référence fournisseur : information objective, affichée discrètement */
.boutique-reff { color:var(--text-muted); opacity:.75; font-size:10.5px; letter-spacing:.5px; }

/* Mention légale indicative allergènes : une seule fois, en pied de catalogue */
.boutique-mention-allergenes { max-width:720px; margin:28px auto 0; padding:12px 18px; border:1px solid var(--border-gold); border-radius:var(--radius-lg); color:var(--text-muted); font-size:13.5px; line-height:1.65; text-align:center; }

@media (max-width: 480px) {
  .boutique-grid { grid-template-columns:repeat(auto-fill, minmax(150px, 1fr)); gap:12px; }
  .boutique-card { padding:12px 10px 14px; }
  .boutique-nom { font-size:14.5px; }
  .boutique-allergenes { font-size:12px; padding:3px 10px; }
}

/* ---------------------------------------------------------------- MODE APERÇU
   Styles utilisés UNIQUEMENT par la prévisualisation admin de boutique.php
   (POST authentifié — aucune de ces classes n'apparaît dans le HTML public).
   Code couleur : BLEU = préparé / pas encore publié (jamais utilisé ailleurs
   sur le site, pour être indiscernable d'un état réel de vente). */
.apercu-banniere { max-width:1100px; margin:0 auto 20px; padding:14px 18px; border:2px dashed #4d8fd1; border-radius:var(--radius-lg); background:rgba(77,143,209,.12); color:var(--text); font-size:14.5px; line-height:1.55; }
.apercu-banniere-titre { margin:0 0 6px; font-weight:800; text-transform:uppercase; letter-spacing:1.5px; color:#7db4e8; }
.apercu-banniere p { margin:0 0 6px; }
.apercu-legende { color:var(--text-muted); }
.apercu-banniere-actions { display:flex; flex-wrap:wrap; align-items:center; gap:10px 18px; margin-top:8px; }
.apercu-banniere-actions form { display:inline-flex; align-items:center; gap:6px; margin:0; }
.apercu-banniere-actions button { padding:5px 12px; border:1px solid #4d8fd1; border-radius:6px; background:transparent; color:#7db4e8; font-weight:700; cursor:pointer; }
.apercu-banniere-actions button:hover { background:rgba(77,143,209,.2); }
.apercu-banniere-actions button.apercu-lang-active { background:#4d8fd1; color:#101418; }
.apercu-banniere-actions a { color:#7db4e8; }

/* Carte entièrement nouvelle (aucun volume réellement en vente) */
.boutique-card.apercu-nouvelle { border:2px dashed #4d8fd1; box-shadow:0 0 0 3px rgba(77,143,209,.15); position:relative; }

/* Badges « préparé » / « nouveauté » */
.apercu-badge { align-self:center; display:inline-block; padding:2px 10px; border-radius:99px; background:#4d8fd1; color:#101418; font-size:10.5px; font-weight:800; text-transform:uppercase; letter-spacing:.8px; line-height:1.6; }
.apercu-badge-ref { margin-bottom:10px; }

/* Contenance préparée sur une carte déjà en vente */
.boutique-vol.apercu-prepare { border:1px dashed #4d8fd1; border-radius:8px; padding:6px 10px; background:rgba(77,143,209,.1); }
