/* AYRA — first-paint loading screen */
html:not(.ayra-page-ready)::before,
html:not(.ayra-page-ready)::after {
  content: "";
  position: fixed;
  z-index: 2147483647;
  pointer-events: none;
}
html:not(.ayra-page-ready)::before {
  inset: 0;
  width: 100vw;
  min-width: 100vw;
  height: 100vh;
  height: 100svh;
  height: 100dvh;
  min-height: 100vh;
  min-height: 100dvh;
  background:
    linear-gradient(#171614 0 0) calc(50% - 52px) calc(50% + 52px) / 28px 1px no-repeat,
    linear-gradient(rgba(23, 22, 20, .18) 0 0) center calc(50% + 52px) / 76px 1px no-repeat,
    #f3f0eb;
  animation: ayra-loader-bar 1s cubic-bezier(.65,0,.35,1) infinite;
}

html:not(.ayra-page-ready),
html:not(.ayra-page-ready) body {
  overflow: hidden !important;
  overscroll-behavior: none;
  background: #f3f0eb !important;
}

html:not(.ayra-page-ready)::after {
  top: 50%;
  left: 50%;
  width: clamp(138px, 18vw, 168px);
  height: 58px;
  background: url("https://media.zid.store/cdn-cgi/image/w=400,q=95,f=auto/https://media.zid.store/0eb24a33-8aa3-4466-92a8-85156e60070b/8eca7d57-4d94-43df-b5aa-3d2fa1af2442-200x.png") center / contain no-repeat;
  transform: translate(-50%, -50%);
  animation: ayra-loader-logo .8s cubic-bezier(.22,.8,.3,1) both;
}

html.ayra-page-ready::before,
html.ayra-page-ready::after {
  opacity: 0;
  visibility: hidden;
  transition: opacity .4s ease, visibility .4s ease;
}

@keyframes ayra-loader-logo {
  from { opacity: .4; transform: translate(-50%, calc(-50% + 6px)) scale(.985); }
  to { opacity: 1; transform: translate(-50%, -50%) scale(1); }
}

@keyframes ayra-loader-bar {
  from {
    background-position:
      calc(50% - 52px) calc(50% + 52px),
      center calc(50% + 52px),
      0 0;
  }
  to {
    background-position:
      calc(50% + 52px) calc(50% + 52px),
      center calc(50% + 52px),
      0 0;
  }
}


@media (prefers-reduced-motion: reduce) {
  html:not(.ayra-page-ready)::before,
  html:not(.ayra-page-ready)::after { animation: none; }
}

/* AYRA — Growth theme custom layer
   Scoped to verified AYRA hooks and product-page hooks. */

:root {
  --ayra-ink: #171614;
  --ayra-muted: #6f6a64;
  --ayra-paper: #fbfaf8;
  --ayra-warm: #f3f0eb;
  --ayra-line: #ded9d2;
  --ayra-content: 1440px;
}

/* =========================================================
   AYRA HEADER ONLY — scoped implementation
   Do not place non-header rules in this block.
   ========================================================= */
.ayra-site-header {
  --ayra-header-ink: #171614;
  --ayra-header-bg: rgba(250, 248, 245, .96);
  --ayra-header-line: rgba(23, 22, 20, .12);
  position: relative !important;
  z-index: 100 !important;
  width: 100% !important;
  min-height: 82px !important;
  padding: 0 clamp(20px, 3.5vw, 64px) !important;
  color: var(--ayra-header-ink) !important;
  background: var(--ayra-header-bg) !important;
  border-block-end: 1px solid var(--ayra-header-line) !important;
  box-shadow: none !important;
  backdrop-filter: blur(12px);
}

.ayra-site-header > nav {
  display: grid !important;
  grid-template-columns: auto minmax(0, 1fr) auto !important;
  width: 100% !important;
  max-width: 1800px !important;
  min-height: 82px !important;
  margin-inline: auto !important;
  align-items: center !important;
  gap: clamp(24px, 3vw, 54px) !important;
}

.ayra-site-header > nav > div.flex.items-center {
  display: contents !important;
}

.ayra-site-header > nav > div.flex.items-center > a[aria-label="Home"] {
  position: static !important;
  grid-column: 1 !important;
  display: block !important;
  width: clamp(104px, 9vw, 144px) !important;
  height: auto !important;
  margin: 0 !important;
  padding: 0 !important;
  transform: none !important;
}

.ayra-site-header > nav > div.flex.items-center > a[aria-label="Home"] img[alt="AYRA"] {
  position: static !important;
  display: block !important;
  width: 100% !important;
  height: auto !important;
  max-height: 48px !important;
  margin: 0 !important;
  visibility: visible !important;
  opacity: 1 !important;
  transform: none !important;
  object-fit: contain !important;
}

.ayra-site-header > nav > div.flex.items-center > ul {
  grid-column: 2 !important;
  display: flex !important;
  min-width: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  align-items: center !important;
  justify-content: flex-start !important;
  gap: clamp(24px, 2.8vw, 48px) !important;
}

.ayra-site-header > nav > div.flex.items-center > ul > li {
  flex: 0 0 auto !important;
}

.ayra-site-header > nav > div.flex.items-center > ul a,
.ayra-site-header > nav > div.flex.items-center > ul button {
  position: relative !important;
  display: inline-flex !important;
  min-height: 42px !important;
  padding: 8px 0 !important;
  align-items: center !important;
  color: var(--ayra-header-ink) !important;
  font-size: 14px !important;
  font-weight: 500 !important;
  line-height: 1 !important;
  text-decoration: none !important;
  background: transparent !important;
}

.ayra-site-header > nav > div.flex.items-center > ul a::after,
.ayra-site-header > nav > div.flex.items-center > ul button::after {
  content: "";
  position: absolute;
  inset-inline: 0;
  inset-block-end: 2px;
  height: 1px;
  background: currentColor;
  transform: scaleX(0);
  transition: transform .2s ease;
}

.ayra-site-header > nav > div.flex.items-center > ul a:hover::after,
.ayra-site-header > nav > div.flex.items-center > ul button:hover::after {
  transform: scaleX(1);
}

.ayra-site-header > nav > ul:has([data-search-trigger]) {
  grid-column: 3 !important;
  position: static !important;
  display: flex !important;
  width: auto !important;
  min-width: 0 !important;
  height: auto !important;
  margin: 0 !important;
  padding: 0 !important;
  flex-flow: row nowrap !important;
  align-items: center !important;
  justify-content: flex-end !important;
  gap: 8px !important;
  transform: none !important;
}

.ayra-site-header > nav > ul:has([data-search-trigger]) > li {
  position: static !important;
  display: flex !important;
  width: auto !important;
  min-width: 0 !important;
  height: auto !important;
  margin: 0 !important;
  padding: 0 !important;
  align-items: center !important;
}

.ayra-site-header > nav > ul:has([data-search-trigger]) button,
.ayra-site-header > nav > ul:has([data-search-trigger]) a {
  position: static !important;
  display: flex !important;
  width: 42px !important;
  min-width: 42px !important;
  height: 42px !important;
  min-height: 42px !important;
  margin: 0 !important;
  padding: 9px !important;
  align-items: center !important;
  justify-content: center !important;
  color: var(--ayra-header-ink) !important;
  background: transparent !important;
  border: 0 !important;
  border-radius: 999px !important;
  transform: none !important;
}

.ayra-site-header > nav > ul:has([data-search-trigger]) > li:first-child > button[data-search-trigger] {
  position: relative !important;
  width: clamp(230px, 29vw, 480px) !important;
  justify-content: flex-end !important;
  padding-inline: 18px !important;
  background: rgba(255, 255, 255, .92) !important;
  border: 1px solid var(--ayra-header-line) !important;
}

.ayra-site-header > nav > ul:has([data-search-trigger]) > li:first-child > button[data-search-trigger]::before {
  content: "Search";
  position: absolute;
  inset-inline-start: 18px;
  color: #77736e;
  font-size: 15px;
  font-weight: 400;
}

html[dir="rtl"] .ayra-site-header > nav > ul:has([data-search-trigger]) > li:first-child > button[data-search-trigger]::before,
html[lang^="ar"] .ayra-site-header > nav > ul:has([data-search-trigger]) > li:first-child > button[data-search-trigger]::before {
  content: "بحث" !important;
}

.ayra-site-header > nav > ul:has([data-search-trigger]) svg {
  width: 23px !important;
  height: 23px !important;
}

.ayra-site-header > nav button[aria-label="Toggle menu"] {
  position: static !important;
  display: none !important;
  width: 42px !important;
  height: 42px !important;
  margin: 0 !important;
  padding: 9px !important;
  transform: none !important;
}

@media (max-width: 1199px) {
  .ayra-site-header {
    min-height: 116px !important;
    padding-inline: 16px !important;
  }

  .ayra-site-header > nav {
    grid-template-columns: auto minmax(100px, 1fr) auto !important;
    grid-template-rows: 64px 52px !important;
    min-height: 116px !important;
    gap: 0 14px !important;
  }

  .ayra-site-header > nav > div.flex.items-center > a[aria-label="Home"] {
    grid-column: 1 !important;
    grid-row: 1 !important;
    width: 98px !important;
  }

  .ayra-site-header > nav > ul:has([data-search-trigger]) {
    grid-column: 2 / 4 !important;
    grid-row: 1 !important;
  }

  .ayra-site-header > nav > ul:has([data-search-trigger]) > li:first-child {
    flex: 1 1 auto !important;
  }

  .ayra-site-header > nav > ul:has([data-search-trigger]) > li:first-child > button[data-search-trigger] {
    width: 100% !important;
    max-width: none !important;
  }

  .ayra-site-header > nav > div.flex.items-center > ul {
    grid-column: 1 / 4 !important;
    grid-row: 2 !important;
    width: 100% !important;
    overflow-x: auto !important;
    justify-content: center !important;
    gap: clamp(24px, 8vw, 72px) !important;
    scrollbar-width: none;
  }

  .ayra-site-header > nav > div.flex.items-center > ul::-webkit-scrollbar {
    display: none;
  }
}

/* AYRA — final mobile testimonial carousel authority */
@media (max-width: 767px) {
  body[data-template="home"] .section-testimonials {
    overflow: hidden !important;
    padding-inline: 0 !important;
  }

  body[data-template="home"] .section-testimonials .embla,
  body[data-template="home"] .section-testimonials .embla__viewport {
    width: 100% !important;
    max-width: 100% !important;
    overflow-x: auto !important;
    overflow-y: visible !important;
    scroll-snap-type: x mandatory !important;
    scroll-behavior: smooth !important;
    scrollbar-width: none;
  }

  body[data-template="home"] .section-testimonials .embla__viewport {
    padding: 8px 9vw 20px !important;
  }

  body[data-template="home"] .section-testimonials .embla__container {
    display: flex !important;
    grid-template-columns: none !important;
    width: max-content !important;
    min-width: 100% !important;
    max-width: none !important;
    gap: 14px !important;
    overflow: visible !important;
    transform: none !important;
    touch-action: pan-x !important;
  }

  body[data-template="home"] .section-testimonials .embla__slide {
    display: block !important;
    width: min(82vw, 340px) !important;
    min-width: min(82vw, 340px) !important;
    max-width: 340px !important;
    height: 200px !important;
    min-height: 200px !important;
    flex: 0 0 min(82vw, 340px) !important;
    padding: 0 !important;
    scroll-snap-align: center !important;
  }

  body[data-template="home"] .section-testimonials article,
  body[data-template="home"] .section-testimonials .ayra-testimonial-card {
    position: relative !important;
    width: 100% !important;
    height: 200px !important;
    min-height: 200px !important;
    padding: 30px 24px 24px !important;
    gap: 12px !important;
    background: linear-gradient(145deg, #fbfaf8, #f1ede7) !important;
    border: 1px solid rgba(184, 154, 106, .24) !important;
    border-radius: 18px !important;
    box-shadow: 0 16px 38px rgba(34, 27, 21, .13) !important;
  }
}

/* AYRA — polished mobile testimonials carousel */
@media (max-width: 767px) {
  body[data-template="home"] .section-testimonials {
    overflow: hidden !important;
    padding-inline: 0 !important;
  }

  body[data-template="home"] .section-testimonials h2 {
    padding-inline: 20px !important;
    margin-block-end: 24px !important;
    font-size: 23px !important;
    letter-spacing: -.02em;
  }

  body[data-template="home"] .section-testimonials .embla,
  body[data-template="home"] .section-testimonials .embla__viewport {
    width: 100% !important;
    max-width: 100% !important;
    overflow-x: auto !important;
    overflow-y: visible !important;
    scroll-snap-type: x mandatory !important;
    scroll-behavior: smooth;
    scrollbar-width: none;
    -webkit-overflow-scrolling: touch;
  }

  body[data-template="home"] .section-testimonials .embla__viewport {
    padding: 8px 9vw 20px !important;
  }

  body[data-template="home"] .section-testimonials .embla__viewport::-webkit-scrollbar {
    display: none;
  }

  body[data-template="home"] .section-testimonials .embla__container {
    display: flex !important;
    grid-template-columns: none !important;
    width: max-content !important;
    min-width: 100% !important;
    max-width: none !important;
    gap: 14px !important;
    overflow: visible !important;
    transform: none !important;
    touch-action: pan-x !important;
  }

  body[data-template="home"] .section-testimonials .embla__slide {
    display: block !important;
    width: min(82vw, 340px) !important;
    min-width: min(82vw, 340px) !important;
    max-width: 340px !important;
    height: 200px !important;
    min-height: 200px !important;
    flex: 0 0 min(82vw, 340px) !important;
    padding: 0 !important;
    scroll-snap-align: center !important;
  }

  body[data-template="home"] .section-testimonials article,
  body[data-template="home"] .section-testimonials .ayra-testimonial-card {
    position: relative !important;
    display: flex !important;
    width: 100% !important;
    height: 200px !important;
    min-height: 200px !important;
    padding: 30px 24px 24px !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 12px !important;
    overflow: hidden !important;
    text-align: center !important;
    background: linear-gradient(145deg, #fbfaf8, #f1ede7) !important;
    border: 1px solid rgba(184, 154, 106, .24) !important;
    border-radius: 18px !important;
    box-shadow: 0 16px 38px rgba(34, 27, 21, .13) !important;
  }

  body[data-template="home"] .section-testimonials article::before {
    content: "“";
    position: absolute;
    inset-block-start: 8px;
    inset-inline-start: 18px;
    color: rgba(176, 139, 82, .34);
    font-family: Georgia, serif;
    font-size: 58px;
    line-height: 1;
  }

  body[data-template="home"] .section-testimonials article [aria-label*="stars"] {
    color: #a9854e !important;
  }

  body[data-template="home"] .section-testimonials article p {
    max-width: 28ch !important;
    font-size: 14px !important;
    line-height: 1.65 !important;
  }

  body[data-template="home"] .section-testimonials article h3 {
    font-size: 12px !important;
    font-weight: 600 !important;
    letter-spacing: .06em;
    text-transform: uppercase;
    opacity: .72;
  }

  .ayra-testimonial-dots {
    display: flex;
    min-height: 24px;
    margin-top: 4px;
    align-items: center;
    justify-content: center;
    gap: 7px;
  }

  .ayra-testimonial-dots button {
    width: 6px;
    height: 6px;
    padding: 0;
    background: rgba(23, 22, 20, .2);
    border: 0;
    border-radius: 999px;
    transition: width .3s ease, background-color .3s ease;
  }

  .ayra-testimonial-dots button.is-active {
    width: 22px;
    background: #a9854e;
  }
}

@media (min-width: 768px) {
  .ayra-testimonial-dots { display: none !important; }
}

@media (max-width: 767px) {
  .ayra-site-header {
    min-height: 108px !important;
    padding-inline: 10px !important;
  }

  .ayra-site-header > nav {
    grid-template-columns: 84px minmax(80px, 1fr) auto !important;
    grid-template-rows: 62px 46px !important;
    min-height: 108px !important;
    column-gap: 7px !important;
  }

  .ayra-site-header > nav > div.flex.items-center > a[aria-label="Home"] {
    position: static !important;
    grid-column: 1 !important;
    grid-row: 1 !important;
    width: 84px !important;
    height: auto !important;
    transform: none !important;
  }

  .ayra-site-header > nav > ul:has([data-search-trigger]) {
    grid-column: 2 / 4 !important;
    grid-row: 1 !important;
    gap: 2px !important;
  }

  .ayra-site-header > nav > ul:has([data-search-trigger]) > li:first-child > button[data-search-trigger] {
    height: 38px !important;
    min-height: 38px !important;
    padding-inline: 12px !important;
  }

  .ayra-site-header > nav > ul:has([data-search-trigger]) > li:first-child > button[data-search-trigger]::before {
    inset-inline-start: 13px;
    font-size: 13px;
  }

  .ayra-site-header > nav > ul:has([data-search-trigger]) button,
  .ayra-site-header > nav > ul:has([data-search-trigger]) a {
    width: 34px !important;
    min-width: 34px !important;
    height: 38px !important;
    min-height: 38px !important;
    padding: 6px !important;
  }

  .ayra-site-header > nav > ul:has([data-search-trigger]) > li:has(button[onclick*="Region"]) {
    display: none !important;
  }

  .ayra-site-header > nav > div.flex.items-center > ul {
    justify-content: flex-start !important;
    gap: 28px !important;
  }

  .ayra-site-header > nav button[aria-label="Toggle menu"] {
    display: none !important;
  }
}

html[dir="rtl"] body { font-family: "Tajawal", "Noto Sans Arabic", Arial, sans-serif; }

body {
  background: var(--ayra-paper);
  color: var(--ayra-ink);
}

.ayra-header,
body[data-template="home"] header {
  background: rgba(251, 250, 248, .94);
  border-color: var(--ayra-line);
  box-shadow: none;
  backdrop-filter: blur(10px);
}

.ayra-section:not(.ayra-hero),
body[data-template="home"] main > section:not(.section-hero) {
  padding-block: clamp(3.5rem, 7vw, 7.5rem);
}

.ayra-section:not(.ayra-hero) > *,
body[data-template="home"] main > section:not(.section-hero) > * {
  max-width: var(--ayra-content);
  margin-inline: auto;
}

.ayra-hero,
body[data-template="home"] .section-hero {
  width: 100%;
  padding-inline: 0;
  min-height: clamp(34rem, 68vw, 52rem) !important;
}

.ayra-hero img,
body[data-template="home"] .section-hero img { transform: scale(1.001); }

.ayra-categories h2,
.ayra-products h2,
.ayra-testimonials h2,
.section-categories h2,
.section-products h2,
.section-testimonials h2 {
  font-size: clamp(1.5rem, 2.5vw, 2.25rem);
  font-weight: 500;
  letter-spacing: -.02em;
}

.ayra-categories img,
.section-categories img,
.ayra-product-card img,
.section-products [class*="product-card"] img,
.product-gallery img {
  border-radius: 0;
}

.ayra-categories a,
.section-categories a { border-radius: 0; }

.ayra-categories h3,
.section-categories h3 {
  text-align: center;
  font-size: clamp(1rem, 1.4vw, 1.2rem);
  font-weight: 500;
}

.ayra-product-card,
.section-products [class*="product-card"] {
  gap: 1rem;
  border-radius: 0;
  box-shadow: none;
}

.ayra-product-card h3,
.ayra-product-card h3 a,
.ayra-product-card p,
.ayra-product-card [class*="price"],
.section-products [class*="product-card"] h3,
.section-products [class*="product-card"] h3 a,
.section-products [class*="product-card"] p,
.section-products [class*="product-card"] [class*="price"] {
  text-align: center;
}

.ayra-product-card h3 {
  font-weight: 400;
  line-height: 1.45;
}

.ayra-product-card button[aria-label*="wishlist" i] {
  position: absolute;
  inset-block-start: .75rem;
  inset-inline-end: .75rem;
  z-index: 2;
}

.ayra-product-card img {
  transition: transform .35s ease;
}

@media (hover: hover) and (prefers-reduced-motion: no-preference) {
  .ayra-product-card:hover img { transform: scale(1.015); }
}

.ayra-benefits,
.section-benefits { background: var(--ayra-warm) !important; }

.ayra-benefits > * {
  gap: 1px;
  background: var(--ayra-line);
}

.ayra-benefits > * > * {
  min-height: 10rem;
  padding: clamp(1.25rem, 2.5vw, 2.25rem);
  background: var(--ayra-paper);
  border: 0;
  border-radius: 0;
  box-shadow: none;
}

.ayra-testimonials article,
.section-testimonials article {
  padding: clamp(1.5rem, 3vw, 2.5rem);
  background: var(--ayra-warm);
  border: 0;
  border-radius: 0;
  box-shadow: none;
}

/* Verified Growth product page */
.product-gallery-column { min-width: 0; }

.product-gallery {
  background: var(--ayra-warm);
  border-radius: 0;
}

.product-gallery__slide { flex-basis: 100%; }

.product-details-column {
  gap: 1.35rem;
  max-width: 42rem;
}

.product-options__item,
.product-details-column button {
  border-radius: 0;
}

.product-options__item {
  min-width: 3rem;
  min-height: 3rem;
}

.product-details-column > button[aria-expanded] {
  padding: 1rem 0;
  background: transparent;
  border-block-start: 1px solid var(--ayra-line);
}

@media (min-width: 768px) {
  .product-gallery-column { flex: 1.15 1 0; }
  .product-details-column { flex: .85 1 0; }
}

/* Definitive compact mobile header — prevents logo/action collisions. */
@media (max-width: 767px) {
  header,
  header.ayra-header,
  body[data-template="home"] header {
    position: relative !important;
    width: 100% !important;
    height: 64px !important;
    min-height: 64px !important;
    padding: 0 !important;
  }

  header nav,
  header.ayra-header nav,
  body[data-template="home"] header nav {
    position: relative !important;
    display: block !important;
    width: 100% !important;
    max-width: none !important;
    height: 64px !important;
    min-height: 64px !important;
    padding: 0 !important;
  }

  header nav > el-dialog > button,
  header.ayra-header nav > el-dialog > button,
  body[data-template="home"] header nav > el-dialog > button {
    position: absolute !important;
    z-index: 30 !important;
    top: 50% !important;
    right: 10px !important;
    left: auto !important;
    width: 38px !important;
    height: 38px !important;
    min-width: 38px !important;
    padding: 8px !important;
    transform: translateY(-50%) !important;
  }

  header nav > div.flex.items-center > a[aria-label="Home"],
  header.ayra-header nav > div.flex.items-center > a[aria-label="Home"],
  body[data-template="home"] header nav > div.flex.items-center > a[aria-label="Home"] {
    position: absolute !important;
    z-index: 25 !important;
    top: 50% !important;
    left: 50% !important;
    right: auto !important;
    display: block !important;
    width: 82px !important;
    height: 32px !important;
    margin: 0 !important;
    padding: 0 !important;
    visibility: visible !important;
    opacity: 1 !important;
    transform: translate(-50%, -50%) !important;
  }

  header nav a[aria-label="Home"] img[alt="AYRA"],
  header.ayra-header nav a[aria-label="Home"] img[alt="AYRA"],
  body[data-template="home"] header nav a[aria-label="Home"] img[alt="AYRA"] {
    position: static !important;
    display: block !important;
    width: 82px !important;
    min-width: 82px !important;
    height: 32px !important;
    max-height: 32px !important;
    margin: 0 !important;
    visibility: visible !important;
    opacity: 1 !important;
    transform: none !important;
    object-fit: contain !important;
  }

  header nav > ul,
  header.ayra-header nav > ul,
  body[data-template="home"] header nav > ul {
    position: absolute !important;
    z-index: 30 !important;
    top: 50% !important;
    left: 6px !important;
    right: auto !important;
    display: flex !important;
    width: auto !important;
    min-width: 0 !important;
    height: 36px !important;
    margin: 0 !important;
    padding: 0 !important;
    flex-direction: row-reverse !important;
    align-items: center !important;
    justify-content: flex-start !important;
    gap: 0 !important;
    transform: translateY(-50%) !important;
  }

  header nav > ul > li,
  header.ayra-header nav > ul > li,
  body[data-template="home"] header nav > ul > li {
    width: 30px !important;
    min-width: 30px !important;
    height: 36px !important;
    margin: 0 !important;
    padding: 0 !important;
  }

  header nav > ul > li:nth-child(2),
  header nav > ul a[href*="/account"]:not([aria-label="Wishlist"]),
  body[data-template="home"] header nav > ul > li:nth-child(2),
  body[data-template="home"] header nav > ul a[href*="/account"]:not([aria-label="Wishlist"]) {
    display: none !important;
  }

  header nav > ul button,
  header nav > ul a,
  header.ayra-header nav > ul button,
  header.ayra-header nav > ul a,
  body[data-template="home"] header nav > ul button,
  body[data-template="home"] header nav > ul a {
    width: 30px !important;
    min-width: 30px !important;
    height: 36px !important;
    min-height: 36px !important;
    padding: 4px !important;
  }

  header nav > ul svg,
  body[data-template="home"] header nav > ul svg {
    width: 21px !important;
    height: 21px !important;
  }
}

/* Absolute final mobile header alignment using functional hooks. */
@media (max-width: 767px) {
  body header,
  body header.ayra-header {
    position: relative !important;
    display: block !important;
    width: 100% !important;
    height: 64px !important;
    min-height: 64px !important;
    max-height: 64px !important;
    padding: 0 !important;
    overflow: visible !important;
  }

  body header nav {
    position: relative !important;
    display: block !important;
    width: 100% !important;
    height: 64px !important;
    min-height: 64px !important;
    max-height: 64px !important;
    margin: 0 !important;
    padding: 0 !important;
  }

  body header nav a[aria-label="Home"] {
    position: absolute !important;
    z-index: 50 !important;
    top: 32px !important;
    left: 50% !important;
    right: auto !important;
    display: block !important;
    width: 92px !important;
    height: 34px !important;
    margin: 0 !important;
    padding: 0 !important;
    transform: translate(-50%, -50%) !important;
  }

  body header nav a[aria-label="Home"] img[alt="AYRA"] {
    position: static !important;
    display: block !important;
    width: 92px !important;
    min-width: 92px !important;
    height: 34px !important;
    max-height: 34px !important;
    margin: 0 !important;
    transform: none !important;
    object-fit: contain !important;
  }

  body header nav el-dialog > button[aria-label="Toggle menu"] {
    position: absolute !important;
    z-index: 60 !important;
    top: 32px !important;
    right: 10px !important;
    left: auto !important;
    display: block !important;
    width: 40px !important;
    height: 40px !important;
    margin: 0 !important;
    padding: 10px !important;
    transform: translateY(-50%) !important;
  }

  body header nav ul:has([data-search-trigger]) {
    position: absolute !important;
    z-index: 60 !important;
    top: 32px !important;
    left: 8px !important;
    right: auto !important;
    bottom: auto !important;
    display: flex !important;
    width: auto !important;
    min-width: 0 !important;
    height: 40px !important;
    margin: 0 !important;
    padding: 0 !important;
    flex-direction: row !important;
    flex-wrap: nowrap !important;
    align-items: center !important;
    justify-content: flex-start !important;
    gap: 1px !important;
    transform: translateY(-50%) !important;
  }

  body header nav ul:has([data-search-trigger]) > li {
    position: static !important;
    display: flex !important;
    width: 28px !important;
    min-width: 28px !important;
    height: 40px !important;
    margin: 0 !important;
    padding: 0 !important;
    align-items: center !important;
    justify-content: center !important;
  }

  body header nav ul:has([data-search-trigger]) > li:has(button[onclick*="RegionSetting"]),
  body header nav ul:has([data-search-trigger]) > li:has(button[onclick*="zidOpenRegion"]) {
    display: none !important;
  }

  body header nav ul:has([data-search-trigger]) button,
  body header nav ul:has([data-search-trigger]) a {
    position: static !important;
    display: flex !important;
    width: 28px !important;
    min-width: 28px !important;
    height: 40px !important;
    min-height: 40px !important;
    margin: 0 !important;
    padding: 3px !important;
    align-items: center !important;
    justify-content: center !important;
    transform: none !important;
  }

  body header nav ul:has([data-search-trigger]) svg {
    width: 21px !important;
    height: 21px !important;
  }
}

/* Final mobile testimonial card sizing and RTL containment. */
@media (max-width: 767px) {
  body[data-template="home"] .section-testimonials .embla__viewport {
    width: 100% !important;
    max-width: 100% !important;
    padding: 0 4px 6px !important;
    direction: ltr !important;
  }

  body[data-template="home"] .section-testimonials .embla__container {
    display: flex !important;
    width: auto !important;
    min-width: 100% !important;
    max-width: none !important;
    height: auto !important;
    gap: 10px !important;
    align-items: stretch !important;
    transform: none !important;
  }

  body[data-template="home"] .section-testimonials .embla__slide {
    display: block !important;
    width: 82vw !important;
    min-width: 82vw !important;
    max-width: 320px !important;
    height: 176px !important;
    min-height: 176px !important;
    flex: 0 0 min(82vw, 320px) !important;
    padding: 0 !important;
  }

  body[data-template="home"] .section-testimonials article,
  body[data-template="home"] .section-testimonials .ayra-testimonial-card {
    display: flex !important;
    width: 100% !important;
    max-width: 100% !important;
    height: 176px !important;
    min-height: 176px !important;
    margin: 0 !important;
    padding: 18px !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 10px !important;
    overflow: hidden !important;
    direction: inherit !important;
    text-align: center !important;
  }

  html[dir="rtl"] body[data-template="home"] .section-testimonials article,
  html[lang^="ar"] body[data-template="home"] .section-testimonials article {
    direction: rtl !important;
  }

  body[data-template="home"] .section-testimonials article > *,
  body[data-template="home"] .section-testimonials article p,
  body[data-template="home"] .section-testimonials article h3 {
    position: static !important;
    width: auto !important;
    max-width: 100% !important;
    margin: 0 !important;
    transform: none !important;
    text-align: center !important;
  }
}

/* Force the existing Gallery media to fill its equal About column. */
@media (min-width: 768px) {
  body[data-template="home"] .section-gallery .ayra-about-layout {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) !important;
    width: 100% !important;
    gap: 8px !important;
    align-items: stretch !important;
  }

  body[data-template="home"] .section-gallery .ayra-about-media {
    display: block !important;
    width: 100% !important;
    max-width: none !important;
    height: clamp(360px, 29vw, 430px) !important;
    min-height: clamp(360px, 29vw, 430px) !important;
    overflow: hidden !important;
    background: var(--ayra-panel);
  }

  body[data-template="home"] .section-gallery .ayra-about-media > *,
  body[data-template="home"] .section-gallery .ayra-about-media > * > *,
  body[data-template="home"] .section-gallery .ayra-about-media picture,
  body[data-template="home"] .section-gallery .ayra-about-media a,
  body[data-template="home"] .section-gallery .ayra-about-media div {
    display: block !important;
    width: 100% !important;
    max-width: none !important;
    height: 100% !important;
    min-height: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
  }

  body[data-template="home"] .section-gallery .ayra-about-media img {
    display: block !important;
    width: 100% !important;
    max-width: none !important;
    height: 100% !important;
    min-height: 100% !important;
    margin: 0 !important;
    object-fit: cover !important;
    object-position: center !important;
  }

  body[data-template="home"] .section-gallery .ayra-about-copy {
    width: 100% !important;
    max-width: none !important;
    height: clamp(360px, 29vw, 430px) !important;
    min-height: clamp(360px, 29vw, 430px) !important;
    margin: 0 !important;
  }
}

@media (max-width: 767px) {
  .ayra-section:not(.ayra-hero),
  body[data-template="home"] main > section:not(.section-hero) { padding-block: 3.5rem; }
  .ayra-hero,
  body[data-template="home"] .section-hero { min-height: 34rem !important; }

  body.ayra-product-page { padding-bottom: calc(5.5rem + env(safe-area-inset-bottom)); }

  .ayra-mobile-cart {
    position: fixed;
    z-index: 50;
    inset-inline: 0;
    inset-block-end: 0;
    padding: .75rem 1rem calc(.75rem + env(safe-area-inset-bottom));
    background: rgba(251, 250, 248, .97);
    border-block-start: 1px solid var(--ayra-line);
    box-shadow: 0 -8px 24px rgba(23, 22, 20, .06);
    backdrop-filter: blur(10px);
  }

  .ayra-mobile-cart .btn-filled { min-height: 3.25rem; }
}

/* Header wishlist action */
.ayra-header-wishlist {
  display: none;
}

@media (max-width: 1023px) {
  header nav > ul > li.ayra-header-wishlist,
  body[data-template="home"] header nav > ul > li.ayra-header-wishlist {
    display: flex !important;
    align-items: center;
    justify-content: center;
  }

  .ayra-header-wishlist a {
    display: flex !important;
    width: 42px !important;
    height: 42px !important;
    min-width: 42px !important;
    padding: 9px !important;
    align-items: center;
    justify-content: center;
  }

  .ayra-header-wishlist svg {
    width: 24px;
    height: 24px;
    fill: none;
    stroke: currentColor;
    stroke-width: 1.6;
  }
}

/* Desktop About cards: larger, equal and nearly touching. */
@media (min-width: 768px) {
  body[data-template="home"] .section-gallery {
    padding-inline: clamp(24px, 3vw, 48px) !important;
  }

  body[data-template="home"] .section-gallery > .theme-container,
  body[data-template="home"] .section-gallery > div {
    width: 100% !important;
    max-width: 1400px !important;
  }

  body[data-template="home"] .section-gallery .ayra-about-layout {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 14px !important;
  }

  body[data-template="home"] .section-gallery .ayra-about-media,
  body[data-template="home"] .section-gallery .ayra-about-copy {
    width: 100% !important;
    height: clamp(340px, 27vw, 410px) !important;
    min-height: clamp(340px, 27vw, 410px) !important;
  }

  body[data-template="home"] .section-gallery .ayra-about-copy {
    padding: clamp(28px, 3vw, 48px) !important;
  }
}

/* Compact testimonial cards on mobile. */
@media (max-width: 767px) {
  body[data-template="home"] .section-testimonials {
    padding-block: 34px !important;
  }

  body[data-template="home"] .section-testimonials .embla__slide {
    width: min(76vw, 320px) !important;
    min-width: min(76vw, 320px) !important;
    flex-basis: min(76vw, 320px) !important;
  }

  body[data-template="home"] .section-testimonials article,
  body[data-template="home"] .section-testimonials .ayra-testimonial-card {
    min-height: 168px !important;
    height: 168px !important;
    padding: 18px 16px !important;
  }

  body[data-template="home"] .section-testimonials article p {
    margin-block: 8px !important;
    font-size: 14px !important;
    line-height: 1.55;
  }
}

/* Mobile header alignment fix */
@media (max-width: 1023px) {
  body[data-template="home"] header,
  header.ayra-header {
    width: 100% !important;
    min-height: 64px !important;
    height: 64px !important;
    padding: 0 14px !important;
    overflow: visible !important;
  }

  body[data-template="home"] header nav,
  header.ayra-header nav {
    position: relative !important;
    display: flex !important;
    width: 100% !important;
    height: 64px !important;
    min-height: 64px !important;
    align-items: center !important;
    justify-content: space-between !important;
    overflow: visible !important;
  }

  body[data-template="home"] header nav > div.flex.items-center > a[aria-label="Home"],
  header.ayra-header nav > div.flex.items-center > a[aria-label="Home"] {
    position: absolute !important;
    z-index: 3;
    top: 50% !important;
    left: 50% !important;
    right: auto !important;
    width: auto !important;
    height: auto !important;
    margin: 0 !important;
    transform: translate(-50%, -50%) !important;
  }

  body[data-template="home"] header img[alt="AYRA"],
  header.ayra-header img[alt="AYRA"] {
    position: static !important;
    display: block !important;
    width: 108px !important;
    height: auto !important;
    max-height: 38px !important;
    margin: 0 !important;
    transform: none !important;
    object-fit: contain !important;
  }

  body[data-template="home"] header nav > el-dialog,
  header.ayra-header nav > el-dialog {
    position: relative;
    z-index: 4;
    display: contents;
  }

  body[data-template="home"] header nav > el-dialog > button,
  header.ayra-header nav > el-dialog > button {
    position: relative !important;
    inset: auto !important;
    flex: 0 0 42px;
    width: 42px !important;
    height: 42px !important;
    margin: 0 !important;
    padding: 10px !important;
  }

  body[data-template="home"] header nav > ul,
  header.ayra-header nav > ul {
    position: relative !important;
    z-index: 4;
    display: flex !important;
    min-width: 92px;
    margin-inline-start: auto !important;
    align-items: center !important;
    justify-content: flex-end !important;
    gap: 4px !important;
  }

  body[data-template="home"] header nav > ul > li,
  header.ayra-header nav > ul > li {
    display: flex;
    align-items: center;
    justify-content: center;
  }

  body[data-template="home"] header nav > ul button,
  body[data-template="home"] header nav > ul a,
  header.ayra-header nav > ul button,
  header.ayra-header nav > ul a {
    display: flex !important;
    width: 42px !important;
    height: 42px !important;
    min-width: 42px !important;
    min-height: 42px !important;
    padding: 9px !important;
    align-items: center !important;
    justify-content: center !important;
  }
}

/* =========================================================
   Final responsive corrections
   ========================================================= */
@media (max-width: 1023px) {
  header nav > div.flex.items-center > a[aria-label="Home"],
  body[data-template="home"] header nav > div.flex.items-center > a[aria-label="Home"] {
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
    position: absolute !important;
    z-index: 20 !important;
    left: 50% !important;
    right: auto !important;
    top: 50% !important;
    margin: 0 !important;
    padding: 0 !important;
    transform: translate(-50%, -50%) !important;
  }

  header nav a[aria-label="Home"] img[alt="AYRA"],
  body[data-template="home"] header nav a[aria-label="Home"] img[alt="AYRA"] {
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
    position: static !important;
    width: 96px !important;
    min-width: 96px !important;
    height: 34px !important;
    max-height: 34px !important;
    transform: none !important;
    object-fit: contain !important;
  }

  /* Keep the mobile header to menu + logo + search/account/cart. */
  header nav > ul > li:nth-child(2),
  body[data-template="home"] header nav > ul > li:nth-child(2) {
    display: none !important;
  }

  header nav > ul,
  body[data-template="home"] header nav > ul {
    min-width: 132px !important;
    gap: 2px !important;
  }
}

/* About cards stay close and balanced on desktop. */
body[data-template="home"] .section-gallery > .theme-container,
body[data-template="home"] .section-gallery > div {
  max-width: 1160px !important;
}

body[data-template="home"] .section-gallery .ayra-about-layout {
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) !important;
  gap: clamp(22px, 3vw, 42px) !important;
}

body[data-template="home"] .section-gallery .ayra-about-media,
body[data-template="home"] .section-gallery .ayra-about-copy {
  min-height: 285px;
  border-radius: 4px;
}

body[data-template="home"] .section-gallery .ayra-about-copy {
  display: flex;
  flex-direction: column;
  justify-content: center;
  padding: clamp(24px, 3vw, 42px);
  background: var(--ayra-panel);
}

body[data-template="home"] .section-gallery .ayra-about-media {
  height: 285px;
}

/* More breathing room between testimonial heading and cards. */
body[data-template="home"] .section-testimonials h2 {
  margin-block-end: 34px !important;
}

body[data-template="home"] .section-testimonials .theme-container > div:first-child:has(h2) {
  margin-block-end: 34px !important;
}

@media (max-width: 767px) {
  body[data-template="home"] .section-gallery .ayra-about-layout {
    display: flex !important;
    width: 100% !important;
    flex-direction: column !important;
    gap: 14px !important;
  }

  body[data-template="home"] .section-gallery .ayra-about-media,
  body[data-template="home"] .section-gallery .ayra-about-copy {
    display: flex !important;
    width: 100% !important;
    min-width: 0 !important;
    min-height: 0 !important;
    margin: 0 !important;
  }

  body[data-template="home"] .section-gallery .ayra-about-media {
    order: 1 !important;
    height: 245px !important;
  }

  body[data-template="home"] .section-gallery .ayra-about-copy {
    order: 2 !important;
    padding: 24px 20px !important;
  }

  body[data-template="home"] .section-gallery .ayra-about-copy h2 {
    width: 100%;
    font-size: 24px !important;
    text-align: start !important;
  }

  body[data-template="home"] .section-gallery .ayra-about-copy p {
    width: 100%;
    font-size: 14px !important;
    line-height: 1.7 !important;
  }

  body[data-template="home"] .section-testimonials h2,
  body[data-template="home"] .section-testimonials .theme-container > div:first-child:has(h2) {
    margin-block-end: 28px !important;
  }

  body[data-template="home"] .section-testimonials .embla,
  body[data-template="home"] .section-testimonials .embla__viewport {
    width: 100% !important;
    overflow-x: auto !important;
    overflow-y: hidden !important;
    scroll-snap-type: x mandatory;
    scrollbar-width: none;
    -webkit-overflow-scrolling: touch;
  }

  body[data-template="home"] .section-testimonials .embla__viewport::-webkit-scrollbar {
    display: none;
  }

  body[data-template="home"] .section-testimonials .embla__container {
    display: flex !important;
    width: max-content !important;
    gap: 12px !important;
    transform: none !important;
    touch-action: pan-x !important;
  }

  body[data-template="home"] .section-testimonials .embla__slide {
    display: block !important;
    width: min(84vw, 360px) !important;
    min-width: min(84vw, 360px) !important;
    flex: 0 0 min(84vw, 360px) !important;
    scroll-snap-align: center;
  }
}

@media (prefers-reduced-motion: reduce) {
  .ayra-product-card img { transition: none; }
}

/* =========================================================
   AYRA reference-match layer — Growth homepage
   ========================================================= */
body[data-template="home"] {
  --ayra-page: #faf8f5;
  --ayra-panel: #f4f1ed;
  --ayra-rule: #e8e3dd;
  background: var(--ayra-page) !important;
}

body[data-template="home"]::before {
  content: "Free shipping on orders over EGP 1000";
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 27px;
  padding: 4px 16px;
  background: #f1eee9;
  color: #3d3935;
  font-size: 10px;
  line-height: 1.4;
  text-align: center;
}

/* Announcement bar removed by merchant request. */
body[data-template="home"]::before { display: none !important; content: none !important; }

html[lang^="ar"] body[data-template="home"]::before,
html[dir="rtl"] body[data-template="home"]::before {
  content: "شحن مجاني للطلبات فوق 1000 جنيه";
}

body[data-template="home"] header {
  position: relative !important;
  min-height: 70px;
  padding: 0 clamp(22px, 4vw, 50px) !important;
  background: rgba(250, 248, 245, .98) !important;
}

@media (min-width: 1024px) {
  body[data-template="home"] header nav {
    display: grid !important;
    grid-template-columns: 1fr auto 1fr;
    min-height: 70px;
    max-width: 1600px;
  }

  body[data-template="home"] header nav > div.flex.items-center {
    display: contents !important;
  }

  body[data-template="home"] header nav > div.flex.items-center > a[aria-label="Home"] {
    grid-column: 2;
    grid-row: 1;
    align-self: center;
  }

  body[data-template="home"] header nav > div.flex.items-center > ul {
    grid-column: 3;
    grid-row: 1;
    justify-self: end;
    gap: clamp(22px, 2.5vw, 38px) !important;
  }

  body[data-template="home"] header nav > ul {
    grid-column: 1;
    grid-row: 1;
    justify-self: start;
    gap: 10px !important;
  }

  html[dir="ltr"] body[data-template="home"] header nav > div.flex.items-center > ul {
    grid-column: 1;
    justify-self: start;
  }

  html[dir="ltr"] body[data-template="home"] header nav > ul {
    grid-column: 3;
    justify-self: end;
  }
}

/* AYRA V10 — strictly scoped Arabic mobile header */
@media (max-width: 767px) {
  html[lang^="ar"][dir="rtl"] .ayra-ar-mobile-header {
    position: relative !important;
    inset: auto !important;
    width: 100% !important;
    min-height: 72px !important;
    height: 72px !important;
    max-height: 72px !important;
    padding: 0 14px !important;
    overflow: hidden !important;
    color: #171717 !important;
    background: #f8f6f2 !important;
    border: 0 !important;
    border-bottom: 1px solid rgba(23, 23, 23, .08) !important;
    box-shadow: 0 3px 14px rgba(23, 23, 23, .05) !important;
  }

  html[lang^="ar"][dir="rtl"] .ayra-ar-mobile-header > nav {
    position: relative !important;
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) 104px minmax(0, 1fr) !important;
    grid-template-rows: 72px !important;
    width: 100% !important;
    height: 72px !important;
    min-height: 72px !important;
    padding: 0 !important;
    gap: 0 !important;
    align-items: center !important;
    direction: ltr !important;
  }

  html[lang^="ar"][dir="rtl"] .ayra-ar-mobile-header > nav > el-dialog,
  html[lang^="ar"][dir="rtl"] .ayra-ar-mobile-header > nav > div.flex.items-center {
    display: contents !important;
  }

  html[lang^="ar"][dir="rtl"] .ayra-ar-mobile-header > nav > div.flex.items-center > ul {
    display: none !important;
  }

  html[lang^="ar"][dir="rtl"] .ayra-ar-header-logo {
    position: static !important;
    z-index: 2 !important;
    grid-column: 2 !important;
    grid-row: 1 !important;
    place-self: center !important;
    display: block !important;
    width: 104px !important;
    min-width: 104px !important;
    height: 34px !important;
    margin: 0 !important;
    padding: 0 !important;
    transform: none !important;
  }

  html[lang^="ar"][dir="rtl"] .ayra-ar-header-logo img[alt="AYRA"] {
    position: static !important;
    display: block !important;
    width: 104px !important;
    min-width: 104px !important;
    max-width: 104px !important;
    height: 34px !important;
    max-height: 34px !important;
    margin: 0 !important;
    object-fit: contain !important;
    transform: none !important;
    translate: none !important;
  }

  html[lang^="ar"][dir="rtl"] .ayra-ar-header-actions {
    position: static !important;
    z-index: 3 !important;
    grid-column: 1 !important;
    grid-row: 1 !important;
    place-self: center start !important;
    display: flex !important;
    width: 126px !important;
    min-width: 0 !important;
    max-width: 100% !important;
    height: 42px !important;
    margin: 0 !important;
    padding: 0 !important;
    overflow: visible !important;
    flex-flow: row-reverse nowrap !important;
    align-items: center !important;
    justify-content: flex-end !important;
    gap: 2px !important;
    direction: ltr !important;
    transform: none !important;
  }

  html[lang^="ar"][dir="rtl"] .ayra-ar-header-actions > li:not(.ayra-header-language-hidden) {
    position: relative !important;
    display: flex !important;
    width: 30px !important;
    min-width: 30px !important;
    height: 42px !important;
    margin: 0 !important;
    padding: 0 !important;
    align-items: center !important;
    justify-content: center !important;
  }

  html[lang^="ar"][dir="rtl"] .ayra-ar-header-actions > li.ayra-header-language-hidden {
    display: none !important;
  }

  html[lang^="ar"][dir="rtl"] .ayra-ar-header-actions button,
  html[lang^="ar"][dir="rtl"] .ayra-ar-header-actions a {
    position: relative !important;
    display: inline-flex !important;
    width: 30px !important;
    min-width: 30px !important;
    height: 42px !important;
    min-height: 42px !important;
    margin: 0 !important;
    padding: 0 !important;
    align-items: center !important;
    justify-content: center !important;
    color: #171717 !important;
    background: transparent !important;
    border: 0 !important;
    transform: none !important;
  }

  html[lang^="ar"][dir="rtl"] .ayra-ar-header-actions svg {
    width: 22px !important;
    height: 22px !important;
    color: #171717 !important;
  }

  html[lang^="ar"][dir="rtl"] .ayra-ar-menu-action {
    position: static !important;
    z-index: 3 !important;
    grid-column: 3 !important;
    grid-row: 1 !important;
    place-self: center end !important;
    display: block !important;
    width: 44px !important;
    min-width: 44px !important;
    height: 44px !important;
    margin: 0 !important;
    padding: 10px !important;
    color: #171717 !important;
    background: transparent !important;
    transform: none !important;
  }

  html[lang^="ar"][dir="rtl"] .ayra-ar-header-actions :is(a, button):focus-visible,
  html[lang^="ar"][dir="rtl"] .ayra-ar-menu-action:focus-visible {
    outline: 2px solid rgba(23, 23, 23, .65) !important;
    outline-offset: 2px !important;
  }
}

