@import url('https://fonts.googleapis.com/css2?family=Alexandria:wght@200..900&family=IBM+Plex+Sans+Arabic:wght@300;400;500;600;700&display=swap');

/* ليال للفساتين — Layal Custom Stylesheet v3 | الثيم: أثينا 1.85.0 */

/* 00 — tokens */
:root {
  --layal-wine:        #580015;
  --layal-wine-deep:   #3C0000;
  --layal-wine-soft:   #7A0A24;
  --layal-wine-tint:   rgba(88, 0, 21, .08);
  --layal-gold:        #C9A227;
  --layal-gold-text:   #8F6F14;
  --layal-gold-soft:   #E3CE8F;
  --layal-gold-glow:   rgba(201, 162, 39, .30);
  --layal-gold-line:   linear-gradient(90deg, transparent, var(--layal-gold) 22%, #F2E3B0 50%, var(--layal-gold) 78%, transparent);
  --layal-ivory:       #FAF7F2;
  --layal-ivory-2:     #F2EBE2;
  --layal-ink:         #2A1A1E;
  --layal-muted:       #8A7B7E;
  --layal-ease:        cubic-bezier(.22, .61, .36, 1);
  --layal-ease-soft:   cubic-bezier(.4, 0, .2, 1);
  --layal-spring:      cubic-bezier(.34, 1.36, .64, 1);
  --layal-t-fast:      .22s;
  --layal-t:           .38s;
  --layal-t-slow:      .62s;
  --layal-shadow-sm:   0 2px 10px rgba(88, 0, 21, .06);
  --layal-shadow:      0 10px 30px -12px rgba(88, 0, 21, .18);
  --layal-shadow-lg:   0 26px 60px -22px rgba(88, 0, 21, .32);
  --layal-font-display: 'Alexandria', system-ui, sans-serif;
  --layal-font-body:    'IBM Plex Sans Arabic', 'Alexandria', system-ui, sans-serif;
  --layal-bg:          #FAF7F2;
  --layal-failsafe:    2.6s;
}

/* 01 — fonts */
body,
input, textarea, select, button,
p, span, li, td, label, small,
.s-button-text,
.athena-product-title,
.store_category_item_subtitle,
.banner__description,
.home_component_subtitle {
  font-family: var(--layal-font-body);
  font-feature-settings: 'kern' 1, 'liga' 1;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-rendering: optimizeLegibility;
}
h1, h2, h3, h4, h5, h6,
.home_component_title,
.who-we-are-title,
.s-block__title,
.banner__title,
.store_category_item_title,
.store-footer h3 {
  font-family: var(--layal-font-display);
  letter-spacing: -.005em;
}
.athena-card-content h4,
.total-value,
#sub-total,
[data-cart-total] {
  font-family: var(--layal-font-body);
  font-variant-numeric: tabular-nums lining-nums;
  letter-spacing: .01em;
}
body {
  background-color: var(--layal-bg) !important;
  color: var(--layal-ink);
}

/* 02 — preloader */
.loading-screen {
  background: transparent !important;
  transition: visibility 0s linear .42s !important;
  overflow: hidden;
}
.loading-screen::before,
.loading-screen::after {
  content: '';
  position: absolute;
  left: 0;
  right: 0;
  height: 50.6%;
  transition: transform .52s var(--layal-ease);
  will-change: transform;
  z-index: -1;
}
.loading-screen::before {
  top: 0;
  background: linear-gradient(180deg, #FFFFFF 0%, var(--layal-ivory) 100%);
}
.loading-screen::after {
  bottom: 0;
  background: linear-gradient(180deg, var(--layal-ivory) 0%, var(--layal-ivory-2) 100%);
}
.loading-screen.hide {
  opacity: 1 !important;
  visibility: hidden;
}
.loading-screen.hide::before { transform: translateY(-100%); }
.loading-screen.hide::after  { transform: translateY(100%); }
.loading-screen > * {
  transition: opacity .22s ease, transform .34s var(--layal-ease);
}
.loading-screen.hide > * {
  opacity: 0;
  transform: translateY(-14px) scale(.96);
}
.loading-screen.show-logo .loading-logo,
.loading-screen .loading-logo {
  position: relative;
  max-width: 116px;
  animation: layalLogoBreath 2.1s var(--layal-ease-soft) infinite;
  filter: drop-shadow(0 8px 22px rgba(88, 0, 21, .14));
}
@keyframes layalLogoBreath {
  0%, 100% { transform: scale(1)    translateY(0);    opacity: 1;   }
  50%      { transform: scale(1.055) translateY(-3px); opacity: .88; }
}
.loading-screen .loading-spinner {
  display: block !important;
  position: absolute;
  top: 50%;
  left: 50%;
  width: 168px;
  height: 168px;
  margin: -84px 0 0 -84px;
  border: 1.5px solid rgba(88, 0, 21, .07);
  border-top-color: var(--layal-gold);
  border-right-color: var(--layal-gold-soft);
  border-radius: 50%;
  animation: layalRingSpin 1.5s cubic-bezier(.6, .05, .35, .95) infinite;
  pointer-events: none;
}
@keyframes layalRingSpin { to { transform: rotate(1turn); } }
.layal-preload-word {
  position: absolute;
  top: calc(50% + 108px);
  left: 0;
  right: 0;
  text-align: center;
  font-family: var(--layal-font-display);
  font-size: 11px;
  font-weight: 400;
  letter-spacing: .42em;
  color: var(--layal-gold-text);
  text-transform: uppercase;
  opacity: 0;
  animation: layalWordIn .7s var(--layal-ease) .18s forwards;
}
@keyframes layalWordIn {
  from { opacity: 0; letter-spacing: .70em; }
  to   { opacity: .82; letter-spacing: .42em; }
}
.layal-preload-bar {
  position: absolute;
  bottom: 0;
  left: 0;
  height: 2px;
  width: 0;
  background: var(--layal-gold-line);
  box-shadow: 0 0 14px var(--layal-gold-glow);
  transition: width .3s var(--layal-ease);
}

/* 03 — header / navbar
   لا تضع backdrop-filter / filter / transform على #classic-main-nav نفسه (يكسر درج الموبايل) */
:root {
  --menu-links-color-default: var(--layal-wine);
  --menu-links-color-final:   var(--layal-wine);
}
#classic-main-nav.navbarbg {
  background-color: rgba(250, 247, 242, .97) !important;
  box-shadow: 0 1px 0 rgba(88, 0, 21, .07), 0 6px 24px -18px rgba(88, 0, 21, .35) !important;
  transition: background-color var(--layal-t) var(--layal-ease),
              box-shadow var(--layal-t) var(--layal-ease);
}
#classic-main-nav.nav-background-blur::before {
  background-color: rgba(250, 247, 242, .88) !important;
  -webkit-backdrop-filter: saturate(160%) blur(18px);
  backdrop-filter: saturate(160%) blur(18px);
}
body.navbar-sticky-active #classic-main-nav {
  box-shadow: 0 10px 34px -24px rgba(88, 0, 21, .55) !important;
}
#top-nav {
  border-bottom: 1px solid rgba(88, 0, 21, .07);
  font-size: 12.5px;
}
#top-nav .links-divider { background: rgba(88, 0, 21, .18); }
.store-header .main-nav a,
.store-header salla-menu a,
.store-header .topnav-link-item {
  position: relative;
  transition: color var(--layal-t-fast) var(--layal-ease);
}
.store-header .main-nav a::after,
.store-header salla-menu > ul > li > a::after {
  content: '';
  position: absolute;
  bottom: -5px;
  left: 50%;
  width: 0;
  height: 1.5px;
  background: var(--layal-gold-line);
  transform: translateX(-50%);
  transition: width var(--layal-t) var(--layal-ease);
  pointer-events: none;
}
.store-header .main-nav a:hover::after,
.store-header salla-menu > ul > li > a:hover::after { width: 78%; }
.store-header .main-nav a:hover,
.store-header salla-menu a:hover { color: var(--layal-wine-soft); }
.store-header .s-cart-summary-count { font-family: var(--layal-font-body); }
.store-header button svg,
.store-header a svg { transition: transform var(--layal-t) var(--layal-spring); }
.store-header button:hover svg,
.store-header a:hover svg { transform: translateY(-2px) scale(1.06); }
.store-header .navbar-brand img,
#classic-main-nav img[alt*="logo"] {
  transition: transform var(--layal-t-slow) var(--layal-ease), filter var(--layal-t) ease;
}
.store-header .navbar-brand:hover img { transform: scale(1.035); }

