/* LIBSEH unified responsive system — loads after styles.css */
:root {
  --ls-space: clamp(16px, 2.4vw, 32px);
  --ls-container: min(1180px, calc(100% - (var(--ls-space) * 2)));
  --ls-header-h: 72px;
  --ls-bottom-h: 72px;
  --ls-burgundy: #66001f;
  --ls-olive: #3f4a32;
  --ls-paper: #f7f4ee;
  --ls-ink: #3a2a28;
}

html {
  max-width: 100%;
}

body:not(.admin-view):not(.merchant-view) {
  max-width: 100%;
}

body:not(.admin-view):not(.merchant-view) img,
body:not(.admin-view):not(.merchant-view) svg,
body:not(.admin-view):not(.merchant-view) video {
  max-width: 100%;
}

body:not(.admin-view):not(.merchant-view) .container {
  width: var(--ls-container) !important;
  max-width: 1180px !important;
  margin-inline: auto !important;
  padding-inline: 0 !important;
}

/* Header */
body:not(.admin-view):not(.merchant-view) .libseh-header {
  position: sticky !important;
  top: 0 !important;
  z-index: 80 !important;
  background: rgba(247, 244, 238, .96) !important;
  backdrop-filter: blur(12px);
}

body:not(.admin-view):not(.merchant-view) .libseh-header-inner {
  min-height: var(--ls-header-h) !important;
  align-items: center !important;
}

body:not(.admin-view):not(.merchant-view) .libseh-mark img,
body:not(.admin-view):not(.merchant-view) .mobile-menu-brand img,
body:not(.admin-view):not(.merchant-view) .footer-mark img {
  height: clamp(40px, 8vw, 56px) !important;
  width: auto !important;
  max-width: 180px !important;
  object-fit: contain !important;
  mix-blend-mode: multiply;
}

body:not(.admin-view):not(.merchant-view) .round-icon,
body:not(.admin-view):not(.merchant-view) .customer-bottom-nav a {
  min-width: 44px !important;
  min-height: 44px !important;
}

/* Hero */
body:not(.admin-view):not(.merchant-view) .home-hero {
  position: relative !important;
  min-height: min(68svh, 640px) !important;
  height: auto !important;
  overflow: hidden !important;
}

body:not(.admin-view):not(.merchant-view) .home-hero img {
  position: absolute !important;
  inset: 0 !important;
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  object-position: center 28% !important;
}

body:not(.admin-view):not(.merchant-view) .hero-content {
  position: relative !important;
  z-index: 1 !important;
  padding-block: clamp(28px, 8vw, 72px) !important;
}

body:not(.admin-view):not(.merchant-view) .home-hero h1 {
  font-size: clamp(28px, 5.2vw, 56px) !important;
  line-height: 1.2 !important;
  max-width: 16ch !important;
}

body:not(.admin-view):not(.merchant-view) .hero-actions {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 10px !important;
}

/* Section headings */
body:not(.admin-view):not(.merchant-view) .section-heading,
body:not(.admin-view):not(.merchant-view) #featured-stores .home-band-hero {
  display: grid !important;
  justify-items: center !important;
  gap: 8px !important;
  text-align: center !important;
  min-height: 0 !important;
  padding: clamp(20px, 4vw, 40px) var(--ls-space) 8px !important;
  background: transparent !important;
}

body:not(.admin-view):not(.merchant-view) .section-heading h2,
body:not(.admin-view):not(.merchant-view) #featured-stores .home-band-hero h2 {
  margin: 0 !important;
  color: var(--ls-olive) !important;
  font-size: clamp(24px, 4vw, 40px) !important;
  text-shadow: none !important;
}

body:not(.admin-view):not(.merchant-view) .home-band-copy,
body:not(.admin-view):not(.merchant-view) .home-categories .home-band-copy {
  margin: 0 auto !important;
  max-width: 36rem !important;
  color: #6b6a5a !important;
  font-size: clamp(14px, 2.1vw, 17px) !important;
  font-weight: 600 !important;
  line-height: 1.7 !important;
}

/* Categories */
body:not(.admin-view):not(.merchant-view) .main-category-circles {
  display: grid !important;
  grid-auto-flow: column !important;
  grid-auto-columns: minmax(92px, 1fr) !important;
  gap: 14px !important;
  overflow-x: auto !important;
  scroll-snap-type: x mandatory;
  padding: 8px 2px 16px !important;
  scrollbar-width: none;
}

body:not(.admin-view):not(.merchant-view) .main-category-circles::-webkit-scrollbar {
  display: none;
}

body:not(.admin-view):not(.merchant-view) .main-category {
  scroll-snap-align: start;
  min-width: 92px;
}

