/**
 * Premium tenant storefront — dark/light surfaces from Company branding vars.
 * Generic: no slug checks. WEVEX default when wx-storefront-tenant-branded absent.
 */

/* —— Micro-CTAs: tenant accent over platform navy (all branded tenants) —— */
body.wx-storefront-tenant-branded.wx-public {
  --store-action: var(--store-cta, var(--tenant-secondary));
  --store-action-text: var(--store-cta-text, var(--brand-accent-text));
  --store-focus: color-mix(in srgb, var(--tenant-secondary) 65%, var(--tenant-primary));
}

body.wx-storefront-tenant-branded.wx-public .product-card .add-btn,
body.wx-storefront-tenant-branded.wx-public .menu-main .add-btn,
body.wx-storefront-tenant-branded.wx-public .menu-rail .add-btn,
body.wx-storefront-tenant-branded.wx-public .drawer-panel .add-btn,
body.wx-storefront-tenant-branded.wx-public .checkout-panel .add-btn,
body.wx-storefront-tenant-branded.wx-public .checkout-panel [data-submit-order],
body.wx-storefront-tenant-branded.wx-public .coupon-entry button,
body.wx-storefront-tenant-branded.wx-public .cartbar button,
body.wx-storefront-tenant-branded.wx-public .cart-fab-btn,
body.wx-storefront-tenant-branded.wx-public .wx-club-banner__cta {
  background: var(--store-cta, var(--tenant-secondary)) !important;
  color: var(--store-cta-text, var(--brand-accent-text)) !important;
  border-color: color-mix(in srgb, var(--store-cta, var(--tenant-secondary)) 78%, var(--store-line)) !important;
  box-shadow: 0 4px 14px color-mix(in srgb, var(--store-cta, var(--tenant-secondary)) 22%, transparent);
}

body.wx-storefront-tenant-branded.wx-public .product-card .add-btn svg,
body.wx-storefront-tenant-branded.wx-public .menu-main .add-btn svg {
  color: inherit !important;
  stroke: currentColor;
}

body.wx-storefront-tenant-branded.wx-public .checkout-steps span.active,
body.wx-storefront-tenant-branded.wx-public .checkout-section-title > b {
  background: var(--store-cta, var(--tenant-secondary)) !important;
  color: var(--store-cta-text, var(--brand-accent-text)) !important;
}

body.wx-storefront-tenant-branded.wx-public .drawer-quantity button {
  color: var(--store-cta-text, var(--brand-accent-text)) !important;
  border-color: color-mix(in srgb, var(--store-cta, var(--tenant-secondary)) 35%, var(--store-line)) !important;
  background: color-mix(in srgb, var(--store-cta, var(--tenant-secondary)) 10%, var(--store-surface)) !important;
}

body.wx-storefront-tenant-branded.wx-public :where(a, button, input, select, textarea):focus-visible {
  outline-color: color-mix(in srgb, var(--store-cta, var(--tenant-secondary)) 52%, transparent) !important;
}

/* —— Dark premium tenants (e.g. near-black primary + gold accent) —— */
body.wx-storefront-tenant-branded.wx-storefront-theme-dark {
  color: var(--store-ink) !important;
  background: var(--store-bg) !important;
}

body.wx-storefront-tenant-branded.wx-storefront-theme-dark .wx-nav.wx-nav-utility {
  color: var(--store-muted) !important;
  border-bottom-color: color-mix(in srgb, var(--tenant-accent) 18%, var(--store-line)) !important;
  background: color-mix(in srgb, var(--store-bg) 94%, var(--tenant-primary)) !important;
}

body.wx-storefront-tenant-branded.wx-storefront-theme-dark .menu-hero.store-profile {
  margin-bottom: 0 !important;
  padding: 28px 0 20px !important;
  color: var(--store-ink) !important;
  background:
    radial-gradient(
      ellipse 120% 80% at 50% -20%,
      color-mix(in srgb, var(--tenant-accent) 14%, transparent),
      transparent 55%
    ),
    linear-gradient(
      180deg,
      color-mix(in srgb, var(--tenant-primary) 88%, #000) 0%,
      var(--store-bg) 100%
    ) !important;
}

body.wx-storefront-tenant-branded.wx-storefront-theme-dark .menu-hero-logo,
body.wx-storefront-tenant-branded.wx-storefront-theme-dark .menu-hero-logo-fallback {
  width: 88px !important;
  height: 88px !important;
  border: 2px solid color-mix(in srgb, var(--tenant-accent) 55%, var(--store-line)) !important;
  border-radius: 20px !important;
  background: color-mix(in srgb, var(--tenant-primary) 70%, var(--store-surface)) !important;
  box-shadow:
    0 12px 32px rgba(0, 0, 0, 0.35),
    0 0 0 1px color-mix(in srgb, var(--tenant-accent) 12%, transparent);
}

body.wx-storefront-tenant-branded.wx-storefront-theme-dark .menu-hero h1 {
  color: var(--store-ink) !important;
  font-weight: 800 !important;
  letter-spacing: -0.04em !important;
}

body.wx-storefront-tenant-branded.wx-storefront-theme-dark .store-profile-eyebrow {
  color: color-mix(in srgb, var(--tenant-accent) 72%, var(--store-muted)) !important;
}

body.wx-storefront-tenant-branded.wx-storefront-theme-dark .menu-hero-status.is-open {
  color: color-mix(in srgb, var(--tenant-accent) 80%, var(--store-ink)) !important;
  font-weight: 700 !important;
}

body.wx-storefront-tenant-branded.wx-storefront-theme-dark .menu-hero-status.is-open::before {
  background: var(--tenant-accent) !important;
  box-shadow: 0 0 8px color-mix(in srgb, var(--tenant-accent) 45%, transparent);
}

body.wx-storefront-tenant-branded.wx-storefront-theme-dark .club-nav-button {
  color: var(--tenant-accent) !important;
  border-color: color-mix(in srgb, var(--tenant-accent) 32%, var(--store-line)) !important;
  background: color-mix(in srgb, var(--tenant-accent) 8%, var(--store-surface)) !important;
}

/* Clube integrado à marca */
body.wx-storefront-tenant-branded.wx-storefront-theme-dark .wx-club-banner {
  border: 1px solid color-mix(in srgb, var(--tenant-accent) 28%, var(--store-line)) !important;
  background:
    linear-gradient(
      135deg,
      color-mix(in srgb, var(--tenant-primary) 72%, var(--store-surface)),
      color-mix(in srgb, var(--tenant-accent) 8%, var(--store-surface))
    ) !important;
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.22);
}

