/**
 * Quenara Mega Menu v9.2 — Isolated CSS
 * ALL styles scoped under #qnr-mega-menu-root
 * NO :root variables, NO global resets, NO @media that affects site
 */

@property --rotation{syntax:'<angle>';inherits:false;initial-value:0deg}
@keyframes qmm-megaIn{from{opacity:0;transform:translateY(-6px)}to{opacity:1;transform:translateY(0)}}
@keyframes qmm-itemFade{from{opacity:0;transform:translateY(5px)}to{opacity:1;transform:translateY(0)}}
@keyframes qmm-floatSoft{0%,100%{transform:translateY(0)}50%{transform:translateY(-3px)}}
@keyframes qmm-glowPulse{0%,100%{box-shadow:0 0 0 0 rgba(16,185,129,.3)}50%{box-shadow:0 0 0 5px rgba(16,185,129,0)}}
@keyframes qmm-rotateBorder{to{--rotation:360deg}}
@keyframes qmm-lineGlow{0%{background-position:200% 0}100%{background-position:-100% 0}}

/* ══ ROOT CONTAINER ══ */
#qnr-mega-menu-root{
  font-family:'Inter',sans-serif;
  -webkit-font-smoothing:antialiased;
  max-width:1400px;
  margin:0 auto;
  position:relative;
  z-index:100;
  line-height:1.5;
  box-sizing:border-box;
}
#qnr-mega-menu-root *,
#qnr-mega-menu-root *::before,
#qnr-mega-menu-root *::after{
  box-sizing:border-box;
  margin:0;
  padding:0;
}

/* ══ MEGA PANEL ══ */
#qnr-mega-menu-root .qm{
  background:rgba(255,255,255,.96);
  backdrop-filter:blur(18px);
  border-radius:0 0 24px 24px;
  box-shadow:0 28px 70px rgba(6,78,59,.07);
  border:1px solid rgba(6,78,59,.05);
  border-top:none;
  display:none;
  overflow:hidden;
}
#qnr-mega-menu-root .qm.open{display:block;animation:qmm-megaIn .32s cubic-bezier(.16,1,.3,1)}

#qnr-mega-menu-root .qm-body{display:flex;min-height:520px}

/* ═══ LEFT SIDEBAR ═══ */
#qnr-mega-menu-root .qm-left{
  width:255px;min-width:255px;
  border-right:1px solid #f1f5f9;
  overflow-y:auto;max-height:580px;
  background:#fafbfc;
  scrollbar-width:thin;scrollbar-color:#a7f3d0 transparent;
}
#qnr-mega-menu-root .qm-left::-webkit-scrollbar{width:4px}
#qnr-mega-menu-root .qm-left::-webkit-scrollbar-thumb{background:#a7f3d0;border-radius:9px}
#qnr-mega-menu-root .qm-left-hd{padding:15px 20px 10px;display:flex;align-items:center;justify-content:space-between}
#qnr-mega-menu-root .qm-left-title{font-size:9.5px;font-weight:800;color:#064e3b;text-transform:uppercase;letter-spacing:2px;font-family:'Plus Jakarta Sans',sans-serif}
#qnr-mega-menu-root .qm-left-badge{font-size:9px;color:#94a3b8;background:#f1f5f9;padding:3px 8px;border-radius:20px;font-weight:700}

#qnr-mega-menu-root .qm-cat{
  width:100%;display:flex;align-items:center;gap:10px;
  padding:10px 20px;border:none;border-left:3px solid transparent;
  background:transparent;cursor:pointer;font-size:12.5px;color:#475569;
  font-weight:400;text-align:left;font-family:'Inter',sans-serif;
  transition:all .15s cubic-bezier(.4,0,.2,1);position:relative;
  line-height:1.4;
}
#qnr-mega-menu-root .qm-cat:hover{background:rgba(16,185,129,.025)}
#qnr-mega-menu-root .qm-cat.on{background:rgba(16,185,129,.04);color:#0f172a;font-weight:700}
#qnr-mega-menu-root .qm-cat-ico{
  width:30px;height:30px;border-radius:9px;
  display:flex;align-items:center;justify-content:center;flex-shrink:0;
  transition:all .22s cubic-bezier(.16,1,.3,1);
}
#qnr-mega-menu-root .qm-cat:hover .qm-cat-ico{transform:scale(1.08)}
#qnr-mega-menu-root .qm-cat.on .qm-cat-ico{transform:scale(1.1);box-shadow:0 2px 8px rgba(0,0,0,.05)}
#qnr-mega-menu-root .qm-cat-name{flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
#qnr-mega-menu-root .qm-cat-count{font-size:10px;font-weight:700;border-radius:20px;padding:2px 8px;min-width:22px;text-align:center}