body:not(.admin-view):not(.merchant-view) .main-category span,
body:not(.admin-view):not(.merchant-view) .main-category img {
  width: clamp(72px, 18vw, 112px) !important;
  height: clamp(72px, 18vw, 112px) !important;
  border-radius: 50% !important;
  object-fit: cover !important;
}

/* Featured stores */
body:not(.admin-view):not(.merchant-view) .store-carousel {
  position: relative !important;
  padding-inline: 44px !important;
}

body:not(.admin-view):not(.merchant-view) .store-carousel-track {
  display: flex !important;
  gap: 16px !important;
  overflow-x: auto !important;
  scroll-snap-type: x mandatory;
  scrollbar-width: none;
}

body:not(.admin-view):not(.merchant-view) .featured-store {
  flex: 0 0 min(42%, 160px) !important;
  scroll-snap-align: start;
  min-width: 120px !important;
}

body:not(.admin-view):not(.merchant-view) .featured-store img {
  width: 88px !important;
  height: 88px !important;
  border-radius: 50% !important;
  object-fit: contain !important;
  background: #f6f1e8 !important;
}

body:not(.admin-view):not(.merchant-view) .carousel-arrow {
  position: absolute !important;
  top: 50% !important;
  transform: translateY(-50%) !important;
  z-index: 2 !important;
  width: 40px !important;
  height: 40px !important;
}

body:not(.admin-view):not(.merchant-view) .carousel-arrow.prev {
  inset-inline-start: 0 !important;
}

body:not(.admin-view):not(.merchant-view) .carousel-arrow.next {
  inset-inline-end: 0 !important;
}

/* Product cards */
body:not(.admin-view):not(.merchant-view) .luxe-product-grid,
body:not(.admin-view):not(.merchant-view) .product-grid {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 12px !important;
}

body:not(.admin-view):not(.merchant-view) .luxe-product-card {
  min-width: 0 !important;
  overflow: hidden !important;
}

body:not(.admin-view):not(.merchant-view) .luxe-product-card img {
  width: 100% !important;
  aspect-ratio: 4 / 5 !important;
  object-fit: cover !important;
}