@media (max-width: 369px) {
  html[lang^="ar"][dir="rtl"] .ayra-ar-mobile-header {
    padding-inline: 10px !important;
  }

  html[lang^="ar"][dir="rtl"] .ayra-ar-mobile-header > nav {
    grid-template-columns: minmax(0, 1fr) 92px minmax(0, 1fr) !important;
  }

  html[lang^="ar"][dir="rtl"] .ayra-ar-header-logo,
  html[lang^="ar"][dir="rtl"] .ayra-ar-header-logo img[alt="AYRA"] {
    width: 92px !important;
    min-width: 92px !important;
    max-width: 92px !important;
  }

  html[lang^="ar"][dir="rtl"] .ayra-ar-header-actions {
    width: 116px !important;
    gap: 0 !important;
  }

  html[lang^="ar"][dir="rtl"] .ayra-ar-header-actions > li:not(.ayra-header-language-hidden),
  html[lang^="ar"][dir="rtl"] .ayra-ar-header-actions button,
  html[lang^="ar"][dir="rtl"] .ayra-ar-header-actions a {
    width: 29px !important;
    min-width: 29px !important;
  }
}

/* Mobile category strip: sit directly over the top of the hero banner. */
@media (max-width: 767px) {
  html:is([lang^="ar"][dir="rtl"],[lang^="en"][dir="ltr"]) header.ayra-unified-mobile-header,
  html:is([lang^="ar"][dir="rtl"],[lang^="en"][dir="ltr"]) header.ayra-unified-mobile-header > nav {
    overflow: visible !important;
  }

  html:is([lang^="ar"][dir="rtl"],[lang^="en"][dir="ltr"]) header.ayra-unified-mobile-header > nav > div.flex.items-center > ul {
    position: absolute !important;
    z-index: 155 !important;
    top: 72px !important;
    right: -14px !important;
    bottom: auto !important;
    left: -14px !important;
    display: flex !important;
    width: auto !important;
    height: 50px !important;
    margin: 0 !important;
    padding: 0 20px !important;
    overflow-x: auto !important;
    overflow-y: hidden !important;
    flex-flow: row nowrap !important;
    align-items: center !important;
    justify-content: flex-start !important;
    gap: clamp(30px, 10vw, 72px) !important;
    background: transparent !important;
    box-shadow: none !important;
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
    scrollbar-width: none !important;
  }

  html[lang^="ar"][dir="rtl"] header.ayra-unified-mobile-header > nav > div.flex.items-center > ul {
    direction: rtl !important;
  }

  html[lang^="en"][dir="ltr"] header.ayra-unified-mobile-header > nav > div.flex.items-center > ul {
    direction: ltr !important;
  }

  html:is([lang^="ar"][dir="rtl"],[lang^="en"][dir="ltr"]) header.ayra-unified-mobile-header > nav > div.flex.items-center > ul::-webkit-scrollbar {
    display: none !important;
  }

  html:is([lang^="ar"][dir="rtl"],[lang^="en"][dir="ltr"]) header.ayra-unified-mobile-header > nav > div.flex.items-center > ul > li {
    flex: 0 0 auto !important;
  }

  html:is([lang^="ar"][dir="rtl"],[lang^="en"][dir="ltr"]) header.ayra-unified-mobile-header > nav > div.flex.items-center > ul :is(a,button) {
    min-height: 50px !important;
    padding: 10px 0 !important;
    color: #171717 !important;
    font-size: 14px !important;
    font-weight: 500 !important;
    white-space: nowrap !important;
  }
}