/* ═══ RIGHT MAIN ═══ */
#qnr-mega-menu-root .qm-right{flex:1;display:flex;flex-direction:column;min-width:0}
#qnr-mega-menu-root .qm-search-bar{padding:13px 22px;border-bottom:1px solid #f1f5f9;display:flex;align-items:center;gap:12px}
#qnr-mega-menu-root .qm-search-wrap{flex:1;position:relative}
#qnr-mega-menu-root .qm-search-wrap svg{position:absolute;left:13px;top:50%;transform:translateY(-50%)}
#qnr-mega-menu-root .qm-search{
  width:100%;padding:11px 13px 11px 40px;
  border:1.5px solid #e2e8f0;border-radius:13px;
  font-size:13px;outline:none;background:rgba(250,251,252,.8);
  font-family:'Inter',sans-serif;transition:.25s cubic-bezier(.16,1,.3,1);
}
#qnr-mega-menu-root .qm-search:focus{border-color:#10b981;box-shadow:0 0 0 3px rgba(16,185,129,.07);background:#fff}
#qnr-mega-menu-root .qm-cat-badge{display:inline-flex;align-items:center;gap:6px;padding:7px 14px;border-radius:11px;font-size:12px;font-weight:600;font-family:'Inter',sans-serif}

/* ═══ PRODUCTS — GEMINI BORDER ═══ */
#qnr-mega-menu-root .qm-prods{flex:0 0 auto;padding:14px 22px;overflow-y:auto;max-height:260px}
#qnr-mega-menu-root .qm-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(205px,1fr));gap:9px}
#qnr-mega-menu-root .qm-prod{
  position:relative;padding:13px 15px;border-radius:14px;
  background:#fff;text-decoration:none;cursor:pointer;color:inherit;
  display:flex;align-items:flex-start;gap:11px;
  border:1.5px solid #f1f5f9;
  transition:border-color .3s,box-shadow .3s;
}
#qnr-mega-menu-root .qm-prod-glow{
  --border-w:2px;
  position:absolute;inset:calc(var(--border-w)*-1);
  border-radius:16px;overflow:hidden;
  opacity:0;transition:opacity .35s;pointer-events:none;
}
#qnr-mega-menu-root .qm-prod-glow::after{
  content:'';position:absolute;inset:0;
  background:conic-gradient(from var(--rotation) in oklch,
    oklch(.72 .16 var(--hue,160)) 0%,
    oklch(.85 .12 var(--hue,160)) 25%,
    oklch(.95 .05 90) 40%,
    oklch(.85 .12 var(--hue,160)) 55%,
    oklch(.72 .16 var(--hue,160)) 70%,
    oklch(.6 .08 var(--hue,160)) 85%,
    oklch(.72 .16 var(--hue,160)) 100%
  );
  animation:qmm-rotateBorder 3s linear infinite;
  filter:blur(1px);
}
#qnr-mega-menu-root .qm-prod-glow-mask{
  position:absolute;inset:var(--border-w);
  border-radius:14px;background:#fff;z-index:1;
}
#qnr-mega-menu-root .qm-prod:hover .qm-prod-glow{opacity:1}
#qnr-mega-menu-root .qm-prod:hover{border-color:transparent;box-shadow:0 2px 14px rgba(0,0,0,.04)}
#qnr-mega-menu-root .qm-prod-ico{width:32px;height:32px;border-radius:9px;display:flex;align-items:center;justify-content:center;flex-shrink:0;position:relative;z-index:2}
#qnr-mega-menu-root .qm-prod-info{flex:1;min-width:0;position:relative;z-index:2}
#qnr-mega-menu-root .qm-prod-name{font-size:12.5px;font-weight:600;color:#0f172a;line-height:1.35}
#qnr-mega-menu-root .qm-prod-cat{font-size:10px;font-weight:500;margin-top:2px}
#qnr-mega-menu-root .qm-prod-cta{margin-top:5px;font-size:10.5px;font-weight:700;color:#059669;font-family:'Plus Jakarta Sans',sans-serif;display:flex;align-items:center;gap:3px;transition:gap .2s,color .2s}
#qnr-mega-menu-root .qm-prod:hover .qm-prod-cta{gap:6px;color:#10b981}
#qnr-mega-menu-root .qm-empty{text-align:center;padding:40px;color:#94a3b8}

