.rfbox-wrap{
  --rose:var(--rf-accent,#eab0c0);
  --rose-2:#f7e8ed;
  --rose-3:#f4c9d3;
  --rose-dark:#a14b68;
  --card:#fff;
  --ink:#221f26;
  --muted:#6b5a61;
  --line:#ece7ea;
  --ok:#2e7d32;
  --danger:#b93d4f;
  font-family:system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Arial,sans-serif;
  color:var(--ink);
  font-size:16px;
  line-height:1.5;
  position:relative;
  width:100%;
  max-width:100%;
  isolation:isolate;
}
.rfbox-wrap *{box-sizing:border-box;}
.rfbox-wrap.rfbox-loading{opacity:.7;pointer-events:none;}
.rfbox-wrap button{font-family:inherit;}
.rfbox-wrap img{max-width:100%;display:block;border:0;}
.rfbox-wrap button:focus-visible{outline:2px solid rgba(161,75,104,.35);outline-offset:2px;}

.rfbox-stepper{
  display:flex;
  align-items:center;
  gap:10px;
  margin:0 0 24px;
  position:relative;
  z-index:5;
}
.rfbox-stepper-step{
  display:flex;
  align-items:center;
  gap:8px;
  padding:8px 14px;
  border-radius:999px;
  border:1px solid var(--line);
  background:#faf7f9;
  color:var(--muted);
  font-size:13px;
  white-space:nowrap;
  transition:transform .25s ease,opacity .25s ease,filter .25s ease,box-shadow .25s ease;
}
.rfbox-stepper-step.active{
  border-color:var(--rose-dark);
  background:var(--rose-2);
  color:var(--rose-dark);
  box-shadow:0 0 0 1px rgba(161,75,104,.06);
  opacity:1;
  filter:none;
  transform:scale(1.05);
  z-index:2;
}
.rfbox-stepper-step.completed{border-color:var(--rose);background:#fff;color:var(--ok);}
.rfbox-stepper-index{
  width:22px;
  height:22px;
  border-radius:999px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  font-weight:600;
  background:#fff;
}
.rfbox-stepper-step.active .rfbox-stepper-index{background:var(--rose-dark);color:#fff;}
.rfbox-stepper-step.completed .rfbox-stepper-index{background:var(--rose);color:#fff;}
.rfbox-stepper-line{flex:1 1 auto;height:1px;background:linear-gradient(90deg,var(--rose-2),transparent);}
.rfbox-stepper-step:not(.active){opacity:.55;filter:blur(1.5px);transform:scale(.96);}

@media (min-width:1025px){
  .rfbox-stepper-step:not(.active){filter:blur(1px);opacity:.6;}
  .rfbox-stepper-step.active{transform:scale(1.06);box-shadow:0 8px 20px rgba(161,75,104,.18);}
}
@media (max-width:1024px){
  .rfbox-stepper{justify-content:center;gap:14px;overflow:visible;margin-bottom:20px;padding:0 12px;}
  .rfbox-stepper-line{display:none;}
  .rfbox-stepper-step:not(.active){opacity:.45;filter:blur(2.5px);transform:scale(.85);}
  .rfbox-stepper-step.active{transform:scale(1.1);box-shadow:0 10px 24px rgba(161,75,104,.25);}
  .rfbox-stepper-step.active .rfbox-stepper-index{width:28px;height:28px;font-size:14px;}
  .rfbox-stepper-label{font-size:12px;}
  .rfbox-stepper-step{transform-origin:center;}
}
@media (max-width:600px){
  .rfbox-stepper{gap:10px;}
  .rfbox-stepper-step{padding:6px 12px;}
  .rfbox-stepper-label{font-size:11px;}
}

.rfbox-steps{
  background:#fff;
  border-radius:18px;
  padding:20px;
  box-shadow:0 12px 30px rgba(20,12,20,.06);
  max-width:100%;
  width:100%;
  position:relative;
  z-index:1;
}
.rfbox-step{display:none;}
.rfbox-step.active{display:block;}

.rfbox-landing{display:flex;align-items:stretch;justify-content:center;}
.rfbox-landing-inner{max-width:780px;margin:0 auto;text-align:center;padding:32px 16px 12px;}
.rfbox-landing-title{font-size:28px;line-height:1.2;margin:0 0 12px;font-weight:700;}
.rfbox-landing-intro{font-size:15px;color:var(--muted);margin:0 0 14px;}
.rfbox-landing-minima{font-size:14px;color:var(--muted);margin:0 0 22px;}

@keyframes rfboxCtaFloat{
  0%{transform:translateY(0);}
  50%{transform:translateY(-1px);}
  100%{transform:translateY(0);}
}
.rfbox-landing-cta{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:6px;
  border-radius:999px;
  padding:10px 26px;
  background:var(--rose-dark);
  color:#fff;
  border:none;
  cursor:pointer;
  font-weight:600;
  font-size:15px;
  box-shadow:0 10px 20px rgba(161,75,104,.25);
  transition:transform .12s ease,box-shadow .12s ease,background .12s ease;
}
.rfbox-landing-cta:hover{
  background:#892f54;
  animation:rfboxCtaFloat .9s ease-in-out infinite;
  box-shadow:0 14px 26px rgba(161,75,104,.3);
}
.rfbox-landing-cta:active{
  animation:none;
  transform:translateY(0);
  box-shadow:0 8px 16px rgba(161,75,104,.2);
}
.rfbox-landing-cta.is-validated{animation:none;transform:translateY(0);}

.rfbox-builder{
  display:grid;
  grid-template-columns:360px minmax(0,1fr);
  gap:24px;
  max-width:100%;
  position:relative;
  z-index:1;
}
.rfbox-left,.rfbox-right{min-width:0;max-width:100%;}

@media (max-width:1024px){
  .rfbox-builder{display:flex;flex-direction:column;gap:14px;}
  .rfbox-wrap{overflow-x:hidden !important;}
  .rfbox-steps{padding:12px !important;}
}

.rfbox-left{
  background:#fff;
  border-radius:18px;
  border:1px solid #f1e5ec;
  padding:16px 16px 18px;
  display:flex;
  flex-direction:column;
  gap:14px;
  position:relative;
  z-index:2;
}
.rfbox-rosy{display:flex;align-items:flex-start;gap:10px;}
.rfbox-rosy-avatar-sprite{
  width:150px;
  height:150px;
  background-image:var(--rosy-sprite);
  background-size:500px 300px;
  background-repeat:no-repeat;
  border-radius:50%;
  background-color:#fff;
  box-shadow:0 6px 14px rgba(0,0,0,.12);
  flex-shrink:0;
}
.rfbox-rosy-avatar-sprite.rosy-sad{background-position:5% -2%;}
.rfbox-rosy-avatar-sprite.rosy-joy{background-position:94% 86%;}
.rfbox-rosy-avatar-sprite.rosy-love{background-position:47% -2%;}
.rfbox-rosy-bubble{
  background:#fff9fb;
  border-radius:12px;
  padding:10px 12px;
  font-size:14px;
  color:var(--muted);
  border:1px solid #f7dde9;
}

.rfbox-counters{display:flex;flex-wrap:wrap;gap:6px;font-size:13px;}
.rfbox-count{padding:4px 10px;border-radius:999px;border:1px solid #f0e3ee;background:#faf7fb;color:var(--muted);}
.rfbox-count--decoration{border-color:#e6d4ff;}
.rfbox-count--lingerie{border-color:#ffd6ec;}
.rfbox-count--jeux{border-color:#ffe9c7;}

.rfbox-box-area{
  min-height:120px;
  border-radius:16px;
  border:1px dashed #eadfea;
  background:#fdf9fc;
  padding:10px;
  position:relative;
  overflow:hidden;
}
.rfbox-box-area.full{animation:rfbox-shake .28s ease;}
@keyframes rfbox-shake{
  0%{transform:translateX(0);}
  20%{transform:translateX(-4px);}
  40%{transform:translateX(4px);}
  60%{transform:translateX(-3px);}
  80%{transform:translateX(3px);}
  100%{transform:translateX(0);}
}

.rfbox-chips{display:flex;flex-wrap:wrap;gap:8px;}
.rfbox-chip{
  display:flex;
  align-items:center;
  gap:6px;
  padding:4px 8px;
  border-radius:999px;
  background:#fff;
  border:1px solid #f1e5ec;
  box-shadow:0 4px 8px rgba(20,12,20,.04);
  max-width:100%;
}
.rfbox-chip-img{width:30px;height:30px;border-radius:8px;object-fit:cover;}
.rfbox-chip-name{font-size:13px;white-space:nowrap;text-overflow:ellipsis;overflow:hidden;max-width:150px;}
.rfbox-chip-x{border:none;background:transparent;color:var(--danger);font-size:16px;padding:0 2px;cursor:pointer;line-height:1;}

.rfbox-fly{
  position:fixed;
  width:80px;
  height:80px;
  object-fit:cover;
  border-radius:12px;
  pointer-events:none;
  z-index:99990;
  transition:transform .35s ease-out,opacity .35s ease-out;
}

.rfbox-totals{
  margin-top:4px;
  border-top:1px solid #f0e3ee;
  padding-top:10px;
  display:flex;
  flex-direction:column;
  gap:4px;
  font-size:14px;
}
.rfbox-totals>div{display:flex;justify-content:space-between;align-items:center;}
.rfbox-totals strong{font-weight:600;}
.rfbox-discount{color:var(--danger);}
.rfbox-discount.hidden{display:none;}

.rfbox-add-btn{
  margin-top:6px;
  width:100%;
  border-radius:999px;
  padding:10px 16px;
  border:none;
  cursor:pointer;
  background:var(--rose-dark);
  color:#fff;
  font-weight:600;
  font-size:15px;
  box-shadow:0 10px 20px rgba(161,75,104,.25);
  transition:opacity .12s ease,transform .12s ease,box-shadow .12s ease;
}
.rfbox-add-btn:disabled{opacity:.5;cursor:not-allowed;box-shadow:none;}
.rfbox-add-btn:not(:disabled):hover{transform:translateY(-1px);box-shadow:0 14px 26px rgba(161,75,104,.3);}

.rfbox-step-back{
  margin-top:4px;
  width:100%;
  border-radius:999px;
  padding:8px 14px;
  border:1px solid #e4d7e6;
  background:#fff;
  color:var(--muted);
  cursor:pointer;
  font-size:13px;
}

.rfbox-right{
  background:#fff;
  border-radius:18px;
  border:1px solid #f1e5ec;
  padding:14px 14px 16px;
  display:flex;
  flex-direction:column;
  gap:12px;
  max-width:100%;
  position:relative;
  z-index:1;
  overflow:visible !important;
}

.rfbox-tabs{
  display:flex;
  flex-wrap:nowrap;
  gap:10px;
  overflow-x:auto;
  overflow-y:visible !important;
  -webkit-overflow-scrolling:touch;
  scrollbar-width:thin;
  scrollbar-color:rgba(161,75,104,.45) #f6eef2;
  padding:2px 12px 12px !important;
  margin:0;
  position:relative;
  z-index:2;
  scroll-padding-left:12px;
}
.rfbox-tabs::-webkit-scrollbar{height:10px;}
.rfbox-tabs::-webkit-scrollbar-track{background:#f6eef2;border-radius:999px;}
.rfbox-tabs::-webkit-scrollbar-thumb{background:rgba(161,75,104,.35);border-radius:999px;border:2px solid #f6eef2;}
.rfbox-tab{
  flex:0 0 auto;
  border-radius:999px;
  padding:6px 14px;
  border:1px solid #e1d3e6;
  background:#faf7fb;
  color:var(--muted);
  font-size:13px;
  cursor:pointer;
  white-space:nowrap;
}
.rfbox-tab.active{background:var(--rose-dark);color:#fff;border-color:transparent;}
@media (min-width:1025px){.rfbox-tabs{justify-content:center;}}

.rfbox-filters{
  display:flex;
  flex-wrap:wrap;
  gap:12px 14px;
  align-items:center;
  padding:12px;
  background:rgba(247,232,237,.75);
  border:1px solid rgba(161,75,104,.12);
  border-radius:16px;
  max-width:100%;
  min-width:0;
  position:relative;
  z-index:1;
}
.rfbox-price-label{
  font-size:12px;
  font-weight:800;
  color:var(--rose-dark,#a14b68);
  white-space:nowrap;
}
.rfbox-price-filter{
  flex:1 1 220px;
  min-width:180px;
  display:flex;
  align-items:center;
  gap:10px;
}
.rfbox-price-filter input[type="range"]{width:20%;min-width:150px;}
input.rfbox-price-max{
  -webkit-appearance:none;
  appearance:none;
  width:20%;
  height:10px;
  border-radius:999px;
  background:linear-gradient(90deg,var(--rose-dark,#a14b68),var(--rose,#eab0c0));
  outline:none;
}
input.rfbox-price-max::-webkit-slider-thumb{
  -webkit-appearance:none;
  appearance:none;
  width:22px;
  height:22px;
  border-radius:50%;
  background:#fff;
  border:2px solid var(--rose-dark,#a14b68);
  box-shadow:0 10px 18px rgba(0,0,0,.10);
  cursor:pointer;
}
input.rfbox-price-max::-moz-range-thumb{
  width:22px;
  height:22px;
  border-radius:50%;
  background:#fff;
  border:2px solid var(--rose-dark,#a14b68);
  box-shadow:0 10px 18px rgba(0,0,0,.10);
  cursor:pointer;
}
input.rfbox-price-max::-moz-range-track{
  height:10px;
  border-radius:999px;
  background:linear-gradient(90deg,var(--rose-dark,#a14b68),var(--rose,#eab0c0));
}
.rfbox-price-readout{
  font-size:12px;
  font-weight:800;
  color:var(--ink,#221f26);
  background:#fff;
  border:1px solid rgba(161,75,104,.14);
  border-radius:999px;
  padding:7px 10px;
  line-height:1;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}
.rfbox-sort{font-size:12px;min-width:0;margin-left:auto;}
.rfbox-sort label{display:flex;align-items:center;gap:8px;white-space:nowrap;justify-content:flex-end;}
.rfbox-sort select{
  max-width:220px;
  width:auto;
  font-size:12px;
  border:1px solid #e1d3e6;
  border-radius:999px;
  padding:6px 10px;
  background:#fff;
}
@media (max-width:1024px){
  .rfbox-sort{margin-left:0;width:100%;}
  .rfbox-sort label{justify-content:space-between;width:100%;}
  .rfbox-sort select{width:100%;max-width:100%;}
}
@media (max-width:520px){
  .rfbox-price-label{width:100%;justify-content:flex-start;margin-bottom:-4px;}
  .rfbox-price-filter{width:100% !important;flex:1 1 100% !important;min-width:0 !important;}
  .rfbox-price-filter input[type="range"]{width:100% !important;}
  .rfbox-price-readout{width:100%;text-align:center;}
}

.rfbox-subcats{
  display:flex;
  flex-wrap:nowrap;
  gap:10px;
  overflow-x:auto;
  overflow-y:visible !important;
  -webkit-overflow-scrolling:touch;
  scrollbar-width:thin;
  scrollbar-color:rgba(161,75,104,.45) #f6eef2;
  padding-left:2% !important;
  padding-right:0px !important;
  padding-top:2px;
  padding-bottom:12px;
  margin:0;
  max-width:100%;
  position:relative;
  z-index:1;
  scroll-padding-left:120px;
  scroll-padding-right:var(--rfbox-subcats-gutter,14px);
  scroll-snap-type:none;
  scroll-behavior:smooth;
  transform:translateZ(0);
  will-change:scroll-position;
}
.rfbox-subcats::-webkit-scrollbar{height:10px;}
.rfbox-subcats::-webkit-scrollbar-track{background:#f6eef2;border-radius:999px;}
.rfbox-subcats::-webkit-scrollbar-thumb{background:rgba(161,75,104,.35);border-radius:999px;border:2px solid #f6eef2;}

@media (max-width:768px){
  .rfbox-wrap .rfbox-subcats{
    padding-left:15% !important;
    padding-right:12px !important;
    scroll-padding-left:120px;
  }
}
@media (max-width:1025px){
  .rfbox-wrap .rfbox-subcats{
    padding-left:2% !important;
    padding-right:0px !important;
    scroll-padding-left:120px;
  }
}

.rfbox-subcats>button{
  flex:0 0 auto;
  white-space:nowrap;
  border-radius:999px;
  padding:6px 12px;
  border:1px solid #e3d6ea;
  background:#fdf9ff;
  font-size:12px;
  cursor:pointer;
  color:var(--muted);
  position:relative;
  overflow:hidden;
  transform:translateZ(0);
  will-change:transform, box-shadow;
  transition:transform .18s ease,box-shadow .18s ease,background-color .18s ease,border-color .18s ease,color .18s ease;
}
.rfbox-subcats>button::after{
  content:"";
  position:absolute;
  inset:-2px;
  background:linear-gradient(115deg,rgba(255,255,255,0) 0%,rgba(255,255,255,.55) 35%,rgba(255,255,255,0) 70%);
  transform:translateX(-120%);
  opacity:0;
  transition:transform .45s ease, opacity .25s ease;
  pointer-events:none;
}
@media (hover:hover){
  .rfbox-subcats>button:hover{
    transform:translateY(-1px);
    border-color:rgba(161,75,104,.38);
    background:rgba(247,232,237,.75);
    box-shadow:0 10px 22px rgba(20,12,20,.10),0 0 0 3px rgba(234,176,192,.25);
  }
  .rfbox-subcats>button:hover::after{
    opacity:1;
    transform:translateX(120%);
  }
}
.rfbox-subcats>button:active{
  transform:translateY(0);
  box-shadow:0 7px 16px rgba(20,12,20,.10),0 0 0 3px rgba(234,176,192,.22);
}
.rfbox-subcats>button:focus-visible{
  outline:none;
  box-shadow:0 0 0 4px rgba(234,176,192,.35),0 10px 22px rgba(20,12,20,.10);
}
.rfbox-subcats>button[aria-pressed="true"]{
  background:linear-gradient(180deg, rgba(244,201,211,.85), rgba(247,232,237,.75));
  border-color:rgba(161,75,104,.65);
  color:#552233;
  box-shadow:0 12px 24px rgba(161,75,104,.18),0 0 0 2px rgba(161,75,104,.10) inset;
}

.rfbox-grid-products{
  margin-top:6px;
  display:grid;
  grid-template-columns:repeat(auto-fill,minmax(180px,1fr));
  gap:14px;
  align-items:stretch;
  position:relative;
  z-index:1;
}
.rfbox-empty-products{font-size:14px;color:var(--muted);padding:10px 6px;}

.rfbox-card{
  border-radius:14px;
  overflow:hidden;
  background:#fff;
  border:1px solid #f0e3ee;
  display:flex;
  flex-direction:column;
  height:auto;
  min-height:0;
  box-shadow:0 8px 16px rgba(20,12,20,.04);
  position:relative;
  z-index:1;
}
.rfbox-card-img{
  width:100%;
  height:auto;
  aspect-ratio:1/1;
  object-fit:cover;
  cursor:pointer;
  border-bottom:1px solid #f0e3ee;
  position:relative;
  z-index:1;
}
.rfbox-card-body{
  padding:10px 10px 12px;
  display:flex;
  flex-direction:column;
  gap:8px;
  flex:1 1 auto;
  min-height:0;
  position:relative;
  z-index:2;
  justify-content:space-between;
}
.rfbox-name{
  background:none;
  border:none;
  padding:0 2px;
  margin:0;
  text-align:center;
  font-weight:600;
  font-size:10px;
  cursor:pointer;
  color:var(--ink);
  display:-webkit-box;
  -webkit-box-orient:vertical;
  -webkit-line-clamp:2;
  line-height:1.2;
  min-height:2.4em;
  width:100%;
  margin-bottom:5px;
}
.rfbox-name:hover{background:none!important;}

.rfbox-vars-block{margin-top:0;}
.rfbox-vars-line{
  display:flex;
  flex-wrap:wrap;
  gap:6px;
  margin-top:2px;
  max-height:84px;
  overflow:auto;
  padding-bottom:2px;
  border-radius:14px;
}
.rfbox-var-btn{
  border-radius:999px;
  padding:5px 12px;
  border:1px solid #e1d3e6;
  background:#faf7fb;
  font-size:9px;
  line-height:1.2;
  cursor:pointer;
  color:var(--muted);
  transition:background .15s ease,color .15s ease,border-color .15s ease,box-shadow .15s ease,transform .08s ease;
}
.rfbox-var-btn:hover:not(.disabled),
.rfbox-var-btn:focus-visible:not(.disabled){
  border-color:var(--rose);
  background:#fff;
  box-shadow:0 0 0 1px rgba(161,75,104,.15);
  outline:none;
}
.rfbox-var-btn.active{
  background:var(--rose-dark);
  border-color:var(--rose-dark);
  color:#fff;
  box-shadow:0 6px 12px rgba(161,75,104,.35);
  transform:translateY(-1px);
}
.rfbox-var-btn.disabled{opacity:.45;cursor:not-allowed;box-shadow:none;text-decoration:line-through;}
@keyframes rfbox-pulse{
  0%{box-shadow:0 0 0 0 rgba(185,61,79,0);}
  50%{box-shadow:0 0 0 2px rgba(185,61,79,.45);}
  100%{box-shadow:0 0 0 0 rgba(185,61,79,0);}
}
.rfbox-vars-line.rfbox-var-required{animation:rfbox-pulse .35s ease-in-out 0s 2;}

.rfbox-card-bottom{
  margin-top:auto;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
}
.rfbox-price{
  font-weight:700;
  font-size:14px;
  color:#892f2f;
}
.rfbox-cta{display:flex;align-items:center;}

.rfbox-add{
  appearance:none;
  border:1px solid rgba(161,75,104,.18);
  background:#fff;
  color:var(--rose-dark,#a14b68);
  border-radius:999px;
  padding:10px 14px;
  font-weight:800;
  line-height:1;
  display:inline-flex;
  align-items:center;
  gap:3px;
  cursor:pointer;
  box-shadow:0 10px 20px rgba(0,0,0,.06);
  transition:transform .12s ease,box-shadow .12s ease,background-color .12s ease,border-color .12s ease;
}
.rfbox-add:disabled,
.rfbox-add[disabled]{opacity:.55;cursor:not-allowed;transform:none;box-shadow:none;background:#fff;}
@media (hover:hover){
  .rfbox-add:hover{
    transform:translateY(-1px);
    box-shadow:0 14px 26px rgba(0,0,0,.09);
    border-color:rgba(161,75,104,.28);
    background:rgba(247,232,237,.65);
  }
}
.rfbox-add:focus-visible{
  outline:none;
  box-shadow:0 0 0 4px rgba(234,176,192,.45),0 10px 20px rgba(0,0,0,.06);
}

.rfbox-add-ico,
.rfbox-add-ico::before,
.rfbox-add-ico::after{background:none!important;mask:none!important;-webkit-mask:none!important;border:0!important;}
.rfbox-add-ico{
  width:22px;
  height:22px;
  display:inline-grid;
  place-items:center;
  flex:0 0 22px;
}
.rfbox-add-ico::before{
  content:"+";
  display:block;
  line-height:1;
  font-size:22px;
  font-weight:700;
  color:var(--rose-dark,#a14b68);
  transform:translateY(-1px);
}
@media (hover:hover){
  .rfbox-add:hover .rfbox-add-ico::before{transform:translateY(-1px) scale(1.08);transition:transform .12s ease;}
}
.rfbox-add.is-added{
  border-color:rgba(46,125,50,.30);
  background:rgba(46,125,50,.08);
  color:#2e7d32;
}
.rfbox-add.is-added .rfbox-add-ico::before{
  content:"✓";
  color:var(--ok,#2e7d32);
  font-size:20px;
  transform:translateY(-1px);
}
.rfbox-add-txt{font-size:9px;line-height:1;margin-top:2px;opacity:.9;}

@media (max-width:600px){
  .rfbox-steps{padding:14px 10px;border-radius:14px;}
  .rfbox-landing-inner{padding-top:20px;}
  .rfbox-left,.rfbox-right{padding:12px;border-radius:14px;}
  .rfbox-grid-products{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;}
}

.rfbox-design-step{display:flex;flex-direction:column;gap:16px;}
.rfbox-design-layout{display:grid;grid-template-columns:minmax(0,260px) minmax(0,1fr);gap:20px;}
.rfbox-design-left{
  background:#fff;
  border-radius:16px;
  border:1px solid #f1e5ec;
  padding:14px;
  display:flex;
  flex-direction:column;
  gap:10px;
}
.rfbox-design-left h2{margin:0 0 6px;font-size:20px;}
.rfbox-design-list{display:flex;flex-direction:column;gap:6px;max-height:260px;overflow:auto;}
.rfbox-design-item{
  display:flex;
  align-items:center;
  gap:8px;
  width:100%;
  border-radius:10px;
  border:1px solid #ecdeef;
  background:#fdf9ff;
  padding:6px 8px;
  cursor:pointer;
}
.rfbox-design-item.is-active{
  border-color:var(--rose-dark);
  background:#fff;
  box-shadow:0 6px 14px rgba(161,75,104,.16);
}
.rfbox-design-thumb-wrap{
  width:52px;
  height:52px;
  border-radius:10px;
  overflow:hidden;
  flex-shrink:0;
  background:#f5edf7;
  display:flex;
  align-items:center;
  justify-content:center;
}
.rfbox-design-thumb{width:100%;height:100%;object-fit:cover;}
.rfbox-design-thumb--empty{width:36px;height:36px;border-radius:50%;border:1px dashed #d6c3e0;}
.rfbox-design-meta{display:flex;flex-direction:column;gap:2px;font-size:13px;}
.rfbox-design-label{font-weight:600;}
.rfbox-design-meta-price{font-size:12px;color:var(--muted);}
.rfbox-design-price{margin-top:6px;font-size:13px;color:var(--muted);}

.rfbox-design-right{
  background:#fff;
  border-radius:16px;
  border:1px solid #f1e5ec;
  padding:12px;
  display:flex;
  flex-direction:column;
  gap:10px;
}
.rfbox-design-main{
  border-radius:14px;
  overflow:hidden;
  border:1px solid #f0e3ee;
  background:#fdf9ff;
  padding:8px;
  position:relative;
  min-height:180px;
  display:flex;
  align-items:center;
  justify-content:center;
}
.rfbox-design-main-img{max-height:320px;}
.rfbox-design-name-preview{
  position:absolute;
  bottom:15%;
  left:12px;
  right:12px;
  text-align:center;
  font-family:"Caveat","Pacifico","Comic Neue",cursive;
  font-size:20px;
  color:#5a2c40;
  text-shadow:0 1px 3px rgba(255,255,255,.8);
  opacity:0;
  transition:opacity .15s ease;
}
.rfbox-design-name-preview.has-text{opacity:1;}
.rfbox-design-views{display:flex;flex-wrap:wrap;gap:6px;}
.rfbox-design-view-btn{border-radius:10px;border:1px solid #e3d6e9;padding:2px;background:#fff;cursor:pointer;}
.rfbox-design-view-img{width:70px;height:50px;object-fit:cover;}
.rfbox-design-view-3d{border-radius:999px;border:1px solid #d6c3e0;padding:4px 10px;font-size:12px;background:#faf7ff;cursor:pointer;}

.rfbox-design-bottom{
  margin-top:4px;
  background:#fff;
  border-radius:16px;
  border:1px solid #f1e5ec;
  padding:12px;
  display:flex;
  flex-direction:column;
  gap:8px;
}
.rfbox-design-label{font-size:14px;}
.rfbox-design-name-input{
  width:100%;
  border-radius:999px;
  border:1px solid #e1d3e6;
  padding:8px 14px;
  font-size:14px;
}
@keyframes rfbox-blink{
  0%,100%{box-shadow:0 0 0 0 rgba(185,61,79,0);}
  50%{box-shadow:0 0 0 2px rgba(185,61,79,.6);}
}
.rfbox-design-name-input.rfbox-blink{animation:rfbox-blink .3s linear 0s 2;}
.rfbox-design-actions{display:flex;flex-wrap:wrap;justify-content:space-between;gap:10px;}
.rfbox-step-back-2{flex:1 1 160px;}
.rfbox-design-submit{
  flex:1 1 210px;
  border-radius:999px;
  padding:10px 18px;
  border:none;
  background:var(--rose-dark);
  color:#fff;
  font-weight:600;
  cursor:pointer;
  font-size:14px;
  box-shadow:0 10px 20px rgba(161,75,104,.25);
}
.rfbox-design-submit:disabled{opacity:.55;cursor:not-allowed;box-shadow:none;}
@media (max-width:960px){.rfbox-design-layout{grid-template-columns:1fr;}}

.rfbox-modal,.rfbox-3d-modal,.rfbox-product-modal{
  position:fixed;
  inset:0;
  background:rgba(18,8,20,.55);
  display:flex;
  align-items:center;
  justify-content:center;
  padding:18px;
  z-index:99999;
}
.rfbox-modal.hidden,.rfbox-3d-modal.hidden,.rfbox-product-modal.hidden{display:none;}

.rfbox-modal-card{
  background:#fff;
  border-radius:18px;
  max-width:520px;
  width:100%;
  padding:16px 16px 14px;
  position:relative;
  box-shadow:0 16px 40px rgba(18,8,20,.4);
}
.rfbox-modal-x{position:absolute;top:8px;right:10px;border:none;background:transparent;font-size:20px;cursor:pointer;}
.rfbox-modal-rosy{display:flex;gap:10px;margin-bottom:12px;}
.rfbox-modal-rosy-bubble{
  background:#fff9fb;
  border-radius:12px;
  padding:10px 12px;
  border:1px solid #f7dde9;
  font-size:14px;
  color:var(--muted);
}
.rfbox-modal-title{font-weight:700;margin-bottom:4px;}
.rfbox-modal-actions{display:flex;flex-wrap:wrap;gap:8px;justify-content:flex-end;margin-top:4px;}
.rfbox-modal-continue,.rfbox-modal-add{
  border-radius:999px;
  padding:8px 14px;
  font-size:13px;
  border:1px solid #e1d3e6;
  background:#fff;
  cursor:pointer;
}
.rfbox-modal-continue:hover{background:rgba(244,201,211,.35);}
.rfbox-modal-add{background:var(--rose-dark);border-color:var(--rose-dark);color:#fff;}
.rfbox-modal-add:hover{background:#892f54;}

.rfbox-3d-card{
  background:#fff;
  border-radius:18px;
  padding:14px;
  max-width:640px;
  width:100%;
  box-shadow:0 16px 40px rgba(18,8,20,.4);
  position:relative;
}
.rfbox-3d-close{position:absolute;top:8px;right:10px;border:none;background:transparent;font-size:20px;cursor:pointer;}
.rfbox-3d-stage{border-radius:14px;overflow:hidden;background:#000;}
.rfbox-3d-image{width:100%;height:auto;display:block;}

.rfbox-product-card{
  background:#fff;
  border-radius:18px;
  padding:14px;
  max-width:780px;
  width:100%;
  box-shadow:0 16px 40px rgba(18,8,20,.4);
  position:relative;
}
.rfbox-product-close{position:absolute;top:8px;right:10px;border:none;background:transparent;font-size:20px;cursor:pointer;}
.rfbox-product-layout{display:grid;grid-template-columns:minmax(0,260px) minmax(0,1fr);gap:16px;}
@media (max-width:780px){.rfbox-product-layout{grid-template-columns:1fr;}}
.rfbox-product-images{display:flex;flex-direction:column;gap:8px;}
.rfbox-product-main-img{border-radius:14px;border:1px solid #f0e3ee;background:#fdf9ff;max-height:300px;object-fit:cover;}
.rfbox-product-thumbs{display:flex;flex-wrap:wrap;gap:6px;}
.rfbox-product-thumb-btn{border-radius:10px;border:1px solid #e3d6e9;padding:2px;background:#fff;cursor:pointer;}
.rfbox-product-thumb-img{width:70px;height:70px;object-fit:cover;border-radius:8px;}
.rfbox-product-info{display:flex;flex-direction:column;gap:6px;}
.rfbox-product-title{margin:0;font-size:18px;}
.rfbox-product-price{font-weight:600;}
.rfbox-product-attrs{font-size:13px;color:var(--muted);}
.rfbox-product-desc{font-size:14px;}

.rfbox-loadmore{display:flex;justify-content:center;margin-top:12px;}
.rfbox-loadmore-btn{
  border:1px solid #e1d3e6;
  background:#fff;
  border-radius:999px;
  padding:10px 16px;
  cursor:pointer;
  font-weight:700;
  font-size:13px;
  color:var(--rose-dark);
  box-shadow:0 8px 16px rgba(20,12,20,.04);
}
.rfbox-loadmore-btn:hover{background:rgba(244,201,211,.35);}

.rfbox-stickybar{
  display:none !important;
  position:fixed !important;
  left:0;
  bottom:0 !important;
  top:auto !important;
  z-index:99980;
  padding:10px 12px calc(10px + env(safe-area-inset-bottom)) !important;
  background:rgba(255,255,255,.92) !important;
  backdrop-filter:blur(10px) !important;
  border-top:1px solid #f1e5ec !important;
  transform:translateY(110%);
  transition:transform .2s ease;
}
.rfbox-wrap .rfbox-stickybar[aria-hidden="false"]{display:block !important;}
.rfbox-stickybar.is-visible{transform:translateY(0);}
.rfbox-stickybar__inner{
  max-width:760px !important;
  margin:0 auto !important;
  display:flex !important;
  align-items:center !important;
  justify-content:space-between !important;
  gap:10px !important;
}
.rfbox-stickybar__last{display:flex;align-items:center;gap:8px;min-width:0;}
.rfbox-stickybar__thumb{
  width:36px;
  height:36px;
  border-radius:10px;
  object-fit:cover;
  border:1px solid #f0e3ee;
  background:#fff;
}
.rfbox-stickybar__title{
  font-size:12px;
  color:var(--muted);
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
  max-width:250px;
}
.rfbox-stickybar__cta{
  border:none;
  border-radius:999px;
  padding:10px 14px;
  background:var(--rose-dark);
  color:#fff;
  font-weight:700;
  font-size:13px;
  cursor:pointer;
  box-shadow:0 10px 20px rgba(161,75,104,.22);
  white-space:nowrap;
}
@media (min-width:1025px){
  .rfbox-stickybar__thumb{width:40px;height:40px;border-radius:12px;}
  .rfbox-stickybar__title{max-width:520px;}
  .rfbox-stickybar__open{
    border:1px solid rgba(161,75,104,.18);
    background:#fff;
    color:var(--rose-dark,#a14b68);
    border-radius:999px;
    padding:10px 14px;
    font-weight:800;
    font-size:13px;
    cursor:pointer;
    box-shadow:0 10px 20px rgba(0,0,0,.06);
    white-space:nowrap;
    transition:transform .12s ease,box-shadow .12s ease,background-color .12s ease,border-color .12s ease;
  }
  .rfbox-stickybar__open:hover{
    transform:translateY(-1px);
    box-shadow:0 14px 26px rgba(0,0,0,.09);
    border-color:rgba(161,75,104,.28);
    background:rgba(247,232,237,.65);
  }
}

@media (max-width:1024px){
  .rfbox-wrap .rfbox-stickybar[aria-hidden="false"].is-visible{transform:translateY(0);}
}
.rfbox-wrap .rfbox-stickybar[aria-hidden="true"]{display:none!important;}

.rfbox-wrap .rfbox-step.active[data-step="2"]{padding-bottom:92px !important;}

.rfbox-boxdrawer{
  position:fixed !important;
  inset:0 !important;
  display:none !important;
  align-items:flex-end !important;
  justify-content:center !important;
  padding:14px !important;
  z-index:2147483500 !important;
}
.rfbox-boxdrawer.is-open{display:flex !important;}

.rfbox-boxdrawer-card{
  width:min(420px, 94vw) !important;
  max-height:min(70vh, 560px) !important;
  height:auto !important;
  background:#fff !important;
  border-radius:18px !important;
  border:1px solid #f1e5ec !important;
  box-shadow:0 16px 40px rgba(18,8,20,.4) !important;
  overflow:auto !important;
  -webkit-overflow-scrolling:touch;
  position:relative !important;
  scrollbar-width:thin;
  scrollbar-color:rgba(161,75,104,.45) #f6eef2;
}
.rfbox-boxdrawer-close{
  position:sticky !important;
  top:0 !important;
  margin-left:auto !important;
  display:block !important;
  width:44px !important;
  height:44px !important;
  border:none !important;
  background:rgba(255,255,255,.92) !important;
  backdrop-filter:blur(8px);
  border-bottom:1px solid #f1e5ec !important;
  font-size:22px !important;
  cursor:pointer !important;
  z-index:5 !important;
}
.rfbox-boxdrawer-card .rfbox-left{
  display:flex;
  border:none;
  box-shadow:none;
  border-radius:18px;
  padding:16px 16px 18px;
  background:rgba(247, 232, 237, .75);
}
@media (min-width:1025px){
  .rfbox-builder{grid-template-columns:minmax(0,1fr);}
  .rfbox-left{display:none;}
}

@media (hover:none), (pointer:coarse){
  .rfbox-card-body,
  .rfbox-card-bottom,
  .rfbox-name,
  .rfbox-price,
  .rfbox-cta,
  .rfbox-add{
    opacity:1 !important;
    visibility:visible !important;
    transform:none !important;
    height:auto !important;
    max-height:none !important;
    pointer-events:auto !important;
  }
  .rfbox-add{display:inline-flex !important;}
}

html, body{overflow-x:hidden;}

@media (max-width:420px){
  .rfbox-wrap .rfbox-card-bottom{gap:8px;}
  .rfbox-wrap .rfbox-card,
  .rfbox-wrap .rfbox-card-body{min-width:0;}
  .rfbox-wrap .rfbox-price{
    font-size:13px;
    white-space:nowrap;
    flex:1 1 auto;
    min-width:0;
  }
  .rfbox-wrap .rfbox-cta{flex:0 0 auto;min-width:0;}
  .rfbox-wrap .rfbox-add{max-width:100%;padding:9px 10px;gap:4px;}
  .rfbox-wrap .rfbox-add-ico{width:20px;height:20px;flex:0 0 20px;}
  .rfbox-wrap .rfbox-add-txt{font-size:10px;white-space:nowrap;}
}
/* Drawer overlay: petit fondu + blur (premium) */
.rfbox-boxdrawer{
  opacity:0;
  transition:opacity .22s ease;
  will-change:opacity;
}
.rfbox-boxdrawer.is-open{
  opacity:1;
}

/* Carte: entrée "slide-up + scale" (premium), avec léger spring */
.rfbox-boxdrawer-card{
  width:min(420px, 94vw) !important;
  max-height:min(70vh, 560px) !important;
  height:auto !important;
  background:#fff !important;
  border-radius:18px !important;
  border:1px solid #f1e5ec !important;
  box-shadow:0 16px 40px rgba(18,8,20,.4) !important;
  overflow:auto !important;
  -webkit-overflow-scrolling:touch;
  position:fixed;
  scrollbar-width:thin;
  scrollbar-color:rgba(161,75,104,.45) #f6eef2;
  right:auto;
  left:5%;
  bottom:2%;

  transform:translateY(18px) scale(.985);
  opacity:0;
  transition:
    transform .38s cubic-bezier(.2,.9,.25,1.15),
    opacity .22s ease;
  will-change:transform,opacity;
}

/* Quand la popup est ouverte, la card s’anime */
.rfbox-boxdrawer.is-open .rfbox-boxdrawer-card{
  transform:translateY(0) scale(1);
  opacity:1;
}

/* Respect accessibilité: réduit les animations si l'utilisateur le demande */
@media (prefers-reduced-motion:reduce){
  .rfbox-boxdrawer,
  .rfbox-boxdrawer-card{
    transition:none !important;
    transform:none !important;
    opacity:1 !important;
  }
}
.rfbox-boxdrawer-message{
  background:rgba(247,232,237,.85);
  border:1px solid rgba(161,75,104,.25);
  border-radius:14px;
  padding:10px 14px;
  font-size:14px;
  font-weight:600;
  color:#552233;
  margin-bottom:10px;
}


.rfbox-modal,
.rfbox-3d-modal,
.rfbox-product-modal{
  opacity:0;
  visibility:hidden;
  transform:translateY(8px);
  transition:opacity .22s ease, visibility 0s linear .22s, transform .22s ease;
  will-change:opacity, transform;
}

.rfbox-modal:not(.hidden),
.rfbox-3d-modal:not(.hidden),
.rfbox-product-modal:not(.hidden){
  opacity:1;
  visibility:visible;
  transform:translateY(0);
  transition:opacity .22s ease, visibility 0s, transform .22s ease;
}

/* Fond (overlay) avec un léger fade */
.rfbox-modal:not(.hidden),
.rfbox-3d-modal:not(.hidden),
.rfbox-product-modal:not(.hidden){
  animation:rfboxOverlayIn .22s ease both;
}

@keyframes rfboxOverlayIn{
  from{opacity:0;}
  to{opacity:1;}
}

/* Carte : zoom + spring premium */
.rfbox-modal-card,
.rfbox-3d-card,
.rfbox-product-card{
  transform:translateY(10px) scale(.96);
  opacity:0;
  transition:none;
  will-change:transform, opacity;
}

.rfbox-modal:not(.hidden) .rfbox-modal-card,
.rfbox-3d-modal:not(.hidden) .rfbox-3d-card,
.rfbox-product-modal:not(.hidden) .rfbox-product-card{
  animation:rfboxCardIn .34s cubic-bezier(.2,.9,.25,1.25) both;
}

@keyframes rfboxCardIn{
  0%   {opacity:0; transform:translateY(14px) scale(.95);}
  70%  {opacity:1; transform:translateY(-2px) scale(1.01);}
  100% {opacity:1; transform:translateY(0) scale(1);}
}

/* Petit "pop" sur le bouton close (optionnel mais sympa) */
.rfbox-modal:not(.hidden) .rfbox-modal-x,
.rfbox-3d-modal:not(.hidden) .rfbox-3d-close,
.rfbox-product-modal:not(.hidden) .rfbox-product-close{
  animation:rfboxClosePop .28s ease .08s both;
}

@keyframes rfboxClosePop{
  from{transform:scale(.7); opacity:0;}
  to{transform:scale(1); opacity:1;}
}

/* Accessibilité : réduit les animations si demandé */
@media (prefers-reduced-motion: reduce){
  .rfbox-modal,
  .rfbox-3d-modal,
  .rfbox-product-modal,
  .rfbox-modal-card,
  .rfbox-3d-card,
  .rfbox-product-card{
    animation:none !important;
    transition:none !important;
    transform:none !important;
  }
}

/* Overlay full */
.rfbox-loading-overlay{
  position:fixed;
  inset:0;
  z-index:999999;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:18px;
  background:rgba(18,8,20,.58);
  backdrop-filter:blur(6px);
}
.rfbox-loading-overlay.hidden{display:none;}

.rfbox-loading-card{
  width:min(560px, 92vw);
  background:#fff;
  border-radius:18px;
  border:1px solid rgba(161,75,104,.12);
  box-shadow:0 18px 50px rgba(18,8,20,.35);
  padding:14px 14px 16px;
  transform:translateY(8px) scale(.98);
  opacity:0;
}
.rfbox-loading-overlay.is-running .rfbox-loading-card{
  animation:rfboxOverlayIn .35s ease forwards;
}
@keyframes rfboxOverlayIn{
  to{opacity:1; transform:translateY(0) scale(1);}
}

.rfbox-loading-rosy{display:flex; gap:12px; align-items:flex-start;}
.rfbox-loading-bubble{
  flex:1;
  background:#fff9fb;
  border:1px solid #f7dde9;
  border-radius:14px;
  padding:10px 12px 12px;
}
.rfbox-loading-text{
  font-size:14px;
  line-height:1.35;
  color:var(--muted,#6b5a61);
  opacity:0;
  transform:translateY(6px);
  animation:rfboxLineIn .28s ease both;
}
.rfbox-loading-overlay.is-step-2 .rfbox-loading-text,
.rfbox-loading-overlay.is-step-3 .rfbox-loading-text{
  animation:rfboxLineSwap .28s ease both;
}
@keyframes rfboxLineIn{to{opacity:1; transform:translateY(0);}}
@keyframes rfboxLineSwap{from{opacity:0; transform:translateY(6px);}to{opacity:1; transform:translateY(0);}}

/* Box anim */
.rfbox-loading-boxanim{position:relative; margin-top:10px; height:88px;}
.rfbox-loading-box{
  position:absolute;
  left:50%;
  bottom:0;
  width:140px;
  height:56px;
  transform:translateX(-50%);
  border-radius:16px;
  background:linear-gradient(180deg, #fff, #fdf0f5);
  border:1px solid rgba(161,75,104,.18);
  box-shadow:0 10px 22px rgba(161,75,104,.12);
}
.rfbox-loading-box::before{
  content:"";
  position:absolute;
  left:10px; right:10px; top:10px;
  height:10px;
  border-radius:999px;
  background:rgba(234,176,192,.45);
}

/* Items that "fall" */
.rfbox-loading-item{
  position:absolute;
  left:50%;
  top:-8px;
  width:16px;
  height:16px;
  border-radius:6px;
  transform:translateX(-50%);
  background:rgba(161,75,104,.18);
  border:1px solid rgba(161,75,104,.24);
  box-shadow:0 10px 18px rgba(0,0,0,.08);
  opacity:0;
}
.rfbox-loading-item.i1{animation:rfboxDrop 1.1s ease-in-out infinite .0s;}
.rfbox-loading-item.i2{animation:rfboxDrop 1.1s ease-in-out infinite .22s;}
.rfbox-loading-item.i3{animation:rfboxDrop 1.1s ease-in-out infinite .44s;}
.rfbox-loading-item.i4{animation:rfboxDrop 1.1s ease-in-out infinite .66s;}

@keyframes rfboxDrop{
  0%{opacity:0; transform:translate(-50%,-10px) scale(.9) rotate(0deg);}
  12%{opacity:1;}
  70%{opacity:1; transform:translate(calc(-50% + var(--dx,0px)), 62px) scale(.95) rotate(10deg);}
  100%{opacity:0; transform:translate(calc(-50% + var(--dx,0px)), 62px) scale(.8) rotate(22deg);}
}

/* small variation positions */
.rfbox-loading-item.i1{--dx:-36px;}
.rfbox-loading-item.i2{--dx:-10px;}
.rfbox-loading-item.i3{--dx:14px;}
.rfbox-loading-item.i4{--dx:40px;}

/* Mobile sizing */
@media (max-width:520px){
  .rfbox-loading-card{padding:12px;}
  .rfbox-loading-box{width:124px;}
}

.rfbox-design-name-preview{
  transition: opacity .22s ease;
}

/* ========================================
   Badges produit
   ======================================== */
.rfbox-card{position:relative;}
.rfbox-card-badges{
  position:absolute;
  top:8px;
  left:8px;
  display:flex;
  flex-direction:column;
  gap:4px;
  z-index:3;
  pointer-events:none;
}
.rfbox-badge{
  display:inline-block;
  padding:3px 10px;
  border-radius:4px;
  font-size:10px;
  font-weight:700;
  color:#fff;
  background:var(--badge-bg, var(--rose-dark));
  text-transform:uppercase;
  letter-spacing:0.3px;
  box-shadow:0 2px 6px rgba(0,0,0,.15);
}
.rfbox-badge--sale{background:var(--badge-bg, #c62828);}
.rfbox-badge--new{background:var(--badge-bg, #2e7d32);}
.rfbox-badge--outofstock{background:var(--badge-bg, #757575);}

/* Badges dans la modal produit */
.rfbox-product-badges{
  display:flex;
  flex-wrap:wrap;
  gap:6px;
  margin-bottom:8px;
}
.rfbox-product-badges .rfbox-badge{
  font-size:11px;
  padding:4px 12px;
}
.rfbox-product-subcats{
  display:block;
  margin-top:4px;
  font-size:13px;
  color:var(--muted);
}

/* ========================================
   Modal produit améliorée
   ======================================== */
.rfbox-product-thumb-btn.is-active{
  border-color:var(--rose-dark);
  box-shadow:0 0 0 2px rgba(161,75,104,.25);
}
.rfbox-product-no-desc{
  color:var(--muted);
  font-style:italic;
  margin:0;
}

/* Sélecteur de variations dans la modal */
.rfbox-product-vars{
  margin:12px 0;
  padding:12px;
  background:#faf7f9;
  border-radius:10px;
  border:1px solid var(--line);
}
.rfbox-product-vars-label{
  font-size:13px;
  font-weight:600;
  color:var(--ink);
  margin-bottom:8px;
}
.rfbox-product-vars-line{
  display:flex;
  flex-wrap:wrap;
  gap:6px;
}
.rfbox-product-vars .rfbox-var-btn{
  padding:6px 14px;
  font-size:13px;
}

/* Bouton d'action dans la modal */
.rfbox-product-action{
  margin-top:16px;
  padding-top:14px;
  border-top:1px solid var(--line);
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  gap:12px;
}
.rfbox-product-add-btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:8px;
  padding:12px 24px;
  border-radius:999px;
  border:none;
  background:var(--rose-dark);
  color:#fff;
  font-size:14px;
  font-weight:600;
  cursor:pointer;
  transition:background .15s ease, transform .1s ease, box-shadow .15s ease;
  box-shadow:0 4px 12px rgba(161,75,104,.25);
}
.rfbox-product-add-btn:hover{
  background:#892f54;
  box-shadow:0 6px 16px rgba(161,75,104,.35);
}
.rfbox-product-add-btn:active{
  transform:scale(.97);
}
.rfbox-product-add-btn.is-added{
  background:#43a047;
  box-shadow:0 4px 12px rgba(67,160,71,.25);
}
.rfbox-product-add-btn.is-added:hover{
  background:#388e3c;
}
.rfbox-product-add-btn .rfbox-add-ico{
  width:16px;
  height:16px;
  background:currentColor;
  mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 24 24' stroke='currentColor'%3E%3Cpath stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M12 4v16m8-8H4'/%3E%3C/svg%3E") center/contain no-repeat;
  -webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 24 24' stroke='currentColor'%3E%3Cpath stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M12 4v16m8-8H4'/%3E%3C/svg%3E") center/contain no-repeat;
}
.rfbox-product-add-btn.is-added .rfbox-add-ico{
  mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 24 24' stroke='currentColor'%3E%3Cpath stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M5 13l4 4L19 7'/%3E%3C/svg%3E") center/contain no-repeat;
  -webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 24 24' stroke='currentColor'%3E%3Cpath stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M5 13l4 4L19 7'/%3E%3C/svg%3E") center/contain no-repeat;
}

.rfbox-product-link{
  color:var(--rose-dark);
  font-size:13px;
  text-decoration:none;
  transition:color .15s ease;
}
.rfbox-product-link:hover{
  color:#892f54;
  text-decoration:underline;
}

/* Image principale plus grande dans la modal */
.rfbox-product-main-img{
  max-height:380px;
  width:100%;
  object-fit:contain;
  background:#fdf9ff;
}

/* Responsive modal */
@media (max-width:780px){
  .rfbox-product-action{
    flex-direction:column;
    align-items:stretch;
  }
  .rfbox-product-add-btn{
    width:100%;
  }
  .rfbox-product-link{
    text-align:center;
  }
}


/* ========================================
   V4 AMÉLIORATIONS
   ======================================== */

/* ---------- Confettis ---------- */
.rfbox-confetti-container {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  overflow: hidden;
  pointer-events: none;
  z-index: 10;
}
.rfbox-confetti {
  position: absolute;
  top: -20px;
  left: calc(var(--x, 0.5) * 100%);
  width: 10px;
  height: 10px;
  background: var(--color, #f0a);
  animation: rfbox-confetti-fall var(--duration, 3s) var(--delay, 0s) ease-out forwards;
  border-radius: 2px;
}
@keyframes rfbox-confetti-fall {
  0% { transform: translateY(0) rotate(0deg); opacity: 1; }
  100% { transform: translateY(400px) rotate(720deg); opacity: 0; }
}

/* ---------- Progress bar ---------- */
.rfbox-progress-wrap {
  margin: 12px 0;
  padding: 12px;
  background: linear-gradient(135deg, #fdf5f7 0%, #f8e8ed 100%);
  border-radius: 12px;
  border: 1px solid #f0e3ee;
}
.rfbox-progress-label {
  font-size: 12px;
  font-weight: 600;
  color: var(--rose-dark);
  margin-bottom: 8px;
  text-transform: uppercase;
  letter-spacing: 0.5px;
}
.rfbox-progress-bar {
  position: relative;
  height: 28px;
  background: #fff;
  border-radius: 14px;
  overflow: hidden;
  box-shadow: inset 0 2px 4px rgba(0,0,0,.06);
}
.rfbox-progress-fill {
  position: absolute;
  left: 0;
  top: 0;
  height: 100%;
  background: linear-gradient(90deg, #eab0c0 0%, #a14b68 100%);
  border-radius: 14px;
  transition: width 0.4s cubic-bezier(.4,0,.2,1);
}
.rfbox-progress-fill.complete {
  background: linear-gradient(90deg, #81c784 0%, #43a047 100%);
  animation: rfbox-progress-pulse 1s ease-in-out;
}
@keyframes rfbox-progress-pulse {
  0%, 100% { transform: scaleY(1); }
  50% { transform: scaleY(1.1); }
}
.rfbox-progress-markers {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  display: flex;
  justify-content: space-around;
  align-items: center;
  padding: 0 10px;
  z-index: 2;
}
.rfbox-progress-marker {
  font-size: 14px;
  filter: grayscale(1) opacity(0.4);
  transition: filter 0.3s ease, transform 0.3s ease;
}
.rfbox-progress-marker.achieved {
  filter: none;
  transform: scale(1.2);
}
.rfbox-progress-status {
  margin-top: 6px;
  font-size: 11px;
  color: var(--muted);
  text-align: center;
}
.rfbox-progress-complete {
  color: #2e7d32;
  font-weight: 600;
}

/* ---------- Box preview ---------- */
.rfbox-box-preview {
  margin: 10px 0;
  padding: 10px;
  background: #faf7f9;
  border-radius: 10px;
  border: 1px dashed #e0d0d8;
  min-height: 60px;
}
.rfbox-box-preview.is-empty .rfbox-box-preview-grid { display: none; }
.rfbox-box-preview:not(.is-empty) .rfbox-box-preview-empty { display: none; }
.rfbox-box-preview-empty {
  text-align: center;
  color: var(--muted);
  font-size: 12px;
  padding: 10px;
}
.rfbox-box-preview-grid {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}
.rfbox-box-preview-img {
  width: 40px;
  height: 40px;
  border-radius: 6px;
  object-fit: cover;
  border: 1px solid #f0e3ee;
}
.rfbox-box-preview-more {
  width: 40px;
  height: 40px;
  border-radius: 6px;
  background: var(--rose-2);
  color: var(--rose-dark);
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 11px;
  font-weight: 600;
}

/* ---------- Search ---------- */
.rfbox-search-wrap {
  position: relative;
  margin-bottom: 12px;
}
.rfbox-search-input {
  width: 100%;
  padding: 10px 40px 10px 14px;
  border: 1px solid #e0d0d8;
  border-radius: 999px;
  font-size: 14px;
  background: #fff;
  transition: border-color 0.2s ease, box-shadow 0.2s ease;
}
.rfbox-search-input:focus {
  outline: none;
  border-color: var(--rose-dark);
  box-shadow: 0 0 0 3px rgba(161,75,104,.15);
}
.rfbox-search-icon {
  position: absolute;
  right: 14px;
  top: 50%;
  transform: translateY(-50%);
  pointer-events: none;
  font-size: 14px;
}
.rfbox-search-clear {
  position: absolute;
  right: 38px;
  top: 50%;
  transform: translateY(-50%);
  border: none;
  background: #ddd;
  color: #666;
  width: 20px;
  height: 20px;
  border-radius: 50%;
  font-size: 14px;
  line-height: 1;
  cursor: pointer;
}
.rfbox-search-clear.hidden { display: none; }

/* ---------- Favoris ---------- */
.rfbox-fav-btn {
  position: absolute;
  top: 8px;
  right: 8px;
  z-index: 4;
  width: 32px;
  height: 32px;
  border-radius: 50%;
  border: none;
  background: rgba(255,255,255,.9);
  color: #ccc;
  font-size: 16px;
  cursor: pointer;
  transition: color 0.2s ease, transform 0.2s ease, background 0.2s ease;
  box-shadow: 0 2px 6px rgba(0,0,0,.1);
}
.rfbox-fav-btn:hover {
  color: #e91e63;
  transform: scale(1.1);
}
.rfbox-fav-btn.is-fav {
  color: #e91e63;
  background: #fce4ec;
}
.rfbox-tab--favorites {
  background: #fff0f5;
}
.rfbox-tab--favorites .rfbox-tab-heart {
  color: #e91e63;
}
.rfbox-tab-fav-count {
  font-size: 11px;
  opacity: 0.7;
}

/* ---------- Suggestions ---------- */
.rfbox-suggestions {
  margin: 12px 0;
  padding: 12px;
  background: linear-gradient(135deg, #fff9e6 0%, #fff3cd 100%);
  border-radius: 12px;
  border: 1px solid #ffe082;
}
.rfbox-suggestions.hidden { display: none; }
.rfbox-suggestions-title {
  display: flex;
  align-items: center;
  gap: 6px;
  font-size: 13px;
  font-weight: 600;
  color: #f57c00;
  margin-bottom: 10px;
}
.rfbox-suggestions-list {
  display: flex;
  gap: 10px;
  overflow-x: auto;
  padding-bottom: 4px;
}
.rfbox-suggestion-card {
  flex: 0 0 auto;
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 8px;
  background: #fff;
  border-radius: 10px;
  cursor: pointer;
  transition: transform 0.2s ease, box-shadow 0.2s ease;
  box-shadow: 0 2px 6px rgba(0,0,0,.08);
}
.rfbox-suggestion-card:hover {
  transform: translateY(-2px);
  box-shadow: 0 4px 12px rgba(0,0,0,.12);
}
.rfbox-suggestion-img {
  width: 40px;
  height: 40px;
  border-radius: 6px;
  object-fit: cover;
}
.rfbox-suggestion-info {
  display: flex;
  flex-direction: column;
}
.rfbox-suggestion-name {
  font-size: 12px;
  font-weight: 500;
  max-width: 100px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.rfbox-suggestion-price {
  font-size: 11px;
  color: var(--rose-dark);
  font-weight: 600;
}

/* ---------- Savings ---------- */
.rfbox-savings {
  margin-top: 8px;
  padding: 8px 12px;
  background: linear-gradient(135deg, #e8f5e9 0%, #c8e6c9 100%);
  border-radius: 8px;
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.rfbox-savings.hidden { display: none; }
.rfbox-savings-label {
  font-size: 13px;
  color: #2e7d32;
}
.rfbox-savings-val {
  font-size: 15px;
  color: #1b5e20;
}

/* ---------- Counters améliorés ---------- */
.rfbox-count {
  display: flex;
  align-items: center;
  gap: 4px;
  padding: 6px 12px;
  border-radius: 999px;
  background: #f5f0f3;
  transition: background 0.3s ease, transform 0.3s ease;
}
.rfbox-count.achieved {
  background: #c8e6c9;
  transform: scale(1.05);
}
.rfbox-count-icon {
  font-size: 14px;
}
.rfbox-count-val {
  font-weight: 600;
  font-size: 14px;
}

/* ---------- Rosy bubble highlight ---------- */
.rfbox-rosy-bubble--highlight {
  animation: rfbox-bubble-highlight 0.5s ease;
}
@keyframes rfbox-bubble-highlight {
  0%, 100% { transform: scale(1); }
  50% { transform: scale(1.03); background: #fff3cd; }
}

/* ---------- Design upsell ---------- */
.rfbox-design-upsell {
  margin-top: 12px;
  padding: 10px 14px;
  background: linear-gradient(135deg, #fff9e6 0%, #fff3cd 100%);
  border-radius: 10px;
  font-size: 13px;
  color: #f57c00;
  border: 1px solid #ffe082;
}
.rfbox-design-upsell.hidden { display: none; }
.rfbox-upsell-icon {
  margin-right: 4px;
}

/* ---------- Totals rows ---------- */
.rfbox-totals-row {
  display: flex;
  justify-content: space-between;
  padding: 4px 0;
}
.rfbox-totals-final {
  border-top: 1px solid var(--line);
  margin-top: 4px;
  padding-top: 8px;
  font-size: 16px;
}

/* ---------- Design price tag ---------- */
.rfbox-design-meta-price.is-free {
  color: #2e7d32;
  font-weight: 600;
}

/* ---------- Mobile swipe hint ---------- */
@media (max-width: 768px) {
  .rfbox-tabs-wrap::after {
    content: "← Swipe →";
    display: block;
    text-align: center;
    font-size: 10px;
    color: var(--muted);
    margin-top: 4px;
    opacity: 0.6;
  }
}

/* ========================================
   ROSY FLOTTANTE
   ======================================== */
.rfbox-rosy-float {
  position: fixed;
  bottom: 24px;
  right: 24px;
  z-index: 99990;
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  gap: 8px;
  opacity: 0;
  visibility: hidden;
  transform: translateY(20px);
  transition: opacity 0.3s ease, visibility 0.3s ease, transform 0.3s ease;
  pointer-events: none;
}
.rfbox-rosy-float.is-visible {
  opacity: 1;
  visibility: visible;
  transform: translateY(0);
  pointer-events: auto;
}

/* Bulle de dialogue */
.rfbox-rosy-float__bubble {
  max-width: 240px;
  padding: 10px 14px;
  background: #fff;
  border-radius: 16px 16px 4px 16px;
  box-shadow: 0 4px 20px rgba(161,75,104,.25), 0 0 0 1px rgba(161,75,104,.1);
  font-size: 13px;
  line-height: 1.4;
  color: var(--ink, #221f26);
  opacity: 0;
  visibility: hidden;
  transform: translateY(10px) scale(0.95);
  transition: opacity 0.25s ease, visibility 0.25s ease, transform 0.25s ease;
}
.rfbox-rosy-float__bubble.is-visible {
  opacity: 1;
  visibility: visible;
  transform: translateY(0) scale(1);
}

/* Avatar Rosy */
.rfbox-rosy-float__avatar {
  width: 64px;
  height: 64px;
  border-radius: 50%;
  border: 3px solid #fff;
  background-image: var(--rosy-sprite);
  background-size: 220px 130px;
  background-repeat: no-repeat;
  background-color: #fff;
  box-shadow: 0 4px 16px rgba(161,75,104,.3), 0 0 0 2px rgba(161,75,104,.15);
  cursor: pointer;
  transition: transform 0.2s ease, box-shadow 0.2s ease;
  position: relative;
}
.rfbox-rosy-float__avatar:hover {
  transform: scale(1.08);
  box-shadow: 0 6px 24px rgba(161,75,104,.4), 0 0 0 3px rgba(161,75,104,.2);
}
.rfbox-rosy-float__avatar:active {
  transform: scale(0.95);
}

/* États Rosy flottante */
.rfbox-rosy-float__avatar.rosy-sad { background-position: 2% 0%; }
.rfbox-rosy-float__avatar.rosy-joy { background-position: 98% 95%; }
.rfbox-rosy-float__avatar.rosy-love { background-position: 50% 0%; }

/* Badge compteur */
.rfbox-rosy-float__badge {
  position: absolute;
  top: -4px;
  right: -4px;
  min-width: 22px;
  height: 22px;
  padding: 0 6px;
  background: var(--rose-dark, #a14b68);
  color: #fff;
  font-size: 11px;
  font-weight: 700;
  border-radius: 11px;
  display: flex;
  align-items: center;
  justify-content: center;
  box-shadow: 0 2px 6px rgba(0,0,0,.2);
  opacity: 0;
  transform: scale(0);
  transition: opacity 0.2s ease, transform 0.2s ease;
}
.rfbox-rosy-float__badge.has-items {
  opacity: 1;
  transform: scale(1);
}

/* Animation quand Rosy parle */
.rfbox-rosy-float.is-talking .rfbox-rosy-float__avatar {
  animation: rfbox-rosy-talk 0.5s ease infinite;
}
@keyframes rfbox-rosy-talk {
  0%, 100% { transform: scale(1); }
  50% { transform: scale(1.05); }
}

/* Animation d'apparition */
.rfbox-rosy-float.is-visible .rfbox-rosy-float__avatar {
  animation: rfbox-rosy-appear 0.5s ease;
}
@keyframes rfbox-rosy-appear {
  0% { transform: scale(0) rotate(-180deg); }
  60% { transform: scale(1.1) rotate(10deg); }
  100% { transform: scale(1) rotate(0); }
}

/* Mobile adjustments */
@media (max-width: 768px) {
  .rfbox-rosy-float {
    bottom: 80px; /* Au-dessus de la sticky bar */
    right: 16px;
  }
  .rfbox-rosy-float__avatar {
    width: 56px;
    height: 56px;
    background-size: 190px 115px;
  }
  .rfbox-rosy-float__bubble {
    max-width: 200px;
    font-size: 12px;
  }
}

/* Cacher sur très petits écrans si sticky bar visible */
@media (max-width: 480px) {
  .rfbox-rosy-float {
    bottom: 90px;
  }
}
