/* Billetterie FO - styles embarqués du module
   Objectifs :
   - éviter le texte tronqué
   - améliorer l'harmonie de la carte évènement
   - garder la compatibilité avec le thème existant
*/

.billetterie-fo .billetterie-fo-card{
  padding:16px;
}

.billetterie-fo .billetterie-fo-card{
  border:1px solid rgba(255,255,255,.10);
  background: linear-gradient(180deg, rgba(255,255,255,.04), rgba(0,0,0,.10));
  color: var(--theme-text);
  box-shadow: 0 24px 70px rgba(0,0,0,.45);
  backdrop-filter: blur(6px);
}
.billetterie-fo .billetterie-intro{
  margin: 0 0 12px 0;
  line-height: 1.35;
  text-wrap: balance;
}


.billetterie-fo .billet-event-row,
.billetterie-fo .billetterie-row{
  display:flex;
  gap:14px;
  align-items:flex-start;
  flex-wrap:wrap;
}

.billetterie-fo .billet-event-info,
.billetterie-fo .billetterie-col{
  flex:1 1 320px;
  min-width:260px;
}

.billetterie-fo .billet-event-title{
  font-weight:800;
  font-size:18px;
  line-height:1.25;
  word-break:break-word;
}

.billetterie-fo .billet-event-line{
  margin-top:4px;
  line-height:1.35;
  word-break:break-word;
}

.billetterie-fo .billet-event-action,
.billetterie-fo .billetterie-actions{
  flex:0 1 360px;
  min-width:260px;
}

/* Formulaire : grille stable, pas de débordement */
.billetterie-fo .billet-form,
.billetterie-fo .billetterie-form{
  display:flex;
  gap:10px;
  align-items:flex-end;
  flex-wrap:wrap;
}

.billetterie-fo .billet-field,
.billetterie-fo .billetterie-field{
  display:flex;
  flex-direction:column;
  gap:6px;
}

.billetterie-fo .billet-field label,
.billetterie-fo .billetterie-label{
  font-size:12px;
  opacity:.85;
}

.billetterie-fo .billet-qty input,
.billetterie-fo .billetterie-qty input{
  width:92px;
}

.billetterie-fo .billet-price-box,
.billetterie-fo .billetterie-pricebox{
  padding:10px 12px;
  border:1px solid rgba(255,255,255,.12);
  border-radius:12px;
  background:rgba(0,0,0,.12);
  white-space:nowrap;
}

.billetterie-fo .billet-adv-label,
.billetterie-fo .billetterie-check{
  display:flex;
  gap:8px;
  align-items:center;
  font-size:12px;
  opacity:.9;
  user-select:none;
  max-width:320px;
}

.billetterie-fo .billet-adv-label span,
.billetterie-fo .billetterie-check span{
  word-break:break-word;
}

/* Mobile : on empile proprement */
@media (max-width: 560px){
  .billetterie-fo .billet-event-action,
  .billetterie-fo .billetterie-actions{flex:1 1 100%;}
  .billetterie-fo .billet-form{gap:8px;}
  .billetterie-fo .billet-price-box{width:100%;}
  .billetterie-fo .billetterie-pricebox{width:100%;}
}