/* ══ BOTTOM ══ */
#qnr-mega-menu-root .qm-bottom{padding:14px 22px 16px;border-top:1px solid #f1f5f9;display:flex;gap:12px;align-items:stretch;min-height:155px;overflow:hidden}

/* Featured card */
#qnr-mega-menu-root .qm-feat{flex:0 0 260px;border-radius:18px;padding:16px 18px;color:#fff;display:flex;flex-direction:column;justify-content:space-between;position:relative;overflow:hidden;transition:transform .3s cubic-bezier(.16,1,.3,1)}
#qnr-mega-menu-root .qm-feat:hover{transform:scale(1.01)}
#qnr-mega-menu-root .qm-feat::before{content:'';position:absolute;right:-25px;bottom:-25px;width:100px;height:100px;background:rgba(255,255,255,.04);border-radius:50%}
#qnr-mega-menu-root .qm-feat::after{content:'';position:absolute;right:20px;top:16px;width:40px;height:40px;background:rgba(255,255,255,.03);border-radius:50%;animation:qmm-floatSoft 4.5s ease-in-out infinite}
#qnr-mega-menu-root .qm-feat-label{font-size:9px;font-weight:700;text-transform:uppercase;letter-spacing:2.5px;opacity:.5;font-family:'Plus Jakarta Sans',sans-serif;margin-bottom:4px}
#qnr-mega-menu-root .qm-feat-title{font-size:15px;font-weight:800;line-height:1.3;font-family:'Plus Jakarta Sans',sans-serif;position:relative;z-index:1}
#qnr-mega-menu-root .qm-feat-desc{font-size:11px;line-height:1.5;opacity:.75;margin-top:5px;position:relative;z-index:1}
#qnr-mega-menu-root .qm-feat-btn{margin-top:10px;background:rgba(255,255,255,.12);border:1px solid rgba(255,255,255,.16);border-radius:11px;padding:8px 14px;color:#fff;cursor:pointer;font-size:11.5px;font-weight:700;font-family:'Plus Jakarta Sans',sans-serif;align-self:flex-start;transition:.2s cubic-bezier(.16,1,.3,1);position:relative;z-index:1}
#qnr-mega-menu-root .qm-feat-btn:hover{background:rgba(255,255,255,.22);transform:translateY(-1px)}