body:not(.admin-view):not(.merchant-view) .product-title {
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

body:not(.admin-view):not(.merchant-view) .luxe-product-card form .pill {
  min-height: 40px !important;
  width: 100% !important;
}

/* Store / product / account / cart */
body:not(.admin-view):not(.merchant-view) .product-detail,
body:not(.admin-view):not(.merchant-view) .cart-layout,
body:not(.admin-view):not(.merchant-view) .checkout-layout,
body:not(.admin-view):not(.merchant-view) .customer-hub {
  display: grid !important;
  grid-template-columns: 1fr !important;
  gap: 18px !important;
  min-width: 0 !important;
}

body:not(.admin-view):not(.merchant-view) .store-cover,
body:not(.admin-view):not(.merchant-view) .store-hero img,
body:not(.admin-view):not(.merchant-view) .product-gallery img {
  width: 100% !important;
  max-height: min(52svh, 520px) !important;
  object-fit: cover !important;
}

body:not(.admin-view):not(.merchant-view) table {
  display: block;
  width: 100%;
  overflow-x: auto;
}

body:not(.admin-view):not(.merchant-view) input,
body:not(.admin-view):not(.merchant-view) select,
body:not(.admin-view):not(.merchant-view) textarea {
  max-width: 100% !important;
}

body:not(.admin-view):not(.merchant-view) .search-overlay,
body:not(.admin-view):not(.merchant-view) .cart-drawer,
body:not(.admin-view):not(.merchant-view) .lucky-modal,
body:not(.admin-view):not(.merchant-view) .lucky-card {
  max-width: 100vw !important;
  max-height: 100svh !important;
}

body:not(.admin-view):not(.merchant-view) .libseh-footer .footer-grid {
  display: grid !important;
  grid-template-columns: 1fr !important;
  gap: 18px !important;
}

body:not(.admin-view):not(.merchant-view) .footer-bottom {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 8px !important;
  justify-content: space-between !important;
  padding-block: 16px !important;
}

body.auth-view .auth-media {
  display: none !important;
}

body.auth-view .auth-card,
body.auth-view .auth-form {
  width: min(100%, 440px) !important;
  margin-inline: auto !important;
}

body.admin-view .customer-bottom-nav,
body.merchant-view .customer-bottom-nav,
body.auth-view .customer-bottom-nav {
  display: none !important;
}

/* Mobile */
@media (max-width: 639px) {
  :root {
    --ls-header-h: 64px;
  }

  body:not(.admin-view):not(.merchant-view) .libseh-header-inner {
    display: grid !important;
    grid-template-columns: 44px minmax(0, 1fr) auto !important;
  }

  body:not(.admin-view):not(.merchant-view) .customer-main-nav,
  body:not(.admin-view):not(.merchant-view) .language-switcher:not(.mobile-language-switcher) {
    display: none !important;
  }

  body:not(.admin-view):not(.merchant-view) .mobile-menu-toggle {
    display: inline-grid !important;
  }

  body:not(.admin-view):not(.merchant-view) .libseh-mark {
    justify-self: center !important;
  }

  body:not(.admin-view):not(.merchant-view) .header-tools > :not(.bag-trigger):not(.header-login-link):not(.header-dashboard-link):not(.header-logout) {
    display: none !important;
  }

  body:not(.admin-view):not(.merchant-view) .hero-actions {
    flex-direction: column !important;
  }

  body:not(.admin-view):not(.merchant-view) .hero-actions a {
    width: 100% !important;
    justify-content: center !important;
  }

  body:not(.admin-view):not(.merchant-view) .mobile-site-menu {
    position: fixed !important;
    inset: 0 !important;
    width: min(100%, 360px) !important;
    max-width: 88vw !important;
    inset-inline-end: 0 !important;
    inset-inline-start: auto !important;
    display: none !important;
    flex-direction: column !important;
    gap: 14px !important;
    padding: calc(16px + env(safe-area-inset-top)) 16px calc(20px + env(safe-area-inset-bottom)) !important;
    background: var(--ls-paper) !important;
    z-index: 1200 !important;
    overflow: auto !important;
  }

  html[dir="ltr"] body:not(.admin-view):not(.merchant-view) .mobile-site-menu {
    inset-inline-start: 0 !important;
    inset-inline-end: auto !important;
  }

  body:not(.admin-view):not(.merchant-view).mobile-menu-open .mobile-site-menu,
  body:not(.admin-view):not(.merchant-view) .mobile-site-menu.open {
    display: flex !important;
  }

  body:not(.admin-view):not(.merchant-view) .mobile-menu-links {
    display: flex !important;
    flex-direction: column !important;
  }

  body:not(.admin-view):not(.merchant-view) .mobile-menu-links a,
  body:not(.admin-view):not(.merchant-view) .mobile-menu-links button {
    display: flex !important;
    width: 100% !important;
    min-height: 48px !important;
    align-items: center !important;
  }

  body:not(.admin-view):not(.merchant-view) .mobile-dashboard-link {
    justify-content: center !important;
    background: var(--ls-burgundy) !important;
    color: #fffaf3 !important;
    border-radius: 12px !important;
  }

  body:not(.admin-view):not(.merchant-view) .customer-bottom-nav {
    position: fixed !important;
    inset-inline: 0 !important;
    inset-block-end: 0 !important;
    z-index: 70 !important;
    display: grid !important;
    grid-template-columns: repeat(5, minmax(0, 1fr)) !important;
    height: calc(var(--ls-bottom-h) + env(safe-area-inset-bottom)) !important;
    padding-bottom: env(safe-area-inset-bottom) !important;
    background: rgba(255, 250, 244, .97) !important;
  }

  body:not(.admin-view):not(.merchant-view) main {
    padding-bottom: calc(var(--ls-bottom-h) + env(safe-area-inset-bottom) + 16px) !important;
  }

  body:not(.admin-view):not(.merchant-view) .store-carousel {
    padding-inline: 36px !important;
  }

  body.merchant-view .merchant-menu-toggle {
    display: inline-flex !important;
  }
}

/* Tablet */
@media (min-width: 640px) and (max-width: 1023px) {
  body:not(.admin-view):not(.merchant-view) .luxe-product-grid,
  body:not(.admin-view):not(.merchant-view) .product-grid,
  body:not(.admin-view):not(.merchant-view) .store-grid,
  body:not(.admin-view):not(.merchant-view) .directory-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  }

  body:not(.admin-view):not(.merchant-view) .main-category-circles {
    grid-auto-flow: unset !important;
    grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
    overflow: visible !important;
  }

  body:not(.admin-view):not(.merchant-view) .featured-store {
    flex-basis: 22% !important;
  }

  body:not(.admin-view):not(.merchant-view) .libseh-footer .footer-grid {
    grid-template-columns: 1fr 1fr !important;
  }
}