/* زر واتساب مكرر — الأنضف: قفل enable_whatsapp_btn من محرر الثيم واحذف السطرين */
.store-footer ~ section > div.fixed[class*="bottom-0"]:has(> a[href*="wa.me"]),
body > section > div.fixed[class*="bottom-0"]:has(> a[href*="wa.me"]) { display: none !important; }

/* كبسولة واتساب (كرزون): شريط الشراء بيبقى position:fixed تحت 640px بس
   (الثيم نفسه محدّد كده في app.css)، وارتفاعه 114px — فبنرفعها فوقه.
   فوق 640px الشريط بيرجع طبيعي في الصفحة، فالكبسولة تفضل مكانها 50px. */
@media (max-width: 640px) {
  body.is-sticky-product-bar.product-single #karzoun-widget-send-button,
  body.is-sticky-product-bar.product-single .karzoun-box { bottom: 128px !important; }
}

/* 04 — section titles */
.home_component_title,
.who-we-are-title,
.s-block__title {
  position: relative;
  font-weight: 500;
  letter-spacing: -.01em;
}
.home_component_title::after {
  content: '';
  display: block;
  width: 0;
  height: 1.5px;
  margin: 14px auto 0;
  background: var(--layal-gold-line);
  transition: width .9s var(--layal-ease) .12s;
}
.athena-animate .home_component_title::after,
.layal-in .home_component_title::after { width: 82px; }
.home_component_subtitle {
  color: var(--layal-muted) !important;
  font-weight: 300;
  margin-bottom: 40px !important;
  letter-spacing: .005em;
}
@media (min-width: 768px) {
  .home_component_title { font-size: 34px; }
}

