/* ==========================================================================
   STYLE.CSS - EasyOrder Clothing Store & Admin Theme
   ========================================================================== */

@import url('https://fonts.googleapis.com/css2?family=Cairo:wght@300;400;500;600;700;800;900&family=Tajawal:wght@300;400;500;700;800;900&display=swap');

:root {
  /* Dynamic Theme Variables - Controlled by Admin Settings */
  --primary-color: #0f172a;       /* الأساسي - أسود كحلي فاخر */
  --primary-hover: #1e293b;
  --secondary-color: #d97706;     /* الثانوي - ذهبي مميز */
  --secondary-hover: #b45309;
  --accent-color: #ef4444;        /* لون العروض والتخفيضات */
  --bg-main: #f8fafc;
  --bg-card: #ffffff;
  --text-main: #0f172a;
  --text-muted: #64748b;
  --border-color: #e2e8f0;
  --header-bg: #ffffff;
  --header-text: #0f172a;
  --announcement-bg: #0f172a;
  --announcement-text: #ffffff;
  
  /* Radii & Shadows */
  --radius-sm: 0.375rem;
  --radius-md: 0.75rem;
  --radius-lg: 1.25rem;
  --radius-full: 9999px;
  --shadow-card: 0 4px 20px -2px rgba(0, 0, 0, 0.06), 0 2px 6px -1px rgba(0, 0, 0, 0.03);
  --shadow-hover: 0 20px 25px -5px rgba(0, 0, 0, 0.1), 0 10px 10px -5px rgba(0, 0, 0, 0.04);
}

* {
  font-family: 'Cairo', 'Tajawal', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
  box-sizing: border-box;
}

html {
  overflow-x: hidden;
}

body {
  background-color: var(--bg-main);
  color: var(--text-main);
  direction: rtl;
  text-align: right;
  overflow-x: hidden;
  max-width: 100vw;
}

/* Custom Scrollbar */
::-webkit-scrollbar {
  width: 8px;
  height: 8px;
}
::-webkit-scrollbar-track {
  background: #f1f5f9;
}
::-webkit-scrollbar-thumb {
  background: #cbd5e1;
  border-radius: 9999px;
}
::-webkit-scrollbar-thumb:hover {
  background: #94a3b8;
}

/* Dynamic Classes using CSS Variables */
.bg-theme-primary {
  background-color: var(--primary-color) !important;
}
.text-theme-primary {
  color: var(--primary-color) !important;
}
.border-theme-primary {
  border-color: var(--primary-color) !important;
}
.hover\:bg-theme-primary-hover:hover {
  background-color: var(--primary-hover) !important;
}

.bg-theme-secondary {
  background-color: var(--secondary-color) !important;
}
.text-theme-secondary {
  color: var(--secondary-color) !important;
}
.border-theme-secondary {
  border-color: var(--secondary-color) !important;
}

.bg-theme-accent {
  background-color: var(--accent-color) !important;
}
.text-theme-accent {
  color: var(--accent-color) !important;
}

/* Glassmorphism */
.glass-effect {
  background: rgba(255, 255, 255, 0.88);
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
}
.glass-dark {
  background: rgba(15, 23, 42, 0.9);
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
}

/* Smooth Animations */
.animate-fade-in {
  animation: fadeIn 0.25s cubic-bezier(0.16, 1, 0.3, 1) forwards;
}

.animate-slide-up {
  animation: slideUp 0.3s cubic-bezier(0.16, 1, 0.3, 1) forwards;
}

.animate-scale-up {
  animation: scaleUp 0.25s cubic-bezier(0.16, 1, 0.3, 1) forwards;
}

@keyframes fadeIn {
  from { opacity: 0; }
  to { opacity: 1; }
}

@keyframes slideUp {
  from { opacity: 0; transform: translateY(20px); }
  to { opacity: 1; transform: translateY(0); }
}

@keyframes scaleUp {
  from { opacity: 0; transform: scale(0.95); }
  to { opacity: 1; transform: scale(1); }
}

/* Product Card Special Hover */
.product-card {
  transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}
.product-card:hover {
  transform: translateY(-6px);
  box-shadow: var(--shadow-hover);
}
.product-card .product-img {
  transition: transform 0.5s ease;
}
.product-card:hover .product-img {
  transform: scale(1.06);
}

/* Color Circle Swatches */
.color-swatch {
  width: 24px;
  height: 24px;
  border-radius: 50%;
  border: 2px solid #ffffff;
  box-shadow: 0 0 0 1px #cbd5e1;
  cursor: pointer;
  transition: transform 0.2s, box-shadow 0.2s;
}
.color-swatch:hover, .color-swatch.selected {
  transform: scale(1.2);
  box-shadow: 0 0 0 2px var(--primary-color);
}

/* Size Badge Selector */
.size-badge {
  padding: 6px 14px;
  border-radius: 8px;
  border: 1.5px solid #e2e8f0;
  font-weight: 600;
  font-size: 0.875rem;
  cursor: pointer;
  transition: all 0.2s;
  background: #ffffff;
  color: #334155;
}
.size-badge:hover {
  border-color: var(--primary-color);
  color: var(--primary-color);
}
.size-badge.selected {
  background-color: var(--primary-color);
  border-color: var(--primary-color);
  color: #ffffff;
}

/* ==========================================================================
   ANIMATIONS & FLOATING ICONS (Micro-interactions)
   ========================================================================== */
@keyframes floatSlow {
  0%, 100% {
    transform: translateY(0px) rotate(0deg);
  }
  50% {
    transform: translateY(-8px) rotate(3deg);
  }
}

@keyframes floatReverse {
  0%, 100% {
    transform: translateY(0px) rotate(0deg);
  }
  50% {
    transform: translateY(8px) rotate(-3deg);
  }
}

@keyframes pulseGlow {
  0%, 100% {
    opacity: 0.8;
    transform: scale(1);
    box-shadow: 0 0 15px rgba(217, 119, 6, 0.4);
  }
  50% {
    opacity: 1;
    transform: scale(1.05);
    box-shadow: 0 0 25px rgba(217, 119, 6, 0.7);
  }
}

@keyframes shimmer {
  0% { background-position: -200% 0; }
  100% { background-position: 200% 0; }
}

.animate-float {
  animation: floatSlow 4s ease-in-out infinite;
}

.animate-float-reverse {
  animation: floatReverse 5s ease-in-out infinite;
}

.animate-pulse-glow {
  animation: pulseGlow 2.5s infinite;
}

.pulse-badge {
  animation: pulseGlow 3s infinite;
}

/* ==========================================================================
   DARK MODE THEME SYSTEM
   ========================================================================== */
html.dark {
  color-scheme: dark;
}

html.dark body {
  background-color: #090d16;
  color: #f1f5f9;
}

html.dark .bg-white {
  background-color: #111827 !important;
}

html.dark .bg-slate-50 {
  background-color: #1a2234 !important;
}

html.dark .bg-slate-100 {
  background-color: #1f293d !important;
}

html.dark .bg-slate-200 {
  background-color: #283548 !important;
  color: #f1f5f9 !important;
}

html.dark .bg-slate-300 {
  background-color: #334155 !important;
  color: #f8fafc !important;
}

html.dark .border-slate-100,
html.dark .border-slate-200,
html.dark .border-slate-200\/60,
html.dark .border-slate-200\/80 {
  border-color: #283548 !important;
}

html.dark .text-slate-900 {
  color: #f8fafc !important;
}

html.dark .text-slate-800 {
  color: #f1f5f9 !important;
}

html.dark .text-slate-700 {
  color: #e2e8f0 !important;
}

html.dark .text-slate-600 {
  color: #cbd5e1 !important;
}

html.dark .text-slate-500 {
  color: #94a3b8 !important;
}

html.dark header.bg-white\/90 {
  background-color: rgba(17, 24, 39, 0.92) !important;
  border-color: #1f293d !important;
}

/* Dark Mode Badges & Numbers (Sidebar, Orders & Products Counters) */
html.dark #orders-total-badge,
html.dark #products-total-badge,
html.dark span.bg-slate-200 {
  background-color: #1e293b !important;
  color: #38bdf8 !important;
  border: 1px solid #334155 !important;
  font-weight: 900 !important;
}

html.dark .admin-nav-btn {
  color: #94a3b8 !important;
}

html.dark .admin-nav-btn:hover {
  background-color: #1e293b !important;
  color: #f8fafc !important;
}

html.dark .admin-nav-btn.active {
  background-color: #1e293b !important;
  color: #38bdf8 !important;
  border-color: #334155 !important;
}

html.dark .modal-content,
html.dark #direct-order-modal .bg-white,
html.dark #cart-drawer .bg-white,
html.dark #admin-order-modal .bg-white,
html.dark #admin-product-modal .bg-white,
html.dark #admin-category-modal .bg-white,
html.dark #admin-governorate-modal .bg-white,
html.dark #admin-area-modal .bg-white {
  background-color: #111827 !important;
  color: #f8fafc !important;
  border-color: #334155 !important;
}

html.dark input,
html.dark select,
html.dark textarea {
  background-color: #1a2234 !important;
  color: #f8fafc !important;
  border-color: #334155 !important;
}

html.dark input:focus,
html.dark select:focus,
html.dark textarea:focus {
  border-color: var(--primary-color) !important;
  background-color: #1e293b !important;
}

/* ==========================================================================
   RESPONSIVE DESIGN SYSTEM (Mobile, Tablet, Laptop, Desktop & Ultrawide)
   ========================================================================== */

/* Utility: Hide Scrollbar but keep scrolling */
.no-scrollbar::-webkit-scrollbar {
  display: none;
}
.no-scrollbar {
  -ms-overflow-style: none;
  scrollbar-width: none;
}