body.wx-storefront-tenant-branded.wx-storefront-theme-dark .wx-club-banner__cta {
  background: var(--store-cta, var(--tenant-secondary)) !important;
  color: var(--store-cta-text, var(--brand-accent-text)) !important;
  border-color: color-mix(in srgb, var(--store-cta, var(--tenant-secondary)) 80%, var(--store-line)) !important;
}

/* Categorias — chips + sticky mobile */
body.wx-storefront-tenant-branded.wx-storefront-theme-dark .menu-sidebar {
  background: color-mix(in srgb, var(--store-bg) 90%, transparent) !important;
  border-bottom: 1px solid color-mix(in srgb, var(--tenant-accent) 12%, var(--store-line)) !important;
}

body.wx-storefront-tenant-branded.wx-storefront-theme-dark .menu-sidebar a {
  color: var(--store-muted) !important;
  border-color: color-mix(in srgb, var(--tenant-accent) 16%, var(--store-line)) !important;
  background: color-mix(in srgb, var(--store-surface) 92%, var(--tenant-primary)) !important;
}

body.wx-storefront-tenant-branded.wx-storefront-theme-dark .menu-sidebar a[data-cat-link="active"],
body.wx-storefront-tenant-branded.wx-storefront-theme-dark .menu-sidebar a:hover {
  color: var(--brand-accent-text) !important;
  border-color: var(--brand-accent) !important;
  background: var(--brand-accent) !important;
  box-shadow: 0 4px 14px color-mix(in srgb, var(--brand-accent) 22%, transparent);
}

/* Busca */
body.wx-storefront-tenant-branded.wx-storefront-theme-dark .menu-search input {
  color: var(--store-ink) !important;
  border-color: color-mix(in srgb, var(--tenant-accent) 14%, var(--store-line)) !important;
  background: var(--store-surface) !important;
}

/* Cards de produto premium */
body.wx-storefront-tenant-branded.wx-storefront-theme-dark .product-card,
body.wx-storefront-tenant-branded.wx-storefront-theme-dark .menu-product-card {
  border: 1px solid color-mix(in srgb, var(--tenant-accent) 12%, var(--store-line)) !important;
  background: var(--store-surface) !important;
  box-shadow: 0 4px 18px rgba(0, 0, 0, 0.18);
  transition: transform 0.18s ease, box-shadow 0.18s ease, border-color 0.18s ease;
}

body.wx-storefront-tenant-branded.wx-storefront-theme-dark .product-card:hover,
body.wx-storefront-tenant-branded.wx-storefront-theme-dark .menu-product-card:hover {
  transform: translateY(-2px);
  border-color: color-mix(in srgb, var(--tenant-accent) 32%, var(--store-line)) !important;
  box-shadow: 0 10px 28px rgba(0, 0, 0, 0.28);
}

body.wx-storefront-tenant-branded.wx-storefront-theme-dark .product-card .thumb,
body.wx-storefront-tenant-branded.wx-storefront-theme-dark .menu-product-card .thumb {
  border-radius: 14px 14px 0 0;
  overflow: hidden;
}

body.wx-storefront-tenant-branded.wx-storefront-theme-dark .product-card .price-pill,
body.wx-storefront-tenant-branded.wx-storefront-theme-dark .menu-product-card .price-pill {
  color: var(--tenant-accent) !important;
  font-weight: 800 !important;
}

/* Carrinho FAB */
body.wx-storefront-tenant-branded.wx-storefront-theme-dark .cart-fab-btn {
  border-color: color-mix(in srgb, var(--tenant-accent) 40%, var(--store-line)) !important;
  box-shadow:
    0 14px 32px rgba(0, 0, 0, 0.35),
    0 0 0 1px color-mix(in srgb, var(--tenant-accent) 18%, transparent);
}

body.wx-storefront-tenant-branded.wx-storefront-theme-dark .cart-fab-badge {
  background: var(--tenant-primary) !important;
  color: var(--tenant-accent) !important;
  border: 1px solid color-mix(in srgb, var(--tenant-accent) 45%, transparent);
}

/* Light branded tenants — subtle accent without full dark shell */
body.wx-storefront-tenant-branded:not(.wx-storefront-theme-dark) .menu-sidebar a[data-cat-link="active"] {
  border-color: var(--brand-accent) !important;
}