/* 05 — store categories */
.store_categories_section .img-shine-wrapper {
  width: 100% !important;
  height: auto !important;
  aspect-ratio: 1 / 1;
  border-radius: 14px !important;
  display: block !important;
  background: var(--layal-ivory-2);
  box-shadow: var(--layal-shadow-sm);
  transition: transform var(--layal-t-slow) var(--layal-spring),
              box-shadow var(--layal-t-slow) var(--layal-ease);
  will-change: transform;
}
.store_categories_section .img-shine-wrapper img {
  border-radius: 14px !important;
  transition: transform 1s var(--layal-ease), filter var(--layal-t-slow) ease;
}
.store_categories_section .img-shine-wrapper::after {
  content: '';
  position: absolute;
  inset: 0;
  border-radius: 14px;
  border: 1px solid transparent;
  box-shadow: inset 0 0 0 1px rgba(88, 0, 21, .06);
  transition: box-shadow var(--layal-t) var(--layal-ease);
  pointer-events: none;
  z-index: 2;
}
.store_categories_section .slide--one-sixth {
  width: 186px !important;
  flex-shrink: 0;
  padding-bottom: 6px;
}
@media (min-width: 768px) {
  .store_categories_section .slide--one-sixth { width: 212px !important; }
}
@media (max-width: 767px) {
  .store_categories_section .slide--one-sixth { width: 44% !important; }
}
.store_categories_section .store_category_item {
  gap: 14px;
  text-decoration: none;
  transition: transform var(--layal-t-slow) var(--layal-spring);
}
.store_categories_section .store_category_item,
.store_categories_section .store_category_item:hover { text-decoration: none; }
.store_categories_section .store_category_item:hover .img-shine-wrapper {
  transform: translateY(-9px);
  box-shadow: var(--layal-shadow-lg);
}
.store_categories_section .store_category_item:hover .img-shine-wrapper img {
  transform: scale(1.09);
  filter: saturate(1.06) contrast(1.02);
}
.store_categories_section .store_category_item:hover .img-shine-wrapper::after {
  box-shadow: inset 0 0 0 1.5px var(--layal-gold), 0 0 0 4px rgba(201, 162, 39, .12);
}
.store_categories_section .store_category_item_title {
  color: var(--layal-wine) !important;
  font-weight: 500;
  font-size: 16px !important;
  transition: color var(--layal-t) var(--layal-ease), transform var(--layal-t) var(--layal-ease);
}
.store_categories_section .store_category_item:hover .store_category_item_title {
  color: var(--layal-gold-text) !important;
  transform: translateY(-2px);
}
@media (max-width: 767px) {
  .store_categories_section .store_category_item_title { font-size: 14px !important; }
}
html.layal-js .store_categories_section .store_category_item {
  opacity: 0;
  transform: translateY(26px);
  animation: layalFailSafe .3s linear var(--layal-failsafe) forwards;
}
html.layal-js .store_categories_section.layal-in .store_category_item {
  animation: none;
  opacity: 1;
  transform: translateY(0);
  transition: opacity .6s var(--layal-ease) calc(var(--i, 0) * 70ms),
              transform .7s var(--layal-ease) calc(var(--i, 0) * 70ms);
}
.store_categories_section .img-shine-wrapper::before {
  background: linear-gradient(90deg,
              transparent,
              rgba(255, 252, 240, .55) 40%,
              rgba(201, 162, 39, .38) 55%,
              transparent) !important;
  width: 62% !important;
}

