/* ================================================
   RMEEZ CUSTOM STYLES
   All SVG URLs are loaded via CSS variables
   defined in layout.jinja :root block
   ================================================ */

/* === FONT === */
html, body, button, input, select, textarea,
h1, h2, h3, h4, h5, h6, p, a, span, div, li, label,
.btn, .badge, .form-input, .form-label, .form-textarea {
  font-family: var(--font-family) !important;
}

html, body { background: var(--rmeez-cream) !important; }
body {
  color: var(--foreground) !important;
  line-height: 1.7 !important;
  font-size: 16px !important;
}
/* Remove any gap/margin before first section (hero banner) */
#main { margin: 0 !important; padding: 0 !important; }
#main > section:first-child,
#main > div:first-child {
  margin-top: 0 !important; padding-top: 0 !important;
}
/* Homepage: hero flush to top of screen */
body[data-template="home"] #main {
  margin-top: 0 !important; padding-top: 0 !important;
}
h1, h2, h3, h4, h5, h6 { font-weight: bold !important; }
a, button, input { transition: all .4s ease-in-out !important; }
::selection { color: #fff; background: #000; }

@media (max-width: 992px) {
  body { line-height: 1.4 !important; font-size: 14px !important; }
}

/* === SVG ICON SYSTEM (CSS Mask) === */
.svg-icon {
  display: inline-block;
  mask-size: contain; -webkit-mask-size: contain;
  mask-repeat: no-repeat; -webkit-mask-repeat: no-repeat;
  mask-position: center; -webkit-mask-position: center;
}
.svg-icon.icon-cart {
  -webkit-mask-image: var(--icon-cart-url);
  mask-image: var(--icon-cart-url);
  width: 20px; height: 20px;
}
.svg-icon.icon-bars {
  -webkit-mask-image: var(--icon-bars-url);
  mask-image: var(--icon-bars-url);
  width: 30px; height: 30px;
}
.svg-icon.icon-user {
  -webkit-mask-image: var(--icon-user-url);
  mask-image: var(--icon-user-url);
  width: 30px; height: 30px;
}
.svg-icon.icon-search {
  -webkit-mask-image: var(--icon-search-url);
  mask-image: var(--icon-search-url);
  width: 20px; height: 20px;
  margin-top: 8px;
}

/* === HEADER ICON SIZE === */
.header-icon {
  width: 24px;
  height: 24px;
}

/* === MAIN LOGO === */
#main-header .logo-img {
  max-height: 55px !important;
  width: auto !important;
}
#main-header.header-solid .logo-img,
#main-header.header-scrolled .logo-img {
  max-height: 45px !important;
}
@media (max-width: 768px) {
  #main-header .logo-img { max-height: 40px !important; }
  #main-header.header-solid .logo-img { max-height: 35px !important; }
}

/* === HEADER === */
#main-header {
  padding: 30px 0 !important;
  transition: all .4s ease-in-out !important;
  border: none !important;
  box-shadow: none !important;
}
#main-header a, #main-header button {
  background: none !important;
  border: 0 !important;
  color: var(--rmeez-cream) !important;
}
#main-header .svg-icon { background-color: var(--rmeez-cream); }
/* Header hover on transparent: purple */
#main-header a:hover, #main-header button:hover { color: var(--primaryColor) !important; }
#main-header a:hover .svg-icon, #main-header button:hover .svg-icon { background-color: var(--primaryColor) !important; }
/* Logo - no max-width restriction, height controlled above */
#main-header .logo-white { display: none !important; }

/* --- Solid/Sticky Header (purple) --- */
#main-header.header-solid {
  padding: 5px 0 !important;
  z-index: 9999 !important;
  background: var(--primaryColor) !important;
}
#main-header.header-solid .logo-default { display: none !important; }
#main-header.header-solid .logo-white { display: inline-block !important; }
/* Sticky hover: gold */
#main-header.header-solid a:hover, #main-header.header-solid button:hover { color: var(--rmeez-gold) !important; }
#main-header.header-solid a:hover .svg-icon, #main-header.header-solid button:hover .svg-icon { background-color: var(--rmeez-gold) !important; }

/* --- Homepage: Fixed transparent header overlaps hero --- */
body[data-template="home"] #site-header {
  position: fixed !important;
  top: 0 !important; left: 0 !important; right: 0 !important;
  z-index: 999 !important;
  width: 100% !important;
  height: 0 !important; overflow: visible !important;
}
body[data-template="home"] #main-header.header-transparent {
  background: transparent !important;
  padding: 30px 0 !important;
}
body[data-template="home"] #main-header.header-transparent .logo-default { display: none !important; }
body[data-template="home"] #main-header.header-transparent .logo-white { display: inline-block !important; }
/* Transparent hover: purple */
body[data-template="home"] #main-header.header-transparent a:hover,
body[data-template="home"] #main-header.header-transparent button:hover { color: var(--primaryColor) !important; }
body[data-template="home"] #main-header.header-transparent a:hover .svg-icon,
body[data-template="home"] #main-header.header-transparent button:hover .svg-icon { background-color: var(--primaryColor) !important; }

/* --- Homepage: Scrolled (purple) --- */
body[data-template="home"] #main-header.header-scrolled {
  background: var(--primaryColor) !important;
  padding: 5px 0 !important;
}
body[data-template="home"] #main-header.header-scrolled .logo-default { display: none !important; }
body[data-template="home"] #main-header.header-scrolled .logo-white { display: inline-block !important; }
/* Scrolled hover: gold */
body[data-template="home"] #main-header.header-scrolled a:hover,
body[data-template="home"] #main-header.header-scrolled button:hover { color: var(--rmeez-gold) !important; }
body[data-template="home"] #main-header.header-scrolled a:hover .svg-icon,
body[data-template="home"] #main-header.header-scrolled button:hover .svg-icon { background-color: var(--rmeez-gold) !important; }
body[data-template="home"] #site-header.is-scrolled { position: fixed !important; }

/* --- Non-home: Solid purple --- */
body:not([data-template="home"]) #main-header {
  background: var(--primaryColor) !important;
  padding: 5px 0 !important;
}
body:not([data-template="home"]) #main-header .logo-default { display: none !important; }
body:not([data-template="home"]) #main-header .logo-white { display: inline-block !important; }
body:not([data-template="home"]) #main-header a:hover,
body:not([data-template="home"]) #main-header button:hover { color: var(--rmeez-gold) !important; }
body:not([data-template="home"]) #main-header a:hover .svg-icon,
body:not([data-template="home"]) #main-header button:hover .svg-icon { background-color: var(--rmeez-gold) !important; }

/* --- Cart Badge (small coral dot) --- */
.cart-badge-dot, [data-cart-badge] {
  text-align: center !important; position: absolute !important;
  width: 12px !important; height: 12px !important; line-height: 12px !important;
  border-radius: 50% !important; background: var(--rmeez-coral) !important;
  color: var(--primaryColor) !important; right: -5px !important; top: 2px !important;
  text-indent: -999em !important; border: 2px var(--rmeez-cream) solid !important;
  overflow: hidden !important; padding: 0 !important; min-width: auto !important; font-size: 0 !important;
}

@media (max-width: 992px) {
  body[data-template="home"] #main-header.header-transparent { padding: 10px 0 !important; }
}
@media (max-width: 767px) {
  .block-cart { width: 35px !important; height: 35px !important; line-height: 35px !important; }
}