/* ═══ 3-STEP JOURNEY ═══ */
#qnr-mega-menu-root .qm-journey{flex:1;display:flex;align-items:center;justify-content:center;padding:10px 12px;gap:0;min-width:0;overflow:hidden}
#qnr-mega-menu-root .qm-journey-step{display:flex;flex-direction:column;align-items:center;text-align:center;flex:0 1 110px;min-width:0;position:relative;z-index:2}
#qnr-mega-menu-root .qm-journey-node{width:34px;height:34px;border-radius:50%;display:flex;align-items:center;justify-content:center;margin-bottom:6px;transition:.3s cubic-bezier(.16,1,.3,1);position:relative;flex-shrink:0}
#qnr-mega-menu-root .qm-journey-step:hover .qm-journey-node{transform:scale(1.1)}
#qnr-mega-menu-root .qm-journey-title{font-size:9px;font-weight:800;font-family:'Plus Jakarta Sans',sans-serif;text-transform:uppercase;letter-spacing:.5px;margin-bottom:2px}
#qnr-mega-menu-root .qm-journey-text{font-size:10px;font-weight:500;color:#475569;line-height:1.35;max-width:110px}
#qnr-mega-menu-root .qm-journey-line{flex:1;height:2px;position:relative;margin:0 -2px;margin-bottom:36px;background:#f1f5f9;border-radius:2px;overflow:hidden;min-width:16px;max-width:60px}
#qnr-mega-menu-root .qm-journey-line::after{content:'';position:absolute;inset:0;background:linear-gradient(90deg,transparent 0%,var(--line-c,#10b981) 40%,var(--line-c,#10b981) 60%,transparent 100%);background-size:200% 100%;animation:qmm-lineGlow 2.5s ease-in-out infinite}
#qnr-mega-menu-root .qm-journey-cta{flex:0 0 auto;margin-left:6px;margin-bottom:36px;padding:7px 12px;border-radius:10px;font-size:10px;font-weight:700;font-family:'Plus Jakarta Sans',sans-serif;cursor:pointer;border:none;color:#fff;transition:.2s cubic-bezier(.16,1,.3,1);white-space:nowrap}
#qnr-mega-menu-root .qm-journey-cta:hover{transform:translateY(-1px);filter:brightness(1.1)}

/* Zekat calc */
#qnr-mega-menu-root .qm-zekat-calc{flex:0 0 280px;border-radius:18px;padding:16px 18px;background:linear-gradient(145deg,#78350f,#b45309);color:#fff;position:relative;overflow:hidden;display:flex;flex-direction:column;gap:8px}
#qnr-mega-menu-root .qm-zekat-calc::before{content:'';position:absolute;right:-20px;top:-20px;width:80px;height:80px;background:rgba(251,191,36,.08);border-radius:50%}
#qnr-mega-menu-root .qm-zekat-calc-title{font-size:9px;font-weight:700;text-transform:uppercase;letter-spacing:2px;opacity:.5;font-family:'Plus Jakarta Sans',sans-serif}
#qnr-mega-menu-root .qm-zekat-calc h3{font-size:14px;font-weight:800;font-family:'Plus Jakarta Sans',sans-serif;margin:0}
#qnr-mega-menu-root .qm-zekat-input{display:flex;align-items:center;gap:8px;background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.15);border-radius:9px;padding:7px 11px}
#qnr-mega-menu-root .qm-zekat-input label{font-size:10px;font-weight:600;opacity:.7;white-space:nowrap}
#qnr-mega-menu-root .qm-zekat-input input{flex:1;background:transparent;border:none;color:#fff;font-size:14px;font-weight:700;font-family:'Plus Jakarta Sans',sans-serif;outline:none;text-align:right;min-width:0}
#qnr-mega-menu-root .qm-zekat-input input::placeholder{color:rgba(255,255,255,.3)}
#qnr-mega-menu-root .qm-zekat-result{background:rgba(255,255,255,.08);border-radius:9px;padding:9px 12px;display:flex;align-items:center;justify-content:space-between}
#qnr-mega-menu-root .qm-zekat-result-label{font-size:10px;opacity:.6}
#qnr-mega-menu-root .qm-zekat-result-val{font-size:17px;font-weight:800;font-family:'Plus Jakarta Sans',sans-serif;color:#fbbf24}
#qnr-mega-menu-root .qm-zekat-pay{background:#fbbf24;color:#78350f;border:none;border-radius:9px;padding:9px;font-size:11.5px;font-weight:800;font-family:'Plus Jakarta Sans',sans-serif;cursor:pointer;transition:.2s cubic-bezier(.16,1,.3,1);text-align:center}
#qnr-mega-menu-root .qm-zekat-pay:hover{transform:translateY(-1px);box-shadow:0 4px 12px rgba(251,191,36,.35)}

