/* ═══════════════════════════════════════════════════════════
   CHECKOUT MODAL — Global Renting Solutions
   Style cohérent avec le VSL (or/sombre)
   Version 2 étapes : coordonnées → paiement
   ═══════════════════════════════════════════════════════════ */

/* ─── STEPPER ─── */
.gs-ck-stepper{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:0;
  padding:16px 24px 4px;
  border-bottom:1px solid rgba(244,238,221,0.06);
  background:rgba(5,8,15,0.3);
}
.gs-step{
  display:flex;
  align-items:center;
  gap:10px;
  padding:8px 0;
  color:#4a4640;
  transition:color .25s;
}
.gs-step .dot{
  width:24px;height:24px;
  border-radius:50%;
  background:transparent;
  border:1.5px solid rgba(201,169,97,0.25);
  color:#7A7568;
  font-size:11px;font-weight:600;
  display:flex;align-items:center;justify-content:center;
  transition:all .25s;
  font-family:'Inter',sans-serif;
}
.gs-step .txt{
  font-size:10.5px;
  letter-spacing:0.2em;
  text-transform:uppercase;
  font-weight:600;
  transition:color .25s;
}
.gs-step.active{color:#F4EEDD;}
.gs-step.active .dot{
  background:linear-gradient(180deg,#C9A961,#A8873F);
  border-color:#C9A961;
  color:#0A1020;
  box-shadow:0 0 0 3px rgba(201,169,97,0.15);
}
.gs-step.done{color:#B7B0A0;}
.gs-step.done .dot{
  background:rgba(201,169,97,0.15);
  border-color:#C9A961;
  color:#C9A961;
}
.gs-step.done .dot::before{
  content:"✓";
  font-size:12px;color:#C9A961;font-weight:700;
}
.gs-step.done .dot{color:transparent;} /* cache le "1" quand done */
.gs-step-line{
  width:40px;height:1px;
  background:rgba(201,169,97,0.2);
  margin:0 12px;
}
@media (max-width:480px){
  .gs-ck-stepper{padding:12px 16px 2px;}
  .gs-step .txt{font-size:9.5px;letter-spacing:0.16em;}
  .gs-step-line{width:28px;margin:0 8px;}
}

/* ─── BOUTON RETOUR ─── */
.gs-back-btn{
  background:none;border:none;
  color:#B7B0A0;
  font-family:'Inter',sans-serif;
  font-size:11.5px;letter-spacing:0.14em;
  text-transform:uppercase;
  cursor:pointer;
  padding:0 0 14px;
  margin-bottom:4px;
  transition:color .2s;
}
.gs-back-btn:hover{color:#C9A961;}

/* ─── RÉCAP COMMANDE (étape 2) ─── */
.gs-ck-summary{
  border:1px solid rgba(201,169,97,0.18);
  padding:14px 16px;
  margin-bottom:20px;
  background:rgba(201,169,97,0.03);
  border-radius:2px;
}
.summary-row{
  display:flex;
  justify-content:space-between;
  align-items:baseline;
  padding:8px 0;
  font-size:13.5px;
  color:#F4EEDD;
  border-top:1px solid rgba(244,238,221,0.05);
}
.summary-row:first-child{border-top:none;padding-top:2px;}
.summary-row:last-child{padding-bottom:2px;}
.summary-row .s-name{flex:1;padding-right:12px;line-height:1.4;}
.summary-row .s-price{
  color:#E9D9A9;
  font-family:'Cormorant Garamond',serif;
  font-size:15px;font-weight:500;
  font-variant-numeric:tabular-nums;
}


.gs-checkout-overlay{
  position:fixed;inset:0;
  background:rgba(5,8,15,0.88);
  backdrop-filter:blur(8px);
  -webkit-backdrop-filter:blur(8px);
  z-index:9999;
  display:none;
  align-items:flex-start;
  justify-content:center;
  padding:24px 12px 40px;
  overflow-y:auto;
  overscroll-behavior:contain;
  animation:gsFadeIn .3s ease;
  font-family:'Inter',system-ui,-apple-system,sans-serif;
  color:#F4EEDD;
}
.gs-checkout-overlay.open{display:flex;}

@keyframes gsFadeIn{from{opacity:0}to{opacity:1}}
@keyframes gsSlideUp{from{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}

.gs-checkout-modal{
  width:100%;
  max-width:480px;
  background:linear-gradient(180deg,#0A1020 0%,#0E1628 100%);
  border:1px solid rgba(201,169,97,0.25);
  box-shadow:0 30px 80px -20px rgba(0,0,0,0.8), 0 0 0 1px rgba(201,169,97,0.05) inset;
  border-radius:4px;
  position:relative;
  animation:gsSlideUp .4s ease;
  margin:auto 0;
}
.gs-checkout-modal::before{
  content:"";
  position:absolute;top:0;left:0;right:0;height:2px;
  background:linear-gradient(90deg,transparent,#C9A961 50%,transparent);
}

/* Header */
.gs-ck-header{
  padding:20px 24px 16px;
  border-bottom:1px solid rgba(244,238,221,0.08);
  display:flex;
  align-items:center;
  justify-content:space-between;
}
.gs-ck-brand{
  font-family:'Cormorant Garamond',serif;
  font-size:13px;letter-spacing:0.24em;
  color:#E9D9A9;text-transform:uppercase;font-weight:600;
}
.gs-ck-close{
  background:none;border:none;color:#7A7568;cursor:pointer;
  font-size:22px;line-height:1;padding:4px 8px;
  transition:color .2s;
}
.gs-ck-close:hover{color:#F4EEDD;}

/* Body */
.gs-ck-body{padding:22px 24px 24px;}

.gs-ck-title{
  font-family:'Cormorant Garamond',serif;
  font-size:26px;line-height:1.15;font-weight:500;
  color:#F4EEDD;margin:0 0 6px;letter-spacing:-0.005em;
}
.gs-ck-title em{color:#C9A961;font-style:italic;font-weight:400;}
.gs-ck-subtitle{
  font-size:12px;color:#7A7568;letter-spacing:0.14em;
  text-transform:uppercase;margin:0 0 20px;
}

/* Champs formulaire */
.gs-ck-fields{display:grid;gap:12px;margin-bottom:22px;}
.gs-ck-row{display:grid;grid-template-columns:1fr 1fr;gap:10px;}
@media (max-width:420px){.gs-ck-row{grid-template-columns:1fr;}}

.gs-ck-field{position:relative;}
.gs-ck-field label{
  display:block;
  font-size:9.5px;letter-spacing:0.24em;
  text-transform:uppercase;color:#C9A961;
  margin-bottom:6px;font-weight:600;
}
.gs-ck-field input{
  width:100%;
  padding:12px 14px;
  background:rgba(20,28,47,0.6);
  border:1px solid rgba(201,169,97,0.18);
  color:#F4EEDD;
  font-family:'Inter',sans-serif;
  font-size:14px;
  border-radius:2px;
  outline:none;
  transition:border-color .2s, background .2s;
}
.gs-ck-field input:focus{
  border-color:rgba(201,169,97,0.5);
  background:rgba(20,28,47,0.9);
}
.gs-ck-field input::placeholder{color:#4a4640;}

/* Section bumps */
.gs-ck-bumps{
  border:1px solid rgba(201,169,97,0.18);
  padding:14px 16px;
  margin-bottom:22px;
  background:rgba(201,169,97,0.03);
  border-radius:2px;
}
.gs-ck-bumps-title{
  font-size:10px;letter-spacing:0.28em;text-transform:uppercase;
  color:#C9A961;font-weight:600;margin-bottom:12px;
  display:flex;align-items:center;gap:8px;
  flex-wrap:wrap;
}
.gs-ck-bumps-title::before{
  content:"";width:16px;height:1px;background:#C9A961;
}
/* Petite mention "▼ Cochez pour ajouter ▼" animée */
.bump-arrow-hint{
  display:inline-block;
  color:#E9D9A9;
  font-size:9.5px;
  font-weight:700;
  letter-spacing:0.2em;
  padding:3px 8px;
  background:rgba(201,169,97,0.12);
  border:1px solid rgba(201,169,97,0.3);
  border-radius:2px;
  animation:bumpHintPulse 1.4s ease-in-out infinite;
  text-shadow:0 0 6px rgba(201,169,97,0.4);
  order:2;
  margin-left:auto;
}
@keyframes bumpHintPulse{
  0%,100%{opacity:0.65;transform:translateY(0);}
  50%{opacity:1;transform:translateY(2px);}
}
/* Sur mobile étroit : passe à la ligne proprement */
@media (max-width:400px){
  .bump-arrow-hint{
    order:0;
    margin-left:0;
    width:100%;
    text-align:center;
    margin-top:4px;
  }
}

.gs-bump{
  display:flex;gap:12px;
  padding:12px 0;
  border-top:1px solid rgba(244,238,221,0.06);
  cursor:pointer;
  align-items:flex-start;
  transition:opacity .2s;
}
.gs-bump:first-of-type{border-top:none;padding-top:6px;}
.gs-bump.disabled{opacity:0.35;cursor:not-allowed;}

.gs-bump-check{
  flex-shrink:0;
  width:20px;height:20px;
  border:1.5px solid rgba(201,169,97,0.6);
  border-radius:2px;
  margin-top:2px;
  position:relative;
  background:rgba(10,16,32,0.6);
  transition:all .2s;
}
/* Halo pulsant autour de la case NON cochée (attire l'œil) */
.gs-bump:not(.checked):not(.disabled) .gs-bump-check::before{
  content:"";
  position:absolute;
  inset:-3px;
  border:1.5px solid #C9A961;
  border-radius:3px;
  opacity:0;
  animation:checkHalo 1.8s ease-out infinite;
  pointer-events:none;
}
@keyframes checkHalo{
  0%{opacity:0;inset:-1px;}
  30%{opacity:0.8;inset:-4px;}
  100%{opacity:0;inset:-9px;}
}
/* Une fois cochée : plus d'halo */
.gs-bump.checked .gs-bump-check::before{display:none;}
/* Effet best-value plus marqué (double halo) */
.gs-bump.best-value:not(.checked):not(.disabled) .gs-bump-check{
  box-shadow:0 0 0 2px rgba(201,169,97,0.3);
  animation:bestValueGlow 2s ease-in-out infinite;
}
@keyframes bestValueGlow{
  0%,100%{box-shadow:0 0 0 2px rgba(201,169,97,0.3),0 0 8px rgba(201,169,97,0.2);}
  50%{box-shadow:0 0 0 3px rgba(201,169,97,0.5),0 0 14px rgba(201,169,97,0.4);}
}
.gs-bump.checked .gs-bump-check{
  background:#C9A961;
  border-color:#C9A961;
}
.gs-bump.checked .gs-bump-check::after{
  content:"";
  position:absolute;
  left:6px;top:2px;
  width:5px;height:11px;
  border:solid #0A1020;
  border-width:0 2.5px 2.5px 0;
  transform:rotate(45deg);
}

.gs-bump-body{flex:1;font-size:13px;line-height:1.4;}
.gs-bump-body .name{
  font-weight:600;color:#F4EEDD;
  display:block;margin-bottom:3px;
  font-size:13.5px;
}
.gs-bump-body .desc{color:#B7B0A0;font-size:12.5px;}
.gs-bump-body .price-line{
  margin-top:5px;font-size:12px;
  display:flex;gap:8px;align-items:baseline;
}
.gs-bump-body .price-line .strike{
  color:#7A7568;text-decoration:line-through;
}
.gs-bump-body .price-line .now{
  color:#E9D9A9;font-weight:600;
  font-family:'Cormorant Garamond',serif;
  font-size:15px;
}
.gs-bump.best-value{position:relative;}
.gs-bump.best-value .badge{
  display:inline-block;
  font-size:8.5px;letter-spacing:0.22em;text-transform:uppercase;
  background:#C9A961;color:#0A1020;
  padding:2px 6px;border-radius:2px;
  margin-left:6px;font-weight:700;vertical-align:1px;
}

/* Section carte bancaire */
.gs-ck-card-label{
  font-size:9.5px;letter-spacing:0.24em;
  text-transform:uppercase;color:#C9A961;
  margin-bottom:10px;font-weight:600;
}
#gs-payment-element{
  padding:14px;
  background:rgba(20,28,47,0.6);
  border:1px solid rgba(201,169,97,0.18);
  border-radius:2px;
  min-height:80px;
  margin-bottom:16px;
}

/* Total */
.gs-ck-total{
  display:flex;
  justify-content:space-between;
  align-items:baseline;
  padding:14px 0 18px;
  border-top:1px solid rgba(244,238,221,0.1);
  margin-top:6px;
}
.gs-ck-total-lbl{
  font-size:11px;letter-spacing:0.22em;text-transform:uppercase;
  color:#B7B0A0;
}
.gs-ck-total-amt{
  font-family:'Cormorant Garamond',serif;
  font-size:32px;color:#E9D9A9;font-weight:600;
  line-height:1;
  font-variant-numeric:tabular-nums;
}

/* Bouton principal */
.gs-ck-submit{
  display:flex;align-items:center;justify-content:center;
  gap:10px;
  width:100%;
  padding:18px 20px;
  background:linear-gradient(180deg,#C9A961 0%,#A8873F 100%);
  color:#FFFFFF;
  border:none;
  font-family:'Inter',sans-serif;
  font-size:13px;font-weight:600;
  letter-spacing:0.22em;text-transform:uppercase;
  cursor:pointer;
  position:relative;overflow:hidden;
  text-shadow:0 1px 2px rgba(0,0,0,0.3);
  transition:transform .12s;
}
.gs-ck-submit::after{display:none;}
@keyframes gsShimmer{0%{left:-60%;opacity:0}10%{opacity:0}25%{opacity:1}50%{opacity:1}60%{left:120%;opacity:0}100%{left:120%;opacity:0}}
.gs-ck-submit:active{transform:translateY(1px);}
.gs-ck-submit[disabled]{opacity:0.55;cursor:wait;}
.gs-ck-submit .spinner{
  width:14px;height:14px;
  border:2px solid rgba(255,255,255,0.3);
  border-top-color:#fff;
  border-radius:50%;
  animation:gsSpin .8s linear infinite;
  display:none;
}
.gs-ck-submit.loading .spinner{display:inline-block;}
.gs-ck-submit.loading .label{display:none;}
@keyframes gsSpin{to{transform:rotate(360deg)}}

/* Fine print */
.gs-ck-fine{
  text-align:center;font-size:11px;
  color:#7A7568;margin-top:14px;line-height:1.6;
}
.gs-ck-fine .lock{
  display:inline-flex;align-items:center;gap:5px;
  color:#B7B0A0;
}
.gs-ck-fine svg{width:10px;height:10px;stroke:#7A7568;fill:none;stroke-width:1.5;}
.gs-ck-fine a{color:#7A7568;text-decoration:underline;text-decoration-color:rgba(201,169,97,0.3);}
.gs-ck-fine a:hover{color:#C9A961;}

/* Erreurs */
.gs-ck-error{
  display:none;
  padding:12px 14px;
  background:rgba(139,30,45,0.12);
  border:1px solid rgba(139,30,45,0.4);
  border-left:3px solid #8B1E2D;
  color:#E8B5BC;
  font-size:12.5px;line-height:1.5;
  margin-bottom:14px;border-radius:2px;
}
.gs-ck-error.visible{display:block;}

/* Écran de succès */
.gs-ck-success{
  display:none;
  text-align:center;
  padding:30px 20px;
}
.gs-ck-success.visible{display:block;}
.gs-ck-success .check-icon{
  width:64px;height:64px;
  margin:0 auto 20px;
  border-radius:50%;
  background:rgba(201,169,97,0.15);
  border:2px solid #C9A961;
  display:flex;align-items:center;justify-content:center;
  animation:gsPulse 1.4s ease-out;
}
@keyframes gsPulse{
  0%{transform:scale(0.5);opacity:0}
  60%{transform:scale(1.1);opacity:1}
  100%{transform:scale(1);opacity:1}
}
.gs-ck-success .check-icon svg{
  width:32px;height:32px;stroke:#C9A961;fill:none;stroke-width:2.5;
  stroke-linecap:round;stroke-linejoin:round;
}
.gs-ck-success .success-title{
  font-family:'Cormorant Garamond',serif;
  font-size:26px;color:#F4EEDD;margin:0 0 8px;font-weight:500;
}
.gs-ck-success .success-msg{
  color:#B7B0A0;font-size:14px;line-height:1.6;margin:0 0 20px;
}
.gs-ck-success .redirect-note{
  font-size:11px;letter-spacing:0.18em;text-transform:uppercase;
  color:#7A7568;
}

/* Responsive tweaks */
@media (max-width:480px){
  .gs-checkout-overlay{padding:12px 8px 24px;}
  .gs-ck-header{padding:16px 18px 12px;}
  .gs-ck-body{padding:18px 18px 20px;}
  .gs-ck-title{font-size:22px;}
  .gs-ck-total-amt{font-size:26px;}
}