/* Mobile & Touch Optimizations (Phones < 640px) */
@media (max-width: 639px) {
  /* Safe touch tap sizes */
  button, a, input, select {
    touch-action: manipulation;
  }

  /* ✅ Only target BLOCK-LEVEL wrappers, NOT flex/grid children */
  body > *,
  section,
  header,
  footer,
  main,
  nav {
    max-width: 100vw;
    overflow-x: hidden;
  }

  /* Modals on Mobile */
  .modal-responsive-card {
    max-height: 90vh !important;
    max-height: 90dvh !important;
    width: calc(100vw - 16px) !important;
    max-width: calc(100vw - 16px) !important;
    margin: auto 8px 8px 8px !important;
    border-radius: 1.5rem !important;
    padding: 1.25rem !important;
  }

  /* Products Grid on Mobile: 2 Compact Columns */
  #products-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 0.5rem !important;
    padding: 0 !important;
  }

  /* Products section padding: reduce on mobile */
  #products-section {
    padding-left: 0.75rem !important;
    padding-right: 0.75rem !important;
    padding-top: 1.5rem !important;
  }

  /* ✅ Product Card: Force compact on mobile via pure CSS */
  .product-card {
    border-radius: 0.75rem !important;
  }

  /* Image: square on mobile (not 4/5 ratio) */
  .product-card [class*="aspect-"] {
    aspect-ratio: 1 / 1 !important;
  }

  /* Details area: tight padding */
  .product-card .card-details {
    padding: 0.4rem !important;
    gap: 0.25rem !important;
  }

  /* Category label: hide on mobile */
  .product-card .card-category {
    display: none !important;
  }

  /* Product name: smaller */
  .product-card .card-name {
    font-size: 0.7rem !important;
    line-height: 1.3 !important;
    -webkit-line-clamp: 2 !important;
  }

  /* Swatches & sizes row: hide on mobile */
  .product-card .card-swatches {
    display: none !important;
  }

  /* Price: smaller */
  .product-card .card-price-wrap {
    gap: 0.25rem !important;
  }
  .product-card .card-price-main {
    font-size: 0.8rem !important;
  }
  .product-card .card-price-old {
    font-size: 0.6rem !important;
  }
  .product-card .card-currency {
    font-size: 0.6rem !important;
  }

  /* Buttons: compact */
  .product-card .card-buttons {
    gap: 0.25rem !important;
    padding-top: 0 !important;
  }
  .product-card .card-btn {
    padding-top: 0.3rem !important;
    padding-bottom: 0.3rem !important;
    font-size: 0.6rem !important;
    border-radius: 0.5rem !important;
    gap: 0.2rem !important;
  }
  .product-card .card-btn-icon {
    width: 0.65rem !important;
    height: 0.65rem !important;
  }

  /* Badges: smaller on mobile */
  .product-card .card-badges {
    top: 0.25rem !important;
    right: 0.25rem !important;
    gap: 0.2rem !important;
  }
  .product-card .card-badge {
    padding: 0.1rem 0.4rem !important;
    font-size: 0.6rem !important;
  }

  /* Fluid Hero Banner on Mobile */
  .hero-banner-card {
    min-height: 190px !important;
    padding: 1.25rem 1rem !important;
  }

  /* Features Bar on Mobile */
  #store-features-container {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 0.5rem !important;
  }

  /* Admin Dashboard Mobile Adjustments */
  .admin-table-container {
    overflow-x: auto !important;
    -webkit-overflow-scrolling: touch !important;
  }
}


/* Tablet Optimizations (640px to 1024px) */
@media (min-width: 640px) and (max-width: 1023px) {
  #products-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    gap: 1rem !important;
  }

  .hero-banner-card {
    min-height: 240px !important;
  }

  #store-features-container {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }
}

/* Laptop & Desktop (1024px to 1536px) */
@media (min-width: 1024px) {
  #products-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .hero-banner-card {
    min-height: 280px !important;
  }
}

/* Large Screens & Ultrawide (>= 1280px) */
@media (min-width: 1280px) {
  #products-grid {
    grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  }
}




/* ==========================================================================
   MOBILE RESPONSIVE HARDENING - 2026-08-27
   ========================================================================== */
html, body {
  width: 100%;
  max-width: 100%;
  overflow-x: clip;
}

*, *::before, *::after {
  box-sizing: border-box;
}

img, video, svg, canvas {
  max-width: 100%;
}

img, video {
  height: auto;
}

/* Prevent long customer/product text from forcing containers wider than viewport */
.flex > *, .grid > * {
  min-width: 0;
}

@media (max-width: 639px) {
  body {
    min-width: 0 !important;
  }

  /* Page gutters kept small and consistent on phones */
  header > div,
  #categories-section,
  #products-section,
  footer > div,
  body > section > .max-w-7xl {
    padding-left: 10px !important;
    padding-right: 10px !important;
  }

  /* Header must never overflow even with a long store name */
  #header-logo-container {
    min-width: 0 !important;
    flex: 1 1 auto !important;
  }
  #header-logo-container + div {
    flex: 0 0 auto !important;
  }

  /* Announcement text can wrap instead of creating horizontal scroll */
  #top-announcement-bar .container {
    width: 100% !important;
    min-width: 0 !important;
  }
  #announcement-text {
    overflow-wrap: anywhere;
  }

  /* Hero */
  .hero-banner-card,
  #hero-banner-container > div {
    min-height: 185px !important;
    width: 100% !important;
  }
  #hero-banner-container h1 {
    font-size: clamp(1.35rem, 7vw, 1.85rem) !important;
    overflow-wrap: anywhere;
  }
  #hero-banner-container a,
  #hero-banner-container button {
    max-width: 100%;
  }

  /* Section heading/sort area */
  #products-section > div:first-child {
    width: 100%;
  }
  #products-section h2 {
    font-size: 1.25rem !important;
    line-height: 1.45 !important;
    flex-wrap: wrap;
  }
  #products-section .self-end {
    align-self: stretch !important;
    width: 100%;
  }
  #store-sort-select {
    min-width: 0 !important;
    max-width: 100% !important;
    flex: 1 1 auto;
    padding-left: .65rem !important;
    padding-right: .65rem !important;
  }

  /* Keep horizontal filter scrolling only inside its own row */
  #category-filter-tabs {
    width: 100%;
    max-width: 100%;
    overflow-x: auto !important;
    overflow-y: hidden !important;
    overscroll-behavior-inline: contain;
  }
  #category-filter-tabs > * {
    flex: 0 0 auto;
  }

  /* Product grid/cards */
  #products-grid {
    width: 100% !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 8px !important;
  }
  .product-card {
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
  }
  .product-card img {
    max-width: 100% !important;
  }
  .product-card button {
    min-width: 0 !important;
    white-space: normal !important;
    line-height: 1.2 !important;
  }

  /* Categories: smaller imagery so cards fit short phone screens better */
  #categories-cards-grid > div > div {
    height: clamp(125px, 42vw, 165px) !important;
  }
  #categories-cards-grid h3 {
    font-size: .92rem !important;
    overflow-wrap: anywhere;
  }

  /* Feature tiles must allow Arabic text to wrap */
  #store-features-container > * {
    min-width: 0 !important;
  }
  #store-features-container * {
    overflow-wrap: anywhere;
  }

  /* All storefront modals stay inside the viewport */
  #product-details-modal,
  #easy-order-modal,
  #order-success-modal,
  #order-tracking-modal {
    padding: 8px !important;
  }
  #product-details-modal > div:last-child,
  #easy-order-modal > div:last-child,
  #order-success-modal > div:last-child,
  #order-tracking-modal > div:last-child {
    width: calc(100vw - 16px) !important;
    max-width: calc(100vw - 16px) !important;
    margin: 0 !important;
    padding: 14px !important;
    border-radius: 18px !important;
    max-height: calc(100dvh - 16px) !important;
    overflow-x: hidden !important;
    overflow-y: auto !important;
  }

  /* Product detail content */
  #product-modal-content img {
    max-width: 100% !important;
    object-fit: contain !important;
  }
  #product-modal-content .w-16 {
    width: 3.25rem !important;
    height: 3.25rem !important;
  }

  /* Tracking search stacks on very narrow devices */
  #order-tracking-modal .flex.gap-2 {
    min-width: 0;
  }
  #tracking-query-input {
    min-width: 0 !important;
  }

  /* Cart drawer uses the phone width, never wider */
  #cart-drawer {
    width: min(100vw, 28rem) !important;
    max-width: 100vw !important;
  }
  #cart-drawer .p-5 {
    padding-left: 14px !important;
    padding-right: 14px !important;
  }

  /* Floating WhatsApp button: keep clear of phone edges */
  #floating-whatsapp-btn {
    left: 12px !important;
    bottom: max(12px, env(safe-area-inset-bottom)) !important;
    width: 50px !important;
    height: 50px !important;
  }

  /* Long values such as addresses, order IDs and emails */
  #success-customer-address,
  #footer-email,
  #footer-address {
    max-width: 58vw !important;
    overflow-wrap: anywhere;
    word-break: break-word;
  }
}

@media (max-width: 374px) {
  #products-grid {
    gap: 6px !important;
  }
  .product-card button {
    font-size: 9px !important;
  }
  #store-features-container {
    grid-template-columns: 1fr !important;
  }
  #easy-order-modal h3,
  #order-tracking-modal h3 {
    font-size: .95rem !important;
  }
}

/* ==========================================================================
   PRINT STYLESHEET - 2 Slips per A4 with Cut Divider Line
   ========================================================================== */
@media screen {
  #print-area {
    display: none !important;
  }
}