/* Footer */
#qnr-mega-menu-root .qm-foot{border-top:1px solid #f1f5f9;padding:10px 24px;display:flex;align-items:center;justify-content:space-between;background:#fafbfc;border-radius:0 0 24px 24px}
#qnr-mega-menu-root .qm-trust{display:flex;align-items:center;gap:7px;font-size:10.5px;color:#94a3b8}
#qnr-mega-menu-root .qm-viewall{font-size:11.5px;font-weight:700;color:#059669;text-decoration:none;font-family:'Plus Jakarta Sans',sans-serif;display:flex;align-items:center;gap:4px;transition:gap .2s}
#qnr-mega-menu-root .qm-viewall:hover{gap:7px;color:#10b981}

/* ══ TABLET ══ */
@media(max-width:1024px){
  #qnr-mega-menu-root .qm-body{flex-direction:column}
  #qnr-mega-menu-root .qm-left{width:100%;min-width:100%;max-height:none;border-right:none;border-bottom:1px solid #f1f5f9;display:flex;flex-wrap:nowrap;overflow-x:auto;gap:0;padding:7px 10px;-webkit-overflow-scrolling:touch}
  #qnr-mega-menu-root .qm-left::-webkit-scrollbar{display:none}
  #qnr-mega-menu-root .qm-left-hd{display:none}
  #qnr-mega-menu-root .qm-cat{width:auto;white-space:nowrap;border-left:none;border-bottom:2px solid transparent;padding:7px 12px;font-size:11.5px;flex-shrink:0}
  #qnr-mega-menu-root .qm-cat.on{border-bottom-color:#10b981;border-left:none}
  #qnr-mega-menu-root .qm-cat-ico{width:24px;height:24px}
  #qnr-mega-menu-root .qm-cat-count{display:none}
  #qnr-mega-menu-root .qm-bottom{flex-direction:column}
  #qnr-mega-menu-root .qm-feat,#qnr-mega-menu-root .qm-zekat-calc{flex:0 0 auto}
  #qnr-mega-menu-root .qm-journey{flex-wrap:nowrap;gap:0;padding:10px 8px}
  #qnr-mega-menu-root .qm-journey-step{flex:0 1 90px}
  #qnr-mega-menu-root .qm-journey-text{font-size:9px;max-width:90px}
  #qnr-mega-menu-root .qm-journey-line{min-width:12px;max-width:30px}
}

/* ══ MOBILE: hide mega panel, show drawer ══ */
@media(max-width:640px){
  #qnr-mega-menu-root{display:none!important}
}

