:root {
  --st7-business-accent: #2457c6;
  --st7-business-accent-contrast: #ffffff;
  --st7-business-brand-name: "Sport 7 Time";
}

body.business-mode-importados {
  --st7-business-accent: #c40d2e;
  --st7-business-accent-contrast: #ffffff;
  --st7-business-brand-name: "Amazing Shoes";
}

body.business-mode-catalogos {
  --st7-business-accent: #8b2be2;
  --st7-business-accent-contrast: #ffffff;
  --st7-business-brand-name: "Catalogos";
}

body.business-mode-all {
  --st7-business-accent: #111827;
  --st7-business-accent-contrast: #ffffff;
  --st7-business-brand-name: "Mostrar todo";
}

body.business-mode-transition {
  overflow-x: hidden;
}

body.business-mode-transition::before {
  content: "";
  position: fixed;
  inset: 0;
  z-index: 7990;
  pointer-events: none;
  background:
    radial-gradient(circle at 50% 42%, rgba(255, 255, 255, 0.74), rgba(248, 250, 252, 0.42) 46%, rgba(248, 250, 252, 0.12) 76%),
    linear-gradient(135deg, rgba(37, 99, 235, 0.045), rgba(196, 13, 46, 0.04));
  backdrop-filter: blur(0);
  -webkit-backdrop-filter: blur(0);
  opacity: 0;
  transition:
    opacity 460ms ease,
    backdrop-filter 760ms ease,
    -webkit-backdrop-filter 760ms ease;
}

body.business-mode-transition-out::before {
  opacity: 0.72;
  backdrop-filter: blur(3px);
  -webkit-backdrop-filter: blur(3px);
}

body.business-mode-transition-in::before {
  opacity: 0;
}

body.business-mode-transition .brand img,
body.business-mode-transition .logo-stage img,
body.business-mode-transition .hero-logo,
body.business-mode-transition .stock-hero img,
body.business-mode-transition .gallery-brand-logo,
body.business-mode-transition [data-business-brand-image],
body.business-mode-transition [data-business-brand-name],
body.business-mode-transition .home-reception-option,
body.business-mode-transition .catalog-card,
body.business-mode-transition .stock-card,
body.business-mode-transition .gallery-card,
body.business-mode-transition .model-card,
body.business-mode-transition .product-card {
  transition:
    opacity 420ms ease,
    transform 620ms cubic-bezier(0.16, 1, 0.3, 1),
    filter 520ms ease;
}

body.business-mode-transition-out .brand img,
body.business-mode-transition-out .logo-stage img,
body.business-mode-transition-out .hero-logo,
body.business-mode-transition-out .stock-hero img,
body.business-mode-transition-out .gallery-brand-logo,
body.business-mode-transition-out [data-business-brand-image],
body.business-mode-transition-out [data-business-brand-name] {
  opacity: 0;
  transform: translateY(4px) scale(0.985);
  filter: blur(2px);
}

body.business-mode-transition-out .home-reception-option,
body.business-mode-transition-out .catalog-card,
body.business-mode-transition-out .stock-card,
body.business-mode-transition-out .gallery-card,
body.business-mode-transition-out .model-card,
body.business-mode-transition-out .product-card {
  opacity: 0.84;
  transform: translateY(3px) scale(0.995);
  filter: blur(0.8px);
}

body.business-mode-transition-in .brand img,
body.business-mode-transition-in .logo-stage img,
body.business-mode-transition-in .hero-logo,
body.business-mode-transition-in .stock-hero img,
body.business-mode-transition-in .gallery-brand-logo,
body.business-mode-transition-in [data-business-brand-image],
body.business-mode-transition-in [data-business-brand-name],
body.business-mode-transition-in .home-reception-option,
body.business-mode-transition-in .catalog-card,
body.business-mode-transition-in .stock-card,
body.business-mode-transition-in .gallery-card,
body.business-mode-transition-in .model-card,
body.business-mode-transition-in .product-card {
  opacity: 1;
  transform: translateY(0) scale(1);
  filter: blur(0);
}