/* 06 — banners */
.s-block--banners .banner-entry,
.s-block--banners .h-banner {
  height: auto !important;
  aspect-ratio: 3 / 4;
  border-radius: 16px !important;
  overflow: hidden;
  padding: 0 !important;
  box-shadow: var(--layal-shadow-sm);
  transition: transform var(--layal-t-slow) var(--layal-ease),
              box-shadow var(--layal-t-slow) var(--layal-ease);
  will-change: transform;
}
.s-block--banners .banner-entry::before {
  content: '';
  position: absolute;
  inset: 0;
  background: linear-gradient(to top,
              rgba(42, 12, 20, .72) 0%,
              rgba(42, 12, 20, .28) 38%,
              rgba(42, 12, 20, .04) 68%,
              transparent 100%);
  transition: opacity var(--layal-t-slow) var(--layal-ease);
  z-index: 1;
}
.s-block--banners .banner-entry:hover::before { opacity: .88; }
.s-block--banners .banner-entry {
  background-size: 106% !important;
  transition: transform var(--layal-t-slow) var(--layal-ease),
              background-size 1.1s var(--layal-ease),
              box-shadow var(--layal-t-slow) var(--layal-ease);
}
.s-block--banners .banner-entry:hover {
  transform: translateY(-6px);
  background-size: 118% !important;
  box-shadow: var(--layal-shadow-lg);
}
.s-block--banners .banner-entry article,
.s-block--banners .banner-entry__text {
  position: relative;
  z-index: 2;
  justify-content: flex-end !important;
  align-items: flex-start !important;
  text-align: right;
  padding: 22px !important;
}
.s-block--banners .banner__title {
  font-size: 21px;
  font-weight: 500;
  margin-bottom: 4px !important;
  text-shadow: 0 2px 14px rgba(0, 0, 0, .35);
  transform: translateY(6px);
  transition: transform var(--layal-t-slow) var(--layal-ease);
}
.s-block--banners .banner__description {
  font-size: 13px;
  font-weight: 300;
  opacity: 0;
  max-height: 0;
  overflow: hidden;
  transform: translateY(8px);
  transition: opacity var(--layal-t-slow) var(--layal-ease),
              max-height var(--layal-t-slow) var(--layal-ease),
              transform var(--layal-t-slow) var(--layal-ease);
}
.s-block--banners .banner-entry:hover .banner__title { transform: translateY(0); }
.s-block--banners .banner-entry:hover .banner__description {
  opacity: .92;
  max-height: 60px;
  transform: translateY(0);
}
.s-block--banners .banner-entry article::after {
  content: '';
  display: block;
  width: 0;
  height: 1.5px;
  margin-top: 10px;
  background: linear-gradient(90deg, var(--layal-gold), transparent);
  transition: width var(--layal-t-slow) var(--layal-ease);
}
.s-block--banners .banner-entry:hover article::after { width: 62px; }
@media (max-width: 767px) {
  .s-block--banners .grid {
    grid-template-columns: 1fr !important;
    gap: 14px !important;
  }
  .s-block--banners .banner-entry,
  .s-block--banners .h-banner { aspect-ratio: 3 / 4; }
  .s-block--banners .banner-entry article,
  .s-block--banners .banner-entry__text { padding: 26px !important; }
  .s-block--banners .banner__title { font-size: 24px; }
  .s-block--banners .banner__description {
    opacity: .9;
    max-height: 60px;
    transform: none;
  }
  .s-block--banners .banner-entry article::after { width: 48px; }
}
@media (min-width: 768px) {
  .s-block--banners .banner-entry,
  .s-block--banners .h-banner { aspect-ratio: 4 / 5; }
}