@media (max-width: 369px) {
  html:is([lang^="ar"][dir="rtl"],[lang^="en"][dir="ltr"]) header.ayra-unified-mobile-header > nav > div.flex.items-center > ul {
    right: -12px !important;
    left: -12px !important;
    padding-inline: 16px !important;
    gap: 28px !important;
  }
}

/* Mobile header: remove the account/login control requested by the client. */
@media (max-width: 767px) {
  body header.ayra-site-header #header-login-btn,
  body header.ayra-site-header a[href*="/account"]:not([aria-label="Wishlist"]),
  body header.ayra-site-header :is(a, button):has(path[d^="M11.999 13.9229"]) {
    display: none !important;
  }

  body header.ayra-site-header li:has(> #header-login-btn),
  body header.ayra-site-header li:has(> a[href*="/account"]:not([aria-label="Wishlist"])),
  body header.ayra-site-header li:has(> :is(a, button) path[d^="M11.999 13.9229"]) {
    display: none !important;
    width: 0 !important;
    min-width: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
  }
}

/* AYRA V10 — strictly scoped Arabic product-card presentation */
html[lang^="ar"][dir="rtl"] .ayra-ar-product-card {
  position: relative !important;
  display: flex !important;
  flex-direction: column !important;
  height: 100% !important;
  gap: 0 !important;
  overflow: hidden !important;
  direction: rtl !important;
  background: #fff !important;
  border: 1px solid rgba(23, 23, 23, .06) !important;
  border-radius: 11px !important;
  box-shadow: 0 6px 22px rgba(23, 23, 23, .07) !important;
  transition: transform 220ms ease, box-shadow 220ms ease !important;
}

html[lang^="ar"][dir="rtl"] .ayra-ar-product-media {
  position: relative !important;
  display: block !important;
  width: 100% !important;
  aspect-ratio: 4 / 5 !important;
  flex: 0 0 auto !important;
  overflow: hidden !important;
  background: #f1eee8 !important;
  border-radius: 0 !important;
}

html[lang^="ar"][dir="rtl"] .ayra-ar-product-media > img {
  display: block !important;
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  transform: none !important;
  transition: transform 220ms ease !important;
}

html[lang^="ar"][dir="rtl"] .ayra-ar-wishlist-action {
  inset-block-start: 14px !important;
  inset-inline-start: auto !important;
  inset-inline-end: 14px !important;
  right: 14px !important;
  left: auto !important;
  bottom: auto !important;
  width: 42px !important;
  height: 42px !important;
  padding: 9px !important;
  color: #171717 !important;
  background: rgba(250, 248, 245, .94) !important;
  border: 1px solid rgba(23, 23, 23, .1) !important;
  border-radius: 999px !important;
  box-shadow: 0 3px 12px rgba(23, 23, 23, .045) !important;
}

html[lang^="ar"][dir="rtl"] .ayra-ar-product-media > .ayra-card-discount-badge {
  inset-block-start: 14px !important;
  inset-inline-start: 14px !important;
  inset-inline-end: auto !important;
  right: auto !important;
  left: 14px !important;
  padding: 8px 12px !important;
  color: #282624 !important;
  font-size: 13px !important;
  font-weight: 500 !important;
  background: #f6efe4 !important;
  border: 1px solid rgba(23, 23, 23, .07) !important;
  border-radius: 6px !important;
}

html[lang^="ar"][dir="rtl"] .ayra-ar-product-info {
  display: flex !important;
  min-height: 178px !important;
  padding: 14px 15px 16px !important;
  flex: 1 1 auto !important;
  flex-direction: column !important;
  align-items: center !important;
  gap: 11px !important;
  text-align: center !important;
  background: #fff !important;
}

html[lang^="ar"][dir="rtl"] .ayra-ar-product-info > *,
html[lang^="ar"][dir="rtl"] .ayra-ar-product-title,
html[lang^="ar"][dir="rtl"] .ayra-ar-product-title > a {
  width: 100% !important;
  text-align: center !important;
}

html[lang^="ar"][dir="rtl"] .ayra-ar-product-title {
  display: -webkit-box !important;
  min-height: 44px !important;
  margin: 0 !important;
  overflow: hidden !important;
  color: #282624 !important;
  font-size: 15px !important;
  font-weight: 500 !important;
  line-height: 1.55 !important;
  -webkit-box-orient: vertical !important;
  -webkit-line-clamp: 2 !important;
}

html[lang^="ar"][dir="rtl"] .ayra-ar-product-info .ayra-card-swatches {
  width: 100% !important;
  min-height: 22px !important;
  margin: 0 !important;
  flex-direction: row !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 8px !important;
}

html[lang^="ar"][dir="rtl"] .ayra-ar-product-info .ayra-card-swatches > span {
  width: 20px !important;
  height: 20px !important;
  border: 1px solid rgba(23, 23, 23, .55) !important;
}

html[lang^="ar"][dir="rtl"] .ayra-ar-prices,
html[lang^="ar"][dir="rtl"] .ayra-ar-price-meta {
  width: 100% !important;
  display: flex !important;
  flex-flow: row wrap !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 8px !important;
  text-align: center !important;
  direction: rtl !important;
}

html[lang^="ar"][dir="rtl"] .ayra-ar-current-price {
  margin: 0 !important;
  color: #171717 !important;
  font-size: 17px !important;
  font-weight: 600 !important;
  text-align: center !important;
}

html[lang^="ar"][dir="rtl"] .ayra-ar-old-price {
  color: #9a9792 !important;
  font-size: 13px !important;
  text-align: center !important;
  text-decoration: line-through !important;
}

html[lang^="ar"][dir="rtl"] .ayra-ar-discount-label {
  padding: 6px 9px !important;
  color: #456044 !important;
  font-size: 12px !important;
  font-weight: 500 !important;
  background: rgba(82, 130, 74, .11) !important;
  border-radius: 5px !important;
}

html[lang^="ar"][dir="rtl"] .ayra-ar-saving {
  display: inline-flex !important;
  padding: 6px 9px !important;
  align-items: center !important;
  justify-content: center !important;
  color: #61574d !important;
  font-size: 12px !important;
  background: #f3eadc !important;
  border-radius: 5px !important;
}

html[lang^="ar"][dir="rtl"] .ayra-ar-product-card > div:has(> .ayra-ar-product-action) {
  width: 100% !important;
  margin-top: auto !important;
  padding: 0 15px 15px !important;
}

html[lang^="ar"][dir="rtl"] .ayra-ar-product-action {
  width: 100% !important;
  min-height: 50px !important;
  margin-top: auto !important;
  padding: 10px 14px !important;
  color: #171717 !important;
  font-size: 15px !important;
  font-weight: 500 !important;
  text-align: center !important;
  background: #fff !important;
  border: 1px solid rgba(23, 23, 23, .78) !important;
  border-radius: 6px !important;
  box-shadow: none !important;
}

@media (hover: hover) and (pointer: fine) {
  html[lang^="ar"][dir="rtl"] .ayra-ar-product-card:hover {
    transform: translateY(-3px) !important;
    box-shadow: 0 10px 28px rgba(23, 23, 23, .09) !important;
  }

  html[lang^="ar"][dir="rtl"] .ayra-ar-product-card:hover .ayra-ar-product-media > img {
    transform: scale(1.012) !important;
  }

  html[lang^="ar"][dir="rtl"] .ayra-ar-product-action:hover {
    color: #fff !important;
    background: #171717 !important;
  }
}

@media (max-width: 767px) {
  html[lang^="ar"][dir="rtl"] .ayra-ar-product-grid {
    gap: 10px !important;
  }

  html[lang^="ar"][dir="rtl"] .ayra-ar-product-info {
    min-height: 164px !important;
    padding: 11px 10px 12px !important;
  }

  html[lang^="ar"][dir="rtl"] .ayra-ar-product-title {
    min-height: 40px !important;
    font-size: 13px !important;
  }

  html[lang^="ar"][dir="rtl"] .ayra-ar-current-price {
    font-size: 14px !important;
  }

  html[lang^="ar"][dir="rtl"] .ayra-ar-product-card > div:has(> .ayra-ar-product-action) {
    padding: 0 10px 10px !important;
  }

  html[lang^="ar"][dir="rtl"] .ayra-ar-product-action {
    min-height: 46px !important;
    font-size: 13px !important;
  }
}

/* AYRA V10 — verified, scoped subtle shadow system */
.ayra-product-card-premium,
.ayra-benefit-card,
.ayra-testimonial-card {
  border-color: rgba(23, 23, 23, .06) !important;
  box-shadow: 0 6px 22px rgba(23, 23, 23, .065) !important;
}

.ayra-site-header {
  box-shadow: 0 3px 12px rgba(23, 23, 23, .045) !important;
}

.ayra-site-header el-menu,
.ayra-site-header [role="menu"],
.ayra-product-card-premium [role="listbox"] {
  border: 1px solid rgba(23, 23, 23, .07) !important;
  box-shadow: 0 12px 32px rgba(23, 23, 23, .1) !important;
}

@media (prefers-reduced-motion: reduce) {
  html[lang^="ar"][dir="rtl"] .ayra-ar-product-card,
  html[lang^="ar"][dir="rtl"] .ayra-ar-product-media > img {
    transition: none !important;
    transform: none !important;
  }
}

body[data-template="home"] header img[alt="AYRA"] {
  position: static !important;
  width: clamp(112px, 10vw, 152px) !important;
  height: auto !important;
  max-height: 44px !important;
  transform: none !important;
}

body[data-template="home"] header a,
body[data-template="home"] header button {
  font-size: 13px !important;
  font-weight: 400 !important;
  text-decoration: none !important;
}

body[data-template="home"] .section-hero {
  min-height: 535px !important;
  height: min(58vw, 650px);
  padding: 0 !important;
}

body[data-template="home"] .section-hero picture,
body[data-template="home"] .section-hero picture img {
  width: 100%;
  height: 100%;
}

body[data-template="home"] .section-hero picture img {
  object-fit: cover;
  object-position: center;
}

body[data-template="home"] main > section:not(.section-hero) {
  padding: clamp(38px, 5vw, 72px) clamp(20px, 3.4vw, 48px) !important;
  border: 0 !important;
  background: var(--ayra-page) !important;
}

body[data-template="home"] main > section:not(.section-hero) > .theme-container {
  width: 100%;
  max-width: 1360px !important;
}

body[data-template="home"] main h2 {
  margin: 0;
  font-size: clamp(22px, 2vw, 30px) !important;
  font-weight: 400 !important;
  line-height: 1.3;
  text-align: center;
}

body[data-template="home"] main section .theme-container > div:first-child:has(h2) {
  display: flex;
  justify-content: center !important;
  margin-block-end: 22px;
}

body[data-template="home"] main section .theme-container > div:first-child:has(h2) > a {
  position: absolute;
  inset-inline-end: 0;
}

body[data-template="home"] .section-categories .embla__container,
body[data-template="home"] .section-products .products-embla__container {
  display: grid !important;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 14px !important;
  transform: none !important;
}

body[data-template="home"] .section-categories .embla__slide,
body[data-template="home"] .section-products .products-embla__slide {
  width: auto !important;
  min-width: 0 !important;
  flex: none !important;
}

body[data-template="home"] .section-categories .embla__slide {
  grid-column: span 2;
}

body[data-template="home"] .section-categories img {
  width: 100%;
  aspect-ratio: 4 / 5 !important;
  border-radius: 3px !important;
  object-fit: cover;
}

body[data-template="home"] .section-categories h3 {
  margin-block-start: 8px;
  font-size: 15px !important;
  font-weight: 400 !important;
  text-align: center !important;
}

body[data-template="home"] .section-products .products-embla__slide:nth-child(n+5) {
  display: none;
}

body[data-template="home"] .section-products .ayra-product-card {
  position: relative;
  display: flex !important;
  flex-direction: column !important;
  gap: 9px !important;
}

body[data-template="home"] .section-products .ayra-product-card img {
  width: 100%;
  aspect-ratio: 3 / 4 !important;
  object-fit: cover;
}

body[data-template="home"] .section-products .ayra-product-card h3,
body[data-template="home"] .section-products .ayra-product-card p {
  margin: 0 !important;
  font-size: 13px !important;
  font-weight: 400 !important;
  line-height: 1.45;
  text-align: center !important;
}

body[data-template="home"] .section-products .ayra-product-card > button:last-child {
  display: none !important;
}

body[data-template="home"] .section-benefits {
  padding-block-start: 28px !important;
}

body[data-template="home"] .section-benefits::before {
  content: "Store Benefits";
  display: block;
  margin-block-end: 18px;
  font-size: clamp(22px, 2vw, 30px);
  text-align: center;
}

/* Store Benefits heading removed in both languages. */
body[data-template="home"] .section-benefits::before { display: none !important; content: none !important; }

html[lang^="ar"] body[data-template="home"] .section-benefits::before,
html[dir="rtl"] body[data-template="home"] .section-benefits::before {
  content: "مميزات المتجر";
}

body[data-template="home"] .section-benefits .grid {
  display: grid !important;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 10px !important;
}

body[data-template="home"] .section-benefits .grid > div {
  min-height: 130px;
  padding: 25px 14px !important;
  justify-content: center;
  background: var(--ayra-panel) !important;
  border: 0 !important;
  border-radius: 3px !important;
}

body[data-template="home"] .section-benefits .ayra-benefit-icon {
  display: block;
  width: 42px;
  height: 42px;
  margin-inline: auto;
  margin-block-end: 13px;
  color: var(--ayra-ink);
  stroke: currentColor;
  stroke-width: 1.45;
  fill: none;
}

/* Gallery is used as the editable About AYRA editorial section. */
body[data-template="home"] .section-gallery {
  padding-block: clamp(42px, 5vw, 68px) !important;
}

body[data-template="home"] .section-gallery > .theme-container,
body[data-template="home"] .section-gallery > div {
  max-width: 1280px !important;
  margin-inline: auto;
}

body[data-template="home"] .section-gallery .ayra-about-layout {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1.08fr);
  align-items: center;
  gap: clamp(30px, 5vw, 72px);
}

/* Compact editorial About layout matching the supplied reference. */
body[data-template="home"] .section-gallery {
  padding: 26px clamp(24px, 4vw, 58px) 34px !important;
}

body[data-template="home"] .section-gallery .ayra-about-layout {
  grid-template-columns: minmax(340px, .95fr) minmax(0, 1.15fr);
  gap: clamp(38px, 6vw, 88px);
}

body[data-template="home"] .section-gallery .ayra-about-media {
  height: clamp(220px, 18vw, 285px);
  overflow: hidden;
}

body[data-template="home"] .section-gallery .ayra-about-media > *,
body[data-template="home"] .section-gallery .ayra-about-media picture,
body[data-template="home"] .section-gallery .ayra-about-media img {
  width: 100% !important;
  height: 100% !important;
  min-height: 0 !important;
  max-height: none !important;
}

body[data-template="home"] .section-gallery .ayra-about-media img {
  display: block;
  object-fit: cover !important;
  object-position: center 42%;
  border-radius: 2px !important;
}

body[data-template="home"] .section-gallery .ayra-about-copy {
  max-width: 650px;
  align-self: center;
}

body[data-template="home"] .section-gallery .ayra-about-copy h2 {
  margin-block-end: 9px;
  font-size: clamp(21px, 1.8vw, 28px) !important;
}

body[data-template="home"] .section-gallery .ayra-about-copy p {
  margin-block-end: 5px;
  font-size: clamp(12px, .98vw, 14px);
  line-height: 1.65;
}

body[data-template="home"] .section-gallery .ayra-about-more {
  display: inline-flex;
  min-width: 122px;
  min-height: 34px;
  margin-block-start: 12px;
  padding: 6px 18px;
  align-items: center;
  justify-content: center;
  color: var(--ayra-ink);
  font-size: 12px;
  line-height: 1;
  text-decoration: none;
  background: transparent;
  border: 1px solid var(--ayra-ink);
  border-radius: 0;
}

body[data-template="home"] .section-gallery .ayra-about-more:hover {
  color: #fff;
  background: var(--ayra-ink);
}

body[data-template="home"] .section-gallery .ayra-about-media {
  min-width: 0;
}

body[data-template="home"] .section-gallery .ayra-about-copy {
  max-width: 650px;
}

body[data-template="home"] .section-gallery .ayra-about-copy h2 {
  margin: 0 0 14px;
  color: var(--ayra-ink);
  font-size: clamp(24px, 2.4vw, 34px) !important;
  font-weight: 500 !important;
  text-align: start !important;
}

body[data-template="home"] .section-gallery .ayra-about-copy p {
  margin: 0 0 10px;
  color: var(--ayra-muted);
  font-size: clamp(14px, 1.12vw, 16px);
  line-height: 1.9;
  text-align: start;
}

body[data-template="home"] .section-gallery img {
  width: 100%;
  min-height: 330px;
  max-height: 480px;
  object-fit: cover;
  border-radius: 2px !important;
}

body[data-template="home"] .section-gallery h2,
body[data-template="home"] .section-gallery h3 {
  margin-block-end: 14px;
  font-size: clamp(23px, 2.4vw, 32px) !important;
  font-weight: 400 !important;
  text-align: start;
}

body[data-template="home"] .section-gallery p {
  color: var(--ayra-muted);
  font-size: clamp(14px, 1.15vw, 16px);
  line-height: 1.9;
}

/* Product media, accordion and native mobile purchase control. */
body[data-template="product_details"] #product-main-section,
body.ayra-product-page main > section:nth-of-type(2) > div {
  max-width: 1500px !important;
  margin-inline: auto;
}

body[data-template="product_details"] .product-gallery,
body.ayra-product-page .product-gallery {
  width: 100%;
  background: #f3f0eb;
  border-radius: 0 !important;
}

body[data-template="product_details"] .product-gallery__slide img,
body.ayra-product-page .product-gallery__slide img {
  width: 100%;
  height: auto;
  min-height: min(72vh, 760px);
  object-fit: contain;
  image-rendering: auto;
}

body[data-template="product_details"] #additional-info,
body.ayra-product-page #additional-info {
  border-block-start: 1px solid var(--ayra-line);
}

body[data-template="product_details"] #additional-info > div,
body.ayra-product-page #additional-info > div {
  border-block-end: 1px solid var(--ayra-line);
}

body[data-template="product_details"] #additional-info button[aria-controls],
body.ayra-product-page #additional-info button[aria-controls] {
  width: 100%;
  min-height: 58px;
  padding-inline: 0 !important;
  background: transparent !important;
  border-radius: 0 !important;
}

body[data-template="home"] .section-benefits p {
  font-size: 13px !important;
  font-weight: 500;
}

body[data-template="home"] .section-testimonials {
  padding-block-start: 32px !important;
}

body[data-template="home"] .section-testimonials .embla__container {
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 18px !important;
  transform: none !important;
}

body[data-template="home"] .section-testimonials article {
  min-height: 160px;
  padding: 24px !important;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  background: var(--ayra-panel) !important;
  border: 0 !important;
  border-radius: 10px !important;
}

body[data-template="home"] #footer {
  padding: 42px clamp(20px, 4vw, 56px) 22px !important;
  background: #f1eee9 !important;
  border: 0 !important;
}

@media (max-width: 767px) {
  body[data-template="home"]::before { min-height: 24px; font-size: 9px; }

  body[data-template="home"] header { min-height: 60px; padding-inline: 12px !important; }
  body[data-template="home"] header img[alt="AYRA"] {
    position: absolute !important;
    left: 50% !important;
    right: auto !important;
    top: 50% !important;
    inset-inline-start: auto !important;
    width: 100px !important;
    transform: translate(-50%, -50%) !important;
  }

  body[data-template="home"] .section-hero {
    min-height: 430px !important;
    height: 62vh;
  }

  body[data-template="home"] main > section:not(.section-hero) {
    padding: 42px 14px !important;
  }

  body[data-template="home"] .section-categories .embla__container,
  body[data-template="home"] .section-products .products-embla__container {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 9px !important;
  }

  body[data-template="home"] .section-categories .embla__slide { grid-column: span 1; }

  body[data-template="home"] .section-benefits .grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 8px !important;
  }

  body[data-template="home"] .section-benefits .grid > div {
    min-height: 118px;
    padding: 18px 9px !important;
  }

  body[data-template="home"] .section-testimonials .embla__container {
    display: flex !important;
    gap: 10px !important;
    overflow-x: auto;
    scroll-snap-type: x mandatory;
  }

  body[data-template="home"] .section-testimonials .embla__slide {
    flex: 0 0 88% !important;
    scroll-snap-align: center;
  }

  body[data-template="home"] .section-gallery > .theme-container,
  body[data-template="home"] .section-gallery > div {
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 24px !important;
  }

  body[data-template="home"] .section-gallery .ayra-about-layout {
    grid-template-columns: 1fr;
    gap: 22px;
  }

  body[data-template="home"] .section-gallery {
    padding: 34px 14px !important;
  }

  body[data-template="home"] .section-gallery .ayra-about-media {
    height: 230px;
  }

  body[data-template="home"] .section-gallery .ayra-about-media { order: 1; }
  body[data-template="home"] .section-gallery .ayra-about-copy { order: 2; }

  body[data-template="product_details"] .product-gallery__slide img,
  body.ayra-product-page .product-gallery__slide img {
    min-height: 460px;
  }

  body.ayra-product-page .ayra-mobile-cart {
    display: flex !important;
  }
}

