/** Shopify CDN: Minification failed

Line 42:0 All "@import" rules must come first

**/
/* ==========================================================================
   Gazelle Glam — theme layer for Dawn
   Load AFTER base.css:  {{ 'gg-theme.css' | asset_url | stylesheet_tag }}
   ========================================================================== */
:root{
  /* Ink + paper */
  --gg-ink:#2E1C24;        /* body copy, headings           */
  --gg-ink-soft:#7E6672;   /* secondary copy                */
  --gg-paper:#FFFBFC;      /* page background               */
  --gg-white:#FFFFFF;      /* cards, header                 */
  /* Brand */
  --gg-pink:#D9407E;       /* primary CTA, accents          */
  --gg-pink-dark:#B92C64;  /* CTA hover                     */
  --gg-rose-deep:#8B2350;  /* promo bar                     */
  --gg-blush:#FBE4EC;      /* section fills                 */
  --gg-blush-soft:#FDEEF3; /* hover fills                   */
  --gg-line:#F5DDE6;       /* hairlines, card borders       */
  --gg-gold:#E0A94C;       /* loyalty, Ramadan, footer keys */
  --gg-green:#2E7D64;      /* success, in-stock, COD        */
  /* Form */
  --gg-r-sm:10px; --gg-r-md:20px; --gg-r-lg:26px; --gg-r-pill:999px;
  --gg-shadow:0 18px 34px -22px rgba(217,64,126,.45);
  --gg-ease:cubic-bezier(.22,.7,.2,1);
  /* Dawn overrides — Dawn reads these as RGB triplets */
  --color-base-accent-1:217,64,126;
  --color-base-text:46,28,36;
  --color-base-background-1:255,251,252;
  --buttons-radius:999px;
  --buttons-radius-outset:999px;
  --inputs-radius:999px;
  --media-radius:22px;
  --card-corner-radius:22px;
  --page-width:150rem;
}

/* ---- Type: one family, Poppins ---------------------------------------- */
@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@300;400;500;600;700&family=Noto+Kufi+Arabic:wght@300;400;600&display=swap');
body,.gg{font-family:Poppins,sans-serif;color:var(--gg-ink);background:var(--gg-paper);}
html[lang="ar"] body{font-family:'Noto Kufi Arabic',Poppins,sans-serif;}
h1,h2,h3,.h1,.h2,.h3{font-family:Poppins,sans-serif;font-weight:600;letter-spacing:-.01em;line-height:1.08;}
.gg-kicker{font-size:9.5px;letter-spacing:.24em;text-transform:uppercase;font-weight:700;color:var(--gg-pink);}
.gg-sub{font-size:13px;line-height:1.65;color:var(--gg-ink-soft);max-width:52ch;}

/* ---- Buttons ---------------------------------------------------------- */
.gg-btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;border:none;cursor:pointer;
  border-radius:var(--gg-r-pill);padding:15px 30px;font:600 11px/1 Poppins,sans-serif;
  letter-spacing:.18em;text-transform:uppercase;
  transition:background-color .28s ease,color .28s ease,transform .28s var(--gg-ease),box-shadow .28s ease;}