@media (prefers-reduced-motion: reduce) {
  body.business-mode-transition::before,
  body.business-mode-transition .brand img,
  body.business-mode-transition .logo-stage img,
  body.business-mode-transition .hero-logo,
  body.business-mode-transition .stock-hero img,
  body.business-mode-transition .gallery-brand-logo,
  body.business-mode-transition [data-business-brand-image],
  body.business-mode-transition [data-business-brand-name],
  body.business-mode-transition .home-reception-option,
  body.business-mode-transition .catalog-card,
  body.business-mode-transition .stock-card,
  body.business-mode-transition .gallery-card,
  body.business-mode-transition .model-card,
  body.business-mode-transition .product-card {
    transition: none !important;
    transform: none !important;
    filter: none !important;
  }
}

.business-gate,
.business-gate-dialog {
  backdrop-filter: blur(18px);
}

.business-gate {
  position: fixed !important;
  inset: 0 !important;
  z-index: 8000 !important;
}

.business-gate[hidden] {
  display: none !important;
}

.business-gate-dialog[open] {
  position: fixed !important;
  inset: 50% auto auto 50% !important;
  width: min(520px, calc(100vw - 28px)) !important;
  max-height: calc(100dvh - 28px) !important;
  margin: 0 !important;
  transform: translate(-50%, -50%) !important;
  z-index: 8000 !important;
}

.business-gate-dialog::backdrop {
  background: rgba(15, 23, 42, 0.42) !important;
  backdrop-filter: blur(16px) !important;
}

.business-gate-card {
  border: 1px solid rgba(17, 24, 39, 0.12);
  box-shadow: 0 26px 80px rgba(15, 23, 42, 0.18);
}

.business-gate-card h2 {
  letter-spacing: 0;
  color: #0f172a;
}

.business-gate-actions {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 10px;
}

.business-gate-actions button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  min-height: 52px;
  padding: 0 16px;
  border-radius: 999px;
  border: 1px solid rgba(15, 23, 42, 0.12);
  font-weight: 900;
  line-height: 1.12;
  cursor: pointer;
}

.business-gate-actions [data-business-mode="sport_time"],
.business-gate-actions [data-gallery-business-mode="sport_time"] {
  background: #173b8f !important;
  color: #fff !important;
}

.business-gate-actions [data-business-mode="importados"],
.business-gate-actions [data-gallery-business-mode="importados"] {
  background: #c40d2e !important;
  color: #fff !important;
}