/* AYRA mobile header — final cascade authority */
@media screen and (max-width: 767px) {
  body header,
  body header.ayra-header {
    position: relative !important;
    height: 64px !important;
    min-height: 64px !important;
    max-height: 64px !important;
    padding: 0 !important;
    overflow: visible !important;
  }

  body header nav {
    position: relative !important;
    display: block !important;
    width: 100% !important;
    height: 64px !important;
    min-height: 64px !important;
    max-height: 64px !important;
    padding: 0 !important;
  }

  body header nav a[aria-label="Home"] {
    position: absolute !important;
    z-index: 80 !important;
    top: 50% !important;
    left: 50% !important;
    right: auto !important;
    display: block !important;
    width: 92px !important;
    height: 34px !important;
    margin: 0 !important;
    padding: 0 !important;
    transform: translate(-50%, -50%) !important;
  }

  body header nav a[aria-label="Home"] img[alt="AYRA"] {
    position: static !important;
    display: block !important;
    width: 92px !important;
    height: 34px !important;
    max-height: 34px !important;
    margin: 0 !important;
    transform: none !important;
    object-fit: contain !important;
  }

  body header nav button[aria-label="Toggle menu"] {
    position: absolute !important;
    z-index: 90 !important;
    top: 50% !important;
    right: 10px !important;
    left: auto !important;
    display: block !important;
    width: 40px !important;
    height: 40px !important;
    margin: 0 !important;
    padding: 10px !important;
    transform: translateY(-50%) !important;
  }

  body header nav ul:has(button[data-search-trigger]) {
    position: absolute !important;
    z-index: 90 !important;
    top: 50% !important;
    left: 8px !important;
    right: auto !important;
    bottom: auto !important;
    display: flex !important;
    width: auto !important;
    min-width: 0 !important;
    height: 40px !important;
    margin: 0 !important;
    padding: 0 !important;
    flex-flow: row nowrap !important;
    align-items: center !important;
    gap: 2px !important;
    transform: translateY(-50%) !important;
  }

  body header nav ul:has(button[data-search-trigger]) > li {
    position: static !important;
    display: flex !important;
    width: 29px !important;
    min-width: 29px !important;
    height: 40px !important;
    margin: 0 !important;
    padding: 0 !important;
    align-items: center !important;
    justify-content: center !important;
  }

  body header nav ul:has(button[data-search-trigger]) > li:has(button[onclick*="Region"]) {
    display: none !important;
  }

  body header nav ul:has(button[data-search-trigger]) button,
  body header nav ul:has(button[data-search-trigger]) a {
    position: static !important;
    display: flex !important;
    width: 29px !important;
    min-width: 29px !important;
    height: 40px !important;
    min-height: 40px !important;
    margin: 0 !important;
    padding: 4px !important;
    align-items: center !important;
    justify-content: center !important;
    transform: none !important;
  }

  body header nav ul:has(button[data-search-trigger]) svg {
    width: 21px !important;
    height: 21px !important;
  }
}

/* AYRA HEADER ONLY — transparent two-row responsive correction */
.ayra-site-header {
  position: absolute !important;
  inset-block-start: 0 !important;
  inset-inline: 0 !important;
  z-index: 100 !important;
  background: linear-gradient(to bottom, rgba(20, 18, 16, .34), rgba(20, 18, 16, .04)) !important;
  border: 0 !important;
  box-shadow: none !important;
  color: #fff !important;
}

.ayra-site-header a,
.ayra-site-header button,
.ayra-site-header svg {
  color: #fff !important;
}

/* Keep one real account control only. */
.ayra-site-header a[href*="/account"]:not([aria-label="Wishlist"]),
.ayra-site-header #mobile-logged-in-links {
  display: none !important;
}

.ayra-site-header > nav > ul:has([data-search-trigger]) > li:first-child > button[data-search-trigger] {
  background: rgba(255, 255, 255, .9) !important;
  color: #171614 !important;
  border-color: rgba(255, 255, 255, .45) !important;
}

.ayra-site-header > nav > ul:has([data-search-trigger]) > li:first-child > button[data-search-trigger] svg {
  color: #171614 !important;
}

.ayra-site-header > nav > ul:has([data-search-trigger]) > li:first-child > button[data-search-trigger]::before {
  color: #6e6a65 !important;
}

@media (max-width: 767px) {
  .ayra-site-header {
    position: absolute !important;
    min-height: 108px !important;
    height: 108px !important;
    max-height: 108px !important;
    padding: 0 10px !important;
    overflow: visible !important;
  }

  .ayra-site-header > nav {
    position: relative !important;
    display: grid !important;
    grid-template-columns: 86px minmax(0, 1fr) 38px !important;
    grid-template-rows: 62px 46px !important;
    width: 100% !important;
    height: 108px !important;
    min-height: 108px !important;
    max-height: 108px !important;
    padding: 0 !important;
    gap: 0 6px !important;
  }

  .ayra-site-header > nav > div.flex.items-center {
    display: contents !important;
  }

  .ayra-site-header > nav > div.flex.items-center > a[aria-label="Home"] {
    position: static !important;
    grid-column: 1 !important;
    grid-row: 1 !important;
    align-self: center !important;
    display: block !important;
    width: 82px !important;
    height: 34px !important;
    margin: 0 !important;
    padding: 0 !important;
    transform: none !important;
  }

  .ayra-site-header > nav > div.flex.items-center > a[aria-label="Home"] img[alt="AYRA"] {
    position: static !important;
    display: block !important;
    width: 82px !important;
    height: 34px !important;
    max-height: 34px !important;
    margin: 0 !important;
    filter: brightness(0) invert(1);
    transform: none !important;
    object-fit: contain !important;
  }

  .ayra-site-header > nav > ul:has([data-search-trigger]) {
    position: static !important;
    grid-column: 2 !important;
    grid-row: 1 !important;
    align-self: center !important;
    display: flex !important;
    width: 100% !important;
    min-width: 0 !important;
    height: 40px !important;
    margin: 0 !important;
    padding: 0 !important;
    flex-flow: row nowrap !important;
    align-items: center !important;
    justify-content: flex-end !important;
    gap: 0 !important;
    transform: none !important;
  }

  .ayra-site-header > nav > ul:has([data-search-trigger]) > li {
    position: static !important;
    display: flex !important;
    width: 32px !important;
    min-width: 32px !important;
    height: 40px !important;
    margin: 0 !important;
    padding: 0 !important;
    align-items: center !important;
    justify-content: center !important;
  }

  .ayra-site-header > nav > ul:has([data-search-trigger]) > li:has(button[onclick*="Region"]) {
    display: none !important;
  }

  .ayra-site-header > nav > ul:has([data-search-trigger]) > li:first-child {
    flex: 0 0 38px !important;
    width: 38px !important;
    min-width: 38px !important;
  }

  .ayra-site-header > nav > ul:has([data-search-trigger]) > li:first-child > button[data-search-trigger] {
    position: static !important;
    display: flex !important;
    width: 38px !important;
    min-width: 38px !important;
    height: 38px !important;
    min-height: 38px !important;
    padding: 7px !important;
    justify-content: center !important;
    background: transparent !important;
    color: #fff !important;
    border: 0 !important;
    transform: none !important;
  }

  .ayra-site-header > nav > ul:has([data-search-trigger]) > li:first-child > button[data-search-trigger]::before {
    display: none !important;
    content: none !important;
  }

  .ayra-site-header > nav > ul:has([data-search-trigger]) > li:first-child > button[data-search-trigger] svg {
    color: #fff !important;
  }

  .ayra-site-header > nav > ul:has([data-search-trigger]) button,
  .ayra-site-header > nav > ul:has([data-search-trigger]) a {
    position: static !important;
    display: flex !important;
    width: 32px !important;
    min-width: 32px !important;
    height: 38px !important;
    min-height: 38px !important;
    margin: 0 !important;
    padding: 6px !important;
    align-items: center !important;
    justify-content: center !important;
    background: transparent !important;
    border: 0 !important;
    transform: none !important;
  }

  .ayra-site-header > nav > ul:has([data-search-trigger]) svg {
    width: 21px !important;
    height: 21px !important;
  }

  .ayra-site-header > nav button[aria-label="Toggle menu"] {
    position: static !important;
    grid-column: 3 !important;
    grid-row: 1 !important;
    align-self: center !important;
    display: block !important;
    width: 38px !important;
    height: 38px !important;
    margin: 0 !important;
    padding: 8px !important;
    transform: none !important;
  }

  .ayra-site-header > nav > div.flex.items-center > ul {
    position: static !important;
    grid-column: 1 / 4 !important;
    grid-row: 2 !important;
    align-self: stretch !important;
    display: flex !important;
    width: 100% !important;
    height: 46px !important;
    margin: 0 !important;
    padding: 0 4px !important;
    overflow-x: auto !important;
    flex-flow: row nowrap !important;
    align-items: center !important;
    justify-content: space-around !important;
    gap: 24px !important;
    scrollbar-width: none;
  }

  .ayra-site-header > nav > div.flex.items-center > ul::-webkit-scrollbar {
    display: none;
  }

  .ayra-site-header > nav > div.flex.items-center > ul > li {
    flex: 0 0 auto !important;
  }

  .ayra-site-header > nav > div.flex.items-center > ul a,
  .ayra-site-header > nav > div.flex.items-center > ul button {
    min-height: 40px !important;
    padding: 8px 0 !important;
    color: #fff !important;
    font-size: 13px !important;
    white-space: nowrap !important;
    background: transparent !important;
  }
}

/* AYRA HEADER ONLY — separate mobile logo and category rows */
@media (max-width: 767px) {
  .ayra-site-header > nav > div.flex.items-center > a[aria-label="Home"] {
    position: absolute !important;
    z-index: 140 !important;
    top: 34px !important;
    left: 50% !important;
    right: auto !important;
    width: 104px !important;
    height: 36px !important;
    overflow: visible !important;
    transform: translate(-50%, -50%) !important;
  }

  .ayra-site-header > nav > div.flex.items-center > a[aria-label="Home"] img[alt="AYRA"] {
    position: static !important;
    display: block !important;
    width: 104px !important;
    min-width: 104px !important;
    height: 36px !important;
    max-height: 36px !important;
    margin: 0 !important;
    transform: none !important;
  }

  .ayra-site-header > nav > div.flex.items-center > ul {
    position: absolute !important;
    z-index: 130 !important;
    top: 64px !important;
    left: 0 !important;
    right: 0 !important;
    bottom: auto !important;
    display: flex !important;
    width: 100% !important;
    height: 44px !important;
    margin: 0 !important;
    padding: 0 10px !important;
    overflow-x: auto !important;
    flex-flow: row nowrap !important;
    align-items: center !important;
    justify-content: space-around !important;
    gap: 22px !important;
    transform: none !important;
    scrollbar-width: none;
  }

  .ayra-site-header > nav > div.flex.items-center > ul::-webkit-scrollbar {
    display: none;
  }

  .ayra-site-header > nav > div.flex.items-center > ul a,
  .ayra-site-header > nav > div.flex.items-center > ul button {
    color: #171614 !important;
    font-size: 12px !important;
    white-space: nowrap !important;
  }
}

/* AYRA HEADER ONLY — restore visible logo/actions and keep one account */
.ayra-site-header,
.ayra-site-header a,
.ayra-site-header button,
.ayra-site-header svg {
  color: #171614 !important;
}

.ayra-site-header > nav > div.flex.items-center > a[aria-label="Home"],
.ayra-site-header > nav > div.flex.items-center > a[aria-label="Home"] img[alt="AYRA"],
.ayra-site-header > nav > ul:has([data-search-trigger]),
.ayra-site-header > nav > ul:has([data-search-trigger]) > li,
.ayra-site-header #header-login-btn {
  visibility: visible !important;
  opacity: 1 !important;
}

.ayra-site-header #header-login-btn {
  display: flex !important;
}

.ayra-site-header a[href$="/account"],
.ayra-site-header a[href*="/account?"] {
  display: none !important;
}

.ayra-site-header a[aria-label="Wishlist"] {
  display: flex !important;
}

.ayra-site-header > nav > ul:has([data-search-trigger]) > li:has(button[onclick*="Region"]) {
  display: flex !important;
}

@media (max-width: 767px) {
  .ayra-site-header > nav > div.flex.items-center > a[aria-label="Home"] {
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
  }

  .ayra-site-header > nav > div.flex.items-center > a[aria-label="Home"] img[alt="AYRA"] {
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
    filter: none !important;
  }

  .ayra-site-header > nav > ul:has([data-search-trigger]) {
    display: flex !important;
    visibility: visible !important;
    opacity: 1 !important;
  }

  .ayra-site-header > nav > ul:has([data-search-trigger]) > li,
  .ayra-site-header > nav > ul:has([data-search-trigger]) > li:nth-child(2),
  .ayra-site-header > nav > ul:has([data-search-trigger]) > li:has(button[onclick*="Region"]) {
    display: flex !important;
    visibility: visible !important;
    opacity: 1 !important;
  }

  .ayra-site-header > nav > ul:has([data-search-trigger]) button,
  .ayra-site-header > nav > ul:has([data-search-trigger]) a,
  .ayra-site-header > nav > ul:has([data-search-trigger]) svg,
  .ayra-site-header > nav button[aria-label="Toggle menu"] {
    color: #171614 !important;
    visibility: visible !important;
    opacity: 1 !important;
  }

  .ayra-site-header > nav > ul:has([data-search-trigger]) > li:first-child > button[data-search-trigger],
  .ayra-site-header > nav > ul:has([data-search-trigger]) > li:first-child > button[data-search-trigger] svg {
    color: #171614 !important;
  }

  .ayra-site-header > nav > ul:has([data-search-trigger]) > li:has(button[onclick*="Region"]) button {
    width: auto !important;
    min-width: 38px !important;
    padding-inline: 5px !important;
    gap: 2px !important;
    font-size: 11px !important;
  }

  .ayra-site-header > nav > ul:has([data-search-trigger]) > li:has(button[onclick*="Region"]) svg {
    width: 17px !important;
    height: 17px !important;
  }
}

/* AYRA HEADER ONLY — mobile logo size/vertical position */
@media (max-width: 767px) {
  body .ayra-site-header nav a[aria-label="Home"] {
    position: absolute !important;
    z-index: 120 !important;
    top: 32px !important;
    inset-block-start: 32px !important;
    left: 50% !important;
    right: auto !important;
    width: 112px !important;
    height: 40px !important;
    margin: 0 !important;
    padding: 0 !important;
    transform: translate(-50%, -50%) !important;
  }

  body .ayra-site-header nav a[aria-label="Home"] img[alt="AYRA"] {
    position: static !important;
    display: block !important;
    width: 112px !important;
    min-width: 112px !important;
    height: 40px !important;
    max-height: 40px !important;
    margin: 0 !important;
    transform: none !important;
    translate: none !important;
    object-fit: contain !important;
    object-position: center !important;
  }

  .ayra-site-header > nav > div.flex.items-center > ul {
    transition: opacity .2s ease, transform .2s ease, visibility .2s ease !important;
  }

  .ayra-site-header.ayra-categories-hidden > nav > div.flex.items-center > ul {
    opacity: 0 !important;
    visibility: hidden !important;
    pointer-events: none !important;
    transform: translateY(-10px) !important;
  }
}

/* AYRA HEADER ONLY — cancel Zid's independent translate utility on the logo */
body .ayra-site-header nav a[aria-label="Home"] img[alt="AYRA"] {
  translate: none !important;
}

/* AYRA HEADER ONLY — logo beside the menu; RTL is the exact LTR mirror */
@media (max-width: 1199px) {
  body .ayra-site-header nav a[aria-label="Home"] {
    position: absolute !important;
    top: 32px !important;
    inset-block-start: 32px !important;
    left: auto !important;
    right: auto !important;
    inset-inline-start: clamp(108px, 20vw, 136px) !important;
    width: 112px !important;
    height: 40px !important;
    margin: 0 !important;
    transform: translateY(-50%) !important;
  }

  body .ayra-site-header nav a[aria-label="Home"] img[alt="AYRA"] {
    position: static !important;
    display: block !important;
    width: 112px !important;
    min-width: 112px !important;
    height: 40px !important;
    max-height: 40px !important;
    margin: 0 !important;
    transform: none !important;
    translate: none !important;
    object-fit: contain !important;
  }
}

/* AYRA — subtle high-end depth and motion */
.ayra-site-header {
  box-shadow: 0 10px 32px rgba(31, 25, 20, .055) !important;
  transition: box-shadow .4s ease, background-color .4s ease, opacity .28s ease, transform .36s cubic-bezier(.22,.8,.3,1) !important;
}

.ayra-product-card,
.ayra-benefit-card,
.ayra-testimonial-card,
.section-products [class*="group"][class*="relative"] {
  transition: transform .42s cubic-bezier(.22,.8,.3,1), box-shadow .42s ease, border-color .32s ease !important;
}

.ayra-product-card,
.section-products [class*="group"][class*="relative"] {
  box-shadow: 0 16px 42px rgba(34, 27, 21, .14) !important;
}

.ayra-benefit-card,
.ayra-testimonial-card {
  box-shadow: 0 14px 36px rgba(34, 27, 21, .11) !important;
}

.ayra-product-card img,
.section-products [class*="group"][class*="relative"] img {
  transition: transform .7s cubic-bezier(.22,.8,.3,1), filter .5s ease !important;
}

.ayra-site-header a,
.ayra-site-header button,
.ayra-about-more,
.section-products a,
.section-products button {
  transition: color .25s ease, background-color .3s ease, border-color .3s ease, box-shadow .35s ease, transform .35s cubic-bezier(.22,.8,.3,1) !important;
}

.ayra-reveal {
  opacity: 0;
  transform: translateY(18px);
  transition: opacity .72s ease, transform .78s cubic-bezier(.22,.8,.3,1), box-shadow .42s ease !important;
}

.ayra-reveal.is-visible {
  opacity: 1;
  transform: translateY(0);
}

@media (hover: hover) and (pointer: fine) {
  .ayra-product-card:hover,
  .section-products [class*="group"][class*="relative"]:hover {
    transform: translateY(-5px) !important;
    box-shadow: 0 20px 48px rgba(34, 27, 21, .11) !important;
  }

  .ayra-benefit-card:hover,
  .ayra-testimonial-card:hover {
    transform: translateY(-3px) !important;
    box-shadow: 0 16px 38px rgba(34, 27, 21, .085) !important;
  }

  .ayra-product-card:hover img,
  .section-products [class*="group"][class*="relative"]:hover img {
    transform: scale(1.025);
    filter: saturate(.96) contrast(1.015);
  }

  .ayra-about-more:hover,
  .section-products button:hover {
    transform: translateY(-2px);
    box-shadow: 0 10px 24px rgba(23, 22, 20, .12);
  }
}

@media (prefers-reduced-motion: reduce) {
  .ayra-section,
  .ayra-product-card,
  .ayra-benefit-card,
  .ayra-testimonial-card,
  .ayra-product-card img,
  .section-products [class*="group"][class*="relative"],
  .section-products [class*="group"][class*="relative"] img {
    animation: none !important;
    transition: none !important;
    transform: none !important;
    opacity: 1 !important;
  }
}

