/* Présentation commune aux pages publiques. */
@media (max-width:860px) {
  body.grf-clavier-ouvert .grf-mobile-achat { display:none !important; }
  #bt-drawer { height:100dvh; padding-bottom:calc(30px + env(safe-area-inset-bottom)); overscroll-behavior:contain; }
}
.grf-carte-court { display:none; }
@media (max-width:640px) {
  .bt-card .bt-card-fiche, .bt-card .grf-carte-detail { display:none; }
  .bt-card .grf-carte-court { display:inline; }
  .bt-card .bt-card-stock { margin-top:8px; font-size:12px; }
  .bt-card .bt-card-action { margin-top:10px; font-size:13px; }
}
#grf-changer-produit { margin-bottom:12px; }
.grf-entete-produit { display:none; }
@media (max-width:640px) {
  #grf-changer-produit { margin:0; }
  .grf-entete-produit { grid-column:1 / -1; display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:4px 12px; }
  .grf-entete-produit #bt-atelier-nom { font-size:19px !important; margin:0 !important; }
  #bt-atelier #avis-resume-haut { display:none !important; }
  #grf-etape { position:absolute; width:1px; height:1px; overflow:hidden; clip-path:inset(50%); white-space:nowrap; }
  #bt-atelier .grf-atelier-section { border-top:0; margin-top:0; padding-top:0; }
  #bt-atelier { row-gap:12px; }
}
#bt-atelier [hidden] { display: none !important; }
.grf-etapes-navigation { display:flex; justify-content:space-between; gap:12px; margin-top:20px; }
.grf-etapes-navigation button { min-height:44px; }
.grf-etapes-navigation button:last-child { margin-left:auto; }
#grf-etape { margin:20px 0 0; color:#4840bc; }
.grf-resume { font-size:14px; line-height:1.6; padding:12px 14px; border-radius:12px; background:#efedf8; color:#38333f; }
.grf-ajout-confirmation { margin-top:16px; padding:14px; border:1px solid #5b57e040; border-radius:14px; }
.grf-ajout-confirmation p { margin:0 0 12px; color:#38333f; }
.grf-ajout-confirmation button { margin:4px 8px 4px 0; }
.grf-atelier-section h3 { scroll-margin-top:100px; }
.grf-suivi-commande { padding:12px 0; }
.grf-suivi-commande summary { color:#4840bc; font-weight:600; cursor:pointer; min-height:44px; display:flex; align-items:center; }
.grf-suivi-commande p { font-size:14px; line-height:1.6; overflow-wrap:anywhere; }
#liste-commandes { scroll-margin-top:100px; }
@media (max-width:700px) {
  body.grf-personnalisation .bt-atelier-visuel { width:min(210px,100%); height:210px; margin-inline:auto; align-self:start; }
  #bt-atelier[data-etape="1"] .bt-atelier-visuel-col { position:relative; top:auto; }
  #bt-atelier[data-etape="1"] .bt-atelier-visuel { width:min(230px,100%); height:230px; margin-inline:auto; }
  #bt-atelier[data-etape="1"] #grf-photos, #bt-atelier[data-etape="1"] #bt-undo-redo-bar { display:none; }
}
body.grf-public { background: radial-gradient(760px 520px at 88% 4%, #6e7bff18, transparent 60%), #f5f2ef; }
.grf-public .btn, .grf-public .filter-btn { border-radius: 100px; font-family: 'Work Sans', sans-serif; text-transform: none; letter-spacing: 0; }
.grf-public .wrap { max-width: 1240px; padding-left: 32px; padding-right: 32px; }
.grf-public .piece { border-radius: 20px; background: #fff; border: 1px solid #221f2614; }
.grf-public .piece .meta { background: #fff; padding: 18px; }
.grf-public .piece .meta .grf-galerie-cta { display: block; margin-top: 12px; font: 600 13px 'Work Sans', sans-serif; text-transform: none; letter-spacing: 0; color: #5b57e0; }
.grf-public .section-head { margin-bottom: 32px; }
.grf-public main > section { padding: 48px 0; }
.grf-public .field input, .grf-public .field select, .grf-public .field textarea { border-radius: 12px; background: #fff; font-size: 16px; }
.grf-public h1, .grf-public h2, .grf-public h3 { font-family: 'Space Grotesk', sans-serif; }
.grf-public a:focus-visible, .grf-public button:focus-visible, summary:focus-visible { outline: 3px solid #5b57e0; outline-offset: 4px; }
.grf-categories { display: flex; flex-wrap: wrap; gap: 8px; margin: 24px 0 4px; }
.grf-categories button { min-height: 44px; padding: 10px 18px; border: 1px solid #221f2620; border-radius: 100px; background: #fff; color: #221f26; cursor: pointer; font: 500 14px 'Work Sans', sans-serif; }
.grf-categories button[aria-pressed="true"] { background: #5b57e0; border-color: #5b57e0; color: #fff; }
.grf-catalogue-compte { color: #5c5964; font-size: 13px; margin: 10px 0 0; }
.bt-card-stock { display: block; line-height: 1.45; }
.bt-card-fiche { font-size: 12px; line-height: 1.5; color: #5c5964; margin-top: 8px; }
.bt-card-action { display: block; color: #5b57e0; font-size: 13px; font-weight: 600; margin-top: 12px; }
#produits, #bt-atelier { scroll-margin-top: 110px; }
.bt-atelier-visuel-col { position: sticky; top: 102px; }
.grf-atelier-section { padding: 20px 0; border-top: 1px solid #221f2614; margin-top: 16px; }
.grf-atelier-section h3 { font: 600 16px 'Space Grotesk', sans-serif; margin: 0 0 14px; display: flex; align-items: center; gap: 10px; }
.grf-atelier-section h3 > span:first-child { display: grid; place-items: center; width: 26px; height: 26px; border-radius: 50%; background: #5b57e015; color: #5b57e0; font-size: 12px; }
.grf-options { border: 1px solid #221f2614; border-radius: 14px; padding: 14px; margin-top: 20px; }
.grf-options summary { cursor: pointer; color: #5c5964; font-size: 13px; }
.grf-note, .grf-fiche { font-size: 13px; line-height: 1.6; color: #5c5964; }
.grf-edition { display: flex; flex-wrap: wrap; gap: 10px; padding: 14px; background: #5b57e012; border-radius: 12px; font-size: 13px; }
.grf-edition button { border: 0; background: transparent; color: #5b57e0; text-decoration: underline; cursor: pointer; font: inherit; }
.grf-mobile-achat { display: none; }
.grf-recherche { display: flex; gap: 12px; align-items: flex-start; margin-top: 24px; }
.grf-recherche > label { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
.grf-recherche > input { flex: 1; min-width: 0; padding: 13px 16px; font: inherit; border: 1px solid #221f2620; border-radius: 24px; background: white; }
.grf-filtres { position: relative; flex-shrink: 0; }
.grf-filtres summary { padding: 13px 16px; cursor: pointer; }
.grf-filtres > div { display: grid; gap: 14px; padding: 16px; background: white; border-radius: 16px; position: absolute; top: 48px; right: 0; z-index: 20; width: 220px; box-shadow: 0 10px 30px #221f261a; border: 1px solid #221f2614; }
.grf-filtres label { font-size: 13px; display: block; }
.grf-filtres select { display: block; max-width: 160px; margin-top: 6px; }
.grf-photos-liste { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; padding-top: 12px; }
.grf-photos-liste figure { margin: 0; }
.grf-photos-liste img { width: 100%; aspect-ratio: 1; object-fit: contain; border-radius: 12px; background: white; }
.grf-photos-liste figcaption { font-size: 12px; color: #5c5964; margin-top: 6px; }
.grf-creation-lien { display: block; padding: 14px 0; color: #5b57e0; }
.grf-creation-ligne { display: flex; align-items: center; justify-content: space-between; gap: 16px; }
.grf-dialog { border: 0; border-radius: 20px; padding: 24px; width: min(480px, calc(100% - 32px)); color: #221f26; }
.grf-dialog::backdrop { background: #221f2680; }
.grf-dialog h2 { font-size: 22px; margin-bottom: 16px; }
.grf-dialog li { margin: 10px 0; font-size: 14px; }
.grf-dialog form > div { display: flex; gap: 10px; flex-wrap: wrap; margin-top: 20px; }
.grf-livraison-note { font-size: 12px; color: #5c5964; margin: 12px 0; }
.grf-promo-ligne { display: flex; gap: 8px; align-items: center; }
.grf-promo-ligne input { min-width: 0; flex: 1; }
.grf-promo-ligne button { border: 0; border-radius: 20px; padding: 12px; color: #5b57e0; background: #5b57e012; cursor: pointer; }
.grf-cart-apercus { display: flex; flex-wrap: wrap; gap: 10px; margin: 12px 0; }
.grf-cart-apercus figure { margin: 0; width: 88px; }
.grf-cart-apercus img { display: block; width: 88px; height: 88px; object-fit: contain; background: #fff; border: 1px solid #221f2614; border-radius: 12px; }
.grf-cart-apercus figcaption { font-size: 11px; color: #5c5964; text-align: center; margin-top: 4px; }
.grf-cart-modifier { display: inline-block; font: 500 12px 'Work Sans', sans-serif; color: #5b57e0; border: 0; padding: 10px 0; cursor: pointer; background: transparent; text-decoration: underline; text-underline-offset: 3px; }
.grf-promo-note { font-size: 12px; line-height: 1.5; color: #5c5964; margin: 8px 0; }
.grf-code-modifier { color: #5b57e0; border: 0; background: transparent; cursor: pointer; padding: 12px 0; font: 500 13px 'Work Sans', sans-serif; }
@media (max-width: 860px) {
  .bt-atelier-visuel-col { position: static; }
  .bt-atelier { padding: 20px; padding-bottom: 100px; gap: 20px; }
  .grf-mobile-achat.visible { display: flex; align-items: center; justify-content: space-between; gap: 12px; position: fixed; bottom: 0; left: 0; right: 0; z-index: 95; padding: 12px 20px calc(12px + env(safe-area-inset-bottom)); background: #fdfcfb; border-top: 1px solid #221f2614; box-shadow: 0 -8px 24px #221f2608; }
  .grf-mobile-achat > span { font: 600 22px 'Space Grotesk', sans-serif; color: #5b57e0; white-space: nowrap; }
  .grf-mobile-achat .bt-btn { padding: 13px 18px; font-size: 13px; }
  body.bt-panier-ouvert .grf-mobile-achat { display: none; }
}
@media (max-width: 640px) {
  .grf-public .wrap { padding-left: 20px; padding-right: 20px; }
  .accueil-hero-grid { gap: 20px !important; }
  .accueil-hero-grid > div:last-child { order: 0 !important; max-width: none !important; width: 100%; overflow: hidden !important; }
  .accueil-hero-grid .accueil-hero-photo { aspect-ratio: 2 / 1; max-height: 180px; }
  .accueil-hero-grid .bt-glass { padding: 8px !important; border-radius: 20px !important; }
  .accueil-hero-grid h1.bt-display { font-size: 36px !important; line-height: 1.1 !important; }
  .accueil-hero-grid h1 br { display: none; }
  .accueil-etapes { margin-top: 18px; }
  .grf-categories { gap: 7px; }
  .grf-categories button { padding: 9px 13px; font-size: 12px; }
  .bt-grid { padding-top: 16px; }
  .bt-card-fiche { font-size: 11px; }
  .grf-atelier-section h3 { font-size: 15px; }
}
/* Même contrôle compact pour les couleurs, modèles et tailles. */
.grf-choix-source { display:none !important; }
.grf-choix-select { width:100%; min-width:0; margin-top:4px; }
.grf-choix-axes { display:grid; grid-template-columns:1fr 1fr; gap:12px; }
.grf-choix-axes label { display:grid; gap:6px; min-width:0; }
@media(max-width:480px) { .grf-choix-axes { grid-template-columns:1fr; } }
.grf-tarifs-details { margin-top: 10px; font-size: 12px; color: var(--bt-encre-douce); }
.grf-tarifs-details summary { cursor: pointer; }
.grf-tarifs-liste { list-style: none; padding: 0; margin: 10px 0 0; line-height: 1.8; font-variant-numeric: tabular-nums; }
.grf-tarifs-liste li { padding: 3px 0; border-bottom: 1px solid rgba(0,0,0,.06); }
.grf-photo-ouvrir { display:block; width:100%; border:0; padding:0; background:transparent; cursor:zoom-in; border-radius:12px; }
.grf-photo-ouvrir:focus-visible { outline:3px solid #5b57e0; outline-offset:3px; }
.grf-photo-dialog { width:min(90vw,900px); max-height:90dvh; padding:16px; border:0; border-radius:16px; background:#fff; }
.grf-photo-dialog::backdrop { background:rgba(0,0,0,.7); }
.grf-photo-dialog img { display:block; width:100%; height:65dvh; object-fit:contain; }
.grf-photo-dialog button { min-height:44px; padding:8px 16px; cursor:pointer; float:right; }
.grf-photo-dialog p { clear:both; font-size:14px; text-align:center; }
.bt-cart-item-detail,.bt-cart-item-texte { overflow-wrap:anywhere; line-height:1.5; }
.bt-cart-item-detail { margin-top:5px; }
.bt-cart-item-texte { padding:5px 0; }
.bt-cart-item .bt-avertissement:empty { display:none; }
.bt-cart-item-qte { align-items:center; gap:10px; }
@media(max-width:640px) {
  .bt-input,.bt-select { font-size:16px!important; }
  .bt-qte-btn,.bt-cart-remove,#bt-quantite-plus,#bt-quantite-moins { min-width:44px; min-height:44px; }
  .bt-atelier { padding-left:12px!important; padding-right:12px!important; }
  .grf-photos-liste { gap:8px; }
  #bt-fpd-wrap { max-width:100%; overflow:hidden; }
}
:where(button,a,input,select,textarea,summary):focus-visible { outline:3px solid #4840bc; outline-offset:3px; }
#grf-face-courante { font-size:13px; color:#38333f; padding:10px 12px; background:#f0eefb; border-radius:8px; }
.bt-erreur { color:#8b2323!important; line-height:1.5; }
.bt-champ-label { color:#4c4853!important; }
.grf-cart-modifier + .grf-cart-modifier { margin-left:12px; }
