/* Global base styles ported from template/ (shama-perfumes.com theme export).
   Loaded on every page via app/layout.js. Page/section-specific CSS lives in
   its own file (see header.css, footer.css, home.css, product-detail.css, ...). */

/* @import MUST come first (before any other rule, per CSS spec) or the browser
   silently drops it. */
@import url("/assets/css/base-app.css");
@import url("/assets/css/base-style.css");
@import url("/assets/css/base-responsive.css");
@import url("/assets/css/product-grid.css");

/* Theme color/font tokens ported from the template's :root block (index.html
   ~line 155). Everything below relies on these via var(--x) with a fallback —
   without this block the fallbacks (often white/black) silently win. */
:root {
  --mobile-swipe-width: calc(90vw - 30px);
  --font-body-scale: 1.0;
  --font-body-line-height-scale: 1.0;
  --font-body-letter-spacing: 0.0em;
  --font-body-medium-weight: 500;
  --font-body-bold-weight: 600;
  --font-announcement-scale: 1.05;
  --font-heading-scale: 1.05;
  --font-heading-line-height-scale: 1.0;
  --font-heading-letter-spacing: 0.0em;
  --font-navigation-scale: 1.0;
  --navigation-item-spacing: 15px;
  --font-product-title-scale: 1.0;
  --font-product-title-line-height-scale: 1.0;
  --button-letter-spacing: 0.02em;
  --button-font-scale: 1.0;

  --bg-body: #faf5ee;
  --bg-body-rgb: 250,245,238;
  --bg-body-darken: #f7eee2;
  --payment-terms-background-color: #faf5ee;
  --color-body: #495117;
  --color-body-rgb: 73,81,23;
  --color-accent: #000000;
  --color-accent-rgb: 0,0,0;
  --color-border: #e9e3e0;
  --color-form-border: #e9e3e0;
  --color-overlay-rgb: 0,0,0;

  --color-announcement-bar-text: #59611d;
  --color-announcement-bar-bg: #f7eee1;

  --color-header-bg: #495117;
  --color-header-bg-rgb: 73,81,23;
  --color-header-text: #faf5ee;
  --color-header-text-rgb: 250,245,238;
  --color-header-links: #faf5ee;
  --color-header-links-rgb: 250,245,238;
  --color-header-links-hover: #faf5ee;
  --color-header-icons: #faf5ee;
  --color-header-border: #faf5ee;

  --solid-button-background: #495117;
  --solid-button-label: #faf5ee;
  --outline-button-label: #35202e;
  --button-border-radius: 0px;

  --color-price: #35302e;
  --color-price-discounted: #ee3b45;
  --color-star: #cf6d32;
  --color-dots: #35302e;

  --color-inventory-instock: #1a3c34;
  --color-inventory-lowstock: #79242f;

  --section-spacing-mobile: 20px;
  --section-spacing-desktop: 40px;

  --color-badge-text: #ffffff;
  --color-badge-sold-out: #79242f;
  --color-badge-sale: #cf6d32;
  --color-badge-preorder: #666666;
  --badge-corner-radius: 13px;

  --color-footer-text: #FFFFFF;
  --color-footer-text-rgb: 255,255,255;
  --color-footer-link: #FFFFFF;
  --color-footer-link-hover: #FFFFFF;
  --color-footer-border: #59504c;
  --color-footer-border-rgb: 89,80,76;
  --color-footer-bg: #495117;
}