.gg-btn--primary{background:var(--gg-pink);color:#fff;}
.gg-btn--primary:hover{background:var(--gg-pink-dark);transform:translateY(-2px);box-shadow:0 14px 26px -14px rgba(185,44,100,.6);}
.gg-btn--ghost{background:none;color:var(--gg-ink);border:1px solid var(--gg-ink);}
.gg-btn--ghost:hover{background:var(--gg-blush);transform:translateY(-2px);}
.gg-btn--light{background:#fff;color:var(--gg-ink);}
.gg-btn--light:hover{background:var(--gg-pink);color:#fff;transform:translateY(-2px);}

/* ---- Section shell: full-bleed rows ---------------------------------- */
.gg-section{padding:clamp(40px,5vw,74px) clamp(26px,3.4vw,58px);}
.gg-section--blush{background:var(--gg-blush);border-block:1px solid var(--gg-line);}
.gg-section--white{background:var(--gg-white);border-block:1px solid var(--gg-line);}
.gg-section--dark{background:var(--gg-ink);color:#FDEEF3;}
.gg-head{display:flex;align-items:flex-end;justify-content:space-between;gap:20px;flex-wrap:wrap;}
.gg-head h2{font-size:clamp(28px,3.6vw,44px);margin:10px 0 8px;}

/* ---- Carousel rail --------------------------------------------------- */
.gg-rail-wrap{position:relative;margin-top:26px;}
.gg-rail{display:flex;gap:18px;overflow-x:auto;padding:4px 2px 20px;scrollbar-width:none;scroll-snap-type:x proximity;align-items:stretch;}
.gg-rail::-webkit-scrollbar{height:0;}
.gg-rail>*{flex:0 0 clamp(178px,20vw,238px);scroll-snap-align:start;}
.gg-rail--video>*{flex:0 0 clamp(196px,17vw,248px);}
.gg-arrow{position:absolute;top:34%;width:46px;height:46px;border-radius:50%;border:1px solid #F2D3E0;
  background:#fff;color:var(--gg-ink);display:flex;align-items:center;justify-content:center;cursor:pointer;z-index:3;
  box-shadow:0 14px 28px -16px rgba(46,28,36,.45);transition:all .25s var(--gg-ease);}
.gg-arrow:hover{background:var(--gg-pink);color:#fff;border-color:var(--gg-pink);}
.gg-arrow[disabled]{opacity:.3;cursor:default;}
.gg-arrow--prev{inset-inline-start:-8px;} .gg-arrow--next{inset-inline-end:-8px;}
[dir=rtl] .gg-arrow--prev svg,[dir=rtl] .gg-arrow--next svg{transform:scaleX(-1);}

/* ---- Product card ---------------------------------------------------- */
.gg-card{position:relative;display:flex;flex-direction:column;background:#fff;border:1px solid var(--gg-line);
  border-radius:22px;overflow:hidden;height:100%;
  transition:border-color .3s,box-shadow .3s,transform .3s var(--gg-ease);}
.gg-card:hover{border-color:#F0C3D6;box-shadow:0 24px 44px -26px rgba(217,64,126,.5);transform:translateY(-6px);}
.gg-card__media{position:relative;aspect-ratio:1/1;background:var(--gg-blush);overflow:hidden;}
.gg-card__media img{width:100%;height:100%;object-fit:cover;transition:transform .5s var(--gg-ease);}
.gg-card:hover .gg-card__media img{transform:scale(1.04) translateY(-6px);}
.gg-card__body{padding:14px 14px 16px;display:flex;flex-direction:column;gap:6px;flex:1;}
.gg-card__brand{font-size:9px;letter-spacing:.18em;text-transform:uppercase;color:var(--gg-ink-soft);font-weight:600;}
.gg-card__title{
  font-size:12.5px;font-weight:500;line-height:1.4;color:var(--gg-ink);
  display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;overflow:hidden;
}
.gg-card__size{font-size:10.5px;color:var(--gg-ink-soft);}
.gg-card__price{
  display:flex;align-items:baseline;gap:7px;
  margin-top:8px;padding-top:0;
}
.gg-card__now{font-size:14px;font-weight:600;color:var(--gg-ink);}
.gg-card__was{font-size:11px;color:var(--gg-ink-soft);text-decoration:line-through;}
.gg-badge{position:absolute;z-index:2;border-radius:var(--gg-r-pill);font-weight:700;}
.gg-badge--tag{top:10px;inset-inline-start:10px;background:var(--gg-ink);color:#FFFBFC;font-size:9px;
  letter-spacing:.14em;text-transform:uppercase;padding:5px 10px;}
.gg-badge--save{top:10px;inset-inline-end:10px;background:var(--gg-pink);color:#fff;font-size:11px;padding:5px 10px;}
.gg-badge--rank{top:10px;inset-inline-start:10px;width:28px;height:28px;background:var(--gg-pink);color:#fff;
  font-size:11.5px;display:flex;align-items:center;justify-content:center;}
.gg-split{display:flex;align-items:center;gap:6px;font-size:10px;color:var(--gg-ink-soft);}

/* ---- Banners --------------------------------------------------------- */
.gg-banner{position:relative;border-radius:var(--gg-r-lg);overflow:hidden;min-height:clamp(280px,26vw,380px);
  background:var(--gg-ink);}
.gg-banner--wide{min-height:clamp(300px,30vw,420px);border-radius:28px;}
.gg-banner__img{position:absolute;inset-block:0;inset-inline-end:0;width:58%;}
.gg-banner__img img{width:100%;height:100%;object-fit:cover;}
.gg-banner__veil{position:absolute;inset:0;z-index:1;pointer-events:none;
  background:linear-gradient(100deg,rgba(46,28,36,1) 0%,rgba(46,28,36,.96) 38%,rgba(46,28,36,0) 62%);}
.gg-banner__copy{position:absolute;inset-block:0;inset-inline-start:0;z-index:2;width:min(74%,380px);
  padding:clamp(22px,2.4vw,34px);display:flex;flex-direction:column;justify-content:center;gap:11px;color:#fff;}
.gg-banner__copy h3{font-size:clamp(22px,2.3vw,31px);line-height:1.12;}
.gg-banner__copy p{font-size:12.5px;line-height:1.6;color:rgba(255,255,255,.84);}

/* ---- Motion ---------------------------------------------------------- */
@keyframes gg-up{from{opacity:0;transform:translateY(16px)}to{opacity:1;transform:none}}
@keyframes gg-marquee{from{transform:translateX(0)}to{transform:translateX(-50%)}}
.gg-reveal{opacity:0;}
.gg-reveal.is-in{animation:gg-up .75s var(--gg-ease) both;}
@media (prefers-reduced-motion:reduce){.gg-reveal{opacity:1;animation:none}}

/* ---- Mobile ---------------------------------------------------------- */
@media screen and (max-width:989px){
  .gg-section{padding:clamp(30px,6vw,44px) 18px;}
  .gg-banner__img{width:100%;}
  .gg-banner__veil{background:linear-gradient(180deg,rgba(46,28,36,.25) 0%,rgba(46,28,36,.9) 62%);}
  .gg-banner__copy{width:100%;justify-content:flex-end;}
  .gg-arrow{display:none;}
  .gg-rail{scroll-snap-type:x mandatory;}
  .gg-rail>*{flex:0 0 68vw;}
}

/* ---- Stock Dawn page normalization -------------------------------------
   Collections list, Search, Page (Contact/About), and Blog were never
   rebuilt as custom gg- sections, so they still render with Dawn's own
   native typography. Dawn's page/section templates apply font-size via
   utility classes directly on the heading tag (h0/h1/h2/hxl/hxxl — h0 is
   Dawn's LARGEST preset), not a single ".title" class — e.g. main-page.liquid
   hardcodes class="main-page-title page-title h0" on the Contact/About page
   title, which is exactly why it renders so oversized: h0 is bigger than
   even a normal h1, and this is hardcoded in the template markup itself,
   not driven by the theme-wide Typography scale setting. Targeting the
   utility classes directly (scoped to these stock template body classes,
   which Dawn adds automatically) catches every instance regardless of
   which specific section/wrapper markup is used, without touching any
   custom gg- section elsewhere on the site. ------------------------------ */
.template-page .h0,
.template-page .h1,
.template-page .hxl,
.template-page .hxxl,
.template-search .h0,
.template-search .h1,
.template-search .hxl,
.template-search .hxxl,
.template-list-collections .h0,
.template-list-collections .h1,
.template-list-collections .hxl,
.template-list-collections .hxxl,
.template-blog .h0,
.template-blog .h1,
.template-blog .hxl,
.template-blog .hxxl,
.template-article .h0,
.template-article .h1,
.template-article .hxl,
.template-article .hxxl{
  font-family:Poppins,sans-serif !important;
  font-weight:600 !important;
  font-size:clamp(26px,3.2vw,40px) !important;
  line-height:1.1 !important;
  letter-spacing:-.01em !important;
  color:var(--gg-ink) !important;
}
/* h2-scale headings (e.g. the Search page's own "Search" title, and the
   optional heading on the separate Contact Form section) stay a touch
   smaller than the h0/h1/hxl/hxxl group above. */
.template-page .h2,
.template-search .h2,
.template-list-collections .h2,
.template-blog .h2,
.template-article .h2{
  font-family:Poppins,sans-serif !important;
  font-weight:600 !important;
  font-size:clamp(22px,2.6vw,32px) !important;
  line-height:1.15 !important;
  letter-spacing:-.01em !important;
  color:var(--gg-ink) !important;
}
.template-list-collections .page-width,
.template-search .page-width,
.template-page .page-width,
.template-blog .page-width,
.template-article .page-width{
  font-family:Poppins,sans-serif;
}
.template-page .rte,
.template-page .rte p{
  font-size:14px;
  line-height:1.7;
  color:var(--gg-ink-soft);
}
.template-page .field input,
.template-page .field textarea,
.template-page .field label{
  font-family:Poppins,sans-serif !important;
  border-radius:var(--gg-r-md) !important;
}
.template-page button[type="submit"]{
  font-family:Poppins,sans-serif;
  border-radius:var(--gg-r-pill) !important;
  background:var(--gg-pink) !important;
}
.template-page button[type="submit"]:hover{
  background:var(--gg-pink-dark) !important;
}

/* ---- Sticky-bar bleed-through fix -------------------------------------
   position:sticky elements can get promoted to their own compositor layer
   on mobile Safari/Chrome, which can make them render ABOVE other content
   regardless of normal z-index rules — including above the mobile nav
   drawer's overlay. There's no need for a sticky bar to stay stuck while
   the page is scroll-locked behind the drawer anyway, so fully disabling
   sticky positioning during that window sidesteps the compositor bug
   entirely rather than trying to out-z-index it. gg-mobile-drawer.liquid
   toggles this class on <html> on open/close. Add .gg-sticky-bar to any
   sticky toolbar/header on the site to get this protection. -------------- */
html.gg-drawer-open .gg-sticky-bar{
  position:static !important;
  z-index:auto !important;
}

/* ---- Dirham symbol sizing -----------------------------------------------
   The currency-format icon (.dirham-symbol, output by Shopify's currency
   formatting field) inherits the surrounding text's font-size by default,
   which reads as oversized next to the price digits — most noticeable at
   the larger PDP price sizes. Sizing it in em units means it always scales
   proportionally to whatever price text it sits next to, sitewide (PDP,
   product cards, cart, trust badges), from one rule. ---------------------- */
.dirham-symbol{
  font-size:0.72em;
  vertical-align:0.03em;
  display:inline-block;
  line-height:1;
}

/* ---- Select dropdown-list text visibility -------------------------------
   Our custom pill-styled selects (language/currency switchers, sort
   dropdowns, etc.) set a light/white text colour on the <select> itself
   for the closed, dark-pill look — but browsers render the OPEN dropdown
   list of <option>s against a plain white/system background regardless of
   that styling, and text colour is inherited into that list. White text
   on that white list background is what was showing as washed-out,
   barely-visible option text. This rule keeps every option list
   dark-on-white and legible, without changing how the closed select
   itself looks. Global and !important since native <option> styling is
   otherwise very easy for a more specific rule to accidentally re-inherit
   from its parent <select>. -------------------------------------------- */
select option{
  color:#2E1C24 !important;
  background:#FFFFFF !important;
}