/* 07 — product card */
custom-salla-product-card { display: block; height: 100%; }
.athena-card-wrapper {
  border-radius: 14px;
  overflow: hidden;
  background: #FFFFFF;
  box-shadow: 0 1px 0 rgba(88, 0, 21, .05);
  transition: transform var(--layal-t-slow) var(--layal-ease),
              box-shadow var(--layal-t-slow) var(--layal-ease);
  will-change: transform;
}
.athena-card-wrapper:hover {
  transform: translateY(-7px);
  box-shadow: var(--layal-shadow);
}
.athena-image-container {
  border-radius: 14px 14px 0 0;
  overflow: hidden;
  background: var(--layal-ivory-2);
}
.athena-image {
  transition: transform 1.05s var(--layal-ease), filter var(--layal-t-slow) ease;
  will-change: transform;
}
.athena-card-wrapper:hover .athena-image {
  transform: scale(1.06);
  filter: saturate(1.05);
}
.athena-product-title {
  font-family: var(--layal-font-body) !important;
  font-size: 13.5px !important;
  font-weight: 500 !important;
  line-height: 1.7 !important;
  letter-spacing: 0 !important;
  margin-top: 10px !important;
  min-height: 2.9em;
  transition: color var(--layal-t) var(--layal-ease);
}
.athena-product-title a {
  background-image: linear-gradient(var(--layal-gold), var(--layal-gold));
  background-size: 0 1px;
  background-position: 100% 100%;
  background-repeat: no-repeat;
  transition: background-size var(--layal-t-slow) var(--layal-ease),
              color var(--layal-t) var(--layal-ease);
  padding-bottom: 2px;
}
.athena-card-wrapper:hover .athena-product-title a { background-size: 100% 1px; }
.athena-card-wrapper:hover .athena-product-title { color: var(--layal-wine-soft) !important; }
@media (min-width: 768px) {
  .athena-product-title { font-size: 14.5px !important; }
}
.athena-card-content { padding-inline: 4px; }
.athena-card-content h4 {
  font-weight: 600 !important;
  font-size: 15px !important;
  letter-spacing: .01em;
}
.athena-card-content .line-through {
  font-weight: 300 !important;
  font-size: 12.5px !important;
  opacity: .72;
  text-decoration-thickness: 1px;
  text-underline-offset: 2px;
}
.athena-card-content h4,
.athena-card-content .line-through { white-space: nowrap; }
.athena-card-content .flex.justify-center > div { flex-wrap: wrap; justify-content: center; }
@media (max-width: 480px) {
  .athena-card-content h4 { font-size: 13.5px !important; }
  .athena-card-content .line-through { font-size: 11.5px !important; }
}
custom-salla-product-card .s-product-card-sale-badge,
custom-salla-product-card [class*="sale-badge"],
custom-salla-product-card .badge,
.athena-image-container .s-product-card-promotion-title {
  background: var(--layal-wine) !important;
  color: #FFF7E6 !important;
  border: 1px solid rgba(201, 162, 39, .55) !important;
  border-radius: 999px !important;
  font-family: var(--layal-font-body) !important;
  font-size: 11px !important;
  font-weight: 500 !important;
  letter-spacing: .02em;
  box-shadow: 0 6px 18px -8px rgba(88, 0, 21, .55);
  backdrop-filter: blur(4px);
}
.athena-action-buttons {
  transition: opacity var(--layal-t) var(--layal-ease),
              transform var(--layal-t) var(--layal-spring);
}
.athena-action-btn {
  border-radius: 50% !important;
  background: rgba(255, 255, 255, .92) !important;
  box-shadow: 0 6px 18px -8px rgba(88, 0, 21, .4);
  transition: transform var(--layal-t) var(--layal-spring),
              background-color var(--layal-t) var(--layal-ease) !important;
}
.athena-action-btn:hover { transform: scale(1.12) rotate(-4deg); }
.athena-desktop-add-btn .s-button-primary-outline,
.athena-desktop-add-btn .s-button-outline,
.athena-desktop-add-btn .s-button-disabled {
  background: rgba(253, 251, 248, .90) !important;
  border-top: 1px solid rgba(201, 162, 39, .38) !important;
  height: 42px !important;
  color: var(--layal-wine) !important;
  font-family: var(--layal-font-body) !important;
  font-weight: 500 !important;
  letter-spacing: .01em;
  transition: background-color var(--layal-t) var(--layal-ease),
              color var(--layal-t) var(--layal-ease) !important;
}
custom-salla-product-card .athena-card .athena-desktop-add-btn .s-button-text span,
custom-salla-product-card .athena-card .athena-desktop-add-btn .s-button-text {
  color: var(--layal-wine) !important;
  margin-top: 0 !important;
  font-size: 13px !important;
}
custom-salla-product-card .athena-card .athena-desktop-add-btn .s-button-text .cart-svg {
  stroke: var(--layal-wine) !important;
  color: var(--layal-wine) !important;
  transition: stroke var(--layal-t) ease, color var(--layal-t) ease !important;
}
.athena-desktop-add-btn:hover .s-button-primary-outline,
.athena-desktop-add-btn:hover .s-button-outline {
  background: var(--layal-wine) !important;
  color: #FFF7E6 !important;
}
custom-salla-product-card .athena-card .athena-desktop-add-btn:hover .s-button-text span,
custom-salla-product-card .athena-card .athena-desktop-add-btn:hover .s-button-text { color: #FFF7E6 !important; }
custom-salla-product-card .athena-card .athena-desktop-add-btn:hover .s-button-text .cart-svg {
  stroke: #FFF7E6 !important;
  color: #FFF7E6 !important;
}
.athena-mobile-add-btn .s-button-element {
  border-radius: 10px !important;
  border-color: rgba(88, 0, 21, .22) !important;
  font-family: var(--layal-font-body) !important;
}
.athena-sold-out-container {
  -webkit-backdrop-filter: grayscale(.55) blur(1px);
  backdrop-filter: grayscale(.55) blur(1px);
}
html.layal-js .layal-reveal-card {
  opacity: 0;
  transform: translateY(24px);
  animation: layalFailSafe .3s linear var(--layal-failsafe) forwards;
}
html.layal-js .layal-reveal-card.layal-in {
  animation: none;
  opacity: 1;
  transform: translateY(0);
  transition: opacity .55s var(--layal-ease) calc(var(--i, 0) * 55ms),
              transform .65s var(--layal-ease) calc(var(--i, 0) * 55ms);
}

/* 08 — buttons */
salla-button .s-button-element,
.s-button-element,
button.s-button-element {
  font-family: var(--layal-font-body) !important;
  font-weight: 500;
  letter-spacing: .012em;
  border-radius: 12px !important;
  transition: transform var(--layal-t-fast) var(--layal-spring),
              box-shadow var(--layal-t) var(--layal-ease),
              background-color var(--layal-t) var(--layal-ease) !important;
}
salla-button .s-button-element:hover { transform: translateY(-2px); }
salla-button .s-button-element:active { transform: translateY(0) scale(.985); }
.s-button-primary,
salla-add-product-button .s-button-primary {
  position: relative;
  overflow: hidden;
}
.s-button-primary::after {
  content: '';
  position: absolute;
  top: 0;
  left: -140%;
  width: 55%;
  height: 100%;
  background: linear-gradient(100deg, transparent, rgba(255, 236, 179, .38), transparent);
  transform: skewX(-18deg);
  pointer-events: none;
}
.s-button-primary:hover::after { animation: layalSweep .85s var(--layal-ease); }
@keyframes layalSweep {
  from { left: -140%; }
  to   { left: 160%; }
}
.layal-ripple {
  position: absolute;
  border-radius: 50%;
  background: rgba(255, 236, 179, .45);
  transform: scale(0);
  animation: layalRipple .62s var(--layal-ease) forwards;
  pointer-events: none;
  z-index: 3;
}
@keyframes layalRipple {
  to { transform: scale(2.6); opacity: 0; }
}
#to-top-btn,
.whatsapp-btn,
[class*="whatsapp"] a {
  transition: transform var(--layal-t) var(--layal-spring), box-shadow var(--layal-t) ease;
}
#to-top-btn:hover,
.whatsapp-btn:hover { transform: translateY(-4px) scale(1.06); }
a:focus-visible,
button:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible,
[tabindex]:focus-visible {
  outline: 2px solid var(--layal-gold);
  outline-offset: 3px;
  border-radius: 6px;
}

/* 09 — footer */
.store-footer {
  position: relative;
  background: linear-gradient(170deg, #6A0A20 0%, var(--layal-wine) 42%, var(--layal-wine-deep) 100%) !important;
  margin-top: 5rem !important;
  overflow: hidden;
}
.store-footer::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  height: 2px;
  background: var(--layal-gold-line);
  opacity: .95;
  z-index: 3;
}
.store-footer::after {
  content: '';
  position: absolute;
  top: -160px;
  right: -120px;
  width: 420px;
  height: 420px;
  border-radius: 50%;
  background: radial-gradient(circle, rgba(201, 162, 39, .13), transparent 68%);
  pointer-events: none;
}
.store-footer__inner { background: transparent !important; }
.store-footer > div:first-child { padding-block: 3.25rem 2.25rem; }
.store-footer h3,
.store-footer .s-block__title {
  font-family: var(--layal-font-display);
  font-size: 15px;
  font-weight: 500;
  letter-spacing: .02em;
  color: #FFF7E6;
  margin-bottom: 18px;
  position: relative;
  padding-bottom: 12px;
}
.store-footer h3::after {
  content: '';
  position: absolute;
  bottom: 0;
  right: 0;
  width: 34px;
  height: 1.5px;
  background: linear-gradient(90deg, transparent, var(--layal-gold));
  transition: width var(--layal-t-slow) var(--layal-ease);
}
.store-footer > div:first-child > div > div:hover h3::after { width: 62px; }
.store-footer p,
.store-footer li,
.store-footer span,
.store-footer a {
  font-family: var(--layal-font-body);
  font-size: 13.5px;
  font-weight: 300;
  line-height: 1.95;
  color: rgba(255, 247, 230, .78);
}
.store-footer salla-menu a,
.store-footer nav a {
  position: relative;
  display: inline-block;
  transition: color var(--layal-t) var(--layal-ease),
              transform var(--layal-t) var(--layal-ease),
              opacity var(--layal-t) var(--layal-ease) !important;
}
.store-footer salla-menu a::before {
  content: '';
  position: absolute;
  top: 50%;
  right: -12px;
  width: 4px;
  height: 4px;
  margin-top: -2px;
  border-radius: 50%;
  background: var(--layal-gold);
  opacity: 0;
  transform: scale(.4);
  transition: opacity var(--layal-t) var(--layal-ease), transform var(--layal-t) var(--layal-spring);
}
.store-footer salla-menu a:hover {
  color: #FFF7E6 !important;
  opacity: 1 !important;
  transform: translateX(-8px);
}
.store-footer salla-menu a:hover::before { opacity: 1; transform: scale(1); }
.store-footer img[alt*="logo"] {
  filter: drop-shadow(0 10px 26px rgba(0, 0, 0, .35));
  transition: transform var(--layal-t-slow) var(--layal-spring);
}
.store-footer a:hover img[alt*="logo"] { transform: scale(1.04) translateY(-2px); }
.store-footer salla-social a,
.store-footer .s-social-link {
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  width: 38px;
  height: 38px;
  border-radius: 50%;
  border: 1px solid rgba(255, 247, 230, .18);
  background: rgba(255, 255, 255, .04);
  transition: transform var(--layal-t) var(--layal-spring),
              background-color var(--layal-t) var(--layal-ease),
              border-color var(--layal-t) var(--layal-ease) !important;
}
.store-footer salla-social a:hover,
.store-footer .s-social-link:hover {
  background: var(--layal-gold);
  border-color: var(--layal-gold);
  color: var(--layal-wine-deep) !important;
  transform: translateY(-4px) rotate(-6deg);
}
.store-footer salla-contacts a:hover { color: var(--layal-gold-soft) !important; }
.store-footer salla-trust-badges img,
.store-footer salla-payments img,
.store-footer salla-apps-icons img {
  transition: transform var(--layal-t) var(--layal-spring), filter var(--layal-t) ease;
}
.store-footer salla-payments img { filter: brightness(.98) saturate(.9); opacity: .9; }
.store-footer salla-payments img:hover { filter: none; opacity: 1; transform: translateY(-3px) scale(1.05); }
.store-footer salla-trust-badges img:hover { transform: translateY(-3px) scale(1.04); }
.store-footer > div:last-of-type,
.store-footer .border-t-2 {
  border-top: 1px solid rgba(255, 247, 230, .14) !important;
  background: rgba(0, 0, 0, .12);
}
.store-footer .copyright-text p,
.store-footer .copyright-text a {
  color: rgba(255, 247, 230, .62) !important;
  font-size: 12.5px;
}
.store-footer .copyright-text a:hover { color: var(--layal-gold-soft) !important; }

/* 10 — motion */
@keyframes layalFailSafe {
  to { opacity: 1; transform: none; }
}
html.layal-js .layal-reveal {
  opacity: 0;
  transform: translateY(30px);
  transition: opacity .68s var(--layal-ease), transform .78s var(--layal-ease);
  animation: layalFailSafe .4s var(--layal-ease) var(--layal-failsafe) forwards;
  will-change: opacity, transform;
}
html.layal-js .layal-reveal.layal-in { animation: none; opacity: 1; transform: none; }
html.layal-js .layal-reveal--right { transform: translateX(38px); }
html.layal-js .layal-reveal--left  { transform: translateX(-38px); }
html.layal-js .layal-reveal--zoom  { transform: scale(.94); }
html.layal-js .layal-stagger > * {
  opacity: 0;
  transform: translateY(22px);
  animation: layalFailSafe .4s var(--layal-ease) var(--layal-failsafe) forwards;
}
html.layal-js .layal-stagger.layal-in > * {
  animation: none;
  opacity: 1;
  transform: none;
  transition: opacity .55s var(--layal-ease) calc(var(--i, 0) * 60ms),
              transform .65s var(--layal-ease) calc(var(--i, 0) * 60ms);
}
.layal-img-mask { overflow: hidden; }
.layal-img-mask img {
  transform: scale(1.1);
  transition: transform 1.25s var(--layal-ease);
}
.layal-img-mask.layal-in img { transform: scale(1); }

/* 11 — misc */
::selection { background: rgba(201, 162, 39, .28); color: var(--layal-wine-deep); }
@media (min-width: 1024px) {
  * { scrollbar-width: thin; scrollbar-color: rgba(88, 0, 21, .35) transparent; }
  ::-webkit-scrollbar { width: 9px; height: 9px; }
  ::-webkit-scrollbar-track { background: transparent; }
  ::-webkit-scrollbar-thumb {
    background: linear-gradient(var(--layal-wine), var(--layal-wine-soft));
    border-radius: 9px;
    border: 2px solid var(--layal-ivory);
  }
  ::-webkit-scrollbar-thumb:hover { background: var(--layal-gold); }
}
#cart-summary-panel {
  border-inline-start: 1px solid rgba(201, 162, 39, .22);
  box-shadow: -30px 0 70px -40px rgba(88, 0, 21, .55);
}
#cart-summary-panel h2,
#cart-summary-panel h5 { font-family: var(--layal-font-display); font-weight: 500; }
.cart-submit-btn .s-button-element { border-radius: 12px !important; }
#cart-overlay { -webkit-backdrop-filter: blur(3px); backdrop-filter: blur(3px); }
free-shipping-bar { display: block; }
free-shipping-bar .progress,
free-shipping-bar [class*="progress"] { border-radius: 999px; }
.athena-modal-content,
[class*="cupon"] .modal-content {
  border-radius: 18px !important;
  overflow: hidden;
  box-shadow: 0 40px 90px -40px rgba(88, 0, 21, .6);
}
.breadcrumbs a:hover,
[class*="breadcrumb"] a:hover { color: var(--layal-gold-text) !important; }
.athena-image-container img,
.img-shine-wrapper img,
.s-block--banners img { background-color: rgba(88, 0, 21, .03); }
salla-slider .swiper-button-next,
salla-slider .swiper-button-prev {
  background: rgba(255, 255, 255, .9) !important;
  border: 1px solid rgba(201, 162, 39, .3) !important;
  box-shadow: var(--layal-shadow-sm);
  transition: transform var(--layal-t) var(--layal-spring), background-color var(--layal-t) ease !important;
}
salla-slider .swiper-button-next:hover,
salla-slider .swiper-button-prev:hover {
  background: var(--layal-wine) !important;
  color: #FFF7E6 !important;
  transform: scale(1.08);
}
[class*="ad-bar"] .marquee:hover,
.product_card_ad_bar:hover * { animation-play-state: paused; }