/* === ANNOUNCEMENT BAR === */
[class*="announcement"], .bg-primary:has(.announcement-marquee) {
  border-radius: 0 !important; background: var(--primaryColor) !important;
  color: #fff !important; margin: 0 !important; text-align: center !important;
}

/* === SECTIONS === */
section[section-id], .section-products, .section-testimonials,
.section-benefits, .section-categories, .section-partners {
  padding: 40px 0 !important;
}

/* Section Titles */
.section-title,
section[section-id] h2,
.section-products h2, .section-testimonials h2, .section-categories h2,
.section-partners h2, .theme-container > h2 {
  text-align: center !important; color: #6e5ba4 !important;
  font-size: calc(20px + 1vw) !important;
  margin-bottom: 20px !important;
}
/* SVG decoration ON the span - at START of text (right in RTL) */
.section-title span,
section[section-id] h2 span {
  position: relative !important;
  display: inline-block !important;
  background: var(--svg-letter-url) no-repeat right center !important;
  background-size: 70px !important;
  padding: 10px 15px !important;
}
[dir="ltr"] .section-title span,
[dir="ltr"] section[section-id] h2 span {
  background-position: left center !important;
}
/* Product section: gold SVG + coral title */
.product-section h2 { color: var(--rmeez-coral) !important; }
.product-section .section-title span,
.product-section h2 span {
  background-image: var(--svg-letter2-url) !important;
}
/* Partners section */
.section-partners { background: rgba(25, 25, 25, 0.04) !important; }

/* === BUTTONS === */
.btn { border-width: 2px !important; border-radius: 30px !important; overflow: hidden !important; }
@media (max-width: 992px) { .btn { font-size: 14px !important; } }

/* Primary Button: cream bg, gold border, SVG flush RIGHT edge */
.btn-filled, .btn.btn-filled {
  background-color: var(--rmeez-cream) !important;
  background-image: var(--btn-svg-url) !important;
  background-repeat: no-repeat !important;
  background-position: right center !important;
  background-size: auto 102% !important;
  border: 2px solid var(--rmeez-gold) !important;
  color: #6e5ba4 !important;
  font-weight: bold !important; width: 220px !important; max-width: 100% !important;
  border-radius: 30px !important; box-shadow: none !important;
  padding-left: 20px !important;
  padding-right: 50px !important;
  text-align: left !important;
  overflow: hidden !important;
}
.btn-filled:hover, .btn.btn-filled:hover {
  background: #6E5BA4 !important; border-color: #6E5BA4 !important; color: #fff !important; transform: none !important;
}

/* Outlined Button */
.btn-outlined, .btn.btn-outlined {
  background: #fff !important; border: 2px solid #E5E5E5 !important;
  color: #535353 !important; border-radius: 30px !important; box-shadow: none !important;
}
.btn-outlined:hover, .btn.btn-outlined:hover {
  background: #fff !important; border-color: #000 !important; color: #535353 !important; transform: none !important;
}