/* AYRA — definitive mobile testimonial layout */
@media (max-width: 767px) {
  body[data-template="home"] .section-testimonials {
    overflow: hidden !important;
    padding-inline: 0 !important;
  }

  body[data-template="home"] .section-testimonials .embla,
  body[data-template="home"] .section-testimonials .embla__viewport {
    width: 100% !important;
    max-width: 100% !important;
    overflow-x: auto !important;
    overflow-y: visible !important;
    scroll-snap-type: x mandatory !important;
    scroll-behavior: smooth !important;
    scrollbar-width: none;
  }

  body[data-template="home"] .section-testimonials .embla__viewport {
    padding: 8px 9vw 20px !important;
  }

  body[data-template="home"] .section-testimonials .embla__container {
    display: flex !important;
    grid-template-columns: none !important;
    width: max-content !important;
    min-width: 100% !important;
    max-width: none !important;
    gap: 14px !important;
    overflow: visible !important;
    transform: none !important;
    touch-action: pan-x !important;
  }

  body[data-template="home"] .section-testimonials .embla__slide {
    display: block !important;
    width: min(82vw, 340px) !important;
    min-width: min(82vw, 340px) !important;
    max-width: 340px !important;
    height: 200px !important;
    min-height: 200px !important;
    flex: 0 0 min(82vw, 340px) !important;
    padding: 0 !important;
    scroll-snap-align: center !important;
  }

  body[data-template="home"] .section-testimonials article,
  body[data-template="home"] .section-testimonials .ayra-testimonial-card {
    position: relative !important;
    width: 100% !important;
    height: 200px !important;
    min-height: 200px !important;
    padding: 30px 24px 24px !important;
    gap: 12px !important;
    background: linear-gradient(145deg, #fbfaf8, #f1ede7) !important;
    border: 1px solid rgba(184, 154, 106, .24) !important;
    border-radius: 18px !important;
    box-shadow: 0 16px 38px rgba(34, 27, 21, .13) !important;
  }
}

/* AYRA — desktop testimonials match the mobile luxury card style */
@media (min-width: 768px) {
  body[data-template="home"] .section-testimonials .embla__container {
    align-items: stretch !important;
    gap: 20px !important;
  }

  body[data-template="home"] .section-testimonials .embla__slide {
    min-height: 210px !important;
  }

  body[data-template="home"] .section-testimonials article,
  body[data-template="home"] .section-testimonials .ayra-testimonial-card {
    position: relative !important;
    width: 100% !important;
    min-height: 210px !important;
    padding: 34px 28px 28px !important;
    gap: 14px !important;
    overflow: hidden !important;
    text-align: center !important;
    background: linear-gradient(145deg, #fbfaf8, #f1ede7) !important;
    border: 1px solid rgba(184, 154, 106, .24) !important;
    border-radius: 18px !important;
    box-shadow: 0 16px 38px rgba(34, 27, 21, .13) !important;
  }

  body[data-template="home"] .section-testimonials article::before {
    content: "“";
    position: absolute;
    inset-block-start: 8px;
    inset-inline-start: 18px;
    color: rgba(176, 139, 82, .34);
    font-family: Georgia, serif;
    font-size: 62px;
    line-height: 1;
  }

  body[data-template="home"] .section-testimonials article [aria-label*="stars"] {
    color: #a9854e !important;
  }

  body[data-template="home"] .section-testimonials article p {
    max-width: 32ch !important;
    margin-inline: auto !important;
    font-size: 15px !important;
    line-height: 1.65 !important;
  }

  body[data-template="home"] .section-testimonials article h3 {
    font-size: 12px !important;
    font-weight: 600 !important;
    letter-spacing: .06em;
    text-transform: uppercase;
    opacity: .72;
  }
}

/* AYRA — definitive editorial About section */
body[data-template="home"] .section-gallery {
  padding: clamp(34px, 4vw, 58px) clamp(20px, 4vw, 64px) !important;
}

body[data-template="home"] .section-gallery > .theme-container,
body[data-template="home"] .section-gallery > div {
  width: 100% !important;
  max-width: 1420px !important;
  margin-inline: auto !important;
}

body[data-template="home"] .section-gallery .ayra-about-layout {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  width: 100% !important;
  gap: 0 !important;
  align-items: stretch !important;
}

body[data-template="home"] .section-gallery .ayra-about-media,
body[data-template="home"] .section-gallery .ayra-about-copy {
  width: 100% !important;
  max-width: none !important;
  height: clamp(390px, 32vw, 470px) !important;
  min-height: 390px !important;
  margin: 0 !important;
}

body[data-template="home"] .section-gallery .ayra-about-media {
  overflow: hidden !important;
}

body[data-template="home"] .section-gallery .ayra-about-media > *,
body[data-template="home"] .section-gallery .ayra-about-media picture,
body[data-template="home"] .section-gallery .ayra-about-media img {
  width: 100% !important;
  height: 100% !important;
  max-height: none !important;
}

body[data-template="home"] .section-gallery .ayra-about-media img {
  display: block !important;
  object-fit: cover !important;
  object-position: center !important;
  border-radius: 0 !important;
  transition: transform .8s cubic-bezier(.22,.8,.3,1) !important;
}

body[data-template="home"] .section-gallery .ayra-about-copy {
  display: flex !important;
  padding: clamp(38px, 5vw, 74px) !important;
  flex-direction: column !important;
  align-items: flex-start !important;
  justify-content: center !important;
  background: #f4f0ea !important;
  direction: ltr;
  text-align: start !important;
}

body[data-template="home"] .section-gallery .ayra-about-rtl .ayra-about-media { order: 2 !important; }
body[data-template="home"] .section-gallery .ayra-about-rtl .ayra-about-copy {
  order: 1 !important;
  direction: rtl !important;
}

body[data-template="home"] .section-gallery .ayra-about-eyebrow {
  display: block;
  margin-block-end: 10px;
  color: #756c62;
  font-size: 10px;
  font-weight: 600;
  line-height: 1;
  letter-spacing: .15em;
  text-transform: uppercase;
}

body[data-template="home"] .section-gallery .ayra-about-copy h2 {
  width: 100% !important;
  margin: 0 0 18px !important;
  padding-block-end: 17px;
  color: #171614 !important;
  font-family: Georgia, "Times New Roman", serif;
  font-size: clamp(25px, 2.3vw, 38px) !important;
  font-weight: 400 !important;
  line-height: 1.15 !important;
  text-align: start !important;
  border-block-end: 1px solid rgba(23, 22, 20, .14);
}

body[data-template="home"] .section-gallery .ayra-about-copy p {
  width: 100% !important;
  max-width: 62ch !important;
  margin: 0 0 8px !important;
  color: #6f675f !important;
  font-size: clamp(12px, 1vw, 14px) !important;
  line-height: 1.72 !important;
  text-align: start !important;
}

body[data-template="home"] .section-gallery .ayra-about-more {
  display: inline-flex !important;
  min-width: 128px !important;
  min-height: 38px !important;
  margin-block-start: 14px !important;
  padding: 9px 17px !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 14px;
  color: #fff !important;
  font-size: 10px !important;
  font-weight: 600;
  letter-spacing: .08em;
  text-transform: uppercase;
  background: #171614 !important;
  border: 1px solid #171614 !important;
}

body[data-template="home"] .section-gallery .ayra-about-more::after {
  content: "→";
  font-size: 15px;
}

body[data-template="home"] .section-gallery .ayra-about-rtl .ayra-about-more::after {
  content: "←";
}

@media (hover: hover) and (pointer: fine) {
  body[data-template="home"] .section-gallery .ayra-about-layout:hover .ayra-about-media img {
    transform: scale(1.025);
  }
}

@media (max-width: 767px) {
  body[data-template="home"] .section-gallery {
    padding: 30px 14px !important;
  }

  body[data-template="home"] .section-gallery .ayra-about-layout {
    grid-template-columns: 1fr !important;
  }

  body[data-template="home"] .section-gallery .ayra-about-media,
  body[data-template="home"] .section-gallery .ayra-about-rtl .ayra-about-media {
    order: 1 !important;
    width: 100% !important;
    height: 260px !important;
    min-height: 260px !important;
  }

  body[data-template="home"] .section-gallery .ayra-about-copy,
  body[data-template="home"] .section-gallery .ayra-about-rtl .ayra-about-copy {
    order: 2 !important;
    width: 100% !important;
    height: auto !important;
    min-height: 0 !important;
    padding: 30px 24px 32px !important;
  }

  body[data-template="home"] .section-gallery .ayra-about-copy h2 {
    font-size: 27px !important;
  }
}

/* AYRA — premium product cards across all product listings */
[data-product-card].ayra-product-card-premium {
  position: relative !important;
  display: flex !important;
  height: 100% !important;
  gap: 0 !important;
  overflow: hidden !important;
  background: #fbfaf8 !important;
  border: 1px solid rgba(23, 22, 20, .09) !important;
  border-radius: 12px !important;
  box-shadow: 0 12px 30px rgba(34, 27, 21, .10) !important;
  transition: transform .42s cubic-bezier(.22,.8,.3,1), box-shadow .42s ease !important;
}

[data-product-card].ayra-product-card-premium > a[href*="/products/"] {
  position: relative !important;
  width: 100% !important;
  overflow: hidden !important;
  border-radius: 0 !important;
}

[data-product-card].ayra-product-card-premium > a[href*="/products/"] img {
  display: block !important;
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  transition: transform .7s cubic-bezier(.22,.8,.3,1) !important;
}

[data-product-card].ayra-product-card-premium > div:nth-of-type(1) {
  padding: 14px 14px 8px !important;
  gap: 10px !important;
}

[data-product-card].ayra-product-card-premium > div:nth-of-type(2) {
  width: 100% !important;
  margin-top: auto !important;
  padding: 4px 14px 14px !important;
}

[data-product-card].ayra-product-card-premium h3 {
  margin: 0 !important;
  color: #171614 !important;
  font-family: Georgia, "Times New Roman", serif;
  font-size: clamp(14px, 1.15vw, 17px) !important;
  font-weight: 400 !important;
  line-height: 1.3 !important;
}

[data-product-card].ayra-product-card-premium p[class*="font-semibold"] {
  color: #171614 !important;
  font-size: 15px !important;
  font-weight: 650 !important;
}

[data-product-card].ayra-product-card-premium span[class*="line-through"] {
  color: #8b857e !important;
  font-size: 12px !important;
}

[data-product-card].ayra-product-card-premium span[class*="bg-success"] {
  padding: 6px 10px !important;
  color: #46704d !important;
  font-size: 11px !important;
  background: #e4eee2 !important;
  border-radius: 4px !important;
}

[data-product-card].ayra-product-card-premium button[data-open-quick-view],
[data-product-card].ayra-product-card-premium > div:nth-of-type(2) > button {
  width: 100% !important;
  min-height: 44px !important;
  padding: 10px 14px !important;
  color: #171614 !important;
  font-family: Georgia, "Times New Roman", serif;
  font-size: 14px !important;
  font-weight: 400 !important;
  background: transparent !important;
  border: 1px solid rgba(23, 22, 20, .72) !important;
  border-radius: 4px !important;
}

[data-product-card].ayra-product-card-premium button[data-wishlist-btn] {
  top: 14px !important;
  bottom: auto !important;
  width: 38px !important;
  height: 38px !important;
  padding: 8px !important;
  color: #171614 !important;
  background: rgba(251, 250, 248, .82) !important;
  border: 1px solid rgba(23, 22, 20, .12) !important;
  border-radius: 999px !important;
  backdrop-filter: blur(8px);
}

.ayra-card-discount-badge {
  position: absolute;
  z-index: 3;
  inset-block-start: 14px;
  inset-inline-start: 14px;
  display: inline-flex;
  min-height: 34px;
  padding: 7px 12px;
  align-items: center;
  justify-content: center;
  color: #4f473f;
  font-family: Georgia, "Times New Roman", serif;
  font-size: 12px;
  line-height: 1;
  background: rgba(244, 238, 228, .94);
  border: 1px solid rgba(23, 22, 20, .08);
  border-radius: 5px;
  backdrop-filter: blur(8px);
}

.ayra-card-swatches {
  display: flex;
  min-height: 22px;
  margin-block-end: 3px;
  align-items: center;
  gap: 8px;
}

.ayra-card-swatches > span {
  display: block;
  width: 18px;
  height: 18px;
  background: var(--ayra-swatch);
  border: 1px solid rgba(23, 22, 20, .28);
  border-radius: 999px;
  box-shadow: inset 0 0 0 2px #fbfaf8;
}

@media (hover: hover) and (pointer: fine) {
  [data-product-card].ayra-product-card-premium:hover {
    transform: translateY(-5px) !important;
    box-shadow: 0 20px 44px rgba(34, 27, 21, .15) !important;
  }

  [data-product-card].ayra-product-card-premium:hover > a[href*="/products/"] img {
    transform: scale(1.025) !important;
  }

  [data-product-card].ayra-product-card-premium button[data-open-quick-view]:hover {
    color: #fff !important;
    background: #171614 !important;
  }
}

@media (max-width: 767px) {
  [data-product-card].ayra-product-card-premium {
    border-radius: 9px !important;
    box-shadow: 0 9px 24px rgba(34, 27, 21, .09) !important;
  }

  [data-product-card].ayra-product-card-premium > div:nth-of-type(1) {
    padding: 11px 10px 6px !important;
  }

  [data-product-card].ayra-product-card-premium > div:nth-of-type(2) {
    padding: 4px 10px 10px !important;
  }

  [data-product-card].ayra-product-card-premium h3 {
    font-size: 13px !important;
  }

  [data-product-card].ayra-product-card-premium p[class*="font-semibold"] {
    font-size: 13px !important;
  }

  [data-product-card].ayra-product-card-premium button[data-open-quick-view],
  [data-product-card].ayra-product-card-premium > div:nth-of-type(2) > button {
    min-height: 39px !important;
    padding: 8px !important;
    font-size: 12px !important;
  }

  [data-product-card].ayra-product-card-premium button[data-wishlist-btn] {
    top: 9px !important;
    width: 32px !important;
    height: 32px !important;
    padding: 6px !important;
  }

  .ayra-card-discount-badge {
    inset-block-start: 9px;
    inset-inline-start: 9px;
    min-height: 28px;
    padding: 6px 9px;
    font-size: 10px;
  }

  .ayra-card-swatches { gap: 6px; }
  .ayra-card-swatches > span { width: 15px; height: 15px; }
}
/* AYRA final cross-language authority — July 2026 */
:root { --ayra-beige: #f3f0eb; --ayra-paper: #fbfaf8; --ayra-ink: #171614; }

#ayra-page-loader {
  position: fixed !important;
  z-index: 2147483647 !important;
  inset: 0 !important;
  display: flex !important;
  width: 100vw !important;
  min-width: 100vw !important;
  height: 100vh !important;
  height: 100svh !important;
  height: 100dvh !important;
  min-height: 100vh !important;
  min-height: 100dvh !important;
  align-items: center !important;
  justify-content: center !important;
  overflow: hidden !important;
  background: var(--ayra-beige) !important;
  opacity: 1;
  visibility: visible;
  transition: opacity .4s ease, visibility .4s ease;
  isolation: isolate;
  pointer-events: auto !important;
}
#ayra-page-loader img {
  display: block;
  width: clamp(138px, 38vw, 168px);
  height: 58px;
  object-fit: contain;
  animation: ayra-loader-logo .8s cubic-bezier(.22,.8,.3,1) both;
}
#ayra-page-loader span {
  position: absolute;
  top: calc(50% + 52px);
  left: 50%;
  width: 76px;
  height: 1px;
  overflow: hidden;
  background: rgba(23, 22, 20, .18);
  transform: translateX(-50%);
}
#ayra-page-loader span::after {
  content: "";
  display: block;
  width: 28px;
  height: 1px;
  background: var(--ayra-ink);
  animation: ayra-loader-line 1s cubic-bezier(.65,0,.35,1) infinite;
}
#ayra-page-loader.is-hidden { opacity: 0 !important; visibility: hidden !important; pointer-events: none !important; }
@keyframes ayra-loader-line {
  from { transform: translateX(-28px); }
  to { transform: translateX(76px); }
}

html:not(.ayra-page-ready),
html:not(.ayra-page-ready) body,
html:not(.ayra-page-ready) body > * { background-color: var(--ayra-beige) !important; }

html:not(.ayra-page-ready)::before {
  inset: -2px !important;
  width: auto !important;
  min-width: calc(100vw + 4px) !important;
  height: auto !important;
  min-height: calc(100dvh + 4px) !important;
  background-color: var(--ayra-beige) !important;
  pointer-events: auto !important;
}

body header.ayra-site-header li.ayra-header-language-hidden { display: none !important; }

.ayra-side-language {
  display: flex !important;
  width: calc(100% - 32px) !important;
  min-height: 48px !important;
  margin: 12px 16px 18px !important;
  padding: 12px 4px !important;
  align-items: center !important;
  justify-content: flex-start !important;
  gap: 11px !important;
  color: var(--ayra-ink) !important;
  font: inherit !important;
  background: transparent !important;
  border: 0 !important;
  border-top: 1px solid rgba(23, 22, 20, .12) !important;
  border-radius: 0 !important;
  cursor: pointer;
}
.ayra-side-language__globe { font-size: 22px; line-height: 1; }
.ayra-unified-side-menu { color: var(--ayra-ink) !important; }
.ayra-unified-side-menu > div:not([tabindex="0"]),
.ayra-unified-side-menu > div[tabindex="0"] > div,
.ayra-unified-side-menu el-dialog-panel > .bg-background {
  background-color: var(--ayra-paper) !important;
}

[data-product-card].ayra-product-card-premium > a[href*="/products/"] {
  aspect-ratio: 4 / 5 !important;
  flex: 0 0 auto !important;
}
[data-product-card].ayra-product-card-premium > div:nth-of-type(1) { min-height: 104px !important; }
[dir="rtl"] [data-product-card].ayra-product-card-premium > div,
[dir="rtl"] [data-product-card].ayra-product-card-premium h3,
[dir="rtl"] [data-product-card].ayra-product-card-premium p { text-align: right !important; }

body[data-template="home"] .section-testimonials .embla__viewport {
  touch-action: pan-y !important;
  -webkit-overflow-scrolling: touch !important;
  overscroll-behavior-x: contain !important;
  cursor: grab;
}
body[data-template="home"] .section-testimonials .embla__viewport:active { cursor: grabbing; }
body[data-template="home"] .section-testimonials .embla__container {
  touch-action: pan-y !important;
  user-select: none;
  -webkit-user-select: none;
}
@media (max-width: 767px) {
  [data-product-card].ayra-product-card-premium > div:nth-of-type(1) { min-height: 88px !important; }
}

/* AYRA final requested corrections: loader, responsive locale, RTL mirror and motion */
html.ayra-has-element-loader:not(.ayra-page-ready)::before,
html.ayra-has-element-loader:not(.ayra-page-ready)::after {
  content: none !important;
  display: none !important;
}

@media (max-width: 1199px) {
  body header.ayra-site-header > nav > ul:has([data-search-trigger]) > li.ayra-header-language-hidden.ayra-header-language-hidden {
    display: none !important;
    width: 0 !important;
    min-width: 0 !important;
    height: 0 !important;
    overflow: hidden !important;
    visibility: hidden !important;
  }

  body .ayra-site-header > nav {
    position: relative !important;
    direction: inherit !important;
  }

  body .ayra-site-header > nav button[aria-label="Toggle menu"] {
    position: absolute !important;
    z-index: 150 !important;
    top: 12px !important;
    right: auto !important;
    left: auto !important;
    inset-inline-start: 0 !important;
    grid-column: auto !important;
    transform: none !important;
  }

  body .ayra-site-header > nav > ul:has([data-search-trigger]) {
    position: absolute !important;
    z-index: 145 !important;
    top: 12px !important;
    right: auto !important;
    left: auto !important;
    inset-inline-start: auto !important;
    inset-inline-end: 0 !important;
    display: flex !important;
    width: auto !important;
    min-width: 0 !important;
    max-width: calc(100% - 220px) !important;
    height: 40px !important;
    flex-flow: row nowrap !important;
    align-items: center !important;
    justify-content: flex-end !important;
    gap: 0 !important;
    transform: none !important;
  }

  body .ayra-site-header nav a[aria-label="Home"] {
    right: auto !important;
    left: auto !important;
    inset-inline-start: clamp(108px, 20vw, 136px) !important;
    transform: translateY(-50%) !important;
  }
}

@media (min-width: 1200px) {
  body header.ayra-site-header > nav > ul:has([data-search-trigger]) > li.ayra-header-language-hidden.ayra-header-language-hidden {
    display: flex !important;
    width: auto !important;
    min-width: 0 !important;
    height: auto !important;
    overflow: visible !important;
    visibility: visible !important;
    opacity: 1 !important;
  }

  body header.ayra-site-header li.ayra-header-language-hidden > button,
  body header.ayra-site-header li.ayra-header-language-hidden > a {
    display: flex !important;
    align-items: center !important;
    gap: 6px !important;
  }
}

@media (max-width: 767px) {
  .ayra-site-header > nav > div.flex.items-center > ul {
    transition:
      opacity .38s ease,
      transform .42s cubic-bezier(.22, .8, .3, 1),
      visibility 0s linear 0s !important;
    will-change: opacity, transform;
  }

  .ayra-site-header.ayra-categories-hidden > nav > div.flex.items-center > ul {
    opacity: 0 !important;
    visibility: hidden !important;
    transform: translateY(-6px) !important;
    transition:
      opacity .34s ease,
      transform .4s cubic-bezier(.22, .8, .3, 1),
      visibility 0s linear .4s !important;
  }
}

/* Arabic product cards use exactly the English card geometry, mirrored only. */
html[dir="rtl"] [data-product-card].ayra-product-card-premium,
html[lang^="ar"] [data-product-card].ayra-product-card-premium {
  display: flex !important;
  flex-direction: column !important;
  height: 100% !important;
  direction: rtl !important;
}

html[dir="rtl"] [data-product-card].ayra-product-card-premium > a[href*="/products/"],
html[lang^="ar"] [data-product-card].ayra-product-card-premium > a[href*="/products/"] {
  display: block !important;
  width: 100% !important;
  aspect-ratio: 4 / 5 !important;
  flex: 0 0 auto !important;
}

html[dir="rtl"] [data-product-card].ayra-product-card-premium > div,
html[lang^="ar"] [data-product-card].ayra-product-card-premium > div {
  width: 100% !important;
  direction: rtl !important;
  text-align: right !important;
}

html[dir="rtl"] [data-product-card].ayra-product-card-premium .ayra-card-swatches,
html[lang^="ar"] [data-product-card].ayra-product-card-premium .ayra-card-swatches {
  flex-direction: row !important;
  justify-content: flex-start !important;
}

html[dir="rtl"] [data-product-card].ayra-product-card-premium button[data-open-quick-view],
html[lang^="ar"] [data-product-card].ayra-product-card-premium button[data-open-quick-view] {
  width: 100% !important;
  margin-top: auto !important;
}

/* Mobile header: centered logo with protected icon space in both directions. */
@media (max-width: 767px) {
  body .ayra-site-header nav a[aria-label="Home"] {
    left: auto !important;
    right: auto !important;
    inset-inline-start: 50% !important;
    inset-inline-end: auto !important;
    width: 104px !important;
    min-width: 104px !important;
    transform: translate(-50%, -50%) !important;
  }

  html[dir="rtl"] body .ayra-site-header nav a[aria-label="Home"],
  html[lang^="ar"] body .ayra-site-header nav a[aria-label="Home"] {
    transform: translate(50%, -50%) !important;
  }

  body .ayra-site-header nav a[aria-label="Home"] img[alt="AYRA"] {
    width: 104px !important;
    min-width: 104px !important;
    max-width: 104px !important;
  }

  body .ayra-site-header > nav > ul:has([data-search-trigger]) {
    width: 126px !important;
    max-width: 126px !important;
  }

  body .ayra-site-header > nav > ul:has([data-search-trigger]) > li,
  body .ayra-site-header > nav > ul:has([data-search-trigger]) button,
  body .ayra-site-header > nav > ul:has([data-search-trigger]) a {
    width: 30px !important;
    min-width: 30px !important;
  }

  body .ayra-site-header > nav > ul:has([data-search-trigger]) > li:first-child,
  body .ayra-site-header > nav > ul:has([data-search-trigger]) > li:first-child > button[data-search-trigger] {
    width: 36px !important;
    min-width: 36px !important;
  }
}

/* One first-paint loader only: centered mark with the progress line below it. */
html:not(.ayra-page-ready)::before {
  content: "" !important;
  position: fixed !important;
  z-index: 2147483646 !important;
  inset: 0 !important;
  display: block !important;
  width: 100vw !important;
  min-width: 100vw !important;
  height: 100vh !important;
  height: 100svh !important;
  height: 100dvh !important;
  min-height: 100vh !important;
  min-height: 100dvh !important;
  background:
    linear-gradient(#171614 0 0) calc(50% - 52px) calc(50% + 56px) / 28px 1px no-repeat,
    linear-gradient(rgba(23, 22, 20, .18) 0 0) center calc(50% + 56px) / 76px 1px no-repeat,
    #f3f0eb !important;
  animation: ayra-loader-bar-final 1s cubic-bezier(.65, 0, .35, 1) infinite !important;
  pointer-events: auto !important;
}

html:not(.ayra-page-ready)::after {
  content: "" !important;
  position: fixed !important;
  z-index: 2147483647 !important;
  top: 50% !important;
  left: 50% !important;
  right: auto !important;
  display: block !important;
  width: 154px !important;
  height: 58px !important;
  background: url("https://media.zid.store/cdn-cgi/image/w=400,q=95,f=auto/https://media.zid.store/0eb24a33-8aa3-4466-92a8-85156e60070b/8eca7d57-4d94-43df-b5aa-3d2fa1af2442-200x.png") center / contain no-repeat !important;
  transform: translate(-50%, -50%) !important;
  animation: ayra-loader-logo .8s cubic-bezier(.22, .8, .3, 1) both !important;
  pointer-events: none !important;
}

@keyframes ayra-loader-bar-final {
  from {
    background-position:
      calc(50% - 52px) calc(50% + 56px),
      center calc(50% + 56px),
      0 0;
  }
  to {
    background-position:
      calc(50% + 52px) calc(50% + 56px),
      center calc(50% + 56px),
      0 0;
  }
}

/* AYRA V10 final authority — Arabic-only verified Growth elements */
@media (max-width: 767px) {
  html[lang^="ar"][dir="rtl"] header.ayra-ar-mobile-header {
    position: relative !important;
    top: auto !important;
    right: auto !important;
    bottom: auto !important;
    left: auto !important;
    inset: auto !important;
    box-sizing: border-box !important;
    width: 100% !important;
    min-height: 72px !important;
    height: 72px !important;
    max-height: 72px !important;
    margin: 0 !important;
    padding: 0 14px !important;
    overflow: hidden !important;
  }

  html[lang^="ar"][dir="rtl"] header.ayra-ar-mobile-header > nav {
    box-sizing: border-box !important;
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) 104px minmax(0, 1fr) !important;
    grid-template-rows: 72px !important;
    width: 100% !important;
    min-width: 0 !important;
    height: 72px !important;
    margin: 0 !important;
    padding: 0 !important;
    gap: 0 !important;
    direction: ltr !important;
  }

  html[lang^="ar"][dir="rtl"] header.ayra-ar-mobile-header .ayra-ar-header-logo {
    position: static !important;
    grid-column: 2 !important;
    grid-row: 1 !important;
    place-self: center !important;
    width: 104px !important;
    min-width: 104px !important;
    height: 34px !important;
    transform: none !important;
  }

  html[lang^="ar"][dir="rtl"] header.ayra-ar-mobile-header .ayra-ar-header-logo img[alt="AYRA"] {
    width: 104px !important;
    min-width: 104px !important;
    max-width: 104px !important;
    height: 34px !important;
    max-height: 34px !important;
    transform: none !important;
  }

  html[lang^="ar"][dir="rtl"] header.ayra-ar-mobile-header .ayra-ar-header-actions {
    position: static !important;
    grid-column: 1 !important;
    grid-row: 1 !important;
    place-self: center start !important;
    width: 126px !important;
    min-width: 0 !important;
    max-width: 100% !important;
    height: 42px !important;
    flex-flow: row-reverse nowrap !important;
    justify-content: flex-end !important;
    gap: 2px !important;
    transform: none !important;
  }

  html[lang^="ar"][dir="rtl"] header.ayra-ar-mobile-header .ayra-ar-header-actions > li:not(.ayra-header-language-hidden),
  html[lang^="ar"][dir="rtl"] header.ayra-ar-mobile-header .ayra-ar-header-actions :is(a, button) {
    width: 30px !important;
    min-width: 30px !important;
    height: 42px !important;
    min-height: 42px !important;
  }

  html[lang^="ar"][dir="rtl"] header.ayra-ar-mobile-header .ayra-ar-menu-action {
    position: static !important;
    grid-column: 3 !important;
    grid-row: 1 !important;
    place-self: center end !important;
    width: 44px !important;
    min-width: 44px !important;
    height: 44px !important;
    transform: none !important;
  }
}

