/* ===========================================================================
 * DUNEUS · Bundle reminder — PDP reminder bar + one-time popup.
 * Presentation only. Accent = --duneus-accent (#FF5100).
 * ======================================================================== */
.dn-brem-bar[hidden], .dn-brem[hidden]{ display:none !important; }

/* ---- reminder strip above add-to-cart ---- */
.dn-brem-bar{
  display:flex; align-items:center; gap:12px;
  border:1px solid color-mix(in srgb, var(--duneus-accent,#FF5100) 40%, #e7e7e9);
  background:color-mix(in srgb, var(--duneus-accent,#FF5100) 7%, #fff);
  border-radius:12px; padding:12px 14px; margin:0 0 14px;
  font-family:'Montserrat','Tajawal',sans-serif;
}
.dn-brem-bar__ic{ flex:none; width:26px; height:26px; color:var(--duneus-accent,#FF5100); }
.dn-brem-bar__ic svg{ width:100%; height:100%; }
.dn-brem-bar__txt{ display:flex; flex-direction:column; gap:1px; min-width:0; line-height:1.3; }
.dn-brem-bar__txt b{ font-weight:800; font-size:13px; color:#111; }
.dn-brem-bar__txt span{ font-size:12px; color:#555; }
.dn-brem-bar__cta{
  margin-inline-start:auto; flex:none; appearance:none; border:0; cursor:pointer;
  background:var(--duneus-accent,#FF5100); color:#fff; border-radius:999px;
  font-weight:800; font-size:12px; letter-spacing:.02em; padding:9px 16px; white-space:nowrap;
  transition:filter .2s ease;
}
.dn-brem-bar__cta:hover{ filter:brightness(1.07); }
.dn-brem-bar__x{ flex:none; appearance:none; border:0; background:transparent; cursor:pointer;
  color:#999; width:26px; height:26px; display:inline-flex; align-items:center; justify-content:center; }
.dn-brem-bar__x svg{ width:16px; height:16px; }

/* ---- popup ---- */
.dn-brem{ position:fixed; inset:0; z-index:4200; display:flex; align-items:flex-end; justify-content:center; }
.dn-brem__scrim{ position:absolute; inset:0; background:rgba(0,0,0,.5); opacity:0; transition:opacity .25s ease; }
.dn-brem.is-open .dn-brem__scrim{ opacity:1; }
.dn-brem__panel{
  position:relative; width:100%; max-width:460px; max-height:92vh; overflow-y:auto;
  background:#fff; color:#111; border-radius:16px 16px 0 0;
  padding:26px 20px calc(20px + env(safe-area-inset-bottom,0px));
  transform:translateY(100%); transition:transform .3s cubic-bezier(.2,.7,.2,1);
  font-family:'Montserrat','Tajawal',sans-serif;
}
[dir="rtl"] .dn-brem__panel{ font-family:'Tajawal','Montserrat',sans-serif; }
.dn-brem.is-open .dn-brem__panel{ transform:translateY(0); }
.dn-brem__x{ position:absolute; top:12px; inset-inline-end:12px; width:34px; height:34px; border:0;
  background:transparent; color:#111; cursor:pointer; display:flex; align-items:center; justify-content:center; }
.dn-brem__x svg{ width:20px; height:20px; }
.dn-brem__eyebrow{ display:inline-flex; align-items:center; gap:7px; font-weight:800; font-size:11px;
  letter-spacing:.14em; text-transform:uppercase; color:var(--duneus-accent,#FF5100); margin:0 0 8px; }
[dir="rtl"] .dn-brem__eyebrow{ letter-spacing:0; text-transform:none; }
.dn-brem__eyebrow svg{ width:16px; height:16px; }
.dn-brem__title{ font-weight:900; font-size:1.4rem; line-height:1.1; margin:0 0 6px; letter-spacing:-.01em; }
.dn-brem__desc{ color:#555; font-size:14px; margin:0 0 16px; line-height:1.5; }
.dn-brem__k{ display:block; font-weight:800; font-size:11px; letter-spacing:.12em; text-transform:uppercase;
  color:#8a8a90; margin:4px 0 10px; }
[dir="rtl"] .dn-brem__k{ letter-spacing:0; text-transform:none; }
.dn-brem__row{ display:flex; gap:10px; overflow-x:auto; scrollbar-width:none; margin:0 0 20px; }
.dn-brem__row::-webkit-scrollbar{ display:none; }
.dn-brem__item{ flex:0 0 108px; display:flex; flex-direction:column; gap:6px; text-decoration:none;
  border:1px solid #e7e7e9; border-radius:12px; padding:8px; transition:border-color .18s ease; }
.dn-brem__item:hover{ border-color:#111; }
.dn-brem__thumb{ width:100%; aspect-ratio:1/1; border-radius:8px; overflow:hidden; background:#f2f2f3;
  display:flex; align-items:center; justify-content:center; }
.dn-brem__thumb img{ width:100%; height:100%; object-fit:cover; }
.dn-brem__name{ font-weight:700; font-size:12px; line-height:1.3; color:#111;
  display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; }
.dn-brem__price{ font-weight:900; font-size:12px; color:#111; margin-top:auto; }
.dn-brem__cta{ width:100%; appearance:none; border:0; cursor:pointer; background:var(--duneus-accent,#FF5100);
  color:#fff; border-radius:12px; font-weight:800; font-size:14px; letter-spacing:.02em; padding:16px;
  transition:filter .2s ease; }
.dn-brem__cta:hover{ filter:brightness(1.07); }
.dn-brem__skip{ width:100%; appearance:none; border:0; background:transparent; cursor:pointer; color:#8a8a90;
  font-weight:700; font-size:13px; padding:12px 0 2px; }

@media (min-width:600px){
  .dn-brem{ align-items:center; }
  .dn-brem__panel{ border-radius:14px; transform:translateY(14px) scale(.98); opacity:0;
    transition:transform .3s cubic-bezier(.2,.7,.2,1), opacity .25s ease; }
  .dn-brem.is-open .dn-brem__panel{ transform:none; opacity:1; }
}
@media (prefers-reduced-motion:reduce){ .dn-brem *{ transition:none !important; } }

/* brief highlight when the CTA scrolls the shopper to the official set section */
.bundle-offer-details-section.dn-brem-flash{
  animation:dnBremFlash 1.6s ease-out;
  border-radius:12px;
}
@keyframes dnBremFlash{
  0%,100%{ box-shadow:0 0 0 0 rgba(255,81,0,0); }
  20%{ box-shadow:0 0 0 3px rgba(255,81,0,.55); }
}
@media (prefers-reduced-motion:reduce){ .bundle-offer-details-section.dn-brem-flash{ animation:none; } }