/* ========= Thème & variables ========= */
.rnf-pb-form{
  --pme-gold: #CB943E;
  --pme-gold-600: #B37F2F;
  --pme-gold-100: #FFF6E9;
  --pme-border: #e5e7eb;
  --pme-muted: #6b7280;
  --pme-ring: rgba(203,148,62,.35);
}

/* ========= Formulaire ========= */
.rnf-pb-form{border:1px solid #eee;padding:16px;border-radius:14px;background:#fff;box-shadow:0 2px 10px rgba(0,0,0,.04)}
.rnf-pb-form.premium h3{margin-top:0}
.rnf-pb-form .grid{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.rnf-pb-form .grid .span-2{grid-column:span 2}
.rnf-pb-form label{font-weight:500;color:#111}
.rnf-pb-form input,.rnf-pb-form select{
  width:100%;padding:10px;border:1px solid var(--pme-border);border-radius:10px;outline:0;
}
.rnf-pb-form input:focus,.rnf-pb-form select:focus{box-shadow:0 0 0 3px var(--pme-ring);border-color:var(--pme-gold)}
.rnf-pb-form fieldset{border:1px solid #f2f2f2;padding:12px;border-radius:12px;margin:12px 0}

/* ========= Cartes ========= */
.card-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}
.card{position:relative;border:1px solid var(--pme-border);border-radius:14px;cursor:pointer;transition:.2s;background:#fff}
.card .card-body{padding:14px}
.card .card-title{font-weight:700}
.card .card-sub{color:var(--pme-muted);font-size:.92rem}
.card input{position:absolute;opacity:0;cursor:pointer}
.card:hover{box-shadow:0 6px 20px rgba(0,0,0,.06);transform:translateY(-1px)}
.card.selected{outline:2px solid var(--pme-gold); background:var(--pme-gold-100)}
.variant-cards .card .card-sub strong{font-weight:700}
.variants-title{font-weight:600;margin:6px 0 2px}

/* ========= Options ========= */
.options-grid{display:flex;justify-content: space-around;background-color:var(--pme-gold-100);}
.check{display:flex;gap:8px;align-items:center;padding:10px;border:1px dashed #eee;border-radius:10px}
.check input{transform:translateY(1px);width:50px;height:20px;}
.frame-choices select{margin-top:10px}

/* ========= Boutons ========= */
.rnf-pb-form .button{
  padding:10px 16px;border-radius:999px;border:1px solid var(--pme-border);background:#fafafa;cursor:pointer;transition:.15s;
}
.rnf-pb-form .button:hover{background:#fff;border-color:var(--pme-gold);color:#111}
.rnf-pb-form .button.primary{background:var(--pme-gold);border-color:var(--pme-gold);color:#fff}
.rnf-pb-form .button.primary:hover{background:var(--pme-gold-600);border-color:var(--pme-gold-600);color:#fff}
.rnf-pb-form .button.outline{background:#fff;border-color:var(--pme-gold);color:var(--pme-gold)}
.rnf-pb-form .button.outline:hover{background:var(--pme-gold);color:#fff}
.rnf-pb-form .button.button-danger{background:#FEE2E2;border-color:#FCA5A5;color:#991B1B}
.rnf-pb-form .button.button-danger:hover{background:#FCA5A5;color:#fff;border-color:#F87171}

.rnf-pb-form .total{font-size:1.15rem;margin-top:8px}
.rnf-pb-form .availability{margin:8px 0}
.rnf-pb-form .availability .warn{color:#c62828}

/* ========= Tiroir ========= */
.rnf-cart-drawer{
  position: fixed; top: 88px; right: 16px; width: 340px; max-height: calc(100vh - 140px);
  background: #fff; border: 1px solid #eee; border-radius: 14px; box-shadow:0 10px 30px rgba(0,0,0,.12);
  padding: 12px; transform: translateX(380px); transition: transform .2s ease; z-index: 9999; overflow:auto;
}
.rnf-cart-drawer.open{ transform: translateX(0); }
.rnf-cart-header{ display:flex; align-items:center; justify-content:space-between; margin-bottom:8px }
.rnf-cart-close{
  appearance:none; border:1px solid var(--pme-border);
  background:#F3F4F6; width:28px; height:28px; border-radius:50%; cursor:pointer;
  color:#111; font-weight:700; line-height:1; display:inline-flex; align-items:center; justify-content:center;
}
.rnf-cart-close:hover{ background:#fff; border-color:var(--pme-gold); }
.rnf-cart-items{ display:flex; flex-direction:column; gap:8px; }
.rnf-cart-item{ display:flex; justify-content:space-between; align-items:center; border-bottom:1px dashed #eee; padding:6px 0; }
.rnf-cart-item small{ color:var(--pme-muted) }
.rnf-item-right{ display:flex; align-items:center; gap:4px; }
.rnf-item-price{ font-weight:600; }
.rnf-cart-total{ display:flex; justify-content:space-between; align-items:center; padding-top:8px; font-size:1.05rem }
.rnf-cart-amount{ font-weight:700 }
.rnf-cart-toggle{ margin-left:8px }

/* petite croix de retrait */
.rnf-cart-item .rnf-remove{
  appearance:none; border:0; background:transparent; cursor:pointer;
  font-size:18px; line-height:1; padding:0 6px; color:#9ca3af;
  opacity:0; visibility:hidden; transition:opacity .15s ease, color .15s ease;
}
.rnf-cart-item:hover .rnf-remove{ opacity:1; visibility:visible; color:var(--pme-gold); }

/* Récap inline */
.rnf-recap-inline{ margin-top:12px; border:1px solid #f2f2f2; border-radius:12px; padding:12px; background:#fff; }
.rnf-recap-inline .rnf-cart-header{ margin-bottom:6px }

/* Bouton flottant mobile */
.rnf-cart-fab{
  position:fixed; right:16px; bottom:16px; z-index:10000;
  width:46px; height:46px; border-radius:50%; border:none; cursor:pointer;
  display:flex; align-items:center; justify-content:center;
  background:var(--pme-gold); color:#fff; box-shadow:0 6px 20px rgba(0,0,0,.18);
}
.rnf-cart-fab:hover{ background:var(--pme-gold-600); }

/* ========= Responsive : tout en 1 colonne ========= */
@media(max-width:1024px){
  .rnf-pb-form .grid{
    display:grid; grid-template-columns:1fr !important; gap:12px;
  }
  .rnf-pb-form .grid > *{ grid-column:1 / -1 !important; }
  .rnf-pb-form .grid .span-2{ grid-column:1 / -1 !important; }
  .rnf-pb-form input,.rnf-pb-form select{ width:100% !important; box-sizing:border-box; }

  .card-grid{grid-template-columns:1fr !important}
  .options-grid{grid-template-columns:1fr !important}

  .rnf-cart-drawer{ width:100%; right:0; left:0; top:auto; bottom:0; border-radius:12px 12px 0 0; transform: translateY(120%); }
  .rnf-cart-drawer.open{ transform: translateY(0); }
}

/* Très petits écrans */
@media(max-width:640px){
  .rnf-pb-form .grid{ grid-template-columns:1fr !important; }
  .card-grid,.options-grid{ grid-template-columns:1fr !important; }
}