html[lang^="ar"][dir="rtl"] [data-product-card].ayra-ar-product-card > .ayra-ar-product-media {
  aspect-ratio: 4 / 5 !important;
}

html[lang^="ar"][dir="rtl"] [data-product-card].ayra-ar-product-card .ayra-ar-product-title,
html[lang^="ar"][dir="rtl"] [data-product-card].ayra-ar-product-card .ayra-ar-product-title > a,
html[lang^="ar"][dir="rtl"] [data-product-card].ayra-ar-product-card .ayra-ar-current-price,
html[lang^="ar"][dir="rtl"] [data-product-card].ayra-ar-product-card .ayra-ar-old-price,
html[lang^="ar"][dir="rtl"] [data-product-card].ayra-ar-product-card .ayra-ar-prices,
html[lang^="ar"][dir="rtl"] [data-product-card].ayra-ar-product-card .ayra-ar-price-meta {
  text-align: center !important;
  justify-content: center !important;
  align-items: center !important;
}

@media (max-width: 369px) {
  html[lang^="ar"][dir="rtl"] header.ayra-ar-mobile-header > nav {
    grid-template-columns: minmax(0, 1fr) 96px minmax(0, 1fr) !important;
  }

  html[lang^="ar"][dir="rtl"] header.ayra-ar-mobile-header .ayra-ar-header-logo,
  html[lang^="ar"][dir="rtl"] header.ayra-ar-mobile-header .ayra-ar-header-logo img[alt="AYRA"] {
    width: 96px !important;
    min-width: 96px !important;
    max-width: 96px !important;
  }

  html[lang^="ar"][dir="rtl"] header.ayra-ar-mobile-header .ayra-ar-header-actions {
    width: 116px !important;
    gap: 0 !important;
  }

  html[lang^="ar"][dir="rtl"] header.ayra-ar-mobile-header .ayra-ar-header-actions > li:not(.ayra-header-language-hidden),
  html[lang^="ar"][dir="rtl"] header.ayra-ar-mobile-header .ayra-ar-header-actions :is(a, button) {
    width: 29px !important;
    min-width: 29px !important;
  }
}

/* AYRA V11 cascade lock: keep the verified scoped layer above later V10 rules. */
@media (max-width: 767px) {
  html[lang^="ar"][dir="rtl"] header.ayra-ar-mobile-header {
    height: 72px !important;
    min-height: 72px !important;
    padding-inline: 14px !important;
    overflow: clip !important;
    background: #f8f6f2 !important;
    border-bottom: 1px solid rgba(23,23,23,.08) !important;
    box-shadow: 0 3px 14px rgba(23,23,23,.045) !important;
  }
  html[lang^="ar"][dir="rtl"] header.ayra-ar-mobile-header > nav {
    display: grid !important;
    grid-template-columns: minmax(0,1fr) auto minmax(0,1fr) !important;
    align-items: center !important;
    direction: ltr !important;
  }
  html[lang^="ar"][dir="rtl"] header.ayra-ar-mobile-header .ayra-ar-header-logo {
    position: static !important;
    grid-column: 2 !important;
    place-self: center !important;
    width: 108px !important;
    min-width: 108px !important;
    height: 33px !important;
    margin: 0 !important;
    transform: none !important;
  }
  html[lang^="ar"][dir="rtl"] header.ayra-ar-mobile-header .ayra-ar-header-logo img[alt="AYRA"] {
    position: static !important;
    width: 108px !important;
    min-width: 108px !important;
    max-width: 108px !important;
    height: auto !important;
    max-height: 33px !important;
    margin: 0 !important;
    transform: none !important;
    object-fit: contain !important;
  }
  html[lang^="ar"][dir="rtl"] header.ayra-ar-mobile-header .ayra-ar-header-actions {
    position: static !important;
    grid-column: 1 !important;
    place-self: center start !important;
    width: auto !important;
    height: 42px !important;
    margin: 0 !important;
    gap: 3px !important;
    transform: none !important;
  }
  html[lang^="ar"][dir="rtl"] header.ayra-ar-mobile-header .ayra-ar-menu-action {
    position: static !important;
    grid-column: 3 !important;
    place-self: center end !important;
    width: 44px !important;
    min-width: 44px !important;
    height: 44px !important;
    transform: none !important;
  }
}

html:is([lang^="ar"][dir="rtl"],[lang^="en"][dir="ltr"]) [data-product-card].ayra-product-card-premium {
  display: flex !important;
  height: 100% !important;
  flex-direction: column !important;
  gap: 0 !important;
  overflow: hidden !important;
  border: 1px solid rgba(23,23,23,.055) !important;
  border-radius: 10px !important;
  background: #fff !important;
  box-shadow: 0 6px 21px rgba(23,23,23,.065) !important;
}
html:is([lang^="ar"][dir="rtl"],[lang^="en"][dir="ltr"]) [data-product-card] > .ayra-product-image {
  width: 100% !important;
  aspect-ratio: 4/5 !important;
  overflow: hidden !important;
  border-radius: 0 !important;
  background: #f1eee8 !important;
}
html:is([lang^="ar"][dir="rtl"],[lang^="en"][dir="ltr"]) [data-product-card] > .ayra-product-image [data-wishlist-btn] {
  top: 14px !important;
  right: 14px !important;
  bottom: auto !important;
  left: auto !important;
  width: 42px !important;
  height: 42px !important;
  border: 1px solid rgba(23,23,23,.09) !important;
  border-radius: 50% !important;
  background: rgba(248,246,242,.94) !important;
  box-shadow: 0 3px 10px rgba(23,23,23,.07) !important;
}
html:is([lang^="ar"][dir="rtl"],[lang^="en"][dir="ltr"]) [data-product-card] > .ayra-product-info {
  display: flex !important;
  min-height: 176px !important;
  padding: 12px 14px 10px !important;
  flex: 1 1 auto !important;
  flex-direction: column !important;
  gap: 9px !important;
  text-align: center !important;
}
html:is([lang^="ar"][dir="rtl"],[lang^="en"][dir="ltr"]) [data-product-card] .ayra-product-title {
  width: 100% !important;
  min-height: 48px !important;
  margin: 0 !important;
  font-size: 15px !important;
  font-weight: 500 !important;
  line-height: 1.6 !important;
  text-align: center !important;
}
html:is([lang^="ar"][dir="rtl"],[lang^="en"][dir="ltr"]) [data-product-card] :is(.ayra-product-price-area,.ayra-product-price-meta) {
  display: flex !important;
  width: 100% !important;
  flex-flow: row wrap !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 6px 9px !important;
  text-align: center !important;
}
html:is([lang^="ar"][dir="rtl"],[lang^="en"][dir="ltr"]) [data-product-card] > div:has(> .ayra-product-action) {
  margin-top: auto !important;
  padding: 0 14px 14px !important;
}
html:is([lang^="ar"][dir="rtl"],[lang^="en"][dir="ltr"]) [data-product-card] .ayra-product-action {
  width: 100% !important;
  min-height: 49px !important;
  border: 1px solid rgba(23,23,23,.72) !important;
  border-radius: 5px !important;
  background: #fff !important;
  color: #171717 !important;
}

@media (max-width: 369px) {
  html[lang^="ar"][dir="rtl"] header.ayra-ar-mobile-header .ayra-ar-header-logo,
  html[lang^="ar"][dir="rtl"] header.ayra-ar-mobile-header .ayra-ar-header-logo img[alt="AYRA"] {
    width: 96px !important;
    min-width: 96px !important;
    max-width: 96px !important;
  }
}

/* V11 interaction and typography details kept with the single final layer. */
html:is([lang^="ar"][dir="rtl"],[lang^="en"][dir="ltr"]) [data-product-card].ayra-product-card-premium {
  transition: transform 220ms ease, box-shadow 220ms ease !important;
}
html:is([lang^="ar"][dir="rtl"],[lang^="en"][dir="ltr"]) [data-product-card] > .ayra-product-image > img {
  display: block !important;
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  object-position: center !important;
}
html:is([lang^="ar"][dir="rtl"],[lang^="en"][dir="ltr"]) [data-product-card] > .ayra-product-image .ayra-card-discount-badge {
  top: 14px !important;
  right: auto !important;
  left: 14px !important;
  padding: 8px 12px !important;
  border-radius: 6px !important;
  background: rgba(248,246,242,.95) !important;
  color: #171717 !important;
  font-size: 13px !important;
  font-weight: 500 !important;
}
html:is([lang^="ar"][dir="rtl"],[lang^="en"][dir="ltr"]) [data-product-card] .ayra-product-price-area > p {
  margin: 0 !important;
  color: #171717 !important;
  font-size: 16px !important;
  font-weight: 600 !important;
  text-align: center !important;
}
html:is([lang^="ar"][dir="rtl"],[lang^="en"][dir="ltr"]) [data-product-card] .ayra-product-price-meta span[class*="line-through"] {
  color: #9a9792 !important;
  font-size: 13px !important;
}
html:is([lang^="ar"][dir="rtl"],[lang^="en"][dir="ltr"]) [data-product-card] .ayra-product-action {
  font-size: 15px !important;
  font-weight: 500 !important;
  text-align: center !important;
  transition: background-color 200ms ease, color 200ms ease !important;
}

@media (hover: hover) and (pointer: fine) {
  html:is([lang^="ar"][dir="rtl"],[lang^="en"][dir="ltr"]) [data-product-card].ayra-product-card-premium:hover {
    transform: translateY(-2px) !important;
    box-shadow: 0 10px 27px rgba(23,23,23,.085) !important;
  }
  html:is([lang^="ar"][dir="rtl"],[lang^="en"][dir="ltr"]) [data-product-card] .ayra-product-action:hover {
    background: #202020 !important;
    color: #fff !important;
  }
}

@media (prefers-reduced-motion: reduce) {
  [data-product-card].ayra-product-card-premium,
  [data-product-card].ayra-product-card-premium .ayra-product-action {
    transition: none !important;
    transform: none !important;
  }
}

/* AYRA V12 — one responsive header and card system for both store languages. */
@media (max-width: 767px) {
  html:is([lang^="ar"][dir="rtl"],[lang^="en"][dir="ltr"]) header.ayra-unified-mobile-header {
    position: relative !important;
    box-sizing: border-box !important;
    width: 100% !important;
    height: 72px !important;
    min-height: 72px !important;
    padding-inline: 14px !important;
    overflow: clip !important;
    background: #f8f6f2 !important;
    border-bottom: 1px solid rgba(23,23,23,.08) !important;
    box-shadow: 0 3px 14px rgba(23,23,23,.045) !important;
  }

  html:is([lang^="ar"][dir="rtl"],[lang^="en"][dir="ltr"]) header.ayra-unified-mobile-header > nav {
    position: relative !important;
    display: block !important;
    width: 100% !important;
    height: 72px !important;
    margin: 0 !important;
    padding: 0 !important;
    align-items: center !important;
    direction: ltr !important;
  }

  html:is([lang^="ar"][dir="rtl"],[lang^="en"][dir="ltr"]) header.ayra-unified-mobile-header .ayra-mobile-header-logo {
    position: absolute !important;
    z-index: 160 !important;
    top: 50% !important;
    right: auto !important;
    left: 50% !important;
    inset-inline-start: auto !important;
    inset-inline-end: auto !important;
    width: 108px !important;
    min-width: 108px !important;
    height: 33px !important;
    margin: 0 !important;
    padding: 0 !important;
    transform: translate(-50%, -50%) !important;
  }

  html:is([lang^="ar"][dir="rtl"],[lang^="en"][dir="ltr"]) header.ayra-unified-mobile-header .ayra-mobile-header-logo img[alt="AYRA"] {
    position: static !important;
    display: block !important;
    width: 108px !important;
    min-width: 108px !important;
    max-width: 108px !important;
    height: auto !important;
    max-height: 33px !important;
    margin: 0 !important;
    transform: none !important;
    object-fit: contain !important;
  }

  html:is([lang^="ar"][dir="rtl"],[lang^="en"][dir="ltr"]) header.ayra-unified-mobile-header .ayra-mobile-header-actions {
    position: absolute !important;
    z-index: 165 !important;
    top: 15px !important;
    right: 0 !important;
    left: auto !important;
    inset-inline-start: auto !important;
    inset-inline-end: auto !important;
    display: flex !important;
    width: auto !important;
    min-width: 0 !important;
    height: 42px !important;
    margin: 0 !important;
    padding: 0 !important;
    flex-flow: row nowrap !important;
    align-items: center !important;
    justify-content: flex-end !important;
    gap: 3px !important;
    transform: none !important;
  }

  html:is([lang^="ar"][dir="rtl"],[lang^="en"][dir="ltr"]) header.ayra-unified-mobile-header .ayra-mobile-header-actions > li,
  html:is([lang^="ar"][dir="rtl"],[lang^="en"][dir="ltr"]) header.ayra-unified-mobile-header .ayra-mobile-header-actions :is(a,button) {
    display: flex !important;
    width: 30px !important;
    min-width: 30px !important;
    height: 42px !important;
    min-height: 42px !important;
    margin: 0 !important;
    padding: 4px !important;
    align-items: center !important;
    justify-content: center !important;
    background: transparent !important;
    color: #171717 !important;
  }

  html:is([lang^="ar"][dir="rtl"],[lang^="en"][dir="ltr"]) header.ayra-unified-mobile-header .ayra-mobile-header-actions > li.ayra-header-language-hidden {
    display: flex !important;
    overflow: visible !important;
    visibility: visible !important;
    opacity: 1 !important;
  }

  html:is([lang^="ar"][dir="rtl"],[lang^="en"][dir="ltr"]) header.ayra-unified-mobile-header .ayra-mobile-menu-action {
    position: absolute !important;
    z-index: 165 !important;
    top: 14px !important;
    right: auto !important;
    left: 0 !important;
    inset-inline-start: auto !important;
    inset-inline-end: auto !important;
    width: 44px !important;
    min-width: 44px !important;
    height: 44px !important;
    margin: 0 !important;
    transform: none !important;
  }
}

html:is([lang^="ar"][dir="rtl"],[lang^="en"][dir="ltr"]) [data-product-card] .ayra-product-swatches {
  display: flex !important;
  box-sizing: border-box !important;
  width: 100% !important;
  min-height: 34px !important;
  padding: 12px 14px 3px !important;
  flex-wrap: wrap !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 7px !important;
}

html:is([lang^="ar"][dir="rtl"],[lang^="en"][dir="ltr"]) [data-product-card] .ayra-product-swatch {
  display: inline-flex !important;
  box-sizing: border-box !important;
  width: 20px !important;
  min-width: 20px !important;
  height: 20px !important;
  align-items: center !important;
  justify-content: center !important;
  overflow: hidden !important;
  border: 1px solid rgba(23,23,23,.35) !important;
  border-radius: 50% !important;
  color: #5f5a54 !important;
  font-size: 9px !important;
  font-weight: 600 !important;
  line-height: 1 !important;
}

html:is([lang^="ar"][dir="rtl"],[lang^="en"][dir="ltr"]) [data-product-card] .ayra-product-swatch--named {
  background: #f1eee8 !important;
}

@media (max-width: 369px) {
  html:is([lang^="ar"][dir="rtl"],[lang^="en"][dir="ltr"]) header.ayra-unified-mobile-header {
    padding-inline: 12px !important;
  }
  html:is([lang^="ar"][dir="rtl"],[lang^="en"][dir="ltr"]) header.ayra-unified-mobile-header .ayra-mobile-header-logo,
  html:is([lang^="ar"][dir="rtl"],[lang^="en"][dir="ltr"]) header.ayra-unified-mobile-header .ayra-mobile-header-logo img[alt="AYRA"] {
    width: 88px !important;
    min-width: 88px !important;
    max-width: 88px !important;
  }
  html:is([lang^="ar"][dir="rtl"],[lang^="en"][dir="ltr"]) header.ayra-unified-mobile-header .ayra-mobile-header-actions {
    gap: 2px !important;
  }
  html:is([lang^="ar"][dir="rtl"],[lang^="en"][dir="ltr"]) header.ayra-unified-mobile-header .ayra-mobile-header-actions > li,
  html:is([lang^="ar"][dir="rtl"],[lang^="en"][dir="ltr"]) header.ayra-unified-mobile-header .ayra-mobile-header-actions :is(a,button) {
    width: 25px !important;
    min-width: 25px !important;
  }
}

/* Final mobile category strip: overlay the top of the hero banner. */
@media (max-width: 767px) {
  html:is([lang^="ar"][dir="rtl"],[lang^="en"][dir="ltr"]) header.ayra-unified-mobile-header,
  html:is([lang^="ar"][dir="rtl"],[lang^="en"][dir="ltr"]) header.ayra-unified-mobile-header > nav {
    overflow: visible !important;
  }

  html:is([lang^="ar"][dir="rtl"],[lang^="en"][dir="ltr"]) header.ayra-unified-mobile-header > nav > div.flex.items-center > ul {
    position: absolute !important;
    z-index: 155 !important;
    top: 72px !important;
    right: -14px !important;
    bottom: auto !important;
    left: -14px !important;
    display: flex !important;
    width: auto !important;
    height: 50px !important;
    margin: 0 !important;
    padding: 0 20px !important;
    overflow-x: auto !important;
    overflow-y: hidden !important;
    flex-flow: row nowrap !important;
    align-items: center !important;
    justify-content: flex-start !important;
    gap: clamp(30px, 10vw, 72px) !important;
    background: transparent !important;
    box-shadow: none !important;
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
    scrollbar-width: none !important;
  }

  html[lang^="ar"][dir="rtl"] header.ayra-unified-mobile-header > nav > div.flex.items-center > ul {
    direction: rtl !important;
  }

  html[lang^="en"][dir="ltr"] header.ayra-unified-mobile-header > nav > div.flex.items-center > ul {
    direction: ltr !important;
  }

  html:is([lang^="ar"][dir="rtl"],[lang^="en"][dir="ltr"]) header.ayra-unified-mobile-header > nav > div.flex.items-center > ul::-webkit-scrollbar {
    display: none !important;
  }

  html:is([lang^="ar"][dir="rtl"],[lang^="en"][dir="ltr"]) header.ayra-unified-mobile-header > nav > div.flex.items-center > ul > li {
    flex: 0 0 auto !important;
  }

  html:is([lang^="ar"][dir="rtl"],[lang^="en"][dir="ltr"]) header.ayra-unified-mobile-header > nav > div.flex.items-center > ul :is(a,button) {
    min-height: 50px !important;
    padding: 10px 0 !important;
    color: #171717 !important;
    font-size: 14px !important;
    font-weight: 500 !important;
    white-space: nowrap !important;
  }
}

@media (max-width: 369px) {
  html:is([lang^="ar"][dir="rtl"],[lang^="en"][dir="ltr"]) header.ayra-unified-mobile-header > nav > div.flex.items-center > ul {
    right: -12px !important;
    left: -12px !important;
    padding-inline: 16px !important;
    gap: 28px !important;
  }
}