/* ══ MOBILE ACCORDION STYLES ══ */
.qmob-chips{display:flex;gap:5px;padding:8px 0;overflow-x:auto;-webkit-overflow-scrolling:touch}
.qmob-chips::-webkit-scrollbar{display:none}
.qmob-chip{display:flex;align-items:center;gap:4px;padding:5px 10px;border-radius:16px;border:1.5px solid #e2e8f0;background:#fff;cursor:pointer;white-space:nowrap;font-size:11px;font-weight:600;color:#475569;flex-shrink:0;font-family:'Inter',sans-serif}
.qmob-chip-on{background:var(--cc,#10b981)!important;border-color:var(--cc,#10b981)!important;color:#fff!important}
.qmob-mini-feat{border-radius:12px;padding:12px 14px;color:#fff!important;margin:6px 0}
.qmob-mini-feat-t{font-size:13px;font-weight:800;font-family:'Plus Jakarta Sans',sans-serif;line-height:1.3;color:#fff!important}
.qmob-mini-feat-d{font-size:10px;opacity:.75;margin-top:3px;line-height:1.4;color:#fff!important}
.qmob-prod-link{display:flex;align-items:center;gap:8px;padding:10px 0;border-bottom:1px solid #f8fafc;text-decoration:none!important;color:#0f172a!important;font-size:13px;font-weight:500;font-family:'Inter',sans-serif}
.qmob-prod-link:last-of-type{border-bottom:none}
.qmob-prod-dot{width:6px;height:6px;border-radius:50%;flex-shrink:0}
.qmob-cta-btn{display:block!important;text-align:center!important;padding:11px!important;border-radius:11px!important;color:#fff!important;text-decoration:none!important;font-size:12px!important;font-weight:800!important;font-family:'Plus Jakarta Sans',sans-serif!important;margin-top:8px!important}

/* ══ MOBILE DONATIONS ACCORDION — THEME CSS OVERRIDE ══ */
/* theme.css .qmob__acc>.qmob__sub → max-height:0;overflow:hidden
   qMobAcc() → inline maxHeight (no !important)
   Stylesheet !important beats non-important inline styles per CSS spec */

/* Closed state: keep hidden */
.qmob__acc[data-qnr-donations]:not(.is-open)>.qmob__sub{
  max-height:0!important;opacity:0!important;overflow:hidden!important;
  transition:max-height .35s cubic-bezier(.4,0,.2,1),opacity .25s ease!important;
  padding:0 10px!important;
}
/* Open state: reveal content */
.qmob__acc[data-qnr-donations].is-open>.qmob__sub{
  max-height:2000px!important;
  opacity:1!important;
  overflow-y:auto!important;
  overflow-x:hidden!important;
  -webkit-overflow-scrolling:touch!important;
  padding:8px 10px 14px!important;
  transition:max-height .5s cubic-bezier(.16,1,.3,1),opacity .3s ease!important;
  scrollbar-width:thin;scrollbar-color:#a7f3d0 transparent;
}
.qmob__acc[data-qnr-donations].is-open>.qmob__sub::-webkit-scrollbar{width:3px}
.qmob__acc[data-qnr-donations].is-open>.qmob__sub::-webkit-scrollbar-thumb{background:#a7f3d0;border-radius:9px}

/* Neutralize theme.css .qmob__sub a rules on our custom elements */
.qmob__sub .qmob-prod-link{
  display:flex!important;align-items:center!important;gap:8px!important;
  padding:10px 2px!important;border-bottom:1px solid #f1f5f9!important;
  text-decoration:none!important;color:#0f172a!important;
  font-size:13px!important;font-weight:500!important;
  font-family:'Inter',sans-serif!important;
  background:transparent!important;border-radius:0!important;
  margin-bottom:0!important;border-left:none!important;
  border-right:none!important;border-top:none!important;
  animation:none!important;
}
.qmob__sub .qmob-prod-link:last-of-type{border-bottom:none!important}
.qmob__sub .qmob-prod-link::before{display:none!important}
.qmob__sub .qmob-prod-link:hover{
  background:rgba(16,185,129,.04)!important;
  transform:translateX(4px)!important;color:#064e3b!important;
}
/* CTA link inside accordion */
.qmob__sub .qmob-cta-link{
  display:block!important;text-align:center!important;
  padding:13px!important;border-radius:12px!important;
  color:#fff!important;text-decoration:none!important;
  font-size:13px!important;font-weight:800!important;
  font-family:'Plus Jakarta Sans',sans-serif!important;
  margin-top:10px!important;margin-bottom:4px!important;
  cursor:pointer!important;
  box-shadow:0 2px 10px rgba(0,0,0,.15)!important;
  border:none!important;
  animation:none!important;
}
.qmob__sub .qmob-cta-link::before{display:none!important}
.qmob__sub .qmob-cta-link:hover{
  transform:translateY(-1px)!important;
  filter:brightness(1.1)!important;
}
/* Featured card text override */
.qmob__sub .qmob-mini-feat{color:#fff!important;border:none!important;margin-bottom:0!important;animation:none!important}
/* Chip row - not <a> so theme doesn't target, but ensure isolation */
.qmob__sub .qmob-chips{border:none!important;background:transparent!important;animation:none!important}

/* ══ REDUCED MOTION ══ */
@media(prefers-reduced-motion:reduce){
  #qnr-mega-menu-root *,
  #qnr-mega-menu-root *::before,
  #qnr-mega-menu-root *::after{
    animation-duration:.01ms!important;
    transition-duration:.01ms!important;
  }
}