.business-gate-actions [data-business-mode="all"],
.business-gate-actions [data-gallery-business-mode="all"] {
  background: linear-gradient(135deg, #111827, #2563eb) !important;
  color: #fff !important;
  border-color: rgba(37, 99, 235, 0.38) !important;
}

.business-gate-actions [data-business-mode="catalogos"],
.business-gate-actions [data-gallery-business-mode="catalogos"] {
  background: linear-gradient(135deg, #7c3aed, #ec4899) !important;
  color: #fff !important;
  border-color: rgba(236, 72, 153, 0.34) !important;
}

.business-gate-actions [data-business-mode="all"]::before,
.business-gate-actions [data-gallery-business-mode="all"]::before {
  content: "";
  width: 16px;
  height: 16px;
  flex: 0 0 16px;
  border: 3px solid currentColor;
  border-radius: 999px;
  box-shadow: 8px 8px 0 -5px currentColor, 14px 8px 0 -5px currentColor;
  transform: rotate(-35deg);
}

.business-brand-preview {
  display: grid;
  grid-template-columns: 72px 1fr;
  align-items: center;
  gap: 12px;
  margin: 12px 0 4px;
  padding: 10px;
  border-radius: 22px;
  background: rgba(248, 250, 252, 0.9);
  border: 1px solid rgba(148, 163, 184, 0.26);
}

.business-brand-preview img {
  width: 72px;
  height: 72px;
  object-fit: contain;
  border-radius: 18px;
  background: transparent;
}

.business-brand-preview img[src*="business-"] {
  object-fit: contain;
  background: transparent;
}

.business-brand-preview strong {
  display: block;
  color: #111827;
  font-size: 1rem;
}

.business-brand-preview span {
  color: #64748b;
  font-size: 0.82rem;
  font-weight: 800;
}

body.business-mode-importados .brand::after,
body.business-mode-all .brand::after,
body.business-mode-catalogos .brand::after,
body.business-mode-importados .catalog-hero .hero-copy::after,
body.business-mode-all .catalog-hero .hero-copy::after,
body.business-mode-catalogos .catalog-hero .hero-copy::after,
body.business-mode-importados .stock-hero .hero-copy::after,
body.business-mode-all .stock-hero .hero-copy::after,
body.business-mode-catalogos .stock-hero .hero-copy::after,
body.business-mode-importados .stock-hero::after,
body.business-mode-all .stock-hero::after,
body.business-mode-catalogos .stock-hero::after,
body.business-mode-importados .gallery-logo-wrap::after,
body.business-mode-all .gallery-logo-wrap::after,
body.business-mode-catalogos .gallery-logo-wrap::after {
  content: none !important;
  display: none !important;
}

body.business-mode-importados .brand img,
body.business-mode-all .brand img,
body.business-mode-catalogos .brand img,
body.business-mode-importados .logo-stage img,
body.business-mode-all .logo-stage img,
body.business-mode-catalogos .logo-stage img,
body.business-mode-importados .hero-logo,
body.business-mode-all .hero-logo,
body.business-mode-catalogos .hero-logo,
body.business-mode-importados .stock-hero img,
body.business-mode-all .stock-hero img,
body.business-mode-catalogos .stock-hero img,
body.business-mode-importados .gallery-brand-logo,
body.business-mode-all .gallery-brand-logo,
body.business-mode-catalogos .gallery-brand-logo {
  display: inline-block !important;
  object-fit: contain !important;
  background: transparent !important;
}

body.business-mode-importados .logo-stage img,
body.business-mode-all .logo-stage img,
body.business-mode-catalogos .logo-stage img {
  width: min(600px, 82vw);
  max-height: 310px;
  padding: 0;
}

body.business-mode-importados .business-line-chip,
body.business-mode-all .business-line-chip,
body.business-mode-catalogos .business-line-chip {
  background: #fff1f2;
  color: #9f1239;
  border-color: #fecdd3;
}

@media (max-width: 720px) {
  .business-gate-actions {
    grid-template-columns: 1fr;
  }

  .business-brand-preview {
    grid-template-columns: 54px 1fr;
  }

  .business-brand-preview img {
    width: 54px;
    height: 54px;
  }
}

.business-session-timer {
  position: fixed;
  right: max(14px, env(safe-area-inset-right));
  bottom: max(14px, calc(env(safe-area-inset-bottom) + 10px));
  z-index: 8200;
  display: inline-flex;
  align-items: center;
  gap: 7px;
  min-height: 34px;
  max-width: min(220px, calc(100vw - 28px));
  padding: 7px 11px;
  border: 1px solid rgba(203, 213, 225, 0.86);
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.9);
  color: #111827;
  box-shadow: 0 16px 36px rgba(15, 23, 42, 0.13);
  backdrop-filter: blur(18px);
  -webkit-backdrop-filter: blur(18px);
  font-size: 11px;
  font-weight: 800;
  letter-spacing: 0;
  pointer-events: none;
}

.business-session-timer[hidden] {
  display: none !important;
}

.business-session-dot {
  width: 8px;
  height: 8px;
  flex: 0 0 8px;
  border-radius: 999px;
  background: #16a34a;
  box-shadow: 0 0 0 4px rgba(22, 163, 74, 0.13);
}

.business-session-copy {
  max-width: 92px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  color: #475569;
}

.business-session-timer strong {
  color: #0f172a;
  font-size: 12px;
  font-variant-numeric: tabular-nums;
}

@media (max-width: 640px) {
  .business-session-timer {
    right: max(10px, env(safe-area-inset-right));
    bottom: max(10px, calc(env(safe-area-inset-bottom) + 8px));
    min-height: 30px;
    padding: 6px 9px;
    font-size: 10px;
  }

  .business-session-copy {
    max-width: 76px;
  }

  .business-session-timer strong {
    font-size: 11px;
  }

  body:has(.tabbar) .business-session-timer,
  body:has(.bottom-nav) .business-session-timer {
    bottom: max(82px, calc(env(safe-area-inset-bottom) + 78px));
  }
}