/* Outline Primary */
.btn-outline-primary { border-color: var(--primaryColor) !important; color: var(--primaryColor) !important; }
.btn-outline-primary:hover { background: var(--primaryColor) !important; color: #fff !important; }

/* === PRODUCT CARDS === */
[data-product-card] {
  background: var(--rmeez-cream) !important; border: 2px solid #e2e0cb !important;
  border-radius: 16px !important; overflow: hidden !important;
  height: 100% !important; padding: 0 !important; transition: all .4s ease-in-out !important;
}
/* Only the image area is white */
[data-product-card] > a:first-child {
  background: #fff !important;
}
[data-product-card]:hover {
  box-shadow: 0 3px 6px 0 rgba(0, 0, 0, 0.16) !important;
  transform: none !important; border-color: #e2e0cb !important;
}

/* Card image - wide/tall like old theme */
[data-product-card] > a:first-child { border-radius: 0 !important; overflow: hidden !important; position: relative !important; }
[data-product-card] > a:first-child img {
  width: 100% !important; aspect-ratio: 380/420 !important; height: auto !important; object-fit: cover !important;
  border-radius: 0 !important; transition: all .4s ease-in-out !important;
}

/* Discount badge: HIDDEN */
[data-product-card] .badge-filled {
  display: none !important;
}

/* Card content - centered, tight spacing */
[data-product-card] > div:nth-child(2), [data-product-card] .flex.flex-1 {
  padding: 10px 10px 5px !important; text-align: center !important;
  align-items: center !important; gap: 4px !important;
}
[data-product-card] .flex.flex-col.gap-2 {
  gap: 2px !important; align-items: center !important;
}

/* Category link as branded badge - centered */
[data-product-card] .category-badge,
[data-product-card] a[href*="/categories/"] {
  display: inline-block !important; padding: 4px 12px 0px 10px !important; border-radius: 25px !important;
  color: #fff !important; background: var(--primaryColor) !important;
  font-size: 12px !important; margin-bottom: 8px !important;
  text-decoration: none !important; line-height: 1.4 !important;
  white-space: nowrap !important; width: auto !important; max-width: fit-content !important;
  align-self: center !important; margin-left: auto !important; margin-right: auto !important;
}

/* Product name */
[data-product-card] h3 {
  height: 45px !important; margin-bottom: 2px !important; color: #2d2d2d !important;
  font-size: 15px !important; overflow: hidden !important;
}
@media (max-width: 992px) { [data-product-card] h3 { height: 44px !important; } }
[data-product-card] h3 a { color: #2d2d2d !important; }
[data-product-card] h3 a:hover { color: var(--primaryColor) !important; background: none !important; }

/* Stars - hidden on product cards */
[data-product-card] .flex.items-center.gap-2:has(.flex.gap-0\.5) {
  display: none !important;
}
[data-product-card] .flex.items-center.gap-2:has(.text-warning) {
  display: none !important;
}

/* Price - regular (no sale): black bold */
[data-product-card] .product-price {
  font-weight: bold !important; color: #000 !important;
  font-size: 20px !important;
}
/* Sale price (after discount): red bold */
[data-product-card] .flex.flex-col.gap-1 > p {
  font-weight: bold !important; color: #df3838 !important;
  font-size: 20px !important;
}
/* Original price (before discount): light black, strikethrough */
[data-product-card] .line-through { color: #999 !important; font-size: 14px !important; font-weight: normal !important; }
@media (max-width: 992px) {
  [data-product-card] .product-price { font-size: 16px !important; }
  [data-product-card] .flex.flex-col.gap-1 > p { font-size: 16px !important; }
}
/* Price container centered */
[data-product-card] .flex.flex-col.gap-1 { align-items: center !important; }
[data-product-card] .flex.flex-wrap.items-center.gap-2 { justify-content: center !important; flex-wrap: nowrap !important; gap: 4px !important; }

/* Discount percentage badge in card */
[data-product-card] .bg-success\/20 {
  background: #df3838 !important; color: #fff !important;
  border-radius: 8px !important; font-size: 14px !important;
  font-weight: bold !important; padding: 2px 6px 0px 6px !important;
  white-space: nowrap !important; flex-shrink: 0 !important;
}
@media (max-width: 768px) {
  [data-product-card] .bg-success\/20 {
    font-size: 11px !important; padding: 1px 4px 0px 4px !important;
  }
  [data-product-card] .line-through { font-size: 11px !important; }
}

/* === LIST VIEW - fix button SVG === */
[data-grid="list"] [data-product-card] .btn:not([data-wishlist-btn]) {
  background-size: auto 102% !important;
  background-position: right center !important;
  min-height: 44px !important;
}

/* Card actions */
[data-product-card] .mt-auto { padding: 0 10px 0 !important; margin-top: 4px !important; margin-bottom: 10px !important; }

/* Card button: cream + SVG flush RIGHT - exclude wishlist */
[data-product-card] .btn-outlined:not([data-wishlist-btn]),
[data-product-card] .btn:not([data-wishlist-btn]) {
  background-color: var(--rmeez-cream) !important;
  background-image: var(--btn-svg-url) !important;
  background-repeat: no-repeat !important;
  background-position: right center !important;
  background-size: auto 100% !important;
  border: 2px solid var(--rmeez-gold) !important;
  color: #6e5ba4 !important; font-weight: bold !important; border-radius: 30px !important;
  width: 100% !important; overflow: hidden !important;
  text-align: left !important;
  padding: 8px 40px 1px 16px !important;
  height: 40px !important;
  min-height: auto !important;
}
[data-product-card] .btn-outlined:not([data-wishlist-btn]):hover,
[data-product-card] .btn:not([data-wishlist-btn]):hover {
  background: #6E5BA4 !important; border-color: #6E5BA4 !important; color: #fff !important;
}

/* === PRODUCT PAGE === */
#product-main-section h1 { font-size: 25px !important; font-weight: bold !important; }
[data-product-price] { font-size: 30px !important; font-weight: bold !important; color: var(--primaryColor) !important; }
[data-product-price-old] { color: #616161 !important; text-decoration: line-through !important; }
.product-gallery-column img, .product-images-all img { border: 1px solid #e2e0cb !important; border-radius: 16px !important; }
.short-desc { color: #4b4b4b !important; }
.product-sold { color: #707070 !important; font-size: 12px !important; }

/* Quantity input */
.qty-input, .handle-counter {
  background: #fff !important; display: inline-flex !important;
  border: 2px solid var(--primaryColor) !important; border-radius: 30px !important;
  overflow: visible !important; align-items: center !important;
  padding: 3px !important;
}
.qty-input button, .handle-counter button, .qty-input-btn, .btn-quantity {
  background: var(--primaryColor) !important; border: 0 !important;
  color: #fff !important;
  display: flex !important; align-items: center !important; justify-content: center !important;
  width: 28px !important; height: 28px !important; min-width: 28px !important;
  border-radius: 50% !important; padding: 0 !important;
  transition: all 0.2s ease !important; flex-shrink: 0 !important;
}
.qty-input button svg, .qty-input-btn svg, .handle-counter button svg,
.btn-quantity svg { width: 12px !important; height: 12px !important; }
.qty-input-btn:hover, .btn-quantity:hover,
.qty-input button:hover, .handle-counter button:hover {
  background-color: var(--rmeez-gold) !important; color: #fff !important;
}
.qty-input input, .handle-counter input {
  text-align: center !important; border: 0 !important; background: none !important;
  font-weight: bold !important; color: var(--primaryColor) !important; width: 32px !important;
  font-size: 13px !important; padding: 0 !important;
}
/* Quantity on product card - compact */
[data-product-card] .qty-input, [data-product-card] .handle-counter {
  width: 100% !important; justify-content: space-between !important;
  border-radius: 30px !important; height: 36px !important;
  padding: 2px !important;
}
[data-product-card] .qty-input button, [data-product-card] .handle-counter button,
[data-product-card] .qty-input-btn {
  width: 26px !important; height: 26px !important; min-width: 26px !important;
}
@media (max-width: 768px) {
  [data-product-card] .qty-input, [data-product-card] .handle-counter {
    height: 34px !important;
  }
  [data-product-card] .qty-input button, [data-product-card] .handle-counter button,
  [data-product-card] .qty-input-btn {
    width: 24px !important; height: 24px !important; min-width: 24px !important;
  }
  [data-product-card] .qty-input input { width: 26px !important; font-size: 12px !important; }
}

/* Tabs */
.tabs-full-desc--reviews { border: 0 !important; }
.tabs-full-desc--reviews .nav-link {
  padding: 15px 20px !important; border: 0 !important; border-radius: 0 !important;
  color: #9f9f9f !important; background: rgba(227, 227, 227, 0.3) !important;
}
.tabs-full-desc--reviews .nav-link.active {
  background: var(--primaryColor) !important; color: #fff !important; font-weight: bold !important;
}

/* Accordion / Disclosure */
button[command="--toggle"], .accordion-button {
  background: #fbfbfb !important; border: 0 !important; border-radius: 0 !important;
  color: #000 !important; box-shadow: none !important;
}
button[command="--toggle"][aria-expanded="true"], .accordion-button:not(.collapsed) {
  background: var(--primaryColor) !important; color: #fff !important;
}
.accordion-item { border: 0 !important; background: #fbfbfb !important; }

/* === FEATURES / BENEFITS === */
.section-benefits { background: transparent !important; }
.section-benefits .benefit-card {
  background: transparent !important;
  color: #2d2d2d !important;
  border-radius: 20px !important;
  padding: 25px 20px !important;
  flex-direction: row !important;
  align-items: center !important;
  gap: 16px !important;
  text-align: start !important;
  width: 280px !important;
  flex-shrink: 0 !important;
  transition: all 0.3s ease !important;
  cursor: pointer !important;
}
.section-benefits .benefit-card:hover {
  background: #7d5cc7 !important;
}
.section-benefits .benefit-card:hover h3,
.section-benefits .benefit-card:hover p {
  color: #fff !important;
  font-weight: bold !important;
}
.section-benefits .benefit-card img {
  width: 60px !important; height: 60px !important;
  object-fit: contain !important;
  flex-shrink: 0 !important;
}
.section-benefits .benefit-card h3 {
  color: #2d2d2d !important; font-size: 16px !important; margin-bottom: 4px !important;
  transition: all 0.3s ease !important;
}
.section-benefits .benefit-card p {
  color: #666 !important; font-size: 12px !important;
  transition: all 0.3s ease !important;
}
@media (max-width: 768px) {
  .section-benefits .benefit-card {
    width: 100% !important;
    padding: 18px 14px !important;
  }
  .section-benefits .benefit-card img {
    width: 45px !important; height: 45px !important;
  }
  .section-benefits .benefit-card h3 { font-size: 14px !important; }
}

/* === SUBCATEGORY CARDS === */
.subcategory-card {
  width: 100% !important;
}
.subcategory-img-wrapper {
  width: 100% !important;
  aspect-ratio: 1/1 !important;
  border-radius: 16px !important;
  overflow: hidden !important;
  border: 2px solid #e2e0cb !important;
}
.subcategory-title {
  color: var(--primaryColor) !important;
  font-size: 14px !important;
  margin-top: 4px !important;
}
/* Subcategories carousel - 2 visible on mobile, 4 on desktop */
.section-subcategories .embla__slide,
section:has(.subcategory-card) .embla__slide {
  flex: 0 0 42% !important;
  max-width: 42% !important;
  padding: 0 6px !important;
}
.subcategory-img-wrapper {
  aspect-ratio: 1/1 !important;
}
@media (max-width: 767px) {
  .subcategory-card img {
    max-height: 120px !important;
  }
}
@media (min-width: 768px) {
  .section-subcategories .embla__slide,
  section:has(.subcategory-card) .embla__slide {
    flex: 0 0 25% !important;
    max-width: 25% !important;
  }
}

/* === CATEGORIES === */
.block-category { position: relative !important; overflow: hidden !important; }
.block-category img { transition: all .4s ease-in-out !important; }
.block-category:hover img { transform: scale(1.1) !important; }
.block-category .content {
  position: absolute !important; top: 0 !important; bottom: 0 !important;
  width: 100% !important; height: 100% !important; z-index: 2 !important;
  padding: 10px !important; background: rgba(0, 0, 0, 0.3) !important; color: #fff !important;
}
.block-category2 { text-align: center !important; }
.block-category2 .thumb img {
  width: 100% !important; height: 200px !important; object-fit: contain !important; border-radius: 21px !important;
}

/* === TESTIMONIALS === */
.section-testimonials article {
  height: 100% !important; border-radius: 17px !important;
  background: #fff var(--qots-url) no-repeat !important;
  background-position: top 15px right 15px !important;
  background-size: 30px !important;
  padding: 25px !important; border: 1px solid #e2e0cb !important;
  min-height: 180px !important;
}
[dir="rtl"] .section-testimonials article {
  background-position: top 15px left 15px !important;
}
.section-testimonials article .text-base { font-size: 13px !important; color: #474747 !important; line-height: 1.8 !important; }
.section-testimonials article h3 { font-size: 18px !important; font-weight: bold !important; color: #000 !important; margin-top: 8px !important; }
.text-warning { color: var(--primaryColor) !important; }
/* Testimonials mobile: center card */
@media (max-width: 768px) {
  .section-testimonials .embla__slide { flex: 0 0 90% !important; }
  .section-testimonials article { text-align: center !important; }
  .section-testimonials article .flex.items-center.gap-1 { justify-content: center !important; }
}

/* === PARTNERS === */
.section-partners {
  background: rgba(25, 25, 25, 0.04) !important;
  padding: 40px 0 !important;
}
.section-partners .embla__slide {
  padding-left: 10px !important;
}
.section-partners .embla__slide > div {
  width: auto !important; height: 200px !important;
  border: none !important;
  border-radius: 16px !important;
  background: transparent !important;
}
.section-partners .embla__slide img {
  height: 134px !important; width: auto !important; max-width: 302px !important;
  object-fit: contain !important;
}
@media (max-width: 768px) {
  .section-partners .embla__slide {
    padding-left: 2px !important;
    flex: 0 0 50% !important;
  }
  .section-partners .embla__slide > div {
    width: 100% !important; height: auto !important;
    padding: 10px !important;
  }
  .section-partners .embla__slide img {
    height: 100px !important; max-width: 100% !important;
  }
  .section-partners .embla__container {
    gap: 0 !important;
  }
}

/* === ARTICLES / BLOG === */
.block-article { color: #828282 !important; }
.block-article .thumb img { border-radius: 21px !important; }
.block-article .title a { color: #2d2d2d !important; }
.block-article .title a:hover { color: var(--primaryColor) !important; }
.block-article .read-more a { color: var(--rmeez-gold) !important; text-decoration: underline !important; }

/* === GALLERY === */
.block-gallery .thumb img { width: 100% !important; height: 260px !important; object-fit: contain !important; }
.block-gallery .title { text-align: center !important; margin-top: 10px !important; }
.block-gallery .title a { color: var(--primaryColor) !important; }
@media (max-width: 992px) { .block-gallery .thumb img { height: 160px !important; } }

/* Gallery section overlap */
.section.gallery-section { padding-top: 0 !important; margin-top: -200px !important; position: relative !important; z-index: 99 !important; }
@media (max-width: 992px) { .section.gallery-section { margin-top: -80px !important; } }

/* === COUNTDOWN === */
.countdown {
  background-color: #edf1f2 !important; color: #515759 !important; text-align: center !important;
  padding: 10px 5px !important; display: flex !important; border-radius: 8px !important;
  justify-content: center !important; align-items: center !important;
}
.countdown .time { font-weight: bold !important; }
.countdown .separator { margin: 0 10px !important; color: #d9d9d9 !important; }
@media (max-width: 992px) {
  .countdown { flex-wrap: wrap !important; }
  .countdown > *.separator { display: none !important; }
}

/* === SWIPER / CAROUSEL PAGINATION === */
.swiper-pagination-bullet { background: #cbcabe !important; border-radius: 50% !important; width: 10px !important; height: 10px !important; opacity: 1 !important; }
.swiper-pagination-bullet-active { background: var(--rmeez-gold) !important; width: 31px !important; border-radius: 8px !important; }
.embla__progress { background: #cbcabe !important; }
.embla__progress-bar { background: var(--rmeez-gold) !important; }

/* === FOOTER === */
footer, #footer {
  color: #fff !important;
  margin-top: 80px !important;
  background: transparent !important;
  padding: 0 !important;
  border: none !important;
  overflow: hidden !important;
  max-width: 100vw !important;
}
body[data-template="home"] footer, body[data-template="home"] #footer { margin-top: 40px !important; }

/* Wave: full width, cover, top-aligned */
.footer-wave {
  display: block !important;
  width: 100% !important;
  height: 100px !important;
  object-fit: cover !important;
  object-position: top !important;
  padding: 0 !important;
  margin: 0 0 -2px 0 !important;
  line-height: 0 !important;
  position: relative !important;
  z-index: 1 !important;
}

footer .inside-footer, #footer .inside-footer {
  background: #6e5ba4 !important;
  margin-top: -2px !important;
  position: relative !important;
  /* Full viewport width */
  width: 100vw !important;
  left: 50% !important;
  right: 50% !important;
  margin-left: -50vw !important;
  margin-right: -50vw !important;
  padding: 40px 16px !important;
}
@media (min-width: 768px) {
  footer .inside-footer, #footer .inside-footer {
    padding: 40px 64px !important;
  }
}
footer .logo-img { width: 90px !important; }
.footer-logo-img {
  width: 160px !important;
  height: auto !important;
  max-height: 80px !important;
}
.footer-logo-img {
  width: 160px !important;
  height: auto !important;
  max-height: 70px !important;
}
footer h2, footer h3 { color: #fff !important; margin-bottom: 20px !important; }
footer a { color: #fff !important; }
footer a:hover { color: var(--rmeez-gold) !important; background: none !important; }
footer p, footer span, footer li, footer div { color: #fff !important; }
footer svg { color: #fff !important; fill: #fff !important; }

/* Social links */
.footer-social-link {
  width: 36px !important; height: 36px !important;
  display: inline-flex !important; align-items: center !important; justify-content: center !important;
  border-radius: 50% !important; background: rgba(255, 255, 255, 0.15) !important;
  color: #fff !important; transition: all .3s ease !important;
}
.footer-social-link:hover { background: var(--rmeez-gold) !important; }

/* Contact icons (phone, email, vat) */
.footer-contact-icon {
  width: 40px !important; height: 40px !important;
  object-fit: contain !important;
  flex-shrink: 0 !important;
  filter: none !important;
}

/* Payment method icons in footer bottom */
.footer-payment-icon {
  height: 24px !important;
  max-width: 54px !important;
  object-fit: contain !important;
  border-radius: 2px !important;
  /* Don't invert payment icons - keep original colors */
  filter: none !important;
  opacity: 1 !important;
}

footer .border-t { border-color: rgba(255, 255, 255, 0.2) !important; }

/* Footer grid: 40% about + 60% links */
.footer-main-grid {
  display: flex !important;
  gap: 40px !important;
}
.footer-about {
  width: 40% !important;
  flex-shrink: 0 !important;
}
.footer-links {
  width: 60% !important;
}
.footer-links-grid {
  display: grid !important;
  grid-template-columns: repeat(3, 1fr) !important;
  gap: 24px !important;
}
/* Payment row */
.footer-payment-row {
  margin-top: 30px !important;
  padding-top: 20px !important;
  border-top: 1px solid rgba(255,255,255,0.15) !important;
}
/* Bottom bar */
.footer-bottom-bar {
  margin-top: 20px !important;
  padding-top: 20px !important;
  border-top: 1px solid rgba(255,255,255,0.15) !important;
}
@media (max-width: 768px) {
  .footer-main-grid {
    flex-direction: column !important;
    gap: 30px !important;
  }
  .footer-about {
    width: 100% !important;
  }
  .footer-links {
    width: 100% !important;
  }
  .footer-links-grid {
    grid-template-columns: repeat(2, 1fr) !important;
    gap: 20px !important;
  }
}

@media (max-width: 992px) {
  footer .inside-footer { padding: 20px 0 !important; }
  footer h3 { margin-bottom: 10px !important; }
}

/* === MOBILE DRAWER === */
#mobile-drawer {
  top: 0 !important;
}
#mobile-drawer el-dialog-panel,
#mobile-drawer [class*="dialog-panel"] {
  width: 280px !important;
  max-width: 75vw !important;
}

/* Background */
#mobile-drawer .bg-background,
#mobile-drawer [class*="bg-background"],
#mobile-drawer el-dialog-panel > div {
  background: var(--primaryColor) !important;
}

/* Drawer logo - big */
.drawer-logo {
  width: 160px !important;
  height: auto !important;
  max-height: 70px !important;
  filter: brightness(0) invert(1) !important;
}

/* All items same color (purple text on purple bg → white text) */
#mobile-drawer a,
#mobile-drawer button,
#mobile-drawer summary,
#mobile-drawer span,
#mobile-drawer .text-foreground,
#mobile-drawer .text-muted {
  color: #fff !important;
  border-color: rgba(255,255,255,0.15) !important;
}
#mobile-drawer svg { color: #fff !important; }

/* Hover - white bold text with subtle bg for ALL items */
#mobile-drawer a:hover,
#mobile-drawer button:hover,
#mobile-drawer summary:hover {
  background: rgba(255,255,255,0.12) !important;
  color: #fff !important;
  font-weight: bold !important;
}
/* Also ensure all non-hovered links are visible */
#mobile-drawer a,
#mobile-drawer button,
#mobile-drawer summary {
  background: transparent !important;
}
/* Open submenu */
#mobile-drawer details[open] > summary {
  background: rgba(255,255,255,0.2) !important;
  color: #fff !important;
}

/* Border between sections */
#mobile-drawer .border-border-light,
#mobile-drawer .border-t {
  border-color: rgba(255,255,255,0.15) !important;
}

/* === BREADCRUMB === */
.wrap-breadcrumb { padding: 20px 0 !important; margin-bottom: 20px !important; text-align: center !important; }
.wrap-breadcrumb h1 { font-size: 40px !important; margin-bottom: 10px !important; }
@media (max-width: 992px) { .wrap-breadcrumb h1 { font-size: 20px !important; } }
nav[aria-label] a, .breadcrumb a { color: #9CA3AF !important; }
nav[aria-label] a:hover { color: var(--primaryColor) !important; }

/* === SEARCH DIALOG === */
#search-dialog el-dialog-panel,
#search-dialog [class*="dialog-panel"] {
  border-bottom-left-radius: 20px !important;
  border-bottom-right-radius: 20px !important;
  box-shadow: 0 8px 30px rgba(0,0,0,0.12) !important;
}
#search-dialog .form-input-wrapper {
  border: 2px solid #e2e0cb !important;
  border-radius: 30px !important;
  background: #fff !important;
  padding: 8px 16px !important;
  transition: all .3s ease !important;
}
#search-dialog .form-input-wrapper:focus-within {
  border-color: var(--primaryColor) !important;
  box-shadow: 0 0 0 3px rgba(110,91,164,0.15) !important;
}
#search-dialog input {
  border: none !important;
  background: transparent !important;
  font-size: 16px !important;
  color: #333 !important;
}
/* Search results - smaller cards */
[data-search-products] {
  gap: 12px !important;
}
[data-search-products] > * {
  border: 2px solid #e2e0cb !important;
  border-radius: 12px !important;
  overflow: hidden !important;
  width: 160px !important;
  min-width: 160px !important;
  flex-shrink: 0 !important;
}
[data-search-products] > * .aspect-\[380\/420\],
[data-search-products] > * [class*="aspect-"] {
  aspect-ratio: 1/1 !important;
  max-height: 140px !important;
}
[data-search-products] > * img {
  height: 140px !important;
  object-fit: cover !important;
}
@media (max-width: 768px) {
  [data-search-products] > * {
    width: 130px !important;
    min-width: 130px !important;
  }
  [data-search-products] > * img {
    height: 110px !important;
  }
}

/* === FORMS === */
.form-input, .form-control,
input[type="text"], input[type="email"], input[type="tel"],
input[type="number"], input[type="search"], textarea, select {
  border-radius: 22px !important; border: 0 !important;
  background: #fff !important; color: #8b8b8b !important; box-shadow: none !important;
}
.form-input:focus, .form-control:focus, input:focus, textarea:focus, select:focus {
  background: #dcdbdb !important; outline: none !important;
}

/* === PAGINATION === */
.pagination .page-item .page-link { border-radius: 0 !important; }
.pagination .page-item.active .page-link { background: var(--primaryColor) !important; border-color: var(--primaryColor) !important; color: #fff !important; }

/* === CART PAGE === */
.title-section-summery { background: var(--primaryColor) !important; padding: 20px 0 !important; color: #fff !important; text-align: center !important; }
.inside-cart-bg { background: #fbfbfb !important; padding: 10px !important; }
.cart-product-row-wrapper { border: 0 !important; border-bottom: 1px solid #eee !important; padding-bottom: 10px !important; margin-bottom: 10px !important; }
.cart-product-row-wrapper img { border: 1px solid #eee !important; }

/* === ACCOUNT SIDEBAR === */
.block-side-menu { list-style: none !important; padding: 20px 10px !important; background: var(--primaryColor) !important; border-radius: 20px !important; }
.block-side-menu li a, .block-side-menu li button { background: none !important; border: 0 !important; display: block !important; padding: 10px !important; border-radius: 30px !important; color: #fff !important; }
.block-side-menu li:hover a, .block-side-menu li.active a { background: #fff !important; color: #000 !important; }

/* === SOCIAL SHARE === */
.product-social a { color: #737373 !important; }
.product-social a:hover { color: var(--primaryColor) !important; }

/* === STICKY CTA === */
#sticky-cta, [data-sticky-cta] { background: #FFFFFF !important; border-top: 1px solid #eee !important; }
/* Sticky bar buttons - same SVG treatment */
#sticky-cta .btn-filled, [data-sticky-cta] .btn-filled,
.sticky-product-actions .btn-filled {
  background-size: auto 102% !important;
  background-position: right center !important;
}

/* === HERO / CAROUSEL SLIDER === */
.section-hero, .section-carousel {
  border-radius: 0 !important;
  position: relative !important;
  overflow: hidden !important;
}
/* === HERO SLIDER === */
.section-hero-slider {
  display: flex !important; flex-direction: column !important;
}
.hero-slider {
  position: relative !important; width: 100% !important;
  flex: 1 1 auto !important; min-height: inherit !important;
}
.hero-slider-track {
  position: relative !important; width: 100% !important;
  height: 100% !important; min-height: inherit !important;
}
.hero-slide {
  position: relative !important; width: 100% !important;
  display: flex !important; align-items: center !important;
  min-height: inherit !important;
  transition: opacity 0.6s ease !important;
  opacity: 1 !important;
}
.hero-slide-hidden {
  position: absolute !important; top: 0 !important; left: 0 !important;
  opacity: 0 !important; pointer-events: none !important;
}
/* Hero slider arrows */
.hero-slider-prev, .hero-slider-next {
  position: absolute !important; top: 50% !important; transform: translateY(-50%) !important;
  z-index: 20 !important; background: rgba(255,255,255,0.8) !important;
  border: none !important; border-radius: 50% !important;
  width: 44px !important; height: 44px !important;
  display: flex !important; align-items: center !important; justify-content: center !important;
  cursor: pointer !important; color: var(--primaryColor) !important;
  transition: all 0.3s ease !important;
}
.hero-slider-prev:hover, .hero-slider-next:hover {
  background: var(--primaryColor) !important; color: #fff !important;
}
.hero-slider-prev { left: 16px !important; }
.hero-slider-next { right: 16px !important; }
@media (max-width: 768px) {
  .hero-slider-prev, .hero-slider-next {
    width: 34px !important; height: 34px !important;
  }
  .hero-slider-prev { left: 8px !important; }
  .hero-slider-next { right: 8px !important; }
}
/* Hero slider dots */
.hero-slider-dots {
  position: absolute !important; bottom: 20px !important;
  left: 50% !important; transform: translateX(-50%) !important;
  z-index: 20 !important; display: flex !important; gap: 8px !important;
}
.hero-dot {
  width: 10px !important; height: 10px !important;
  border-radius: 50% !important; border: none !important;
  background: rgba(255,255,255,0.5) !important;
  cursor: pointer !important; transition: all 0.3s ease !important;
  padding: 0 !important;
}
.hero-dot-active {
  background: var(--rmeez-gold) !important; width: 30px !important;
  border-radius: 8px !important;
}
/* Carousel section - respect schema settings, don't override */
.section-carousel .embla__slide img.h-full.w-full {
  height: 100% !important;
  width: 100% !important;
  object-fit: cover !important;
}

/* Product carousel arrows - visible on all screens */
.products-embla__prev, .products-embla__next {
  background: var(--primaryColor) !important; color: #fff !important;
  border-radius: 50% !important; border: 2px solid var(--primaryColor) !important;
  width: 38px !important; height: 38px !important;
  display: flex !important; align-items: center !important; justify-content: center !important;
  cursor: pointer !important; transition: all 0.2s ease !important;
  padding: 0 !important;
}
.products-embla__prev:hover, .products-embla__next:hover {
  background: var(--rmeez-gold) !important; border-color: var(--rmeez-gold) !important;
}
.products-embla__prev:disabled, .products-embla__next:disabled {
  opacity: 0.3 !important;
}
.products-embla__prev svg, .products-embla__next svg {
  width: 18px !important; height: 18px !important;
}
/* Content on top of background with proper padding */
.section-hero .theme-container,
.embla__slide > div:not(:first-child) {
  position: relative !important;
  z-index: 2 !important;
  padding-inline: 64px !important;
}
@media (max-width: 768px) {
  .section-hero .theme-container,
  .embla__slide > div:not(:first-child) {
    padding-inline: 24px !important;
  }
}
/* Carousel navigation */
.embla__slide { position: relative !important; }
/* Hero/slider text - no shadow */
.section-hero h1, .section-hero h2, .section-hero p,
.section-hero span, .section-hero .text-foreground,
.embla__slide h2, .embla__slide p,
.embla__slide span, .embla__slide .text-foreground {
  color: #000000 !important;
  text-shadow: 0 1px 4px rgba(0, 0, 0, 0.0) !important;
}
/* Don't show title decoration in hero/slider */
.section-hero h2 span, .section-carousel h2 span {
  background: none !important;
  padding: 0 !important;
}

/* === LOYALTY === */
.loyalty-points-products-section { border: 0 !important; border-radius: 0 !important; background: #FFF !important; }

/* === SCROLLBAR === */
::-webkit-scrollbar { width: 6px; height: 6px; }
::-webkit-scrollbar-track { background: var(--rmeez-cream); }
::-webkit-scrollbar-thumb { background: #6E5BA4; border-radius: 3px; }
::-webkit-scrollbar-thumb:hover { background: #5D4B8E; }

/* === GRID === */
[data-grid-root] { grid-template-columns: repeat(var(--cols-mobile, 2), 1fr) !important; }
@media (min-width: 1024px) { [data-grid-root] { grid-template-columns: repeat(var(--cols-desktop, 4), 1fr) !important; } }

/* === WISHLIST BUTTON === */
[data-wishlist-btn] {
  background: rgba(255, 255, 255, 0.85) !important;
  border: none !important;
  border-radius: 50% !important;
  width: 40px !important; height: 40px !important;
  min-width: 40px !important; min-height: 40px !important;
  max-width: 40px !important; max-height: 40px !important;
  padding: 0 !important;
  display: inline-flex !important; align-items: center !important; justify-content: center !important;
  box-shadow: 0 2px 8px rgba(0,0,0,0.12) !important;
  transition: all .3s ease !important;
  color: var(--primaryColor) !important;
  backdrop-filter: blur(4px) !important;
  -webkit-backdrop-filter: blur(4px) !important;
  z-index: 10 !important;
}
[data-wishlist-btn] svg {
  width: 20px !important; height: 20px !important;
}
[data-wishlist-btn]:hover {
  background: var(--primaryColor) !important;
  color: #fff !important;
  box-shadow: 0 4px 12px rgba(110, 91, 164, 0.4) !important;
}
[data-wishlist-btn].active,
[data-wishlist-btn][data-wishlisted="true"] {
  color: var(--rmeez-coral) !important;
  background: #fff !important;
}
[data-wishlist-btn].active svg,
[data-wishlist-btn][data-wishlisted="true"] svg {
  fill: var(--rmeez-coral) !important;
}
/* Hide wishlist button on product cards */
[data-product-card] [data-wishlist-btn] {
  display: none !important;
}
/* Wishlist positioning (if re-enabled) */
[data-product-card] [data-wishlist-btn-placeholder] {
  position: absolute !important;
  bottom: 12px !important;
  left: 12px !important;
  right: auto !important;
  z-index: 10 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
}
[data-product-card] [data-wishlist-btn] svg {
  width: 18px !important; height: 18px !important;
  margin: auto !important;
}

/* === TEXT COLORS - darker for readability === */
.text-muted-foreground,
.section-about .text-muted-foreground,
section[section-id] .text-muted-foreground {
  color: #4a4a4a !important;
  font-size: 15px !important;
}

/* === ARTICLES SECTION === */
.section-articles { background: var(--rmeez-cream) !important; }
.section-articles .flex.h-full h3 { font-size: 18px !important; font-weight: bold !important; color: #2d2d2d !important; }
.section-articles .flex.h-full h3 a { color: #2d2d2d !important; }
.section-articles .flex.h-full h3 a:hover { color: var(--primaryColor) !important; }
.section-articles .text-muted-foreground,
.section-articles p.text-sm { color: #555 !important; font-size: 14px !important; line-height: 1.8 !important; }
.section-articles .read-more-link {
  color: var(--rmeez-gold) !important;
  font-weight: bold !important;
  text-decoration: none !important;
  display: inline !important;
  position: relative !important;
  font-size: 14px !important;
}
.section-articles .read-more-link:hover { opacity: 0.8 !important; }
.section-articles .read-more-link img {
  width: 28px !important; height: 28px !important;
  position: absolute !important;
  bottom: -6px !important;
  right: -4px !important;
  z-index: -1 !important;
}
[dir="ltr"] .section-articles .read-more-link img {
  right: auto !important;
  left: -4px !important;
}

/* === PRODUCTS-FEATURED - fix price color === */
.section-products-featured [data-product-card] .product-price,
.section-products-featured [data-product-card] .font-semibold {
  color: var(--rmeez-coral) !important;
}
.section-products-featured .section-title {
  font-size: calc(22px + 1vw) !important;
  color: #ed6e4a !important;
}

/* === PARTNERS - navigation arrows === */
.section-partners .partner-nav {
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
}
.section-partners .partner-nav button {
  width: 40px !important; height: 40px !important;
  border-radius: 50% !important;
  border: 2px solid #e2e0cb !important;
  background: #fff !important;
  color: #6e5ba4 !important;
  display: flex !important; align-items: center !important; justify-content: center !important;
  cursor: pointer !important;
}
.section-partners .partner-nav button:hover {
  background: var(--primaryColor) !important; color: #fff !important; border-color: var(--primaryColor) !important;
}

/* === PRODUCTS WITH BANNER LAYOUT === */
.products-with-banner {
  display: flex !important;
  gap: 20px !important;
  align-items: stretch !important;
}
.products-with-banner .banner-side {
  flex-shrink: 0 !important;
  border-radius: 16px !important;
  overflow: hidden !important;
}
.products-with-banner .banner-side a { display: block !important; height: 100% !important; }
.products-with-banner .banner-side img {
  width: 100% !important; height: 100% !important;
  object-fit: cover !important; border-radius: 16px !important;
}
.products-with-banner .banner-side-small { width: 220px !important; }
.products-with-banner .banner-side-large { width: 28% !important; }
.products-with-banner .products-area { flex: 1 !important; min-width: 0 !important; overflow: hidden !important; }
/* Banner carousel slides */
.banner-carousel-wrapper { position: relative !important; height: 100% !important; }
.banner-carousel-wrapper .banner-slide { height: 100% !important; }
.banner-carousel-wrapper .banner-slide a { display: block !important; height: 100% !important; }
.banner-carousel-wrapper .banner-slide img { width: 100% !important; height: 100% !important; object-fit: cover !important; border-radius: 16px !important; }
@media (max-width: 1023px) {
  .products-with-banner { flex-direction: column !important; }
  .products-with-banner .banner-side-small,
  .products-with-banner .banner-side-large { width: 100% !important; max-height: none !important; }
  .products-with-banner .banner-side img { max-height: none !important; width: 100% !important; object-fit: cover !important; border-radius: 16px !important; }
  .products-with-banner .banner-side.hide-mobile { display: none !important; }
}

/* === MOBILE RESPONSIVE FIXES === */
@media (max-width: 768px) {
  /* Product card - reduce spacing, hide rating */
  [data-product-card] > div:nth-child(2), [data-product-card] .flex.flex-1 {
    padding: 6px 6px 2px !important;
    gap: 1px !important;
  }
  /* Rating stars already hidden globally */
  [data-product-card] h3 { height: 32px !important; font-size: 12px !important; margin-bottom: 0px !important; }
  [data-product-card] .mt-auto { padding: 0 6px 6px !important; margin-top: 0px !important; }
  /* Product card image on mobile */
  [data-product-card] > a:first-child img { aspect-ratio: 1/1 !important; }
  /* Category badge smaller on mobile */
  [data-product-card] .category-badge { font-size: 9px !important; padding: 2px 10px !important; margin-bottom: 4px !important; }
  /* Price on mobile */
  [data-product-card] .product-price,
  [data-product-card] .font-semibold { font-size: 14px !important; }
  /* Button on mobile - compact */
  [data-product-card] .btn:not([data-wishlist-btn]) { font-size: 11px !important; padding: 4px 28px 4px 10px !important; min-height: auto !important; height: 30px !important; text-align: left !important; background-size: auto 100% !important; }
  /* Products carousel - 2 cards per row on mobile */
  .products-embla { --slide-size: 50% !important; }
  /* Sections padding on mobile */
  section[section-id] { padding: 20px 10px !important; }
  /* Title smaller on mobile */
  .section-title,
  section[section-id] h2,
  .section-products h2, .section-testimonials h2, .section-categories h2,
  .section-partners h2, .theme-container > h2 {
    font-size: calc(17px + 1vw) !important;
  }
  /* Title icon smaller on mobile */
  .section-title span,
  section[section-id] h2 span {
    background-size: 40px !important;
  }
}

/* === VIDEO SECTION - full width edge to edge === */
.section-video {
  background: transparent !important;
  padding: 0 !important;
  margin: 0 !important;
  max-width: 100vw !important;
  overflow: hidden !important;
}
.section-video .video-wrapper {
  padding: 0 !important;
  margin: 0 !important;
  max-width: none !important;
  width: 100% !important;
}
.section-video video {
  border-radius: 0 !important;
  max-height: none !important;
  width: 100% !important;
}
.section-video .video-overlay {
  border-radius: 0 !important;
}

/* === CATEGORIES - no bg color, title close under image === */
.section-categories {
  margin-top: -200px !important;
  position: relative !important;
  z-index: 99 !important;
  padding-top: 0 !important;
}
@media (max-width: 992px) {
  .section-categories { margin-top: -80px !important; }
}
/* Desktop: 4 categories grid, no carousel behavior */
@media (min-width: 769px) {
  .section-categories .embla__container {
    display: flex !important;
    flex-wrap: nowrap !important;
  }
  .section-categories .embla__slide {
    flex: 0 0 25% !important;
  }
  .section-categories .embla__viewport {
    overflow: visible !important;
  }
  /* Hide ALL controls on desktop */
  .section-categories .embla__progress,
  .section-categories .embla__prev,
  .section-categories .embla__next,
  .section-categories .embla-wrapper > .flex.items-center.gap-2 {
    display: none !important;
  }
}
.section-categories .embla__slide .group,
.section-categories .embla__slide a.group {
  gap: 5px !important;
}
.section-categories .embla__slide .overflow-hidden.rounded,
.section-categories .embla__slide .bg-secondary {
  background: transparent !important;
  border: none !important;
}
/* Remove the white overlay on category images */
.section-categories .embla__slide .absolute.inset-0.bg-white\/10,
.section-categories .embla__slide .pointer-events-none {
  display: none !important;
}
.section-categories .embla__slide img {
  border: none !important;
  border-radius: 16px !important;
}
.section-categories .embla__slide h3 {
  margin-top: 0 !important;
  font-size: 19px !important;
  font-weight: bold !important;
  text-align: center !important;
  color: #2d2d2d !important;
}
@media (max-width: 768px) {
  /* Categories: 2-column grid on mobile instead of carousel */
  .section-categories .embla__container {
    display: flex !important;
    flex-wrap: wrap !important;
    margin-inline-start: 0 !important;
    gap: 12px !important;
  }
  .section-categories .embla__slide {
    flex: 0 0 calc(50% - 6px) !important;
    padding-inline-start: 0 !important;
  }
  .section-categories .embla__viewport {
    overflow: visible !important;
  }
  .section-categories .embla__slide img {
    aspect-ratio: 3/4 !important;
  }
  .section-categories .embla__slide h3 {
    font-size: 13px !important;
  }
  /* Hide ALL carousel controls on mobile */
  .section-categories .embla-wrapper > .flex.items-center.gap-2,
  .section-categories .embla__progress,
  .section-categories .embla__prev,
  .section-categories .embla__next {
    display: none !important;
  }
}

/* === ABOUT SECTION - normal rectangle image === */
.section-about .overflow-hidden.rounded-xl,
.section-about .about-image-wrapper {
  border-radius: 16px !important;
}

/* === CATEGORY PAGE - hide duplicate title below breadcrumb === */
[data-template="category"] section:has(nav[aria-label]) + section:has([data-subcategories-carousel]) h2 {
  display: none !important;
}
/* Also hide via wrap-breadcrumb h1 if present */
[data-template="category"] .wrap-breadcrumb h1 {
  display: none !important;
}

/* === CATEGORY PAGE - subcategory image border hidden === */
.subcategory-img-wrapper,
section:has(.subcategory-card) img,
[class*="category"] img {
  border: none !important;
}
/* Subcategories: remove gap between title and images, 8px margin above title */
[data-subcategories-carousel] > .flex.items-center.justify-between {
  margin-top: 8px !important;
  margin-bottom: 0 !important;
}
[data-subcategories-carousel] {
  gap: 8px !important;
}

/* === SHIPPING/CHECKOUT PAGE - headings visible === */
[data-template="checkout"] h2,
[data-template="checkout"] h3,
[data-template="cart"] h2,
[data-template="cart"] h3,
[data-template="shipping_payment"] h1,
[data-template="shipping_payment"] h2,
[data-template="shipping_payment"] h3,
.checkout-section h2, .checkout-section h3 {
  color: #2d2d2d !important;
}
/* Shipping/Payment accordion text visible */
[data-template="shipping_payment"] button[command="--toggle"] span,
[data-template="shipping_payment"] .bg-secondary span {
  color: #2d2d2d !important;
}
/* All labels, inputs, text on shipping page - exclude footer */
[data-template="shipping_payment"] main label,
[data-template="shipping_payment"] main input,
[data-template="shipping_payment"] main select,
[data-template="shipping_payment"] main textarea,
[data-template="shipping_payment"] main .text-foreground,
[data-template="shipping_payment"] main .text-muted-foreground,
[data-template="shipping_payment"] main div,
[data-template="shipping_payment"] main p,
[data-template="shipping_payment"] main span:not(button span) {
  color: #2d2d2d !important;
}
/* Same for checkout and cart pages */
[data-template="checkout"] main div,
[data-template="checkout"] main p,
[data-template="checkout"] main span:not(button span),
[data-template="checkout"] main label,
[data-template="cart"] main div,
[data-template="cart"] main p,
[data-template="cart"] main span:not(button span),
[data-template="cart"] main label {
  color: #2d2d2d !important;
}
/* Payment method icons */
[data-template="shipping_payment"] .border-border-light img,
[data-template="shipping_payment"] .flex.flex-wrap img {
  max-height: 30px !important;
  width: auto !important;
  object-fit: contain !important;
}
/* Hide raw JSON/object text from third-party payment apps */
[data-template="shipping_payment"] main {
  overflow-wrap: break-word !important;
}
/* Shipping/Payment page description text - scoped to main */
[data-template="shipping_payment"] main p,
[data-template="shipping_payment"] main td,
[data-template="shipping_payment"] main th {
  color: #4a4a4a !important;
}

/* === CART TOAST NOTIFICATION === */
.cart-toast-overlay {
  position: fixed !important; inset: 0 !important;
  background: rgba(0,0,0,0.35) !important;
  z-index: 99998 !important;
  animation: toastFadeIn 0.2s ease-out !important;
}
.cart-toast {
  position: fixed !important;
  top: 50% !important; left: 50% !important;
  transform: translate(-50%, -50%) !important;
  z-index: 99999 !important;
  background: #fff !important;
  border-radius: 20px !important;
  padding: 28px 32px !important;
  box-shadow: 0 12px 40px rgba(0,0,0,0.18) !important;
  display: flex !important; flex-direction: column !important;
  align-items: center !important; text-align: center !important;
  gap: 16px !important;
  animation: toastPop 0.3s ease-out !important;
  width: 340px !important; max-width: 92vw !important;
}
.cart-toast .toast-close {
  position: absolute !important; top: 12px !important; left: 12px !important;
  background: none !important; border: none !important;
  cursor: pointer !important; padding: 4px !important;
  color: #999 !important; transition: color 0.2s !important;
  line-height: 1 !important;
}
.cart-toast .toast-close:hover { color: #333 !important; }
.cart-toast .toast-icon {
  width: 52px !important; height: 52px !important;
  background: #f0ebff !important; border-radius: 50% !important;
  display: flex !important; align-items: center !important;
  justify-content: center !important;
}
.cart-toast .toast-icon svg { width: 26px !important; height: 26px !important; }
.cart-toast .toast-msg {
  color: #333 !important; font-size: 16px !important;
  font-weight: bold !important; margin: 0 !important;
}
.cart-toast .toast-buttons {
  display: flex !important; flex-direction: column !important;
  gap: 10px !important; width: 100% !important;
}
.cart-toast .toast-btn-cart {
  color: #fff !important; font-weight: bold !important;
  text-decoration: none !important;
  background: var(--primaryColor) !important;
  padding: 12px 24px !important; border-radius: 30px !important;
  display: block !important; width: 100% !important;
  font-size: 14px !important; border: none !important;
  cursor: pointer !important; transition: all 0.2s !important;
}
.cart-toast .toast-btn-cart:hover {
  background: var(--rmeez-gold) !important;
}
.cart-toast .toast-btn-continue {
  color: var(--primaryColor) !important; font-weight: bold !important;
  text-decoration: none !important;
  background: transparent !important;
  padding: 10px 24px !important; border-radius: 30px !important;
  display: block !important; width: 100% !important;
  font-size: 13px !important;
  border: 2px solid var(--primaryColor) !important;
  cursor: pointer !important; transition: all 0.2s !important;
}
.cart-toast .toast-btn-continue:hover {
  background: #f0ebff !important;
}
@media (max-width: 768px) {
  .cart-toast {
    width: 300px !important; padding: 24px 20px !important;
  }
  .cart-toast .toast-btn-cart,
  .cart-toast .toast-btn-continue {
    padding: 10px 16px !important; font-size: 13px !important;
  }
}
@keyframes toastPop {
  from { transform: translate(-50%, -50%) scale(0.85); opacity: 0; }
  to { transform: translate(-50%, -50%) scale(1); opacity: 1; }
}
@keyframes toastFadeIn {
  from { opacity: 0; } to { opacity: 1; }
}

/* === MERCHANT BADGE - right side, each type keeps its own color === */
[data-product-card] .merchant-badge-container {
  z-index: 99 !important;
  right: 12px !important;
  left: auto !important;
}
[data-product-card] .merchant-badge-container span {
  font-size: 11px !important;
  font-weight: bold !important;
  padding: 1px 3px !important;
  border-radius: 20px !important;
}
[data-product-card] .merchant-badge-container svg {
  display: none !important;
}

/* === PRODUCT IMAGE HOVER - pan effect === */
[data-product-card] > a:first-child:hover img {
  transform: scale(1.08) translateX(-3%) !important;
}

/* === PRODUCTS BANNER widths === */
.products-with-banner .banner-side-small { width: 25% !important; }
.products-with-banner .banner-side-large { width: 50% !important; }