@media print {
  @page {
    size: A4 portrait;
    margin: 3mm 4mm;
  }
  
  html, body {
    background: #ffffff !important;
    color: #000000 !important;
    padding: 0 !important;
    margin: 0 !important;
    font-family: 'Cairo', 'Tajawal', sans-serif !important;
    font-size: 8.5pt !important;
    height: auto !important;
    min-height: 0 !important;
    overflow: visible !important;
  }
  
  body * {
    visibility: hidden !important;
  }
  
  #print-area, #print-area * {
    visibility: visible !important;
  }
  
  #print-area {
    position: absolute !important;
    left: 0 !important;
    top: 0 !important;
    width: 100% !important;
    display: block !important;
    margin: 0 !important;
    padding: 0 !important;
    background: transparent !important;
    height: auto !important;
    min-height: 0 !important;
  }

  /* Layout 1: 2 Slips per A4 Sheet (Guaranteed 1 Single Page for 2 Slips) */
  .print-layout-2 {
    display: block !important;
    width: 100% !important;
    box-sizing: border-box !important;
  }
  .print-layout-2 .slip-card {
    box-sizing: border-box !important;
    width: 100% !important;
    height: 124mm !important;
    max-height: 126mm !important;
    padding: 4px 8px !important;
    margin: 0 !important;
    border: 1.5px solid #000000 !important;
    border-radius: 6px !important;
    background: #ffffff !important;
    page-break-inside: avoid !important;
    break-inside: avoid !important;
    overflow: hidden !important;
    font-size: 8pt !important;
  }

  /* Scissors Cut Line Divider between Slip 1 and Slip 2 */
  .slip-cut-divider {
    box-sizing: border-box !important;
    width: 100% !important;
    height: 5mm !important;
    margin: 1mm 0 !important;
    border-top: 1.5px dashed #000000 !important;
    text-align: center !important;
    font-size: 7.5pt !important;
    font-weight: 900 !important;
    color: #000000 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    page-break-inside: avoid !important;
  }

  .print-layout-2 .slip-page-break {
    page-break-after: always !important;
    break-after: page !important;
    height: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    border: none !important;
    visibility: hidden !important;
  }

  /* Layout 2: 3 Slips per A4 Sheet (ARRIVE Shipping Standard - 3 per Page) */
  .print-layout-3 {
    display: block !important;
    width: 100% !important;
    box-sizing: border-box !important;
  }
  .print-layout-3 .slip-card-third {
    box-sizing: border-box !important;
    width: 100% !important;
    height: 86mm !important;
    max-height: 87mm !important;
    padding: 4px 8px !important;
    margin: 0 0 3mm 0 !important;
    border: 1.8px solid #000000 !important;
    border-radius: 8px !important;
    background: #ffffff !important;
    page-break-inside: avoid !important;
    break-inside: avoid !important;
    overflow: hidden !important;
    font-size: 8.5pt !important;
    line-height: 1.2 !important;
  }
  .print-layout-3 .slip-cut-divider {
    box-sizing: border-box !important;
    width: 100% !important;
    height: 4mm !important;
    margin: 1mm 0 !important;
    border-top: 1.5px dashed #000000 !important;
    text-align: center !important;
    font-size: 7.5pt !important;
    font-weight: 900 !important;
    color: #000000 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    page-break-inside: avoid !important;
  }
  .print-layout-3 .slip-page-break {
    page-break-after: always !important;
    break-after: page !important;
    height: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    border: none !important;
    visibility: hidden !important;
  }

  /* Layout 3: 4 Slips per A4 Sheet (Grid 2x2) */
  .print-layout-4 {
    display: grid !important;
    grid-template-columns: 1fr 1fr !important;
    grid-gap: 4mm !important;
    width: 100% !important;
    box-sizing: border-box !important;
  }
  .print-layout-4 .slip-card {
    box-sizing: border-box !important;
    width: 100% !important;
    max-height: 138mm !important;
    padding: 6px 8px !important;
    border: 1.5px solid #000000 !important;
    border-radius: 6px !important;
    background: #ffffff !important;
    page-break-inside: avoid !important;
    break-inside: avoid !important;
    font-size: 8pt !important;
  }
  .print-layout-4 .slip-page-break {
    grid-column: span 2 !important;
    page-break-after: always !important;
    break-after: page !important;
    height: 0 !important;
    visibility: hidden !important;
  }

  /* Layout 4: 1 Slip per Page (Single Full A5/A4) */
  .print-layout-single .slip-card,
  .print-layout-single .slip-card-third {
    box-sizing: border-box !important;
    width: 100% !important;
    padding: 14px 18px !important;
    border: 2px solid #000000 !important;
    border-radius: 10px !important;
    background: #ffffff !important;
    margin-bottom: 20px !important;
    page-break-after: always !important;
    break-after: page !important;
  }
  .print-layout-single .slip-card:last-child,
  .print-layout-single .slip-card-third:last-child {
    page-break-after: auto !important;
    break-after: auto !important;
  }

  .no-print {
    display: none !important;
  }
}

/* ========================================================================== 
   FINAL MOBILE PRODUCT CARD OVERRIDE - 2026-08-27
   Keep exactly two tidy, compact cards per row on phones.
   ========================================================================== */
@media (max-width: 639px) {
  #products-section {
    padding-left: 8px !important;
    padding-right: 8px !important;
  }

  #products-grid {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    column-gap: 8px !important;
    row-gap: 10px !important;
    width: 100% !important;
    max-width: 100% !important;
    align-items: stretch !important;
  }

  #products-grid > .product-card {
    width: 100% !important;
    min-width: 0 !important;
    max-width: none !important;
    margin: 0 !important;
    border-radius: 10px !important;
    overflow: hidden !important;
    align-self: stretch !important;
  }

  /* Shorter image = much smaller card height on phones */
  #products-grid > .product-card > div:first-child,
  #products-grid .card-image-wrap {
    aspect-ratio: 4 / 3 !important;
    width: 100% !important;
    min-height: 0 !important;
    height: auto !important;
  }

  #products-grid > .product-card > div:first-child img,
  #products-grid .card-image-wrap img {
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
    display: block !important;
  }

  #products-grid .product-card h3 {
    font-size: 10.5px !important;
    line-height: 1.3 !important;
    min-height: 27px !important;
    max-height: 27px !important;
    overflow: hidden !important;
  }

  #products-grid .product-card button {
    min-width: 0 !important;
    max-width: 100% !important;
    padding-left: 2px !important;
    padding-right: 2px !important;
    font-size: 9px !important;
    line-height: 1.15 !important;
    white-space: nowrap !important;
    overflow: hidden !important;
  }

  #products-grid .product-card button svg {
    flex: 0 0 auto !important;
  }
}

/* Very narrow phones: still two columns, with tighter spacing */
@media (max-width: 374px) {
  #products-section {
    padding-left: 6px !important;
    padding-right: 6px !important;
  }
  #products-grid {
    column-gap: 6px !important;
    row-gap: 8px !important;
  }
  #products-grid .product-card h3 {
    font-size: 10px !important;
  }
  #products-grid .product-card button {
    font-size: 8.5px !important;
  }
}

/* ========================================================================== 
   PHONE LAYOUT DEFINITIVE FIX - 2026-08-27 r4
   Fix oversized product cards + restore horizontal category scrolling.
   ========================================================================== */
@media (max-width: 639px) {
  /* Do not clip scrollable rows at section level. Body still blocks page overflow. */
  body > section,
  section,
  main,
  nav {
    overflow-x: visible !important;
  }

  html,
  body {
    width: 100% !important;
    max-width: 100% !important;
    overflow-x: hidden !important;
  }

  #products-section {
    width: 100% !important;
    max-width: 100vw !important;
    padding-left: 8px !important;
    padding-right: 8px !important;
    overflow: visible !important;
  }

  /* Horizontal category pills must actually scroll on phones */
  #category-filter-tabs {
    display: flex !important;
    flex-wrap: nowrap !important;
    width: 100% !important;
    max-width: 100% !important;
    overflow-x: auto !important;
    overflow-y: hidden !important;
    -webkit-overflow-scrolling: touch !important;
    touch-action: pan-x !important;
    scrollbar-width: none !important;
    gap: 8px !important;
    padding-bottom: 10px !important;
    margin-bottom: 18px !important;
  }
  #category-filter-tabs::-webkit-scrollbar {
    display: none !important;
  }
  #category-filter-tabs > * {
    flex: 0 0 auto !important;
    width: auto !important;
    max-width: none !important;
    white-space: nowrap !important;
  }

  /* Use flex wrapping instead of CSS grid to prevent min-content overflow. */
  #products-grid {
    display: flex !important;
    flex-wrap: wrap !important;
    align-items: stretch !important;
    justify-content: flex-start !important;
    gap: 8px !important;
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    overflow: visible !important;
  }

  #products-grid > .product-card {
    box-sizing: border-box !important;
    flex: 0 0 calc((100% - 8px) / 2) !important;
    width: calc((100% - 8px) / 2) !important;
    max-width: calc((100% - 8px) / 2) !important;
    min-width: 0 !important;
    margin: 0 !important;
    border-radius: 10px !important;
    overflow: hidden !important;
  }

  #products-grid > .product-card > div:first-child,
  #products-grid .card-image-wrap {
    width: 100% !important;
    max-width: 100% !important;
    height: auto !important;
    aspect-ratio: 1 / 1 !important;
    overflow: hidden !important;
  }

  #products-grid > .product-card > div:first-child img,
  #products-grid .card-image-wrap img,
  #products-grid .product-card img {
    display: block !important;
    width: 100% !important;
    max-width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
  }

  #products-grid .product-card:hover {
    transform: none !important;
  }

  #products-grid .product-card h3 {
    font-size: 10px !important;
    line-height: 1.25 !important;
    min-height: 25px !important;
    max-height: 25px !important;
  }

  #products-grid .product-card button {
    min-width: 0 !important;
    padding: 5px 1px !important;
    font-size: 8.5px !important;
    line-height: 1.1 !important;
  }
}

@media (max-width: 360px) {
  #products-grid {
    gap: 6px !important;
  }
  #products-grid > .product-card {
    flex-basis: calc((100% - 6px) / 2) !important;
    width: calc((100% - 6px) / 2) !important;
    max-width: calc((100% - 6px) / 2) !important;
  }
}