/* 12 — reduced motion */
@media (prefers-reduced-motion: reduce) {
  *,
  *::before,
  *::after {
    animation-duration: .01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: .01ms !important;
    scroll-behavior: auto !important;
  }
  .layal-reveal,
  .layal-stagger > *,
  .layal-reveal-card,
  .store_categories_section .store_category_item {
    opacity: 1 !important;
    transform: none !important;
    animation: none !important;
  }
}
@media (max-width: 767px) {
  .athena-card-wrapper:hover { transform: none; }
  .s-block--banners .banner-entry:hover { transform: none; }
  .store-footer::after { display: none; }
}

/* 13 — product option chips */
.layal-optbox {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 10px !important;
  margin-top: 10px !important;
}
.layal-optchip {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  min-width: 56px !important;
  min-height: 44px !important;
  padding: 10px 18px !important;
  border: 1px solid rgba(88, 0, 21, .20) !important;
  border-radius: 12px !important;
  background: #FFFFFF !important;
  color: var(--layal-wine) !important;
  font-family: var(--layal-font-body) !important;
  font-size: 14px !important;
  font-weight: 500 !important;
  line-height: 1 !important;
  text-transform: uppercase !important;
  cursor: pointer !important;
  user-select: none;
  position: relative;
  overflow: hidden;
  transition: border-color var(--layal-t) var(--layal-ease),
              background-color var(--layal-t) var(--layal-ease),
              color var(--layal-t) var(--layal-ease),
              transform var(--layal-t-fast) var(--layal-spring),
              box-shadow var(--layal-t) var(--layal-ease) !important;
}
.layal-optchip:hover {
  border-color: var(--layal-gold) !important;
  box-shadow: 0 6px 18px -12px rgba(88, 0, 21, .5) !important;
  transform: translateY(-2px) !important;
}
.layal-optchip:active { transform: translateY(0) scale(.97) !important; }
.layal-optchip.is-selected {
  background: var(--layal-wine) !important;
  border-color: var(--layal-wine) !important;
  color: #FFF7E6 !important;
  font-weight: 600 !important;
  box-shadow: 0 0 0 3px rgba(201, 162, 39, .22), 0 8px 20px -12px rgba(88, 0, 21, .6) !important;
  transform: none !important;
}
.layal-optchip.is-selected::after {
  content: '';
  position: absolute;
  top: 5px;
  inset-inline-end: 6px;
  width: 5px;
  height: 5px;
  border-radius: 50%;
  background: var(--layal-gold);
}
.layal-optchip.is-disabled {
  color: var(--layal-muted) !important;
  border-color: rgba(88, 0, 21, .10) !important;
  background: rgba(88, 0, 21, .03) !important;
  cursor: not-allowed !important;
  text-decoration: line-through !important;
  text-decoration-thickness: 1px !important;
  opacity: .62 !important;
  transform: none !important;
  box-shadow: none !important;
}
.s-product-options-option-label,
.s-product-options-option > label {
  font-family: var(--layal-font-body) !important;
  font-weight: 600 !important;
  font-size: 13.5px !important;
  color: var(--layal-wine) !important;
  letter-spacing: .01em;
}
@media (max-width: 480px) {
  .layal-optchip { min-width: 52px !important; padding: 10px 15px !important; font-size: 13.5px !important; }
  .layal-optbox { gap: 8px !important; }
}