@font-face {
  font-family: Raleway;
  font-weight: 400;
  font-style: normal;
  font-display: swap;
  src: url("/assets/fonts/raleway/raleway_n4.2c76ddd103ff0f30b1230f13e160330ff8b2c68a.woff2") format("woff2"),
       url("/assets/fonts/raleway/raleway_n4.c057757dddc39994ad5d9c9f58e7c2c2a72359a9.woff") format("woff");
}
@font-face {
  font-family: Raleway;
  font-weight: 500;
  font-style: normal;
  font-display: swap;
  src: url("/assets/fonts/raleway/raleway_n5.0f898fcb9d16ae9a622ce7e706bb26c4a01b5028.woff2") format("woff2"),
       url("/assets/fonts/raleway/raleway_n5.c754eb57a4de1b66b11f20a04a7e3f1462e000f4.woff") format("woff");
}
@font-face {
  font-family: Raleway;
  font-weight: 600;
  font-style: normal;
  font-display: swap;
  src: url("/assets/fonts/raleway/raleway_n6.87db7132fdf2b1a000ff834d3753ad5731e10d88.woff2") format("woff2"),
       url("/assets/fonts/raleway/raleway_n6.ad26493e9aeb22e08a6282f7bed6ea8ab7c3927f.woff") format("woff");
}
@font-face {
  font-family: Raleway;
  font-weight: 400;
  font-style: italic;
  font-display: swap;
  src: url("/assets/fonts/raleway/raleway_i4.aaa73a72f55a5e60da3e9a082717e1ed8f22f0a2.woff2") format("woff2"),
       url("/assets/fonts/raleway/raleway_i4.650670cc243082f8988ecc5576b6d613cfd5a8ee.woff") format("woff");
}
@font-face {
  font-family: Raleway;
  font-weight: 600;
  font-style: italic;
  font-display: swap;
  src: url("/assets/fonts/raleway/raleway_i6.3ca54d7a36de0718dd80fae3527e1a64a421eeb8.woff2") format("woff2"),
       url("/assets/fonts/raleway/raleway_i6.b468b8770307bd25eee5b284ea3424978349afe2.woff") format("woff");
}
@font-face {
  font-family: "Playfair Display";
  font-weight: 400;
  font-style: normal;
  font-display: swap;
  src: url("/assets/fonts/playfair_display/playfairdisplay_n4.9980f3e16959dc89137cc1369bfc3ae98af1deb9.woff2") format("woff2"),
       url("/assets/fonts/playfair_display/playfairdisplay_n4.c562b7c8e5637886a811d2a017f9e023166064ee.woff") format("woff");
}

/* Theme typography rule from the template's inline <style data-shopify> block
   (same block the :root vars above came from). base-app.css (Dawn's own
   .h1/.h2/h3/.h3/etc utility classes) sets font-weight:700 + a system sans
   stack on any element with a .h1-.h6 class or bare h1-h6 tag — on the live
   site THIS rule (same specificity, later in source order) is what overrides
   it back to the Shama Playfair Display look. Without it every plain ".h1"/
   ".h2"/etc heading (e.g. wholesale-orders/bespoke-orders titles) renders
   bold + system-sans instead of the site's actual thin serif headings. */
h1, h2, h3, h4, h5, h6,
.h1, .h2, .h3, .h4, .h5, .h6,
.logolink.text-logo, .heading-font, .h1-xlarge, .h1-large,
.customer-addresses .my-address .address-index {
  font-style: normal;
  font-weight: 400;
  font-family: "Playfair Display", serif;
}
body, .body-font, .thb-product-detail .product-title {
  font-style: normal;
  font-weight: 400;
  font-family: Raleway, sans-serif;
}
body .product-grid-container {
  align-items: start;
}
.cart-drawer__empty-cart .main_btns .BROWN_btn:hover {
  color: #fff !important;
}
.remove {
  cursor: pointer;
}
.cart-discounts--error-text {
      color: #c30101;
    font-size: 0.85rem;
}
.product-add-to-cart-sticky.sticky--visible {
  z-index: 999;
}
.side-panel.product-drawer.active,
.side-panel.cart-drawer.active {
z-index: 9999;
}

body .main_btns .BROWN_btn:hover {
  color: #fff !important;
}

body #moreFlow .main_btns .BROWN_btn:hover {
border-color: #fff !important;
}

body .pd-gift-modal-overlay {
  z-index: 999;
}

.image_width_Content .img_content h2 {
      color: #846e47;
}

.image_width_Content .dis_area p {
  color: #846e47;
}


body:has(.Inner_banner_Sec) .header:not(.is-sticky) .thb-secondary-area .thb-secondary-area-item.thb-quick-search svg path {
stroke: #fff;
}

body:has(.Inner_banner_Sec) .header:not(.is-sticky) .thb-secondary-area .thb-secondary-cart.thb-secondary-area-item svg path {
  stroke: initial;
}


@media only screen and (max-width: 768px) {
  body .coppy_rows .copy_write p {
    line-height: 20px;
  }

  .form-notification {
    font-size: 1rem;
  }

  .gift-dialog-media {
    display: none;
  }
}