/* Mobile header: hide the account/login icon and collapse its slot. */
@media (max-width: 767px) {
  body header:is(.ayra-site-header, .ayra-unified-mobile-header) #header-login-btn,
  body header:is(.ayra-site-header, .ayra-unified-mobile-header) a[href*="/account"]:not([aria-label="Wishlist"]),
  body header:is(.ayra-site-header, .ayra-unified-mobile-header) :is(a, button):has(path[d^="M11.999 13.9229"]) {
    display: none !important;
  }

  body header:is(.ayra-site-header, .ayra-unified-mobile-header) li:has(> #header-login-btn),
  body header:is(.ayra-site-header, .ayra-unified-mobile-header) li:has(> a[href*="/account"]:not([aria-label="Wishlist"])),
  body header:is(.ayra-site-header, .ayra-unified-mobile-header) li:has(> :is(a, button) path[d^="M11.999 13.9229"]) {
    display: none !important;
    width: 0 !important;
    min-width: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
  }
}

/* Mobile header final controls: menu + wishlist + cart only. */
@media (max-width: 767px) {
  body header.ayra-unified-mobile-header .ayra-mobile-header-actions {
    top: 14px !important;
    right: 0 !important;
    left: auto !important;
    display: flex !important;
    width: 72px !important;
    min-width: 72px !important;
    height: 44px !important;
    padding: 0 !important;
    align-items: center !important;
    justify-content: flex-end !important;
    gap: 0 !important;
  }

  body header.ayra-unified-mobile-header .ayra-mobile-header-actions > li {
    display: none !important;
  }

  body header.ayra-unified-mobile-header .ayra-mobile-header-actions > li.ayra-header-wishlist,
  body header.ayra-unified-mobile-header .ayra-mobile-header-actions > li:has(> a[href*="/cart"]) {
    display: flex !important;
    width: 36px !important;
    min-width: 36px !important;
    height: 44px !important;
    margin: 0 !important;
    padding: 0 !important;
    align-items: center !important;
    justify-content: center !important;
    overflow: visible !important;
    visibility: visible !important;
    opacity: 1 !important;
  }

  body header.ayra-unified-mobile-header .ayra-mobile-header-actions :is(.ayra-header-wishlist > a, a[href*="/cart"]) {
    width: 36px !important;
    min-width: 36px !important;
    height: 44px !important;
    min-height: 44px !important;
    margin: 0 !important;
    padding: 7px !important;
    align-items: center !important;
    justify-content: center !important;
    color: #171717 !important;
    background: transparent !important;
    border: 0 !important;
    visibility: visible !important;
    opacity: 1 !important;
  }

  body header.ayra-unified-mobile-header .ayra-mobile-header-actions svg {
    display: block !important;
    width: 22px !important;
    height: 22px !important;
    color: #171717 !important;
  }

  body header.ayra-unified-mobile-header .ayra-mobile-menu-action {
    top: 14px !important;
    left: 0 !important;
    right: auto !important;
    display: block !important;
    width: 44px !important;
    min-width: 44px !important;
    height: 44px !important;
    padding: 10px !important;
    color: #171717 !important;
    visibility: visible !important;
    opacity: 1 !important;
  }

  /* The locale control remains available only inside the side menu. */
  body header.ayra-unified-mobile-header .ayra-mobile-header-actions > li:has(button[onclick*="Region"]),
  body header.ayra-unified-mobile-header .ayra-mobile-header-actions > li.ayra-header-language-hidden,
  body header.ayra-unified-mobile-header .ayra-mobile-header-actions > li:has([data-search-trigger]),
  body header.ayra-unified-mobile-header .ayra-mobile-header-actions > li:has(> #header-login-btn),
  body header.ayra-unified-mobile-header .ayra-mobile-header-actions > li:has(> #header-profile-btn),
  body header.ayra-unified-mobile-header .ayra-mobile-header-actions > li:has(path[d^="M11.999 13.9229"]) {
    display: none !important;
  }
}

/* English mobile header only: Menu + Account | centered logo | Wishlist + Cart. */
@media (max-width: 767px) {
  html[lang^="en"][dir="ltr"] body header.ayra-unified-mobile-header > nav {
    position: relative !important;
  }

  html[lang^="en"][dir="ltr"] body header.ayra-unified-mobile-header .ayra-mobile-header-logo {
    position: absolute !important;
    z-index: 160 !important;
    top: 50% !important;
    right: auto !important;
    left: 50% !important;
    inset-inline-start: auto !important;
    inset-inline-end: auto !important;
    margin: 0 !important;
    transform: translate(-50%, -50%) !important;
  }

  /* Let the existing action items position against the existing nav. */
  html[lang^="en"][dir="ltr"] body header.ayra-unified-mobile-header .ayra-mobile-header-actions {
    position: static !important;
    display: contents !important;
    width: auto !important;
    min-width: 0 !important;
    height: auto !important;
    margin: 0 !important;
    padding: 0 !important;
  }

  html[lang^="en"][dir="ltr"] body header.ayra-unified-mobile-header .ayra-mobile-menu-action,
  html[lang^="en"][dir="ltr"] body header.ayra-unified-mobile-header .ayra-mobile-header-actions > li:has(> #header-login-btn),
  html[lang^="en"][dir="ltr"] body header.ayra-unified-mobile-header .ayra-mobile-header-actions > li:has(> #header-profile-btn),
  html[lang^="en"][dir="ltr"] body header.ayra-unified-mobile-header .ayra-mobile-header-actions > li.ayra-header-wishlist,
  html[lang^="en"][dir="ltr"] body header.ayra-unified-mobile-header .ayra-mobile-header-actions > li:has(> a[href*="/cart"]) {
    position: absolute !important;
    z-index: 165 !important;
    top: 14px !important;
    display: flex !important;
    width: 40px !important;
    min-width: 40px !important;
    height: 44px !important;
    min-height: 44px !important;
    margin: 0 !important;
    padding: 0 !important;
    align-items: center !important;
    justify-content: center !important;
    overflow: visible !important;
    visibility: visible !important;
    opacity: 1 !important;
    transform: none !important;
  }

  html[lang^="en"][dir="ltr"] body header.ayra-unified-mobile-header .ayra-mobile-menu-action {
    right: auto !important;
    left: 0 !important;
    display: block !important;
    padding: 10px !important;
  }

  html[lang^="en"][dir="ltr"] body header.ayra-unified-mobile-header .ayra-mobile-header-actions > li:has(> #header-login-btn),
  html[lang^="en"][dir="ltr"] body header.ayra-unified-mobile-header .ayra-mobile-header-actions > li:has(> #header-profile-btn) {
    right: auto !important;
    left: 40px !important;
  }

  html[lang^="en"][dir="ltr"] body header.ayra-unified-mobile-header .ayra-mobile-header-actions > li.ayra-header-wishlist {
    right: 40px !important;
    left: auto !important;
  }

  html[lang^="en"][dir="ltr"] body header.ayra-unified-mobile-header .ayra-mobile-header-actions > li:has(> a[href*="/cart"]) {
    right: 0 !important;
    left: auto !important;
  }

  html[lang^="en"][dir="ltr"] body header.ayra-unified-mobile-header .ayra-mobile-header-actions :is(#header-login-btn, #header-profile-btn, .ayra-header-wishlist > a, a[href*="/cart"]) {
    width: 40px !important;
    min-width: 40px !important;
    height: 44px !important;
    min-height: 44px !important;
    margin: 0 !important;
    padding: 8px !important;
    align-items: center !important;
    justify-content: center !important;
    color: #171717 !important;
    background: transparent !important;
    border: 0 !important;
    visibility: visible !important;
    opacity: 1 !important;
  }

  html[lang^="en"][dir="ltr"] body header.ayra-unified-mobile-header #header-login-btn:not(.hidden),
  html[lang^="en"][dir="ltr"] body header.ayra-unified-mobile-header #header-profile-btn:not(.hidden) {
    display: flex !important;
  }

  html[lang^="en"][dir="ltr"] body header.ayra-unified-mobile-header #header-login-btn.hidden,
  html[lang^="en"][dir="ltr"] body header.ayra-unified-mobile-header #header-profile-btn.hidden {
    display: none !important;
  }

  /* Search and language stay out of the English mobile header with no empty slot. */
  html[lang^="en"][dir="ltr"] body header.ayra-unified-mobile-header .ayra-mobile-header-actions > li:has([data-search-trigger]),
  html[lang^="en"][dir="ltr"] body header.ayra-unified-mobile-header .ayra-mobile-header-actions > li:has(button[onclick*="Region"]),
  html[lang^="en"][dir="ltr"] body header.ayra-unified-mobile-header .ayra-mobile-header-actions > li.ayra-header-language-hidden {
    display: none !important;
    width: 0 !important;
    min-width: 0 !important;
    height: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    overflow: hidden !important;
    visibility: hidden !important;
  }
}

/* Arabic mobile header only: Cart + Wishlist | centered logo | Account + Menu. */
@media (max-width: 767px) {
  html[lang^="ar"][dir="rtl"] body header.ayra-unified-mobile-header > nav {
    position: relative !important;
  }

  html[lang^="ar"][dir="rtl"] body header.ayra-unified-mobile-header .ayra-mobile-header-logo {
    position: absolute !important;
    z-index: 160 !important;
    top: 50% !important;
    right: auto !important;
    left: 50% !important;
    inset-inline-start: auto !important;
    inset-inline-end: auto !important;
    margin: 0 !important;
    transform: translate(-50%, -50%) !important;
  }

  /* Reuse the existing action items and position each one without mirroring. */
  html[lang^="ar"][dir="rtl"] body header.ayra-unified-mobile-header .ayra-mobile-header-actions {
    position: static !important;
    display: contents !important;
    width: auto !important;
    min-width: 0 !important;
    height: auto !important;
    margin: 0 !important;
    padding: 0 !important;
    transform: none !important;
  }

  html[lang^="ar"][dir="rtl"] body header.ayra-unified-mobile-header .ayra-mobile-menu-action,
  html[lang^="ar"][dir="rtl"] body header.ayra-unified-mobile-header .ayra-mobile-header-actions > li:has(> #header-login-btn),
  html[lang^="ar"][dir="rtl"] body header.ayra-unified-mobile-header .ayra-mobile-header-actions > li:has(> #header-profile-btn),
  html[lang^="ar"][dir="rtl"] body header.ayra-unified-mobile-header .ayra-mobile-header-actions > li.ayra-header-wishlist,
  html[lang^="ar"][dir="rtl"] body header.ayra-unified-mobile-header .ayra-mobile-header-actions > li:has(> a[href*="/cart"]) {
    position: absolute !important;
    z-index: 165 !important;
    top: 14px !important;
    display: flex !important;
    width: 40px !important;
    min-width: 40px !important;
    height: 44px !important;
    min-height: 44px !important;
    margin: 0 !important;
    padding: 0 !important;
    align-items: center !important;
    justify-content: center !important;
    overflow: visible !important;
    visibility: visible !important;
    opacity: 1 !important;
    transform: none !important;
  }

  /* Right edge: Account, then Menu (furthest right). */
  html[lang^="ar"][dir="rtl"] body header.ayra-unified-mobile-header .ayra-mobile-menu-action {
    right: 0 !important;
    left: auto !important;
    display: block !important;
    padding: 10px !important;
  }

  html[lang^="ar"][dir="rtl"] body header.ayra-unified-mobile-header .ayra-mobile-header-actions > li:has(> #header-login-btn),
  html[lang^="ar"][dir="rtl"] body header.ayra-unified-mobile-header .ayra-mobile-header-actions > li:has(> #header-profile-btn) {
    right: 40px !important;
    left: auto !important;
  }

  /* Left edge: Cart (furthest left), then Wishlist. */
  html[lang^="ar"][dir="rtl"] body header.ayra-unified-mobile-header .ayra-mobile-header-actions > li.ayra-header-wishlist {
    right: auto !important;
    left: 40px !important;
  }

  html[lang^="ar"][dir="rtl"] body header.ayra-unified-mobile-header .ayra-mobile-header-actions > li:has(> a[href*="/cart"]) {
    right: auto !important;
    left: 0 !important;
  }

  html[lang^="ar"][dir="rtl"] body header.ayra-unified-mobile-header .ayra-mobile-header-actions :is(#header-login-btn, #header-profile-btn, .ayra-header-wishlist > a, a[href*="/cart"]) {
    width: 40px !important;
    min-width: 40px !important;
    height: 44px !important;
    min-height: 44px !important;
    margin: 0 !important;
    padding: 8px !important;
    align-items: center !important;
    justify-content: center !important;
    color: #171717 !important;
    background: transparent !important;
    border: 0 !important;
    visibility: visible !important;
    opacity: 1 !important;
    transform: none !important;
  }

  html[lang^="ar"][dir="rtl"] body header.ayra-unified-mobile-header #header-login-btn:not(.hidden),
  html[lang^="ar"][dir="rtl"] body header.ayra-unified-mobile-header #header-profile-btn:not(.hidden) {
    display: flex !important;
  }

  html[lang^="ar"][dir="rtl"] body header.ayra-unified-mobile-header #header-login-btn.hidden,
  html[lang^="ar"][dir="rtl"] body header.ayra-unified-mobile-header #header-profile-btn.hidden {
    display: none !important;
  }

  /* Remove the Arabic mobile header language/search slots completely. */
  html[lang^="ar"][dir="rtl"] body header.ayra-unified-mobile-header .ayra-mobile-header-actions > li:has([data-search-trigger]),
  html[lang^="ar"][dir="rtl"] body header.ayra-unified-mobile-header .ayra-mobile-header-actions > li:has(button[onclick*="Region"]),
  html[lang^="ar"][dir="rtl"] body header.ayra-unified-mobile-header .ayra-mobile-header-actions > li.ayra-header-language-hidden {
    display: none !important;
    width: 0 !important;
    min-width: 0 !important;
    height: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    overflow: hidden !important;
    visibility: hidden !important;
  }
}

/* Mobile logo authority: center the real logo link, regardless of translated aria-label. */
@media (max-width: 767px) {
  html:is([lang^="en"][dir="ltr"], [lang^="ar"][dir="rtl"]) body header:is(.ayra-site-header, .ayra-unified-mobile-header) > nav {
    position: relative !important;
  }

  html:is([lang^="en"][dir="ltr"], [lang^="ar"][dir="rtl"]) body header:is(.ayra-site-header, .ayra-unified-mobile-header) > nav a:has(> img[alt="AYRA"]) {
    position: absolute !important;
    z-index: 170 !important;
    top: 50% !important;
    right: auto !important;
    bottom: auto !important;
    left: 50% !important;
    display: block !important;
    width: 106px !important;
    min-width: 106px !important;
    height: 44px !important;
    margin: 0 !important;
    padding: 0 !important;
    transform: translate(-50%, -50%) !important;
  }

  html:is([lang^="en"][dir="ltr"], [lang^="ar"][dir="rtl"]) body header:is(.ayra-site-header, .ayra-unified-mobile-header) > nav a:has(> img[alt="AYRA"]) > img[alt="AYRA"] {
    position: static !important;
    top: auto !important;
    right: auto !important;
    bottom: auto !important;
    left: auto !important;
    inset: auto !important;
    display: block !important;
    width: 106px !important;
    min-width: 106px !important;
    max-width: 106px !important;
    height: 44px !important;
    max-height: 44px !important;
    margin: 0 !important;
    transform: none !important;
    translate: none !important;
    object-fit: contain !important;
  }
}

/* Arabic mobile categories: keep all four items inside the viewport. */
@media (max-width: 767px) {
  html[lang^="ar"][dir="rtl"] body header.ayra-unified-mobile-header > nav > div.flex.items-center > ul {
    right: -14px !important;
    left: -14px !important;
    display: grid !important;
    grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
    width: auto !important;
    max-width: none !important;
    padding: 0 8px !important;
    overflow-x: hidden !important;
    overflow-y: visible !important;
    align-items: center !important;
    justify-content: stretch !important;
    gap: 0 !important;
    direction: rtl !important;
    scrollbar-width: none !important;
  }

  html[lang^="ar"][dir="rtl"] body header.ayra-unified-mobile-header > nav > div.flex.items-center > ul > li {
    display: block !important;
    width: auto !important;
    min-width: 0 !important;
    max-width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
  }

  html[lang^="ar"][dir="rtl"] body header.ayra-unified-mobile-header > nav > div.flex.items-center > ul el-dropdown,
  html[lang^="ar"][dir="rtl"] body header.ayra-unified-mobile-header > nav > div.flex.items-center > ul :is(a, button) {
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
  }

  html[lang^="ar"][dir="rtl"] body header.ayra-unified-mobile-header > nav > div.flex.items-center > ul :is(a, button) {
    display: flex !important;
    min-height: 50px !important;
    padding: 8px 2px !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 2px !important;
    font-size: clamp(10px, 3vw, 12px) !important;
    line-height: 1.2 !important;
    text-align: center !important;
    white-space: nowrap !important;
  }
}

/* Arabic desktop header: match the supplied single-row reference. */
@media (min-width: 1200px) {
  html[lang^="ar"][dir="rtl"] body header:is(.ayra-site-header, .ayra-unified-mobile-header) {
    position: relative !important;
    inset: auto !important;
    width: 100% !important;
    min-height: 82px !important;
    height: 82px !important;
    padding: 0 clamp(28px, 3.5vw, 72px) !important;
    overflow: visible !important;
    color: #171717 !important;
    background: #f8f6f2 !important;
    border: 0 !important;
    border-bottom: 1px solid rgba(23, 23, 23, .16) !important;
    box-shadow: none !important;
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
  }

  html[lang^="ar"][dir="rtl"] body header:is(.ayra-site-header, .ayra-unified-mobile-header) > nav {
    position: relative !important;
    display: grid !important;
    grid-template-columns: minmax(520px, 45%) minmax(390px, 1fr) 120px !important;
    width: 100% !important;
    max-width: 1800px !important;
    min-height: 82px !important;
    height: 82px !important;
    margin: 0 auto !important;
    padding: 0 !important;
    align-items: center !important;
    gap: clamp(16px, 1.8vw, 36px) !important;
    direction: ltr !important;
  }

  html[lang^="ar"][dir="rtl"] body header:is(.ayra-site-header, .ayra-unified-mobile-header) > nav > div.flex.items-center {
    display: contents !important;
  }

  html[lang^="ar"][dir="rtl"] body header:is(.ayra-site-header, .ayra-unified-mobile-header) > nav a:has(> img[alt="AYRA"]) {
    position: static !important;
    grid-column: 3 !important;
    grid-row: 1 !important;
    justify-self: end !important;
    display: block !important;
    width: 106px !important;
    min-width: 106px !important;
    height: 44px !important;
    margin: 0 !important;
    padding: 0 !important;
    transform: none !important;
  }

  html[lang^="ar"][dir="rtl"] body header:is(.ayra-site-header, .ayra-unified-mobile-header) > nav a:has(> img[alt="AYRA"]) > img[alt="AYRA"] {
    position: static !important;
    display: block !important;
    width: 106px !important;
    min-width: 106px !important;
    max-width: 106px !important;
    height: 44px !important;
    max-height: 44px !important;
    margin: 0 !important;
    transform: none !important;
    translate: none !important;
    object-fit: contain !important;
  }

  html[lang^="ar"][dir="rtl"] body header:is(.ayra-site-header, .ayra-unified-mobile-header) > nav > div.flex.items-center > ul {
    position: static !important;
    grid-column: 2 !important;
    grid-row: 1 !important;
    justify-self: stretch !important;
    display: flex !important;
    width: 100% !important;
    min-width: 0 !important;
    height: 82px !important;
    margin: 0 !important;
    padding: 0 !important;
    overflow: visible !important;
    flex-flow: row nowrap !important;
    align-items: center !important;
    justify-content: center !important;
    gap: clamp(24px, 2.6vw, 50px) !important;
    direction: rtl !important;
    transform: none !important;
  }

  html[lang^="ar"][dir="rtl"] body header:is(.ayra-site-header, .ayra-unified-mobile-header) > nav > div.flex.items-center > ul > li {
    flex: 0 0 auto !important;
  }

  html[lang^="ar"][dir="rtl"] body header:is(.ayra-site-header, .ayra-unified-mobile-header) > nav > div.flex.items-center > ul :is(a, button) {
    min-height: 42px !important;
    padding: 8px 0 !important;
    color: #171717 !important;
    font-size: 14px !important;
    font-weight: 500 !important;
    line-height: 1 !important;
    white-space: nowrap !important;
    background: transparent !important;
  }

  html[lang^="ar"][dir="rtl"] body header:is(.ayra-site-header, .ayra-unified-mobile-header) > nav > ul:has([data-search-trigger]) {
    position: static !important;
    grid-column: 1 !important;
    grid-row: 1 !important;
    display: flex !important;
    width: 100% !important;
    min-width: 0 !important;
    height: 82px !important;
    margin: 0 !important;
    padding: 0 !important;
    flex-flow: row nowrap !important;
    align-items: center !important;
    justify-content: flex-start !important;
    gap: 8px !important;
    direction: ltr !important;
    transform: none !important;
  }

  html[lang^="ar"][dir="rtl"] body header:is(.ayra-site-header, .ayra-unified-mobile-header) > nav > ul:has([data-search-trigger]) > li {
    position: static !important;
    display: flex !important;
    width: 40px !important;
    min-width: 40px !important;
    height: 44px !important;
    margin: 0 !important;
    padding: 0 !important;
    align-items: center !important;
    justify-content: center !important;
    visibility: visible !important;
    opacity: 1 !important;
  }

  html[lang^="ar"][dir="rtl"] body header:is(.ayra-site-header, .ayra-unified-mobile-header) > nav > ul:has([data-search-trigger]) > li:has(> a[href*="/cart"]) { order: 1 !important; }
  html[lang^="ar"][dir="rtl"] body header:is(.ayra-site-header, .ayra-unified-mobile-header) > nav > ul:has([data-search-trigger]) > li.ayra-header-wishlist { order: 2 !important; }
  html[lang^="ar"][dir="rtl"] body header:is(.ayra-site-header, .ayra-unified-mobile-header) > nav > ul:has([data-search-trigger]) > li:has(> #header-login-btn),
  html[lang^="ar"][dir="rtl"] body header:is(.ayra-site-header, .ayra-unified-mobile-header) > nav > ul:has([data-search-trigger]) > li:has(> #header-profile-btn) { order: 3 !important; }
  html[lang^="ar"][dir="rtl"] body header:is(.ayra-site-header, .ayra-unified-mobile-header) > nav > ul:has([data-search-trigger]) > li:has(button[onclick*="Region"]) { order: 4 !important; }
  html[lang^="ar"][dir="rtl"] body header:is(.ayra-site-header, .ayra-unified-mobile-header) > nav > ul:has([data-search-trigger]) > li:has([data-search-trigger]) {
    order: 5 !important;
    flex: 1 1 auto !important;
    width: auto !important;
    min-width: 260px !important;
    max-width: 570px !important;
    margin-left: auto !important;
  }

  html[lang^="ar"][dir="rtl"] body header:is(.ayra-site-header, .ayra-unified-mobile-header) > nav > ul:has([data-search-trigger]) :is(a, button) {
    display: flex !important;
    width: 40px !important;
    min-width: 40px !important;
    height: 44px !important;
    min-height: 44px !important;
    margin: 0 !important;
    padding: 8px !important;
    align-items: center !important;
    justify-content: center !important;
    color: #171717 !important;
    background: transparent !important;
    border: 0 !important;
    visibility: visible !important;
    opacity: 1 !important;
    transform: none !important;
  }

  html[lang^="ar"][dir="rtl"] body header:is(.ayra-site-header, .ayra-unified-mobile-header) > nav > ul:has([data-search-trigger]) > li:first-child > button[data-search-trigger] {
    position: relative !important;
    display: flex !important;
    width: 100% !important;
    min-width: 260px !important;
    max-width: 570px !important;
    height: 46px !important;
    min-height: 46px !important;
    padding: 0 18px !important;
    justify-content: flex-end !important;
    direction: rtl !important;
    color: #171717 !important;
    background: rgba(255, 255, 255, .9) !important;
    border: 0 !important;
    border-radius: 999px !important;
  }

  html[lang^="ar"][dir="rtl"] body header:is(.ayra-site-header, .ayra-unified-mobile-header) > nav > ul:has([data-search-trigger]) > li:first-child > button[data-search-trigger]::before {
    content: "بحث" !important;
    position: absolute !important;
    right: 18px !important;
    left: auto !important;
    color: #77736e !important;
    font-size: 14px !important;
    font-weight: 400 !important;
  }

  html[lang^="ar"][dir="rtl"] body header:is(.ayra-site-header, .ayra-unified-mobile-header) > nav > ul:has([data-search-trigger]) > li:first-child > button[data-search-trigger] svg {
    width: 22px !important;
    height: 22px !important;
    margin-right: auto !important;
    margin-left: 0 !important;
    color: #171717 !important;
  }

  html[lang^="ar"][dir="rtl"] body header:is(.ayra-site-header, .ayra-unified-mobile-header) > nav > ul:has([data-search-trigger]) > li:has(button[onclick*="Region"]) {
    width: auto !important;
    min-width: 42px !important;
  }

  html[lang^="ar"][dir="rtl"] body header:is(.ayra-site-header, .ayra-unified-mobile-header) > nav > ul:has([data-search-trigger]) > li:has(button[onclick*="Region"]) button {
    width: auto !important;
    min-width: 42px !important;
    padding: 8px 4px !important;
    font-size: 14px !important;
  }

  html[lang^="ar"][dir="rtl"] body header:is(.ayra-site-header, .ayra-unified-mobile-header) > nav > ul:has([data-search-trigger]) > li:has(button[onclick*="Region"]) svg {
    display: none !important;
  }

  html[lang^="ar"][dir="rtl"] body header:is(.ayra-site-header, .ayra-unified-mobile-header) #header-login-btn:not(.hidden),
  html[lang^="ar"][dir="rtl"] body header:is(.ayra-site-header, .ayra-unified-mobile-header) #header-profile-btn:not(.hidden) {
    display: flex !important;
  }

  html[lang^="ar"][dir="rtl"] body header:is(.ayra-site-header, .ayra-unified-mobile-header) #header-login-btn.hidden,
  html[lang^="ar"][dir="rtl"] body header:is(.ayra-site-header, .ayra-unified-mobile-header) #header-profile-btn.hidden {
    display: none !important;
  }

  html[lang^="ar"][dir="rtl"] body header:is(.ayra-site-header, .ayra-unified-mobile-header) .ayra-header-language-hidden {
    display: flex !important;
    width: auto !important;
    min-width: 42px !important;
    height: 44px !important;
    overflow: visible !important;
    visibility: visible !important;
    opacity: 1 !important;
  }

  html[lang^="ar"][dir="rtl"] body header:is(.ayra-site-header, .ayra-unified-mobile-header) svg {
    color: #171717 !important;
  }
}

@media (max-width: 369px) {
  html[lang^="ar"][dir="rtl"] body header.ayra-unified-mobile-header > nav > div.flex.items-center > ul {
    right: -12px !important;
    left: -12px !important;
    padding-inline: 5px !important;
  }
}

/* English product cards: reference layout with clear, text-free color swatches. */
html[lang^="en"][dir="ltr"] [data-products-carousel] > div:first-child:has(> h2) {
  position: relative !important;
  display: flex !important;
  width: 100% !important;
  margin: 0 0 26px !important;
  align-items: center !important;
  justify-content: space-between !important;
}

html[lang^="en"][dir="ltr"] [data-products-carousel] > div:first-child:has(> h2) > h2 {
  margin: 0 !important;
  font-family: Georgia, "Times New Roman", serif !important;
  font-size: clamp(25px, 2.2vw, 34px) !important;
  font-weight: 400 !important;
  line-height: 1.15 !important;
  letter-spacing: 0 !important;
  text-align: left !important;
}

html[lang^="en"][dir="ltr"] [data-products-carousel] > div:first-child:has(> h2) > a {
  position: static !important;
  margin-left: auto !important;
  padding: 8px 0 !important;
  font-family: Georgia, "Times New Roman", serif !important;
  font-size: 14px !important;
  font-weight: 400 !important;
}

html[lang^="en"][dir="ltr"] [data-product-card].ayra-product-card-premium {
  position: relative !important;
  display: flex !important;
  height: 100% !important;
  flex-direction: column !important;
  gap: 0 !important;
  overflow: hidden !important;
  text-align: left !important;
  background: #fbfaf8 !important;
  border: 1px solid rgba(23, 22, 20, .08) !important;
  border-radius: 11px !important;
  box-shadow: 0 8px 24px rgba(34, 27, 21, .10) !important;
}

html[lang^="en"][dir="ltr"] [data-product-card] > .ayra-product-image {
  position: relative !important;
  display: block !important;
  width: 100% !important;
  aspect-ratio: 4 / 5 !important;
  flex: 0 0 auto !important;
  overflow: hidden !important;
  border-radius: 0 !important;
  background: #f1eee8 !important;
}

html[lang^="en"][dir="ltr"] [data-product-card] > .ayra-product-image > img {
  display: block !important;
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  object-position: center !important;
}

html[lang^="en"][dir="ltr"] [data-product-card] > .ayra-product-image [data-wishlist-btn] {
  top: 14px !important;
  right: 14px !important;
  bottom: auto !important;
  left: auto !important;
  display: flex !important;
  width: 40px !important;
  min-width: 40px !important;
  height: 40px !important;
  padding: 8px !important;
  align-items: center !important;
  justify-content: center !important;
  color: #171614 !important;
  background: rgba(251, 250, 248, .88) !important;
  border: 1px solid rgba(23, 22, 20, .13) !important;
  border-radius: 50% !important;
  box-shadow: 0 3px 10px rgba(23, 22, 20, .08) !important;
}

html[lang^="en"][dir="ltr"] [data-product-card] > .ayra-product-info {
  display: flex !important;
  min-height: 188px !important;
  padding: 15px 15px 11px !important;
  flex: 1 1 auto !important;
  flex-direction: column !important;
  align-items: stretch !important;
  gap: 10px !important;
  text-align: left !important;
}

html[lang^="en"][dir="ltr"] [data-product-card] > .ayra-product-info > div:first-child {
  display: flex !important;
  flex-direction: column !important;
  align-items: stretch !important;
  gap: 9px !important;
}

html[lang^="en"][dir="ltr"] [data-product-card] .ayra-product-swatches {
  display: flex !important;
  box-sizing: border-box !important;
  width: 100% !important;
  min-height: 28px !important;
  margin: 0 !important;
  padding: 1px 2px !important;
  flex-flow: row wrap !important;
  align-items: center !important;
  justify-content: flex-start !important;
  gap: 10px !important;
}

html[lang^="en"][dir="ltr"] [data-product-card] .ayra-product-swatch {
  display: block !important;
  box-sizing: border-box !important;
  width: 25px !important;
  min-width: 25px !important;
  height: 25px !important;
  overflow: hidden !important;
  border: 1.5px solid rgba(23, 22, 20, .42) !important;
  border-radius: 50% !important;
  color: transparent !important;
  font-size: 0 !important;
  line-height: 0 !important;
  text-indent: -9999px !important;
  box-shadow: inset 0 0 0 1.5px rgba(251, 250, 248, .8), 0 1px 3px rgba(23, 22, 20, .12) !important;
}

html[lang^="en"][dir="ltr"] [data-product-card] .ayra-product-swatch--named {
  background: #b8b0a5 !important;
}

html[lang^="en"][dir="ltr"] [data-product-card] .ayra-product-swatch[data-zid-color-value="Black" i] { background: #171717 !important; }
html[lang^="en"][dir="ltr"] [data-product-card] .ayra-product-swatch[data-zid-color-value="White" i] { background: #fff !important; }
html[lang^="en"][dir="ltr"] [data-product-card] .ayra-product-swatch[data-zid-color-value="Brown" i] { background: #70452f !important; }
html[lang^="en"][dir="ltr"] [data-product-card] .ayra-product-swatch[data-zid-color-value="Camel" i] { background: #b88a57 !important; }
html[lang^="en"][dir="ltr"] [data-product-card] .ayra-product-swatch[data-zid-color-value="Navy" i] { background: #18263d !important; }
html[lang^="en"][dir="ltr"] [data-product-card] .ayra-product-swatch[data-zid-color-value="Grey" i] { background: #8b8b88 !important; }
html[lang^="en"][dir="ltr"] [data-product-card] .ayra-product-swatch[data-zid-color-value="Dark Grey" i] { background: #4a4a48 !important; }
html[lang^="en"][dir="ltr"] [data-product-card] .ayra-product-swatch[data-zid-color-value="Light Grey" i] { background: #c9c9c5 !important; }
html[lang^="en"][dir="ltr"] [data-product-card] .ayra-product-swatch[data-zid-color-value="Dark Olive" i] { background: #4d5132 !important; }
html[lang^="en"][dir="ltr"] [data-product-card] .ayra-product-swatch[data-zid-color-value="Light Olive" i] { background: #a8aa75 !important; }

html[lang^="en"][dir="ltr"] [data-product-card] .ayra-product-title,
html[lang^="en"][dir="ltr"] [data-product-card] .ayra-product-title > a {
  width: 100% !important;
  min-height: 0 !important;
  margin: 0 !important;
  color: #171614 !important;
  font-family: Georgia, "Times New Roman", serif !important;
  font-size: clamp(14px, 1.15vw, 17px) !important;
  font-weight: 400 !important;
  line-height: 1.35 !important;
  text-align: left !important;
}

html[lang^="en"][dir="ltr"] [data-product-card] .ayra-product-price-area {
  display: flex !important;
  width: 100% !important;
  flex-direction: column !important;
  align-items: flex-start !important;
  justify-content: flex-start !important;
  gap: 7px !important;
  text-align: left !important;
}

html[lang^="en"][dir="ltr"] [data-product-card] .ayra-product-price-area > p,
html[lang^="en"][dir="ltr"] [data-product-card] .ayra-product-price-meta {
  justify-content: flex-start !important;
  text-align: left !important;
}

html[lang^="en"][dir="ltr"] [data-product-card] .ayra-product-price-area > p {
  margin: 0 !important;
  color: #171614 !important;
  font-size: 16px !important;
  font-weight: 650 !important;
}

html[lang^="en"][dir="ltr"] [data-product-card] .ayra-product-price-meta {
  display: flex !important;
  width: 100% !important;
  flex-flow: row wrap !important;
  align-items: center !important;
  gap: 7px !important;
}

html[lang^="en"][dir="ltr"] [data-product-card] .ayra-product-price-meta span[class*="bg-success"] {
  padding: 6px 10px !important;
  color: #46704d !important;
  font-size: 11px !important;
  font-weight: 600 !important;
  background: #e4eee2 !important;
  border-radius: 4px !important;
}

html[lang^="en"][dir="ltr"] [data-product-card] > div:has(> .ayra-product-action) {
  width: 100% !important;
  margin-top: auto !important;
  padding: 0 15px 15px !important;
}

html[lang^="en"][dir="ltr"] [data-product-card] .ayra-product-action {
  width: 100% !important;
  min-height: 48px !important;
  padding: 10px 14px !important;
  color: #171614 !important;
  font-family: Georgia, "Times New Roman", serif !important;
  font-size: 14px !important;
  font-weight: 400 !important;
  text-align: center !important;
  background: transparent !important;
  border: 1px solid rgba(23, 22, 20, .72) !important;
  border-radius: 4px !important;
}

@media (max-width: 767px) {
  html[lang^="en"][dir="ltr"] [data-product-card] > .ayra-product-info {
    min-height: 164px !important;
    padding: 12px 11px 8px !important;
  }

  html[lang^="en"][dir="ltr"] [data-product-card] .ayra-product-swatches {
    min-height: 25px !important;
    gap: 8px !important;
  }

  html[lang^="en"][dir="ltr"] [data-product-card] .ayra-product-swatch {
    width: 22px !important;
    min-width: 22px !important;
    height: 22px !important;
  }

  html[lang^="en"][dir="ltr"] [data-product-card] > div:has(> .ayra-product-action) {
    padding: 0 11px 11px !important;
  }
}

/* Arabic product cards: match the English reference design in RTL. */
html[lang^="ar"][dir="rtl"] [data-products-carousel] > div:first-child:has(> h2) {
  position: relative !important;
  display: flex !important;
  width: 100% !important;
  margin: 0 0 26px !important;
  align-items: center !important;
  justify-content: space-between !important;
  direction: rtl !important;
}

html[lang^="ar"][dir="rtl"] [data-products-carousel] > div:first-child:has(> h2) > h2 {
  margin: 0 !important;
  color: #171614 !important;
  font-family: "Tajawal", "Noto Sans Arabic", Arial, sans-serif !important;
  font-size: clamp(27px, 2.5vw, 38px) !important;
  font-weight: 500 !important;
  line-height: 1.25 !important;
  text-align: right !important;
}

html[lang^="ar"][dir="rtl"] [data-products-carousel] > div:first-child:has(> h2) > a {
  position: static !important;
  margin-right: auto !important;
  margin-left: 0 !important;
  padding: 8px 0 !important;
  font-size: 14px !important;
  font-weight: 500 !important;
}

html[lang^="ar"][dir="rtl"] [data-product-card].ayra-product-card-premium {
  position: relative !important;
  display: flex !important;
  height: 100% !important;
  flex-direction: column !important;
  gap: 0 !important;
  overflow: hidden !important;
  direction: rtl !important;
  text-align: right !important;
  background: #fbfaf8 !important;
  border: 1px solid rgba(23, 22, 20, .08) !important;
  border-radius: 11px !important;
  box-shadow: 0 8px 24px rgba(34, 27, 21, .10) !important;
}

html[lang^="ar"][dir="rtl"] [data-product-card] > .ayra-product-image {
  position: relative !important;
  display: block !important;
  width: 100% !important;
  aspect-ratio: 4 / 5 !important;
  flex: 0 0 auto !important;
  overflow: hidden !important;
  border-radius: 0 !important;
  background: #f1eee8 !important;
}

html[lang^="ar"][dir="rtl"] [data-product-card] > .ayra-product-image > img {
  display: block !important;
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  object-position: center !important;
}

html[lang^="ar"][dir="rtl"] [data-product-card] > .ayra-product-image [data-wishlist-btn] {
  top: 14px !important;
  right: auto !important;
  bottom: auto !important;
  left: 14px !important;
  display: flex !important;
  width: 40px !important;
  min-width: 40px !important;
  height: 40px !important;
  padding: 8px !important;
  align-items: center !important;
  justify-content: center !important;
  color: #171614 !important;
  background: rgba(251, 250, 248, .9) !important;
  border: 1px solid rgba(23, 22, 20, .13) !important;
  border-radius: 50% !important;
  box-shadow: 0 3px 10px rgba(23, 22, 20, .08) !important;
}

html[lang^="ar"][dir="rtl"] [data-product-card] > .ayra-product-image .ayra-card-discount-badge {
  top: 14px !important;
  right: 14px !important;
  left: auto !important;
}

html[lang^="ar"][dir="rtl"] [data-product-card] > .ayra-product-info {
  display: flex !important;
  min-height: 188px !important;
  padding: 15px 15px 11px !important;
  flex: 1 1 auto !important;
  flex-direction: column !important;
  align-items: stretch !important;
  gap: 10px !important;
  direction: rtl !important;
  text-align: right !important;
}

html[lang^="ar"][dir="rtl"] [data-product-card] > .ayra-product-info > div:first-child {
  display: flex !important;
  flex-direction: column !important;
  align-items: stretch !important;
  gap: 9px !important;
}

html[lang^="ar"][dir="rtl"] [data-product-card] .ayra-product-swatches {
  display: flex !important;
  box-sizing: border-box !important;
  width: 100% !important;
  min-height: 28px !important;
  margin: 0 !important;
  padding: 1px 2px !important;
  flex-flow: row wrap !important;
  align-items: center !important;
  justify-content: flex-start !important;
  gap: 10px !important;
  direction: ltr !important;
}

html[lang^="ar"][dir="rtl"] [data-product-card] .ayra-product-swatch {
  display: block !important;
  box-sizing: border-box !important;
  width: 25px !important;
  min-width: 25px !important;
  height: 25px !important;
  overflow: hidden !important;
  border: 1.5px solid rgba(23, 22, 20, .42) !important;
  border-radius: 50% !important;
  color: transparent !important;
  font-size: 0 !important;
  line-height: 0 !important;
  text-indent: -9999px !important;
  box-shadow: inset 0 0 0 1.5px rgba(251, 250, 248, .8), 0 1px 3px rgba(23, 22, 20, .12) !important;
}

html[lang^="ar"][dir="rtl"] [data-product-card] .ayra-product-swatch--named { background: #b8b0a5 !important; }
html[lang^="ar"][dir="rtl"] [data-product-card] .ayra-product-swatch[data-zid-color-value="Black" i] { background: #171717 !important; }
html[lang^="ar"][dir="rtl"] [data-product-card] .ayra-product-swatch[data-zid-color-value="White" i] { background: #fff !important; }
html[lang^="ar"][dir="rtl"] [data-product-card] .ayra-product-swatch[data-zid-color-value="Brown" i] { background: #70452f !important; }
html[lang^="ar"][dir="rtl"] [data-product-card] .ayra-product-swatch[data-zid-color-value="Camel" i] { background: #b88a57 !important; }
html[lang^="ar"][dir="rtl"] [data-product-card] .ayra-product-swatch[data-zid-color-value="Navy" i] { background: #18263d !important; }
html[lang^="ar"][dir="rtl"] [data-product-card] .ayra-product-swatch[data-zid-color-value="Grey" i] { background: #8b8b88 !important; }
html[lang^="ar"][dir="rtl"] [data-product-card] .ayra-product-swatch[data-zid-color-value="Dark Grey" i] { background: #4a4a48 !important; }
html[lang^="ar"][dir="rtl"] [data-product-card] .ayra-product-swatch[data-zid-color-value="Light Grey" i] { background: #c9c9c5 !important; }
html[lang^="ar"][dir="rtl"] [data-product-card] .ayra-product-swatch[data-zid-color-value="Dark Olive" i] { background: #4d5132 !important; }
html[lang^="ar"][dir="rtl"] [data-product-card] .ayra-product-swatch[data-zid-color-value="Light Olive" i] { background: #a8aa75 !important; }

html[lang^="ar"][dir="rtl"] [data-product-card] .ayra-product-title,
html[lang^="ar"][dir="rtl"] [data-product-card] .ayra-product-title > a {
  width: 100% !important;
  min-height: 0 !important;
  margin: 0 !important;
  color: #171614 !important;
  font-family: "Tajawal", "Noto Sans Arabic", Arial, sans-serif !important;
  font-size: clamp(14px, 1.15vw, 17px) !important;
  font-weight: 500 !important;
  line-height: 1.55 !important;
  text-align: right !important;
}

html[lang^="ar"][dir="rtl"] [data-product-card] .ayra-product-price-area {
  display: flex !important;
  width: 100% !important;
  flex-direction: column !important;
  align-items: flex-start !important;
  justify-content: flex-start !important;
  gap: 7px !important;
  direction: ltr !important;
  text-align: left !important;
}

html[lang^="ar"][dir="rtl"] [data-product-card] .ayra-product-price-area > p {
  margin: 0 !important;
  color: #171614 !important;
  font-size: 16px !important;
  font-weight: 650 !important;
  text-align: left !important;
}

html[lang^="ar"][dir="rtl"] [data-product-card] .ayra-product-price-meta {
  display: flex !important;
  width: 100% !important;
  flex-flow: row wrap !important;
  align-items: center !important;
  justify-content: flex-start !important;
  gap: 7px !important;
  direction: rtl !important;
}

html[lang^="ar"][dir="rtl"] [data-product-card] .ayra-product-price-meta span[class*="bg-success"] {
  padding: 6px 10px !important;
  color: #46704d !important;
  font-size: 11px !important;
  font-weight: 600 !important;
  background: #e4eee2 !important;
  border-radius: 4px !important;
}

html[lang^="ar"][dir="rtl"] [data-product-card] > div:has(> .ayra-product-action) {
  width: 100% !important;
  margin-top: auto !important;
  padding: 0 15px 15px !important;
}

html[lang^="ar"][dir="rtl"] [data-product-card] .ayra-product-action {
  width: 100% !important;
  min-height: 48px !important;
  padding: 10px 14px !important;
  color: #171614 !important;
  font-family: "Tajawal", "Noto Sans Arabic", Arial, sans-serif !important;
  font-size: 15px !important;
  font-weight: 500 !important;
  text-align: center !important;
  background: transparent !important;
  border: 1px solid rgba(23, 22, 20, .72) !important;
  border-radius: 4px !important;
}

@media (max-width: 767px) {
  html[lang^="ar"][dir="rtl"] [data-product-card] > .ayra-product-info {
    min-height: 164px !important;
    padding: 12px 11px 8px !important;
  }

  html[lang^="ar"][dir="rtl"] [data-product-card] .ayra-product-swatches {
    min-height: 25px !important;
    gap: 8px !important;
  }

  html[lang^="ar"][dir="rtl"] [data-product-card] .ayra-product-swatch {
    width: 22px !important;
    min-width: 22px !important;
    height: 22px !important;
  }

  html[lang^="ar"][dir="rtl"] [data-product-card] > div:has(> .ayra-product-action) {
    padding: 0 11px 11px !important;
  }
}

/* Mobile loading screen: overscan the beige layer across the full visual viewport. */
@media (max-width: 767px) {
  html:not(.ayra-page-ready),
  html:not(.ayra-page-ready) body {
    width: 100% !important;
    min-width: 100% !important;
    height: 100% !important;
    min-height: 100vh !important;
    min-height: 100svh !important;
    min-height: 100dvh !important;
    margin: 0 !important;
    padding: 0 !important;
    overflow: hidden !important;
    overscroll-behavior: none !important;
    background: #f3f0eb !important;
  }

  html:not(.ayra-page-ready) body {
    position: fixed !important;
    inset: 0 !important;
    touch-action: none !important;
  }

  html:not(.ayra-page-ready)::before,
  html.ayra-has-element-loader:not(.ayra-page-ready)::before {
    content: "" !important;
    position: fixed !important;
    z-index: 2147483646 !important;
    top: -100px !important;
    right: -100px !important;
    bottom: -100px !important;
    left: -100px !important;
    display: block !important;
    width: auto !important;
    min-width: 0 !important;
    height: auto !important;
    min-height: 0 !important;
    background:
      linear-gradient(#171614 0 0) calc(50% - 52px) calc(50% + 56px) / 28px 1px no-repeat,
      linear-gradient(rgba(23, 22, 20, .18) 0 0) center calc(50% + 56px) / 76px 1px no-repeat,
      #f3f0eb !important;
    pointer-events: auto !important;
  }

  html:not(.ayra-page-ready)::after,
  html.ayra-has-element-loader:not(.ayra-page-ready)::after {
    content: "" !important;
    position: fixed !important;
    z-index: 2147483647 !important;
    top: 50% !important;
    right: auto !important;
    bottom: auto !important;
    left: 50% !important;
    display: block !important;
    width: 154px !important;
    height: 58px !important;
    background: url("https://media.zid.store/cdn-cgi/image/w=400,q=95,f=auto/https://media.zid.store/0eb24a33-8aa3-4466-92a8-85156e60070b/8eca7d57-4d94-43df-b5aa-3d2fa1af2442-200x.png") center / contain no-repeat !important;
    transform: translate(-50%, -50%) !important;
    pointer-events: none !important;
  }

  html:not(.ayra-page-ready) #ayra-page-loader {
    position: fixed !important;
    z-index: 2147483647 !important;
    top: -100px !important;
    right: -100px !important;
    bottom: -100px !important;
    left: -100px !important;
    width: auto !important;
    min-width: 0 !important;
    height: auto !important;
    min-height: 0 !important;
    overflow: hidden !important;
    background: #f3f0eb !important;
  }
}

/* Arabic product cards: one layout and right-aligned pricing everywhere. */
html[lang^="ar"][dir="rtl"] [data-product-card] {
  display: flex !important;
  width: 100% !important;
  height: 100% !important;
  overflow: hidden !important;
  flex-direction: column !important;
}

html[lang^="ar"][dir="rtl"] [data-product-card] > .ayra-product-image {
  display: block !important;
  width: 100% !important;
  aspect-ratio: 4 / 5 !important;
  flex: 0 0 auto !important;
}

html[lang^="ar"][dir="rtl"] [data-product-card] > .ayra-product-info {
  display: flex !important;
  width: 100% !important;
  flex: 1 1 auto !important;
  flex-direction: column !important;
  align-items: stretch !important;
  direction: rtl !important;
  text-align: right !important;
}

html[lang^="ar"][dir="rtl"] [data-product-card] .ayra-product-title,
html[lang^="ar"][dir="rtl"] [data-product-card] .ayra-product-title > a {
  width: 100% !important;
  min-height: 0 !important;
  margin-bottom: 0 !important;
  direction: rtl !important;
  text-align: right !important;
}

html[lang^="ar"][dir="rtl"] [data-product-card] .ayra-product-title + .ayra-product-price-area {
  margin-top: -3px !important;
}

html[lang^="ar"][dir="rtl"] [data-product-card] .ayra-product-price-area {
  display: flex !important;
  width: 100% !important;
  min-height: 66px !important;
  flex-direction: column !important;
  align-items: stretch !important;
  justify-content: flex-start !important;
  gap: 7px !important;
  direction: rtl !important;
  text-align: right !important;
}

html[lang^="ar"][dir="rtl"] [data-product-card] .ayra-product-price-area > p {
  display: block !important;
  width: 100% !important;
  margin: 0 !important;
  direction: rtl !important;
  unicode-bidi: plaintext !important;
  text-align: right !important;
}

html[lang^="ar"][dir="rtl"] [data-product-card] .ayra-product-price-meta {
  display: flex !important;
  width: 100% !important;
  flex-flow: row wrap !important;
  align-items: center !important;
  justify-content: flex-start !important;
  gap: 7px !important;
  direction: rtl !important;
  text-align: right !important;
}

html[lang^="ar"][dir="rtl"] [data-product-card] .ayra-product-price-meta > * {
  direction: rtl !important;
  text-align: right !important;
}

html[lang^="ar"][dir="rtl"] [data-product-card] > div:has(> .ayra-product-action) {
  width: 100% !important;
  margin-top: auto !important;
}

@media (max-width: 767px) {
  html[lang^="ar"][dir="rtl"] [data-product-card] .ayra-product-title,
  html[lang^="ar"][dir="rtl"] [data-product-card] .ayra-product-title > a {
    min-height: 0 !important;
  }

  html[lang^="ar"][dir="rtl"] [data-product-card] .ayra-product-price-area {
    min-height: 62px !important;
  }
}

/* Desktop cart badge: anchor the absolute counter to the cart icon in both languages. */
@media (min-width: 768px) {
  html:is([lang^="en"][dir="ltr"], [lang^="ar"][dir="rtl"])
    body header:is(.ayra-site-header, .ayra-unified-mobile-header)
    a[href*="/cart"]:has([data-cart-badge]) {
    position: relative !important;
    overflow: visible !important;
  }

  html:is([lang^="en"][dir="ltr"], [lang^="ar"][dir="rtl"])
    body header:is(.ayra-site-header, .ayra-unified-mobile-header)
    a[href*="/cart"] > [data-cart-badge] {
    z-index: 2 !important;
  }
}

/* Arabic header: keep only the active Zid account control visible. */
html[lang^="ar"][dir="rtl"] body header:is(.ayra-site-header, .ayra-unified-mobile-header) #header-login-btn.hidden,
html[lang^="ar"][dir="rtl"] body header:is(.ayra-site-header, .ayra-unified-mobile-header) #header-profile-btn.hidden,
html[lang^="ar"][dir="rtl"] body header:is(.ayra-site-header, .ayra-unified-mobile-header) #header-login-btn[hidden],
html[lang^="ar"][dir="rtl"] body header:is(.ayra-site-header, .ayra-unified-mobile-header) #header-profile-btn[hidden],
html[lang^="ar"][dir="rtl"] body header:is(.ayra-site-header, .ayra-unified-mobile-header) #header-login-btn:not(.hidden):not([hidden]) ~ #header-profile-btn {
  display: none !important;
}