/* v14: visible animated "Coming Soon" category state */
.coming-soon-category {
  position: relative;
  isolation: isolate;
  transition: transform .35s ease, box-shadow .35s ease, border-color .35s ease;
}
.coming-soon-category:hover {
  transform: translateY(-4px);
  box-shadow: 0 18px 42px rgba(15, 23, 42, .18);
  border-color: rgba(245, 158, 11, .45);
}
.coming-soon-category img {
  animation: ayComingSoonImage 6s ease-in-out infinite alternate;
  will-change: transform, filter;
}
.coming-soon-glow {
  position: absolute;
  inset: -25% -55%;
  width: 52%;
  height: 150%;
  background: linear-gradient(105deg, transparent 10%, rgba(255,255,255,.08) 34%, rgba(255,255,255,.58) 50%, rgba(255,255,255,.10) 66%, transparent 90%);
  transform: translateX(285%) rotate(10deg);
  animation: ayComingSoonSweep 2.8s cubic-bezier(.4,0,.2,1) infinite;
  z-index: 3;
  pointer-events: none;
  will-change: transform, opacity;
}
.coming-soon-badge {
  z-index: 7;
  animation: ayComingSoonBadge 1.8s ease-in-out infinite;
  box-shadow: 0 7px 22px rgba(0,0,0,.22);
}
.coming-soon-dot {
  width: 8px;
  height: 8px;
  border-radius: 999px;
  background: #f59e0b;
  display: inline-block;
  box-shadow: 0 0 0 0 rgba(245,158,11,.7);
  animation: ayComingSoonPulse 1.45s ease-out infinite;
}
.coming-soon-marquee {
  position: absolute;
  inset-inline: -15%;
  top: 48%;
  z-index: 5;
  transform: rotate(-8deg);
  overflow: hidden;
  pointer-events: none;
  opacity: .96;
}
.coming-soon-marquee-track {
  display: flex;
  width: max-content;
  gap: 28px;
  white-space: nowrap;
  padding: 8px 0;
  background: rgba(245,158,11,.92);
  color: #111827;
  font-weight: 1000;
  font-size: 12px;
  letter-spacing: .04em;
  box-shadow: 0 4px 18px rgba(0,0,0,.18);
  animation: ayComingSoonMarquee 7s linear infinite;
}
.coming-soon-marquee-track span { padding-inline: 5px; }
@keyframes ayComingSoonSweep {
  0% { transform: translateX(285%) rotate(10deg); opacity: 0; }
  12% { opacity: 1; }
  55% { opacity: 1; }
  72%,100% { transform: translateX(-285%) rotate(10deg); opacity: 0; }
}
@keyframes ayComingSoonBadge {
  0%,100% { transform: translateY(0) scale(1); }
  50% { transform: translateY(-3px) scale(1.045); }
}
@keyframes ayComingSoonPulse {
  0% { box-shadow: 0 0 0 0 rgba(245,158,11,.7); }
  75% { box-shadow: 0 0 0 8px rgba(245,158,11,0); }
  100% { box-shadow: 0 0 0 0 rgba(245,158,11,0); }
}
@keyframes ayComingSoonImage {
  0% { transform: scale(1.02); filter: saturate(.75) brightness(.92); }
  100% { transform: scale(1.08); filter: saturate(.92) brightness(.98); }
}
@keyframes ayComingSoonMarquee {
  from { transform: translateX(0); }
  to { transform: translateX(-50%); }
}
@media (max-width: 640px) {
  .coming-soon-marquee-track { font-size: 10px; gap: 20px; padding: 6px 0; }
}