/* Notices (remplace les alert Bootstrap) */
.billetterie-fo .billetterie-notice{
  width:100%;
  padding:12px 14px;
  margin:10px 0 0 0;
  border-radius:12px;
  background: var(--theme-card, rgba(0,0,0,.18));
  border: 1px solid var(--theme-border-subtle, rgba(255,255,255,.14));
  box-shadow: 0 10px 28px rgba(0,0,0,.25);
  line-height: 1.35;
}
.billetterie-fo .billetterie-notice__text{word-break:break-word;}
/* Variantes */
.billetterie-fo .billetterie-notice--warning{
  color: var(--theme-muted, #ff2fd4);
border-left: 4px solid var(--theme-accent, rgba(255,200,0,.85));}
.billetterie-fo .billetterie-notice--info{border-left: 4px solid var(--theme-accent2, rgba(255,0,255,.85));}
.billetterie-fo .billetterie-notice--success{border-left: 4px solid rgba(80,200,140,.85);}
.billetterie-fo .billetterie-notice--danger{border-left: 4px solid rgba(255,90,90,.9);}
.billetterie-fo .billetterie-notice--error{border-left: 4px solid rgba(255,90,90,.9);}


/* --- EVO9 : sous-cartes + effet 3D (sans dépendre de variables préfixées) --- */
.billetterie-fo .billetterie-event{
  padding:0;
  overflow:hidden;
}
.billetterie-fo .billetterie-event-grid{
  display:grid;
  grid-template-columns: minmax(420px, 2fr) minmax(280px, 1fr);
  gap:14px;
  padding:14px;
}
.billetterie-fo .billetterie-subcard{
  padding:14px;
  border-radius:14px;
  border:1px solid rgba(255,255,255,.12);
  background: var(--theme-card2, rgba(255,255,255,.06));
  box-shadow: 0 14px 38px rgba(0,0,0,.28);
  transform: perspective(900px) translateZ(0);
  transition: transform .18s ease, box-shadow .18s ease;
}
.billetterie-fo .billetterie-subcard:hover{
  transform: perspective(900px) translateY(-2px) rotateX(.6deg);
  box-shadow: 0 18px 46px rgba(0,0,0,.34);
}
.billetterie-fo .billetterie-event-coverwrap{
  margin:0 0 12px 0;
  border-radius:14px;
  overflow:hidden;
  border:1px solid rgba(255,255,255,.12);
  background:rgba(0,0,0,.18);
  aspect-ratio: 3 / 4;
  max-height: 280px;
}
.billetterie-fo .billetterie-event-cover{
  display:block;
  width:100%;
  height:100%;
  object-fit:contain;
}


/* --- EVO12.2 : visuel dans la carte de gauche (texte + image en colonnes) --- */
.billetterie-fo .billetterie-event-leftgrid{
  display:grid;
  grid-template-columns: 1fr minmax(220px, 280px);
  column-gap:14px;
  align-items:start;
}
.billetterie-fo .billetterie-event-lefttext{
  min-width: 220px;
  align-self:start;
}
.billetterie-fo .billetterie-event-leftmedia{
  align-self:start;
  display:flex;
  justify-content:flex-end;
  align-items:flex-start;
}
.billetterie-fo .billetterie-event-leftmedia .billetterie-event-coverwrap{ margin:0 0 12px 0; }
@media (max-width: 860px){
  .billetterie-fo .billetterie-event-leftgrid{flex-direction:column;}
  .billetterie-fo .billetterie-event-leftmedia{flex:1 1 auto; max-width:100%;}
}
.billetterie-fo .billetterie-subcard__title{
  margin:0 0 10px 0;
  font-weight:800;
  font-size:16px;
  line-height:1.25;
}
.billetterie-fo .billetterie-fo-toptext{
  margin:8px 0 0 0;
  line-height:1.45;
  word-break:break-word;
}
.billetterie-fo .billetterie-fo-summary{
  margin:8px 0 0 0;
  line-height:1.45;
  word-break:break-word;
}
.billetterie-fo .billetterie-fo-promo{
  margin:12px 0 0 0;
  line-height:1.45;
  word-break:break-word;
  opacity:.95;
}
/* Formulaire : grille robuste pour éviter les chevauchements */
.billetterie-fo .billetterie-form{
  display:grid;
  grid-template-columns: 110px 1fr;
  grid-template-areas:
    "qty price"
    "adv adv"
    "submit submit";
  gap:10px 12px;
  align-items:start;
}
.billetterie-fo .billetterie-qty{grid-area:qty;}
.billetterie-fo .billetterie-price{grid-area:price;}
.billetterie-fo .billetterie-adv{grid-area:adv; margin-top:-2px;}
.billetterie-fo .billetterie-submit{grid-area:submit; display:flex; justify-content:flex-end;}
.billetterie-fo .billetterie-qty input{width:110px; max-width:110px;}
@media (max-width: 860px){
  .billetterie-fo .billetterie-event-grid{grid-template-columns: 1fr;}
  .billetterie-fo .billetterie-form{
    grid-template-columns: 1fr;
    grid-template-areas:
      "qty"
      "adv"
      "price"
      "submit";
  }
  .billetterie-fo .billetterie-submit{justify-content:flex-start;}
  .billetterie-fo .billetterie-qty input{width:120px; max-width:100%;}
}

.billetterie-fo .billetterie-subcard{
  position: relative;
  overflow: hidden;
}
.billetterie-fo .billetterie-subcard::before{
  content:"";
  position:absolute;
  inset:-40px -60px auto -60px;
  height:90px;
  background: radial-gradient(closest-side, rgba(255,255,255,.10), rgba(255,255,255,0));
  pointer-events:none;
  opacity:.75;
}

.billetterie-fo .billetterie-notice--warning{
  border-color: color-mix(in srgb, var(--theme-muted, #ff2fd4) 60%, rgba(255,255,255,.18));
  background: color-mix(in srgb, rgba(0,0,0,.22) 65%, var(--theme-muted, #ff2fd4) 10%);
  box-shadow: 0 14px 40px rgba(0,0,0,.35);
}


/* accents ciblés (ne pas toucher aux variables globales) */
.billetterie-fo .billetterie-muted{
  color: var(--theme-muted) !important;
}
.billetterie-fo .billetterie-adv-soldout{
  color: var(--theme-muted) !important;
}

.billetterie-fo img.billetterie-event-cover{ cursor: zoom-in; }


/* EVO15 : modal affiche (isolée) */
.tmtl-imgmodal{
  position:fixed; inset:0;
  background: rgba(0,0,0,.78);
  display:flex; align-items:center; justify-content:center;
  padding:24px; z-index:99999;
}
.tmtl-imgmodal__panel{ position:relative; max-width:92vw; max-height:92vh; }
.tmtl-imgmodal__img{
  display:block;
  max-width:92vw; max-height:92vh;
  border-radius:14px;
  box-shadow:0 24px 80px rgba(0,0,0,.55);
  border:1px solid rgba(255,255,255,.14);
  background: rgba(0,0,0,.25);
}
.tmtl-imgmodal__close{
  position:absolute; top:-14px; right:-14px;
  width:36px; height:36px; border-radius:999px;
  border:1px solid rgba(255,255,255,.22);
  background: rgba(0,0,0,.55);
  color:#fff; font-size:20px; line-height:34px;
  text-align:center; cursor:pointer;
}
.tmtl-imgmodal__close:hover{ background: rgba(0,0,0,.75); }


/* PROMO ACCENT ONLY – SAFE */
.billetterie-fo .billetterie-fo-promo{color:var(--theme-accent);}