/* 14 — وصف المنتج: تسلسل العناوين */
.product__description .article--main h2 {
  font-family: var(--layal-font-display);
  font-size: 22px;
  font-weight: 600;
  line-height: 1.55;
  color: var(--layal-wine);
  margin: 0 0 14px;
  padding-bottom: 12px;
  position: relative;
}
.product__description .article--main h2::after {
  content: '';
  position: absolute;
  bottom: 0;
  inset-inline-start: 0;
  width: 64px;
  height: 2px;
  background: var(--layal-gold-line);
}
.product__description .article--main h3 {
  font-family: var(--layal-font-display);
  font-size: 16.5px;
  font-weight: 600;
  line-height: 1.7;
  color: var(--layal-gold-text);
  margin: 26px 0 10px;
  padding-inline-start: 14px;
  position: relative;
}
.product__description .article--main h3::before {
  content: '';
  position: absolute;
  top: .58em;
  inset-inline-start: 0;
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: var(--layal-gold);
}
.product__description .article--main p,
.product__description .article--main li {
  font-family: var(--layal-font-body);
  font-size: 14px;
  line-height: 2;
  color: #4A3B3E;
}
.product__description .article--main ul { margin: 0 0 6px; }
@media (max-width: 480px) {
  .product__description .article--main h2 { font-size: 19.5px; }
  .product__description .article--main h3 { font-size: 15.5px; margin-top: 22px; }
}