/* ========================================================================== */
/* AY STOREFRONT V20 — editorial rebuild                                      */
/* ========================================================================== */
:root{--ay-ink:#121416;--ay-paper:#f7f4ef;--ay-card:#fff;--ay-gold:#d3ab75;--ay-line:#e7e1d8;--ay-muted:#77736c}
html{scroll-behavior:smooth}
body.ay-storefront{background:var(--ay-paper);font-family:"Cairo","Tajawal",system-ui,sans-serif;color:var(--ay-ink)}
.ay-announcement{background:#111315;color:#f7f4ef;padding:7px 14px;font-size:12px;font-weight:800;letter-spacing:.02em}
.ay-header{background:rgba(18,20,22,.98);color:#fff;border-bottom:1px solid rgba(255,255,255,.08);box-shadow:0 8px 30px rgba(0,0,0,.12)}
.ay-header-row{height:72px;display:grid;grid-template-columns:auto 1fr auto;gap:28px;align-items:center}
.ay-brand{display:flex;align-items:center;gap:10px;color:#fff;text-decoration:none;direction:ltr}
.ay-brand-mark{font-weight:1000;font-size:26px;letter-spacing:-3px;color:#e2bf8e;line-height:1}
.ay-brand-copy{display:flex;flex-direction:column;line-height:1.1}
.ay-brand-copy strong{font-size:11px;letter-spacing:.13em}.ay-brand-copy small{font-size:9px;color:#8f9296;margin-top:4px}
.ay-main-nav{display:flex;align-items:center;justify-content:center;gap:26px;font-size:12px;font-weight:800;color:#b8babd}
.ay-main-nav a,.ay-main-nav button{transition:.2s;color:inherit;background:none;border:0;cursor:pointer}.ay-main-nav a:hover,.ay-main-nav button:hover,.ay-main-nav .active{color:#e2bf8e}
.ay-header-actions{display:flex;align-items:center;gap:8px;direction:ltr}.ay-search-wrap{position:relative;width:210px}.ay-search-wrap input{width:100%;height:38px;border-radius:999px;border:1px solid #313438;background:#202326;color:#fff;padding:0 38px 0 14px;font-size:11px;outline:none}.ay-search-wrap input:focus{border-color:#7f694a;background:#181a1c}.ay-search-wrap svg{position:absolute;right:12px;top:11px;width:16px;height:16px;color:#85898f}.ay-icon-btn{width:38px;height:38px;border-radius:50%;border:1px solid #313438;background:#202326;display:grid;place-items:center}.ay-icon-btn svg{width:16px}.ay-cart-btn{height:38px;border-radius:999px;background:#e0b981;color:#121416;border:0;display:flex;align-items:center;gap:7px;padding:0 13px;font-size:11px;font-weight:900}.ay-cart-btn svg{width:16px}.ay-cart-btn b{background:#111315;color:#fff;border-radius:50%;min-width:18px;height:18px;display:grid;place-items:center;font-size:9px}.ay-mobile-search{display:none}

.ay-hero-section{max-width:1440px;margin:0 auto;padding:18px 20px 0}.ay-hero-card{position:relative;min-height:430px;border-radius:0 0 22px 22px;overflow:hidden;background:#111315;box-shadow:0 18px 48px rgba(15,15,15,.18)}.ay-hero-image{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center 32%}.ay-hero-overlay{position:absolute;inset:0;background:linear-gradient(90deg,rgba(10,11,12,.92) 0%,rgba(10,11,12,.72) 36%,rgba(10,11,12,.18) 68%,rgba(10,11,12,.08) 100%)}.ay-hero-content{position:relative;z-index:2;min-height:430px;width:min(540px,52%);padding:70px 58px;display:flex;flex-direction:column;align-items:flex-start;justify-content:center;color:#fff}.ay-hero-eyebrow,.ay-kicker{font-size:11px;font-weight:900;letter-spacing:.16em;color:#d8b07a}.ay-hero-content h1{font-size:clamp(42px,5vw,72px);font-weight:1000;line-height:1.02;margin:12px 0 16px;letter-spacing:-.04em;max-width:520px}.ay-hero-content p{color:#d2d2d2;max-width:470px;font-size:14px;line-height:1.9}.ay-hero-actions{display:flex;gap:10px;margin-top:26px}.ay-primary-cta,.ay-secondary-cta{height:44px;padding:0 22px;border-radius:8px;display:inline-flex;align-items:center;justify-content:center;gap:8px;font-size:12px;font-weight:900;transition:.2s}.ay-primary-cta{background:#d5ad78;color:#141414}.ay-primary-cta:hover{background:#e3c498;transform:translateY(-2px)}.ay-secondary-cta{border:1px solid rgba(255,255,255,.24);background:rgba(255,255,255,.06);color:#fff}.ay-primary-cta svg{width:15px}.ay-hero-pager{position:absolute;z-index:3;bottom:20px;left:50%;transform:translateX(-50%);display:flex;gap:7px}.ay-hero-pager span{width:8px;height:8px;border-radius:999px;background:rgba(255,255,255,.35)}.ay-hero-pager .active{width:26px;background:#f2dfc4}

.ay-section{max-width:1440px;margin:0 auto;padding:54px 20px}.ay-section-heading{display:flex;justify-content:space-between;align-items:end;gap:24px;margin-bottom:24px}.ay-section-heading h2{font-size:28px;line-height:1.2;margin:5px 0 5px;font-weight:1000;letter-spacing:-.03em}.ay-section-heading p{font-size:12px;color:#817c74}.ay-section-heading.compact{margin:0}.ay-text-link{border:0;background:transparent;font-size:12px;font-weight:900;display:flex;gap:6px;align-items:center;color:#262626}.ay-text-link svg{width:14px}.ay-categories-grid{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:13px}.ay-category-card{height:250px;position:relative;overflow:hidden;border-radius:12px;background:#111;box-shadow:0 8px 28px rgba(26,24,21,.12);cursor:default}.ay-category-card.is-live{cursor:pointer}.ay-category-card img{width:100%;height:100%;object-fit:cover;transition:transform .65s cubic-bezier(.2,.7,.2,1),filter .3s}.ay-category-card.is-live:hover img{transform:scale(1.06)}.ay-category-shade{position:absolute;inset:0;background:linear-gradient(0deg,rgba(8,9,10,.93) 0%,rgba(8,9,10,.24) 58%,rgba(8,9,10,.05) 100%)}.ay-category-status{position:absolute;top:12px;left:12px;padding:6px 10px;border-radius:999px;font-size:10px;font-weight:1000;z-index:6}.ay-category-status.live{background:#15b982;color:#fff}.ay-category-status.soon{background:#fff;color:#171717}.ay-category-status.off{background:#d74444;color:#fff}.ay-category-icon{position:absolute;top:12px;right:12px;font-size:20px;z-index:5}.ay-category-copy{position:absolute;z-index:4;right:16px;left:16px;bottom:14px;color:#fff}.ay-category-copy h3{font-size:20px;font-weight:1000}.ay-category-copy p{font-size:10px;color:#d3d3d3;margin-top:2px}.ay-category-arrow{position:absolute;left:0;bottom:2px;width:25px;height:25px;border-radius:50%;border:1px solid rgba(255,255,255,.28);display:grid;place-items:center}
.ay-category-card.coming-soon-category img{filter:saturate(.65) brightness(.7)}.coming-soon-glow{position:absolute;inset:-70% -30%;background:linear-gradient(112deg,transparent 38%,rgba(255,255,255,.18) 48%,rgba(255,255,255,.5) 50%,rgba(255,255,255,.16) 53%,transparent 63%);transform:translateX(-45%) rotate(4deg);animation:ayShimmer 3.2s ease-in-out infinite;z-index:3}.coming-soon-marquee{position:absolute;top:49%;left:-10%;right:-10%;height:29px;transform:rotate(-10deg);background:rgba(215,181,132,.94);color:#171717;overflow:hidden;z-index:5;box-shadow:0 7px 20px rgba(0,0,0,.18)}.coming-soon-marquee-track{display:flex;width:max-content;animation:ayMarquee 8s linear infinite}.coming-soon-marquee-track span{padding:7px 20px;font-size:9px;font-weight:1000;letter-spacing:.08em;white-space:nowrap}.coming-soon-dot{width:6px;height:6px;border-radius:50%;background:#d4a363;display:inline-block;margin-left:4px;animation:ayPulse 1.4s infinite}@keyframes ayShimmer{0%,20%{transform:translateX(-65%) rotate(4deg)}75%,100%{transform:translateX(65%) rotate(4deg)}}@keyframes ayMarquee{to{transform:translateX(-35%)}}@keyframes ayPulse{50%{opacity:.35;transform:scale(.75)}}

.ay-features-strip{background:#fff;border-top:1px solid var(--ay-line);border-bottom:1px solid var(--ay-line);padding:20px 0}.ay-features-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:10px}.ay-features-grid>div{background:transparent!important;border:0!important;box-shadow:none!important;padding:8px 14px!important}.ay-features-grid svg,.ay-features-grid i{color:#a98454!important}.ay-features-grid h3,.ay-features-grid h4{color:#191919!important;font-size:12px!important}.ay-features-grid p{color:#8b857d!important;font-size:10px!important}

.ay-products-toolbar{display:flex;justify-content:space-between;align-items:end;gap:20px;margin-bottom:18px}.ay-sort-wrap{display:flex;align-items:center;gap:8px;font-size:11px;font-weight:800;color:#78736d}.ay-sort-wrap select{height:38px;border-radius:8px;border:1px solid #ddd7cf;background:#fff;padding:0 12px;font-size:11px;outline:none}.ay-count-label{font-size:11px;font-weight:800;color:#aaa29a;margin-top:7px;display:block}.ay-filter-tabs{display:flex;gap:7px;overflow:auto;padding-bottom:13px;margin-bottom:20px}.ay-filter-tabs .category-tab{border-radius:999px!important;padding:8px 14px!important;font-size:10px!important;box-shadow:none!important}.ay-products-grid{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:13px}.ay-product-card{background:#fff;border:1px solid #ece6de;border-radius:10px;overflow:hidden;transition:.25s;min-width:0}.ay-product-card:hover{transform:translateY(-4px);box-shadow:0 16px 35px rgba(25,23,20,.11)}.ay-product-media{position:relative;aspect-ratio:3/4;background:#efede9;overflow:hidden;cursor:pointer}.ay-product-media>img{width:100%;height:100%;object-fit:cover;transition:transform .55s}.ay-product-card:hover .ay-product-media>img{transform:scale(1.035)}.ay-wishlist{position:absolute;top:10px;right:10px;width:29px;height:29px;border-radius:50%;background:rgba(255,255,255,.9);display:grid;place-items:center;border:1px solid rgba(0,0,0,.07);z-index:3}.ay-wishlist svg{width:14px}.ay-discount{position:absolute;top:10px;left:10px;background:#d3ad78;color:#171717;border-radius:5px;padding:5px 7px;font-size:9px;font-weight:1000;z-index:3}.ay-quick-view{position:absolute;right:10px;left:10px;bottom:10px;height:34px;border:0;border-radius:7px;background:#111315;color:#fff;font-size:10px;font-weight:900;display:flex;align-items:center;justify-content:center;gap:6px;opacity:0;transform:translateY(7px);transition:.25s;z-index:3}.ay-quick-view svg{width:13px}.ay-product-card:hover .ay-quick-view{opacity:1;transform:none}.ay-unavailable-overlay{position:absolute;inset:0;background:rgba(10,10,10,.48);display:grid;place-items:center;z-index:4}.ay-unavailable-overlay span{background:#fff;color:#b32929;font-size:10px;font-weight:1000;border-radius:999px;padding:7px 10px}.ay-product-info{padding:12px}.ay-product-category{font-size:9px;color:#a09a92;font-weight:800}.ay-product-info h3{font-size:12px;line-height:1.55;font-weight:900;margin:4px 0 5px;min-height:38px;cursor:pointer}.ay-rating{display:flex;align-items:center;justify-content:space-between;gap:5px;font-size:8px}.ay-rating span{color:#c89b5c;letter-spacing:1px}.ay-rating small{color:#a29c94;font-size:8px}.ay-product-options{height:22px;margin-top:6px;display:flex;align-items:center;justify-content:space-between;border-top:1px solid #f1ede8;padding-top:6px}.ay-product-options small{font-size:8px;color:#8c877f}.ay-swatches{display:flex;gap:3px}.ay-swatches i{width:10px;height:10px;border-radius:50%;border:1px solid #ddd}.ay-product-bottom{margin-top:8px;display:flex;justify-content:space-between;align-items:end}.ay-price{display:flex;align-items:baseline;gap:3px;flex-wrap:wrap}.ay-price strong{font-size:15px}.ay-price span{font-size:8px;color:#777}.ay-price del{font-size:8px;color:#aaa;margin-right:3px}.ay-add-btn{width:31px;height:31px;border:0;border-radius:7px;background:#111315;color:#fff;display:grid;place-items:center;transition:.2s}.ay-add-btn:hover{background:#d0a66e;color:#111}.ay-add-btn svg{width:14px}.ay-empty-state{grid-column:1/-1;text-align:center;padding:70px 20px}.ay-empty-state svg{width:42px;height:42px;margin:0 auto;color:#b7b0a7}.ay-empty-state h3{font-weight:1000;font-size:20px;margin-top:12px}.ay-empty-state p{color:#8b857d;font-size:12px;margin:4px 0 15px}.ay-empty-state button{border:0;background:#111;color:#fff;border-radius:8px;padding:10px 16px;font-size:11px;font-weight:900}

.ay-footer{background:#111315;color:#fff;margin-top:55px;border-top:0}.ay-footer .text-slate-400{color:#8e9195!important}.ay-footer .text-slate-200{color:#f1eee9!important}.ay-footer a:hover{color:#d6ad78!important}

/* Product detail restyle without touching its logic */
#product-details-modal>div.relative{max-width:980px!important;border-radius:14px!important;padding:18px!important;background:#fbfaf8!important}#product-modal-content>div{gap:28px!important}#product-modal-content img#modal-active-image{background:#f1efeb;border-radius:10px}#product-modal-content h2{font-size:28px!important;letter-spacing:-.03em}#product-modal-content .size-badge{border-radius:7px!important;width:44px!important;height:40px!important;background:#fff!important;border:1px solid #ded8d0!important;color:#171717!important}#product-modal-content .size-badge.selected{background:#111315!important;color:#fff!important;border-color:#111315!important}

@media(max-width:1100px){.ay-categories-grid,.ay-products-grid{grid-template-columns:repeat(4,minmax(0,1fr))}.ay-search-wrap{display:none}.ay-main-nav{gap:17px}}
@media(max-width:820px){.ay-header-row{height:58px;grid-template-columns:auto 1fr auto}.ay-main-nav{display:none}.ay-brand-copy{display:none}.ay-brand-mark{font-size:24px}.ay-header-actions{justify-self:end}.ay-mobile-search{display:flex;position:relative;padding-bottom:9px}.ay-mobile-search input{width:100%;height:36px;border-radius:8px;background:#232629;border:1px solid #313438;color:#fff;padding:0 36px 0 12px;font-size:10px}.ay-mobile-search svg{position:absolute;right:12px;top:9px;width:15px;color:#8c9095}.ay-icon-btn{display:none}.ay-hero-section{padding:10px 10px 0}.ay-hero-card{min-height:360px;border-radius:0 0 15px 15px}.ay-hero-content{min-height:360px;width:72%;padding:38px 24px}.ay-hero-content h1{font-size:38px}.ay-hero-content p{font-size:11px;line-height:1.7}.ay-section{padding:38px 12px}.ay-categories-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:9px}.ay-category-card{height:205px}.ay-products-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:9px}.ay-features-grid{grid-template-columns:repeat(2,1fr)}.ay-products-toolbar{align-items:flex-start}.ay-section-heading h2{font-size:23px}.ay-sort-wrap label{display:none}.ay-product-info{padding:9px}.ay-product-info h3{font-size:11px;min-height:34px}.ay-product-media{aspect-ratio:3/4}.ay-quick-view{display:none}.ay-rating small{display:none}}
@media(max-width:480px){.ay-header-actions .ay-cart-btn{padding:0 10px}.ay-hero-card{min-height:315px}.ay-hero-image{object-position:61% center}.ay-hero-overlay{background:linear-gradient(90deg,rgba(10,11,12,.9) 0%,rgba(10,11,12,.64) 56%,rgba(10,11,12,.08) 100%)}.ay-hero-content{min-height:315px;width:78%;padding:32px 18px}.ay-hero-content h1{font-size:30px;margin:9px 0}.ay-hero-eyebrow{font-size:8px}.ay-hero-actions{margin-top:18px}.ay-primary-cta,.ay-secondary-cta{height:38px;padding:0 13px;font-size:10px}.ay-secondary-cta{display:none}.ay-section-heading p{display:none}.ay-category-card{height:185px}.ay-category-copy h3{font-size:16px}.ay-category-copy p{font-size:9px}.ay-products-grid{gap:8px}.ay-product-info{padding:8px}.ay-rating{display:none}.ay-product-options{height:18px;margin-top:3px}.ay-product-bottom{margin-top:5px}.ay-price strong{font-size:13px}.ay-add-btn{width:28px;height:28px}}

/* v21 brand visibility fix */
.ay-brand{min-width:190px;max-width:360px}
.ay-brand-logo{width:44px;height:44px;border-radius:50%;object-fit:cover;border:1px solid rgba(255,255,255,.18);flex:0 0 auto}
.ay-brand-copy{display:flex!important;flex-direction:column!important;min-width:0;line-height:1.15!important}
.ay-brand-copy strong{color:#fff!important;font-size:13px!important;letter-spacing:0!important;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:245px}
.ay-brand-copy small{color:#aaa!important;font-size:9px!important;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:245px}
@media(max-width:820px){.ay-brand{min-width:0;max-width:190px;gap:7px}.ay-brand-logo{width:36px;height:36px}.ay-brand-copy{display:flex!important}.ay-brand-copy strong{font-size:10px!important;max-width:120px}.ay-brand-copy small{font-size:7px!important;max-width:120px}.ay-header-row{grid-template-columns:minmax(0,auto) 1fr auto}}


/* V22: full-width compact auto collection slider */
.ay-hero-section{max-width:none!important;width:100%!important;margin:0!important;padding:12px 18px 0!important}
.ay-hero-card{min-height:330px!important;border-radius:20px!important;max-width:none!important;width:100%!important}
.ay-hero-content{min-height:330px!important;padding:44px 6vw!important;width:min(570px,52%)!important}
.ay-hero-content h1{font-size:clamp(34px,4.2vw,58px)!important}
.ay-hero-pager{display:flex;gap:7px;align-items:center}
.ay-hero-pager button{border:0;width:8px;height:8px;padding:0;border-radius:999px;background:rgba(255,255,255,.38);cursor:pointer;transition:.25s}
.ay-hero-pager button.active{width:28px;background:#f2dfc4}
.ay-hero-arrow{position:absolute;top:50%;z-index:4;transform:translateY(-50%);width:38px;height:38px;border:1px solid rgba(255,255,255,.24);border-radius:999px;background:rgba(0,0,0,.28);backdrop-filter:blur(8px);color:#fff;font-size:26px;line-height:1;display:flex;align-items:center;justify-content:center;opacity:.75;transition:.2s}
.ay-hero-arrow:hover{opacity:1;background:rgba(0,0,0,.48)}.ay-hero-prev{left:18px}.ay-hero-next{right:18px}
.ay-hero-slide-in{animation:ayHeroFade .55s ease both}@keyframes ayHeroFade{from{opacity:.35;transform:scale(.997)}to{opacity:1;transform:scale(1)}}
@media(max-width:820px){.ay-hero-section{padding:8px 8px 0!important}.ay-hero-card{min-height:285px!important;border-radius:15px!important}.ay-hero-content{min-height:285px!important;padding:28px 20px!important;width:76%!important}.ay-hero-content h1{font-size:30px!important}.ay-hero-arrow{width:32px;height:32px;font-size:22px}.ay-hero-prev{left:10px}.ay-hero-next{right:10px}}
@media(max-width:480px){.ay-hero-card{min-height:255px!important}.ay-hero-content{min-height:255px!important;width:82%!important;padding:24px 16px!important}.ay-hero-content h1{font-size:26px!important}.ay-hero-content p{max-width:90%;font-size:10px!important}.ay-hero-arrow{display:none}}

.ay-free-shipping-badge{position:absolute;right:10px;bottom:10px;z-index:3;background:#dff7ea;color:#087443;border:1px solid #b8ecd1;border-radius:999px;padding:6px 9px;font-size:10px;font-weight:900;box-shadow:0 4px 15px rgba(0,0,0,.08)}

/* v25: product-card cart shortcut + quick size picker */
.ay-card-cart{cursor:pointer}.ay-card-cart:hover{background:#111315;color:#fff;transform:scale(1.06)}.ay-card-cart:active{transform:scale(.96)}
.quick-cart-box{overflow:hidden;border:1px solid #ece6de}.quick-cart-titlebar{display:flex;align-items:center;justify-content:space-between;padding:18px 20px;border-bottom:1px solid #eee8e0}.quick-cart-titlebar>div{display:flex;flex-direction:column;gap:2px}.quick-cart-titlebar span{font-size:16px;font-weight:1000;color:#111315}.quick-cart-titlebar small{font-size:10px;color:#8e877f;font-weight:700}.quick-cart-titlebar button{width:34px;height:34px;border:0;border-radius:50%;background:#f3f0ec;display:grid;place-items:center;cursor:pointer}.quick-cart-titlebar button svg{width:16px}.quick-cart-content{padding:18px 20px 20px}.quick-cart-product-head{display:grid;grid-template-columns:72px 1fr;gap:12px;align-items:center;padding-bottom:16px;border-bottom:1px solid #f0ebe5}.quick-cart-product-head img{width:72px;height:88px;object-fit:cover;border-radius:12px;background:#f2efea}.quick-cart-product-head h3{font-size:14px;font-weight:1000;color:#151515;margin:0 0 5px}.quick-cart-product-head p{font-size:11px;color:#8a837b}.quick-cart-product-head p strong{font-size:17px;color:#111315}.quick-cart-section{margin-top:16px}.quick-cart-section>label{display:block;font-size:11px;font-weight:1000;color:#38342f;margin-bottom:8px}.quick-cart-section>label span{color:#d93025}.quick-cart-sizes{display:flex;gap:8px;flex-wrap:wrap}.quick-cart-sizes button{min-width:46px;height:42px;padding:0 13px;border:1px solid #ddd6ce;border-radius:9px;background:#fff;color:#171717;font-size:12px;font-weight:900;cursor:pointer;transition:.2s}.quick-cart-sizes button:hover,.quick-cart-sizes button.selected{background:#111315;border-color:#111315;color:#fff}.quick-cart-error{display:block;color:#c62828;font-size:10px;font-weight:800;margin-top:7px}.quick-cart-error.hidden{display:none}.quick-cart-colors{display:flex;gap:7px;flex-wrap:wrap}.quick-cart-colors button{display:flex;align-items:center;gap:6px;border:1px solid #e1dbd4;background:#fff;border-radius:999px;padding:6px 9px;font-size:10px;font-weight:800;cursor:pointer}.quick-cart-colors button.selected{border-color:#111315;box-shadow:0 0 0 1px #111315 inset}.quick-cart-colors i{width:16px;height:16px;border-radius:50%;border:1px solid rgba(0,0,0,.15)}.quick-cart-qty-row{display:flex;justify-content:space-between;align-items:center}.quick-cart-qty-row>label{margin:0}.quick-cart-qty{display:flex;align-items:center;border:1px solid #e0dad3;border-radius:9px;overflow:hidden}.quick-cart-qty button{width:38px;height:36px;border:0;background:#f6f3ef;font-size:16px;font-weight:900;cursor:pointer}.quick-cart-qty strong{width:38px;text-align:center;font-size:12px}.quick-cart-confirm{width:100%;height:48px;margin-top:18px;border:0;border-radius:11px;background:#111315;color:#fff;display:flex;align-items:center;justify-content:center;gap:8px;font-size:12px;font-weight:1000;cursor:pointer;transition:.2s}.quick-cart-confirm:hover{background:#d0a66e;color:#111}.quick-cart-confirm svg{width:17px}
@media(max-width:520px){.quick-cart-box{border-radius:20px}.quick-cart-titlebar{padding:15px 16px}.quick-cart-content{padding:15px 16px 17px}.quick-cart-product-head{grid-template-columns:64px 1fr}.quick-cart-product-head img{width:64px;height:78px}}


/* v26: self-contained quick-cart modal layout — no Tailwind dependency */
.quick-cart-modal{position:fixed!important;inset:0!important;z-index:99999!important;display:flex!important;align-items:center!important;justify-content:center!important;padding:18px!important;direction:rtl!important;box-sizing:border-box!important}
.quick-cart-modal.hidden{display:none!important}
.quick-cart-backdrop{position:absolute!important;inset:0!important;background:rgba(12,16,24,.62)!important;backdrop-filter:blur(5px)!important;-webkit-backdrop-filter:blur(5px)!important}
.quick-cart-box{position:relative!important;z-index:2!important;width:min(94vw,440px)!important;max-height:min(86vh,690px)!important;overflow:auto!important;background:#fff!important;border-radius:24px!important;box-shadow:0 28px 90px rgba(0,0,0,.30)!important;border:1px solid #ece6de!important;animation:ayQuickCartIn .22s ease-out both!important}
@keyframes ayQuickCartIn{from{opacity:0;transform:translateY(10px) scale(.975)}to{opacity:1;transform:translateY(0) scale(1)}}
.quick-cart-titlebar{position:sticky!important;top:0!important;z-index:3!important;background:rgba(255,255,255,.97)!important;backdrop-filter:blur(8px)!important}
.quick-cart-content{background:#fff!important}
.quick-cart-product-head{grid-template-columns:92px minmax(0,1fr)!important}
.quick-cart-product-head img{width:92px!important;height:118px!important;max-width:92px!important;max-height:118px!important;object-fit:cover!important;display:block!important}
.quick-cart-product-head>div{min-width:0!important}
.quick-cart-product-head h3{font-size:16px!important;line-height:1.5!important;white-space:normal!important;overflow-wrap:anywhere!important}
.quick-cart-product-head p{margin:0!important;line-height:1.6!important}
.quick-cart-section{width:100%!important;box-sizing:border-box!important}
.quick-cart-section>label{font-size:13px!important;margin-bottom:10px!important}
.quick-cart-sizes{display:grid!important;grid-template-columns:repeat(auto-fit,minmax(54px,1fr))!important;gap:8px!important}
.quick-cart-sizes button{width:100%!important;min-width:0!important;height:44px!important;font-size:13px!important}
.quick-cart-colors button{min-height:40px!important;padding:7px 11px!important}
.quick-cart-qty-row{gap:14px!important}
.quick-cart-confirm{height:52px!important;font-size:14px!important;border-radius:12px!important;margin-top:20px!important}
.quick-cart-confirm svg{width:18px!important;height:18px!important}
@media(max-width:520px){.quick-cart-modal{padding:10px!important;align-items:flex-end!important}.quick-cart-box{width:100%!important;max-height:82vh!important;border-radius:22px 22px 14px 14px!important}.quick-cart-titlebar{padding:14px 15px!important}.quick-cart-content{padding:14px 15px 18px!important}.quick-cart-product-head{grid-template-columns:76px minmax(0,1fr)!important}.quick-cart-product-head img{width:76px!important;height:98px!important;max-width:76px!important;max-height:98px!important}.quick-cart-product-head h3{font-size:14px!important}.quick-cart-sizes{grid-template-columns:repeat(3,minmax(0,1fr))!important}.quick-cart-confirm{height:50px!important}}


/* v27: cart icon + size guide inside quick add */
.ay-card-cart svg{width:15px!important;height:15px!important;stroke-width:2.2}
.quick-cart-size-guide{margin-top:14px;border:1px solid #eadfd4;border-radius:12px;background:#fffaf5;overflow:hidden}
.quick-cart-size-guide summary{list-style:none;cursor:pointer;display:flex;align-items:center;justify-content:space-between;gap:10px;padding:12px 13px;font-size:12px;font-weight:1000;color:#2e2924;user-select:none}
.quick-cart-size-guide summary::-webkit-details-marker{display:none}
.quick-cart-size-guide-arrow{font-size:17px;line-height:1;transition:transform .2s ease;color:#7b6d60}
.quick-cart-size-guide[open] .quick-cart-size-guide-arrow{transform:rotate(180deg)}
.quick-cart-size-guide-body{padding:0 10px 10px;overflow:auto}
.quick-cart-size-guide-body table{width:100%!important;min-width:0!important;font-size:10px!important;border-collapse:collapse!important}
.quick-cart-size-guide-body th,.quick-cart-size-guide-body td{padding:7px 5px!important;text-align:center!important;white-space:nowrap}
.quick-cart-size-guide-body th{font-size:9px!important}
.quick-cart-confirm svg{stroke-width:2.2}


/* v29 — per-piece size/color selection for multi-quantity clothing orders */
.piece-options-wrap{margin-top:14px;padding:12px;border:1px solid #e7e0d8;border-radius:14px;background:#faf8f5;display:grid;gap:10px}
.piece-options-wrap.hidden{display:none!important}
.piece-options-title{font-size:13px;font-weight:1000;color:#171717;display:flex;align-items:center;justify-content:space-between;gap:8px}
.piece-options-title small{font-size:10px;color:#81786f;font-weight:700}
.piece-option-card{display:grid;grid-template-columns:auto minmax(0,1fr) minmax(0,1fr);gap:9px;align-items:end;padding:10px;background:#fff;border:1px solid #ece6df;border-radius:12px}
.piece-number{font-size:11px;font-weight:1000;color:#111315;align-self:center;white-space:nowrap}
.piece-option-card label{display:grid;gap:5px;font-size:10px;font-weight:900;color:#5b544d}
.piece-option-card select{width:100%;height:40px;border:1px solid #ddd5cd;border-radius:9px;background:#fff;padding:0 9px;font:inherit;font-size:11px;font-weight:800;color:#171717;outline:none}
.piece-option-card select:focus{border-color:#111315;box-shadow:0 0 0 2px rgba(17,19,21,.08)}
@media(max-width:520px){.piece-options-title{align-items:flex-start;flex-direction:column}.piece-option-card{grid-template-columns:1fr 1fr}.piece-number{grid-column:1/-1}.piece-option-card select{height:42px;font-size:12px}}


/* === v30 Dynamic footer & smart assistant === */
.ay-footer-contact-links{display:flex;flex-wrap:wrap;gap:.6rem;padding-top:.35rem}.ay-footer-contact-chip{display:inline-flex;align-items:center;gap:.45rem;padding:.55rem .75rem;border:1px solid rgba(148,163,184,.18);border-radius:999px;color:#cbd5e1;font-size:.75rem;font-weight:700;background:rgba(30,41,59,.5);transition:.2s}.ay-footer-contact-chip:hover{color:#fff;border-color:rgba(255,255,255,.28);transform:translateY(-1px)}.ay-footer-contact-chip svg{width:15px;height:15px}.ay-footer-contact-chip.is-whatsapp{color:#86efac}.ay-footer-social-links{display:flex;flex-direction:column;gap:.55rem}.ay-footer-social-link{display:flex;align-items:center;gap:.65rem;width:max-content;max-width:100%;color:#94a3b8;font-size:.78rem;font-weight:800;padding:.45rem .2rem;transition:.2s}.ay-footer-social-link:hover{color:#fff;transform:translateX(-2px)}.ay-footer-social-link svg{width:17px;height:17px;color:var(--theme-secondary,#d97706)}.ay-footer-link-btn{background:none;border:0;padding:0;color:inherit;font:inherit;cursor:pointer;text-align:right}.ay-footer-link-btn:hover{color:#fff}.ay-footer-static-link{opacity:.82}.ay-footer-muted{font-size:.68rem;color:#64748b}
.ay-assistant-fab{position:fixed;left:24px;bottom:24px;z-index:45;width:58px;height:58px;border:0;border-radius:20px;background:linear-gradient(145deg,#111827,#0f172a);color:#fff;display:flex;align-items:center;justify-content:center;box-shadow:0 14px 35px rgba(15,23,42,.35);cursor:pointer;transition:.2s}.ay-assistant-fab:hover{transform:translateY(-3px) scale(1.02)}.ay-assistant-fab-dot{position:absolute;right:7px;top:7px;width:9px;height:9px;border-radius:999px;background:#22c55e;border:2px solid #111827}.ay-assistant-modal{position:fixed;inset:0;z-index:80;display:flex;align-items:flex-end;justify-content:flex-start;padding:24px}.ay-assistant-modal.hidden{display:none}.ay-assistant-backdrop{position:absolute;inset:0;background:rgba(2,6,23,.38);backdrop-filter:blur(2px)}.ay-assistant-panel{position:relative;width:min(390px,calc(100vw - 28px));max-height:min(650px,calc(100vh - 48px));display:flex;flex-direction:column;background:#fff;border-radius:24px;overflow:hidden;box-shadow:0 28px 70px rgba(2,6,23,.3);direction:rtl}.ay-assistant-header{display:flex;align-items:center;gap:11px;padding:15px 16px;background:#0f172a;color:#fff}.ay-assistant-avatar{width:38px;height:38px;border-radius:13px;background:#fff;color:#0f172a;display:flex;align-items:center;justify-content:center;flex:0 0 auto}.ay-assistant-avatar svg{width:20px;height:20px}.ay-assistant-header h3{font-size:.92rem;font-weight:900;margin:0}.ay-assistant-header p{font-size:.68rem;color:#cbd5e1;margin:.1rem 0 0}.ay-assistant-close{width:34px;height:34px;border:0;border-radius:11px;background:rgba(255,255,255,.1);color:#fff;display:flex;align-items:center;justify-content:center;cursor:pointer}.ay-assistant-close svg{width:18px}.ay-assistant-messages{padding:16px;display:flex;flex-direction:column;gap:9px;overflow:auto;min-height:220px;max-height:380px;background:#f8fafc}.ay-assistant-message{max-width:86%;padding:10px 12px;border-radius:16px;font-size:.78rem;line-height:1.75;font-weight:650}.ay-assistant-message.is-bot{align-self:flex-end;background:#fff;border:1px solid #e2e8f0;color:#334155;border-bottom-right-radius:5px}.ay-assistant-message.is-user{align-self:flex-start;background:#0f172a;color:#fff;border-bottom-left-radius:5px}.ay-assistant-message a{color:#059669;text-decoration:underline;font-weight:900}.ay-assistant-quick-actions{display:flex;gap:7px;overflow-x:auto;padding:10px 12px;background:#fff;border-top:1px solid #eef2f7}.ay-assistant-quick-actions button{flex:0 0 auto;border:1px solid #e2e8f0;background:#fff;color:#334155;border-radius:999px;padding:7px 10px;font-size:.7rem;font-weight:850;cursor:pointer}.ay-assistant-form{display:flex;align-items:center;gap:8px;padding:11px 12px 13px;background:#fff;border-top:1px solid #eef2f7}.ay-assistant-form input{flex:1;min-width:0;border:1px solid #dbe3ee;border-radius:14px;padding:11px 12px;font-size:16px;outline:none;background:#f8fafc}.ay-assistant-form input:focus{border-color:#94a3b8;background:#fff}.ay-assistant-form button{width:42px;height:42px;border:0;border-radius:13px;background:#0f172a;color:#fff;display:flex;align-items:center;justify-content:center;cursor:pointer}.ay-assistant-form button svg{width:18px;height:18px}@media(max-width:640px){.ay-assistant-fab{left:16px;bottom:16px;width:54px;height:54px;border-radius:18px}.ay-assistant-modal{padding:0;align-items:flex-end}.ay-assistant-panel{width:100%;max-height:82vh;border-radius:24px 24px 0 0}.ay-assistant-messages{min-height:260px;max-height:48vh}}


/* v32: centered store identity + opening promo */
.ay-brand{justify-content:center!important;align-items:center!important;min-width:220px!important;max-width:360px!important}
.ay-brand-copy-centered{align-items:center!important;text-align:center!important;gap:3px!important;width:100%}
.ay-brand-copy-centered strong{max-width:300px!important;text-align:center!important;font-size:13px!important}
.ay-brand-copy-centered small{max-width:300px!important;text-align:center!important;font-size:9px!important}
.ay-brand-logo-below{margin-top:5px!important}
.ay-brand-copy-centered .ay-brand-logo{width:34px!important;height:34px!important}
.ay-brand-copy-centered .ay-brand-mark{font-size:20px!important}
.ay-header-row{min-height:86px!important;height:auto!important;padding:7px 0!important}
.ay-opening-promo-overlay{position:fixed;inset:0;z-index:9999;background:rgba(8,10,13,.72);backdrop-filter:blur(6px);display:flex;align-items:center;justify-content:center;padding:18px}
.ay-opening-promo-card{position:relative;width:min(520px,94vw);max-height:90vh;overflow:auto;background:#fff;border-radius:24px;box-shadow:0 28px 80px rgba(0,0,0,.32);direction:rtl}
.ay-opening-promo-close{position:absolute;top:12px;left:12px;z-index:2;width:38px;height:38px;border:0;border-radius:50%;background:rgba(255,255,255,.94);display:flex;align-items:center;justify-content:center;cursor:pointer;box-shadow:0 3px 12px rgba(0,0,0,.12)}
.ay-opening-promo-close svg{width:18px;height:18px}
.ay-opening-promo-image{display:block;width:100%;max-height:420px;object-fit:cover;background:#f5f5f5}
.ay-opening-promo-content{padding:22px;text-align:center}
.ay-opening-promo-content h2{margin:0 0 8px;font-size:24px;font-weight:1000;color:#111827}
.ay-opening-promo-content p{margin:0 auto 18px;max-width:430px;color:#64748b;font-size:14px;line-height:1.8}
.ay-opening-promo-cta{display:inline-flex;align-items:center;justify-content:center;min-width:180px;padding:12px 22px;border-radius:12px;background:#111418;color:#fff;text-decoration:none;font-weight:900;font-size:14px}
body.ay-modal-open{overflow:hidden}
@media(max-width:820px){.ay-header-row{min-height:94px!important}.ay-brand{max-width:155px!important;min-width:120px!important}.ay-brand-copy-centered strong{font-size:11px!important;max-width:150px!important}.ay-brand-copy-centered small{font-size:7px!important;max-width:150px!important}.ay-brand-copy-centered .ay-brand-logo{width:30px!important;height:30px!important}.ay-opening-promo-card{border-radius:20px}.ay-opening-promo-image{max-height:52vh}.ay-opening-promo-content{padding:18px}.ay-opening-promo-content h2{font-size:20px}}

/* === v33: larger centered storefront logo === */
.ay-brand-copy-centered .ay-brand-logo{width:58px!important;height:58px!important;margin-top:8px!important;border-width:2px!important}
.ay-header-row{min-height:112px!important;padding:10px 0!important}
@media(max-width:820px){.ay-header-row{min-height:104px!important}.ay-brand-copy-centered .ay-brand-logo{width:50px!important;height:50px!important;margin-top:7px!important}}

/* === v34: prominent centered storefront logo === */
.ay-brand-copy-centered .ay-brand-logo{
  width:110px!important;
  height:110px!important;
  margin-top:10px!important;
  border-width:2px!important;
}
.ay-header-row{min-height:166px!important;padding:12px 0!important}
@media(max-width:820px){
  .ay-header-row{min-height:140px!important}
  .ay-brand-copy-centered .ay-brand-logo{
    width:86px!important;
    height:86px!important;
    margin-top:9px!important;
  }
}

/* === v35: force clearly visible header + footer logo === */
.ay-brand-copy-centered .ay-brand-logo{width:96px!important;height:96px!important;min-width:96px!important;min-height:96px!important;max-width:none!important;max-height:none!important;display:block!important;object-fit:cover!important;margin:8px auto 0!important}
.ay-header-row{min-height:148px!important;height:auto!important;padding:10px 0!important}
.ay-footer-brand-icon{width:82px!important;height:82px!important;min-width:82px!important;border-radius:50%;object-fit:cover;border:2px solid rgba(255,255,255,.2);display:block}
@media(max-width:820px){.ay-brand-copy-centered .ay-brand-logo{width:76px!important;height:76px!important;min-width:76px!important;min-height:76px!important}.ay-header-row{min-height:124px!important}.ay-footer-brand-icon{width:68px!important;height:68px!important;min-width:68px!important}}


/* === v36: restore complete compact header + clean footer brand === */
.ay-header{display:block!important;visibility:visible!important;opacity:1!important;position:sticky!important;top:0!important;z-index:40!important}
.ay-header-row{height:82px!important;min-height:82px!important;padding:6px 0!important;grid-template-columns:auto 1fr auto!important}
.ay-brand{display:flex!important;flex-direction:row!important;justify-content:flex-start!important;align-items:center!important;gap:12px!important;min-width:230px!important;max-width:360px!important}
.ay-brand-copy-centered{display:grid!important;grid-template-columns:68px minmax(0,1fr)!important;grid-template-rows:auto auto!important;column-gap:12px!important;align-items:center!important;text-align:right!important;width:100%!important;direction:ltr!important}
.ay-brand-copy-centered strong{grid-column:2!important;grid-row:1!important;align-self:end!important;text-align:right!important;font-size:14px!important;max-width:250px!important;direction:rtl!important}
.ay-brand-copy-centered small{grid-column:2!important;grid-row:2!important;align-self:start!important;text-align:right!important;font-size:9px!important;max-width:250px!important;direction:rtl!important}
.ay-brand-copy-centered .ay-brand-logo{grid-column:1!important;grid-row:1 / span 2!important;width:68px!important;height:68px!important;min-width:68px!important;min-height:68px!important;max-width:68px!important;max-height:68px!important;margin:0!important;border-radius:50%!important;object-fit:cover!important;display:block!important}
.ay-footer-brand-row{display:flex!important;align-items:center!important;gap:14px!important}
.ay-footer-brand-icon{width:82px!important;height:82px!important;min-width:82px!important;min-height:82px!important;max-width:82px!important;max-height:82px!important;margin:0!important;border-radius:50%!important;object-fit:cover!important;display:block!important}
@media(max-width:820px){
 .ay-header-row{height:68px!important;min-height:68px!important;padding:5px 0!important;grid-template-columns:auto 1fr!important}
 .ay-brand{min-width:0!important;max-width:190px!important}
 .ay-brand-copy-centered{grid-template-columns:52px minmax(0,1fr)!important;column-gap:8px!important}
 .ay-brand-copy-centered .ay-brand-logo{width:52px!important;height:52px!important;min-width:52px!important;min-height:52px!important;max-width:52px!important;max-height:52px!important}
 .ay-brand-copy-centered strong{font-size:11px!important;max-width:125px!important}
 .ay-brand-copy-centered small{font-size:7px!important;max-width:125px!important}
 .ay-header-actions{grid-column:2!important;grid-row:1!important}
 .ay-footer-brand-icon{width:68px!important;height:68px!important;min-width:68px!important;min-height:68px!important}
}


/* === v38: header identity — logo on right, centered name/description on left === */
.ay-brand{direction:rtl!important;display:flex!important;flex-direction:row!important;align-items:center!important;justify-content:flex-start!important;gap:14px!important;min-width:300px!important;max-width:430px!important}
.ay-brand>.ay-brand-logo{width:68px!important;height:68px!important;min-width:68px!important;min-height:68px!important;max-width:68px!important;max-height:68px!important;margin:0!important;border-radius:50%!important;object-fit:cover!important;display:block!important;flex:0 0 68px!important}
.ay-brand>.ay-brand-copy-centered{display:flex!important;flex-direction:column!important;align-items:center!important;justify-content:center!important;text-align:center!important;gap:5px!important;direction:rtl!important;min-width:0!important;width:auto!important;flex:1 1 auto!important}
.ay-brand>.ay-brand-copy-centered strong{display:block!important;text-align:center!important;font-size:14px!important;line-height:1.25!important;max-width:280px!important;width:100%!important}
.ay-brand>.ay-brand-copy-centered small{display:block!important;text-align:center!important;font-size:9px!important;line-height:1.5!important;max-width:280px!important;width:100%!important;margin:0!important}
@media(max-width:820px){.ay-brand{min-width:0!important;max-width:235px!important;gap:8px!important}.ay-brand>.ay-brand-logo{width:52px!important;height:52px!important;min-width:52px!important;min-height:52px!important;max-width:52px!important;max-height:52px!important;flex-basis:52px!important}.ay-brand>.ay-brand-copy-centered strong{font-size:11px!important;max-width:165px!important}.ay-brand>.ay-brand-copy-centered small{font-size:7px!important;max-width:165px!important}}

/* === v41: keep primary navigation visible on mobile === */
@media (max-width: 820px){
  .ay-header .ay-header-row{
    height:auto!important;
    min-height:0!important;
    padding:7px 0 0!important;
    display:grid!important;
    grid-template-columns:minmax(0,1fr) auto!important;
    grid-template-rows:auto auto!important;
    column-gap:8px!important;
    row-gap:6px!important;
    align-items:center!important;
  }
  .ay-header .ay-brand{
    grid-column:1!important;
    grid-row:1!important;
    justify-self:start!important;
    max-width:min(235px,72vw)!important;
  }
  .ay-header .ay-header-actions{
    grid-column:2!important;
    grid-row:1!important;
    justify-self:end!important;
  }
  .ay-header .ay-main-nav{
    display:flex!important;
    grid-column:1 / -1!important;
    grid-row:2!important;
    width:100%!important;
    min-width:0!important;
    align-items:center!important;
    justify-content:space-between!important;
    gap:0!important;
    direction:rtl!important;
    overflow-x:auto!important;
    scrollbar-width:none!important;
    -webkit-overflow-scrolling:touch!important;
    border-top:1px solid rgba(255,255,255,.07)!important;
    padding:0 2px!important;
  }
  .ay-header .ay-main-nav::-webkit-scrollbar{display:none!important}
  .ay-header .ay-main-nav a,
  .ay-header .ay-main-nav button{
    display:flex!important;
    align-items:center!important;
    justify-content:center!important;
    flex:1 0 auto!important;
    min-width:max-content!important;
    height:38px!important;
    padding:0 10px!important;
    font-size:10px!important;
    line-height:1!important;
    white-space:nowrap!important;
    font-weight:900!important;
  }
  .ay-header .ay-mobile-search{
    padding:7px 0 9px!important;
  }
}
@media (max-width: 390px){
  .ay-header .ay-main-nav a,
  .ay-header .ay-main-nav button{
    padding:0 7px!important;
    font-size:9px!important;
  }
}
/* v49 product exact color editor */
@media (max-width: 640px){
  .prod-color-row{grid-template-columns:1fr auto!important}
  .prod-color-row .prod-eyedropper-btn{grid-column:1/2}
}