/* ============================================================================
 * GO — Billets : le ticket du client (QR code ou code-barres) et le scanner de l'équipe
 *                                                       build billets-2026-10-10-3
 * Le billet reste sur fond blanc quel que soit le thème : un code se lit mieux
 * en noir sur blanc, et l'écran du client devient un vrai ticket.
 * ========================================================================== */

/* Bouton « 🎟️ Mon billet » (Mes achats, Mes rendez-vous) */
.bt-billet { display: inline-flex; align-items: center; gap: 6px; min-height: 40px; padding: 0 14px; border: 0; border-radius: 99px; cursor: pointer;
  font: inherit; font-size: var(--t-s); font-weight: 800; color: #fff; background: linear-gradient(180deg, #2BD47A, #0E9F55); box-shadow: 0 8px 18px -10px rgba(14,159,85,.9); }
.bt-billet:active { transform: scale(.97); }
.bt-billet.utilise { color: var(--ink2); background: var(--neutre-fond); box-shadow: none; }

/* Demande d'identité avant d'afficher */
.billet-verrou { display: grid; justify-items: center; gap: 10px; text-align: center; }
.billet-verrou p { margin: 0; color: var(--ink2); }
.billet-cadenas { display: grid; place-items: center; width: 54px; height: 54px; border-radius: 50%; background: color-mix(in srgb, #0E9F55 14%, var(--carte)); color: #0E9F55; }
.billet-cadenas .ic { width: 26px; height: 26px; }

/* Le ticket */
.billet { position: relative; display: grid; gap: 0; margin: 2px auto 6px; max-width: 380px; border-radius: 22px; overflow: hidden; background: #fff; color: #0F1D33;
  box-shadow: 0 24px 50px -24px rgba(15,29,51,.55), 0 0 0 1px rgba(15,29,51,.06); animation: billet-sort .45s cubic-bezier(.34,1.4,.64,1) both; }
@keyframes billet-sort { from { opacity: 0; transform: translateY(26px) scale(.96); } }
.billet-haut { display: grid; gap: 2px; padding: 16px 18px 12px; text-align: center; color: #fff; background: linear-gradient(135deg, #2BD47A, #0E7F4A); }
.billet-haut b { font-size: 19px; font-weight: 900; letter-spacing: -.2px; }
.billet-haut small { font-size: 12.5px; opacity: .9; }
.billet-code { position: relative; display: grid; place-items: center; padding: 16px 18px 6px; }
.billet-qr { width: min(72vw, 260px); height: auto; aspect-ratio: 1; }
.billet-barres { width: 100%; height: 110px; }
.billet-texte { margin: 0; padding: 0 18px 12px; text-align: center; font: 800 20px/1.2 ui-monospace, "SF Mono", Menlo, Consolas, monospace; letter-spacing: 2px; color: #0F1D33; }
.billet-perfo { position: relative; height: 0; border-top: 2px dashed rgba(15,29,51,.18); margin: 0 18px; }
.billet-perfo::before, .billet-perfo::after { content: ""; position: absolute; top: -12px; width: 22px; height: 22px; border-radius: 50%; background: var(--fond); }
.billet-perfo::before { left: -30px; } .billet-perfo::after { right: -30px; }
.billet-bas { display: grid; gap: 8px; padding: 14px 18px 16px; font-size: 14px; color: #33435C; }
.billet-bas p { margin: 0; line-height: 1.45; }
.billet-etat { display: flex; gap: 8px; align-items: flex-start; padding: 10px 12px; border-radius: 12px; background: #F1F6FB; }
.billet-etat .ic { flex: none; width: 18px; height: 18px; margin-top: 1px; }
.billet-etat.ok { background: #E7F8EE; color: #0B6B3A; font-weight: 700; }
.billet-bas .petit-gris { color: #6A778C; font-size: 12px; }
.billet.utilise .billet-code > svg { opacity: .25; filter: grayscale(1); }
.billet-tampon { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%) rotate(-14deg); padding: 6px 18px; border: 4px solid #D4213D; border-radius: 10px;
  font: 900 30px/1 var(--font-titre, system-ui); letter-spacing: 3px; text-transform: uppercase; color: #D4213D; background: rgba(255,255,255,.85); }

/* Scanner (équipe) */
.scan { display: grid; gap: 12px; }
.scan-video { position: relative; aspect-ratio: 4 / 3; border-radius: 18px; overflow: hidden; background: #0B1220; }
.scan-video video { width: 100%; height: 100%; object-fit: cover; display: block; }
.scan-cadre { position: absolute; inset: 14% 22%; border-radius: 18px; box-shadow: 0 0 0 999px rgba(5,10,20,.45); }
.scan-cadre::before, .scan-cadre::after, .scan-cadre i::before, .scan-cadre i::after { content: ""; position: absolute; width: 28px; height: 28px; border: 4px solid #2BD47A; }
.scan-cadre::before { top: -2px; left: -2px; border-right: 0; border-bottom: 0; border-radius: 14px 0 0 0; }
.scan-cadre::after { top: -2px; right: -2px; border-left: 0; border-bottom: 0; border-radius: 0 14px 0 0; }
.scan-cadre i::before { bottom: -2px; left: -2px; border-right: 0; border-top: 0; border-radius: 0 0 0 14px; }
.scan-cadre i::after { bottom: -2px; right: -2px; border-left: 0; border-top: 0; border-radius: 0 0 14px 0; }
.scan-laser { position: absolute; left: 24%; right: 24%; top: 50%; height: 2px; background: linear-gradient(90deg, transparent, #2BD47A, transparent); box-shadow: 0 0 12px #2BD47A; animation: scan-laser 1.8s ease-in-out infinite alternate; }
@keyframes scan-laser { from { transform: translateY(-60px); } to { transform: translateY(60px); } }
.scan-etat { position: absolute; left: 10px; right: 10px; bottom: 10px; margin: 0; padding: 7px 12px; border-radius: 99px; text-align: center; font-size: 13px; font-weight: 700; color: #fff; background: rgba(5,10,20,.6); }
.scan-saisie { display: flex; gap: 8px; }
.scan-saisie input { flex: 1; min-width: 0; height: 46px; padding: 0 12px; border-radius: 12px; border: 1px solid var(--ligne); background: var(--carte); color: var(--ink); font: 800 16px ui-monospace, Menlo, Consolas, monospace; letter-spacing: 1px; text-transform: uppercase; }
.scan-res { display: grid; grid-template-columns: auto minmax(0, 1fr); gap: 6px 12px; align-items: start; padding: 14px; border-radius: 16px; border: 2px solid var(--ligne); background: var(--carte); animation: billet-sort .35s cubic-bezier(.34,1.4,.64,1) both; }
.scan-res > div:not(.scan-bts) p { margin: 2px 0 0; font-size: var(--t-s); color: var(--ink2); }
.scan-res b { font-size: var(--t-m); }
.scan-res > div:first-of-type > b:first-child { font-size: 20px; font-weight: 900; }
.scan-icone, .scan-res > .ic { display: grid; place-items: center; width: 44px; height: 44px; border-radius: 50%; color: #fff; background: var(--ink3); }
.scan-icone .ic { width: 24px; height: 24px; }
.scan-res.pret { border-color: #2BD47A; } .scan-res.pret .scan-icone { background: #2BD47A; }
.scan-res.ok { border-color: #0E9F55; background: color-mix(in srgb, #2BD47A 12%, var(--carte)); } .scan-res.ok .scan-icone { background: #0E9F55; }
.scan-res.ko { border-color: #D4213D; background: color-mix(in srgb, #D4213D 8%, var(--carte)); } .scan-res.ko .scan-icone, .scan-res.ko > .ic { background: #D4213D; color: #fff; padding: 10px; width: 44px; height: 44px; border-radius: 50%; }
.scan-bts { grid-column: 1 / -1; display: grid; gap: 8px; }
.scan-bts .bt.large { background: linear-gradient(180deg, #2BD47A, #0E9F55); }
.scan-format { margin: 0; padding: 0; border: 0; display: grid; gap: 6px; }
.scan-format legend { margin-bottom: 6px; font-size: var(--t-s); font-weight: 800; color: var(--ink2); text-transform: uppercase; letter-spacing: .04em; }
.scan-format .eq-choix { display: grid; grid-template-columns: 1fr 1fr; gap: 4px; padding: 4px; border-radius: 12px; background: var(--neutre-fond); }
.scan-format .eq-choix label { position: relative; }
.scan-format .eq-choix input { position: absolute; opacity: 0; inset: 0; margin: 0; }
.scan-format .eq-choix span { display: grid; place-items: center; min-height: 40px; border-radius: 9px; font-weight: 800; color: var(--ink2); cursor: pointer; }
.scan-format .eq-choix input:checked + span { background: var(--carte); color: var(--ink); box-shadow: 0 2px 8px rgba(15,45,90,.12); }
.bt-scanner { background: linear-gradient(180deg, #2BD47A, #0E9F55); }

/* ⚡ Scan rapide (en-tête, à gauche de la cloche ; pied de la barre latérale) */
.icb.eclair { position: relative; font-size: 19px; line-height: 1; color: #0E9F55; }
.icb.eclair span { filter: drop-shadow(0 2px 4px rgba(242,179,0,.45)); transition: transform .2s ease; }
.icb.eclair:hover span, .icb.eclair:focus-visible span { transform: scale(1.15) rotate(-8deg); }
.icb.eclair:active span { transform: scale(.9); }
.icb.eclair::after { content: ""; position: absolute; inset: 6px; border-radius: 50%; box-shadow: 0 0 0 0 rgba(43,212,122,.55); animation: eclair-pouls 2.8s ease-out 1.2s 2; pointer-events: none; }
@keyframes eclair-pouls { 70% { box-shadow: 0 0 0 10px rgba(43,212,122,0); } 100% { box-shadow: 0 0 0 0 rgba(43,212,122,0); } }
.bt-theme.eclair span { margin-right: 8px; font-size: 17px; }

/* Module Billets absent : présentation */
.billet-offre { display: grid; gap: 12px; }
.billet-offre p { margin: 0; line-height: 1.5; }
.billet-offre-illu { position: relative; display: grid; place-items: center; height: 110px; border-radius: 18px; background: linear-gradient(135deg, #2BD47A, #0E7F4A); overflow: hidden; }
.billet-offre-illu span { font-size: 54px; transform: rotate(-8deg); filter: drop-shadow(0 10px 18px rgba(0,0,0,.25)); }
.billet-offre-illu i { position: absolute; right: 22%; top: 18px; font-style: normal; font-size: 30px; animation: eclair-flash 2.4s ease-in-out infinite; }
@keyframes eclair-flash { 0%, 80%, 100% { opacity: .35; transform: scale(.9); } 85% { opacity: 1; transform: scale(1.25); } }

@media (prefers-reduced-motion: reduce) { .billet, .scan-res { animation: none; } .scan-laser { animation: none; } .icb.eclair::after, .billet-offre-illu i { animation: none; } }

/* ─── Billetterie (0033) ─── */
.bt-billet.creneau { background: linear-gradient(180deg, #FFB547, #F08A00); box-shadow: 0 8px 18px -10px rgba(240,138,0,.9); }
.billet-tranche { display: flex; align-items: center; gap: 8px; margin: 0; padding: 10px 18px; font-size: 14px; font-weight: 700; color: #0B6B3A; background: #E7F8EE; }
.billet-tranche .ic { flex: none; width: 18px; height: 18px; }
.billet-tranche span { flex: 1; }
.billet-tranche.a-choisir { color: #8A4B00; background: #FFF1DA; }
.billet-secours { display: flex; align-items: center; justify-content: space-between; gap: 10px; margin: 0 18px 12px; padding: 10px 12px; border: 2px dashed #F0B54A; border-radius: 12px; background: #FFF9EC; color: #6B4500; }
.billet-secours span { display: grid; font-size: 13px; font-weight: 800; }
.billet-secours small { font-weight: 600; font-size: 11.5px; color: #8A6A2C; }
.billet-secours b { font: 900 24px/1 ui-monospace, "SF Mono", Menlo, Consolas, monospace; letter-spacing: 3px; color: #3D2800; }
.billet-entrees { display: flex; flex-wrap: wrap; align-items: center; gap: 5px; }
.billet-entrees i { width: 14px; height: 14px; border-radius: 50%; border: 2px solid #2BD47A; background: #fff; }
.billet-entrees i.prise { background: #2BD47A; }
.billet-entrees span { margin-left: 4px; font-weight: 700; font-size: 13px; }
.creneaux-client { display: grid; gap: 10px; }
.creneaux-liste { list-style: none; margin: 0; padding: 0; display: grid; gap: 8px; }
.creneau-choix { display: grid; gap: 2px; width: 100%; min-height: 56px; padding: 10px 14px; border-radius: 14px; border: 2px solid var(--ligne); background: var(--carte); color: var(--ink); text-align: left; cursor: pointer; font: inherit; transition: transform .15s ease, border-color .2s; }
.creneau-choix b { font-size: 15px; } .creneau-choix small { color: var(--ink2); }
.creneau-choix:not(:disabled):hover, .creneau-choix:not(:disabled):focus-visible { border-color: #2BD47A; transform: translateY(-1px); }
.creneau-choix.choisi { border-color: #0E9F55; background: color-mix(in srgb, #2BD47A 12%, var(--carte)); }
.creneau-choix:disabled:not(.choisi) { opacity: .5; cursor: not-allowed; }
.mon-billet { display: grid; justify-items: center; gap: 14px; padding: 18px 0; text-align: center; }
.mon-billet-mot { font-size: 17px; font-weight: 700; margin: 0; }
.scan-detail { grid-column: 1 / -1; display: grid; gap: 6px; }
.scan-detail p { margin: 0; font-size: var(--t-s); }
.scan-detail .ic { width: 15px; height: 15px; vertical-align: -2px; margin-right: 4px; }
.scan-lignes { width: 100%; border-collapse: collapse; font-size: var(--t-s); }
.scan-lignes td, .scan-lignes th { padding: 5px 4px; border-bottom: 1px solid var(--ligne); text-align: left; }
.scan-lignes td:nth-child(2) { white-space: nowrap; color: var(--ink2); }
.scan-lignes td:last-child, .scan-lignes tfoot td { text-align: right; white-space: nowrap; font-variant-numeric: tabular-nums; }
.scan-lignes tfoot th { text-align: left; }
.scan-histo { list-style: none; margin: 4px 0 0; padding: 0; display: grid; gap: 2px; font-size: 12px; color: var(--ink2); }
.scan-histo .annule { text-decoration: line-through; opacity: .7; }
.scan-histo .reactivation { color: #8A4B00; }
.scan-bts-ligne { display: flex; flex-wrap: wrap; gap: 8px; }
.scan-bts-ligne .bt { flex: 1 1 auto; }
.scan-motif { display: grid; gap: 6px; padding: 10px; border-radius: 12px; background: var(--neutre-fond); }
.scan-motif label { font-weight: 800; font-size: var(--t-s); }
.scan-motif input { height: 44px; padding: 0 12px; border-radius: 10px; border: 1px solid var(--ligne); background: var(--carte); color: var(--ink); font: inherit; font-size: 16px; }
.scan-reglages summary { display: inline-flex; align-items: center; gap: 8px; min-height: 44px; cursor: pointer; font-weight: 800; color: var(--accent-t); list-style: none; }
.scan-reglages summary::-webkit-details-marker { display: none; }
.scan-reglages summary .ic { width: 18px; height: 18px; }
.scan-reglages[open] { display: grid; gap: 12px; }

/* Facture imprimable (body.imprime-facture) */
#impression-facture { display: none; }
@media print {
  body.imprime-facture > *:not(#impression-facture) { display: none !important; }
  body.imprime-facture #impression-facture { display: block; color: #000; background: #fff; font: 12pt/1.45 system-ui, sans-serif; }
  .facture header { display: flex; justify-content: space-between; gap: 20px; border-bottom: 2px solid #000; padding-bottom: 10px; margin-bottom: 14px; }
  .facture h1 { font-size: 18pt; margin: 0 0 4px; } .facture h2 { font-size: 16pt; margin: 0; text-align: right; }
  .facture header p, .facture-client p { margin: 0; } .facture-num p { text-align: right; margin: 0; }
  .facture-client { margin-bottom: 14px; } .facture-client h3 { font-size: 11pt; margin: 0 0 4px; text-transform: uppercase; letter-spacing: .05em; }
  .facture table { width: 100%; border-collapse: collapse; margin-bottom: 12px; }
  .facture th, .facture td { border-bottom: 1px solid #999; padding: 6px 4px; text-align: left; }
  .facture td:nth-child(n+2), .facture th:nth-child(n+2) { text-align: right; }
  .facture tfoot th, .facture tfoot td { font-weight: 800; border-top: 2px solid #000; border-bottom: 0; }
  .facture-pied { margin-top: 24px; font-size: 9pt; color: #444; }
}

/* Billet d'un article (entreprise) */
.billet-produit { display: grid; gap: 12px; }
.billet-produit [hidden] { display: none !important; }
#bp-zone { display: grid; gap: 12px; }
.bp-creneaux { list-style: none; margin: 0; padding: 0; display: grid; gap: 6px; }
.bp-creneaux li { display: flex; align-items: center; justify-content: space-between; gap: 8px; padding: 8px 10px; border-radius: 12px; background: var(--neutre-fond); }
.bp-creneaux span { display: grid; } .bp-creneaux small { color: var(--ink2); font-size: 12px; }
.bp-ajout { display: grid; gap: 8px; margin-top: 8px; padding: 10px; border: 1px dashed var(--ligne); border-radius: 14px; }