/* RESET simple */
*,
*::before,
*::after{
  box-sizing:border-box;
  margin:0;
  padding:0;
}

body{
  font-family:"Inter", system-ui, -apple-system, BlinkMacSystemFont, sans-serif;
  background:#f3f5f7;
  color:#111827;
}

/* WRAPPER GLOBAL */
.pm-checkout-wrapper{
  min-height:100vh;
  padding:20px 12px 30px;
  display:flex;
  flex-direction:column;
  gap:18px;
}

/* HEADER */
.pm-checkout-header{
  max-width:1120px;
  margin:0 auto;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  flex-wrap:wrap;
}

.pm-checkout-logo{
  display:flex;
  align-items:center;
  gap:8px;
  font-weight:700;
  font-size:.95rem;
  letter-spacing:.04em;
  text-transform:uppercase;
  color:#0b1120;
}

.pm-checkout-logo img{
  width:40px;
  height:40px;
  border-radius:10px;
}

.pm-checkout-steps{
  display:flex;
  align-items:center;
  gap:6px;
  font-size:.75rem;
  flex-wrap:wrap;
}

.pm-checkout-steps .step{
  padding:4px 10px;
  border-radius:999px;
  border:1px solid rgba(15,23,42,.08);
  color:#6b7280;
}

.pm-checkout-steps .step.active{
  background:#0f172a;
  color:#facc15;
  border-color:#0f172a;
}

/* MAIN LAYOUT */
.pm-checkout-main{
  max-width:1120px;
  margin:0 auto;
  display:grid;
  grid-template-columns:minmax(0, 3fr) minmax(0, 2fr);
  gap:20px;
  align-items:flex-start;
}

@media (max-width:900px){
  .pm-checkout-main{
    grid-template-columns:1fr;
  }
}

/* CARTES */
.pm-checkout-form,
.pm-checkout-summary{
  background:#ffffff;
  border-radius:18px;
  padding:20px 18px 22px;
  box-shadow:0 18px 45px rgba(15,23,42,.08);
  border:1px solid rgba(15,23,42,.06);
}

/* Animation entrée */
.pm-animate{
  opacity:0;
  transform:translateY(22px);
  transition:opacity .5s ease-out, transform .5s ease-out;
}
.pm-in-view{
  opacity:1;
  transform:none;
}

/* TITRES & TEXTES */
.pm-checkout-form h1{
  font-size:1.35rem;
  margin-bottom:6px;
  color:#0f172a;
}

.pm-subtitle{
  font-size:.9rem;
  color:#6b7280;
  margin-bottom:18px;
}

.pm-checkout-summary h2{
  font-size:1.1rem;
  margin-bottom:10px;
  color:#0f172a;
}

/* FORMULAIRE */
.pm-form{
  display:flex;
  flex-direction:column;
  gap:12px;
}

.pm-form-group-inline{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:12px;
}

@media (max-width:640px){
  .pm-checkout-wrapper{
    padding:14px 10px 22px;
  }
  .pm-checkout-header{
    flex-direction:column;
    align-items:flex-start;
  }
  .pm-form-group-inline{
    grid-template-columns:1fr;
  }
}

.pm-field{
  display:flex;
  flex-direction:column;
  gap:4px;
}

.pm-field label{
  font-size:.82rem;
  font-weight:500;
  color:#374151;
}

.pm-field input,
.pm-field textarea,
.pm-field select{
  border-radius:10px;
  border:1px solid #d1d5db;
  padding:9px 11px;
  font-size:.9rem;
  outline:none;
  transition:border-color .2s ease, box-shadow .2s ease, transform .08s;
  background:#f9fafb;
}

.pm-field input:focus,
.pm-field textarea:focus,
.pm-field select:focus{
  border-color:#3b82f6;
  box-shadow:0 0 0 1px rgba(59,130,246,.22);
  background:#ffffff;
}

.pm-field textarea{
  resize:vertical;
  min-height:70px;
}

/* BOUTONS */
.pm-form-actions{
  display:flex;
  justify-content:space-between;
  gap:10px;
  margin-top:10px;
  flex-wrap:wrap;
}

.pm-btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:6px;
  border-radius:999px;
  padding:9px 16px;
  font-size:.9rem;
  font-weight:600;
  border:1px solid transparent;
  cursor:pointer;
  text-decoration:none;
  transition:background .2s ease, transform .1s ease, box-shadow .2s ease, color .2s ease;
}

.pm-btn-primary{
  background:linear-gradient(135deg,#facc15,#eab308);
  color:#111827;
  box-shadow:0 12px 30px rgba(161,98,7,.45);
}

.pm-btn-primary:hover{
  transform:translateY(-1px);
  box-shadow:0 18px 40px rgba(161,98,7,.5);
}

.pm-btn-ghost{
  background:#f3f4f6;
  color:#111827;
  border-color:#e5e7eb;
}

.pm-btn-ghost:hover{
  background:#e5e7eb;
}

.pm-btn-full{
  width:100%;
  justify-content:center;
}

.pm-btn i{
  font-size:.9rem;
}

/* INFO BAS FORMULAIRE */
.pm-small-note{
  margin-top:6px;
  font-size:.8rem;
  color:#6b7280;
}

/* RÉCAP COMMANDE */
.pm-summary-products{
  margin-top:6px;
  margin-bottom:10px;
  display:flex;
  flex-direction:column;
  gap:6px;
  max-height:260px;
  overflow:auto;
  padding-right:4px;
}

.pm-summary-products::-webkit-scrollbar{
  width:4px;
}
.pm-summary-products::-webkit-scrollbar-thumb{
  background:#cbd5f5;
  border-radius:999px;
}

.pm-summary-line{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:8px;
  font-size:.9rem;
}

.pm-summary-line.small{
  font-size:.84rem;
  color:#4b5563;
}

.pm-summary-line.total{
  margin-top:4px;
  padding-top:4px;
  border-top:1px dashed rgba(15,23,42,.15);
  font-weight:700;
  font-size:.95rem;
  color:#0f172a;
}

.pm-summary-name{
  display:flex;
  align-items:center;
  gap:6px;
  color:#111827;
}

.pm-summary-name i{
  color:#22c55e;
  font-size:.8rem;
}

.pm-summary-price{
  font-weight:600;
  color:#111827;
}

.pm-summary-separator{
  margin:8px 0;
  border-bottom:1px solid rgba(148,163,184,.5);
}

.pm-summary-totals{
  display:flex;
  flex-direction:column;
  gap:3px;
}

.pm-summary-badges{
  margin-top:12px;
  display:flex;
  flex-direction:column;
  gap:4px;
  font-size:.8rem;
  color:#4b5563;
}

.pm-summary-badges div{
  display:inline-flex;
  align-items:center;
  gap:6px;
}

.pm-summary-badges i{
  color:#0ea5e9;
}

.pm-summary-footer{
  margin-top:12px;
}

.pm-muted{
  font-size:.85rem;
  color:#6b7280;
}

/* Compact sur très petit écran */
@media (max-width:480px){
  .pm-checkout-form,
  .pm-checkout-summary{
    padding:14px 12px 16px;
    border-radius:14px;
  }
  .pm-checkout-form h1{
    font-size:1.15rem;
  }
  .pm-checkout-summary h2{
    font-size:1rem;
  }
}