/* Laptop / desktop */
@media (min-width: 1024px) {
  body:not(.admin-view):not(.merchant-view) .mobile-menu-toggle,
  body:not(.admin-view):not(.merchant-view) .mobile-site-menu,
  body:not(.admin-view):not(.merchant-view) .customer-bottom-nav {
    display: none !important;
  }

  body:not(.admin-view):not(.merchant-view) .libseh-header-inner {
    display: grid !important;
    grid-template-columns: auto minmax(0, 1fr) auto !important;
    gap: 16px !important;
  }

  body:not(.admin-view):not(.merchant-view) .customer-main-nav {
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 8px 18px !important;
    justify-content: center !important;
  }

  body:not(.admin-view):not(.merchant-view) .header-tools,
  body:not(.admin-view):not(.merchant-view) .libseh-actions {
    display: flex !important;
    align-items: center !important;
    gap: 8px !important;
  }

  body:not(.admin-view):not(.merchant-view) .header-tools > * {
    display: inline-flex !important;
  }

  body:not(.admin-view):not(.merchant-view) .luxe-product-grid,
  body:not(.admin-view):not(.merchant-view) .product-grid {
    grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  }

  body:not(.admin-view):not(.merchant-view) .product-detail,
  body:not(.admin-view):not(.merchant-view) .cart-layout,
  body:not(.admin-view):not(.merchant-view) .checkout-layout,
  body:not(.admin-view):not(.merchant-view) .customer-hub {
    grid-template-columns: minmax(0, 1.2fr) minmax(280px, .8fr) !important;
  }

  body:not(.admin-view):not(.merchant-view) .libseh-footer .footer-grid {
    grid-template-columns: 1.4fr 1fr 1fr 1fr !important;
  }

  body:not(.admin-view):not(.merchant-view) .main-category-circles {
    grid-auto-flow: unset !important;
    grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
    overflow: visible !important;
  }

  body.auth-view .auth-shell {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) minmax(280px, 44%) !important;
  }

  body.auth-view .auth-media {
    display: block !important;
  }
}

@media (min-width: 1280px) {
  body:not(.admin-view):not(.merchant-view) .luxe-product-grid,
  body:not(.admin-view):not(.merchant-view) .product-grid {
    grid-template-columns: repeat(5, minmax(0, 1fr)) !important;
  }
}

/* Merchant drawer */
.merchant-menu-toggle {
  display: none;
  width: 44px;
  height: 44px;
  place-items: center;
  border: 0;
  background: transparent;
  color: var(--ls-burgundy);
}

.merchant-backdrop {
  display: none;
}

@media (max-width: 1023px) {
  body.merchant-view .merchant-dashboard {
    grid-template-columns: 1fr !important;
  }

  body.merchant-view .merchant-sidebar {
    position: fixed !important;
    inset: 0 auto 0 auto !important;
    inset-inline-end: 0 !important;
    width: min(86vw, 300px) !important;
    height: 100% !important;
    z-index: 80 !important;
    transform: translateX(110%) !important;
    background: #f6f1e8 !important;
    overflow: auto !important;
  }

  html[dir="ltr"] body.merchant-view .merchant-sidebar {
    inset-inline-start: 0 !important;
    inset-inline-end: auto !important;
    transform: translateX(-110%) !important;
  }

  body.merchant-view.merchant-nav-open .merchant-sidebar {
    transform: none !important;
  }

  body.merchant-view.merchant-nav-open .merchant-backdrop {
    display: block !important;
    position: fixed !important;
    inset: 0 !important;
    background: rgba(58, 42, 40, .28) !important;
    z-index: 70 !important;
  }

  body.merchant-view .merchant-menu-toggle {
    display: inline-flex !important;
  }

  body.merchant-view .merchant-kpis,
  body.merchant-view .merchant-profit-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }

  body.merchant-view .merchant-table,
  body.merchant-view .merchant-main {
    max-width: 100% !important;
    overflow-x: auto !important;
  }
}

body.aya-admin .customer-bottom-nav,
body.aya-admin .libseh-header,
body.aya-admin .libseh-footer,
body.merchant-view .libseh-header,
body.merchant-view .libseh-footer,
body.merchant-view .mobile-site-menu,
body.merchant-view .customer-bottom-nav {
  display: none !important;
}

body:not(.admin-view):not(.merchant-view) .phone-open {
  text-align: center;
  display: grid;
  gap: 16px;
  justify-items: center;
  padding-block: 40px;
}

body:not(.admin-view):not(.merchant-view) .phone-url {
  font-size: clamp(16px, 4vw, 22px);
  font-weight: 800;
  word-break: break-all;
}

body:not(.admin-view):not(.merchant-view) .phone-url a {
  color: #66001f;
}

@media (prefers-reduced-motion: reduce) {
  *,
  *::before,
  *::after {
    animation: none !important;
    transition: none !important;
    scroll-behavior: auto !important;
  }
}