.ticket-pass-card{position:relative;width:min(320px,100%);aspect-ratio:2/3;margin:0 auto;background:url('/images/ticket-badge-bg.png') center/100% 100% no-repeat}
.ticket-pass-content{position:absolute;top:37%;right:22%;bottom:5%;left:22%;display:flex;min-width:0;flex-direction:column;align-items:center;justify-content:center;gap:5px;overflow:hidden;color:#fff;text-align:center}
.ticket-pass-brand{color:#baff39;font-size:.47rem;font-weight:950;letter-spacing:.13em;line-height:1.1;text-transform:uppercase}
.ticket-pass-event{display:-webkit-box;width:100%;overflow:hidden;color:#fff;font-size:.66rem;font-weight:900;line-height:1.15;text-overflow:ellipsis;-webkit-box-orient:vertical;-webkit-line-clamp:2}
.ticket-pass-qr{display:grid;width:104px;height:104px;flex:0 0 auto;place-items:center;padding:6px;border:1px solid #ffffff9c;border-radius:8px;background:#fff}
.ticket-pass-qr #modal-ticket-box,.ticket-pass-qr canvas,.ticket-pass-qr img{display:block;width:100%!important;height:100%!important;max-width:100%!important;max-height:100%!important}
.ticket-pass-status{color:#fff;font-size:.52rem;font-weight:750;line-height:1.2}
.ticket-pass-delivery{max-width:100%;color:#d4d0da;font-size:.43rem;line-height:1.2;overflow-wrap:anywhere}
.event-ticket-pass-card{margin:0 auto 12px}
.event-ticket-pass-content{gap:4px}
.event-ticket-pass-content .ticket-pass-brand{font-size:.45rem}
.event-ticket-pass-content h2{display:-webkit-box;width:100%;overflow:hidden;color:#fff!important;font-size:1.35rem!important;line-height:.98!important;text-overflow:ellipsis;-webkit-box-orient:vertical;-webkit-line-clamp:2}
.event-ticket-pass-content .event-ticket-qr{width:104px;height:104px;margin:3px auto;padding:6px;border:1px solid #ffffff9c;border-radius:8px;background:#fff}
.event-ticket-pass-content .event-ticket-qr canvas,.event-ticket-pass-content .event-ticket-qr img,.event-ticket-pass-content .event-ticket-qr table{width:100%!important;height:100%!important;max-width:100%!important;max-height:100%!important}
.event-ticket-pass-content .event-ticket-code{font-size:.7rem;letter-spacing:.12em;line-height:1.1}
.event-ticket-pass-content .event-ticket-type{margin:0;color:#f2eff5;font-size:.53rem;line-height:1.1}
.event-ticket-pass-content small{margin-top:1px;color:#d4d0da;font-size:.46rem}
.event-ticket-pass-content .event-ticket-delivery{max-width:100%;min-height:0;margin:0;color:#baff39;font-size:.46rem;line-height:1.15;overflow-wrap:anywhere}
.event-ticket-wallet{position:relative;z-index:1}
@media(max-width:420px){.ticket-pass-card{width:min(294px,100%)}.ticket-pass-qr,.event-ticket-pass-content .event-ticket-qr{width:94px;height:94px}.event-ticket-pass-card{margin-bottom:8px}}

/* Le badge devient le conteneur complet du billet et remplace la boîte de dialogue. */
.ticket-pass-card{width:min(330px,calc(100vw - 24px));aspect-ratio:2/3}
.ticket-pass-content{top:35%;right:22%;bottom:4%;left:22%;justify-content:flex-start;gap:3px;padding-top:6px}
.ticket-pass-qr,.event-ticket-pass-content .event-ticket-qr{width:72px;height:72px;padding:4px;border-radius:6px}
.ticket-pass-brand,.event-ticket-pass-content .ticket-pass-brand{font-size:.42rem}
.ticket-pass-event{font-size:.58rem;line-height:1.08}
.ticket-pass-status{font-size:.47rem;line-height:1.1}
.ticket-pass-delivery{font-size:.39rem;line-height:1.08}
.ticket-pass-actions{display:flex;width:100%;flex-direction:column;gap:3px;margin-top:2px}
.ticket-pass-actions .ticket-pass-wallet{display:flex;width:100%;flex-direction:column;gap:3px;margin:0}
.ticket-pass-actions button,.ticket-pass-actions a{display:flex;width:100%;min-height:25px;align-items:center;justify-content:center;margin:0!important;padding:3px 5px;border:1px solid #ffffff72;border-radius:6px;background:#ffffff12;color:#fff;font-size:.42rem;font-weight:850;line-height:1.1;text-align:center;text-decoration:none}
.ticket-pass-actions .ticket-pass-wallet[style*="display: none"]{display:none!important}
.ticket-pass-actions .ticket-pass-wallet[style*="display: flex"]{display:flex!important}
.ticket-pass-actions .ticket-pass-wallet button,.ticket-pass-actions .ticket-pass-wallet a{min-height:23px!important;height:23px!important}
.ticket-pass-actions .ticket-pass-wallet img{height:20px!important;max-width:100%}
.ticket-pass-actions #modal-ticket-email,.ticket-pass-actions .event-ticket-email{border-color:#ffffff6b;background:#ffffff12;color:#fff}
.ticket-pass-actions .event-ticket-done{border:0;background:var(--lime);color:#111}
.ticket-pass-actions .btn-g{background:#08080a!important}
#modal-ticket.modal-ov.open{align-items:center;justify-content:center}
#modal-ticket .ticket-modal-sheet{display:flex;width:min(360px,calc(100% - 18px));max-height:calc(100dvh - 24px);align-items:center;justify-content:center;overflow:visible;margin:0 auto;padding:0;border:0;border-radius:0;background:transparent;box-shadow:none;animation:none}
.event-ticket-dialog.ticket-pass-card{width:min(330px,calc(100vw - 24px));max-height:none;overflow:visible;padding:0;border:0;border-radius:0;background-color:transparent;color:#fff;box-shadow:none}
.event-ticket-dialog .event-ticket-close{z-index:3;top:34%;right:22%;width:25px;height:25px;border:1px solid #ffffff65;border-radius:50%;background:#08080a9c;color:#fff;font-size:1rem}
.event-ticket-pass-content{gap:3px;padding-top:6px}
.event-ticket-pass-content h2{margin:0!important;font-size:1.02rem!important;line-height:1!important}
.event-ticket-pass-content .event-ticket-qr{margin:2px auto;padding:4px}
.event-ticket-pass-content .event-ticket-code{font-size:.58rem;letter-spacing:.1em}
.event-ticket-pass-content .event-ticket-type,.event-ticket-pass-content small,.event-ticket-pass-content .event-ticket-delivery{font-size:.4rem;line-height:1.08}
.event-ticket-pass-content .event-ticket-type{margin:0}
.event-ticket-pass-content small{margin:0}
.event-ticket-pass-content .event-ticket-delivery{min-height:0;margin:0}
.event-ticket-pass-content .event-ticket-wallet{display:flex;width:100%;grid-template-columns:1fr;flex-direction:column;gap:3px;margin:0}
.event-ticket-pass-content .event-ticket-wallet[hidden]{display:none!important}
.event-ticket-dialog .event-wallet-button{min-height:23px;height:23px;padding:3px 5px;border-radius:6px;background:#ffffff12;color:#fff;font-size:.42rem}
.event-ticket-dialog .event-wallet-button.google{background:transparent}
.event-ticket-dialog .event-wallet-button.google img{height:20px}
.event-ticket-dialog .event-ticket-email{min-height:25px;height:25px;padding:3px 5px;border-radius:6px}
.event-ticket-dialog .event-ticket-done{min-height:25px;height:25px;margin-top:0;border-radius:6px;font-size:.45rem}
@media(max-width:420px){.ticket-pass-card,.event-ticket-dialog.ticket-pass-card{width:min(310px,calc(100vw - 20px))}.ticket-pass-content,.event-ticket-pass-content{top:35%;right:22%;bottom:4%;left:22%;gap:2px;padding-top:4px}.ticket-pass-qr,.event-ticket-pass-content .event-ticket-qr{width:64px;height:64px}.ticket-pass-actions{gap:2px;margin-top:1px}.ticket-pass-actions button,.ticket-pass-actions a,.ticket-pass-actions .ticket-pass-wallet button,.ticket-pass-actions .ticket-pass-wallet a{min-height:22px!important;height:22px!important;font-size:.39rem}.event-ticket-dialog .event-ticket-close{top:34%;right:22%;width:23px;height:23px}.event-ticket-pass-content h2{font-size:.94rem!important}.event-ticket-pass-content .event-ticket-qr{margin:1px auto}}

/* Répartir les informations sur toute la surface de la carte du badge. */
.ticket-pass-content,.event-ticket-pass-content{top:35%;right:22%;bottom:5%;left:22%;justify-content:space-between;gap:0;padding-top:9px;padding-bottom:9px}
.ticket-pass-actions{flex:0 0 auto;margin-top:0}
.event-ticket-dialog .event-ticket-close{right:18%}
@media(max-width:420px){.ticket-pass-content,.event-ticket-pass-content{top:35%;right:22%;bottom:5%;left:22%;gap:0;padding-top:7px;padding-bottom:7px}.event-ticket-dialog .event-ticket-close{right:18%}}

/* Agrandir le QR et abaisser le libellé sur le pass. */
.ticket-pass-qr,.event-ticket-pass-content .event-ticket-qr{width:144px;height:144px;margin-top:10px;padding:5px}
.ticket-pass-brand,.event-ticket-pass-content .ticket-pass-brand{margin-top:12px}
.ticket-pass-content,.event-ticket-pass-content{top:38%}
.event-ticket-dialog .event-ticket-close{right:23%}
@media(max-width:420px){
  .ticket-pass-card,.event-ticket-dialog.ticket-pass-card{width:min(330px,calc(100vw - 20px))}
  .ticket-pass-content,.event-ticket-pass-content{top:38%}
  .ticket-pass-qr,.event-ticket-pass-content .event-ticket-qr{width:128px;height:128px;margin-top:8px;padding:4px}
  .ticket-pass-brand,.event-ticket-pass-content .ticket-pass-brand{margin-top:9px}
  .event-ticket-dialog .event-ticket-close{right:23%}
}

/* Boutons du pass plus lisibles, posés un peu plus bas sur le badge. */
.ticket-pass-content,.event-ticket-pass-content{bottom:2%}
.ticket-pass-actions,.event-ticket-pass-content .event-ticket-wallet{transform:translateY(6px)}
.ticket-pass-actions button,.ticket-pass-actions a{font-size:.52rem}
.event-ticket-dialog .event-wallet-button,.event-ticket-dialog .event-ticket-email,.event-ticket-dialog .event-ticket-done{font-size:.52rem}
.event-ticket-pass-content .event-ticket-code{font-size:1.16rem}
.event-ticket-dialog .event-ticket-close{display:flex;align-items:center;justify-content:center;padding:0!important;line-height:1!important;font-family:Arial,sans-serif;font-size:18px;box-sizing:border-box}
@media(min-width:421px){
  .ticket-pass-card,.event-ticket-dialog.ticket-pass-card{width:min(495px,calc(100vw - 48px))}
  #modal-ticket .ticket-modal-sheet{width:min(525px,calc(100vw - 32px))}
  .ticket-pass-content,.event-ticket-pass-content{padding-top:13px;padding-bottom:13px}
  .ticket-pass-brand,.event-ticket-pass-content .ticket-pass-brand{margin-top:18px;font-size:.63rem}
  .ticket-pass-event{font-size:.87rem;line-height:1.08}
  .ticket-pass-qr,.event-ticket-pass-content .event-ticket-qr{width:216px;height:216px;margin-top:15px;padding:7px;border-radius:9px}
  .ticket-pass-status{font-size:.71rem}
  .ticket-pass-delivery{font-size:.59rem}
  .event-ticket-pass-content h2{font-size:1.53rem!important;line-height:1!important}
  .event-ticket-pass-content .event-ticket-code{font-size:1.74rem}
  .event-ticket-pass-content .event-ticket-type,.event-ticket-pass-content small,.event-ticket-pass-content .event-ticket-delivery{font-size:.6rem}
  .ticket-pass-actions{gap:5px}
  .ticket-pass-actions button,.ticket-pass-actions a{min-height:38px;padding:5px 8px;border-radius:9px;font-size:.78rem}
  .ticket-pass-actions .ticket-pass-wallet button,.ticket-pass-actions .ticket-pass-wallet a{min-height:35px!important;height:35px!important}
  .ticket-pass-actions .ticket-pass-wallet img,.event-ticket-dialog .event-wallet-button.google img{height:30px!important}
  .event-ticket-pass-content .event-ticket-wallet{gap:5px}
  .event-ticket-dialog .event-wallet-button{min-height:35px;height:35px;padding:5px 8px;font-size:.63rem}
  .event-ticket-dialog .event-ticket-email,.event-ticket-dialog .event-ticket-done{min-height:38px;height:38px;padding:5px 8px;font-size:.78rem}
  .event-ticket-dialog .event-ticket-close{width:38px;height:38px;font-size:27px}
}
@media(max-width:420px){
  .ticket-pass-actions,.event-ticket-pass-content .event-ticket-wallet{transform:translateY(5px)}
  .ticket-pass-actions button,.ticket-pass-actions a{font-size:.48rem}
  .event-ticket-dialog .event-wallet-button,.event-ticket-dialog .event-ticket-email,.event-ticket-dialog .event-ticket-done{font-size:.48rem}
}
