@import url("https://fonts.googleapis.com/css2?family=Plus+Jakarta+Sans:wght@400;500;600;700;800&display=swap");

:root {
  --brand-blue: #002b73;
  --brand-green: #00bfa6;
  --brand-orange: #f57c00;
  --brand-white: #ffffff;
  --text-main: #0b1630;
  --text-soft: #51607e;
  --surface: #f4f8ff;
  --surface-alt: #eef6ff;
  --border: #d4e3ff;
  --shadow-soft: 0 10px 30px rgba(0, 24, 69, 0.08);
  --shadow-strong: 0 16px 36px rgba(0, 24, 69, 0.14);
  /*
    Client accent palette:
    Revert quickly to the previous palette by replacing these values with the green family
    or by mapping --client-accent back to var(--brand-green).
  */
  --client-accent: var(--brand-orange);
  --client-accent-strong: #e67600;
  --client-accent-soft: #fff1dc;
  --client-accent-border: #ffd29b;
  --client-accent-glow: rgba(255, 138, 0, 0.18);
  --client-accent-ink: #7a4300;
}

img[data-public-image-loader] {
  background-color: #e8f2ff;
  background-image:
    radial-gradient(circle at center, rgba(0, 43, 115, 0.18) 0 16%, transparent 17%),
    linear-gradient(105deg, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0.82) 46%, rgba(255, 255, 255, 0) 72%),
    linear-gradient(135deg, #e8f2ff 0%, #f7fbff 52%, #d8f8f2 100%);
  background-position: center, -160% 0, center;
  background-repeat: no-repeat;
  background-size: 34px 34px, 55% 100%, cover;
  transition: filter 0.18s ease, opacity 0.18s ease, background-color 0.18s ease;
}

img[data-public-image-loader].is-image-loading {
  animation: public-image-loader-shimmer 1.15s ease-in-out infinite;
  filter: saturate(0.92);
}

img[data-public-image-loader].is-image-loaded {
  animation: none;
  background-image: none;
  background-color: transparent;
  filter: none;
}

img[data-public-image-loader].is-image-error {
  animation: none;
  background-image:
    radial-gradient(circle at center, rgba(0, 43, 115, 0.14) 0 18%, transparent 19%),
    linear-gradient(135deg, #edf4ff 0%, #f8fbff 100%);
  background-position: center, center;
  background-size: 34px 34px, cover;
}

@keyframes public-image-loader-shimmer {
  0% {
    background-position: center, -160% 0, center;
  }

  100% {
    background-position: center, 220% 0, center;
  }
}

@media (prefers-reduced-motion: reduce) {
  .home-featured-spotlight-track,
  .home-featured-spotlight-card,
  .home-featured-spotlight-indicators button {
    transition: none !important;
  }

  img[data-public-image-loader].is-image-loading {
    animation: none;
  }
}

/* Vista privada del negocio con la presentación real del cliente. */
body.is-business-preview {
  --preview-surface: #f4f8ff;
  --preview-surface: color-mix(in srgb, var(--surface, #ffffff) 94%, #0b63ce 6%);
  --preview-border: #9ab6d8;
  --preview-border: color-mix(in srgb, var(--border, #d7e0ec) 72%, #0b63ce 28%);
  --preview-text: var(--text-main, #17233a);
  --preview-soft: var(--text-soft, #5f6f86);
}

body.is-business-preview .topbar {
  position: relative;
  z-index: 32;
}

.business-preview-topbar-actions {
  margin-left: auto;
}

.business-preview-exit {
  min-height: 44px;
  display: inline-flex;
  align-items: center;
  gap: 0.45rem;
  white-space: nowrap;
}

.business-preview-context {
  position: sticky;
  top: 0.55rem;
  z-index: 30;
  display: grid;
  gap: 0.65rem;
  margin: 0.75rem 0 1rem;
  padding: 0.8rem;
  color: var(--preview-text);
  border: 1px solid var(--preview-border);
  border-radius: 16px;
  background: var(--preview-surface);
  background: color-mix(in srgb, var(--preview-surface) 94%, transparent);
  box-shadow: 0 12px 30px rgba(9, 31, 65, 0.14);
  backdrop-filter: blur(16px);
}

.business-preview-context-main {
  display: flex;
  align-items: center;
  gap: 0.7rem;
  min-width: 0;
}

.business-preview-context-main > div {
  display: grid;
  gap: 0.12rem;
  min-width: 0;
}

.business-preview-context-main strong,
.business-preview-context-main span,
.business-preview-notice strong,
.business-preview-notice span {
  overflow-wrap: anywhere;
}

.business-preview-context-main span,
.business-preview-notice span {
  color: var(--preview-soft);
  font-size: 0.84rem;
}

.business-preview-context-icon {
  display: grid;
  place-items: center;
  flex: 0 0 42px;
  width: 42px;
  height: 42px;
  border-radius: 13px;
  color: #ffffff;
  background: linear-gradient(135deg, #075aa8, #008c9f);
}

.business-preview-notices {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 230px), 1fr));
  gap: 0.5rem;
}

.business-preview-notice {
  display: grid;
  gap: 0.15rem;
  padding: 0.65rem 0.75rem;
  border: 1px solid #dba53a;
  border-radius: 12px;
  background: #fff8e7;
  background: color-mix(in srgb, #f5b82e 13%, var(--surface, #ffffff));
}

.business-preview-notice.is-danger {
  border-color: #d95d68;
  background: #fff0f2;
  background: color-mix(in srgb, #d43d4f 12%, var(--surface, #ffffff));
}

body.is-business-preview [aria-disabled="true"],
body.is-business-preview .is-preview-disabled {
  cursor: not-allowed;
}

body.is-business-preview [data-business-preview-disabled] {
  opacity: 0.72;
}

body.is-business-preview [data-business-preview-disabled]:focus-visible,
.business-preview-exit:focus-visible {
  outline: 3px solid color-mix(in srgb, #0b63ce 72%, white);
  outline-offset: 3px;
}

.business-preview-disabled-control {
  min-height: 44px;
}

.business-preview-feedback {
  position: fixed;
  z-index: 10000;
  left: 50%;
  bottom: max(1rem, env(safe-area-inset-bottom));
  transform: translateX(-50%);
  width: min(calc(100% - 2rem), 460px);
  padding: 0.8rem 1rem;
  border-radius: 14px;
  color: #ffffff;
  background: #14233a;
  box-shadow: 0 14px 38px rgba(0, 0, 0, 0.28);
  text-align: center;
  font-weight: 700;
}

body.theme-dark.is-business-preview {
  --preview-surface: #16243a;
  --preview-border: #3d6087;
  --preview-text: #f4f8ff;
  --preview-soft: #c6d5e8;
}

body.theme-dark.is-business-preview .business-preview-context {
  background: rgba(20, 35, 56, 0.96);
  box-shadow: 0 14px 34px rgba(0, 0, 0, 0.42);
}

@media (max-width: 620px) {
  body.is-business-preview .topbar {
    align-items: center;
  }

  body.is-business-preview .topbar-subline {
    display: none;
  }

  .business-preview-exit span:last-child {
    font-size: 0.78rem;
  }

  .business-preview-context {
    top: max(0.35rem, env(safe-area-inset-top));
    border-radius: 14px;
  }

  .business-preview-context-main {
    align-items: flex-start;
  }
}

.business-profile-section {
  margin-top: 1rem;
}

.business-profile-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 1rem;
}

.business-profile-card {
  display: flex;
  flex-direction: column;
  gap: 0.85rem;
}

.business-profile-contact-card:not(.business-profile-contact-card-featured) {
  display: none;
}

.business-profile-contact-card-featured {
  border-color: rgba(0, 191, 166, 0.28);
  background:
    radial-gradient(circle at 90% 10%, rgba(0, 191, 166, 0.16), transparent 34%),
    rgba(255, 255, 255, 0.96);
  box-shadow: 0 20px 42px rgba(0, 43, 115, 0.1);
}

.business-profile-contact-card-featured h2 {
  margin: 0;
  color: var(--brand-blue);
  font-size: clamp(1.35rem, 2vw, 1.8rem);
  font-weight: 900;
}

.business-profile-contact-intro {
  margin: 0;
  color: var(--color-text-muted, #5f6f91);
}

.business-profile-contact-form.chat-composer {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: end;
  gap: 0.7rem;
  margin-top: 0.25rem;
  padding: 0.7rem;
  border: 1px solid rgba(0, 43, 115, 0.1);
  border-radius: 24px;
  background: rgba(245, 248, 255, 0.86);
}

.business-profile-contact-form .visually-hidden {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  padding: 0 !important;
  margin: -1px !important;
  overflow: hidden !important;
  clip: rect(0, 0, 0, 0) !important;
  white-space: nowrap !important;
  border: 0 !important;
}

.business-profile-contact-form .form-control {
  grid-column: 1;
  min-height: 52px;
  max-height: 120px;
  width: 100%;
  resize: vertical;
  border-radius: 20px;
  border: 1px solid rgba(0, 43, 115, 0.16);
  background: #fff;
  color: var(--brand-blue);
  padding: 0.85rem 1rem;
  font: inherit;
  line-height: 1.35;
  box-shadow: none;
}

.business-profile-contact-form .chat-send-button {
  grid-column: 2;
  width: 52px;
  height: 52px;
  min-width: 52px;
  display: grid;
  place-items: center;
  padding: 0;
  border-radius: 18px;
  color: #fff;
  background: linear-gradient(135deg, var(--brand-blue), #005fbd);
  box-shadow: 0 14px 28px rgba(0, 43, 115, 0.18);
}

.business-profile-contact-form .chat-send-button svg {
  width: 20px;
  height: 20px;
  fill: currentColor;
}

.business-profile-login-cta {
  justify-self: start;
  margin-top: 0.35rem;
}

.business-profile-actions {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0.7rem;
}

.business-profile-action {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  align-items: center;
  gap: 0.7rem;
  padding: 0.78rem;
  border: 1px solid rgba(0, 43, 115, 0.1);
  border-radius: 20px;
  background: linear-gradient(135deg, rgba(255, 255, 255, 0.96), rgba(244, 248, 255, 0.92));
  color: var(--brand-blue);
  text-decoration: none;
  box-shadow: 0 14px 28px rgba(0, 24, 69, 0.07);
  transition: transform 0.18s ease, border-color 0.18s ease, box-shadow 0.18s ease;
}

.business-profile-action:hover {
  transform: translateY(-2px);
  border-color: rgba(0, 191, 166, 0.32);
  color: var(--brand-blue);
  box-shadow: 0 18px 34px rgba(0, 24, 69, 0.12);
}

.business-profile-action-icon {
  width: 46px;
  height: 46px;
  border-radius: 16px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: rgba(0, 43, 115, 0.08);
  color: var(--brand-blue);
  font-size: 1.18rem;
}

.business-profile-action-icon svg {
  width: 22px;
  height: 22px;
  fill: currentColor;
}

.business-profile-social-icon {
  font-size: 1rem;
  line-height: 1;
  text-transform: uppercase;
  font-weight: 950;
}

.business-profile-action.is-whatsapp .business-profile-action-icon {
  background: rgba(0, 191, 166, 0.14);
  color: #008a77;
}

.business-profile-action strong,
.business-profile-action small {
  display: block;
  min-width: 0;
}

.business-profile-action strong {
  font-size: 0.95rem;
  font-weight: 900;
}

.business-profile-action small {
  margin-top: 0.08rem;
  color: var(--color-text-muted, #5f6f91);
  font-size: 0.78rem;
  font-weight: 700;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.business-profile-gallery-section {
  position: relative;
}

.business-profile-gallery-controls {
  display: inline-flex;
  align-items: center;
  gap: 0.45rem;
}

.business-profile-gallery-arrow,
.business-profile-gallery-lightbox-close,
.business-profile-gallery-lightbox-nav {
  border: 1px solid rgba(0, 43, 115, 0.12);
  background: rgba(255, 255, 255, 0.92);
  color: var(--brand-blue);
  box-shadow: 0 12px 24px rgba(0, 30, 89, 0.1);
  cursor: pointer;
}

.business-profile-gallery-arrow {
  width: 34px;
  height: 34px;
  border-radius: 999px;
  font-weight: 900;
}

.business-profile-gallery-track {
  display: grid;
  grid-auto-flow: column;
  grid-auto-columns: minmax(220px, 72%);
  gap: 0.85rem;
  overflow-x: auto;
  overscroll-behavior-x: contain;
  scroll-snap-type: x mandatory;
  padding: 0.25rem 0.1rem 0.7rem;
  scrollbar-width: thin;
}

.business-profile-gallery-card {
  position: relative;
  display: block;
  width: 100%;
  aspect-ratio: 16 / 10;
  padding: 0;
  border: 1px solid rgba(0, 43, 115, 0.12);
  border-radius: 22px;
  overflow: hidden;
  background: #edf4ff;
  box-shadow: 0 18px 34px rgba(0, 30, 89, 0.1);
  scroll-snap-align: start;
  cursor: pointer;
}

.business-profile-gallery-card img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

.business-profile-gallery-card span {
  position: absolute;
  inset: auto 0 0;
  padding: 0.72rem 0.85rem;
  color: #fff;
  font-size: 0.88rem;
  font-weight: 800;
  text-align: left;
  background: linear-gradient(180deg, rgba(0, 20, 63, 0), rgba(0, 20, 63, 0.86));
}

.business-profile-gallery-lightbox[hidden] {
  display: none;
}

body.business-gallery-open {
  overflow: hidden;
}

.business-profile-gallery-lightbox {
  position: fixed;
  inset: 0;
  z-index: 1090;
  display: grid;
  place-items: center;
  width: 100vw;
  min-height: 100vh;
  padding: 1rem;
}

.business-profile-gallery-lightbox-backdrop {
  position: absolute;
  inset: 0;
  background: rgba(0, 12, 36, 0.72);
  backdrop-filter: blur(8px);
}

.business-profile-gallery-lightbox-dialog {
  position: relative;
  z-index: 1;
  width: min(920px, calc(100vw - 2rem));
  max-width: 100%;
  display: grid;
  gap: 0.75rem;
  padding: 0.75rem;
  border-radius: 26px;
  background: rgba(255, 255, 255, 0.96);
  box-shadow: 0 28px 70px rgba(0, 12, 36, 0.36);
}

.business-profile-gallery-lightbox-dialog img {
  width: 100%;
  max-height: 72vh;
  object-fit: contain;
  border-radius: 20px;
  background: #071b3f;
}

.business-profile-gallery-lightbox-dialog p {
  margin: 0;
  padding: 0 0.35rem 0.2rem;
  color: var(--brand-blue);
  font-weight: 800;
}

.business-profile-gallery-lightbox-close {
  position: absolute;
  top: 0.5rem;
  right: 0.5rem;
  width: 38px;
  height: 38px;
  border-radius: 999px;
  font-size: 1.35rem;
  font-weight: 900;
}

.business-profile-gallery-lightbox-nav {
  position: absolute;
  top: 50%;
  width: 38px;
  height: 38px;
  border-radius: 999px;
  transform: translateY(-50%);
  font-weight: 900;
}

.business-profile-gallery-lightbox-nav.is-prev {
  left: 0.55rem;
}

.business-profile-gallery-lightbox-nav.is-next {
  right: 0.55rem;
}

.business-profile-facts,
.business-profile-hours {
  display: grid;
  gap: 0.7rem;
  margin: 0;
}

.business-profile-facts div,
.business-profile-hours div {
  display: flex;
  justify-content: space-between;
  gap: 1rem;
  border-bottom: 1px solid rgba(0, 43, 115, 0.08);
  padding-bottom: 0.65rem;
}

.business-profile-facts dt,
.business-profile-hours strong {
  color: var(--color-primary, #003b85);
  font-weight: 800;
}

.business-profile-facts dd,
.business-profile-hours span {
  margin: 0;
  color: var(--color-text-muted, #5f6f91);
  text-align: right;
}

.customer-conversation-page,
.customer-chat-page {
  max-width: 900px;
  margin-inline: auto;
}

.customer-conversation-list {
  display: grid;
  gap: 0.85rem;
}

.customer-conversation-item {
  display: grid;
  grid-template-columns: auto 1fr auto;
  align-items: center;
  gap: 0.85rem;
  text-decoration: none;
}

.customer-conversation-avatar {
  width: 54px;
  height: 54px;
  border-radius: 18px;
  display: grid;
  place-items: center;
  overflow: hidden;
  background: rgba(0, 194, 184, 0.12);
  color: #003b85;
  font-weight: 900;
}

.customer-conversation-avatar img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.customer-conversation-copy {
  display: grid;
  gap: 0.2rem;
}

.customer-conversation-copy small {
  color: var(--color-text-muted, #5f6f91);
}

.customer-conversation-badge {
  min-width: 30px;
  height: 30px;
  border-radius: 999px;
  display: grid;
  place-items: center;
  background: #ff8a00;
  color: #fff;
  font-weight: 900;
}

.customer-chat-header {
  display: flex;
  align-items: center;
  gap: 1rem;
}

.customer-chat-thread,
.local-chat-thread {
  min-height: 360px;
  max-height: 58vh;
  overflow: auto;
  display: flex;
  flex-direction: column;
  gap: 0.7rem;
}

.chat-message {
  max-width: min(78%, 560px);
  border-radius: 22px;
  padding: 0.75rem 0.9rem;
}

.chat-message p {
  margin: 0;
  white-space: pre-wrap;
}

.chat-message small {
  display: block;
  margin-top: 0.35rem;
  opacity: 0.68;
  font-size: 0.78rem;
}

.chat-message.is-mine {
  align-self: flex-end;
  background: linear-gradient(135deg, #0059b8, #00bfae);
  color: #fff;
}

.chat-message.is-theirs {
  align-self: flex-start;
  background: #fff;
  border: 1px solid rgba(0, 43, 115, 0.1);
  color: #002b73;
}

.customer-chat-form,
.customer-chat-tool-actions {
  display: grid;
  gap: 0.75rem;
}

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

  .business-profile-actions {
    grid-template-columns: 1fr;
  }

  .business-profile-facts div,
  .business-profile-hours div {
    align-items: flex-start;
    flex-direction: column;
    gap: 0.25rem;
  }

  .business-profile-facts dd,
  .business-profile-hours span {
    text-align: left;
  }
}

* {
  box-sizing: border-box;
}

html,
body {
  margin: 0;
  padding: 0;
}

body {
  font-family: "Plus Jakarta Sans", "Segoe UI", Tahoma, sans-serif;
  color: var(--text-main);
  overflow-x: hidden;
  background:
    radial-gradient(circle at 18% 10%, rgba(255, 138, 0, 0.08) 0%, transparent 24%),
    radial-gradient(circle at 0% -10%, rgba(0, 191, 166, 0.12) 0%, transparent 38%),
    radial-gradient(circle at 100% 0%, rgba(0, 43, 115, 0.14) 0%, transparent 40%),
    linear-gradient(180deg, #f3f8ff 0%, #f8fbff 55%, #ffffff 100%);
}

body.theme-dark {
  --text-main: #dce9ff;
  --text-soft: #9fb6db;
  --surface: #0d1a35;
  --surface-alt: #13244a;
  --border: #294575;
  --shadow-soft: 0 10px 24px rgba(1, 5, 17, 0.34);
  --shadow-strong: 0 18px 38px rgba(1, 5, 17, 0.5);
  --client-accent-soft: rgba(255, 138, 0, 0.16);
  --client-accent-border: rgba(255, 170, 77, 0.34);
  --client-accent-glow: rgba(255, 138, 0, 0.24);
  --client-accent-ink: #ffd6a3;
  background:
    radial-gradient(circle at 18% 10%, rgba(255, 138, 0, 0.12) 0%, transparent 26%),
    radial-gradient(circle at 0% -10%, rgba(0, 191, 166, 0.16) 0%, transparent 42%),
    radial-gradient(circle at 100% 0%, rgba(0, 43, 115, 0.42) 0%, transparent 40%),
    linear-gradient(180deg, #08112a 0%, #0a1531 55%, #0b1735 100%);
}

body.theme-dark .topbar {
  border-color: rgba(120, 154, 217, 0.22);
  background: rgba(9, 20, 45, 0.9);
}

body.theme-dark.has-client-bottom-nav.client-header-compact .topbar {
  background: rgba(9, 20, 45, 0.95);
  box-shadow: 0 16px 34px rgba(1, 5, 17, 0.46);
}

body.theme-dark .brand-link,
body.theme-dark h1,
body.theme-dark h2,
body.theme-dark h3 {
  color: #dce9ff;
}

body.theme-dark .topbar-subtitle,
body.theme-dark .card p,
body.theme-dark .lead,
body.theme-dark .section-meta,
body.theme-dark .search-field label,
body.theme-dark .search-check,
body.theme-dark .filter-collapse-summary small,
body.theme-dark .stat-pill span {
  color: #9fb6db;
}

body.theme-dark .brand-tag {
  background: var(--client-accent-soft);
  border: 1px solid var(--client-accent-border);
  color: var(--client-accent-ink);
}

body.theme-dark .hero-panel .brand-tag {
  background: rgba(255, 255, 255, 0.18);
  border-color: rgba(255, 255, 255, 0.24);
  color: #ffffff;
}

body.theme-dark .filter-collapse-summary,
body.theme-dark .filter-summary-title {
  color: #dce9ff;
}

body.theme-dark .card strong {
  color: #eaf3ff;
}

body.theme-dark .location-tip-trigger {
  border-color: #385d96;
  background: #10264f;
  color: #b8d0f2;
}

body.theme-dark .location-tip-trigger:hover {
  background: #16325f;
}

body.theme-dark .location-tip-popover {
  background: #102347;
  border-color: #385d96;
  box-shadow: 0 14px 28px rgba(0, 0, 0, 0.35);
}

body.theme-dark .location-tip-popover strong {
  color: #d9e8ff;
}

body.theme-dark .location-tip-popover span {
  color: #a7c0e6;
}

body.theme-dark .location-tip-popover a {
  color: #9bc3ff;
}

body.theme-dark .card,
body.theme-dark .kpi {
  background: #0f2044;
  border-color: #2c4978;
}

body.theme-dark .input,
body.theme-dark select.input,
body.theme-dark textarea.input {
  background: #0c1b39;
  border-color: #35558b;
  color: #e5efff;
}

body.theme-dark .input:focus,
body.theme-dark select.input:focus,
body.theme-dark textarea.input:focus {
  border-color: #7aa4e6;
  box-shadow: 0 0 0 4px rgba(122, 164, 230, 0.2);
}

body.theme-dark .btn-outline {
  background: #11264f;
  color: #dce9ff;
  border-color: #40649b;
}

body.theme-dark .user-menu-dropdown {
  background: #102347;
  border-color: #385d96;
  box-shadow: 0 14px 28px rgba(0, 0, 0, 0.35);
}

body.theme-dark .user-menu-item {
  color: #d9e8ff;
}

body.theme-dark .user-menu-item:hover {
  background: #153164;
}

body.theme-dark .user-menu-item-danger {
  color: #ffc8c8;
}

body.theme-dark .user-menu-head {
  border-color: #365b94;
}

body.theme-dark .user-menu-name {
  color: #d9e8ff;
}

body.theme-dark .user-menu-email {
  color: #9eb8df;
}

body.theme-dark .customer-notification-dropdown {
  border-color: #35588d;
  background: #0f2044;
  box-shadow: 0 18px 36px rgba(0, 0, 0, 0.36);
}

body.theme-dark .customer-notification-head {
  border-color: #284c80;
}

body.theme-dark .customer-notification-head strong {
  color: #d8e9ff;
}

body.theme-dark .customer-notification-head button {
  color: #74f0df;
}

body.theme-dark .customer-notification-empty,
body.theme-dark .customer-notification-item small {
  color: #9fb8dc;
}

body.theme-dark .customer-notification-item {
  border-color: #31568d;
  background: linear-gradient(135deg, #122a56, #0d384d);
  color: #d8e9ff;
}

body.theme-dark .customer-notification-item strong {
  color: #ffffff;
}

body.theme-dark .alert-warning {
  background: #3b2f14;
  color: #f2dd9c;
  border-color: #75612e;
}

body.theme-dark .alert-link {
  color: #a8ccff;
}

body.theme-dark .alert-link:hover {
  color: #d0e4ff;
}

body.theme-dark .chip {
  color: #d2e3ff;
  background: #122a56;
  border-color: #345a93;
}

body.theme-dark .chip small {
  color: #9fb6db;
}

body.theme-dark .chip-active {
  background: var(--brand-blue);
  border-color: #4a78c1;
}

body.theme-dark .vertical-discovery-copy {
  color: #9fb8dd;
}

body.theme-dark .vertical-discovery-link {
  color: #b9d9ff;
}

body.theme-dark .vertical-discovery-state {
  color: #9fb8dd;
}

body.theme-dark .vertical-discovery-state-label {
  border-color: #32578e;
  background: rgba(16, 35, 68, 0.86);
  color: #aecaef;
}

body.theme-dark .vertical-discovery-state strong {
  color: #d7ecff;
}

body.theme-dark .vertical-tile-label {
  color: #d7e8ff;
}

body.theme-dark .vertical-tile-media {
  border-color: #34598f;
  background: linear-gradient(160deg, rgba(17, 38, 76, 0.96) 0%, rgba(14, 31, 63, 0.96) 100%);
  box-shadow: 0 14px 28px rgba(1, 5, 17, 0.34);
}

body.theme-dark .vertical-tile-active .vertical-tile-media {
  border-color: #46bea9;
  background: linear-gradient(160deg, rgba(12, 53, 64, 0.98) 0%, rgba(13, 58, 67, 0.98) 100%);
}

body.theme-dark .vertical-tile-icon {
  color: #80f0dd;
  background:
    radial-gradient(circle at 28% 22%, rgba(255, 255, 255, 0.14) 0 14%, transparent 15%),
    linear-gradient(145deg, rgba(10, 42, 66, 0.98) 0%, rgba(10, 66, 78, 0.94) 100%);
}

body.theme-dark .vertical-tile-media-all {
  border-color: #365c95;
  background: linear-gradient(135deg, rgba(0, 43, 115, 0.98) 0%, rgba(0, 135, 154, 0.95) 100%);
}

body.theme-dark .filter-selected-vertical {
  color: #9df1e3;
  border-color: #3f9587;
  background: #103e47;
}

body.theme-dark .vertical-directory-location {
  color: #b8cff0;
}

body.theme-dark .vertical-directory-card {
  background: linear-gradient(170deg, rgba(15, 34, 68, 0.96) 0%, rgba(18, 41, 82, 0.96) 100%);
  border-color: #355a93;
}

body.theme-dark .vertical-directory-card-media {
  border-color: #355a93;
  background: linear-gradient(160deg, rgba(17, 38, 76, 0.96) 0%, rgba(14, 31, 63, 0.96) 100%);
}

body.theme-dark .vertical-directory-card-icon {
  color: #83f1df;
  background:
    radial-gradient(circle at 25% 20%, rgba(255, 255, 255, 0.14) 0 13%, transparent 14%),
    linear-gradient(145deg, rgba(10, 42, 66, 0.98) 0%, rgba(10, 66, 78, 0.94) 100%);
}

body.theme-dark .vertical-directory-card-body strong {
  color: #d8e9ff;
}

body.theme-dark .vertical-directory-card-body span {
  color: #9fb8dd;
}

body.theme-dark .vertical-directory-card-meta {
  background: rgba(9, 20, 45, 0.92);
  border-color: #3a5f98;
  color: #9df1e3;
}

body.theme-dark .section-meta {
  background: var(--client-accent-soft);
  border-color: var(--client-accent-border);
  color: var(--client-accent-ink);
}

body.theme-dark .badge {
  color: var(--client-accent-ink);
  background: var(--client-accent-soft);
  border-color: var(--client-accent-border);
}

body.theme-dark .pill {
  color: #cbe0ff;
  background: #1a3566;
  border-color: #3f679f;
}

body.theme-dark .filter-indicator {
  color: #b7ceef;
  border-color: #3a5f98;
  background: #11264f;
}

body.theme-dark .filter-indicator::before {
  background: #6f90bf;
}

body.theme-dark .filter-indicator-active {
  color: #bff5ea;
  border-color: #3f8d80;
  background: #113f47;
}

body.theme-dark .filter-indicator-active::before {
  background: var(--brand-green);
}

body.theme-dark .promo-banner {
  border-color: #355b92;
}

body.theme-dark .business-logo,
body.theme-dark .business-logo-lg,
body.theme-dark .business-cover,
body.theme-dark .product-image {
  border-color: #2f527f;
}

body.theme-dark .category-tab {
  color: #d3e3ff;
  background: #122a56;
  border-color: #355c95;
}

body.theme-dark .qty-btn {
  border-color: #3d6197;
  background: #11254d;
  color: #d9e8ff;
}

body.theme-dark .qty-btn:hover {
  background: #173261;
}

.container {
  width: min(1080px, 94%);
  margin: 0 auto;
  padding-bottom: 28px;
  max-width: 100%;
  overflow-x: clip;
}

.topbar {
  position: sticky;
  top: 0;
  z-index: 60;
  margin-top: 10px;
  margin-bottom: 16px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 12px;
  border: 1px solid rgba(0, 43, 115, 0.12);
  border-radius: 18px;
  background: rgba(255, 255, 255, 0.88);
  backdrop-filter: blur(8px);
  box-shadow: var(--shadow-soft);
  transition:
    margin 0.18s ease,
    padding 0.18s ease,
    border-radius 0.18s ease,
    box-shadow 0.18s ease,
    background 0.18s ease,
    transform 0.18s ease;
}

.topbar-brand {
  flex: 1 1 auto;
  min-width: 0;
}

.brand-link {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  min-width: 0;
  max-width: 100%;
  color: var(--brand-blue);
  text-decoration: none;
  font-weight: 800;
  letter-spacing: 0.01em;
}

.brand-link > span {
  min-width: 0;
}

.brand-dot {
  width: 10px;
  height: 10px;
  border-radius: 999px;
  background: var(--brand-green);
  box-shadow: 0 0 0 5px rgba(0, 191, 166, 0.2);
}

.brand-logo {
  width: 24px;
  height: 24px;
  border-radius: 8px;
  object-fit: cover;
  border: 1px solid rgba(0, 43, 115, 0.18);
  background: #ffffff;
}

.topbar-subtitle {
  display: block;
  margin-top: 2px;
  color: var(--text-soft);
  font-size: 0.77rem;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.topbar-subline {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  max-width: 100%;
}

.location-tip-root {
  position: relative;
  display: inline-flex;
  align-items: center;
}

.location-tip-trigger {
  width: 22px;
  height: 22px;
  border-radius: 999px;
  border: 1px solid #c2d9ff;
  background: #f2f7ff;
  color: #1f4f92;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  padding: 0;
}

.location-tip-trigger svg {
  width: 12px;
  height: 12px;
  fill: currentColor;
}

.location-tip-trigger:hover {
  background: #e8f1ff;
}

.location-tip-popover {
  position: absolute;
  top: calc(100% + 8px);
  left: 0;
  min-width: 220px;
  max-width: 260px;
  border-radius: 12px;
  border: 1px solid #d4e3ff;
  background: #fff;
  box-shadow: 0 12px 26px rgba(0, 24, 69, 0.16);
  padding: 9px 10px;
  z-index: 120;
  display: none;
  gap: 4px;
  opacity: 0;
  transform: translateY(-4px);
  pointer-events: none;
  transition: opacity 0.15s ease, transform 0.15s ease;
}

.location-tip-root.is-open .location-tip-popover {
  display: grid;
  opacity: 1;
  transform: translateY(0);
  pointer-events: auto;
}

.location-tip-popover strong {
  font-size: 0.74rem;
  color: #123e7a;
}

.location-tip-popover span {
  font-size: 0.8rem;
  font-weight: 700;
  color: #34598c;
}

.location-tip-popover a {
  margin-top: 2px;
  font-size: 0.74rem;
  color: #0a4f93;
  text-decoration: none;
  font-weight: 700;
}

.location-tip-popover a:hover {
  text-decoration: underline;
}

.topbar-actions {
  display: flex;
  align-items: center;
  min-width: 0;
  gap: 8px;
  flex-wrap: nowrap;
  justify-content: flex-end;
}

@media (max-width: 759px) {
  .topbar {
    align-items: flex-start;
    gap: 8px;
    padding: 10px;
  }

  .topbar-brand {
    flex: 1 1 auto;
    min-width: 0;
  }

  .topbar-subline {
    min-width: 0;
    max-width: 100%;
  }

  .topbar-subtitle {
    min-width: 0;
    max-width: 100%;
  }

  .topbar-actions {
    flex: 0 0 auto;
    margin-left: auto;
    justify-content: flex-end;
    overflow-x: visible;
    padding-bottom: 0;
  }

  .topbar-actions .nav-action {
    flex: 0 0 auto;
  }

  .user-menu-dropdown {
    right: 0;
    left: auto;
  }

  body.has-client-bottom-nav.client-header-compact .topbar {
    margin-top: 6px;
    margin-bottom: 10px;
    padding: 8px 9px;
    align-items: center;
    border-radius: 16px;
    background: rgba(255, 255, 255, 0.94);
    box-shadow: 0 14px 30px rgba(0, 24, 69, 0.14);
  }

  body.has-client-bottom-nav.client-header-compact .brand-link {
    gap: 7px;
    font-size: 0.95rem;
  }

  body.has-client-bottom-nav.client-header-compact .brand-logo {
    width: 22px;
    height: 22px;
    border-radius: 7px;
  }

  body.has-client-bottom-nav.client-header-compact .brand-dot {
    width: 8px;
    height: 8px;
    box-shadow: 0 0 0 4px rgba(0, 191, 166, 0.18);
  }

  body.has-client-bottom-nav.client-header-compact .topbar-subline {
    display: none;
  }

  body.has-client-bottom-nav.client-header-compact .nav-action {
    width: 38px;
    height: 38px;
  }
}

@media (prefers-reduced-motion: no-preference) {
  body.has-client-bottom-nav.client-page-ready .container > :not(.topbar):not(.client-bottom-nav):not(.client-mini-cart):not(.client-mini-cart-tab):not(.client-back-to-top):not(.profile-confirm-modal):not(.business-request-modal):not(.favorite-cart-modal):not(.birth-confirm-modal):not(.app-toast):not(.app-footer-credit):not(script) {
    animation: clientPageEnter 0.24s ease both;
  }

  body.has-client-bottom-nav.is-client-navigating .container > :not(.topbar):not(.client-bottom-nav):not(.client-mini-cart):not(.client-mini-cart-tab):not(.client-back-to-top):not(.profile-confirm-modal):not(.business-request-modal):not(.favorite-cart-modal):not(.birth-confirm-modal):not(.app-toast):not(.app-footer-credit):not(script) {
    opacity: 0.72;
    transform: translateY(8px);
    transition: opacity 0.12s ease, transform 0.12s ease;
  }

  body.has-client-bottom-nav.client-page-ready .client-bottom-nav__shell {
    animation: clientBottomNavEnter 0.28s ease both;
  }

  body.has-client-bottom-nav.is-client-navigating .client-bottom-nav__shell {
    opacity: 0.86;
    transform: translateY(8px);
    transition: opacity 0.12s ease, transform 0.12s ease;
  }
}

@keyframes clientPageEnter {
  from {
    opacity: 0;
    transform: translateY(10px);
  }

  to {
    opacity: 1;
    transform: translateY(0);
  }
}

@keyframes clientBottomNavEnter {
  from {
    opacity: 0;
    transform: translateY(16px);
  }

  to {
    opacity: 1;
    transform: translateY(0);
  }
}

.topbar-form {
  margin: 0;
}

.user-menu-root {
  position: relative;
}

.user-menu-dropdown {
  position: absolute;
  top: calc(100% + 8px);
  right: 0;
  min-width: 176px;
  border-radius: 12px;
  border: 1px solid #d4e3ff;
  background: #ffffff;
  box-shadow: 0 12px 26px rgba(0, 24, 69, 0.16);
  padding: 6px;
  z-index: 120;
  display: none;
  opacity: 0;
  transform: translateY(-4px);
  pointer-events: none;
  transition: opacity 0.15s ease, transform 0.15s ease;
}

.user-menu-root.is-open .user-menu-dropdown {
  display: block;
  opacity: 1;
  transform: translateY(0);
  pointer-events: auto;
}

.user-menu-form {
  margin: 0;
}

.user-menu-head {
  padding: 8px 10px 10px;
  border-bottom: 1px solid #d9e6ff;
  margin-bottom: 4px;
}

.user-menu-name {
  display: block;
  color: #123c77;
  font-size: 0.83rem;
  font-weight: 800;
  line-height: 1.2;
}

.user-menu-email {
  display: block;
  margin-top: 2px;
  color: #5b7096;
  font-size: 0.73rem;
  line-height: 1.2;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.user-menu-item {
  width: 100%;
  display: flex;
  align-items: center;
  gap: 8px;
  border: 0;
  background: transparent;
  border-radius: 8px;
  padding: 8px 10px;
  text-decoration: none;
  color: #133d77;
  font-size: 0.82rem;
  font-weight: 700;
  cursor: pointer;
  text-align: left;
}

.user-menu-item-icon {
  width: 16px;
  height: 16px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  color: currentColor;
  flex: 0 0 16px;
}

.user-menu-item-icon svg {
  width: 16px;
  height: 16px;
  fill: currentColor;
}

.user-menu-item-label {
  min-width: 0;
}

.user-menu-item:hover {
  background: #eef4ff;
}

.user-menu-item-danger {
  color: #912c2c;
}

.user-menu-backdrop {
  position: fixed;
  inset: 0;
  z-index: 118;
  display: none;
  background: rgba(3, 16, 43, 0.48);
  backdrop-filter: blur(4px);
  opacity: 0;
  transition: opacity 0.18s ease;
}

.user-menu-root.is-open .user-menu-backdrop {
  display: block;
  opacity: 1;
}

body.customer-menu-open {
  overflow: hidden;
}

body.customer-menu-open .topbar {
  z-index: 130;
  -webkit-backdrop-filter: none;
  backdrop-filter: none;
}

body.customer-menu-open .container {
  overflow: visible;
}

.user-menu-drawer.user-menu-dropdown {
  position: fixed;
  top: 0;
  right: 0;
  bottom: 0;
  left: auto;
  width: min(390px, 92vw);
  min-width: 0;
  height: 100vh;
  height: 100dvh;
  max-height: none;
  border-radius: 28px 0 0 28px;
  border: 0;
  border-left: 1px solid rgba(0, 43, 115, 0.14);
  background:
    radial-gradient(circle at 85% 8%, rgba(0, 191, 166, 0.16), transparent 34%),
    linear-gradient(180deg, rgba(255, 255, 255, 0.98), rgba(241, 247, 255, 0.98));
  box-shadow: -26px 0 60px rgba(0, 24, 69, 0.22);
  padding: 0;
  z-index: 119;
  display: flex;
  flex-direction: column;
  opacity: 1;
  transform: translateX(105%);
  pointer-events: auto;
  transition: transform 0.22s ease;
  overflow: hidden;
}

.user-menu-root.is-open .user-menu-drawer.user-menu-dropdown {
  display: flex;
  opacity: 1;
  transform: translateX(0);
  pointer-events: auto;
}

.user-menu-drawer .user-menu-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  flex: 0 0 auto;
  padding: 18px;
  border-bottom: 1px solid rgba(0, 43, 115, 0.1);
  margin: 0;
  background: rgba(255, 255, 255, 0.66);
}

.user-menu-drawer .user-menu-name {
  font-size: 1.05rem;
  color: var(--brand-blue);
}

.user-menu-drawer .user-menu-email {
  max-width: 250px;
}

.user-menu-close {
  width: 42px;
  height: 42px;
  border-radius: 16px;
  border: 1px solid #cfe0ff;
  background: #ffffff;
  color: var(--brand-blue);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 42px;
  cursor: pointer;
  box-shadow: 0 12px 24px rgba(0, 43, 115, 0.08);
}

.user-menu-close svg {
  width: 20px;
  height: 20px;
  fill: currentColor;
}

.user-menu-body {
  display: grid;
  gap: 10px;
  flex: 1 1 auto;
  min-height: 0;
  padding: 14px 14px 22px;
  overflow: auto;
  overscroll-behavior: contain;
  -webkit-overflow-scrolling: touch;
}

.user-menu-social-footer {
  min-height: 54px;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  flex: 0 0 auto;
  padding: 9px 16px calc(10px + var(--client-bottom-safe-area, env(safe-area-inset-bottom)));
  border-top: 1px solid rgba(0, 43, 115, 0.1);
  background: rgba(255, 255, 255, 0.8);
  -webkit-backdrop-filter: blur(12px);
  backdrop-filter: blur(12px);
}

.user-menu-social-link {
  width: 32px;
  height: 32px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 32px;
  border: 1px solid rgba(0, 43, 115, 0.12);
  border-radius: 50%;
  color: #486184;
  background: rgba(245, 249, 255, 0.92);
  text-decoration: none;
  transition: color 0.16s ease, border-color 0.16s ease, background 0.16s ease, transform 0.16s ease;
}

.user-menu-social-link svg {
  width: 16px;
  height: 16px;
  display: block;
  fill: currentColor;
}

.user-menu-social-link.is-whatsapp {
  color: #14885b;
}

.user-menu-social-link.is-facebook {
  color: #2763ad;
}

.user-menu-social-link.is-instagram {
  color: #a33d78;
}

.user-menu-social-link:hover,
.user-menu-social-link:focus-visible {
  border-color: currentColor;
  background: #ffffff;
  transform: translateY(-1px);
  outline: none;
}

.user-menu-section {
  border: 1px solid rgba(0, 43, 115, 0.1);
  border-radius: 22px;
  background: rgba(255, 255, 255, 0.84);
  box-shadow: 0 18px 34px rgba(0, 43, 115, 0.07);
  padding: 8px;
}

.user-menu-section-title {
  margin: 2px 8px 7px;
  color: #6b7fa5;
  font-size: 0.74rem;
  line-height: 1;
  font-weight: 900;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.user-menu-drawer .user-menu-item {
  min-height: 42px;
  border-radius: 16px;
  padding: 9px 10px;
  color: #0b3c83;
  font-size: 0.92rem;
}

.user-menu-drawer .user-menu-item:hover {
  background: linear-gradient(135deg, #eef6ff, #effffc);
}

.user-menu-drawer .user-menu-item-icon {
  width: 30px;
  height: 30px;
  flex: 0 0 30px;
  border-radius: 12px;
  background: #eef4ff;
  color: #0a4d9a;
}

.user-menu-drawer .user-menu-item-icon svg {
  width: 18px;
  height: 18px;
}

.user-menu-theme-switch {
  width: 100%;
  min-height: 50px;
  display: flex;
  align-items: center;
  gap: 10px;
  border: 0;
  border-radius: 16px;
  padding: 9px 10px;
  background: transparent;
  color: #0b3c83;
  text-align: left;
  cursor: pointer;
}

.user-menu-theme-switch:hover,
.user-menu-theme-switch:focus-visible {
  background: linear-gradient(135deg, #eef6ff, #effffc);
  outline: none;
}

.user-menu-theme-switch:focus-visible {
  box-shadow: inset 0 0 0 2px rgba(13, 98, 215, 0.38);
}

.user-menu-theme-switch:disabled {
  cursor: wait;
  opacity: 0.72;
}

.user-menu-theme-switch__copy {
  min-width: 0;
  flex: 1 1 auto;
}

.user-menu-theme-switch__copy strong,
.user-menu-theme-switch__copy small {
  display: block;
}

.user-menu-theme-switch__copy strong {
  font-size: 0.92rem;
  line-height: 1.15;
}

.user-menu-theme-switch__copy small {
  margin-top: 3px;
  color: #6b7fa5;
  font-size: 0.72rem;
  line-height: 1.1;
}

.user-menu-theme-switch__control {
  position: relative;
  width: 42px;
  height: 24px;
  flex: 0 0 42px;
  border: 1px solid #b8cae5;
  border-radius: 999px;
  background: #dce7f7;
  transition: background-color 0.18s ease, border-color 0.18s ease;
}

.user-menu-theme-switch__control::after {
  content: "";
  position: absolute;
  top: 3px;
  left: 3px;
  width: 16px;
  height: 16px;
  border-radius: 50%;
  background: #ffffff;
  box-shadow: 0 2px 6px rgba(0, 43, 115, 0.24);
  transition: transform 0.18s ease;
}

.user-menu-theme-switch.is-active .user-menu-theme-switch__control {
  border-color: #008f83;
  background: #00aa98;
}

.user-menu-theme-switch.is-active .user-menu-theme-switch__control::after {
  transform: translateX(18px);
}

.user-menu-drawer .user-menu-item-danger {
  color: #9d2d2d;
}

.user-menu-drawer .user-menu-item-danger .user-menu-item-icon {
  background: #fff0f0;
  color: #b23535;
}

.user-menu-share-card {
  width: 100%;
  border: 1px solid rgba(0, 191, 166, 0.35);
  border-radius: 20px;
  background:
    radial-gradient(circle at 88% 18%, rgba(255, 255, 255, 0.28), transparent 28%),
    linear-gradient(135deg, #003583 0%, #007eaa 52%, #10c7b5 100%);
  color: #ffffff;
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 12px;
  text-align: left;
  cursor: pointer;
  box-shadow: 0 18px 34px rgba(0, 43, 115, 0.16);
}

.user-menu-share-card:hover {
  transform: translateY(-1px);
  box-shadow: 0 22px 42px rgba(0, 43, 115, 0.2);
}

.user-menu-share-icon {
  width: 40px;
  height: 40px;
  border-radius: 16px;
  background: rgba(255, 255, 255, 0.16);
  border: 1px solid rgba(255, 255, 255, 0.32);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 40px;
}

.user-menu-share-icon svg {
  width: 22px;
  height: 22px;
  fill: currentColor;
}

.user-menu-share-card strong,
.user-menu-share-card small {
  display: block;
}

.user-menu-share-card strong {
  font-size: 1rem;
  line-height: 1.15;
}

.user-menu-share-card small {
  margin-top: 4px;
  color: rgba(255, 255, 255, 0.82);
  font-size: 0.8rem;
  line-height: 1.25;
}

@media (max-width: 575px) {
  .user-menu-drawer.user-menu-dropdown {
    width: min(360px, 94vw);
    border-radius: 24px 0 0 24px;
  }

  .user-menu-body {
    padding: 14px 12px 22px;
  }
}

body.theme-dark .user-menu-backdrop {
  background: rgba(1, 6, 18, 0.62);
}

body.theme-dark .user-menu-drawer.user-menu-dropdown {
  border-left-color: #365b94;
  background:
    radial-gradient(circle at 85% 8%, rgba(0, 191, 166, 0.13), transparent 34%),
    linear-gradient(180deg, #102347, #0b1a36);
  box-shadow: -26px 0 60px rgba(0, 0, 0, 0.4);
}

body.theme-dark .user-menu-drawer .user-menu-head,
body.theme-dark .user-menu-section {
  background: rgba(16, 35, 71, 0.9);
  border-color: #365b94;
}

body.theme-dark .user-menu-close {
  background: #11264f;
  border-color: #40649b;
  color: #dce9ff;
}

body.theme-dark .user-menu-section-title {
  color: #9fb8dc;
}

body.theme-dark .user-menu-drawer .user-menu-item {
  color: #d9e8ff;
}

body.theme-dark .user-menu-drawer .user-menu-item:hover {
  background: #153164;
}

body.theme-dark .user-menu-theme-switch {
  color: #d9e8ff;
}

body.theme-dark .user-menu-theme-switch:hover,
body.theme-dark .user-menu-theme-switch:focus-visible {
  background: #153164;
}

body.theme-dark .user-menu-theme-switch__copy small {
  color: #9fb8dc;
}

body.theme-dark .user-menu-theme-switch__control {
  border-color: #5473a4;
  background: #253f6b;
}

body.theme-dark .user-menu-theme-switch.is-active .user-menu-theme-switch__control {
  border-color: #41d7c7;
  background: #00a994;
}

body.theme-dark .user-menu-drawer .user-menu-item-icon {
  background: #16305f;
  color: #9bc3ff;
}

body.theme-dark .user-menu-drawer .user-menu-item-danger .user-menu-item-icon {
  background: #3a1f2a;
  color: #ffc8c8;
}

body.theme-dark .user-menu-social-footer {
  border-top-color: #365b94;
  background: rgba(10, 26, 55, 0.9);
}

body.theme-dark .user-menu-social-link {
  border-color: rgba(120, 154, 217, 0.28);
  background: rgba(22, 48, 95, 0.8);
}

body.theme-dark .user-menu-social-link:hover,
body.theme-dark .user-menu-social-link:focus-visible {
  background: #1a376c;
}

.legal-app-shell {
  display: grid;
  gap: 14px;
  padding: 4px 0 24px;
}

.legal-app-backrow {
  display: flex;
  align-items: center;
}

.legal-app-back {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  min-height: 40px;
  padding: 9px 14px;
  border-radius: 999px;
  border: 1px solid rgba(0, 43, 115, 0.14);
  background: rgba(255, 255, 255, 0.88);
  color: var(--brand-blue);
  text-decoration: none;
  font-weight: 900;
  box-shadow: 0 14px 28px rgba(0, 43, 115, 0.08);
}

.legal-app-back svg {
  width: 18px;
  height: 18px;
  fill: currentColor;
}

.legal-app-hero {
  position: relative;
  overflow: hidden;
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 16px;
  align-items: center;
  border-radius: 28px;
  padding: 22px;
  border: 1px solid rgba(0, 191, 166, 0.22);
  background:
    radial-gradient(circle at 88% 8%, rgba(255, 255, 255, 0.34), transparent 24%),
    linear-gradient(135deg, #003583 0%, #0077a8 52%, #12c7b3 100%);
  color: #ffffff;
  box-shadow: 0 24px 52px rgba(0, 43, 115, 0.18);
}

.legal-app-hero::after {
  content: "";
  position: absolute;
  right: -46px;
  bottom: -64px;
  width: 180px;
  height: 180px;
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.12);
  pointer-events: none;
}

.legal-app-hero-copy {
  position: relative;
  z-index: 1;
}

.legal-app-hero .brand-tag {
  background: rgba(255, 255, 255, 0.92);
  border-color: rgba(255, 255, 255, 0.38);
  color: #f27a00;
}

.legal-app-hero h1 {
  margin: 12px 0 8px;
  color: #ffffff;
  font-size: clamp(1.8rem, 7vw, 3rem);
  line-height: 0.98;
  letter-spacing: -0.04em;
}

.legal-app-hero p {
  max-width: 760px;
  margin: 0;
  color: rgba(255, 255, 255, 0.88);
  font-size: 1rem;
  line-height: 1.45;
}

.legal-app-hero small {
  display: block;
  margin-top: 12px;
  color: rgba(255, 255, 255, 0.72);
  font-weight: 800;
}

.legal-app-icon {
  position: relative;
  z-index: 1;
  width: 74px;
  height: 74px;
  border-radius: 24px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: rgba(255, 255, 255, 0.16);
  border: 1px solid rgba(255, 255, 255, 0.32);
  color: #ffffff;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.26);
}

.legal-app-icon svg {
  width: 38px;
  height: 38px;
  fill: currentColor;
}

.legal-app-tabs {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 6px;
  padding: 6px;
  border-radius: 22px;
  border: 1px solid rgba(0, 43, 115, 0.1);
  background: rgba(255, 255, 255, 0.82);
  box-shadow: 0 16px 34px rgba(0, 43, 115, 0.08);
}

.legal-app-tabs a {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 44px;
  padding: 8px 10px;
  border-radius: 17px;
  color: #0c3b7b;
  text-decoration: none;
  text-align: center;
  font-size: 0.86rem;
  font-weight: 900;
}

.legal-app-tabs a.is-active {
  background: linear-gradient(135deg, #004193, #0060be);
  color: #ffffff;
  box-shadow: 0 12px 26px rgba(0, 65, 147, 0.22);
}

.legal-app-card {
  display: grid;
  gap: 12px;
}

.legal-app-section {
  border-radius: 24px;
  border: 1px solid rgba(0, 43, 115, 0.1);
  background: rgba(255, 255, 255, 0.92);
  box-shadow: 0 16px 32px rgba(0, 43, 115, 0.07);
  padding: 18px;
}

.legal-app-section h2 {
  margin: 0 0 10px;
  color: var(--brand-blue);
  font-size: 1.06rem;
  line-height: 1.2;
}

.legal-app-section-body {
  color: #53678c;
  font-size: 0.98rem;
  line-height: 1.55;
}

.legal-app-section-body p {
  margin: 0 0 10px;
}

.legal-app-section-body p:last-child,
.legal-app-section-body ul:last-child {
  margin-bottom: 0;
}

.legal-app-section-body ul {
  margin: 0 0 10px;
  padding-left: 19px;
}

.legal-app-section-body li + li {
  margin-top: 7px;
}

.legal-app-section-body a {
  color: #0058b7;
  font-weight: 900;
}

.legal-app-actions {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));
  gap: 10px;
}

.legal-app-actions .btn {
  justify-content: center;
}

.public-services-app {
  width: min(100%, 680px);
  margin: 0 auto;
  padding: 1rem 0 2.25rem;
}

.public-services-hero {
  position: relative;
  overflow: hidden;
  border: 1px solid rgba(18, 99, 197, 0.18);
  border-radius: 30px;
  padding: 1.35rem;
  margin-bottom: 1rem;
  color: var(--color-primary);
  background:
    radial-gradient(circle at 92% 10%, rgba(22, 199, 176, 0.28), transparent 36%),
    linear-gradient(135deg, rgba(255, 255, 255, 0.98), rgba(234, 247, 255, 0.94));
  box-shadow: 0 22px 48px rgba(0, 43, 115, 0.1);
}

.public-services-hero h1 {
  margin: 0.65rem 0 0.45rem;
  font-size: clamp(2rem, 10vw, 3.25rem);
  line-height: 0.94;
  letter-spacing: -0.055em;
}

.public-services-hero p {
  margin: 0;
  max-width: 34rem;
  color: var(--color-text-muted);
  font-size: 1.02rem;
}

.public-services-location {
  display: inline-flex;
  align-items: center;
  gap: 0.45rem;
  margin-top: 1rem;
  padding: 0.55rem 0.75rem;
  border: 1px solid rgba(22, 199, 176, 0.32);
  border-radius: 999px;
  color: #007a72;
  background: rgba(223, 255, 250, 0.9);
  font-weight: 900;
}

.public-services-location svg {
  width: 1rem;
  height: 1rem;
}

.public-services-section {
  margin-top: 1rem;
}

.public-services-section-head {
  display: flex;
  align-items: end;
  justify-content: space-between;
  gap: 1rem;
  margin-bottom: 0.75rem;
}

.public-services-section-head h2 {
  margin: 0.45rem 0 0;
  color: var(--color-primary);
  font-size: 1.45rem;
  letter-spacing: -0.03em;
}

.public-services-section-head small {
  color: var(--color-text-muted);
  font-weight: 800;
}

.public-services-emergency-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0.75rem;
}

.public-service-call-card,
.public-service-info-card {
  color: inherit;
  text-decoration: none;
}

.public-service-call-card {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  min-height: 106px;
  padding: 0.85rem;
  border: 1px solid rgba(18, 99, 197, 0.16);
  border-radius: 24px;
  background:
    radial-gradient(circle at 90% 8%, rgba(255, 143, 22, 0.22), transparent 35%),
    rgba(255, 255, 255, 0.94);
  box-shadow: 0 16px 34px rgba(0, 43, 115, 0.08);
}

.public-service-call-card__icon,
.public-service-info-card__icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 auto;
  border-radius: 22px;
  color: #003483;
  background: linear-gradient(135deg, #eef4ff, #dffdfa);
}

.public-service-call-card__icon {
  width: 54px;
  height: 54px;
}

.public-service-call-card__icon svg,
.public-service-info-card__icon svg {
  width: 1.45rem;
  height: 1.45rem;
  display: block;
  flex: 0 0 auto;
}

.public-service-call-card__copy {
  min-width: 0;
  display: grid;
  gap: 0.15rem;
}

.public-service-call-card__copy strong,
.public-service-info-card strong {
  color: var(--color-primary);
  font-weight: 950;
  line-height: 1.05;
}

.public-service-call-card__copy span {
  color: #008f86;
  font-size: 1.45rem;
  font-weight: 950;
}

.public-services-list {
  display: grid;
  gap: 0.75rem;
}

.public-service-info-card {
  display: grid;
  gap: 0.85rem;
  padding: 1rem;
  border: 1px solid rgba(18, 99, 197, 0.16);
  border-radius: 26px;
  background: rgba(255, 255, 255, 0.95);
  box-shadow: 0 16px 36px rgba(0, 43, 115, 0.075);
}

.public-service-institution-card {
  position: relative;
  gap: 1rem;
  padding: 1.05rem;
  border-color: rgba(18, 99, 197, 0.2);
  background:
    radial-gradient(circle at 92% 12%, rgba(0, 191, 166, 0.16), transparent 34%),
    linear-gradient(135deg, rgba(255, 255, 255, 0.98), rgba(247, 251, 255, 0.96));
  box-shadow: 0 20px 44px rgba(0, 43, 115, 0.1);
  cursor: pointer;
  transition: border-color 180ms ease, box-shadow 180ms ease, transform 180ms ease;
}

.public-service-institution-card:hover,
.public-service-institution-card:focus-visible {
  border-color: rgba(0, 43, 115, 0.28);
  box-shadow: 0 24px 52px rgba(0, 43, 115, 0.14);
  transform: translateY(-1px);
  outline: none;
}

.public-service-info-card__main {
  display: flex;
  align-items: flex-start;
  gap: 0.85rem;
}

.public-service-info-card__icon {
  width: 58px;
  height: 58px;
}

.public-service-institution-card .public-service-info-card__icon {
  width: 76px;
  height: 76px;
  border-radius: 24px;
}

.public-service-info-card__icon.has-logo {
  padding: 0.4rem;
  border: 1px solid rgba(18, 99, 197, 0.12);
  background: #ffffff;
}

.public-service-info-card__icon img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: contain;
}

.public-service-info-card__main > div > span {
  display: block;
  margin-top: 0.15rem;
  color: #008f86;
  font-weight: 900;
}

.public-service-info-card p,
.public-service-info-card small {
  margin: 0.35rem 0 0;
  color: var(--color-text-muted);
}

.public-service-info-card__actions {
  display: flex;
  flex-wrap: wrap;
  gap: 0.55rem;
}

.public-service-info-card__actions a {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 38px;
  padding: 0.45rem 0.85rem;
  border: 1px solid rgba(18, 99, 197, 0.18);
  border-radius: 999px;
  color: var(--color-primary);
  background: #fff;
  text-decoration: none;
  font-weight: 900;
}

.public-service-info-card__actions.is-directory-actions {
  justify-content: center;
}

.public-service-info-card__actions.is-directory-actions .public-service-info-card__secondary-action {
  min-height: 34px;
  padding: 0.35rem 0.72rem;
  color: #52637f;
  background: rgba(255, 255, 255, 0.68);
  border-color: rgba(18, 99, 197, 0.12);
  font-size: 0.9rem;
  font-weight: 850;
}

.public-service-directory-cta {
  flex: 1 0 100%;
  max-width: 340px;
  min-height: 48px;
  margin: 0.2rem auto 0;
  color: #ffffff !important;
  background: linear-gradient(135deg, #002b73, #0052b8) !important;
  border-color: rgba(0, 43, 115, 0.18) !important;
  box-shadow: 0 14px 28px rgba(0, 43, 115, 0.18);
  font-size: 1rem;
  font-weight: 950;
  text-align: center;
}

.public-service-directory-page {
  gap: 1rem;
}

.public-service-directory-hero {
  display: grid;
  gap: 1rem;
  padding: clamp(1rem, 4vw, 1.35rem);
  border: 1px solid rgba(18, 99, 197, 0.14);
  border-radius: 28px;
  background:
    radial-gradient(circle at 92% 5%, rgba(0, 191, 166, 0.2), transparent 34%),
    rgba(255, 255, 255, 0.95);
  box-shadow: 0 18px 42px rgba(0, 43, 115, 0.08);
}

.public-service-directory-back {
  width: fit-content;
  color: var(--color-primary);
  font-weight: 900;
  text-decoration: none;
}

.public-service-directory-head {
  display: flex;
  align-items: flex-start;
  gap: 0.95rem;
}

.public-service-directory-logo {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 72px;
  width: 72px;
  height: 72px;
  border-radius: 22px;
  color: var(--color-primary);
  background: linear-gradient(135deg, #eef4ff, #dffdfa);
  overflow: hidden;
}

.public-service-directory-logo img {
  width: 100%;
  height: 100%;
  object-fit: contain;
  padding: 0.35rem;
}

.public-service-directory-logo svg {
  width: 1.8rem;
  height: 1.8rem;
}

.public-service-directory-head h1 {
  margin: 0.35rem 0 0;
  color: var(--color-primary);
  font-size: 2.35rem;
  line-height: 0.95;
  letter-spacing: 0;
  overflow-wrap: anywhere;
}

.public-service-directory-head p,
.public-service-directory-head small {
  display: block;
  margin: 0.55rem 0 0;
  color: var(--color-text-muted);
}

@media (max-width: 575px) {
  .legal-app-hero {
    grid-template-columns: 1fr;
    padding: 20px;
    border-radius: 26px;
  }

  .legal-app-icon {
    width: 58px;
    height: 58px;
    border-radius: 20px;
    order: -1;
  }

  .legal-app-icon svg {
    width: 30px;
    height: 30px;
  }

  .legal-app-tabs {
    overflow-x: auto;
    grid-template-columns: repeat(4, minmax(112px, 1fr));
    -webkit-overflow-scrolling: touch;
  }

  .legal-app-section {
    padding: 16px;
  }
}

body.theme-dark .legal-app-back,
body.theme-dark .legal-app-tabs,
body.theme-dark .legal-app-section {
  background: rgba(16, 35, 71, 0.9);
  border-color: #365b94;
  box-shadow: 0 16px 32px rgba(0, 0, 0, 0.18);
}

body.theme-dark .legal-app-back,
body.theme-dark .legal-app-section h2,
body.theme-dark .legal-app-tabs a {
  color: #dce9ff;
}

body.theme-dark .legal-app-section-body {
  color: #aebfdb;
}

body.theme-dark .legal-app-section-body a {
  color: #8fc2ff;
}

body.theme-dark .legal-app-tabs a.is-active {
  background: linear-gradient(135deg, #0050aa, #0b7bdc);
  color: #ffffff;
}

body.theme-dark .public-services-hero,
body.theme-dark .public-service-call-card,
body.theme-dark .public-service-info-card {
  border-color: rgba(104, 160, 255, 0.32);
  color: #e9f2ff;
  background:
    radial-gradient(circle at 88% 10%, rgba(22, 199, 176, 0.18), transparent 38%),
    linear-gradient(135deg, rgba(11, 30, 64, 0.98), rgba(10, 47, 75, 0.94));
}

body.theme-dark .public-services-hero h1,
body.theme-dark .public-services-section-head h2,
body.theme-dark .public-service-call-card__copy strong,
body.theme-dark .public-service-info-card strong {
  color: #f4f8ff;
}

body.theme-dark .public-services-hero p,
body.theme-dark .public-services-section-head small,
body.theme-dark .public-service-info-card p,
body.theme-dark .public-service-info-card small {
  color: rgba(222, 234, 255, 0.78);
}

body.theme-dark .public-service-info-card__actions a {
  color: #f4f8ff;
  border-color: rgba(104, 160, 255, 0.28);
  background: rgba(255, 255, 255, 0.08);
}

body.theme-dark .public-service-info-card__actions.is-directory-actions .public-service-info-card__secondary-action {
  color: rgba(222, 234, 255, 0.82);
  border-color: rgba(104, 160, 255, 0.18);
  background: rgba(255, 255, 255, 0.06);
}

body.theme-dark .public-service-directory-cta {
  color: #ffffff;
  background: linear-gradient(135deg, #0052b8, #00a6d6) !important;
  box-shadow: 0 14px 30px rgba(0, 80, 170, 0.26);
}

body.theme-dark .public-service-directory-hero {
  border-color: rgba(104, 160, 255, 0.34);
  background:
    radial-gradient(circle at 92% 8%, rgba(0, 191, 166, 0.2), transparent 36%),
    linear-gradient(135deg, rgba(8, 25, 58, 0.98), rgba(7, 48, 72, 0.94));
  box-shadow: 0 22px 52px rgba(0, 6, 24, 0.36);
}

body.theme-dark .public-service-directory-back {
  color: rgba(222, 234, 255, 0.9);
}

body.theme-dark .public-service-directory-hero .brand-tag {
  color: #ffd28a;
  border-color: rgba(255, 183, 77, 0.34);
  background: rgba(255, 183, 77, 0.12);
}

body.theme-dark .public-service-directory-logo {
  color: #dffdfa;
  border: 1px solid rgba(104, 160, 255, 0.24);
  background: rgba(255, 255, 255, 0.92);
}

body.theme-dark .public-service-directory-logo svg {
  color: #003483;
}

body.theme-dark .public-service-directory-head h1 {
  color: #f4f8ff;
}

body.theme-dark .public-service-directory-head p,
body.theme-dark .public-service-directory-head small {
  color: rgba(222, 234, 255, 0.78);
}

body.theme-dark .public-service-directory-hero .public-service-info-card__actions a {
  color: #f4f8ff;
  border-color: rgba(104, 160, 255, 0.3);
  background: rgba(255, 255, 255, 0.08);
}

@media (max-width: 430px) {
  .public-services-emergency-grid {
    gap: 0.6rem;
  }

  .public-service-call-card {
    min-height: 118px;
    flex-direction: column;
    align-items: flex-start;
  }
}

.customer-notification-root {
  position: relative;
}

.notification-bell-glyph {
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

.notification-count-badge {
  position: absolute;
  top: -10px;
  right: -10px;
  min-width: 18px;
  height: 18px;
  border-radius: 999px;
  border: 2px solid #ffffff;
  background: var(--client-accent);
  color: var(--client-accent-ink);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 0.65rem;
  font-weight: 900;
  line-height: 1;
}

.notification-count-badge.is-hidden {
  display: none;
}

.customer-notification-dropdown {
  position: absolute;
  top: calc(100% + 8px);
  right: 0;
  width: min(320px, calc(100vw - 34px));
  border-radius: 16px;
  border: 1px solid #d4e3ff;
  background: #ffffff;
  box-shadow: 0 18px 36px rgba(0, 24, 69, 0.18);
  padding: 10px;
  z-index: 130;
  display: none;
  opacity: 0;
  transform: translateY(-4px);
  pointer-events: none;
  transition: opacity 0.15s ease, transform 0.15s ease;
}

.customer-notification-root.is-open .customer-notification-dropdown {
  display: block;
  opacity: 1;
  transform: translateY(0);
  pointer-events: auto;
}

.customer-notification-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  padding: 4px 4px 8px;
  border-bottom: 1px solid #e0ebff;
}

.customer-notification-head strong {
  color: #0a377c;
  font-size: 0.9rem;
}

.customer-notification-head button {
  border: 0;
  background: transparent;
  color: #006f65;
  font-size: 0.75rem;
  font-weight: 800;
  cursor: pointer;
  padding: 4px;
}

.customer-notification-head-actions {
  display: inline-flex;
  align-items: center;
  gap: 6px;
}

.customer-notification-head-actions a {
  color: #0a377c;
  font-size: 0.75rem;
  font-weight: 800;
  padding: 4px;
  text-decoration: none;
}

.customer-communication-toggle {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  width: 100%;
  padding: 14px;
  border: 1px solid #d6e4fb;
  border-radius: 12px;
  background: #f7faff;
  cursor: pointer;
}

.customer-communication-toggle > span:first-child {
  display: grid;
  gap: 4px;
}

.customer-communication-toggle strong {
  color: #072f70;
}

.customer-communication-toggle small {
  color: #5b7096;
  line-height: 1.4;
}

.customer-switch-control {
  position: relative;
  display: inline-flex;
  flex: 0 0 auto;
}

.customer-switch-control input {
  position: absolute;
  opacity: 0;
  pointer-events: none;
}

.customer-switch-control span {
  position: relative;
  display: block;
  width: 46px;
  height: 26px;
  border-radius: 999px;
  background: #b7c5da;
  transition: background-color 0.18s ease;
}

.customer-switch-control span::after {
  content: '';
  position: absolute;
  top: 3px;
  left: 3px;
  width: 20px;
  height: 20px;
  border-radius: 50%;
  background: #ffffff;
  box-shadow: 0 2px 7px rgba(0, 30, 78, 0.24);
  transition: transform 0.18s ease;
}

.customer-switch-control input:checked + span {
  background: #007f74;
}

.customer-switch-control input:checked + span::after {
  transform: translateX(20px);
}

.customer-switch-control input:focus-visible + span {
  outline: 3px solid rgba(31, 111, 235, 0.28);
  outline-offset: 2px;
}

.platform-news-page,
.platform-news-detail {
  width: min(100%, 860px);
  margin: 22px auto 110px;
}

.platform-news-heading {
  display: grid;
  grid-template-columns: 48px minmax(0, 1fr);
  gap: 14px;
  align-items: start;
  margin-bottom: 18px;
}

.platform-news-heading h1 {
  margin: 8px 0 5px;
  color: #072759;
  font-size: 2.55rem;
  line-height: 1.05;
  letter-spacing: 0;
}

.platform-news-heading p {
  margin: 0;
  color: #5b7096;
  line-height: 1.5;
}

.platform-news-back {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  width: 46px;
  height: 46px;
  border: 1px solid #cdddfa;
  border-radius: 12px;
  background: #ffffff;
  color: #073a87;
  text-decoration: none;
  font-size: 1.35rem;
  font-weight: 900;
}

.platform-news-mark-all {
  display: flex;
  justify-content: flex-end;
  margin-bottom: 14px;
}

.platform-news-list {
  display: grid;
  gap: 10px;
}

.platform-news-item {
  display: grid;
  grid-template-columns: 72px minmax(0, 1fr) 22px;
  align-items: center;
  gap: 13px;
  min-height: 96px;
  padding: 11px;
  border: 1px solid #d6e4f7;
  border-radius: 14px;
  background: #ffffff;
  color: #102d5c;
  text-decoration: none;
  box-shadow: 0 8px 22px rgba(0, 35, 89, 0.06);
}

.platform-news-item.is-unread {
  border-color: #86b8ff;
  box-shadow: inset 4px 0 #087f74, 0 8px 22px rgba(0, 35, 89, 0.08);
}

.platform-news-item > img,
.platform-news-item-icon {
  width: 72px;
  height: 72px;
  border-radius: 10px;
  object-fit: cover;
}

.platform-news-item-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: #e8f8f6;
  color: #006f65;
  font-weight: 900;
}

.platform-news-item-copy {
  display: grid;
  min-width: 0;
  gap: 3px;
}

.platform-news-item-copy > strong {
  color: #062e70;
  font-size: 1rem;
  overflow-wrap: anywhere;
}

.platform-news-item-copy > span:not(.platform-news-item-meta) {
  color: #4f668c;
  font-size: 0.84rem;
  line-height: 1.35;
}

.platform-news-item-copy time {
  color: #7183a3;
  font-size: 0.72rem;
}

.platform-news-item-meta {
  display: flex;
  align-items: center;
  gap: 8px;
}

.platform-news-item-meta small,
.platform-news-item-meta em {
  color: #006f65;
  font-size: 0.68rem;
  font-style: normal;
  font-weight: 900;
  text-transform: uppercase;
}

.platform-news-item-meta em {
  color: #b35200;
}

.platform-news-item-arrow {
  color: #52709f;
  font-size: 1.6rem;
}

.platform-news-empty {
  display: grid;
  justify-items: center;
  gap: 8px;
  padding: 48px 22px;
  border: 1px dashed #bad0ef;
  border-radius: 14px;
  background: #f7faff;
  color: #536b93;
  text-align: center;
}

.platform-news-empty strong {
  color: #073a87;
  font-size: 1.15rem;
}

.platform-news-empty p {
  margin: 0;
}

.platform-news-empty-mark,
.platform-news-signature-mark {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 50px;
  height: 50px;
  border-radius: 12px;
  background: #073a87;
  color: #ffffff;
  font-weight: 900;
}

.platform-news-detail {
  overflow: hidden;
  border: 1px solid #d6e4f7;
  border-radius: 16px;
  background: #ffffff;
  box-shadow: 0 18px 42px rgba(0, 34, 84, 0.12);
}

.platform-news-detail-back {
  width: auto;
  margin: 14px;
  padding: 0 14px;
  font-size: 0.9rem;
}

.platform-news-detail-media {
  margin: 0;
  width: 100%;
  aspect-ratio: 16 / 9;
  background: #eef4fb;
}

.platform-news-detail-media img {
  width: 100%;
  height: 100%;
  object-fit: contain;
}

.platform-news-detail-copy {
  padding: 22px;
}

.platform-news-detail-meta {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}

.platform-news-detail-meta time {
  color: #7183a3;
  font-size: 0.78rem;
}

.platform-news-detail h1 {
  margin: 16px 0 14px;
  color: #062d69;
  font-size: 2.65rem;
  line-height: 1.08;
  letter-spacing: 0;
  overflow-wrap: anywhere;
}

.platform-news-detail-body {
  color: #314d78;
  font-size: 1rem;
  line-height: 1.7;
  overflow-wrap: anywhere;
}

.app-update-copy {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  min-width: 0;
  box-sizing: border-box;
}

.app-update-mark {
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: 100%;
  max-width: 180px;
  min-height: 68px;
  margin-bottom: 18px;
  padding: 12px 16px;
  border: 1px solid #bad3f5;
  border-radius: 8px;
  background: #eef6ff;
  color: #073a87;
  font-weight: 900;
}

.app-update-mark span {
  display: grid;
  place-items: center;
  width: 42px;
  height: 42px;
  border-radius: 8px;
  background: #073a87;
  color: #ffffff;
}

.app-update-mark strong {
  color: #008f83;
  font-size: 2rem;
  line-height: 1;
}

.app-update-primary-action {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  width: min(100%, 360px);
  max-width: 100%;
  min-height: 54px;
  margin: 24px auto 0;
  align-self: center;
  box-sizing: border-box;
  white-space: normal;
  text-align: center;
  overflow-wrap: anywhere;
}

.app-update-store-icon {
  font-size: 0.9rem;
  line-height: 1;
}

.app-update-note,
.app-update-unavailable {
  width: 100%;
  margin: 14px 0 0;
  color: #6a7e9f;
  font-size: 0.86rem;
  text-align: center;
  white-space: normal;
  overflow-wrap: anywhere;
}

.app-update-unavailable {
  padding: 14px;
  border: 1px solid #edc785;
  border-radius: 8px;
  background: #fff8e9;
  color: #805409;
}

.platform-news-signature {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-top: 26px;
  padding-top: 18px;
  border-top: 1px solid #e1eaf7;
}

.platform-news-signature span:last-child {
  display: grid;
  gap: 2px;
}

.platform-news-signature strong {
  color: #073a87;
}

.platform-news-signature small {
  color: #6a7e9f;
}

body.theme-dark .customer-communication-toggle,
body.theme-dark .platform-news-item,
body.theme-dark .platform-news-detail,
body.theme-dark .platform-news-back {
  border-color: #294d7f;
  background: #0d2850;
}

body.theme-dark .platform-news-back {
  color: #e8f1ff;
}

body.theme-dark .customer-communication-toggle strong,
body.theme-dark .platform-news-heading h1,
body.theme-dark .platform-news-item-copy > strong,
body.theme-dark .platform-news-detail h1,
body.theme-dark .platform-news-signature strong {
  color: #f3f7ff;
}

body.theme-dark .customer-communication-toggle small,
body.theme-dark .platform-news-heading p,
body.theme-dark .platform-news-item-copy > span:not(.platform-news-item-meta),
body.theme-dark .platform-news-item-copy time,
body.theme-dark .platform-news-detail-body,
body.theme-dark .platform-news-detail-meta time,
body.theme-dark .platform-news-signature small {
  color: #b8c9e5;
}

body.theme-dark .platform-news-empty {
  border-color: #315886;
  background: #0b2448;
  color: #b8c9e5;
}

body.theme-dark .platform-news-empty strong {
  color: #ffffff;
}

body.theme-dark .platform-news-signature {
  border-top-color: #294d7f;
}

body.theme-dark .app-update-mark {
  border-color: #315886;
  background: #112f5c;
  color: #f3f7ff;
}

body.theme-dark .app-update-note {
  color: #b8c9e5;
}

body.theme-dark .app-update-unavailable {
  border-color: #805f2b;
  background: #352b18;
  color: #ffe0a6;
}

body.theme-dark .customer-notification-head-actions a {
  color: #dbe8ff;
}

@media (max-width: 560px) {
  .platform-news-page,
  .platform-news-detail {
    margin-top: 14px;
  }

  .platform-news-heading h1 {
    font-size: 1.8rem;
  }

  .platform-news-detail h1 {
    font-size: 1.75rem;
  }

  .platform-news-item {
    grid-template-columns: 58px minmax(0, 1fr) 16px;
    gap: 10px;
  }

  .platform-news-item > img,
  .platform-news-item-icon {
    width: 58px;
    height: 58px;
  }

  .platform-news-detail-copy {
    padding: 18px;
  }

  .customer-communication-toggle {
    align-items: flex-start;
  }
}

.customer-notification-list {
  display: grid;
  gap: 6px;
  margin-top: 8px;
  max-height: 320px;
  overflow: auto;
}

.customer-notification-empty {
  margin: 0;
  color: #5b7096;
  font-size: 0.82rem;
  padding: 8px 4px;
}

.customer-notification-item {
  display: grid;
  gap: 2px;
  border-radius: 12px;
  padding: 9px 10px;
  color: #153b76;
  text-decoration: none;
  background: linear-gradient(135deg, #f4f8ff, #eefcff);
  border: 1px solid #d9e8ff;
}

.customer-notification-item:hover {
  border-color: #a9c5ff;
  transform: translateY(-1px);
}

.customer-notification-item strong {
  font-size: 0.84rem;
  color: #00307c;
}

.customer-notification-item span {
  font-size: 0.78rem;
  line-height: 1.35;
}

.customer-notification-item small {
  color: #687da1;
  font-size: 0.7rem;
}

@media (max-width: 759px) {
  .customer-notification-dropdown {
    right: -48px;
    width: min(420px, calc(100vw - 36px));
  }
}

.sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}

.hero {
  padding: 4px 0 12px;
}

.hero-home {
  padding-top: 4px;
}

.hero-panel {
  border-radius: 22px;
  padding: 18px 16px;
  background:
    radial-gradient(circle at 20% 10%, rgba(255, 255, 255, 0.25) 0%, transparent 42%),
    linear-gradient(120deg, rgba(0, 43, 115, 0.98) 0%, rgba(0, 75, 158, 0.97) 55%, rgba(0, 191, 166, 0.9) 100%);
  color: #f3f8ff;
  box-shadow: var(--shadow-strong);
}

.hero-panel h1 {
  color: #fff;
}

.hero-panel .brand-tag {
  background: rgba(255, 255, 255, 0.18);
  color: #fff;
}

.hero-panel .lead {
  color: #cde0ff;
}

.hero-location {
  margin: 8px 0 0;
  font-size: 0.78rem;
  color: #d9ebff;
  font-weight: 700;
}

.hero-location-row {
  display: inline-flex;
  align-items: center;
  gap: 8px;
}

.hero-location-tip {
  margin-left: 2px;
}

.hero-panel .hero-location-tip .location-tip-trigger {
  width: 20px;
  height: 20px;
  border-color: rgba(205, 224, 255, 0.7);
  background: rgba(255, 255, 255, 0.14);
  color: #ffffff;
}

.hero-panel .hero-location-tip .location-tip-trigger:hover {
  background: rgba(255, 255, 255, 0.24);
}

.hero-panel .hero-location-tip .location-tip-popover {
  left: auto;
  right: 0;
}

.hero-stats {
  margin-top: 14px;
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
}

.stat-pill {
  padding: 10px 8px;
  border-radius: 14px;
  border: 1px solid rgba(255, 255, 255, 0.22);
  background: rgba(255, 255, 255, 0.1);
  text-align: center;
}

.stat-pill strong {
  display: block;
  font-size: 1.02rem;
  color: #fff;
}

.stat-pill span {
  font-size: 0.72rem;
  color: #cde0ff;
}

.brand-tag {
  display: inline-flex;
  align-items: center;
  padding: 5px 10px;
  border-radius: 999px;
  background: var(--client-accent-soft);
  border: 1px solid var(--client-accent-border);
  color: var(--client-accent-strong);
  font-size: 0.7rem;
  font-weight: 800;
  letter-spacing: 0.05em;
  text-transform: uppercase;
}

h1 {
  margin: 12px 0 8px;
  line-height: 1.16;
  font-size: clamp(1.45rem, 6.1vw, 2.25rem);
  color: var(--brand-blue);
}

h2,
h3 {
  margin: 0;
  line-height: 1.24;
  color: var(--brand-blue);
}

h2 {
  font-size: 1.04rem;
}

h3 {
  font-size: 0.98rem;
}

p {
  margin: 0;
}

p.lead {
  color: var(--text-soft);
  max-width: 760px;
  font-size: 0.95rem;
}

.section {
  padding: 10px 0 14px;
  min-width: 0;
  max-width: 100%;
}

.section-tight {
  padding-top: 0;
}

.section-head {
  margin-bottom: 10px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
}

.section-meta {
  font-size: 0.74rem;
  color: var(--client-accent-strong);
  font-weight: 700;
  background: var(--client-accent-soft);
  border: 1px solid var(--client-accent-border);
  border-radius: 999px;
  padding: 4px 8px;
}

.grid {
  display: grid;
  gap: 12px;
  grid-template-columns: 1fr;
}

.split {
  display: grid;
  gap: 12px;
}

.card {
  background: var(--brand-white);
  border: 1px solid var(--border);
  border-radius: 18px;
  padding: 14px;
  box-shadow: var(--shadow-soft);
  min-width: 0;
  max-width: 100%;
}

.card p {
  color: var(--text-soft);
  font-size: 0.91rem;
  line-height: 1.45;
}

.card-search {
  padding: 12px;
}

.is-loading {
  opacity: 0.62;
  pointer-events: none;
  transition: opacity 0.2s ease;
}

#home-content-root {
  transition: opacity 0.18s ease, filter 0.18s ease;
}

#home-content-root.is-loading {
  opacity: 0.82;
  filter: saturate(0.94);
}

#home-content-root.is-loading .business-card,
#home-content-root.is-loading .promo-banner,
#home-content-root.is-loading .vertical-tile,
#home-content-root.is-loading .open-food-callout,
#home-content-root.is-loading .filter-collapse,
#home-content-root.is-loading .home-banner-slide,
#home-content-root.is-loading .card {
  position: relative;
  overflow: hidden;
}

#home-content-root.is-loading .business-card::after,
#home-content-root.is-loading .promo-banner::after,
#home-content-root.is-loading .vertical-tile::after,
#home-content-root.is-loading .open-food-callout::after,
#home-content-root.is-loading .filter-collapse::after,
#home-content-root.is-loading .home-banner-slide::after,
#home-content-root.is-loading .card::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 8;
  border-radius: inherit;
  pointer-events: none;
  background:
    linear-gradient(105deg, transparent 0%, rgba(255, 255, 255, 0.66) 45%, transparent 72%);
  background-size: 220% 100%;
  animation: clientSkeletonSweep 1.05s ease-in-out infinite;
}

@keyframes clientSkeletonSweep {
  from {
    background-position: 180% 0;
  }

  to {
    background-position: -80% 0;
  }
}

.filter-collapse {
  padding: 0;
  overflow: hidden;
}

.filter-collapse-summary {
  list-style: none;
  cursor: pointer;
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 10px;
  padding: 14px;
  font-size: 0.95rem;
  font-weight: 800;
  color: var(--brand-blue);
}

.filter-summary-title {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.filter-summary-meta {
  display: inline-flex;
  flex-direction: column;
  align-items: flex-end;
  gap: 4px;
  flex-shrink: 0;
}

.filter-collapse-summary::-webkit-details-marker {
  display: none;
}

.filter-collapse-summary small {
  color: var(--text-soft);
  font-size: 0.72rem;
  font-weight: 700;
}

.filter-indicator {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: 0.68rem;
  font-weight: 800;
  color: #405e90;
  border: 1px solid #cddfff;
  background: #f4f8ff;
  border-radius: 999px;
  padding: 4px 8px;
}

.filter-indicator::before {
  content: "";
  width: 7px;
  height: 7px;
  border-radius: 999px;
  background: #93a9cb;
}

.filter-indicator-active {
  color: #004b7d;
  border-color: #91ddcf;
  background: #e8fbf7;
}

.filter-indicator-active::before {
  background: var(--brand-green);
}

.filter-collapse[open] .filter-collapse-summary {
  border-bottom: 1px solid #deebff;
}

.filter-collapse-body {
  padding: 12px;
}

.search-shell {
  display: grid;
  gap: 10px;
}

.search-field label {
  display: block;
  margin-bottom: 6px;
  font-size: 0.78rem;
  font-weight: 700;
  color: var(--text-soft);
}

.search-check {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-size: 0.86rem;
  color: var(--text-soft);
}

.search-actions {
  margin-top: 2px;
}

.chip-scroll {
  margin-top: 10px;
  display: flex;
  gap: 8px;
  overflow-x: auto;
  padding-bottom: 2px;
  -ms-overflow-style: none;
  scrollbar-width: none;
}

.chip-scroll::-webkit-scrollbar {
  display: none;
}

.sort-scroll {
  margin-top: 8px;
}

.chip {
  flex-shrink: 0;
  display: inline-flex;
  align-items: center;
  gap: 6px;
  text-decoration: none;
  border-radius: 999px;
  border: 1px solid #d3e4ff;
  color: #17417f;
  background: #f3f8ff;
  padding: 6px 10px;
  font-size: 0.78rem;
  font-weight: 700;
}

.chip small {
  font-size: 0.68rem;
  color: #3f5d93;
}

.chip-active {
  background: var(--brand-blue);
  color: #fff;
  border-color: var(--brand-blue);
}

.chip-active small {
  color: #dbeafe;
}

.vertical-discovery-panel {
  box-sizing: border-box;
  margin: 4px 0 10px;
  padding: 14px;
  border: 1px solid var(--border);
  border-radius: 18px;
  background: color-mix(in srgb, var(--surface) 18%, #ffffff 82%);
  box-shadow: var(--shadow-soft);
  overflow: hidden;
}

body.theme-dark .vertical-discovery-panel {
  border-color: #2c4978;
  background: color-mix(in srgb, var(--surface-alt) 88%, #09142c 12%);
  box-shadow: 0 14px 30px rgba(1, 5, 17, 0.3);
}

.vertical-discovery-head {
  align-items: flex-end;
  margin-bottom: 10px;
}

.vertical-discovery-head h2 {
  font-size: 0.96rem;
}

.vertical-discovery-copy {
  margin-top: 2px;
  color: var(--text-soft);
  font-size: 0.8rem;
  line-height: 1.35;
}

.vertical-discovery-link {
  color: var(--brand-blue);
  text-decoration: none;
  font-size: 0.74rem;
  font-weight: 800;
  white-space: nowrap;
}

.vertical-discovery-link:hover {
  text-decoration: underline;
}

.vertical-carousel {
  display: flex;
  gap: 9px;
  overflow-x: auto;
  padding: 2px 1px 4px;
  scroll-snap-type: x proximity;
  -ms-overflow-style: none;
  scrollbar-width: none;
}

.vertical-carousel::-webkit-scrollbar {
  display: none;
}

.vertical-discovery-state {
  margin: 8px 1px 0;
  display: flex;
  align-items: center;
  gap: 6px;
  flex-wrap: wrap;
  color: var(--text-soft);
  font-size: 0.72rem;
  line-height: 1.35;
}

.vertical-discovery-state-label {
  display: inline-flex;
  align-items: center;
  padding: 4px 8px;
  border-radius: 999px;
  border: 1px solid #dbe7fb;
  background: rgba(255, 255, 255, 0.72);
  color: #5c77a4;
  font-weight: 700;
}

.vertical-discovery-state strong {
  color: var(--brand-blue);
  font-weight: 900;
}

.vertical-tile {
  scroll-snap-align: start;
  flex: 0 0 72px;
  display: grid;
  gap: 6px;
  text-decoration: none;
  color: var(--brand-blue);
}

.vertical-tile-media {
  width: 72px;
  height: 72px;
  border-radius: 18px;
  border: 1px solid #d7e6ff;
  background: linear-gradient(160deg, #ffffff 0%, #f2f8ff 100%);
  box-shadow: 0 12px 26px rgba(0, 43, 115, 0.08);
  display: grid;
  place-items: center;
  overflow: hidden;
  transition: transform 0.16s ease, box-shadow 0.18s ease, border-color 0.18s ease;
}

.vertical-tile:hover .vertical-tile-media {
  transform: translateY(-2px);
  box-shadow: 0 16px 28px rgba(0, 43, 115, 0.12);
  border-color: #b9d0ff;
}

.vertical-tile-active .vertical-tile-media {
  border-color: rgba(0, 191, 166, 0.42);
  box-shadow: 0 16px 28px rgba(0, 43, 115, 0.16);
  background: linear-gradient(160deg, #f4fffc 0%, #e9fbf7 100%);
}

.vertical-tile-media-all {
  background: linear-gradient(135deg, rgba(0, 43, 115, 0.98) 0%, rgba(0, 135, 154, 0.95) 100%);
  border-color: rgba(0, 43, 115, 0.2);
}

.vertical-tile-media-all svg {
  width: 25px;
  height: 25px;
  fill: #ffffff;
}

.vertical-tile-active .vertical-tile-media-all {
  border-color: rgba(0, 191, 166, 0.5);
  background: linear-gradient(135deg, rgba(0, 43, 115, 0.98) 0%, rgba(0, 135, 154, 0.95) 100%);
  box-shadow: 0 16px 28px rgba(0, 43, 115, 0.2);
}

.vertical-tile-active .vertical-tile-media-all svg {
  fill: #ffffff;
}

.vertical-tile-image,
.vertical-tile-placeholder,
.vertical-tile-icon {
  width: 100%;
  height: 100%;
}

.vertical-tile-image {
  object-fit: cover;
}

.vertical-tile-placeholder {
  display: grid;
  place-items: center;
  background: linear-gradient(145deg, rgba(0, 43, 115, 0.96) 0%, rgba(0, 191, 166, 0.82) 100%);
  color: #ffffff;
  font-size: 1.25rem;
  font-weight: 900;
}

.vertical-tile-icon {
  --vertical-icon-ink: #003a87;
  --vertical-icon-bg-a: #e8fff9;
  --vertical-icon-bg-b: #d6efff;
  --vertical-icon-glow: rgba(0, 191, 166, 0.22);
  --vertical-icon-ring: rgba(255, 255, 255, 0.64);
  --vertical-icon-sheen: rgba(255, 255, 255, 0.92);
  display: grid;
  place-items: center;
  position: relative;
  isolation: isolate;
  overflow: hidden;
  border-radius: inherit;
  color: var(--vertical-icon-ink);
  background:
    radial-gradient(circle at 25% 18%, var(--vertical-icon-sheen) 0 13%, transparent 14%),
    radial-gradient(circle at 82% 82%, var(--vertical-icon-glow) 0 28%, transparent 29%),
    linear-gradient(145deg, var(--vertical-icon-bg-a) 0%, var(--vertical-icon-bg-b) 100%);
  box-shadow:
    inset 0 1px 0 var(--vertical-icon-ring),
    inset 0 -16px 28px rgba(0, 43, 115, 0.06);
}

.vertical-tile-icon::before,
.vertical-directory-card-icon::before {
  content: "";
  position: absolute;
  inset: 9%;
  z-index: 0;
  border: 1px solid rgba(255, 255, 255, 0.54);
  border-radius: inherit;
  opacity: 0.72;
  pointer-events: none;
}

.vertical-tile-icon::after,
.vertical-directory-card-icon::after {
  content: "";
  position: absolute;
  top: -28%;
  left: -36%;
  z-index: 0;
  width: 72%;
  height: 72%;
  background: linear-gradient(135deg, rgba(255, 255, 255, 0.46), rgba(255, 255, 255, 0));
  transform: rotate(18deg);
  pointer-events: none;
}

.vertical-tile-icon-svg {
  position: relative;
  z-index: 1;
  width: 34px;
  height: 34px;
  filter:
    drop-shadow(0 8px 16px rgba(0, 43, 115, 0.14))
    drop-shadow(0 1px 0 rgba(255, 255, 255, 0.65));
}

.vertical-tile-active .vertical-tile-icon {
  color: var(--vertical-icon-active-ink, var(--vertical-icon-ink));
  box-shadow:
    inset 0 1px 0 var(--vertical-icon-ring),
    inset 0 -16px 28px rgba(0, 43, 115, 0.06),
    0 0 0 3px rgba(0, 191, 166, 0.24);
}

.vertical-icon-family-food {
  --vertical-icon-ink: #9a3b00;
  --vertical-icon-bg-a: #fff4df;
  --vertical-icon-bg-b: #ffd9a9;
  --vertical-icon-glow: rgba(255, 139, 28, 0.3);
}

.vertical-icon-family-health {
  --vertical-icon-ink: #00694f;
  --vertical-icon-bg-a: #e8fff4;
  --vertical-icon-bg-b: #c9f5e8;
  --vertical-icon-glow: rgba(24, 186, 128, 0.28);
}

.vertical-icon-family-pets {
  --vertical-icon-ink: #4e3aa3;
  --vertical-icon-bg-a: #f3efff;
  --vertical-icon-bg-b: #dff6f1;
  --vertical-icon-glow: rgba(111, 85, 213, 0.22);
}

.vertical-icon-family-build {
  --vertical-icon-ink: #805000;
  --vertical-icon-bg-a: #fff6d8;
  --vertical-icon-bg-b: #e5efff;
  --vertical-icon-glow: rgba(246, 173, 40, 0.3);
}

.vertical-icon-family-tech {
  --vertical-icon-ink: #004e9b;
  --vertical-icon-bg-a: #eaf4ff;
  --vertical-icon-bg-b: #d5fbff;
  --vertical-icon-glow: rgba(40, 145, 255, 0.25);
}

.vertical-icon-family-home {
  --vertical-icon-ink: #0c5f80;
  --vertical-icon-bg-a: #ecf8ff;
  --vertical-icon-bg-b: #fff2dc;
  --vertical-icon-glow: rgba(38, 166, 214, 0.2);
}

.vertical-icon-family-style {
  --vertical-icon-ink: #8b2866;
  --vertical-icon-bg-a: #fff0f8;
  --vertical-icon-bg-b: #ffe2c6;
  --vertical-icon-glow: rgba(222, 84, 155, 0.25);
}

.vertical-icon-family-transport {
  --vertical-icon-ink: #07527c;
  --vertical-icon-bg-a: #eaf7ff;
  --vertical-icon-bg-b: #d9e6ff;
  --vertical-icon-glow: rgba(44, 137, 216, 0.24);
}

.vertical-icon-family-nature {
  --vertical-icon-ink: #226b35;
  --vertical-icon-bg-a: #efffe8;
  --vertical-icon-bg-b: #d5f2c9;
  --vertical-icon-glow: rgba(72, 179, 86, 0.26);
}

.vertical-icon-family-culture {
  --vertical-icon-ink: #6042a3;
  --vertical-icon-bg-a: #f4efff;
  --vertical-icon-bg-b: #fff0cf;
  --vertical-icon-glow: rgba(128, 93, 219, 0.22);
}

.vertical-icon-family-services {
  --vertical-icon-ink: #003a87;
  --vertical-icon-bg-a: #eff6ff;
  --vertical-icon-bg-b: #dff7f3;
  --vertical-icon-glow: rgba(0, 92, 191, 0.22);
}

.vertical-icon-family-adult {
  --vertical-icon-ink: #663154;
  --vertical-icon-bg-a: #fff0f6;
  --vertical-icon-bg-b: #eadff8;
  --vertical-icon-glow: rgba(119, 55, 96, 0.22);
}

body.theme-dark .vertical-tile-icon,
body.theme-dark .vertical-directory-card-icon {
  --vertical-icon-ring: rgba(255, 255, 255, 0.12);
  --vertical-icon-sheen: rgba(255, 255, 255, 0.15);
  color: var(--vertical-icon-ink);
  background:
    radial-gradient(circle at 25% 18%, var(--vertical-icon-sheen) 0 13%, transparent 14%),
    radial-gradient(circle at 82% 82%, var(--vertical-icon-glow) 0 28%, transparent 29%),
    linear-gradient(145deg, var(--vertical-icon-bg-a) 0%, var(--vertical-icon-bg-b) 100%);
  box-shadow:
    inset 0 1px 0 var(--vertical-icon-ring),
    inset 0 -18px 34px rgba(0, 0, 0, 0.18);
}

body.theme-dark .vertical-icon-family-food {
  --vertical-icon-ink: #ffd38a;
  --vertical-icon-bg-a: #3f2a13;
  --vertical-icon-bg-b: #1d3658;
  --vertical-icon-glow: rgba(255, 145, 35, 0.2);
}

body.theme-dark .vertical-icon-family-health {
  --vertical-icon-ink: #84f1c8;
  --vertical-icon-bg-a: #123d34;
  --vertical-icon-bg-b: #11345c;
  --vertical-icon-glow: rgba(29, 214, 142, 0.18);
}

body.theme-dark .vertical-icon-family-pets {
  --vertical-icon-ink: #c8baff;
  --vertical-icon-bg-a: #2b2750;
  --vertical-icon-bg-b: #123a45;
  --vertical-icon-glow: rgba(140, 112, 255, 0.18);
}

body.theme-dark .vertical-icon-family-build {
  --vertical-icon-ink: #ffd778;
  --vertical-icon-bg-a: #3c3018;
  --vertical-icon-bg-b: #172d52;
  --vertical-icon-glow: rgba(252, 179, 47, 0.18);
}

body.theme-dark .vertical-icon-family-tech {
  --vertical-icon-ink: #95dbff;
  --vertical-icon-bg-a: #15365f;
  --vertical-icon-bg-b: #0d3e52;
  --vertical-icon-glow: rgba(63, 168, 255, 0.2);
}

body.theme-dark .vertical-icon-family-home {
  --vertical-icon-ink: #9fe2ff;
  --vertical-icon-bg-a: #16354d;
  --vertical-icon-bg-b: #352d1c;
  --vertical-icon-glow: rgba(65, 185, 229, 0.16);
}

body.theme-dark .vertical-icon-family-style {
  --vertical-icon-ink: #ffb7dd;
  --vertical-icon-bg-a: #46233d;
  --vertical-icon-bg-b: #3b2d1f;
  --vertical-icon-glow: rgba(255, 112, 185, 0.18);
}

body.theme-dark .vertical-icon-family-transport {
  --vertical-icon-ink: #9edcff;
  --vertical-icon-bg-a: #153852;
  --vertical-icon-bg-b: #1b2b57;
  --vertical-icon-glow: rgba(70, 160, 235, 0.18);
}

body.theme-dark .vertical-icon-family-nature {
  --vertical-icon-ink: #a9eba1;
  --vertical-icon-bg-a: #193d27;
  --vertical-icon-bg-b: #1e3a22;
  --vertical-icon-glow: rgba(95, 218, 106, 0.18);
}

body.theme-dark .vertical-icon-family-culture {
  --vertical-icon-ink: #d2c4ff;
  --vertical-icon-bg-a: #312753;
  --vertical-icon-bg-b: #3d311b;
  --vertical-icon-glow: rgba(153, 124, 255, 0.17);
}

body.theme-dark .vertical-icon-family-services {
  --vertical-icon-ink: #a9d6ff;
  --vertical-icon-bg-a: #142f58;
  --vertical-icon-bg-b: #12394b;
  --vertical-icon-glow: rgba(63, 150, 255, 0.18);
}

body.theme-dark .vertical-icon-family-adult {
  --vertical-icon-ink: #f2b3d7;
  --vertical-icon-bg-a: #40263a;
  --vertical-icon-bg-b: #2f2a50;
  --vertical-icon-glow: rgba(210, 105, 165, 0.16);
}

.vertical-tile-label {
  color: #123c77;
  font-size: 0.69rem;
  font-weight: 800;
  line-height: 1.18;
  text-align: center;
}

.vertical-tile-active .vertical-tile-label {
  color: #00584f;
}

.filter-selected-vertical {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  max-width: 220px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-size: 0.66rem;
  font-weight: 800;
  color: #00584f;
  border: 1px solid #9be2d7;
  background: #ebfbf7;
  border-radius: 999px;
  padding: 4px 8px;
}

.vertical-directory-hero {
  padding: 18px;
}

.vertical-directory-location {
  margin-top: 8px;
  font-size: 0.8rem;
  font-weight: 800;
  color: #27508e;
}

.vertical-directory-empty {
  text-align: center;
}

.vertical-directory-grid {
  display: grid;
  gap: 12px;
  grid-template-columns: repeat(auto-fit, minmax(168px, 1fr));
}

.vertical-directory-card {
  display: grid;
  gap: 12px;
  text-decoration: none;
  color: inherit;
  position: relative;
  overflow: hidden;
}

.vertical-directory-card-media {
  width: 100%;
  aspect-ratio: 1 / 1;
  border-radius: 18px;
  overflow: hidden;
  background: linear-gradient(160deg, #ffffff 0%, #eef6ff 100%);
  border: 1px solid #d8e6ff;
}

.vertical-directory-card-image,
.vertical-directory-card-placeholder,
.vertical-directory-card-icon {
  width: 100%;
  height: 100%;
}

.vertical-directory-card-image {
  object-fit: cover;
}

.vertical-directory-card-placeholder {
  display: grid;
  place-items: center;
  background: linear-gradient(145deg, rgba(0, 43, 115, 0.96) 0%, rgba(0, 191, 166, 0.82) 100%);
  color: #ffffff;
  font-size: 2.1rem;
  font-weight: 900;
}

.vertical-directory-card-icon {
  --vertical-icon-ink: #003a87;
  --vertical-icon-bg-a: #ebfff9;
  --vertical-icon-bg-b: #dceeff;
  --vertical-icon-glow: rgba(0, 191, 166, 0.2);
  --vertical-icon-ring: rgba(255, 255, 255, 0.64);
  --vertical-icon-sheen: rgba(255, 255, 255, 0.94);
  display: grid;
  place-items: center;
  position: relative;
  isolation: isolate;
  overflow: hidden;
  border-radius: inherit;
  color: var(--vertical-icon-ink);
  background:
    radial-gradient(circle at 25% 18%, var(--vertical-icon-sheen) 0 13%, transparent 14%),
    radial-gradient(circle at 82% 82%, var(--vertical-icon-glow) 0 28%, transparent 29%),
    linear-gradient(145deg, var(--vertical-icon-bg-a) 0%, var(--vertical-icon-bg-b) 100%);
  box-shadow:
    inset 0 1px 0 var(--vertical-icon-ring),
    inset 0 -24px 42px rgba(0, 43, 115, 0.07);
}

.vertical-directory-card-icon-svg {
  position: relative;
  z-index: 1;
  width: 54%;
  height: 54%;
  max-width: 92px;
  max-height: 92px;
  filter:
    drop-shadow(0 14px 24px rgba(0, 43, 115, 0.14))
    drop-shadow(0 1px 0 rgba(255, 255, 255, 0.65));
}

.vertical-directory-card-body {
  display: grid;
  gap: 4px;
}

.vertical-directory-card-body strong {
  color: #0d3a79;
  font-size: 0.98rem;
}

.vertical-directory-card-body span {
  color: var(--text-soft);
  font-size: 0.82rem;
  line-height: 1.4;
}

.vertical-directory-card-meta {
  position: absolute;
  top: 24px;
  right: 24px;
  min-width: 34px;
  height: 34px;
  border-radius: 999px;
  padding: 0 8px;
  background: rgba(255, 255, 255, 0.92);
  border: 1px solid #d7e5ff;
  color: #0a4c7c;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 0.76rem;
  font-weight: 900;
}

.actions {
  margin-top: 14px;
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
}

.btn {
  border: 0;
  border-radius: 11px;
  padding: 9px 12px;
  font-size: 0.84rem;
  font-weight: 800;
  cursor: pointer;
  text-decoration: none;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  transition: transform 0.12s ease, opacity 0.12s ease;
}

.btn:hover {
  transform: translateY(-1px);
}

.btn:active {
  transform: translateY(0);
}

.btn:disabled,
.btn.is-submitting {
  cursor: wait;
  opacity: 0.78;
  pointer-events: none;
  transform: none;
}

.submit-spinner {
  width: 1rem;
  height: 1rem;
  margin-right: 0.55rem;
  border: 2px solid currentColor;
  border-right-color: transparent;
  border-radius: 999px;
  display: inline-block;
  animation: submitSpinnerRotate 0.75s linear infinite;
}

@keyframes submitSpinnerRotate {
  to {
    transform: rotate(360deg);
  }
}

.btn svg {
  width: 18px;
  height: 18px;
  display: inline-block;
  fill: currentColor;
}

.btn-icon {
  gap: 6px;
}

.btn-label {
  line-height: 1;
  white-space: nowrap;
}

.nav-action {
  position: relative;
}

.nav-mode-icons .nav-action {
  width: 40px;
  height: 40px;
  padding: 0;
}

.nav-mode-icons .nav-action .btn-label {
  display: none;
}

.nav-mode-labels .nav-action {
  padding: 9px 12px;
}

@media (max-width: 759px) {
  body.has-client-bottom-nav {
    --client-bottom-safe-area: env(safe-area-inset-bottom);
  }

  body.has-client-bottom-nav.is-native-android-app {
    --client-bottom-safe-area: 0px;
  }

  .publication-choice-grid {
    grid-template-columns: 1fr;
  }

  body.has-client-bottom-nav .container {
    padding-bottom: calc(112px + var(--client-bottom-safe-area));
  }

  body:not(.nav-mode-labels) .nav-action {
    width: 40px;
    height: 40px;
    padding: 0;
  }

  body:not(.nav-mode-labels) .nav-action .btn-label {
    display: none;
  }

  body.has-client-bottom-nav .topbar-actions .nav-action-home,
  body.has-client-bottom-nav .topbar-actions .nav-action-cart {
    display: none;
  }
}

.btn-icon-only {
  width: 40px;
  height: 40px;
  padding: 0;
  position: relative;
}

.btn-cart-icon {
  overflow: visible;
}

.btn-cart-glyph {
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

.btn-cart-badge {
  position: absolute;
  top: -7px;
  right: -9px;
  min-width: 18px;
  height: 18px;
  padding: 0 4px;
  border-radius: 999px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 0.62rem;
  font-weight: 800;
  background: var(--client-accent);
  color: var(--client-accent-ink);
  border: 1px solid #fff;
}

.client-bottom-nav {
  display: none;
}

.client-mini-cart {
  display: none;
}

.client-mini-cart-tab {
  display: none;
}

.client-back-to-top {
  --client-back-to-top-bottom: 24px;
  position: fixed;
  right: max(22px, env(safe-area-inset-right));
  bottom: var(--client-back-to-top-bottom);
  z-index: 104;
  width: 40px;
  height: 40px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 0;
  border: 1px solid rgba(255, 255, 255, 0.76);
  border-radius: 14px;
  color: #ffffff;
  background:
    radial-gradient(circle at 24% 18%, rgba(255, 255, 255, 0.24), transparent 34%),
    linear-gradient(145deg, #0054b8, var(--brand-blue));
  box-shadow: 0 12px 26px rgba(0, 43, 115, 0.25);
  opacity: 0;
  visibility: hidden;
  transform: translateY(10px) scale(0.92);
  pointer-events: none;
  cursor: pointer;
  transition:
    bottom 0.2s ease,
    opacity 0.18s ease,
    visibility 0.18s ease,
    transform 0.18s ease,
    background 0.18s ease,
    box-shadow 0.18s ease;
  -webkit-tap-highlight-color: transparent;
}

.client-back-to-top.is-visible {
  opacity: 1;
  visibility: visible;
  transform: translateY(0) scale(1);
  pointer-events: auto;
}

.client-back-to-top:hover,
.client-back-to-top:focus-visible {
  transform: translateY(-2px) scale(1);
  box-shadow: 0 16px 30px rgba(0, 43, 115, 0.32);
}

.client-back-to-top:active {
  transform: translateY(0) scale(0.95);
}

.client-back-to-top svg {
  width: 19px;
  height: 19px;
  fill: none;
  stroke: currentColor;
  stroke-width: 2.2;
  stroke-linecap: round;
  stroke-linejoin: round;
}

body.customer-menu-open .client-back-to-top {
  opacity: 0;
  visibility: hidden;
  transform: translateY(10px) scale(0.92);
  pointer-events: none;
}

@media (max-width: 759px) {
  .client-back-to-top {
    right: max(14px, env(safe-area-inset-right));
    width: 38px;
    height: 38px;
    border-radius: 13px;
  }

  .client-bottom-nav {
    position: fixed;
    right: 0;
    bottom: 0;
    left: 0;
    z-index: 105;
    display: flex;
    justify-content: center;
    padding: 0 12px calc(10px + var(--client-bottom-safe-area));
    pointer-events: none;
  }

  .client-bottom-nav__shell {
    width: min(430px, 100%);
    min-height: 72px;
    display: grid;
    grid-template-columns: 1fr 1fr 1.18fr 1fr 1fr;
    align-items: end;
    gap: 4px;
    padding: 8px 8px 9px;
    border: 1px solid rgba(0, 43, 115, 0.13);
    border-radius: 24px;
    background:
      linear-gradient(180deg, rgba(255, 255, 255, 0.98), rgba(245, 250, 255, 0.96));
    box-shadow: 0 20px 42px rgba(0, 24, 69, 0.2);
    -webkit-backdrop-filter: blur(14px);
    backdrop-filter: blur(14px);
    pointer-events: auto;
  }

  .client-bottom-nav__item {
    position: relative;
    min-width: 0;
    min-height: 54px;
    display: inline-flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 4px;
    border-radius: 17px;
    color: #61769f;
    text-decoration: none;
    font-size: 0.67rem;
    font-weight: 800;
    line-height: 1.05;
    transition: color 0.18s ease, background 0.18s ease, transform 0.18s ease, box-shadow 0.18s ease;
  }

  .client-bottom-nav__item:hover {
    color: var(--brand-blue);
    background: rgba(0, 43, 115, 0.06);
  }

  .client-bottom-nav__item.is-active:not(.client-bottom-nav__item-cart) {
    color: var(--brand-blue);
    background: rgba(0, 43, 115, 0.08);
  }

  .client-bottom-nav__icon,
  .client-bottom-nav__cart-icon {
    width: 28px;
    height: 28px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 12px;
  }

  .client-bottom-nav__icon svg,
  .client-bottom-nav__cart-icon svg {
    width: 20px;
    height: 20px;
    fill: currentColor;
  }

  .client-bottom-nav__label {
    display: block;
    max-width: 100%;
    overflow: hidden;
    text-align: center;
    text-overflow: ellipsis;
    white-space: nowrap;
  }

  .client-bottom-nav__new-badge {
    position: absolute;
    top: 1px;
    right: 1px;
    min-width: 30px;
    padding: 3px 5px;
    border: 1px solid rgba(255, 255, 255, 0.9);
    border-radius: 999px;
    background: var(--brand-blue);
    color: #ffffff;
    font-size: 0.48rem;
    font-weight: 900;
    line-height: 1;
    text-align: center;
    box-shadow: 0 5px 12px var(--client-accent-glow);
    pointer-events: none;
  }

  .client-bottom-nav__new-badge[hidden] {
    display: none;
  }

  .client-bottom-nav__item-cart {
    min-height: 66px;
    margin-top: -18px;
    color: #ffffff;
    border-radius: 22px;
    background:
      radial-gradient(circle at 20% 12%, rgba(255, 255, 255, 0.22), transparent 30%),
      linear-gradient(135deg, #004094 0%, var(--brand-blue) 62%, #001c4c 100%);
    box-shadow: 0 16px 30px rgba(0, 43, 115, 0.32);
  }

  .client-bottom-nav__item-cart:hover,
  .client-bottom-nav__item-cart.is-active {
    color: #ffffff;
    transform: translateY(-2px);
    background:
      radial-gradient(circle at 20% 12%, rgba(255, 255, 255, 0.25), transparent 30%),
      linear-gradient(135deg, #0054bb 0%, var(--brand-blue) 62%, #001c4c 100%);
    box-shadow: 0 20px 36px rgba(0, 43, 115, 0.38);
  }

  .client-bottom-nav__cart-icon {
    position: relative;
    width: 34px;
    height: 34px;
    border-radius: 15px;
    background: rgba(255, 255, 255, 0.14);
  }

  .client-bottom-nav__badge {
    position: absolute;
    top: -7px;
    right: -8px;
    min-width: 19px;
    height: 19px;
    padding: 0 5px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 999px;
    border: 2px solid #ffffff;
    background: var(--client-accent);
    color: var(--client-accent-ink);
    font-size: 0.62rem;
    font-weight: 900;
    box-shadow: 0 6px 16px rgba(245, 124, 0, 0.26);
  }

  body.customer-menu-open .client-bottom-nav {
    visibility: hidden;
    opacity: 0;
    transform: translateY(18px);
    pointer-events: none;
  }

  body.has-visible-client-mini-cart .container {
    padding-bottom: calc(168px + var(--client-bottom-safe-area));
  }

  body.has-client-bottom-nav .app-toast {
    bottom: calc(98px + var(--client-bottom-safe-area));
  }

  body.has-visible-client-mini-cart .app-toast {
    bottom: calc(164px + var(--client-bottom-safe-area));
  }

  .client-mini-cart-tab {
    position: fixed;
    left: 50%;
    bottom: calc(80px + var(--client-bottom-safe-area));
    z-index: 107;
    width: 34px;
    height: 20px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border: 1px solid rgba(0, 43, 115, 0.16);
    border-radius: 999px;
    color: var(--brand-blue);
    background: rgba(255, 255, 255, 0.96);
    box-shadow: 0 10px 22px rgba(0, 24, 69, 0.16);
    font-family: inherit;
    font-size: 1rem;
    font-weight: 900;
    line-height: 1;
    opacity: 0;
    transform: translate(-50%, 8px);
    pointer-events: none;
    cursor: pointer;
    transition: opacity 0.18s ease, transform 0.18s ease, bottom 0.18s ease;
    -webkit-tap-highlight-color: transparent;
  }

  .client-mini-cart-tab.is-visible {
    opacity: 1;
    transform: translate(-50%, 0);
    pointer-events: auto;
  }

  body.has-visible-client-mini-cart .client-mini-cart-tab {
    bottom: calc(150px + var(--client-bottom-safe-area));
  }

  .client-mini-cart {
    position: fixed;
    right: 0;
    bottom: calc(88px + var(--client-bottom-safe-area));
    left: 0;
    z-index: 106;
    display: flex;
    justify-content: center;
    padding: 0 12px;
    opacity: 0;
    transform: translateY(16px) scale(0.98);
    pointer-events: none;
    transition: opacity 0.18s ease, transform 0.18s ease;
  }

  .client-mini-cart.is-visible {
    opacity: 1;
    transform: translateY(0) scale(1);
    pointer-events: auto;
  }

  .client-mini-cart__link {
    width: min(430px, 100%);
    min-height: 58px;
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;
    align-items: center;
    gap: 10px;
    padding: 9px 10px 9px 12px;
    border: 1px solid rgba(0, 43, 115, 0.14);
    border-radius: 20px;
    color: var(--brand-blue);
    text-decoration: none;
    background:
      radial-gradient(circle at 8% 20%, rgba(0, 191, 166, 0.13), transparent 34%),
      linear-gradient(180deg, rgba(255, 255, 255, 0.98), rgba(244, 249, 255, 0.96));
    box-shadow: 0 18px 38px rgba(0, 24, 69, 0.2);
    -webkit-backdrop-filter: blur(16px);
    backdrop-filter: blur(16px);
  }

  .client-mini-cart__icon {
    width: 38px;
    height: 38px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 15px;
    color: #005f8f;
    background:
      linear-gradient(135deg, rgba(0, 191, 166, 0.16), rgba(220, 247, 255, 0.96));
    border: 1px solid rgba(0, 191, 166, 0.22);
  }

  .client-mini-cart__icon svg {
    width: 21px;
    height: 21px;
    fill: none;
    stroke: currentColor;
    stroke-width: 1.8;
    stroke-linecap: round;
    stroke-linejoin: round;
  }

  .client-mini-cart__copy {
    min-width: 0;
    display: grid;
    gap: 1px;
  }

  .client-mini-cart__copy span {
    color: #587096;
    font-size: 0.68rem;
    font-weight: 800;
  }

  .client-mini-cart__copy strong {
    min-width: 0;
    overflow: hidden;
    color: #002b73;
    font-size: 0.88rem;
    font-weight: 900;
    line-height: 1.15;
    text-overflow: ellipsis;
    white-space: nowrap;
  }

  .client-mini-cart__cta {
    min-height: 36px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0 12px;
    border-radius: 14px;
    color: #ffffff;
    background: var(--brand-blue);
    box-shadow: 0 10px 20px rgba(0, 43, 115, 0.24);
    font-size: 0.74rem;
    font-weight: 900;
    white-space: nowrap;
  }

  .client-mini-cart.is-bumping .client-mini-cart__link {
    animation: clientMiniCartBump 0.34s ease both;
  }

  body.customer-menu-open.has-visible-client-mini-cart .container {
    padding-bottom: calc(112px + var(--client-bottom-safe-area));
  }

  body.customer-menu-open .client-mini-cart {
    opacity: 0;
    transform: translateY(18px) scale(0.98);
    pointer-events: none;
  }

  body.customer-menu-open .client-mini-cart-tab {
    opacity: 0;
    transform: translate(-50%, 12px);
    pointer-events: none;
  }
}

@keyframes clientMiniCartBump {
  0% {
    transform: translateY(0) scale(1);
  }

  45% {
    transform: translateY(-3px) scale(1.015);
  }

  100% {
    transform: translateY(0) scale(1);
  }
}

@media (prefers-reduced-motion: reduce) {
  .client-mini-cart,
  .client-mini-cart-tab,
  .client-back-to-top {
    transition: none;
  }

  .client-mini-cart.is-bumping .client-mini-cart__link {
    animation: none;
  }
}

body.theme-dark .client-bottom-nav__shell {
  border-color: rgba(120, 154, 217, 0.24);
  background:
    linear-gradient(180deg, rgba(14, 30, 62, 0.96), rgba(9, 20, 45, 0.97));
  box-shadow: 0 22px 44px rgba(1, 5, 17, 0.52);
}

body.theme-dark .client-back-to-top {
  border-color: rgba(143, 177, 232, 0.4);
  background:
    radial-gradient(circle at 24% 18%, rgba(255, 255, 255, 0.17), transparent 34%),
    linear-gradient(145deg, #1767bd, #0b2857);
  box-shadow: 0 14px 30px rgba(1, 5, 17, 0.46);
}

body.theme-dark .client-bottom-nav__item {
  color: #9fb6db;
}

body.theme-dark .client-bottom-nav__item:hover,
body.theme-dark .client-bottom-nav__item.is-active:not(.client-bottom-nav__item-cart) {
  color: #ffffff;
  background: rgba(120, 154, 217, 0.14);
}

body.theme-dark .client-mini-cart__link {
  border-color: rgba(120, 154, 217, 0.24);
  color: #eaf2ff;
  background:
    radial-gradient(circle at 8% 20%, rgba(0, 191, 166, 0.17), transparent 36%),
    linear-gradient(180deg, rgba(14, 30, 62, 0.96), rgba(9, 20, 45, 0.97));
  box-shadow: 0 22px 44px rgba(1, 5, 17, 0.52);
}

body.theme-dark .client-mini-cart-tab {
  border-color: rgba(120, 154, 217, 0.28);
  color: #eaf2ff;
  background: rgba(14, 30, 62, 0.96);
  box-shadow: 0 14px 28px rgba(1, 5, 17, 0.42);
}

body.theme-dark .client-mini-cart__icon {
  color: #8df5e7;
  background: rgba(0, 191, 166, 0.14);
  border-color: rgba(0, 191, 166, 0.28);
}

body.theme-dark .client-mini-cart__copy span {
  color: #9fb6db;
}

body.theme-dark .client-mini-cart__copy strong {
  color: #ffffff;
}

.btn-primary {
  background: var(--brand-blue);
  color: #fff;
}

.btn-success {
  background: var(--brand-green);
  color: #003833;
}

.btn-outline {
  background: #fff;
  color: var(--brand-blue);
  border: 1px solid #bfd6ff;
}

.input,
select.input,
textarea.input {
  width: 100%;
  border: 1px solid #c9dbff;
  border-radius: 11px;
  padding: 10px 11px;
  background: #fff;
  color: var(--text-main);
  font-size: 0.9rem;
}

.input:focus,
select.input:focus,
textarea.input:focus {
  outline: none;
  border-color: #84a7e8;
  box-shadow: 0 0 0 4px rgba(0, 43, 115, 0.12);
}

.alert {
  border-radius: 12px;
  margin: 8px 0;
  padding: 10px 12px;
  font-size: 0.86rem;
}

.alert-error {
  background: #fee2e2;
  color: #991b1b;
  border: 1px solid #fecaca;
}

.alert-success {
  background: #dcfce7;
  color: #166534;
  border: 1px solid #bbf7d0;
}

.alert-warning {
  background: #fff8dc;
  color: #7c4a00;
  border: 1px solid #f6dfa0;
}

.alert-link {
  margin-left: 8px;
  font-weight: 700;
  color: #0a4f96;
  text-decoration: underline;
}

.alert-link:hover {
  color: #07386e;
}

.badge {
  display: inline-flex;
  align-items: center;
  border-radius: 999px;
  padding: 4px 8px;
  font-size: 0.7rem;
  font-weight: 800;
  color: #075e53;
  background: #cbfbf3;
  border: 1px solid #9ee8de;
}

.badge-with-icon {
  gap: 6px;
  padding-left: 7px;
  padding-right: 9px;
}

.badge-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 13px;
  height: 13px;
  flex-shrink: 0;
}

.badge-icon svg {
  width: 13px;
  height: 13px;
  stroke: currentColor;
  fill: none;
  stroke-width: 1.9;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.badge-text {
  line-height: 1;
}

.pill {
  display: inline-flex;
  align-items: center;
  border-radius: 999px;
  padding: 4px 9px;
  font-size: 0.68rem;
  font-weight: 800;
  color: #0a4f96;
  background: #dcedff;
  border: 1px solid #b8d8ff;
}

.service-tags {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}

.business-card {
  position: relative;
  overflow: hidden;
  transition: transform 0.15s ease, box-shadow 0.15s ease;
}

.business-card:hover {
  transform: translateY(-2px);
  box-shadow: 0 14px 28px rgba(0, 24, 69, 0.12);
}

.favorite-toggle-form {
  display: inline-flex;
}

.business-card .favorite-toggle-form,
.product-card .favorite-toggle-form-product {
  position: absolute;
  top: 10px;
  right: 10px;
  z-index: 2;
}

.favorite-toggle-form-inline {
  position: static;
  margin-top: 8px;
}

.favorite-toggle-btn {
  width: 36px;
  height: 36px;
  border: 1px solid #c8dcff;
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.92);
  color: #194984;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  transition: transform 0.14s ease, box-shadow 0.2s ease, border-color 0.2s ease, background 0.2s ease;
  backdrop-filter: blur(4px);
}

.favorite-toggle-btn:hover {
  transform: translateY(-1px);
  border-color: #7ea8ec;
  box-shadow: 0 8px 18px rgba(0, 43, 115, 0.16);
}

.favorite-toggle-btn:focus-visible {
  outline: none;
  box-shadow: 0 0 0 4px rgba(0, 43, 115, 0.18);
}

.favorite-toggle-btn.is-active {
  border-color: var(--client-accent-border);
  background: var(--client-accent-soft);
  color: var(--client-accent-strong);
  box-shadow: 0 10px 20px var(--client-accent-glow);
}

.favorite-toggle-icon {
  width: 18px;
  height: 18px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

.favorite-toggle-icon svg {
  width: 18px;
  height: 18px;
  stroke: currentColor;
  stroke-width: 1.8;
  fill: none;
}

.favorite-toggle-btn.is-active .favorite-toggle-icon svg {
  fill: currentColor;
}

.hero-favorite-btn {
  width: 40px;
  height: 40px;
}

.business-like-row,
.business-hero-social-proof {
  display: flex;
  align-items: center;
  min-width: 0;
}

.business-like-row {
  margin-top: 10px;
}

.business-hero-social-proof {
  margin-top: 8px;
}

.business-like-control {
  display: inline-flex;
  align-items: center;
  min-width: 0;
  min-height: 34px;
  margin: 0;
  border: 1px solid #c9dcf8;
  border-radius: 999px;
  color: #28558e;
  background: rgba(247, 251, 255, 0.94);
  box-shadow: 0 6px 16px rgba(0, 43, 115, 0.07);
  transition: border-color 0.18s ease, color 0.18s ease, background 0.18s ease, box-shadow 0.18s ease;
}

.business-like-button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  min-width: 0;
  min-height: 34px;
  padding: 6px 12px;
  border: 0;
  border-radius: inherit;
  color: inherit;
  background: transparent;
  font: inherit;
  font-size: 0.78rem;
  font-weight: 800;
  line-height: 1;
  cursor: pointer;
}

.business-like-display {
  gap: 6px;
  padding: 6px 12px;
  font-size: 0.78rem;
  font-weight: 800;
  line-height: 1;
}

.business-like-button:hover {
  color: var(--client-accent-strong);
}

.business-like-button:focus-visible {
  outline: 3px solid var(--client-accent-glow);
  outline-offset: 2px;
}

.business-like-button:disabled {
  cursor: wait;
  opacity: 0.62;
}

.business-like-control.is-active {
  border-color: var(--client-accent-border);
  color: var(--client-accent-strong);
  background: var(--client-accent-soft);
  box-shadow: 0 8px 18px var(--client-accent-glow);
}

.business-like-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 16px;
  height: 16px;
  flex: 0 0 16px;
}

.business-like-icon svg {
  width: 16px;
  height: 16px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.7;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.business-like-control.is-active .business-like-icon svg {
  fill: currentColor;
}

.business-like-label,
.business-like-count {
  white-space: nowrap;
}

.business-like-separator {
  opacity: 0.55;
}

.business-like-control-hero,
.business-like-control-hero .business-like-button {
  min-height: 38px;
}

.business-like-control-hero .business-like-button,
.business-like-control-hero.business-like-display {
  padding: 8px 14px;
  font-size: 0.84rem;
}

.business-verified-badge {
  --verified-navy: #071b3d;
  --verified-gold: #ffd77a;
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 40px;
  height: 40px;
  flex: 0 0 auto;
  padding: 0;
  border: 2px solid color-mix(in srgb, var(--verified-gold) 86%, #ffffff);
  border-radius: 999px;
  color: var(--verified-gold);
  background:
    radial-gradient(circle at 34% 24%, rgba(255, 255, 255, 0.22), transparent 34%),
    linear-gradient(145deg, #0f2f66 0%, var(--verified-navy) 76%);
  box-shadow: 0 10px 22px rgba(3, 13, 32, 0.26), inset 0 0 0 1px rgba(255, 255, 255, 0.16);
  cursor: pointer;
  transition: transform 0.18s ease, box-shadow 0.18s ease;
}

.business-verified-badge:hover {
  transform: translateY(-1px);
  box-shadow: 0 13px 26px rgba(3, 13, 32, 0.31), inset 0 0 0 1px rgba(255, 255, 255, 0.2);
}

.business-verified-badge:focus-visible {
  outline: 3px solid rgba(255, 215, 122, 0.35);
  outline-offset: 3px;
}

.business-verified-badge-icon,
.business-verified-badge svg {
  display: block;
  width: 28px;
  height: 28px;
}

.business-verified-badge .verified-ring {
  fill: none;
  stroke: currentColor;
  stroke-width: 2.8;
}

.business-verified-badge .verified-shield,
.business-verified-badge .verified-check {
  fill: none;
  stroke: currentColor;
  stroke-width: 4;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.business-verified-badge-hero {
  width: 38px;
  height: 38px;
}

.business-verified-modal-backdrop[hidden] {
  display: none;
}

.business-verified-modal-backdrop {
  position: fixed;
  inset: 0;
  z-index: 1200;
  display: grid;
  place-items: center;
  padding: 22px;
  background: rgba(5, 18, 42, 0.52);
  backdrop-filter: blur(10px);
}

.business-verified-modal {
  position: relative;
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  gap: 18px;
  width: min(440px, 100%);
  padding: 24px;
  border: 1px solid rgba(255, 215, 122, 0.34);
  border-radius: 28px;
  background:
    radial-gradient(circle at top left, rgba(255, 215, 122, 0.12), transparent 34%),
    linear-gradient(145deg, rgba(255, 255, 255, 0.98), rgba(246, 250, 255, 0.98));
  box-shadow: 0 24px 70px rgba(1, 12, 32, 0.28);
}

.business-verified-modal-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 58px;
  height: 58px;
  border-radius: 20px;
  color: #b88619;
  background: linear-gradient(145deg, rgba(255, 239, 198, 0.9), rgba(255, 249, 235, 0.9));
}

.business-verified-modal-icon svg {
  width: 40px;
  height: 40px;
}

.business-verified-modal-icon .verified-ring {
  fill: none;
  stroke: currentColor;
  stroke-width: 3;
}

.business-verified-modal-icon .verified-shield,
.business-verified-modal-icon .verified-check {
  fill: none;
  stroke: currentColor;
  stroke-width: 4;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.business-verified-modal h2 {
  margin: 0 32px 8px 0;
  color: var(--brand-blue);
  font-size: 1.26rem;
  line-height: 1.14;
}

.business-verified-modal p {
  margin: 0;
  color: #5a6d91;
  font-size: 0.98rem;
  line-height: 1.46;
}

.business-verified-modal-close {
  position: absolute;
  top: 14px;
  right: 14px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 34px;
  height: 34px;
  border: 0;
  border-radius: 999px;
  color: #687796;
  background: rgba(226, 234, 246, 0.95);
  font-size: 1.4rem;
  font-weight: 800;
  line-height: 1;
  cursor: pointer;
}

body.business-verified-modal-open {
  overflow: hidden;
}

.business-head {
  display: flex;
  align-items: center;
  gap: 10px;
}

.business-head-content {
  min-width: 0;
}

.business-head-status {
  margin-left: auto;
  flex-shrink: 0;
  align-self: flex-start;
}

.business-logo-wrap {
  position: relative;
  width: 54px;
  height: 54px;
  flex-shrink: 0;
}

.business-logo-wrap .business-logo {
  width: 100%;
  height: 100%;
  margin-bottom: 0;
}

.business-logo-placeholder {
  display: inline-flex;
  border-style: dashed;
  border-color: #c6d8f7;
  background: linear-gradient(145deg, #f3f7ff 0%, #e4eeff 100%);
}

.business-logo-status-dot {
  position: absolute;
  right: -3px;
  bottom: -3px;
  width: 14px;
  height: 14px;
  border-radius: 999px;
  border: 2px solid #ffffff;
  background: #00bfa6;
  box-shadow: 0 0 0 2px rgba(0, 191, 166, 0.2);
  pointer-events: none;
}

.business-logo-status-dot.status-outside {
  background: #f0b429;
  box-shadow: 0 0 0 2px rgba(240, 180, 41, 0.22);
}

.business-logo-status-dot.status-paused {
  background: #98a6bb;
  box-shadow: 0 0 0 2px rgba(152, 166, 187, 0.2);
}

.operational-indicator {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  border-radius: 999px;
  border: 1px solid #cfe0ff;
  background: #f2f7ff;
  padding: 4px 9px;
  font-size: 0.67rem;
  font-weight: 800;
  color: #173f79;
  letter-spacing: 0.01em;
}

.operational-dot {
  width: 8px;
  height: 8px;
  border-radius: 999px;
  background: #00bfa6;
  box-shadow: 0 0 0 2px rgba(0, 191, 166, 0.18);
  flex-shrink: 0;
}

.operational-indicator.is-outside {
  border-color: #f4dba1;
  background: #fff6df;
  color: #805b0e;
}

.operational-indicator.is-outside .operational-dot {
  background: #f0b429;
  box-shadow: 0 0 0 2px rgba(240, 180, 41, 0.22);
}

.operational-indicator.is-paused {
  border-color: #dbe1ea;
  background: #f4f6fa;
  color: #627089;
}

.operational-indicator.is-paused .operational-dot {
  background: #97a6bb;
  box-shadow: 0 0 0 2px rgba(151, 166, 187, 0.16);
}

.business-logo {
  width: 54px;
  height: 54px;
  border-radius: 13px;
  object-fit: cover;
  border: 1px solid #c8dbff;
  background: #fff;
  flex-shrink: 0;
}

.business-logo-lg {
  width: 86px;
  height: 86px;
  border-radius: 18px;
  object-fit: cover;
  border: 2px solid rgba(255, 255, 255, 0.9);
  box-shadow: 0 8px 20px rgba(0, 0, 0, 0.16);
  background: #fff;
  flex-shrink: 0;
}

.business-cover {
  width: 100%;
  height: 130px;
  object-fit: cover;
  border-radius: 12px;
  border: 1px solid #d7e6ff;
  margin-bottom: 10px;
}

.business-cover-hero {
  height: 200px;
  border-radius: 18px;
  margin-bottom: 0;
}

.business-cover-placeholder {
  display: flex;
  align-items: center;
  justify-content: center;
  background:
    radial-gradient(circle at top right, rgba(255, 255, 255, 0.18), transparent 28%),
    linear-gradient(135deg, #002b73 0%, #0d5ea3 52%, #00bfa6 100%);
  overflow: hidden;
}

.business-cover-placeholder-initials {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 68px;
  height: 68px;
  padding: 0 18px;
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.14);
  border: 1px solid rgba(255, 255, 255, 0.24);
  box-shadow: 0 14px 28px rgba(0, 0, 0, 0.18);
  color: #fff;
  font-size: 1.35rem;
  font-weight: 800;
  letter-spacing: 0.08em;
}

.business-cover-placeholder-hero {
  border-radius: 18px;
}

.business-cover-placeholder-initials-hero {
  min-width: 88px;
  height: 88px;
  padding: 0 24px;
  font-size: 2rem;
}

.business-hero {
  display: grid;
  gap: 12px;
}

.business-page-top {
  margin-bottom: 2px;
}

.business-public-hero {
  position: relative;
  padding: 12px;
  border: 1px solid rgba(0, 43, 115, 0.1);
  border-radius: 28px;
  background:
    radial-gradient(circle at 18% 0%, rgba(255, 255, 255, 0.92), transparent 34%),
    linear-gradient(145deg, color-mix(in srgb, var(--facade-a, #003b8d) 10%, #ffffff), color-mix(in srgb, var(--facade-c, #22d3c2) 18%, #ffffff));
  box-shadow: 0 20px 42px rgba(0, 43, 115, 0.1);
  overflow: hidden;
}

.business-public-hero::before {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  background:
    radial-gradient(circle at 92% 10%, color-mix(in srgb, var(--facade-c, #22d3c2) 32%, transparent), transparent 28%),
    linear-gradient(120deg, color-mix(in srgb, var(--facade-a, #003b8d) 10%, transparent), transparent 48%);
  opacity: 0.9;
}

.business-public-hero > * {
  position: relative;
  z-index: 1;
}

.business-public-hero .business-cover-hero {
  border-color: color-mix(in srgb, var(--facade-a, #003b8d) 18%, #d7e6ff);
  box-shadow: 0 14px 30px rgba(0, 43, 115, 0.12);
}

.business-public-hero .business-cover-placeholder {
  background:
    radial-gradient(circle at top right, rgba(255, 255, 255, 0.22), transparent 30%),
    linear-gradient(135deg, var(--facade-a, #003b8d) 0%, var(--facade-b, #0ab9aa) 58%, var(--facade-c, #22d3c2) 100%);
}

.business-public-hero .business-hero-body {
  padding: 14px;
  border: 1px solid color-mix(in srgb, var(--facade-a, #003b8d) 14%, #d7e6ff);
  border-radius: 24px;
  background: rgba(255, 255, 255, 0.88);
  box-shadow: 0 12px 28px rgba(0, 43, 115, 0.08);
}

.business-public-hero .brand-tag {
  border-color: color-mix(in srgb, var(--facade-b, #0ab9aa) 50%, #ffcf94);
  background: color-mix(in srgb, var(--facade-c, #22d3c2) 16%, #fff6e7);
  color: color-mix(in srgb, var(--facade-a, #003b8d) 70%, #ef7d00);
}

.business-public-hero .business-logo-lg {
  border-color: color-mix(in srgb, var(--facade-c, #22d3c2) 38%, #ffffff);
  box-shadow: 0 12px 24px color-mix(in srgb, var(--facade-a, #003b8d) 20%, transparent);
}

.business-public-hero-food .business-cover-hero {
  border-radius: 26px 26px 18px 18px;
}

.business-public-hero-boutique .business-cover-hero {
  border-radius: 34px;
}

.business-public-hero-minimarket .business-cover-hero {
  border-radius: 18px 18px 26px 26px;
}

.business-public-hero-workshop .business-cover-hero,
.business-public-hero-service .business-cover-hero {
  border-radius: 16px;
}

.business-public-hero-professional .business-hero-body,
.business-public-hero-company .business-hero-body {
  border-radius: 18px;
}

.business-public-hero-premium-luxury,
.business-public-hero-premium-neon,
.business-public-hero-premium-showcase {
  border-color: color-mix(in srgb, var(--facade-c, #22d3c2) 42%, #c6dbff);
  box-shadow:
    0 26px 58px color-mix(in srgb, var(--facade-a, #003b8d) 18%, transparent),
    0 0 0 1px color-mix(in srgb, var(--facade-c, #22d3c2) 18%, transparent);
}

.business-public-hero-premium-luxury .business-hero-body,
.business-public-hero-premium-neon .business-hero-body,
.business-public-hero-premium-showcase .business-hero-body {
  border-color: color-mix(in srgb, var(--facade-c, #22d3c2) 34%, #d7e6ff);
  background: rgba(255, 255, 255, 0.92);
}

.business-public-hero-premium-neon {
  background:
    radial-gradient(circle at 86% 12%, color-mix(in srgb, var(--facade-c, #22d3c2) 24%, transparent), transparent 28%),
    linear-gradient(145deg, #06132f, color-mix(in srgb, var(--facade-a, #003b8d) 46%, #101b35));
}

.business-public-hero-premium-neon .business-hero-body {
  background: rgba(9, 24, 54, 0.9);
}

.business-public-hero-premium-neon h1,
.business-public-hero-premium-neon .lead {
  color: #f4f9ff;
}

.business-public-hero-premium-marble,
.business-public-hero-premium-aurora,
.business-public-hero-premium-velvet,
.business-public-hero-premium-tech-grid,
.business-public-hero-premium-copper,
.business-public-hero-premium-ocean,
.business-public-hero-premium-midnight,
.business-public-hero-premium-candy,
.business-public-hero-premium-industrial,
.business-public-hero-premium-garden {
  border-color: var(--premium-hero-border, color-mix(in srgb, var(--facade-c, #22d3c2) 42%, #c6dbff));
  background: var(--premium-hero-bg, linear-gradient(145deg, var(--facade-a, #003b8d), var(--facade-b, #00bfa6)));
  box-shadow:
    0 26px 58px var(--premium-hero-shadow, color-mix(in srgb, var(--facade-a, #003b8d) 18%, transparent)),
    0 0 0 1px var(--premium-hero-line, color-mix(in srgb, var(--facade-c, #22d3c2) 18%, transparent));
}

.business-public-hero-premium-marble .business-hero-body,
.business-public-hero-premium-aurora .business-hero-body,
.business-public-hero-premium-velvet .business-hero-body,
.business-public-hero-premium-tech-grid .business-hero-body,
.business-public-hero-premium-copper .business-hero-body,
.business-public-hero-premium-ocean .business-hero-body,
.business-public-hero-premium-midnight .business-hero-body,
.business-public-hero-premium-candy .business-hero-body,
.business-public-hero-premium-industrial .business-hero-body,
.business-public-hero-premium-garden .business-hero-body {
  border-color: var(--premium-hero-body-border, color-mix(in srgb, var(--facade-c, #22d3c2) 34%, #d7e6ff));
  background: var(--premium-hero-body-bg, rgba(255, 255, 255, 0.9));
}

.business-public-hero-premium-aurora h1,
.business-public-hero-premium-aurora .lead,
.business-public-hero-premium-tech-grid h1,
.business-public-hero-premium-tech-grid .lead,
.business-public-hero-premium-midnight h1,
.business-public-hero-premium-midnight .lead,
.business-public-hero-premium-industrial h1,
.business-public-hero-premium-industrial .lead {
  color: #f4f9ff;
}

.business-public-hero-premium-marble {
  --premium-hero-bg: linear-gradient(135deg, #fff7e2, #d7b46e 52%, color-mix(in srgb, var(--facade-a) 40%, #28324b));
  --premium-hero-border: rgba(218, 176, 92, 0.56);
}

.business-public-hero-premium-aurora {
  --premium-hero-bg: linear-gradient(125deg, #08152d, color-mix(in srgb, var(--facade-a) 62%, #02111c), #00bfa6);
  --premium-hero-body-bg: rgba(7, 25, 43, 0.82);
}

.business-public-hero-premium-velvet {
  --premium-hero-bg: linear-gradient(140deg, #3e1231, #8b326b, color-mix(in srgb, var(--facade-b) 52%, #db6da2));
  --premium-hero-border: rgba(255, 165, 215, 0.5);
}

.business-public-hero-premium-tech-grid {
  --premium-hero-bg:
    linear-gradient(rgba(95, 232, 255, 0.1) 1px, transparent 1px),
    linear-gradient(90deg, rgba(95, 232, 255, 0.1) 1px, transparent 1px),
    linear-gradient(135deg, #06142f, color-mix(in srgb, var(--facade-a) 72%, #050b18));
  --premium-hero-body-bg: rgba(4, 13, 31, 0.84);
}

.business-public-hero-premium-tech-grid {
  background-size: 28px 28px, 28px 28px, auto;
}

.business-public-hero-premium-copper {
  --premium-hero-bg: linear-gradient(135deg, #2b160b, #a75b2a 58%, #e7a15c);
  --premium-hero-border: rgba(229, 148, 74, 0.58);
}

.business-public-hero-premium-ocean {
  --premium-hero-bg: linear-gradient(135deg, #0077b6, color-mix(in srgb, var(--facade-b) 74%, #80ffea));
  --premium-hero-border: rgba(0, 154, 190, 0.36);
}

.business-public-hero-premium-midnight {
  --premium-hero-bg: linear-gradient(135deg, #070b19, color-mix(in srgb, var(--facade-a) 52%, #10172f));
  --premium-hero-body-bg: rgba(11, 18, 37, 0.86);
}

.business-public-hero-premium-candy {
  --premium-hero-bg: linear-gradient(135deg, #ff8fc8, #85e7ff 58%, #fff0a8);
  --premium-hero-border: rgba(255, 150, 212, 0.44);
}

.business-public-hero-premium-industrial {
  --premium-hero-bg:
    repeating-linear-gradient(135deg, rgba(255, 184, 76, 0.22) 0 12px, transparent 12px 24px),
    linear-gradient(135deg, #151a22, #48515f);
  --premium-hero-body-bg: rgba(21, 27, 36, 0.86);
}

.business-public-hero-premium-garden {
  --premium-hero-bg: linear-gradient(135deg, #0f7a48, color-mix(in srgb, var(--facade-b) 60%, #8ee8a7));
  --premium-hero-border: rgba(52, 168, 105, 0.38);
}

.business-hero-body {
  display: flex;
  gap: 12px;
  align-items: flex-start;
}

.business-title-row {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 10px;
  flex-wrap: wrap;
}

.business-title-actions {
  display: flex;
  flex: 0 0 auto;
  align-items: center;
  gap: 0.5rem;
}

.business-share-button {
  flex: 0 0 auto;
}

.business-operational-indicator {
  margin-top: 6px;
}

.promo-banner {
  position: relative;
  display: block;
  border-radius: 20px;
  overflow: hidden;
  border: 1px solid #c7daff;
  min-height: 140px;
  text-decoration: none;
  box-shadow: var(--shadow-strong);
}

.promo-banner img {
  width: 100%;
  height: 208px;
  object-fit: cover;
}

.promo-content {
  position: absolute;
  inset: auto 0 0 0;
  padding: 14px;
  background: linear-gradient(180deg, rgba(0, 14, 46, 0) 0%, rgba(0, 20, 63, 0.88) 72%);
  color: #fff;
}

.promo-content h2 {
  margin-top: 8px;
  color: #fff;
  font-size: 1.02rem;
}

.promo-content p {
  color: #d8e9ff;
  font-size: 0.84rem;
}

.promo-inline {
  background: linear-gradient(120deg, rgba(0, 43, 115, 0.98), rgba(0, 191, 166, 0.88));
  border-radius: 18px;
  border: 1px solid rgba(255, 255, 255, 0.28);
  padding: 14px;
  color: #fff;
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 10px;
}

.promo-inline h2 {
  margin-top: 8px;
  color: #fff;
  font-size: 1.04rem;
}

.promo-inline p {
  color: #d8e9ff;
}

.promo-inline .brand-tag {
  background: rgba(255, 255, 255, 0.92);
  border: 1px solid rgba(255, 196, 120, 0.68);
  color: var(--client-accent-strong);
  font-weight: 900;
  letter-spacing: 0.06em;
}

.hero-home,
.legacy-home-banner,
.legacy-home-featured {
  display: none !important;
}

.home-info-ticker-section {
  margin: 2px 0 12px;
}

.home-info-ticker {
  --home-info-ticker-bg: #003b8d;
  --home-info-ticker-color: #ffffff;
  display: flex;
  align-items: center;
  min-height: 36px;
  max-width: 100%;
  border-radius: 999px;
  border: 1px solid rgba(255, 255, 255, 0.24);
  background: var(--home-info-ticker-bg);
  color: var(--home-info-ticker-color);
  box-shadow: 0 12px 24px rgba(0, 43, 115, 0.12);
  overflow: hidden;
  text-decoration: none;
}

a.home-info-ticker:hover {
  color: var(--home-info-ticker-color);
  filter: brightness(1.03);
  transform: translateY(-1px);
}

.home-info-ticker__viewport {
  display: block;
  width: 100%;
  overflow: hidden;
}

.home-info-ticker__track {
  display: flex;
  align-items: center;
  justify-content: center;
  min-width: 100%;
  padding: 8px 16px;
  color: inherit;
  font-size: 0.82rem;
  font-weight: 800;
  line-height: 1.25;
  white-space: nowrap;
}

.home-info-ticker__track span {
  display: inline-block;
  color: inherit;
}

.home-info-ticker.is-scrolling .home-info-ticker__track {
  justify-content: flex-start;
  width: max-content;
  gap: 44px;
  animation: home-info-ticker-scroll 22s linear infinite;
}

@keyframes home-info-ticker-scroll {
  from {
    transform: translateX(0);
  }

  to {
    transform: translateX(calc(-50% - 22px));
  }
}

@media (prefers-reduced-motion: reduce) {
  .home-info-ticker.is-scrolling .home-info-ticker__track {
    width: 100%;
    animation: none;
    transform: none;
  }

  .home-info-ticker.is-scrolling .home-info-ticker__track span[aria-hidden="true"] {
    display: none;
  }
}

.home-banner-section {
  padding-top: 0;
}

.home-banner-carousel {
  position: relative;
  border-radius: 22px;
  overflow: hidden;
  box-shadow: var(--shadow-strong);
}

.home-banner-carousel .carousel-inner {
  position: relative;
  width: 100%;
  overflow: hidden;
}

.home-banner-carousel .carousel-item {
  position: relative;
  display: none;
  float: left;
  width: 100%;
  margin-right: -100%;
  backface-visibility: hidden;
  transition: transform 0.6s ease-in-out;
}

.home-banner-carousel .carousel-item.active,
.home-banner-carousel .carousel-item-next,
.home-banner-carousel .carousel-item-prev {
  display: block;
}

.home-banner-carousel .carousel-item-next:not(.carousel-item-start),
.home-banner-carousel .active.carousel-item-end {
  transform: translateX(100%);
}

.home-banner-carousel .carousel-item-prev:not(.carousel-item-end),
.home-banner-carousel .active.carousel-item-start {
  transform: translateX(-100%);
}

.home-banner-carousel .carousel-fade .carousel-item,
.home-banner-carousel.carousel-fade .carousel-item {
  opacity: 0;
  transform: none;
  transition-property: opacity;
}

.home-banner-carousel .carousel-fade .carousel-item.active,
.home-banner-carousel .carousel-fade .carousel-item-next.carousel-item-start,
.home-banner-carousel .carousel-fade .carousel-item-prev.carousel-item-end,
.home-banner-carousel.carousel-fade .carousel-item.active,
.home-banner-carousel.carousel-fade .carousel-item-next.carousel-item-start,
.home-banner-carousel.carousel-fade .carousel-item-prev.carousel-item-end {
  opacity: 1;
  z-index: 1;
}

.home-banner-carousel .carousel-fade .active.carousel-item-start,
.home-banner-carousel .carousel-fade .active.carousel-item-end,
.home-banner-carousel.carousel-fade .active.carousel-item-start,
.home-banner-carousel.carousel-fade .active.carousel-item-end {
  opacity: 0;
  z-index: 0;
}

.home-banner-carousel .carousel-inner,
.home-banner-slide,
.home-featured-single-cover {
  border-radius: 22px;
}

.home-banner-carousel-no-transition .carousel-item {
  transition: none !important;
}

.home-banner-slide,
.home-featured-single-cover {
  min-height: 220px;
}

.home-banner-fallback-card {
  min-height: 220px;
  background:
    radial-gradient(circle at 20% 18%, rgba(0, 191, 166, 0.22) 0%, transparent 28%),
    radial-gradient(circle at 82% 14%, rgba(245, 124, 0, 0.2) 0%, transparent 24%),
    linear-gradient(135deg, rgba(0, 43, 115, 0.98), rgba(12, 146, 168, 0.92));
}

.home-banner-indicators {
  position: static;
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 8px;
  margin: 0.5rem 0 0;
  padding: 0.075rem 0 0.175rem;
  min-height: 20px;
}

.home-banner-indicators button {
  width: 9px !important;
  height: 9px !important;
  border-radius: 999px;
  border: 0;
  background-color: rgba(255, 255, 255, 0.44) !important;
}

.home-banner-indicators .active {
  background-color: #fff !important;
}

.home-banner-control {
  position: absolute;
  z-index: 2;
  top: auto;
  bottom: -2px;
  width: 30px;
  height: 30px;
  opacity: 1;
  background: transparent !important;
  border: 0;
}

.home-banner-control-prev {
  left: auto;
  right: 40px;
}

.home-banner-control-next {
  right: 4px;
}

.home-banner-control-icon {
  width: 30px;
  height: 30px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 999px;
  background: rgba(7, 18, 44, 0.26);
  border: 1px solid rgba(255, 255, 255, 0.18);
  backdrop-filter: blur(10px);
}

.home-banner-control-icon svg {
  width: 12px;
  height: 12px;
  fill: #fff;
}

.open-food-callout {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 14px 16px;
  border-radius: 18px;
  text-decoration: none;
  color: #fff;
  border: 1px solid rgba(255, 255, 255, 0.14);
  background:
    radial-gradient(circle at top right, rgba(245, 124, 0, 0.22), transparent 42%),
    linear-gradient(135deg, rgba(0, 43, 115, 0.98), rgba(14, 121, 150, 0.94));
  box-shadow: 0 18px 34px rgba(0, 28, 84, 0.24);
}

.open-food-callout .brand-tag {
  padding: 7px 12px;
  font-size: 0.78rem;
}

.open-food-callout-copy {
  min-width: 0;
  flex: 1 1 auto;
}

.open-food-callout-copy h2 {
  margin: 6px 0 4px;
  color: #fff;
  font-size: 1.08rem;
  line-height: 1.12;
}

.open-food-callout-copy p {
  margin: 0;
  color: rgba(232, 244, 255, 0.92);
  font-size: 0.9rem;
  line-height: 1.25;
}

.open-food-callout-cta {
  flex-shrink: 0;
  white-space: nowrap;
  min-height: 38px;
  padding: 9px 14px;
  font-size: 0.9rem;
  border-radius: 12px;
  box-shadow: 0 10px 20px rgba(0, 27, 82, 0.16);
}

.home-featured-spotlight-section {
  padding-top: 8px;
}

.home-featured-spotlight-head {
  margin-bottom: 8px;
}

.home-featured-spotlight {
  width: 100%;
  min-width: 0;
}

.home-featured-spotlight-viewport {
  width: 100%;
  overflow: hidden;
  border-radius: 18px;
}

.home-featured-spotlight-track {
  display: flex;
  width: 100%;
  transform: translate3d(0, 0, 0);
  transition: transform 0.48s cubic-bezier(0.22, 0.72, 0.28, 1);
  will-change: transform;
}

.home-featured-spotlight-slide {
  flex: 0 0 100%;
  min-width: 100%;
}

.home-featured-spotlight-card {
  display: grid;
  grid-template-columns: 68px minmax(0, 1fr) 34px;
  align-items: center;
  gap: 13px;
  min-height: 98px;
  padding: 14px;
  color: #092b61;
  text-decoration: none;
  border: 1px solid #c7daf8;
  border-radius: 18px;
  background: rgba(255, 255, 255, 0.96);
  box-shadow: 0 12px 26px rgba(0, 43, 115, 0.1);
  -webkit-tap-highlight-color: transparent;
  transition: border-color 0.2s ease, box-shadow 0.2s ease, transform 0.2s ease;
}

.home-featured-spotlight-card:hover,
.home-featured-spotlight-card:focus-visible {
  color: #092b61;
  border-color: #73a8eb;
  box-shadow: 0 16px 30px rgba(0, 43, 115, 0.15);
  transform: translateY(-1px);
}

.home-featured-spotlight-card:focus-visible {
  outline: 3px solid rgba(0, 105, 214, 0.2);
  outline-offset: 2px;
}

.home-featured-spotlight-logo {
  display: inline-flex;
  width: 68px;
  height: 68px;
  align-items: center;
  justify-content: center;
  overflow: hidden;
  border: 1px solid #c7daf8;
  border-radius: 15px;
  color: #0754a6;
  background: #edf5ff;
  font-size: 1rem;
  font-weight: 900;
}

.home-featured-spotlight-logo img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.home-featured-spotlight-copy {
  display: block;
  min-width: 0;
}

.home-featured-spotlight-copy strong,
.home-featured-spotlight-copy > span {
  display: -webkit-box;
  overflow: hidden;
  -webkit-box-orient: vertical;
}

.home-featured-spotlight-copy strong {
  margin-bottom: 4px;
  color: #062c69;
  font-size: 1rem;
  font-weight: 900;
  line-height: 1.18;
  -webkit-line-clamp: 2;
}

.home-featured-spotlight-copy > span {
  color: #587096;
  font-size: 0.82rem;
  line-height: 1.32;
  -webkit-line-clamp: 2;
}

.home-featured-spotlight-arrow {
  display: inline-flex;
  width: 32px;
  height: 32px;
  align-items: center;
  justify-content: center;
  border: 1px solid #c7daf8;
  border-radius: 50%;
  color: #0754a6;
  background: #f4f8ff;
  font-size: 1.1rem;
  font-weight: 800;
}

.home-featured-spotlight-indicators {
  display: flex;
  min-height: 18px;
  align-items: center;
  justify-content: center;
  gap: 7px;
  padding-top: 7px;
}

.home-featured-spotlight-indicators button {
  width: 7px;
  height: 7px;
  padding: 0;
  border: 0;
  border-radius: 50%;
  background: #b7c8e3;
  transition: width 0.2s ease, border-radius 0.2s ease, background-color 0.2s ease;
}

.home-featured-spotlight-indicators button.is-active {
  width: 20px;
  border-radius: 999px;
  background: #0754a6;
}

.category-tabs {
  display: flex;
  gap: 8px;
  overflow-x: auto;
  padding-bottom: 2px;
}

.category-tab {
  flex-shrink: 0;
  text-decoration: none;
  font-size: 0.78rem;
  font-weight: 800;
  color: #11396f;
  background: #edf4ff;
  border: 1px solid #cfe1ff;
  border-radius: 999px;
  padding: 8px 12px;
}

.product-card {
  position: relative;
  display: flex;
  flex-direction: column;
  gap: 8px;
  transition: transform 0.14s ease, box-shadow 0.14s ease;
}

.product-card:hover {
  transform: translateY(-2px);
  box-shadow: 0 14px 24px rgba(0, 24, 69, 0.1);
}

.product-image {
  width: 100%;
  height: 152px;
  object-fit: cover;
  border-radius: 13px;
  border: 1px solid #d6e6ff;
}

.product-bottom {
  margin-top: auto;
}

.product-price {
  display: block;
  margin-bottom: 8px;
  font-size: 1rem;
  color: var(--brand-blue);
}

.product-add-form {
  display: flex;
  gap: 8px;
  align-items: center;
  flex-wrap: wrap;
}

.product-qty {
  max-width: 78px;
}

.qty-stepper {
  display: inline-flex;
  align-items: center;
  gap: 6px;
}

.qty-btn {
  width: 30px;
  height: 30px;
  border: 1px solid #c6d9ff;
  border-radius: 8px;
  background: #f3f8ff;
  color: #0a3d80;
  font-weight: 800;
  cursor: pointer;
}

.qty-btn:hover {
  background: #e7f0ff;
}

.qty-btn:active {
  transform: scale(0.96);
}

.cart-item-card.is-loading {
  opacity: 0.65;
}

.app-toast {
  position: fixed;
  left: 50%;
  bottom: 22px;
  transform: translate(-50%, 12px);
  min-width: 210px;
  max-width: min(92vw, 420px);
  padding: 10px 14px;
  border-radius: 12px;
  box-shadow: var(--shadow-strong);
  color: #fff;
  font-size: 0.86rem;
  font-weight: 700;
  text-align: center;
  opacity: 0;
  pointer-events: none;
  z-index: 300;
  transition: opacity 0.2s ease, transform 0.2s ease;
}

.app-toast.is-visible {
  opacity: 1;
  transform: translate(-50%, 0);
}

.toast-success {
  background: linear-gradient(120deg, #0a8f7f, #00bfa6);
}

.toast-error {
  background: linear-gradient(120deg, #8f1f1f, #d64545);
}

.kpis {
  display: grid;
  gap: 10px;
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.kpi {
  padding: 11px;
  border-radius: 12px;
  border: 1px solid var(--border);
  background: #fff;
}

.kpi h3 {
  margin: 0;
  font-size: 0.8rem;
  color: var(--text-soft);
}

.kpi strong {
  display: block;
  margin-top: 3px;
  font-size: 1.08rem;
  color: var(--brand-blue);
}

.form-shell {
  width: min(520px, 100%);
  margin: 18px auto;
}

.form-group {
  margin-bottom: 11px;
}

.form-group label {
  display: block;
  font-size: 0.82rem;
  font-weight: 700;
  margin-bottom: 6px;
}

.customer-panel-premium {
  display: grid;
  gap: 0;
  min-width: 0;
  max-width: 100%;
}

.customer-panel-sticky {
  position: sticky;
  top: 72px;
  z-index: 40;
  margin: 2px 0 6px;
  padding: 10px;
  border-radius: 16px;
  border: 1px solid #ccdefd;
  background: rgba(255, 255, 255, 0.92);
  backdrop-filter: blur(8px);
  box-shadow: 0 12px 26px rgba(0, 24, 69, 0.12);
}

.customer-panel-sticky-head {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  justify-content: space-between;
  gap: 10px;
  margin-bottom: 8px;
}

.customer-panel-sticky-head > * {
  min-width: 0;
}

.customer-panel-sticky-head strong {
  font-size: 0.82rem;
  color: #173f78;
}

.customer-panel-sticky-head small {
  font-size: 0.72rem;
  color: #5d749d;
  max-width: 100%;
  margin-left: auto;
  text-align: right;
  overflow-wrap: anywhere;
}

.customer-panel-tabs {
  display: flex;
  gap: 8px;
  max-width: 100%;
  overflow-x: auto;
  padding-bottom: 2px;
  -webkit-overflow-scrolling: touch;
}

.customer-tab-btn {
  border: 1px solid #c6dbff;
  border-radius: 999px;
  background: #f3f8ff;
  color: #1a4480;
  padding: 7px 12px;
  font-size: 0.76rem;
  font-weight: 800;
  cursor: pointer;
  white-space: nowrap;
  transition: background 0.15s ease, border-color 0.15s ease, transform 0.12s ease;
}

.customer-tab-btn:hover {
  transform: translateY(-1px);
  background: #eaf2ff;
}

.customer-tab-btn.is-active {
  background: var(--brand-blue);
  border-color: var(--brand-blue);
  color: #fff;
}

.customer-section {
  padding-top: 8px;
}

.customer-pane.is-active {
  display: block;
  min-width: 0;
  max-width: 100%;
}

.customer-card {
  border-radius: 20px;
  padding: 18px;
  box-shadow: 0 14px 32px rgba(0, 24, 69, 0.09);
  min-width: 0;
  max-width: 100%;
}

.customer-card-tag {
  margin-bottom: 8px;
  background: linear-gradient(120deg, rgba(255, 138, 0, 0.12), rgba(0, 191, 166, 0.08));
  border: 1px solid var(--client-accent-border);
}

.customer-card h2 {
  margin: 6px 0 0;
  font-size: 1.08rem;
}

.customer-form {
  margin-top: 14px;
}

.customer-form-inline {
  margin-top: 10px;
}

.customer-form-grid {
  display: grid;
  gap: 14px;
}

.customer-form-grid .form-group {
  margin-bottom: 0;
}

.customer-form .input,
.customer-form select.input,
.customer-form textarea.input {
  min-height: 46px;
  border-radius: 13px;
  background: #fbfdff;
  border-color: #c7dcff;
  padding: 12px 13px;
}

.customer-form .input:focus,
.customer-form select.input:focus,
.customer-form textarea.input:focus {
  border-color: #7fa7ea;
  box-shadow: 0 0 0 4px rgba(0, 43, 115, 0.13);
}

.form-col-full {
  grid-column: 1 / -1;
}

.customer-actions {
  margin-top: 18px;
  gap: 10px;
}

.customer-sound-preview {
  display: flex;
  align-items: center;
  gap: 12px;
  flex-wrap: wrap;
  margin-top: 12px;
}

.customer-sound-preview__label {
  color: #59719b;
  font-size: 0.84rem;
  font-weight: 700;
}

.customer-card-cta {
  background:
    linear-gradient(145deg, rgba(255, 255, 255, 0.98), rgba(243, 249, 255, 0.98));
}

.customer-business-request-card {
  overflow: hidden;
}

.customer-business-hero {
  margin: -4px -4px 14px;
  padding: 16px;
  border: 1px solid #d5e5ff;
  border-radius: 18px;
  background:
    linear-gradient(135deg, rgba(255, 255, 255, 0.96), rgba(239, 248, 255, 0.96)),
    linear-gradient(120deg, rgba(0, 191, 166, 0.14), rgba(0, 43, 115, 0.08));
}

.customer-business-hero h2 {
  margin-top: 4px;
}

.customer-business-mode-grid {
  display: grid;
  gap: 10px;
}

.subscription-plan-selector {
  display: grid;
  gap: 14px;
  width: 100%;
  padding: 16px;
  border: 1px solid rgba(16, 74, 151, 0.16);
  border-radius: 8px;
  background: rgba(244, 249, 255, 0.82);
}

.subscription-plan-selector__heading,
.subscription-plan-card__top {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
}

.subscription-plan-selector__heading > div,
.subscription-plan-card__top > span {
  display: grid;
  gap: 3px;
}

.subscription-plan-selector__heading strong {
  color: #073777;
  font-size: 1.05rem;
}

.subscription-plan-selector__heading small,
.subscription-plan-card__top small,
.subscription-plan-card__description,
.subscription-plan-card__notice {
  color: #63789d;
  font-size: 0.82rem;
  line-height: 1.35;
}

.subscription-plan-selector__heading > span,
.subscription-plan-card__top em {
  flex: 0 0 auto;
  padding: 5px 9px;
  border-radius: 999px;
  color: #087f72;
  background: #dff8f4;
  font-size: 0.72rem;
  font-style: normal;
  font-weight: 800;
}

.subscription-plan-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(175px, 1fr));
  gap: 10px;
}

.subscription-plan-grid[hidden] {
  display: none;
}

.subscription-plan-card {
  position: relative;
  display: grid;
  gap: 9px;
  min-width: 0;
  padding: 14px;
  overflow: hidden;
  border: 1px solid #c9dcf5;
  border-radius: 8px;
  background: #fff;
  cursor: pointer;
  transition: border-color 160ms ease, box-shadow 160ms ease, transform 160ms ease;
}

.subscription-plan-card:hover {
  transform: translateY(-1px);
  border-color: #4c8ee4;
}

.subscription-plan-card:has(input:checked) {
  border-color: #0753aa;
  box-shadow: 0 0 0 2px rgba(7, 83, 170, 0.13), 0 10px 24px rgba(8, 51, 108, 0.09);
}

.subscription-plan-card input {
  position: absolute;
  top: 13px;
  right: 13px;
  width: 18px;
  height: 18px;
  margin: 0;
  accent-color: #0753aa;
}

.subscription-plan-card__top {
  padding-right: 24px;
}

.subscription-plan-card__top strong {
  color: #072f68;
  font-size: 0.98rem;
}

.subscription-plan-card__price {
  color: #003d8f;
  font-size: 1.28rem;
  font-weight: 900;
}

.subscription-plan-card__price small {
  color: #63789d;
  font-size: 0.74rem;
  font-weight: 700;
}

.subscription-plan-card__features {
  display: grid;
  gap: 5px;
}

.subscription-plan-card__features small {
  display: flex;
  align-items: center;
  gap: 6px;
  color: #173f73;
  font-weight: 700;
}

.subscription-plan-card__features small::before {
  content: "\2713";
  color: #009d8c;
  font-weight: 900;
}

.subscription-plan-card__notice {
  padding-top: 7px;
  border-top: 1px solid #e4edf9;
}

body.theme-dark .subscription-plan-selector {
  border-color: rgba(105, 166, 236, 0.28);
  background: rgba(7, 31, 66, 0.72);
}

body.theme-dark .subscription-plan-selector__heading strong,
body.theme-dark .subscription-plan-card__top strong,
body.theme-dark .subscription-plan-card__price,
body.theme-dark .subscription-plan-card__features small {
  color: #f4f8ff;
}

body.theme-dark .subscription-plan-card {
  border-color: rgba(107, 161, 224, 0.32);
  background: #0a2851;
}

body.theme-dark .subscription-plan-selector__heading small,
body.theme-dark .subscription-plan-card__top small,
body.theme-dark .subscription-plan-card__description,
body.theme-dark .subscription-plan-card__notice,
body.theme-dark .subscription-plan-card__price small {
  color: #b9cae2;
}

@media (max-width: 620px) {
  .subscription-plan-selector {
    padding: 13px;
  }

  .subscription-plan-selector__heading {
    align-items: center;
  }

  .subscription-plan-selector__heading > span {
    display: none;
  }

  .subscription-plan-grid {
    grid-template-columns: 1fr;
  }
}

.customer-business-mode-card {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: 10px;
  align-items: flex-start;
  min-height: 92px;
  padding: 13px;
  border: 1px solid #cfe0ff;
  border-radius: 16px;
  background: #f8fbff;
  cursor: pointer;
  transition: border-color 0.15s ease, background 0.15s ease, box-shadow 0.15s ease;
}

.customer-business-mode-card:hover,
.customer-business-mode-card:has(input:checked) {
  border-color: #79a6ea;
  background: #eef6ff;
  box-shadow: 0 12px 24px rgba(0, 43, 115, 0.1);
}

.customer-business-mode-card input {
  margin-top: 3px;
  accent-color: var(--brand-blue);
}

.customer-business-mode-card strong {
  display: block;
  color: var(--brand-blue);
  font-size: 0.92rem;
  line-height: 1.2;
}

.customer-business-mode-card small {
  display: block;
  margin-top: 4px;
  color: #5b739d;
  line-height: 1.35;
}

.customer-business-custom-toggle {
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: 5px;
  min-height: 76px;
  padding: 12px;
  border: 1px dashed #c9dcff;
  border-radius: 16px;
  background: rgba(246, 250, 255, 0.92);
}

.customer-business-custom-toggle label {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  margin: 0;
  color: #133b75;
  font-weight: 800;
}

.customer-business-note {
  display: grid;
  gap: 4px;
  margin-top: 16px;
  padding: 13px 14px;
  border: 1px solid rgba(0, 191, 166, 0.22);
  border-radius: 16px;
  background: linear-gradient(135deg, rgba(237, 255, 251, 0.92), rgba(246, 250, 255, 0.92));
  color: #31557f;
}

.customer-business-note strong {
  color: #007d6e;
}

.customer-business-submit-actions {
  align-items: stretch;
}

.customer-business-submit-actions .btn {
  justify-content: center;
}

.customer-business-existing {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: 14px;
  align-items: center;
  margin-top: 16px;
  padding: 14px;
  border: 1px solid #cfe0ff;
  border-radius: 18px;
  background: linear-gradient(135deg, #ffffff, #f4f9ff);
}

.customer-business-existing-icon {
  width: 58px;
  height: 58px;
  border-radius: 18px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  color: var(--brand-blue);
  background: #eaf8ff;
  border: 1px solid #cde5ff;
}

.customer-business-existing-icon svg {
  width: 30px;
  height: 30px;
  fill: currentColor;
}

.customer-business-existing-copy {
  min-width: 0;
}

.customer-business-status {
  display: inline-flex;
  align-items: center;
  width: fit-content;
  min-height: 28px;
  padding: 5px 10px;
  border-radius: 999px;
  font-size: 0.74rem;
  font-weight: 900;
  line-height: 1;
}

.customer-business-status.is-active {
  color: #007d6e;
  background: rgba(0, 191, 166, 0.14);
  border: 1px solid rgba(0, 191, 166, 0.24);
}

.customer-business-status.is-pending,
.customer-business-status.is-inactive {
  color: #b06400;
  background: rgba(255, 138, 0, 0.14);
  border: 1px solid rgba(255, 138, 0, 0.24);
}

.customer-business-status.is-rejected {
  color: #b3263c;
  background: rgba(220, 53, 69, 0.12);
  border: 1px solid rgba(220, 53, 69, 0.22);
}

.customer-business-existing-copy h3 {
  margin: 7px 0 3px;
  color: var(--brand-blue);
  font-size: 1.05rem;
  overflow-wrap: anywhere;
}

.customer-subtitle {
  margin: 18px 0 10px;
  color: var(--brand-blue);
  font-size: 0.98rem;
  font-weight: 800;
}

.customer-empty-state {
  margin-top: 14px;
  position: relative;
  overflow: hidden;
  display: grid;
  gap: 10px;
  border: 1px solid rgba(184, 206, 245, 0.82);
  border-radius: 22px;
  background:
    radial-gradient(circle at 92% 8%, rgba(0, 191, 166, 0.12), transparent 34%),
    radial-gradient(circle at 8% 0%, rgba(245, 124, 0, 0.1), transparent 32%),
    linear-gradient(145deg, rgba(255, 255, 255, 0.98), rgba(239, 247, 255, 0.96));
  padding: 20px;
  box-shadow: 0 14px 30px rgba(0, 24, 69, 0.08);
}

.customer-empty-state strong {
  display: block;
  color: var(--brand-blue);
  margin-bottom: 4px;
}

.customer-empty-state h2,
.customer-empty-state h3 {
  margin: 0;
  color: var(--brand-blue);
  font-size: 1.05rem;
  font-weight: 900;
}

.customer-empty-state p,
.customer-empty-state > span:not(.customer-empty-state__icon) {
  margin: 0;
  color: #587096;
  line-height: 1.45;
}

.customer-empty-state .actions {
  margin-top: 4px;
}

.customer-empty-state__icon {
  width: 58px;
  height: 58px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 20px;
  color: var(--brand-blue);
  background:
    linear-gradient(135deg, rgba(0, 191, 166, 0.14), rgba(231, 247, 255, 0.96));
  border: 1px solid rgba(0, 191, 166, 0.2);
  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.55);
}

.customer-empty-state__icon svg {
  width: 29px;
  height: 29px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.8;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.customer-empty-state.is-centered {
  justify-items: center;
  text-align: center;
}

.customer-empty-state.is-centered .actions {
  justify-content: center;
}

.customer-empty-state.is-compact {
  padding: 16px;
  border-radius: 18px;
}

.customer-empty-state.is-compact .customer-empty-state__icon {
  width: 48px;
  height: 48px;
  border-radius: 17px;
}

.customer-empty-state.is-compact .customer-empty-state__icon svg {
  width: 24px;
  height: 24px;
}

.customer-address-list {
  display: grid;
  gap: 12px;
  margin-top: 14px;
}

.customer-address-item {
  border: 1px solid #d7e5ff;
  border-radius: 14px;
  background: #f9fbff;
  padding: 12px;
}

.customer-address-item.is-default {
  border-color: #8cdccc;
  box-shadow: 0 10px 22px rgba(0, 191, 166, 0.12);
}

.customer-address-item__header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 10px;
  margin-bottom: 8px;
}

.customer-address-item__header strong {
  color: #143b75;
  font-size: 0.9rem;
}

.customer-address-item__actions {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: 8px;
}

.customer-address-create-detail {
  margin-top: 16px;
  background: #ffffff;
  box-shadow: 0 12px 28px rgba(0, 43, 115, 0.08);
}

.customer-address-create-detail summary {
  padding: 14px;
  font-size: 0.92rem;
}

.customer-detail-action {
  border-radius: 999px;
  background: rgba(0, 191, 166, 0.12);
  color: #007866;
  padding: 5px 10px;
  font-size: 0.72rem;
  font-weight: 800;
}

.btn.btn-sm {
  min-height: 34px;
  padding: 6px 10px;
  font-size: 0.74rem;
}

.wallet-detail {
  border: 1px solid #d9e6ff;
  border-radius: 14px;
  background: #f9fbff;
  overflow: hidden;
}

.wallet-detail summary {
  list-style: none;
  cursor: pointer;
  padding: 11px 12px;
  font-size: 0.85rem;
  font-weight: 700;
  color: #174077;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}

.wallet-detail summary::-webkit-details-marker {
  display: none;
}

.wallet-detail[open] summary {
  border-bottom: 1px solid #d7e4ff;
  background: #f1f7ff;
}

.wallet-detail-body {
  padding: 10px 12px 12px;
}

.wallet-table th {
  font-size: 0.72rem;
  color: #4a6490;
  font-weight: 700;
}

.wallet-table td {
  font-size: 0.78rem;
}

@media (max-width: 759px) {
  .customer-panel-premium.is-tabs-mode .customer-pane {
    display: none;
  }

  .customer-panel-premium.is-tabs-mode .customer-pane.is-active {
    display: block;
  }

  .customer-panel-tabs {
    flex-wrap: wrap;
    overflow-x: visible;
    gap: 6px;
  }

  .customer-tab-btn {
    flex: 0 1 auto;
  }

  .customer-panel-sticky-head {
    display: block;
  }

  .customer-panel-sticky-head strong {
    display: block;
  }

  .customer-panel-sticky-head small {
    display: block;
    margin-top: 4px;
    margin-left: 0;
    text-align: left;
    white-space: normal;
  }
}

body.modal-open {
  overflow: hidden;
}

.profile-confirm-modal[hidden],
.business-request-modal[hidden],
.favorite-cart-modal[hidden] {
  display: none;
}

.profile-confirm-modal,
.business-request-modal {
  position: fixed;
  inset: 0;
  z-index: 900;
  display: flex;
  align-items: flex-end;
  justify-content: center;
  opacity: 0;
  pointer-events: none;
  transition: opacity 0.18s ease;
}

.profile-confirm-modal.is-open,
.business-request-modal.is-open {
  opacity: 1;
  pointer-events: auto;
}

.profile-confirm-modal__backdrop,
.business-request-modal__backdrop {
  position: absolute;
  inset: 0;
  background: rgba(0, 30, 74, 0.42);
  backdrop-filter: blur(2px);
}

.profile-confirm-modal__dialog,
.business-request-modal__dialog {
  position: relative;
  width: min(560px, calc(100% - 24px));
  margin: 0 12px 14px;
  border-radius: 18px;
  border: 1px solid #bed6ff;
  background: #fff;
  padding: 16px;
  box-shadow: 0 24px 44px rgba(0, 23, 64, 0.24);
  transform: translateY(12px);
  transition: transform 0.18s ease;
}

.profile-confirm-modal.is-open .profile-confirm-modal__dialog,
.business-request-modal.is-open .business-request-modal__dialog {
  transform: translateY(0);
}

.profile-confirm-modal__dialog h3,
.business-request-modal__dialog h3 {
  margin: 8px 0 4px;
  color: var(--brand-blue);
  font-size: 1.02rem;
}

.profile-confirm-modal__date {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  margin: 4px 0 14px;
  padding: 8px 12px;
  border-radius: 10px;
  background: #eaf3ff;
  border: 1px solid #c9dcff;
  color: #0f326e;
  font-weight: 800;
}

.business-request-modal__summary {
  margin: 12px 0 14px;
  padding: 12px;
  border: 1px solid #c9dcff;
  border-radius: 14px;
  background: #eef6ff;
  color: #214b82;
  font-weight: 700;
  line-height: 1.35;
}

@media (min-width: 760px) {
  .container {
    width: min(1120px, 92%);
  }

  .grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .split {
    grid-template-columns: 1.3fr 1fr;
  }

  .topbar {
    padding: 13px 14px;
  }

  .search-shell {
    grid-template-columns: 1.35fr 1fr 1fr auto auto;
    align-items: end;
  }

  .hero-panel {
    padding: 26px 24px;
  }

  .customer-card {
    padding: 20px;
  }

  .customer-panel-sticky {
    top: 86px;
    margin-top: 4px;
    padding: 12px;
  }

  .customer-panel-tabs {
    flex-wrap: wrap;
    overflow: visible;
  }

  .customer-form-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 16px 14px;
  }

  .customer-business-mode-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .customer-actions .btn {
    min-width: 160px;
  }

  .customer-favorites-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .business-cover {
    height: 148px;
  }

  .business-cover-hero {
    height: 230px;
  }

  .promo-banner img {
    height: 235px;
  }
}

@media (min-width: 1040px) {
  .grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .business-cover-hero {
    height: 280px;
  }

  .kpis {
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }
}

body.theme-dark .customer-card {
  background: #0f2044;
  border-color: #2e4b79;
  box-shadow: 0 16px 34px rgba(1, 6, 20, 0.4);
}

body.theme-dark .customer-panel-sticky {
  border-color: #385f97;
  background: rgba(15, 34, 69, 0.92);
  box-shadow: 0 16px 30px rgba(0, 0, 0, 0.36);
}

body.theme-dark .customer-panel-sticky-head strong {
  color: #d8e9ff;
}

body.theme-dark .customer-panel-sticky-head small {
  color: #9eb6db;
}

body.theme-dark .customer-tab-btn {
  border-color: #3a5f98;
  background: #122a56;
  color: #d4e6ff;
}

body.theme-dark .customer-tab-btn:hover {
  background: #173261;
}

body.theme-dark .customer-tab-btn.is-active {
  border-color: #4f79bc;
  background: #0e3a84;
}

body.theme-dark .customer-card-tag {
  border-color: var(--client-accent-border);
  background: linear-gradient(120deg, rgba(255, 138, 0, 0.14), rgba(20, 77, 94, 0.52));
  color: #ffe0b8;
}

body.theme-dark .customer-form .input,
body.theme-dark .customer-form select.input,
body.theme-dark .customer-form textarea.input {
  background: #0d1e3f;
  border-color: #395c95;
}

body.theme-dark .wallet-detail {
  background: #11264d;
  border-color: #345a94;
}

body.theme-dark .wallet-detail summary {
  color: #d5e7ff;
}

body.theme-dark .wallet-detail[open] summary {
  background: #163264;
  border-color: #375d96;
}

body.theme-dark .customer-address-item {
  border-color: #385e97;
  background: #12284f;
}

body.theme-dark .customer-address-item.is-default {
  border-color: #3d9c90;
  box-shadow: 0 12px 26px rgba(0, 0, 0, 0.28);
}

body.theme-dark .customer-address-item__header strong {
  color: #d8e9ff;
}

body.theme-dark .customer-empty-state {
  background:
    radial-gradient(circle at 92% 8%, rgba(0, 191, 166, 0.12), transparent 34%),
    radial-gradient(circle at 8% 0%, rgba(245, 124, 0, 0.12), transparent 32%),
    linear-gradient(145deg, rgba(15, 34, 72, 0.96), rgba(10, 24, 54, 0.96));
  border-color: rgba(88, 126, 190, 0.62);
  box-shadow: 0 18px 36px rgba(1, 5, 17, 0.32);
}

body.theme-dark .customer-empty-state strong,
body.theme-dark .customer-empty-state h2,
body.theme-dark .customer-empty-state h3,
body.theme-dark .customer-subtitle {
  color: #d8e9ff;
}

body.theme-dark .customer-empty-state p,
body.theme-dark .customer-empty-state > span:not(.customer-empty-state__icon) {
  color: #9fb6db;
}

body.theme-dark .customer-empty-state__icon {
  color: #8df5e7;
  background: rgba(0, 191, 166, 0.13);
  border-color: rgba(0, 191, 166, 0.28);
}

body.theme-dark .customer-address-create-detail {
  background: #11264d;
}

body.theme-dark .customer-detail-action {
  background: rgba(0, 191, 166, 0.18);
  color: #7ff5e4;
}

body.theme-dark .wallet-table th {
  color: #9fbbdf;
}

body.theme-dark .customer-card-cta {
  background: linear-gradient(145deg, rgba(15, 33, 65, 0.96), rgba(18, 42, 83, 0.96));
}

body.theme-dark .customer-business-hero {
  border-color: #385e97;
  background:
    linear-gradient(135deg, rgba(18, 39, 78, 0.96), rgba(12, 29, 61, 0.96)),
    linear-gradient(120deg, rgba(0, 191, 166, 0.16), rgba(0, 43, 115, 0.2));
}

body.theme-dark .customer-business-mode-card {
  border-color: #385e97;
  background: #10264d;
}

body.theme-dark .customer-business-mode-card:hover,
body.theme-dark .customer-business-mode-card:has(input:checked) {
  border-color: #6d98da;
  background: #173160;
  box-shadow: 0 14px 28px rgba(0, 0, 0, 0.28);
}

body.theme-dark .customer-business-mode-card strong {
  color: #d9eaff;
}

body.theme-dark .customer-business-mode-card small,
body.theme-dark .customer-business-note {
  color: #aac0df;
}

body.theme-dark .customer-business-custom-toggle {
  border-color: #3b6098;
  background: #10264d;
}

body.theme-dark .customer-business-custom-toggle label {
  color: #d9eaff;
}

body.theme-dark .customer-business-note {
  border-color: rgba(0, 191, 166, 0.3);
  background: linear-gradient(135deg, rgba(13, 58, 64, 0.84), rgba(14, 32, 66, 0.92));
}

body.theme-dark .customer-business-note strong {
  color: #7ff5e4;
}

body.theme-dark .customer-business-existing {
  border-color: #385e97;
  background: linear-gradient(135deg, #10264d, #0d2145);
}

body.theme-dark .customer-business-existing-icon {
  color: #d9eaff;
  background: #173160;
  border-color: #456aa4;
}

body.theme-dark .customer-business-existing-copy h3 {
  color: #d9eaff;
}

body.theme-dark .customer-business-status.is-active {
  color: #7ff5e4;
  background: rgba(0, 191, 166, 0.18);
  border-color: rgba(0, 191, 166, 0.3);
}

body.theme-dark .customer-business-status.is-pending,
body.theme-dark .customer-business-status.is-inactive {
  color: #ffd4a0;
  background: rgba(255, 138, 0, 0.18);
  border-color: rgba(255, 138, 0, 0.3);
}

body.theme-dark .customer-business-status.is-rejected {
  color: #ffb5c0;
  background: rgba(220, 53, 69, 0.18);
  border-color: rgba(220, 53, 69, 0.3);
}

body.theme-dark .business-request-modal__dialog {
  border-color: #365d96;
  background: #102347;
  box-shadow: 0 18px 36px rgba(0, 0, 0, 0.4);
}

body.theme-dark .business-request-modal__summary {
  border-color: #375d96;
  background: #163264;
  color: #d8e9ff;
}

/* Home listing premium */
.home-listing-section {
  padding-top: 8px;
}

.home-listing-head h2 {
  font-size: 1.18rem;
}

.home-business-grid {
  gap: 14px;
}

.business-group-affiliation {
  display: inline-flex;
  width: fit-content;
  max-width: 100%;
  align-items: center;
  gap: 0.38rem;
  margin-bottom: 0.45rem;
  color: #64779a;
  font-size: 0.7rem;
  font-weight: 600;
  line-height: 1.2;
}

.business-group-affiliation img,
.business-group-affiliation-mark {
  width: 19px;
  height: 19px;
  flex: 0 0 19px;
  border: 1px solid rgba(0, 43, 115, 0.12);
  border-radius: 5px;
  background: #fff;
  object-fit: contain;
}

.business-group-affiliation-mark {
  background: linear-gradient(135deg, rgba(0, 43, 115, 0.14), rgba(0, 191, 166, 0.18));
}

.business-group-affiliation strong {
  overflow: hidden;
  color: inherit;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.business-group-affiliation-hero {
  margin: 0.55rem 0 0;
  padding: 0.28rem 0.5rem;
  border: 1px solid rgba(0, 43, 115, 0.1);
  border-radius: 7px;
  background: rgba(255, 255, 255, 0.76);
  color: #38547e;
}

.business-card-home {
  border-color: #c6dbff;
  background: linear-gradient(165deg, rgba(255, 255, 255, 0.98) 0%, rgba(245, 250, 255, 0.96) 100%);
}

.business-card-home .actions {
  margin-top: 14px;
  justify-content: center;
}

.business-facade-card {
  isolation: isolate;
  display: grid;
  gap: 0;
  padding: 0;
  border: 1px solid rgba(0, 43, 115, 0.14);
  border-radius: 26px;
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.96), rgba(247, 251, 255, 0.96)),
    var(--business-facade-card-bg, #ffffff);
  box-shadow: 0 18px 38px rgba(0, 32, 92, 0.13);
  cursor: pointer;
}

.business-facade-card + .business-facade-card {
  margin-top: 4px;
}

.business-facade-card:focus-visible {
  outline: none;
  box-shadow:
    0 0 0 4px rgba(0, 191, 166, 0.2),
    0 18px 38px rgba(0, 32, 92, 0.13);
}

.business-facade-card:active {
  transform: translateY(0) scale(0.995);
}

.business-facade-card > .business-verified-badge {
  position: absolute;
  top: 14px;
  right: 14px;
  z-index: 7;
}

.business-facade-stage {
  position: relative;
  min-height: 178px;
  padding: 16px 16px 0;
  overflow: hidden;
  border-radius: 25px 25px 0 0;
  background:
    radial-gradient(circle at 82% 16%, rgba(255, 255, 255, 0.42), transparent 28%),
    linear-gradient(135deg, var(--facade-a, #00439a), var(--facade-b, #00bfa6));
}

.business-facade-stage::before {
  content: "";
  position: absolute;
  inset: auto -18% -46% -18%;
  height: 88%;
  border-radius: 50% 50% 0 0;
  background: rgba(255, 255, 255, 0.14);
  pointer-events: none;
}

.business-facade-sign {
  position: relative;
  z-index: 2;
  display: flex;
  align-items: center;
  gap: 10px;
  width: calc(100% - 46px);
  min-height: 56px;
  padding: 8px 10px;
  border-radius: 18px;
  border: 1px solid rgba(255, 255, 255, 0.28);
  background: rgba(7, 24, 58, 0.28);
  color: #fff;
  box-shadow: 0 14px 28px rgba(0, 17, 54, 0.16);
  backdrop-filter: blur(10px);
}

.business-facade-logo {
  width: 42px;
  height: 42px;
  flex: 0 0 42px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 14px;
  overflow: hidden;
  background: rgba(255, 255, 255, 0.94);
  color: var(--facade-a, #00439a);
  font-weight: 900;
  letter-spacing: 0.03em;
}

.business-facade-logo img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.business-facade-sign-copy {
  display: grid;
  min-width: 0;
  line-height: 1.08;
}

.business-facade-sign-copy small {
  color: rgba(255, 255, 255, 0.76);
  font-size: 0.68rem;
  font-weight: 900;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.business-facade-sign-copy strong {
  overflow: hidden;
  color: #fff;
  font-size: 1rem;
  font-weight: 950;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.business-facade-building {
  position: relative;
  z-index: 1;
  width: min(82%, 330px);
  margin: 14px auto 0;
  filter: drop-shadow(0 18px 24px rgba(0, 20, 60, 0.2));
}

.business-facade-roof {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  height: 34px;
  overflow: hidden;
  border-radius: 18px 18px 8px 8px;
  border: 1px solid rgba(255, 255, 255, 0.36);
  background: #fff;
}

.business-facade-roof span:nth-child(odd) {
  background: var(--facade-c, #18d2bf);
}

.business-facade-roof span:nth-child(even) {
  background: rgba(255, 255, 255, 0.96);
}

.business-facade-front {
  position: relative;
  display: grid;
  grid-template-columns: minmax(0, 1fr) 54px;
  gap: 12px;
  min-height: 84px;
  padding: 12px;
  border-radius: 16px 16px 22px 22px;
  background: rgba(255, 255, 255, 0.96);
  border: 1px solid rgba(255, 255, 255, 0.58);
}

.business-facade-window {
  position: relative;
  overflow: hidden;
  min-height: 64px;
  border-radius: 14px;
  background:
    linear-gradient(135deg, rgba(0, 43, 115, 0.1), rgba(0, 191, 166, 0.12)),
    #eaf4ff;
  color: var(--facade-a, #00439a);
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 1.4rem;
  font-weight: 950;
  letter-spacing: 0.08em;
}

.business-facade-window img {
  width: 100%;
  height: 100%;
  min-height: 64px;
  object-fit: cover;
}

.business-facade-window::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(135deg, rgba(255, 255, 255, 0.26), transparent 42%);
  pointer-events: none;
}

@keyframes businessFacadeWindowShine {
  from {
    transform: translateX(-120%) skewX(-16deg);
  }
  to {
    transform: translateX(120%) skewX(-16deg);
  }
}

@keyframes businessFacadePremiumAura {
  0%, 100% {
    opacity: 0.38;
    transform: translate3d(0, 0, 0) scale(1);
  }
  50% {
    opacity: 0.72;
    transform: translate3d(-2%, 1%, 0) scale(1.04);
  }
}

@media (prefers-reduced-motion: no-preference) {
  .business-facade-card {
    transition: transform 160ms ease, box-shadow 180ms ease, border-color 180ms ease;
  }

  .business-facade-building {
    transition: transform 220ms ease;
  }

  .business-facade-card:hover {
    transform: translateY(-2px);
  }

  .business-facade-card:hover .business-facade-building {
    transform: translateY(-2px);
  }

  .business-facade-card:hover .business-facade-window::after {
    background:
      linear-gradient(105deg, transparent 0%, rgba(255, 255, 255, 0.46) 48%, transparent 100%);
    animation: businessFacadeWindowShine 900ms ease;
  }

  .business-facade-card-premium-luxury .business-facade-stage::after,
  .business-facade-card-premium-neon .business-facade-stage::after,
  .business-facade-card-premium-showcase .business-facade-stage::after {
    content: "";
    position: absolute;
    inset: 10% -10% auto auto;
    width: 120px;
    height: 120px;
    border-radius: 999px;
    background: color-mix(in srgb, var(--facade-c, #22d3c2) 48%, transparent);
    filter: blur(26px);
    pointer-events: none;
    animation: businessFacadePremiumAura 4.8s ease-in-out infinite;
  }
}

.business-facade-door {
  position: relative;
  border-radius: 14px 14px 18px 18px;
  background: linear-gradient(180deg, var(--facade-a, #00439a), #073069);
}

.business-facade-door span {
  position: absolute;
  right: 8px;
  top: 50%;
  width: 7px;
  height: 7px;
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.78);
}

.business-facade-card-company .business-facade-roof {
  height: 18px;
  border-radius: 12px 12px 6px 6px;
}

.business-facade-card-company .business-facade-front {
  grid-template-columns: minmax(0, 1fr);
}

.business-facade-card-company .business-facade-door {
  display: none;
}

.business-facade-card-company .business-facade-window {
  min-height: 82px;
  border-radius: 12px;
}

.business-facade-card-service .business-facade-roof {
  height: 24px;
  border-radius: 20px 20px 4px 4px;
}

.business-facade-card-service .business-facade-front {
  grid-template-columns: minmax(0, 1fr) 72px;
  border-radius: 22px 22px 18px 18px;
}

.business-facade-card-service .business-facade-door {
  border-radius: 12px;
  background:
    repeating-linear-gradient(0deg, rgba(255, 255, 255, 0.16) 0 6px, transparent 6px 12px),
    linear-gradient(180deg, var(--facade-a, #00439a), #073069);
}

.business-facade-card-food .business-facade-stage {
  background:
    radial-gradient(circle at 86% 18%, rgba(255, 255, 255, 0.48), transparent 24%),
    radial-gradient(circle at 18% 86%, color-mix(in srgb, var(--facade-c, #22d3c2) 42%, transparent), transparent 32%),
    linear-gradient(135deg, var(--facade-a, #00439a), var(--facade-b, #00bfa6));
}

.business-facade-card-food .business-facade-roof {
  height: 38px;
  border-radius: 22px 22px 14px 14px;
}

.business-facade-card-food .business-facade-roof span {
  border-radius: 0 0 16px 16px;
}

.business-facade-card-food .business-facade-front {
  grid-template-columns: minmax(0, 1fr) 62px;
  border-radius: 24px 24px 18px 18px;
}

.business-facade-card-boutique .business-facade-stage {
  background:
    radial-gradient(circle at 78% 16%, rgba(255, 255, 255, 0.42), transparent 26%),
    linear-gradient(145deg, color-mix(in srgb, var(--facade-a, #873260) 78%, #fff), var(--facade-b, #e46aa6));
}

.business-facade-card-boutique .business-facade-sign {
  border-radius: 999px;
}

.business-facade-card-boutique .business-facade-roof {
  height: 28px;
  border-radius: 999px 999px 10px 10px;
}

.business-facade-card-boutique .business-facade-front {
  grid-template-columns: minmax(0, 1fr);
  padding: 14px;
  border-radius: 28px;
}

.business-facade-card-boutique .business-facade-door {
  display: none;
}

.business-facade-card-boutique .business-facade-window {
  min-height: 86px;
  border-radius: 22px;
}

.business-facade-card-minimarket .business-facade-building {
  width: min(88%, 350px);
}

.business-facade-card-minimarket .business-facade-roof {
  height: 32px;
  grid-template-columns: repeat(4, 1fr);
}

.business-facade-card-minimarket .business-facade-front {
  grid-template-columns: minmax(0, 1fr) 48px;
  min-height: 92px;
}

.business-facade-card-workshop .business-facade-roof {
  height: 20px;
  border-radius: 14px 14px 4px 4px;
  background:
    repeating-linear-gradient(90deg, var(--facade-c, #22d3c2) 0 18px, rgba(255, 255, 255, 0.92) 18px 34px);
}

.business-facade-card-workshop .business-facade-roof span {
  display: none;
}

.business-facade-card-workshop .business-facade-front {
  grid-template-columns: minmax(0, 1fr) 82px;
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.98), rgba(235, 242, 252, 0.96));
}

.business-facade-card-workshop .business-facade-door {
  border-radius: 10px;
  background:
    repeating-linear-gradient(0deg, rgba(255, 255, 255, 0.18) 0 7px, transparent 7px 14px),
    linear-gradient(180deg, var(--facade-a, #1d3557), #0b1b35);
}

.business-facade-card-professional .business-facade-stage {
  background:
    radial-gradient(circle at 80% 18%, rgba(255, 255, 255, 0.28), transparent 24%),
    linear-gradient(135deg, var(--facade-a, #1d3557), color-mix(in srgb, var(--facade-b, #5f6c7b) 72%, #fff));
}

.business-facade-card-professional .business-facade-sign {
  background: rgba(255, 255, 255, 0.16);
}

.business-facade-card-professional .business-facade-roof {
  height: 14px;
  border-radius: 10px 10px 4px 4px;
}

.business-facade-card-professional .business-facade-front {
  grid-template-columns: minmax(0, 1fr);
  border-radius: 12px 12px 18px 18px;
}

.business-facade-card-professional .business-facade-door {
  display: none;
}

.business-facade-card-premium-luxury,
.business-facade-card-premium-neon,
.business-facade-card-premium-showcase {
  border-color: color-mix(in srgb, var(--facade-c, #22d3c2) 46%, rgba(255, 255, 255, 0.5));
  box-shadow:
    0 24px 54px color-mix(in srgb, var(--facade-a, #003b8d) 22%, transparent),
    0 0 0 1px color-mix(in srgb, var(--facade-c, #22d3c2) 26%, transparent);
}

.business-facade-card-premium-luxury .business-facade-stage,
.business-facade-card-premium-neon .business-facade-stage,
.business-facade-card-premium-showcase .business-facade-stage {
  min-height: 198px;
}

.business-facade-card-premium-luxury .business-facade-stage {
  background:
    radial-gradient(circle at 16% 18%, rgba(255, 255, 255, 0.42), transparent 24%),
    radial-gradient(circle at 86% 18%, color-mix(in srgb, var(--facade-c, #22d3c2) 40%, transparent), transparent 28%),
    linear-gradient(135deg, #071a3d, var(--facade-a, #003b8d) 44%, var(--facade-b, #0ab9aa));
}

.business-facade-card-premium-luxury .business-facade-sign {
  border-color: rgba(255, 255, 255, 0.42);
  background: rgba(5, 16, 42, 0.46);
}

.business-facade-card-premium-luxury .business-facade-front {
  border-radius: 30px;
  border-color: rgba(255, 255, 255, 0.72);
  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.42);
}

.business-facade-card-premium-neon .business-facade-stage {
  background:
    radial-gradient(circle at 76% 16%, color-mix(in srgb, var(--facade-c, #22d3c2) 44%, transparent), transparent 26%),
    linear-gradient(135deg, #06132f, color-mix(in srgb, var(--facade-a, #003b8d) 74%, #071326), #041023);
}

.business-facade-card-premium-neon .business-facade-sign,
.business-facade-card-premium-neon .business-facade-front {
  border-color: color-mix(in srgb, var(--facade-c, #22d3c2) 58%, rgba(255, 255, 255, 0.22));
  box-shadow:
    0 18px 34px rgba(0, 0, 0, 0.24),
    0 0 22px color-mix(in srgb, var(--facade-c, #22d3c2) 36%, transparent);
}

.business-facade-card-premium-neon .business-facade-front {
  background: rgba(7, 18, 45, 0.9);
}

.business-facade-card-premium-neon .business-facade-window {
  background: rgba(255, 255, 255, 0.08);
  color: #fff;
}

.business-facade-card-premium-showcase .business-facade-stage {
  background:
    radial-gradient(circle at 14% 18%, rgba(255, 255, 255, 0.34), transparent 24%),
    linear-gradient(135deg, var(--facade-a, #003b8d), var(--facade-b, #0ab9aa));
}

.business-facade-card-premium-showcase .business-facade-building {
  width: min(90%, 370px);
}

.business-facade-card-premium-showcase .business-facade-front {
  grid-template-columns: minmax(0, 1fr) 42px;
  min-height: 100px;
  padding: 10px;
  border-radius: 26px;
}

.business-facade-card-premium-showcase .business-facade-window {
  min-height: 82px;
  border-radius: 22px;
}

.business-facade-card-premium-luxury::before,
.business-facade-card-premium-neon::before,
.business-facade-card-premium-showcase::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 0;
  pointer-events: none;
  opacity: 0.9;
}

.business-facade-card-premium-luxury .business-facade-content,
.business-facade-card-premium-neon .business-facade-content,
.business-facade-card-premium-showcase .business-facade-content {
  border-top: 0;
}

.business-facade-card-premium-luxury .business-facade-title-row h3,
.business-facade-card-premium-neon .business-facade-title-row h3,
.business-facade-card-premium-showcase .business-facade-title-row h3 {
  letter-spacing: -0.03em;
}

.business-facade-card-premium-luxury .service-tags .pill,
.business-facade-card-premium-luxury .service-tags .service-tag,
.business-facade-card-premium-neon .service-tags .pill,
.business-facade-card-premium-neon .service-tags .service-tag,
.business-facade-card-premium-showcase .service-tags .pill,
.business-facade-card-premium-showcase .service-tags .service-tag {
  min-height: 30px;
  border-radius: 999px;
  font-weight: 950;
}

.business-facade-card-premium-luxury .home-business-cta,
.business-facade-card-premium-neon .home-business-cta,
.business-facade-card-premium-showcase .home-business-cta {
  min-height: 52px;
  border: 0;
  border-radius: 18px;
  box-shadow: none;
}

.business-facade-card-premium-luxury {
  overflow: hidden;
  border-color: rgba(127, 245, 228, 0.62);
  background:
    linear-gradient(180deg, rgba(3, 19, 42, 0.98), rgba(7, 39, 59, 0.98));
  box-shadow:
    0 28px 68px rgba(0, 35, 68, 0.32),
    0 0 0 1px rgba(127, 245, 228, 0.35);
}

.business-facade-card-premium-luxury::before {
  background:
    radial-gradient(circle at 16% 62%, rgba(127, 245, 228, 0.22), transparent 25%),
    radial-gradient(circle at 86% 86%, rgba(255, 196, 87, 0.16), transparent 28%),
    linear-gradient(120deg, transparent 0 34%, rgba(255, 255, 255, 0.08) 48%, transparent 62%);
}

.business-facade-card-premium-luxury .business-facade-content {
  background:
    linear-gradient(180deg, rgba(8, 34, 52, 0.96), rgba(5, 22, 44, 0.98));
}

.business-facade-card-premium-luxury .business-facade-title-row h3 {
  color: #f7fffb;
  text-shadow: 0 2px 18px rgba(127, 245, 228, 0.18);
}

.business-facade-card-premium-luxury .business-facade-title-row p,
.business-facade-card-premium-luxury .business-availability-note {
  color: rgba(221, 247, 245, 0.78);
}

.business-facade-card-premium-luxury .operational-indicator {
  border-color: rgba(127, 245, 228, 0.4);
  background: rgba(127, 245, 228, 0.12);
  color: #bffff5;
}

.business-facade-card-premium-luxury .service-tags .pill,
.business-facade-card-premium-luxury .service-tags .service-tag {
  border-color: rgba(127, 245, 228, 0.34);
  background: rgba(127, 245, 228, 0.12);
  color: #d9fffa;
}

.business-facade-card-premium-luxury .home-business-cta {
  background:
    linear-gradient(135deg, rgba(255, 255, 255, 0.16), rgba(127, 245, 228, 0.22)),
    linear-gradient(135deg, #0c3f66, #007f75);
  color: #fff;
  box-shadow:
    inset 0 0 0 1px rgba(255, 255, 255, 0.2),
    0 16px 28px rgba(0, 191, 166, 0.22);
}

.business-facade-card-premium-neon {
  overflow: hidden;
  border-color: rgba(0, 240, 255, 0.6);
  background:
    linear-gradient(180deg, #071326, #081024 54%, #050b18);
  box-shadow:
    0 28px 70px rgba(0, 0, 0, 0.34),
    0 0 0 1px rgba(0, 240, 255, 0.22),
    0 0 34px rgba(0, 191, 166, 0.2);
}

.business-facade-card-premium-neon::before {
  background:
    radial-gradient(circle at 14% 66%, rgba(0, 240, 255, 0.24), transparent 24%),
    radial-gradient(circle at 92% 74%, rgba(0, 191, 166, 0.26), transparent 24%),
    linear-gradient(90deg, transparent, rgba(0, 240, 255, 0.08), transparent);
}

.business-facade-card-premium-neon .business-facade-content {
  background:
    linear-gradient(180deg, rgba(6, 17, 38, 0.98), rgba(4, 11, 24, 0.98));
}

.business-facade-card-premium-neon .business-facade-title-row h3 {
  color: #e9ffff;
  text-shadow:
    0 0 16px rgba(0, 240, 255, 0.2),
    0 0 24px rgba(0, 191, 166, 0.18);
}

.business-facade-card-premium-neon .business-facade-title-row p,
.business-facade-card-premium-neon .business-availability-note {
  color: rgba(189, 233, 246, 0.78);
}

.business-facade-card-premium-neon .operational-indicator {
  border-color: rgba(0, 240, 255, 0.34);
  background: rgba(0, 240, 255, 0.1);
  color: #aefcff;
}

.business-facade-card-premium-neon .service-tags .pill,
.business-facade-card-premium-neon .service-tags .service-tag {
  border-color: rgba(0, 240, 255, 0.3);
  background: rgba(0, 240, 255, 0.1);
  color: #cdfdff;
  box-shadow: 0 0 16px rgba(0, 240, 255, 0.08);
}

.business-facade-card-premium-neon .home-business-cta {
  background:
    linear-gradient(135deg, rgba(0, 240, 255, 0.96), rgba(0, 191, 166, 0.96));
  color: #031024;
  box-shadow:
    0 0 24px rgba(0, 240, 255, 0.24),
    0 18px 28px rgba(0, 0, 0, 0.22);
}

.business-facade-card-premium-showcase {
  overflow: hidden;
  border-color: rgba(0, 191, 166, 0.42);
  background:
    radial-gradient(circle at 90% 10%, rgba(0, 191, 166, 0.12), transparent 28%),
    linear-gradient(180deg, rgba(255, 255, 255, 0.99), rgba(238, 253, 250, 0.98));
  box-shadow:
    0 28px 62px rgba(0, 43, 115, 0.18),
    0 0 0 1px rgba(0, 191, 166, 0.18);
}

.business-facade-card-premium-showcase::before {
  background:
    linear-gradient(135deg, rgba(0, 191, 166, 0.1), transparent 42%),
    radial-gradient(circle at 18% 86%, rgba(0, 67, 154, 0.08), transparent 24%);
}

.business-facade-card-premium-showcase .business-facade-content {
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.98), rgba(240, 255, 252, 0.98));
}

.business-facade-card-premium-showcase .business-facade-title-row h3 {
  color: #002b73;
}

.business-facade-card-premium-showcase .business-facade-title-row p {
  color: #4f6791;
}

.business-facade-card-premium-showcase .operational-indicator {
  border-color: rgba(0, 191, 166, 0.28);
  background: rgba(0, 191, 166, 0.1);
  color: #00766d;
}

.business-facade-card-premium-showcase .service-tags .pill,
.business-facade-card-premium-showcase .service-tags .service-tag {
  border-color: rgba(0, 191, 166, 0.24);
  background: rgba(255, 255, 255, 0.82);
  color: #006f73;
  box-shadow: 0 8px 18px rgba(0, 43, 115, 0.06);
}

.business-facade-card-premium-showcase .home-business-cta {
  background:
    linear-gradient(135deg, #003b8d, #00a997);
  color: #fff;
  box-shadow: 0 16px 28px rgba(0, 43, 115, 0.18);
}

.business-facade-card-premium-marble,
.business-facade-card-premium-aurora,
.business-facade-card-premium-velvet,
.business-facade-card-premium-tech-grid,
.business-facade-card-premium-copper,
.business-facade-card-premium-ocean,
.business-facade-card-premium-midnight,
.business-facade-card-premium-candy,
.business-facade-card-premium-industrial,
.business-facade-card-premium-garden {
  overflow: hidden;
  border-color: var(--premium-card-border, color-mix(in srgb, var(--facade-c, #22d3c2) 42%, #ffffff));
  background: var(--premium-card-bg, linear-gradient(180deg, #ffffff, #f4fbff));
  box-shadow:
    0 28px 66px var(--premium-card-shadow, rgba(0, 43, 115, 0.2)),
    0 0 0 1px var(--premium-card-line, color-mix(in srgb, var(--facade-c, #22d3c2) 18%, transparent));
}

.business-facade-card-premium-marble .business-facade-stage,
.business-facade-card-premium-aurora .business-facade-stage,
.business-facade-card-premium-velvet .business-facade-stage,
.business-facade-card-premium-tech-grid .business-facade-stage,
.business-facade-card-premium-copper .business-facade-stage,
.business-facade-card-premium-ocean .business-facade-stage,
.business-facade-card-premium-midnight .business-facade-stage,
.business-facade-card-premium-candy .business-facade-stage,
.business-facade-card-premium-industrial .business-facade-stage,
.business-facade-card-premium-garden .business-facade-stage {
  min-height: 198px;
  background: var(--premium-stage-bg, linear-gradient(135deg, var(--facade-a, #003b8d), var(--facade-b, #00bfa6)));
}

.business-facade-card-premium-marble .business-facade-stage::before,
.business-facade-card-premium-aurora .business-facade-stage::before,
.business-facade-card-premium-velvet .business-facade-stage::before,
.business-facade-card-premium-tech-grid .business-facade-stage::before,
.business-facade-card-premium-copper .business-facade-stage::before,
.business-facade-card-premium-ocean .business-facade-stage::before,
.business-facade-card-premium-midnight .business-facade-stage::before,
.business-facade-card-premium-candy .business-facade-stage::before,
.business-facade-card-premium-industrial .business-facade-stage::before,
.business-facade-card-premium-garden .business-facade-stage::before {
  inset: 0;
  width: auto;
  height: auto;
  border-radius: 0;
  background: var(--premium-stage-pattern, transparent);
  opacity: var(--premium-stage-pattern-opacity, 0.9);
}

.business-facade-card-premium-marble .business-facade-sign,
.business-facade-card-premium-aurora .business-facade-sign,
.business-facade-card-premium-velvet .business-facade-sign,
.business-facade-card-premium-tech-grid .business-facade-sign,
.business-facade-card-premium-copper .business-facade-sign,
.business-facade-card-premium-ocean .business-facade-sign,
.business-facade-card-premium-midnight .business-facade-sign,
.business-facade-card-premium-candy .business-facade-sign,
.business-facade-card-premium-industrial .business-facade-sign,
.business-facade-card-premium-garden .business-facade-sign {
  border-color: var(--premium-glass-border, rgba(255, 255, 255, 0.36));
  background: var(--premium-glass-bg, rgba(8, 24, 58, 0.3));
}

.business-facade-card-premium-marble .business-facade-content,
.business-facade-card-premium-aurora .business-facade-content,
.business-facade-card-premium-velvet .business-facade-content,
.business-facade-card-premium-tech-grid .business-facade-content,
.business-facade-card-premium-copper .business-facade-content,
.business-facade-card-premium-ocean .business-facade-content,
.business-facade-card-premium-midnight .business-facade-content,
.business-facade-card-premium-candy .business-facade-content,
.business-facade-card-premium-industrial .business-facade-content,
.business-facade-card-premium-garden .business-facade-content {
  border-top: 0;
  background: var(--premium-content-bg, rgba(255, 255, 255, 0.96));
}

.business-facade-card-premium-marble .business-facade-title-row h3,
.business-facade-card-premium-aurora .business-facade-title-row h3,
.business-facade-card-premium-velvet .business-facade-title-row h3,
.business-facade-card-premium-tech-grid .business-facade-title-row h3,
.business-facade-card-premium-copper .business-facade-title-row h3,
.business-facade-card-premium-ocean .business-facade-title-row h3,
.business-facade-card-premium-midnight .business-facade-title-row h3,
.business-facade-card-premium-candy .business-facade-title-row h3,
.business-facade-card-premium-industrial .business-facade-title-row h3,
.business-facade-card-premium-garden .business-facade-title-row h3 {
  color: var(--premium-title-color, var(--brand-blue));
}

.business-facade-card-premium-marble .business-facade-title-row p,
.business-facade-card-premium-aurora .business-facade-title-row p,
.business-facade-card-premium-velvet .business-facade-title-row p,
.business-facade-card-premium-tech-grid .business-facade-title-row p,
.business-facade-card-premium-copper .business-facade-title-row p,
.business-facade-card-premium-ocean .business-facade-title-row p,
.business-facade-card-premium-midnight .business-facade-title-row p,
.business-facade-card-premium-candy .business-facade-title-row p,
.business-facade-card-premium-industrial .business-facade-title-row p,
.business-facade-card-premium-garden .business-facade-title-row p,
.business-facade-card-premium-marble .business-availability-note,
.business-facade-card-premium-aurora .business-availability-note,
.business-facade-card-premium-velvet .business-availability-note,
.business-facade-card-premium-tech-grid .business-availability-note,
.business-facade-card-premium-copper .business-availability-note,
.business-facade-card-premium-ocean .business-availability-note,
.business-facade-card-premium-midnight .business-availability-note,
.business-facade-card-premium-candy .business-availability-note,
.business-facade-card-premium-industrial .business-availability-note,
.business-facade-card-premium-garden .business-availability-note {
  color: var(--premium-copy-color, #60769d);
}

.business-facade-card-premium-marble .service-tags .pill,
.business-facade-card-premium-marble .service-tags .service-tag,
.business-facade-card-premium-aurora .service-tags .pill,
.business-facade-card-premium-aurora .service-tags .service-tag,
.business-facade-card-premium-velvet .service-tags .pill,
.business-facade-card-premium-velvet .service-tags .service-tag,
.business-facade-card-premium-tech-grid .service-tags .pill,
.business-facade-card-premium-tech-grid .service-tags .service-tag,
.business-facade-card-premium-copper .service-tags .pill,
.business-facade-card-premium-copper .service-tags .service-tag,
.business-facade-card-premium-ocean .service-tags .pill,
.business-facade-card-premium-ocean .service-tags .service-tag,
.business-facade-card-premium-midnight .service-tags .pill,
.business-facade-card-premium-midnight .service-tags .service-tag,
.business-facade-card-premium-candy .service-tags .pill,
.business-facade-card-premium-candy .service-tags .service-tag,
.business-facade-card-premium-industrial .service-tags .pill,
.business-facade-card-premium-industrial .service-tags .service-tag,
.business-facade-card-premium-garden .service-tags .pill,
.business-facade-card-premium-garden .service-tags .service-tag {
  border-color: var(--premium-pill-border, color-mix(in srgb, var(--facade-c, #22d3c2) 28%, #ffffff));
  background: var(--premium-pill-bg, color-mix(in srgb, var(--facade-c, #22d3c2) 12%, #ffffff));
  color: var(--premium-pill-color, #006f73);
  font-weight: 950;
}

.business-facade-card-premium-marble .home-business-cta,
.business-facade-card-premium-aurora .home-business-cta,
.business-facade-card-premium-velvet .home-business-cta,
.business-facade-card-premium-tech-grid .home-business-cta,
.business-facade-card-premium-copper .home-business-cta,
.business-facade-card-premium-ocean .home-business-cta,
.business-facade-card-premium-midnight .home-business-cta,
.business-facade-card-premium-candy .home-business-cta,
.business-facade-card-premium-industrial .home-business-cta,
.business-facade-card-premium-garden .home-business-cta {
  min-height: 52px;
  border: 0;
  border-radius: 18px;
  background: var(--premium-cta-bg, linear-gradient(135deg, var(--facade-a, #003b8d), var(--facade-b, #00bfa6)));
  color: var(--premium-cta-color, #ffffff);
  box-shadow: var(--premium-cta-shadow, 0 16px 28px rgba(0, 43, 115, 0.16));
}

.business-facade-card-premium-marble {
  --premium-card-bg: linear-gradient(180deg, #fffdf6, #f6efe2);
  --premium-card-border: rgba(218, 176, 92, 0.62);
  --premium-card-shadow: rgba(117, 81, 26, 0.18);
  --premium-stage-bg:
    radial-gradient(circle at 20% 20%, rgba(255, 255, 255, 0.82), transparent 22%),
    linear-gradient(135deg, #f9f3e7, #d6b36a 48%, color-mix(in srgb, var(--facade-a) 44%, #1f2537));
  --premium-stage-pattern:
    linear-gradient(112deg, transparent 0 22%, rgba(255, 255, 255, 0.52) 24%, transparent 27%),
    linear-gradient(58deg, transparent 0 52%, rgba(84, 65, 42, 0.18) 54%, transparent 57%);
  --premium-glass-bg: rgba(255, 255, 255, 0.28);
  --premium-content-bg: linear-gradient(180deg, #fffaf0, #ffffff);
  --premium-title-color: #5e4215;
  --premium-copy-color: #78684f;
  --premium-pill-bg: rgba(218, 176, 92, 0.14);
  --premium-pill-border: rgba(188, 143, 50, 0.32);
  --premium-pill-color: #765216;
  --premium-cta-bg: linear-gradient(135deg, #0b2e68, #bf8f2f);
}

.business-facade-card-premium-aurora {
  --premium-card-bg: linear-gradient(180deg, #061d2e, #071224);
  --premium-card-border: rgba(80, 255, 213, 0.55);
  --premium-card-shadow: rgba(0, 96, 119, 0.3);
  --premium-stage-bg:
    radial-gradient(circle at 80% 12%, rgba(139, 255, 233, 0.42), transparent 24%),
    linear-gradient(125deg, #08152d, color-mix(in srgb, var(--facade-a) 66%, #02111c), #00bfa6);
  --premium-stage-pattern:
    linear-gradient(72deg, transparent 0 26%, rgba(132, 255, 217, 0.24) 30%, transparent 36%),
    linear-gradient(104deg, transparent 0 52%, rgba(66, 145, 255, 0.2) 56%, transparent 62%);
  --premium-glass-bg: rgba(4, 25, 48, 0.46);
  --premium-content-bg: linear-gradient(180deg, rgba(7, 25, 43, 0.98), rgba(5, 14, 29, 0.98));
  --premium-title-color: #e8fffb;
  --premium-copy-color: rgba(215, 245, 255, 0.78);
  --premium-pill-bg: rgba(97, 255, 218, 0.12);
  --premium-pill-border: rgba(97, 255, 218, 0.34);
  --premium-pill-color: #cafff7;
  --premium-cta-bg: linear-gradient(135deg, #1173ff, #00c9a7);
}

.business-facade-card-premium-velvet {
  --premium-card-bg: linear-gradient(180deg, #3d0f2d, #160814);
  --premium-card-border: rgba(255, 165, 215, 0.5);
  --premium-card-shadow: rgba(96, 24, 74, 0.34);
  --premium-stage-bg:
    radial-gradient(circle at 78% 18%, rgba(255, 202, 232, 0.36), transparent 24%),
    linear-gradient(140deg, #3e1231, #8b326b, color-mix(in srgb, var(--facade-b) 54%, #db6da2));
  --premium-stage-pattern:
    radial-gradient(circle at 12px 12px, rgba(255, 255, 255, 0.14) 0 2px, transparent 3px),
    linear-gradient(135deg, rgba(255, 255, 255, 0.12), transparent 36%);
  --premium-glass-bg: rgba(70, 18, 52, 0.44);
  --premium-content-bg: linear-gradient(180deg, #fff2fa, #fff9fd);
  --premium-title-color: #6f2455;
  --premium-copy-color: #8b6680;
  --premium-pill-bg: rgba(228, 106, 166, 0.12);
  --premium-pill-border: rgba(228, 106, 166, 0.28);
  --premium-pill-color: #7e285e;
  --premium-cta-bg: linear-gradient(135deg, #873260, #e46aa6);
}

.business-facade-card-premium-tech-grid {
  --premium-card-bg: linear-gradient(180deg, #041127, #020712);
  --premium-card-border: rgba(68, 241, 255, 0.54);
  --premium-card-shadow: rgba(0, 31, 92, 0.34);
  --premium-stage-bg: linear-gradient(135deg, #06142f, color-mix(in srgb, var(--facade-a) 72%, #050b18));
  --premium-stage-pattern:
    linear-gradient(rgba(95, 232, 255, 0.14) 1px, transparent 1px),
    linear-gradient(90deg, rgba(95, 232, 255, 0.14) 1px, transparent 1px),
    radial-gradient(circle at 82% 18%, rgba(0, 240, 255, 0.28), transparent 24%);
  --premium-glass-bg: rgba(5, 16, 39, 0.58);
  --premium-content-bg: linear-gradient(180deg, rgba(4, 13, 31, 0.98), rgba(2, 7, 18, 0.98));
  --premium-title-color: #e7fbff;
  --premium-copy-color: rgba(196, 224, 237, 0.78);
  --premium-pill-bg: rgba(0, 240, 255, 0.1);
  --premium-pill-border: rgba(0, 240, 255, 0.3);
  --premium-pill-color: #cfffff;
  --premium-cta-bg: linear-gradient(135deg, #00eaff, #006eff);
  --premium-cta-color: #031024;
}

.business-facade-card-premium-tech-grid .business-facade-stage::before {
  background-size: 28px 28px, 28px 28px, auto;
}

.business-facade-card-premium-copper {
  --premium-card-bg: linear-gradient(180deg, #2d170d, #140c08);
  --premium-card-border: rgba(229, 148, 74, 0.58);
  --premium-card-shadow: rgba(88, 41, 12, 0.3);
  --premium-stage-bg: linear-gradient(135deg, #2b160b, #a75b2a 58%, color-mix(in srgb, var(--facade-b) 30%, #e7a15c));
  --premium-stage-pattern:
    repeating-linear-gradient(45deg, rgba(255, 255, 255, 0.12) 0 10px, transparent 10px 22px),
    radial-gradient(circle at 84% 16%, rgba(255, 225, 164, 0.28), transparent 24%);
  --premium-glass-bg: rgba(59, 26, 13, 0.48);
  --premium-content-bg: linear-gradient(180deg, #fff4e8, #fffaf5);
  --premium-title-color: #5c2b10;
  --premium-copy-color: #7c5c47;
  --premium-pill-bg: rgba(189, 101, 45, 0.13);
  --premium-pill-border: rgba(189, 101, 45, 0.28);
  --premium-pill-color: #6a3215;
  --premium-cta-bg: linear-gradient(135deg, #3d1e0e, #c97833);
}

.business-facade-card-premium-ocean {
  --premium-card-bg: linear-gradient(180deg, #e9fbff, #f9ffff);
  --premium-card-border: rgba(0, 154, 190, 0.36);
  --premium-card-shadow: rgba(0, 91, 128, 0.16);
  --premium-stage-bg: linear-gradient(135deg, #0077b6, color-mix(in srgb, var(--facade-b) 74%, #80ffea));
  --premium-stage-pattern:
    radial-gradient(ellipse at 18% 82%, rgba(255, 255, 255, 0.26), transparent 32%),
    repeating-linear-gradient(165deg, rgba(255, 255, 255, 0.18) 0 6px, transparent 6px 20px);
  --premium-glass-bg: rgba(255, 255, 255, 0.18);
  --premium-content-bg: linear-gradient(180deg, #f4fdff, #ffffff);
  --premium-title-color: #004b7a;
  --premium-copy-color: #4e7792;
  --premium-pill-bg: rgba(0, 169, 181, 0.1);
  --premium-pill-border: rgba(0, 169, 181, 0.26);
  --premium-pill-color: #006a77;
  --premium-cta-bg: linear-gradient(135deg, #005f99, #00bfa6);
}

.business-facade-card-premium-midnight {
  --premium-card-bg: linear-gradient(180deg, #070b19, #050711);
  --premium-card-border: rgba(157, 190, 255, 0.38);
  --premium-card-shadow: rgba(0, 0, 0, 0.38);
  --premium-stage-bg: linear-gradient(135deg, #070b19, color-mix(in srgb, var(--facade-a) 52%, #10172f));
  --premium-stage-pattern:
    radial-gradient(circle at 24% 22%, rgba(255, 255, 255, 0.44) 0 1px, transparent 2px),
    radial-gradient(circle at 72% 30%, rgba(255, 255, 255, 0.36) 0 1px, transparent 2px),
    linear-gradient(115deg, transparent 0 40%, rgba(120, 161, 255, 0.15) 44%, transparent 58%);
  --premium-glass-bg: rgba(7, 13, 31, 0.58);
  --premium-content-bg: linear-gradient(180deg, #0b1225, #060914);
  --premium-title-color: #f2f6ff;
  --premium-copy-color: rgba(212, 224, 255, 0.74);
  --premium-pill-bg: rgba(157, 190, 255, 0.1);
  --premium-pill-border: rgba(157, 190, 255, 0.26);
  --premium-pill-color: #e5edff;
  --premium-cta-bg: linear-gradient(135deg, #152f77, #9dbeff);
  --premium-cta-color: #ffffff;
}

.business-facade-card-premium-candy {
  --premium-card-bg: linear-gradient(180deg, #fff4fb, #f4fbff);
  --premium-card-border: rgba(255, 150, 212, 0.44);
  --premium-card-shadow: rgba(154, 70, 134, 0.18);
  --premium-stage-bg: linear-gradient(135deg, #ff8fc8, #85e7ff 58%, #fff0a8);
  --premium-stage-pattern:
    repeating-linear-gradient(90deg, rgba(255, 255, 255, 0.28) 0 18px, transparent 18px 36px),
    radial-gradient(circle at 82% 18%, rgba(255, 255, 255, 0.36), transparent 24%);
  --premium-glass-bg: rgba(255, 255, 255, 0.26);
  --premium-content-bg: linear-gradient(180deg, #fff8fd, #ffffff);
  --premium-title-color: #67326b;
  --premium-copy-color: #786491;
  --premium-pill-bg: rgba(255, 143, 200, 0.12);
  --premium-pill-border: rgba(255, 143, 200, 0.28);
  --premium-pill-color: #7d3271;
  --premium-cta-bg: linear-gradient(135deg, #8350d8, #ff8fc8);
}

.business-facade-card-premium-industrial {
  --premium-card-bg: linear-gradient(180deg, #191f2a, #0f131b);
  --premium-card-border: rgba(255, 184, 76, 0.44);
  --premium-card-shadow: rgba(0, 0, 0, 0.34);
  --premium-stage-bg: linear-gradient(135deg, #151a22, #48515f);
  --premium-stage-pattern:
    repeating-linear-gradient(135deg, rgba(255, 184, 76, 0.28) 0 12px, transparent 12px 24px),
    linear-gradient(90deg, rgba(255, 255, 255, 0.08), transparent);
  --premium-glass-bg: rgba(14, 18, 26, 0.58);
  --premium-content-bg: linear-gradient(180deg, #151b24, #0e121a);
  --premium-title-color: #fff6df;
  --premium-copy-color: rgba(235, 230, 216, 0.74);
  --premium-pill-bg: rgba(255, 184, 76, 0.12);
  --premium-pill-border: rgba(255, 184, 76, 0.32);
  --premium-pill-color: #ffe7b3;
  --premium-cta-bg: linear-gradient(135deg, #111722, #f2a737);
}

.business-facade-card-premium-garden {
  --premium-card-bg: linear-gradient(180deg, #effff7, #ffffff);
  --premium-card-border: rgba(52, 168, 105, 0.38);
  --premium-card-shadow: rgba(22, 108, 64, 0.16);
  --premium-stage-bg: linear-gradient(135deg, #0f7a48, color-mix(in srgb, var(--facade-b) 60%, #8ee8a7));
  --premium-stage-pattern:
    radial-gradient(ellipse at 18% 24%, rgba(255, 255, 255, 0.24) 0 16%, transparent 17%),
    radial-gradient(ellipse at 76% 22%, rgba(255, 255, 255, 0.2) 0 12%, transparent 13%),
    repeating-linear-gradient(45deg, rgba(255, 255, 255, 0.1) 0 8px, transparent 8px 22px);
  --premium-glass-bg: rgba(12, 85, 50, 0.32);
  --premium-content-bg: linear-gradient(180deg, #f2fff7, #ffffff);
  --premium-title-color: #095736;
  --premium-copy-color: #557665;
  --premium-pill-bg: rgba(52, 168, 105, 0.12);
  --premium-pill-border: rgba(52, 168, 105, 0.26);
  --premium-pill-color: #126844;
  --premium-cta-bg: linear-gradient(135deg, #0f7a48, #00bfa6);
}

.business-facade-content {
  position: relative;
  z-index: 2;
  display: grid;
  gap: 12px;
  padding: 15px;
  border-top: 1px solid rgba(0, 43, 115, 0.08);
  background: rgba(255, 255, 255, 0.96);
  border-radius: 0 0 25px 25px;
}

.business-facade-title-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 10px;
  align-items: start;
}

.business-facade-title-row h3 {
  margin: 0;
  color: var(--brand-blue);
  font-size: 1.08rem;
  line-height: 1.12;
}

.business-facade-title-row p {
  display: -webkit-box;
  margin: 4px 0 0;
  overflow: hidden;
  color: #60769d;
  font-size: 0.85rem;
  line-height: 1.32;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
}

.business-facade-card .operational-indicator {
  max-width: 128px;
  justify-content: center;
  white-space: nowrap;
}

.business-facade-card .service-tags {
  gap: 7px;
}

.business-facade-card .home-business-cta {
  width: 100%;
  min-width: 0;
  justify-content: center;
}

.business-facade-actions {
  align-items: center;
  flex-wrap: nowrap;
}

.business-facade-actions.has-favorite {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 42px;
  gap: 10px;
}

.business-facade-actions .favorite-toggle-form {
  position: static;
  display: inline-flex;
  justify-content: flex-end;
  margin: 0;
}

.business-facade-actions .favorite-toggle-btn-business {
  width: 42px;
  height: 42px;
  background: rgba(255, 255, 255, 0.98);
  box-shadow: 0 8px 18px rgba(0, 43, 115, 0.12);
}

.business-facade-actions.has-social-actions {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 10px;
}

.business-facade-secondary-actions {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
  min-width: 0;
}

.business-facade-secondary-actions.is-single {
  grid-template-columns: minmax(0, 1fr);
}

.business-facade-secondary-actions .business-like-control,
.business-facade-secondary-actions .business-like-button,
.business-facade-secondary-actions .favorite-toggle-form,
.business-facade-secondary-actions .favorite-toggle-btn-business {
  width: 100%;
  min-width: 0;
}

.business-facade-secondary-actions .business-like-control,
.business-facade-secondary-actions .favorite-toggle-btn-business {
  min-height: 42px;
}

.business-facade-secondary-actions .business-like-button,
.business-facade-secondary-actions .business-like-display {
  min-height: 40px;
  padding: 8px 10px;
}

.business-facade-secondary-actions .favorite-toggle-form {
  position: static;
  margin: 0;
}

.business-facade-secondary-actions .favorite-toggle-btn-business {
  width: 100%;
  height: 42px;
  gap: 7px;
  padding: 0 12px;
}

.favorite-toggle-label {
  min-width: 0;
  overflow: hidden;
  font-size: 0.78rem;
  font-weight: 800;
  line-height: 1;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.business-facade-palette-brand {
  --facade-a: #003b8d;
  --facade-b: #0ab9aa;
  --facade-c: #22d3c2;
}

.business-facade-palette-mint {
  --facade-a: #006f73;
  --facade-b: #22c7a8;
  --facade-c: #7df1d8;
}

.business-facade-palette-sunset {
  --facade-a: #073d8f;
  --facade-b: #ff8a00;
  --facade-c: #ffb547;
}

.business-facade-palette-graphite {
  --facade-a: #1d3557;
  --facade-b: #5f6c7b;
  --facade-c: #d7dde6;
}

.business-facade-palette-rose {
  --facade-a: #873260;
  --facade-b: #e46aa6;
  --facade-c: #ffc0da;
}

.open-food-now-hero {
  border-color: #c6dbff;
  background:
    radial-gradient(circle at top right, rgba(245, 124, 0, 0.14), transparent 38%),
    linear-gradient(165deg, rgba(255, 255, 255, 0.98) 0%, rgba(245, 250, 255, 0.96) 100%);
}

.open-food-now-location {
  margin: 10px 0 0;
  color: #20477e;
  font-weight: 700;
}

.open-food-now-hero-tags {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 14px;
}

.open-food-now-grid {
  gap: 16px;
}

.open-food-business-card {
  position: relative;
}

.open-food-status-row {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 6px;
}

.open-food-closing-pill {
  background: #eef5ff;
  color: #254c84;
  border-color: #c8daf5;
}

.home-business-cta {
  position: relative;
  display: inline-grid;
  grid-template-columns: 18px auto 18px;
  align-items: center;
  gap: 10px;
  min-height: 46px;
  min-width: 168px;
  padding: 12px 16px;
  border-radius: 14px;
  font-size: 0.96rem;
  font-weight: 800;
  letter-spacing: 0.01em;
  text-align: left;
  box-shadow: 0 8px 18px rgba(0, 43, 115, 0.18);
  overflow: hidden;
  transition: transform 0.16s ease, box-shadow 0.18s ease, filter 0.18s ease;
}

.home-business-cta::before {
  content: "";
  width: 18px;
  height: 18px;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='white'%3E%3Cpath d='M5 6.5A1.5 1.5 0 0 1 6.5 5h11A1.5 1.5 0 0 1 19 6.5v2A1.5 1.5 0 0 1 17.5 10h-11A1.5 1.5 0 0 1 5 8.5Zm0 9A1.5 1.5 0 0 1 6.5 14h11a1.5 1.5 0 0 1 0 3h-11A1.5 1.5 0 0 1 5 15.5Zm0-4.5A1.5 1.5 0 0 1 6.5 9h11a1.5 1.5 0 0 1 0 3h-11A1.5 1.5 0 0 1 5 11Z'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: center;
  background-size: 18px 18px;
  transition: transform 0.18s ease;
}

.home-business-cta::after {
  content: "";
  width: 18px;
  height: 18px;
  border-radius: 999px;
  background-color: rgba(255, 255, 255, 0.16);
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='2.3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m9 6 6 6-6 6'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: center;
  background-size: 14px 14px;
  transition: transform 0.18s ease, background-color 0.18s ease;
}

.home-business-cta:hover {
  transform: translateY(-1px);
  box-shadow: 0 12px 24px rgba(0, 43, 115, 0.24);
  filter: saturate(1.03);
}

.home-business-cta:hover::before {
  transform: translateX(-1px);
}

.home-business-cta:hover::after {
  transform: translateX(2px) scale(1.06);
  background-color: rgba(255, 255, 255, 0.24);
}

.home-business-cta:active {
  transform: translateY(0) scale(0.985);
}

.home-results-foot {
  margin-top: 10px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  flex-wrap: wrap;
}

.home-results-text {
  color: #49628d;
  font-size: 0.8rem;
  font-weight: 700;
}

.home-load-more-btn {
  min-height: 40px;
  border-radius: 999px;
  padding: 10px 16px;
  font-weight: 800;
}

.home-load-more-btn::after {
  content: "+";
  margin-left: 8px;
  font-size: 0.92rem;
  line-height: 1;
}

/* Business menu premium */
.business-hero-tags {
  margin-top: 10px;
}

.business-hero-note {
  margin-top: 10px;
  font-size: 0.88rem;
  color: #2e4f80;
}

.business-hero-note-soft {
  margin-top: 6px;
  color: #4f6994;
}

.business-availability-note {
  margin: 7px 0 0;
  font-size: 0.8rem;
  font-weight: 700;
  color: #2b5f89;
}

.business-unavailable-card {
  border-color: #ffdcb0;
  background: linear-gradient(145deg, rgba(255, 251, 245, 0.98), rgba(255, 244, 232, 0.98));
}

.business-unavailable-note {
  margin-top: 8px;
  color: #8a4e10;
  font-weight: 700;
}

.local-menu-nav-section {
  padding-top: 2px;
}

.business-catalog-contact-section {
  padding-bottom: 8px;
}

.business-catalog-contact-strip {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  padding: 0 2px;
}

.business-catalog-contact-link {
  min-height: 34px;
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 7px 11px;
  border: 1px solid rgba(0, 43, 115, 0.14);
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.52);
  color: #315f9c;
  text-decoration: none;
  font-size: 0.78rem;
  font-weight: 850;
  line-height: 1;
  box-shadow: 0 8px 18px rgba(0, 24, 69, 0.05);
  transition: border-color 0.18s ease, background 0.18s ease, color 0.18s ease;
}

.business-catalog-contact-link:hover {
  border-color: rgba(0, 43, 115, 0.24);
  background: rgba(255, 255, 255, 0.78);
  color: var(--brand-blue);
}

.business-catalog-contact-link.is-whatsapp {
  border-color: rgba(0, 191, 166, 0.24);
  color: #008a77;
}

.business-catalog-contact-link.is-whatsapp:hover {
  border-color: rgba(0, 191, 166, 0.38);
  color: #007364;
}

.local-menu-nav-card {
  padding: 12px;
  border-color: #c7dbff;
  background: linear-gradient(145deg, rgba(245, 250, 255, 0.98) 0%, rgba(236, 245, 255, 0.96) 100%);
}

.local-menu-nav-head {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 10px;
  margin-bottom: 8px;
}

.local-menu-nav-head strong {
  color: #0f3871;
  font-size: 0.92rem;
}

.local-menu-nav-head small {
  color: #5b7299;
  font-size: 0.75rem;
}

.local-category-tabs .category-tab {
  background: #ffffff;
  border-color: #bcd5ff;
  cursor: pointer;
  font-family: inherit;
}

.local-category-tabs .category-tab.is-active {
  color: #ffffff;
  background: linear-gradient(135deg, var(--brand-blue), #08649e);
  border-color: transparent;
  box-shadow: 0 10px 22px rgba(0, 43, 115, 0.18);
}

.local-category-tabs .category-tab-soft {
  background: #eefdf9;
  border-color: #b9eee4;
  color: #007b6b;
}

.local-menu-nav-card.is-compact-catalog {
  background:
    radial-gradient(circle at top right, rgba(0, 191, 166, 0.12), transparent 34%),
    linear-gradient(170deg, rgba(255, 255, 255, 0.99) 0%, rgba(245, 250, 255, 0.97) 100%);
}

.local-menu-category-section {
  scroll-margin-top: 84px;
}

.local-product-grid {
  gap: 14px;
}

.local-product-grid.is-compact {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
}

.local-menu-category-section.is-hidden-by-filter,
.product-card.is-hidden-by-filter {
  display: none;
}

.product-card-premium {
  border-color: #c8ddff;
  background: linear-gradient(170deg, rgba(255, 255, 255, 0.98) 0%, rgba(245, 250, 255, 0.96) 100%);
}

.product-card-premium h3 {
  font-size: 1rem;
}

.product-card-premium h3 a {
  color: inherit;
  text-decoration: none;
}

.product-image-link {
  display: block;
  color: inherit;
  text-decoration: none;
}

.product-card-description {
  margin: 0;
  color: #5b7299;
  font-size: 0.86rem;
  line-height: 1.35;
}

.product-catalog-tags {
  gap: 5px;
}

.product-card-compact {
  gap: 7px;
  padding: 10px;
  border-radius: 18px;
}

.product-card-compact .favorite-toggle-form-product {
  top: 8px;
  right: 8px;
}

.product-card-compact .product-image {
  height: auto;
  aspect-ratio: 1.08;
  border-radius: 15px;
}

.product-card-compact h3 {
  min-height: 2.45em;
  margin: 0;
  font-size: 0.86rem;
  line-height: 1.2;
}

.product-card-compact .product-card-description {
  min-height: 2.7em;
  font-size: 0.76rem;
}

.product-card-compact .badge {
  padding: 4px 6px;
  font-size: 0.66rem;
}

.product-card-compact .product-price {
  margin-bottom: 7px;
  font-size: 0.95rem;
}

.product-detail-btn {
  width: 100%;
  justify-content: center;
  margin-bottom: 8px;
}

.product-card-compact .product-add-form {
  display: grid;
  grid-template-columns: 1fr;
}

.product-card-compact .product-add-form .btn {
  width: 100%;
  justify-content: center;
  padding-inline: 8px;
  font-size: 0.78rem;
}

.product-age-tags {
  margin-bottom: 6px;
}

.product-detail-page {
  margin-top: 0.85rem;
}

.product-detail-shell {
  display: grid;
  gap: 1rem;
  padding: 1rem;
  border-radius: 26px;
  background:
    radial-gradient(circle at top right, rgba(0, 191, 166, 0.12), transparent 34%),
    linear-gradient(170deg, rgba(255, 255, 255, 0.99) 0%, rgba(246, 250, 255, 0.98) 100%);
}

.product-detail-top,
.product-detail-head,
.product-detail-cart-card {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.85rem;
}

.product-detail-back {
  gap: 0.4rem;
  border-radius: 999px;
}

.product-detail-head {
  align-items: flex-start;
}

.product-detail-head > div:first-child {
  min-width: 0;
}

.product-detail-head small,
.product-detail-price-label {
  color: #61769c;
  font-size: 0.78rem;
  font-weight: 800;
}

.product-detail-head h1 {
  margin: 0.1rem 0 0;
  color: var(--brand-blue);
  font-size: clamp(1.55rem, 7vw, 2.25rem);
  line-height: 1;
  overflow-wrap: anywhere;
}

.product-detail-favorite {
  position: static;
  flex: 0 0 auto;
}

.product-detail-head-actions {
  display: flex;
  flex: 0 0 auto;
  align-items: center;
  gap: 0.5rem;
}

.product-detail-share {
  display: inline-grid;
  width: 46px;
  height: 46px;
  padding: 0;
  place-items: center;
  border: 1px solid var(--border);
  border-radius: 50%;
  color: var(--brand-blue);
  background: var(--surface);
  cursor: pointer;
  transition: border-color 160ms ease, background-color 160ms ease, color 160ms ease, transform 160ms ease;
}

.product-detail-share:hover {
  border-color: var(--brand-blue);
  background: #edf5ff;
  transform: translateY(-1px);
}

.product-detail-share:disabled {
  cursor: wait;
  opacity: 0.62;
  transform: none;
}

.product-detail-share svg {
  width: 21px;
  height: 21px;
  fill: none;
  stroke: currentColor;
  stroke-linecap: round;
  stroke-linejoin: round;
  stroke-width: 1.8;
}

.product-detail-share.is-loading svg {
  animation: product-share-pulse 800ms ease-in-out infinite alternate;
}

@keyframes product-share-pulse {
  from {
    opacity: 0.45;
  }

  to {
    opacity: 1;
  }
}

.product-detail-gallery {
  display: grid;
  gap: 0.7rem;
}

.product-detail-main-image,
.product-detail-image-placeholder {
  width: 100%;
  aspect-ratio: 1.28;
  border: 1px solid #cfe0ff;
  border-radius: 24px;
  object-fit: cover;
  background: linear-gradient(135deg, #e8f2ff, #d8fbf4);
  box-shadow: 0 18px 34px rgba(0, 24, 69, 0.12);
}

.product-detail-image-placeholder {
  display: grid;
  place-items: center;
  color: var(--brand-blue);
  font-size: 2rem;
  font-weight: 900;
}

.product-detail-thumbs {
  display: flex;
  gap: 0.55rem;
  overflow-x: auto;
  padding-bottom: 2px;
}

.product-detail-thumb {
  flex: 0 0 72px;
  width: 72px;
  height: 72px;
  padding: 3px;
  border: 2px solid transparent;
  border-radius: 17px;
  background: #edf4ff;
  cursor: pointer;
}

.product-detail-thumb.is-active {
  border-color: var(--brand-green);
  background: #e7fbf7;
}

.product-detail-thumb img {
  width: 100%;
  height: 100%;
  border-radius: 13px;
  object-fit: cover;
}

.product-detail-tags {
  margin-top: -0.2rem;
}

.product-detail-description {
  display: grid;
  gap: 0.35rem;
}

.product-detail-description h2 {
  margin: 0;
  color: var(--brand-blue);
  font-size: 1.05rem;
}

.product-detail-description p {
  margin: 0;
  color: #4e6389;
  line-height: 1.55;
}

.product-detail-cart-card {
  padding: 1rem;
  border: 1px solid #bfece5;
  border-radius: 22px;
  background: linear-gradient(135deg, #f4fffd, #edf7ff);
  box-shadow: 0 16px 30px rgba(0, 24, 69, 0.1);
}

.product-detail-price {
  display: block;
  color: var(--brand-blue);
  font-size: 1.45rem;
  line-height: 1.05;
}

.product-detail-add-form {
  justify-content: flex-end;
}

.product-detail-related-section {
  margin-top: 0.8rem;
}

@media (max-width: 520px) {
  .local-product-grid.is-compact {
    gap: 10px;
  }

  .product-card-compact {
    padding: 9px;
  }

  .product-card-compact .product-image {
    border-radius: 14px;
  }

  .product-card-compact h3 {
    font-size: 0.82rem;
  }

  .product-card-compact .product-card-description {
    font-size: 0.72rem;
  }

  .product-detail-cart-card {
    align-items: stretch;
    flex-direction: column;
  }

  .product-detail-add-form {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
  }
}

.local-promo-tags {
  margin-top: 10px;
}

.local-promo-grid.is-dense {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.local-promo-grid.is-dense .card {
  height: 100%;
  overflow-wrap: anywhere;
}

.local-promo-grid.is-dense .badge,
.local-promo-grid.is-dense .badge-text {
  max-width: 100%;
  white-space: normal;
}

.catalog-filter-empty {
  margin: 0 0 1rem;
}

.catalog-load-more {
  display: grid;
  justify-items: center;
  gap: 0.55rem;
  padding: 0.25rem 1rem calc(1rem + env(safe-area-inset-bottom, 0px));
}

.catalog-load-more[hidden] {
  display: none;
}

.catalog-load-more__button {
  width: min(100%, 420px);
  min-height: 48px;
  justify-content: center;
}

.catalog-load-more__status {
  color: var(--text-soft);
  font-size: 0.84rem;
  text-align: center;
}

.customer-favorites-card {
  border-color: #cfe0ff;
  background: linear-gradient(165deg, rgba(255, 255, 255, 0.99) 0%, rgba(244, 250, 255, 0.98) 100%);
}

.customer-favorites-grid {
  display: grid;
  gap: 14px;
  margin-top: 14px;
}

.customer-favorites-block {
  border: 1px solid #d6e5ff;
  border-radius: 14px;
  padding: 12px;
  background: rgba(255, 255, 255, 0.74);
}

.customer-favorites-block-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  margin-bottom: 10px;
}

.customer-favorites-block-head h3 {
  margin: 0;
  color: #11396f;
  font-size: 0.95rem;
}

.customer-favorite-list {
  display: grid;
  gap: 10px;
}

.customer-favorite-item {
  border: 1px solid #cde0ff;
  border-radius: 13px;
  padding: 11px;
  background: #fff;
  box-shadow: 0 10px 24px rgba(0, 24, 69, 0.08);
}

.customer-favorite-item-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 10px;
  margin-bottom: 8px;
}

.customer-favorite-title-wrap {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  min-width: 0;
}

.customer-favorite-title-wrap h4 {
  margin: 0;
  color: #123a72;
  font-size: 0.92rem;
}

.customer-favorite-logo,
.customer-favorite-product-image {
  width: 44px;
  height: 44px;
  border-radius: 10px;
  object-fit: cover;
  border: 1px solid #cfe1ff;
  background: #fff;
  flex-shrink: 0;
}

.customer-favorite-status {
  margin-top: 5px;
  display: inline-flex;
  align-items: center;
  border-radius: 999px;
  border: 1px solid #c7dcff;
  background: #edf4ff;
  color: #124177;
  font-size: 0.67rem;
  font-weight: 800;
  padding: 4px 8px;
}

.customer-favorite-status.is-open {
  border-color: #7adfcd;
  background: #defcf6;
  color: #0c6d60;
}

.customer-favorite-status.is-closed {
  border-color: #ffd0be;
  background: #fff0ea;
  color: #ad4f1d;
}

.customer-favorite-note {
  margin: 6px 0 0;
  color: #92521c;
  font-weight: 700;
  font-size: 0.78rem;
}

.customer-favorite-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin-top: 6px;
}

.customer-badge-muted {
  color: #5d6b7d;
  background: #eef2f7;
  border-color: #d5deea;
}

.customer-favorite-actions {
  margin-top: 10px;
}

.customer-favorite-business-cta {
  position: relative;
  display: inline-grid;
  grid-template-columns: 18px auto 18px;
  align-items: center;
  gap: 10px;
  min-width: 168px;
  min-height: 44px;
  padding: 10px 16px;
  border-radius: 14px;
  font-size: 0.92rem;
  font-weight: 800;
  text-align: left;
  box-shadow: 0 8px 18px rgba(0, 43, 115, 0.16);
  overflow: hidden;
  transition: transform 0.16s ease, box-shadow 0.18s ease, filter 0.18s ease;
}

.customer-favorite-business-cta::before {
  content: "";
  width: 18px;
  height: 18px;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='white'%3E%3Cpath d='M5 6.5A1.5 1.5 0 0 1 6.5 5h11A1.5 1.5 0 0 1 19 6.5v2A1.5 1.5 0 0 1 17.5 10h-11A1.5 1.5 0 0 1 5 8.5Zm0 9A1.5 1.5 0 0 1 6.5 14h11a1.5 1.5 0 0 1 0 3h-11A1.5 1.5 0 0 1 5 15.5Zm0-4.5A1.5 1.5 0 0 1 6.5 9h11a1.5 1.5 0 0 1 0 3h-11A1.5 1.5 0 0 1 5 11Z'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: center;
  background-size: 18px 18px;
  transition: transform 0.18s ease;
}

.customer-favorite-business-cta::after {
  content: "";
  width: 18px;
  height: 18px;
  border-radius: 999px;
  background-color: rgba(255, 255, 255, 0.16);
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='2.3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m9 6 6 6-6 6'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: center;
  background-size: 14px 14px;
  transition: transform 0.18s ease, background-color 0.18s ease;
}

.customer-favorite-business-cta:hover {
  transform: translateY(-1px);
  box-shadow: 0 12px 24px rgba(0, 43, 115, 0.22);
  filter: saturate(1.03);
}

.customer-favorite-business-cta:hover::before {
  transform: translateX(-1px);
}

.customer-favorite-business-cta:hover::after {
  transform: translateX(2px) scale(1.06);
  background-color: rgba(255, 255, 255, 0.24);
}

.customer-favorite-business-cta:active {
  transform: translateY(0) scale(0.985);
}

.customer-favorite-remove-inline .btn {
  min-width: 120px;
  padding-inline: 16px;
}

.customer-favorite-remove-product-btn {
  min-width: 156px;
  padding-inline: 22px;
  justify-content: center;
}

.customer-favorite-item-product .customer-favorite-remove-inline {
  width: 100%;
  max-width: 228px;
}

.customer-favorite-item-product .customer-favorite-remove-inline .customer-favorite-remove-product-btn {
  width: 100%;
}

.customer-favorite-actions-split {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
}

.customer-favorite-actions-split .btn,
.customer-favorite-actions-split .customer-favorite-add-form .btn {
  width: 100%;
  justify-content: center;
}

.customer-favorite-add-form {
  margin: 0;
}

.customer-favorite-remove-form {
  position: static;
}

.favorite-cart-modal {
  position: fixed;
  inset: 0;
  z-index: 910;
  display: flex;
  align-items: flex-end;
  justify-content: center;
  opacity: 0;
  pointer-events: none;
  transition: opacity 0.18s ease;
}

.favorite-cart-modal.is-open {
  opacity: 1;
  pointer-events: auto;
}

.favorite-cart-modal__backdrop {
  position: absolute;
  inset: 0;
  background: rgba(0, 30, 74, 0.42);
  backdrop-filter: blur(2px);
}

.favorite-cart-modal__dialog {
  position: relative;
  width: min(560px, calc(100% - 24px));
  margin: 0 12px 14px;
  border-radius: 18px;
  border: 1px solid #bed6ff;
  background: #fff;
  padding: 16px;
  box-shadow: 0 24px 44px rgba(0, 23, 64, 0.24);
  transform: translateY(12px);
  transition: transform 0.18s ease;
}

.favorite-cart-modal.is-open .favorite-cart-modal__dialog {
  transform: translateY(0);
}

.favorite-cart-modal__dialog h3 {
  margin: 8px 0 4px;
  color: var(--brand-blue);
  font-size: 1.02rem;
}

.favorite-cart-modal__product {
  margin: 0 0 12px;
  font-size: 0.95rem;
  font-weight: 800;
  color: #0f326e;
}

.favorite-cart-modal__form {
  display: grid;
  gap: 12px;
}

.favorite-cart-modal__qty label {
  display: block;
  margin-bottom: 6px;
  color: #1a417a;
  font-weight: 700;
  font-size: 0.85rem;
}

.favorite-cart-modal__qty-controls {
  display: grid;
  grid-template-columns: 88px 1fr 88px;
  gap: 8px;
  align-items: center;
}

.favorite-cart-modal__qty-controls .input {
  text-align: center;
  font-weight: 800;
  min-height: 40px;
}

.favorite-cart-modal__qty-controls .btn {
  min-height: 40px;
}

.favorite-cart-modal__actions {
  justify-content: flex-end;
}

@media (max-width: 759px) {
  .open-food-callout {
    align-items: center;
  }

  .open-food-callout-cta {
    width: auto;
    justify-content: flex-start;
  }

  .vertical-discovery-head {
    align-items: stretch;
  }

  .vertical-discovery-link {
    margin-top: 2px;
  }

  .vertical-discovery-panel {
    margin-bottom: 8px;
    padding: 12px;
    border-radius: 16px;
  }

  .vertical-tile {
    flex-basis: 64px;
  }

  .vertical-tile-media {
    width: 64px;
    height: 64px;
    border-radius: 16px;
  }

  .vertical-tile-icon-svg {
    width: 30px;
    height: 30px;
  }

  .vertical-tile-media-all svg {
    width: 23px;
    height: 23px;
  }

  .home-results-foot {
    align-items: stretch;
  }

  .home-load-more-btn {
    width: 100%;
  }

  .local-menu-nav-head {
    flex-direction: column;
    align-items: flex-start;
    gap: 4px;
  }

  .customer-favorite-item-head {
    flex-direction: column;
    align-items: stretch;
  }

  .customer-favorite-remove-form .btn {
    width: 100%;
  }

  .customer-favorite-remove-inline .btn {
    width: auto;
    min-width: 124px;
  }

  .customer-favorite-remove-product-btn {
    min-width: 140px;
  }

  .customer-favorite-item-product .customer-favorite-remove-inline {
    max-width: 100%;
  }

  .customer-favorite-business-cta {
    width: 100%;
    min-width: 0;
    max-width: 100%;
    min-height: 46px;
    font-size: 0.96rem;
  }

  .home-business-cta {
    width: 100%;
    min-width: 0;
    max-width: 100%;
    min-height: 48px;
    font-size: 1rem;
    padding: 12px 16px;
  }

  .favorite-cart-modal__qty-controls {
    grid-template-columns: 1fr 1fr 1fr;
  }

  .business-head {
    align-items: flex-start;
  }

  .business-head-status {
    margin-left: 0;
  }

  .home-business-grid {
    gap: 16px;
  }

  .business-facade-card {
    border-radius: 24px;
  }

  .business-facade-stage {
    min-height: 168px;
    padding: 14px 14px 0;
    border-radius: 23px 23px 0 0;
  }

  .business-facade-building {
    width: min(86%, 300px);
  }

  .business-facade-title-row {
    grid-template-columns: 1fr;
  }

  .business-facade-card .operational-indicator {
    max-width: 100%;
    justify-self: start;
  }

}

@media (max-width: 520px) {
  .open-food-callout {
    gap: 10px;
    padding: 12px 14px;
  }

  .open-food-callout-copy h2 {
    font-size: 1rem;
  }

  .open-food-callout-copy p {
    font-size: 0.86rem;
  }

  .open-food-callout-cta {
    padding: 8px 12px;
    font-size: 0.86rem;
  }
}

body.theme-dark .business-card-home {
  border-color: #355a93;
  background: linear-gradient(170deg, rgba(16, 35, 70, 0.96) 0%, rgba(15, 32, 65, 0.96) 100%);
}

body.theme-dark .business-facade-card {
  border-color: rgba(102, 145, 214, 0.36);
  background:
    linear-gradient(180deg, rgba(17, 36, 72, 0.96), rgba(12, 28, 58, 0.98)),
    #102346;
  box-shadow: 0 18px 38px rgba(0, 0, 0, 0.28);
}

body.theme-dark .business-facade-content {
  border-top-color: rgba(132, 174, 239, 0.16);
  background: rgba(13, 30, 62, 0.98);
}

body.theme-dark .business-facade-title-row h3 {
  color: #dceaff;
}

body.theme-dark .business-facade-title-row p {
  color: #a9bddc;
}

body.theme-dark .business-facade-front {
  background: rgba(229, 239, 255, 0.94);
}

body.theme-dark .business-facade-window {
  background:
    linear-gradient(135deg, rgba(0, 43, 115, 0.12), rgba(0, 191, 166, 0.16)),
    #dceaff;
}

body.theme-dark .business-facade-card-premium-luxury,
body.theme-dark .business-facade-card-premium-neon,
body.theme-dark .business-facade-card-premium-showcase {
  border-color: color-mix(in srgb, var(--facade-c, #22d3c2) 46%, rgba(102, 145, 214, 0.36));
  box-shadow:
    0 22px 46px rgba(0, 0, 0, 0.38),
    0 0 0 1px color-mix(in srgb, var(--facade-c, #22d3c2) 22%, transparent);
}

body.theme-dark .business-facade-card-premium-neon .business-facade-front {
  background: rgba(7, 18, 45, 0.92);
}

body.theme-dark .business-facade-card-premium-neon .business-facade-window {
  background: rgba(255, 255, 255, 0.08);
  color: #fff;
}

body.theme-dark .business-facade-card-premium-luxury .business-facade-content {
  background: linear-gradient(180deg, rgba(8, 34, 52, 0.96), rgba(5, 22, 44, 0.98));
}

body.theme-dark .business-facade-card-premium-neon .business-facade-content {
  background: linear-gradient(180deg, rgba(6, 17, 38, 0.98), rgba(4, 11, 24, 0.98));
}

body.theme-dark .business-facade-card-premium-showcase .business-facade-content {
  background: linear-gradient(180deg, rgba(255, 255, 255, 0.98), rgba(240, 255, 252, 0.98));
}

body.theme-dark .business-facade-card-premium-luxury .business-facade-title-row h3 {
  color: #f7fffb;
}

body.theme-dark .business-facade-card-premium-neon .business-facade-title-row h3 {
  color: #e9ffff;
}

body.theme-dark .business-facade-card-premium-showcase .business-facade-title-row h3 {
  color: #002b73;
}

body.theme-dark .business-facade-card-premium-luxury .business-facade-title-row p,
body.theme-dark .business-facade-card-premium-luxury .business-availability-note {
  color: rgba(221, 247, 245, 0.78);
}

body.theme-dark .business-facade-card-premium-neon .business-facade-title-row p,
body.theme-dark .business-facade-card-premium-neon .business-availability-note {
  color: rgba(189, 233, 246, 0.78);
}

body.theme-dark .business-facade-card-premium-showcase .business-facade-title-row p {
  color: #4f6791;
}

body.theme-dark .home-featured-spotlight-card {
  color: #e8f2ff;
  border-color: #355a93;
  background: rgba(15, 32, 65, 0.96);
  box-shadow: 0 14px 28px rgba(2, 10, 28, 0.34);
}

body.theme-dark .home-featured-spotlight-card:hover,
body.theme-dark .home-featured-spotlight-card:focus-visible {
  color: #e8f2ff;
  border-color: #5687ca;
  box-shadow: 0 17px 32px rgba(2, 10, 28, 0.42);
}

body.theme-dark .home-featured-spotlight-logo {
  color: #a9d9ff;
  border-color: #355a93;
  background: #183668;
}

body.theme-dark .home-featured-spotlight-copy strong {
  color: #eef6ff;
}

body.theme-dark .home-featured-spotlight-copy > span {
  color: #a9bedf;
}

body.theme-dark .home-featured-spotlight-arrow {
  color: #9cd8ff;
  border-color: #355a93;
  background: #17315f;
}

body.theme-dark .home-featured-spotlight-indicators button {
  background: #49658f;
}

body.theme-dark .home-featured-spotlight-indicators button.is-active {
  background: #83f1df;
}

body.theme-dark .home-banner-control-icon {
  background: rgba(6, 16, 38, 0.72);
  border-color: rgba(181, 208, 255, 0.22);
}

body.theme-dark .open-food-now-hero {
  border-color: #355a93;
  background:
    radial-gradient(circle at top right, rgba(214, 66, 2, 0.18), transparent 38%),
    linear-gradient(170deg, rgba(16, 35, 70, 0.96) 0%, rgba(15, 32, 65, 0.96) 100%);
}

body.theme-dark .open-food-now-location {
  color: #c8dcfb;
}

body.theme-dark .open-food-closing-pill {
  background: rgba(37, 74, 132, 0.2);
  color: #d7e7ff;
  border-color: rgba(143, 180, 233, 0.24);
}

body.theme-dark .home-results-text {
  color: #9fbbdf;
}

body.theme-dark .local-menu-nav-card {
  border-color: #355c95;
  background: linear-gradient(145deg, rgba(15, 34, 68, 0.96) 0%, rgba(18, 41, 82, 0.96) 100%);
}

body.theme-dark .local-menu-nav-head strong {
  color: #d8e9ff;
}

body.theme-dark .local-menu-nav-head small {
  color: #9fb8dd;
}

body.theme-dark .local-category-tabs .category-tab {
  background: #122a56;
  border-color: #365d96;
}

body.theme-dark .local-category-tabs .category-tab.is-active {
  color: #ffffff;
  background: linear-gradient(135deg, #0f5ea8, #008d91);
  border-color: transparent;
}

body.theme-dark .local-category-tabs .category-tab-soft {
  background: rgba(0, 191, 166, 0.12);
  border-color: rgba(0, 191, 166, 0.36);
  color: #85efe0;
}

body.theme-dark .product-card-premium {
  border-color: #365c95;
  background: linear-gradient(170deg, rgba(15, 34, 68, 0.96) 0%, rgba(18, 41, 82, 0.96) 100%);
}

body.theme-dark .product-card-description,
body.theme-dark .product-detail-description p,
body.theme-dark .product-detail-head small,
body.theme-dark .product-detail-price-label {
  color: #b9cdea;
}

body.theme-dark .product-detail-shell,
body.theme-dark .local-menu-nav-card.is-compact-catalog {
  border-color: #365c95;
  background:
    radial-gradient(circle at top right, rgba(0, 191, 166, 0.14), transparent 34%),
    linear-gradient(170deg, rgba(15, 34, 68, 0.96) 0%, rgba(18, 41, 82, 0.96) 100%);
}

body.theme-dark .product-detail-head h1,
body.theme-dark .product-detail-description h2,
body.theme-dark .product-detail-price {
  color: #eaf4ff;
}

body.theme-dark .product-detail-cart-card {
  border-color: rgba(0, 191, 166, 0.34);
  background: linear-gradient(135deg, rgba(0, 191, 166, 0.12), rgba(16, 38, 76, 0.96));
}

body.theme-dark .product-detail-thumb {
  background: #122a56;
}

body.theme-dark .product-detail-share {
  border-color: #41699f;
  color: #dceaff;
  background: #122a56;
}

body.theme-dark .product-detail-share:hover {
  border-color: #73a7e8;
  background: #18376c;
}

body.theme-dark .business-hero-note {
  color: #d4e6ff;
}

body.theme-dark .business-public-hero {
  border-color: rgba(75, 124, 194, 0.34);
  background:
    radial-gradient(circle at 20% 0%, rgba(255, 255, 255, 0.08), transparent 32%),
    linear-gradient(145deg, color-mix(in srgb, var(--facade-a, #003b8d) 32%, #091a36), color-mix(in srgb, var(--facade-b, #0ab9aa) 24%, #0d2348));
  box-shadow: 0 22px 46px rgba(1, 6, 20, 0.42);
}

body.theme-dark .business-public-hero .business-hero-body {
  border-color: rgba(82, 134, 210, 0.34);
  background: rgba(13, 31, 63, 0.9);
  box-shadow: 0 14px 30px rgba(0, 0, 0, 0.26);
}

body.theme-dark .business-public-hero .brand-tag {
  background: rgba(255, 255, 255, 0.1);
  border-color: color-mix(in srgb, var(--facade-c, #22d3c2) 44%, rgba(255, 255, 255, 0.22));
  color: #ffe2ba;
}

body.theme-dark .business-public-hero .lead {
  color: #d5e5ff;
}

body.theme-dark .business-verified-modal {
  border-color: rgba(255, 215, 122, 0.34);
  background:
    radial-gradient(circle at top left, rgba(255, 215, 122, 0.12), transparent 34%),
    linear-gradient(145deg, rgba(12, 29, 61, 0.98), rgba(7, 20, 44, 0.98));
  box-shadow: 0 24px 70px rgba(0, 0, 0, 0.5);
}

body.theme-dark .business-verified-modal h2 {
  color: #f5fbff;
}

body.theme-dark .business-verified-modal p {
  color: #c7d7f1;
}

body.theme-dark .business-verified-modal-close {
  color: #d9e7ff;
  background: rgba(40, 60, 96, 0.92);
}

body.theme-dark .business-hero-note-soft {
  color: #b9cdea;
}

body.theme-dark .business-profile-card {
  border-color: #355c95;
  background: linear-gradient(170deg, rgba(16, 35, 70, 0.96) 0%, rgba(15, 32, 65, 0.96) 100%);
}

body.theme-dark .business-profile-action {
  border-color: #365c95;
  background: linear-gradient(145deg, rgba(15, 34, 68, 0.96), rgba(18, 41, 82, 0.96));
  color: #d8e9ff;
}

body.theme-dark .business-profile-action:hover {
  border-color: rgba(0, 191, 166, 0.4);
  color: #fff;
}

body.theme-dark .business-profile-action-icon {
  background: rgba(181, 208, 255, 0.12);
  color: #d8e9ff;
}

body.theme-dark .business-profile-action.is-whatsapp .business-profile-action-icon {
  background: rgba(0, 191, 166, 0.18);
  color: #78fff0;
}

body.theme-dark .business-profile-action small {
  color: #9fb8dd;
}

body.theme-dark .business-catalog-contact-link {
  border-color: rgba(80, 128, 196, 0.34);
  background: rgba(16, 35, 70, 0.44);
  color: #b9cdea;
  box-shadow: none;
}

body.theme-dark .business-catalog-contact-link:hover {
  border-color: rgba(120, 165, 225, 0.48);
  background: rgba(22, 48, 94, 0.68);
  color: #eef6ff;
}

body.theme-dark .business-catalog-contact-link.is-whatsapp {
  border-color: rgba(0, 191, 166, 0.34);
  color: #78fff0;
}

body.theme-dark .business-catalog-contact-link.is-whatsapp:hover {
  border-color: rgba(0, 191, 166, 0.5);
  color: #bbfff8;
}

body.theme-dark .business-profile-gallery-card {
  border-color: #365c95;
  background: #102650;
}

body.theme-dark .business-profile-gallery-arrow,
body.theme-dark .business-profile-gallery-lightbox-close,
body.theme-dark .business-profile-gallery-lightbox-nav {
  border-color: #426ba8;
  background: rgba(16, 36, 72, 0.96);
  color: #d8e9ff;
}

body.theme-dark .business-profile-gallery-lightbox-dialog {
  background: rgba(11, 26, 54, 0.98);
}

body.theme-dark .business-profile-gallery-lightbox-dialog p {
  color: #d8e9ff;
}

body.theme-dark .promo-inline .brand-tag {
  background: rgba(255, 243, 224, 0.94);
  border-color: rgba(255, 196, 120, 0.72);
  color: #8a4800;
}

body.theme-dark .favorite-toggle-btn {
  border-color: #3b629d;
  background: rgba(16, 36, 72, 0.92);
  color: #cfe3ff;
}

body.theme-dark .favorite-toggle-btn.is-active {
  border-color: var(--client-accent-border);
  background: rgba(77, 41, 0, 0.46);
  color: #ffc98a;
  box-shadow: 0 10px 20px var(--client-accent-glow);
}

body.theme-dark .business-like-control {
  border-color: #365a8f;
  color: #c8dcfb;
  background: rgba(13, 32, 66, 0.9);
  box-shadow: 0 8px 18px rgba(1, 9, 24, 0.2);
}

body.theme-dark .business-like-control.is-active {
  border-color: var(--client-accent-border);
  color: var(--client-accent-ink);
  background: var(--client-accent-soft);
  box-shadow: 0 8px 18px var(--client-accent-glow);
}

body.theme-dark .operational-indicator {
  border-color: #3b629d;
  background: #152f5e;
  color: #d8e8ff;
}

body.theme-dark .operational-indicator .operational-dot {
  box-shadow: 0 0 0 2px rgba(79, 209, 191, 0.18);
}

body.theme-dark .operational-indicator.is-outside {
  border-color: #73603a;
  background: #312812;
  color: #f2d184;
}

body.theme-dark .operational-indicator.is-outside .operational-dot {
  background: #f2bf4b;
  box-shadow: 0 0 0 2px rgba(242, 191, 75, 0.2);
}

body.theme-dark .operational-indicator.is-paused {
  border-color: #405571;
  background: #22334d;
  color: #b9c8dc;
}

body.theme-dark .operational-indicator.is-paused .operational-dot {
  background: #8ea0b7;
  box-shadow: 0 0 0 2px rgba(142, 160, 183, 0.2);
}

body.theme-dark .business-logo-placeholder {
  border-color: #385c94;
  background: linear-gradient(145deg, #17315f 0%, #1a386d 100%);
}

body.theme-dark .business-logo-status-dot {
  border-color: #102347;
  box-shadow: 0 0 0 2px rgba(79, 209, 191, 0.2);
}

body.theme-dark .business-logo-status-dot.status-outside {
  box-shadow: 0 0 0 2px rgba(242, 191, 75, 0.2);
}

body.theme-dark .business-logo-status-dot.status-paused {
  box-shadow: 0 0 0 2px rgba(142, 160, 183, 0.2);
}

body.theme-dark .business-availability-note {
  color: #bbd1ee;
}

body.theme-dark .business-unavailable-card {
  border-color: #7e5c3c;
  background: linear-gradient(145deg, rgba(44, 31, 20, 0.94), rgba(56, 37, 21, 0.94));
}

body.theme-dark .business-unavailable-note {
  color: #ffd6ab;
}

body.theme-dark .customer-favorites-card {
  border-color: #355b95;
  background: linear-gradient(165deg, rgba(15, 34, 69, 0.96) 0%, rgba(18, 41, 82, 0.96) 100%);
}

body.theme-dark .customer-favorites-block {
  border-color: #355c95;
  background: rgba(14, 31, 63, 0.88);
}

body.theme-dark .customer-favorites-block-head h3,
body.theme-dark .customer-favorite-title-wrap h4 {
  color: #d6e8ff;
}

body.theme-dark .customer-favorite-item {
  border-color: #355a93;
  background: #11264d;
  box-shadow: 0 12px 26px rgba(0, 0, 0, 0.26);
}

body.theme-dark .customer-favorite-logo,
body.theme-dark .customer-favorite-product-image {
  border-color: #39629d;
}

body.theme-dark .customer-favorite-status {
  border-color: #3a629b;
  background: #17325f;
  color: #cfe3ff;
}

body.theme-dark .customer-favorite-status.is-open {
  border-color: #3f9d90;
  background: #113d45;
  color: #9df1e3;
}

body.theme-dark .customer-favorite-status.is-closed {
  border-color: #8f5b38;
  background: #3e2b1d;
  color: #ffd6b4;
}

body.theme-dark .customer-favorite-note {
  color: #ffd1a8;
}

body.theme-dark .customer-badge-muted {
  color: #c4cfdd;
  background: #2b3e5f;
  border-color: #405a84;
}

body.theme-dark .favorite-cart-modal__dialog {
  border-color: #365d96;
  background: #102347;
  box-shadow: 0 18px 36px rgba(0, 0, 0, 0.4);
}

body.theme-dark .favorite-cart-modal__product {
  color: #dbe9ff;
}

body.theme-dark .favorite-cart-modal__qty label {
  color: #b8cff0;
}

.portal-page {
  min-height: 100vh;
  background:
    radial-gradient(circle at 8% 12%, rgba(0, 191, 166, 0.18), transparent 30%),
    radial-gradient(circle at 90% 0%, rgba(0, 43, 115, 0.22), transparent 36%),
    linear-gradient(145deg, #f5fbff 0%, #eaf4ff 48%, #ffffff 100%);
}

.portal-shell {
  width: min(1120px, 94%);
  margin: 0 auto;
  padding: 18px 0 32px;
}

.portal-topbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  padding: 14px;
  border: 1px solid var(--border);
  border-radius: 26px;
  background: rgba(255, 255, 255, 0.88);
  box-shadow: var(--shadow-soft);
  backdrop-filter: blur(12px);
}

.portal-brand,
.portal-login-link {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  text-decoration: none;
  color: var(--brand-blue);
  font-weight: 800;
}

.portal-brand img {
  width: 34px;
  height: 34px;
  border-radius: 12px;
  object-fit: cover;
}

.portal-login-link {
  min-height: 42px;
  padding: 0 16px;
  border: 1px solid #bdd4ff;
  border-radius: 16px;
  background: #fff;
}

.portal-hero {
  display: grid;
  grid-template-columns: minmax(0, 1.05fr) minmax(320px, 0.95fr);
  gap: 22px;
  align-items: stretch;
  margin-top: 22px;
}

.portal-hero-simple {
  grid-template-columns: 1fr;
}

.portal-hero-copy,
.portal-path-card,
.portal-strip {
  border: 1px solid var(--border);
  border-radius: 30px;
  background: rgba(255, 255, 255, 0.9);
  box-shadow: var(--shadow-strong);
}

.portal-hero-copy {
  padding: clamp(28px, 5vw, 54px);
  background:
    linear-gradient(135deg, rgba(0, 43, 115, 0.95) 0%, rgba(0, 117, 157, 0.92) 58%, rgba(0, 191, 166, 0.88) 100%);
  color: #fff;
}

.portal-hero-copy h1 {
  max-width: 720px;
  margin: 18px 0 14px;
  color: #fff;
  font-size: clamp(2.35rem, 7vw, 4.8rem);
  line-height: 0.95;
  letter-spacing: -0.07em;
}

.portal-hero-copy p {
  max-width: 620px;
  color: rgba(255, 255, 255, 0.86);
  font-size: 1.05rem;
  line-height: 1.6;
}

.portal-simple-hero {
  min-height: calc(100vh - 150px);
  display: flex;
  flex-direction: column;
  justify-content: center;
}

.portal-simple-hero h1 {
  max-width: 780px;
  font-size: clamp(2rem, 6.4vw, 4.35rem);
}

.portal-entry-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
  margin-top: 30px;
  max-width: 760px;
}

.portal-entry-card {
  display: grid;
  grid-template-columns: 42px minmax(0, 1fr);
  align-items: center;
  gap: 12px;
  min-height: 82px;
  padding: 14px;
  border: 1px solid rgba(255, 255, 255, 0.28);
  border-radius: 18px;
  background: rgba(255, 255, 255, 0.94);
  color: var(--brand-blue);
  text-decoration: none;
  box-shadow: 0 12px 28px rgba(0, 24, 69, 0.12);
  transition: transform 0.16s ease, box-shadow 0.18s ease, background 0.18s ease;
}

.portal-entry-card:hover {
  transform: translateY(-2px);
  box-shadow: 0 16px 34px rgba(0, 24, 69, 0.18);
}

.portal-entry-card strong,
.portal-entry-card small {
  display: block;
}

.portal-entry-card strong {
  font-size: 0.98rem;
}

.portal-entry-card small {
  margin-top: 2px;
  color: #4f6692;
  font-size: 0.78rem;
  line-height: 1.35;
}

.portal-entry-primary {
  background: var(--brand-blue);
  color: #fff;
}

.portal-entry-primary small {
  color: #cfe0ff;
}

.portal-entry-icon {
  display: inline-grid;
  place-items: center;
  width: 42px;
  height: 42px;
  border-radius: 14px;
  background: #dffaf5;
  color: #00786a;
}

.portal-entry-primary .portal-entry-icon {
  background: rgba(255, 255, 255, 0.15);
  color: #ffffff;
}

.portal-entry-icon svg {
  width: 21px;
  height: 21px;
  fill: none;
  stroke: currentColor;
  stroke-width: 2;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.portal-microcopy {
  margin-top: 18px;
  font-size: 0.86rem !important;
  color: rgba(255, 255, 255, 0.76) !important;
}

.portal-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  margin-top: 28px;
}

.portal-main-action {
  min-height: 52px;
  padding-inline: 20px;
}

.portal-card-stack {
  display: grid;
  gap: 16px;
}

.portal-path-card {
  padding: 24px;
}

.portal-path-card h2 {
  margin: 14px 0 8px;
  font-size: 1.65rem;
}

.portal-path-card p {
  color: var(--text-soft);
  line-height: 1.55;
}

.portal-card-icon {
  display: inline-grid;
  place-items: center;
  width: 48px;
  height: 48px;
  border-radius: 18px;
  background: #dffaf5;
  color: #00695e;
  font-weight: 900;
}

.portal-path-card-business .portal-card-icon {
  background: #e3edff;
  color: var(--brand-blue);
}

.portal-strip {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 12px;
  margin-top: 18px;
  padding: 16px;
}

.portal-strip div {
  padding: 14px;
  border-radius: 20px;
  background: #f7fbff;
}

.portal-strip strong,
.portal-strip span {
  display: block;
}

.portal-strip strong {
  color: var(--brand-blue);
}

.portal-strip span {
  margin-top: 3px;
  color: var(--text-soft);
  font-size: 0.92rem;
}

.form-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px;
}

.form-shell.auth-business-shell {
  width: min(980px, 100%);
  margin: 44px auto 28px;
}

.auth-premium-card {
  overflow: hidden;
  padding: 0;
  border: 1px solid rgba(0, 43, 115, 0.18);
  border-radius: 24px;
  background: #ffffff;
  box-shadow: 0 28px 70px rgba(0, 43, 115, 0.17);
}

.auth-business-layout {
  display: grid;
  grid-template-columns: minmax(0, 0.88fr) minmax(0, 1.12fr);
  min-height: 560px;
}

.auth-business-intro {
  position: relative;
  display: flex;
  flex-direction: column;
  min-width: 0;
  padding: 42px;
  overflow: hidden;
  color: #ffffff;
  background-color: #002b73;
  background-image:
    linear-gradient(rgba(255, 255, 255, 0.035) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255, 255, 255, 0.035) 1px, transparent 1px);
  background-size: 38px 38px;
}

.auth-business-intro::before {
  content: "";
  position: absolute;
  inset: 0 0 auto;
  height: 6px;
  background: linear-gradient(90deg, #f57c00 0 33%, #ffffff 33% 66%, #00bfa6 66% 100%);
}

.auth-business-kicker,
.auth-business-role-note,
.auth-client-path {
  position: relative;
  z-index: 1;
}

.auth-business-kicker {
  display: inline-flex;
  align-items: center;
  gap: 12px;
  color: rgba(255, 255, 255, 0.84);
  font-size: 0.78rem;
  font-weight: 800;
  text-transform: uppercase;
}

.auth-business-mark {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 48px;
  height: 48px;
  flex: 0 0 48px;
  border: 1px solid rgba(255, 255, 255, 0.28);
  border-radius: 15px;
  color: #002b73;
  background: #ffffff;
  box-shadow: 0 16px 32px rgba(0, 12, 42, 0.24);
}

.auth-business-mark svg,
.auth-business-role-note svg,
.auth-input-wrap > svg,
.auth-password-toggle svg,
.auth-submit-button svg {
  width: 22px;
  height: 22px;
  fill: currentColor;
}

.auth-business-heading {
  position: relative;
  z-index: 1;
  margin: auto 0;
  padding: 46px 0;
}

.auth-business-heading .brand-tag {
  border-color: rgba(255, 255, 255, 0.28);
  color: #ffffff;
  background: rgba(255, 255, 255, 0.1);
}

.auth-business-heading h1 {
  margin: 18px 0 14px;
  color: #ffffff;
  font-size: 2.15rem;
  line-height: 1.12;
}

.auth-business-heading p {
  max-width: 31rem;
  margin: 0;
  color: rgba(255, 255, 255, 0.78);
  font-size: 1rem;
  line-height: 1.6;
}

.auth-business-role-note {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  align-items: center;
  gap: 11px;
  padding: 13px 0;
  border-top: 1px solid rgba(255, 255, 255, 0.14);
  border-bottom: 1px solid rgba(255, 255, 255, 0.14);
  color: rgba(255, 255, 255, 0.84);
  font-size: 0.84rem;
  line-height: 1.45;
}

.auth-business-role-note svg {
  color: #6de8d8;
}

.auth-client-path {
  display: flex;
  flex-wrap: wrap;
  gap: 5px 8px;
  margin-top: 17px;
  color: rgba(255, 255, 255, 0.72);
  font-size: 0.8rem;
}

.auth-client-path a {
  color: #ffffff;
  font-weight: 800;
  text-underline-offset: 3px;
}

.auth-business-form-panel {
  display: flex;
  flex-direction: column;
  justify-content: center;
  min-width: 0;
  padding: 42px 46px;
}

.auth-form-heading {
  margin-bottom: 23px;
}

.auth-form-eyebrow {
  color: #008c7b;
  font-size: 0.75rem;
  font-weight: 900;
  text-transform: uppercase;
}

.auth-form-heading h2 {
  margin: 7px 0 5px;
  color: var(--brand-blue);
  font-size: 1.75rem;
}

.auth-form-heading p {
  margin: 0;
  color: var(--text-soft);
  font-size: 0.9rem;
}

.auth-form-group {
  margin-bottom: 17px;
}

.auth-form-group > label,
.auth-label-row label {
  color: var(--brand-blue);
  font-size: 0.83rem;
  font-weight: 800;
}

.auth-label-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 6px;
}

.auth-label-row label {
  margin: 0;
}

.auth-label-row a {
  color: #315f9f;
  font-size: 0.75rem;
  font-weight: 800;
  text-decoration: none;
}

.auth-label-row a:hover {
  text-decoration: underline;
  text-underline-offset: 3px;
}

.auth-input-wrap {
  position: relative;
  color: #5273a7;
}

.auth-input-wrap > svg {
  position: absolute;
  z-index: 2;
  top: 50%;
  left: 15px;
  width: 20px;
  height: 20px;
  transform: translateY(-50%);
  pointer-events: none;
}

.auth-input-wrap .input {
  min-height: 52px;
  padding: 12px 46px;
  border-radius: 14px;
  font-size: 0.92rem;
}

.auth-password-wrap .input {
  padding-right: 52px;
}

.auth-password-toggle {
  position: absolute;
  z-index: 3;
  top: 50%;
  right: 7px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 40px;
  height: 40px;
  padding: 0;
  transform: translateY(-50%);
  border: 0;
  border-radius: 11px;
  color: #5273a7;
  background: transparent;
  cursor: pointer;
}

.auth-password-toggle:hover,
.auth-password-toggle:focus-visible {
  color: var(--brand-blue);
  background: #edf4ff;
  outline: none;
}

.auth-password-eye-hide,
.auth-password-toggle[aria-pressed="true"] .auth-password-eye-show {
  display: none;
}

.auth-password-toggle[aria-pressed="true"] .auth-password-eye-hide {
  display: block;
}

.auth-submit-button {
  width: 100%;
  min-height: 52px;
  gap: 10px;
  margin-top: 4px;
  border-radius: 14px;
  font-size: 0.92rem;
  box-shadow: 0 16px 30px rgba(0, 43, 115, 0.22);
}

.auth-submit-button svg {
  width: 19px;
  height: 19px;
}

.auth-register-path {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: 14px;
  margin-top: 24px;
  padding-top: 20px;
  border-top: 1px solid #dde8fa;
}

.auth-register-path > span {
  color: var(--text-soft);
  font-size: 0.8rem;
  line-height: 1.45;
}

.auth-register-path .btn {
  white-space: nowrap;
}

.auth-admin-note {
  margin: 17px 0 0 !important;
  color: #7383a3 !important;
  font-size: 0.72rem !important;
  text-align: center;
}

body.theme-dark .auth-premium-card {
  border-color: rgba(126, 161, 219, 0.24);
  background: #0d1d3d;
  box-shadow: 0 28px 70px rgba(0, 5, 18, 0.48);
}

body.theme-dark .auth-business-form-panel {
  background: #0d1d3d;
}

body.theme-dark .auth-form-heading h2,
body.theme-dark .auth-form-group > label,
body.theme-dark .auth-label-row label {
  color: #f6f9ff;
}

body.theme-dark .auth-form-heading p,
body.theme-dark .auth-register-path > span {
  color: #a8badb;
}

body.theme-dark .auth-input-wrap .input {
  border-color: rgba(126, 161, 219, 0.3);
  background: #122750;
  color: #ffffff;
}

body.theme-dark .auth-password-toggle:hover,
body.theme-dark .auth-password-toggle:focus-visible {
  color: #ffffff;
  background: rgba(126, 161, 219, 0.14);
}

body.theme-dark .auth-register-path {
  border-top-color: rgba(126, 161, 219, 0.22);
}

body.theme-dark .auth-register-path .btn-outline {
  border-color: rgba(126, 161, 219, 0.38);
  background: transparent;
  color: #eaf2ff;
}

body.theme-dark .auth-admin-note {
  color: #8197bd !important;
}

@media (max-width: 760px) {
  .form-shell.auth-business-shell {
    margin: 18px auto 22px;
  }

  .auth-premium-card {
    border-radius: 20px;
  }

  .auth-business-layout {
    grid-template-columns: 1fr;
    min-height: 0;
  }

  .auth-business-intro {
    padding: 25px 22px 23px;
  }

  .auth-business-heading {
    margin: 0;
    padding: 25px 0 21px;
  }

  .auth-business-heading h1 {
    margin: 13px 0 10px;
    font-size: 1.7rem;
  }

  .auth-business-heading p {
    font-size: 0.9rem;
  }

  .auth-business-role-note {
    padding: 11px 0;
  }

  .auth-business-form-panel {
    padding: 27px 22px 25px;
  }

  .auth-form-heading h2 {
    font-size: 1.5rem;
  }

  .auth-register-path {
    grid-template-columns: 1fr;
    gap: 10px;
  }

  .auth-register-path .btn {
    width: 100%;
  }
}

@media (max-width: 390px) {
  .auth-label-row {
    align-items: flex-start;
    flex-direction: column;
    gap: 5px;
  }
}

.form-grid-full {
  grid-column: 1 / -1;
}

.form-shell.business-onboarding-shell {
  width: min(1160px, 100%);
  margin: 32px auto 28px;
}

.business-onboarding-card {
  max-width: 1160px;
  margin: 0 auto;
  padding: 0;
  overflow: visible;
  border: 1px solid rgba(0, 43, 115, 0.16);
  border-radius: 24px;
  background: #ffffff;
  box-shadow: 0 28px 72px rgba(0, 43, 115, 0.15);
}

.business-onboarding-hero {
  position: relative;
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 30px;
  padding: 38px 42px 36px;
  overflow: hidden;
  border-radius: 23px 23px 0 0;
  color: #ffffff;
  background-color: #002b73;
  background-image:
    linear-gradient(rgba(255, 255, 255, 0.035) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255, 255, 255, 0.035) 1px, transparent 1px);
  background-size: 38px 38px;
}

.business-onboarding-hero::before {
  content: "";
  position: absolute;
  inset: 0 0 auto;
  height: 6px;
  background: linear-gradient(90deg, #f57c00 0 33%, #ffffff 33% 66%, #00bfa6 66% 100%);
}

.business-onboarding-hero-copy,
.business-onboarding-hero-action {
  position: relative;
  z-index: 1;
}

.business-onboarding-hero-copy {
  max-width: 680px;
  min-width: 0;
}

.business-onboarding-hero .brand-tag {
  border-color: rgba(255, 255, 255, 0.28);
  color: #ffffff;
  background: rgba(255, 255, 255, 0.1);
}

.business-onboarding-hero h1 {
  margin: 17px 0 10px;
  color: #ffffff;
  font-size: 2.25rem;
  line-height: 1.12;
}

.business-onboarding-hero p {
  max-width: 620px;
  margin: 0;
  color: rgba(255, 255, 255, 0.78);
  font-size: 0.98rem;
  line-height: 1.6;
}

.business-onboarding-hero-action {
  display: grid;
  justify-items: end;
  gap: 9px;
  flex: 0 0 auto;
}

.business-onboarding-hero-action > span {
  color: rgba(255, 255, 255, 0.72);
  font-size: 0.76rem;
}

.business-onboarding-login {
  gap: 8px;
  min-height: 44px;
  padding: 10px 14px;
  border: 1px solid rgba(255, 255, 255, 0.32);
  color: #ffffff;
  background: rgba(255, 255, 255, 0.1);
}

.business-onboarding-login:hover,
.business-onboarding-login:focus-visible {
  color: #002b73;
  background: #ffffff;
  outline: none;
}

.business-onboarding-login svg,
.business-onboarding-review-note svg,
.business-password-toggle svg,
.onboarding-submit-actions svg {
  width: 20px;
  height: 20px;
  fill: currentColor;
}

.business-onboarding-body {
  display: grid;
  grid-template-columns: 260px minmax(0, 1fr);
  align-items: start;
  min-width: 0;
}

.business-onboarding-rail {
  position: sticky;
  top: 88px;
  display: grid;
  gap: 24px;
  min-width: 0;
  padding: 32px 26px;
  border-right: 1px solid #dce8fb;
  background: #f4f8ff;
}

.business-onboarding-rail-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  padding-bottom: 16px;
  border-bottom: 1px solid #dce8fb;
}

.business-onboarding-rail-head span {
  color: #60749a;
  font-size: 0.74rem;
  font-weight: 800;
  text-transform: uppercase;
}

.business-onboarding-rail-head strong {
  color: #008f7f;
  font-size: 0.76rem;
}

.business-onboarding-steps {
  display: grid;
  gap: 19px;
  margin: 0;
  padding: 0;
  list-style: none;
}

.business-onboarding-steps li {
  position: relative;
  display: grid;
  grid-template-columns: 36px minmax(0, 1fr);
  align-items: center;
  gap: 12px;
  min-width: 0;
}

.business-onboarding-steps li:not(:last-child)::after {
  content: "";
  position: absolute;
  top: 36px;
  bottom: -19px;
  left: 17px;
  width: 2px;
  background: #d8e6fb;
}

.business-onboarding-steps li > span {
  position: relative;
  z-index: 1;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 36px;
  height: 36px;
  border: 1px solid #c7daf8;
  border-radius: 12px;
  color: #315f9f;
  background: #ffffff;
  font-size: 0.72rem;
  font-weight: 900;
}

.business-onboarding-steps strong,
.business-onboarding-steps small {
  display: block;
}

.business-onboarding-steps strong {
  color: var(--brand-blue);
  font-size: 0.86rem;
}

.business-onboarding-steps small {
  margin-top: 2px;
  color: #7184a8;
  font-size: 0.72rem;
}

.business-onboarding-review-note {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  gap: 10px;
  padding-top: 18px;
  border-top: 1px solid #dce8fb;
  color: #008f7f;
}

.business-onboarding-review-note p,
.business-onboarding-review-note strong,
.business-onboarding-review-note span {
  display: block;
  margin: 0;
}

.business-onboarding-review-note strong {
  color: var(--brand-blue);
  font-size: 0.78rem;
}

.business-onboarding-review-note span {
  margin-top: 3px;
  color: #667a9f;
  font-size: 0.7rem;
  line-height: 1.45;
}

.business-onboarding-form-column {
  min-width: 0;
  padding: 5px 38px 34px;
}

.business-onboarding-form-column > .alert {
  margin-top: 28px;
}

.onboarding-section {
  padding: 34px 0 30px;
  border-top: 1px solid #e0ebff;
}

.onboarding-section:first-of-type {
  border-top: 0;
}

.onboarding-section-heading {
  display: grid;
  grid-template-columns: 42px minmax(0, 1fr);
  align-items: start;
  gap: 13px;
  margin-bottom: 22px;
}

.onboarding-section-number {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 42px;
  height: 42px;
  border-radius: 14px;
  color: #ffffff;
  background: var(--brand-blue);
  font-size: 0.76rem;
  font-weight: 900;
  box-shadow: 0 12px 24px rgba(0, 43, 115, 0.18);
}

.onboarding-section-heading h2 {
  margin: 0;
  color: var(--brand-blue);
  font-size: 1.25rem;
}

.onboarding-section-heading p {
  margin: 4px 0 0;
  color: var(--text-soft);
  font-size: 0.82rem;
  line-height: 1.5;
}

.business-onboarding-form-column .form-grid {
  gap: 16px;
}

.business-onboarding-form-column .form-group {
  margin-bottom: 0;
}

.business-onboarding-form-column .form-group label:not(.delivery-choice-card) {
  color: var(--brand-blue);
  font-size: 0.8rem;
  font-weight: 800;
}

.business-onboarding-form-column .input {
  min-height: 50px;
  border-radius: 14px;
  background: #fbfdff;
}

.business-onboarding-form-column textarea.input {
  min-height: 112px;
  resize: vertical;
}

.business-onboarding-form-column .input[readonly] {
  color: #5e7196;
  background: #f0f5fc;
}

.business-password-wrap {
  position: relative;
}

.business-password-wrap .input {
  padding-right: 52px;
}

.business-password-toggle {
  position: absolute;
  top: 50%;
  right: 7px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 38px;
  height: 38px;
  padding: 0;
  transform: translateY(-50%);
  border: 0;
  border-radius: 11px;
  color: #5273a7;
  background: transparent;
  cursor: pointer;
}

.business-password-toggle:hover,
.business-password-toggle:focus-visible {
  color: var(--brand-blue);
  background: #eaf2ff;
  outline: none;
}

.business-file-input {
  padding: 7px !important;
}

.business-file-input::file-selector-button {
  min-height: 34px;
  margin-right: 10px;
  padding: 7px 11px;
  border: 0;
  border-radius: 9px;
  color: var(--brand-blue);
  background: #e8f1ff;
  font: inherit;
  font-weight: 800;
  cursor: pointer;
}

.business-onboarding-form-column .text-muted {
  display: block;
  margin-top: 7px;
  color: #7184a8;
  font-size: 0.72rem;
  line-height: 1.45;
}

.business-register-success-shell {
  width: min(680px, 100%);
}

.business-register-success-card {
  text-align: center;
  padding: clamp(24px, 6vw, 46px);
}

.business-register-success-icon {
  width: 78px;
  height: 78px;
  margin: 14px auto 18px;
  display: grid;
  place-items: center;
  border-radius: 28px;
  color: #ffffff;
  background: linear-gradient(135deg, #003b8f, #10c6b3);
  box-shadow: 0 18px 34px rgba(0, 59, 143, 0.24);
}

.business-register-success-icon svg {
  width: 42px;
  height: 42px;
  fill: currentColor;
}

.business-register-success-card h1 {
  font-size: clamp(2rem, 8vw, 3.1rem);
}

.business-register-success-note {
  display: grid;
  gap: 4px;
  max-width: 520px;
  margin: 20px auto;
  padding: 16px;
  border: 1px solid rgba(16, 198, 179, 0.28);
  border-radius: 22px;
  background: linear-gradient(135deg, rgba(16, 198, 179, 0.12), rgba(0, 59, 143, 0.06));
  color: #4f6692;
}

.business-register-success-note strong {
  color: #008f82;
}

.business-register-success-actions {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 10px;
  margin-top: 18px;
}

.business-register-success-countdown {
  margin: 16px 0 0;
  color: #7185aa;
  font-size: 0.92rem;
}

.delivery-choice-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 14px;
  margin-bottom: 18px;
}

.publication-choice-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
}

.delivery-choice-card {
  display: grid;
  gap: 5px;
  min-width: 0;
  padding: 15px;
  border: 1px solid #cfe0ff;
  border-radius: 16px;
  background: #fbfdff;
  cursor: pointer;
  transition: border-color 0.18s ease, background 0.18s ease, box-shadow 0.18s ease;
}

.delivery-choice-card:has(input:checked) {
  border-color: rgba(0, 191, 166, 0.58);
  background: #f2fffc;
  box-shadow: 0 12px 26px rgba(0, 191, 166, 0.1);
}

.delivery-choice-card input {
  accent-color: var(--brand-blue);
}

.publication-choice-card {
  grid-template-columns: auto minmax(0, 1fr);
  align-items: start;
  cursor: pointer;
}

.publication-choice-card small {
  grid-column: 2;
  grid-row: 2;
  display: block;
  margin-top: 2px;
}

.publication-choice-card input {
  grid-column: 1;
  grid-row: 1 / span 2;
  margin-top: 4px;
  accent-color: var(--brand-blue);
}

.publication-choice-card > span {
  grid-column: 2;
  grid-row: 1;
  display: block;
}

.publication-choice-card:has(input:checked) {
  border-color: rgba(0, 191, 166, 0.65);
  background: #effffb;
  box-shadow: 0 14px 30px rgba(0, 191, 166, 0.12);
}

.delivery-choice-card span {
  color: var(--brand-blue);
  font-weight: 800;
}

.delivery-choice-card small {
  color: var(--text-soft);
  line-height: 1.45;
}

.business-custom-vertical-toggle {
  grid-template-columns: auto minmax(0, 1fr);
  align-items: start;
}

.business-custom-vertical-toggle input {
  margin-top: 4px;
}

.business-custom-vertical-toggle small {
  grid-column: 2;
}

.onboarding-submit {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: 22px;
  margin-top: 4px;
  padding: 22px;
  border: 1px solid #d9e7fb;
  border-radius: 18px;
  background: #f5f9ff;
}

.onboarding-submit-copy strong,
.onboarding-submit-copy span {
  display: block;
}

.onboarding-submit-copy strong {
  color: var(--brand-blue);
  font-size: 0.9rem;
}

.onboarding-submit-copy span {
  margin-top: 3px;
  color: #667a9f;
  font-size: 0.74rem;
  line-height: 1.45;
}

.onboarding-submit-actions {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 10px;
}

.onboarding-submit-actions .btn {
  min-height: 46px;
  gap: 8px;
  padding-inline: 15px;
}

.onboarding-submit-actions .btn-primary {
  min-width: 178px;
  box-shadow: 0 14px 28px rgba(0, 43, 115, 0.2);
}

body.theme-dark .business-onboarding-card,
body.theme-dark .business-onboarding-form-column {
  border-color: rgba(126, 161, 219, 0.24);
  background: #0d1d3d;
}

body.theme-dark .business-onboarding-rail {
  border-color: rgba(126, 161, 219, 0.2);
  background: #10254c;
}

body.theme-dark .business-onboarding-rail-head,
body.theme-dark .business-onboarding-review-note,
body.theme-dark .onboarding-section {
  border-color: rgba(126, 161, 219, 0.2);
}

body.theme-dark .business-onboarding-steps li:not(:last-child)::after {
  background: rgba(126, 161, 219, 0.2);
}

body.theme-dark .business-onboarding-steps li > span {
  border-color: rgba(126, 161, 219, 0.3);
  color: #bcd3fa;
  background: #17315f;
}

body.theme-dark .business-onboarding-steps strong,
body.theme-dark .business-onboarding-review-note strong,
body.theme-dark .onboarding-section-heading h2,
body.theme-dark .business-onboarding-form-column .form-group label:not(.delivery-choice-card),
body.theme-dark .onboarding-submit-copy strong {
  color: #f4f8ff;
}

body.theme-dark .business-onboarding-steps small,
body.theme-dark .business-onboarding-review-note span,
body.theme-dark .onboarding-section-heading p,
body.theme-dark .onboarding-submit-copy span,
body.theme-dark .business-onboarding-form-column .text-muted {
  color: #9fb3d6;
}

body.theme-dark .business-onboarding-form-column .input {
  border-color: rgba(126, 161, 219, 0.3);
  color: #ffffff;
  background: #122750;
}

body.theme-dark .business-onboarding-form-column .input[readonly] {
  color: #a9bad7;
  background: #102244;
}

body.theme-dark .delivery-choice-card {
  border-color: rgba(126, 161, 219, 0.26);
  background: #122750;
}

body.theme-dark .delivery-choice-card:has(input:checked),
body.theme-dark .publication-choice-card:has(input:checked) {
  border-color: rgba(69, 224, 203, 0.52);
  background: #12354f;
}

body.theme-dark .delivery-choice-card span {
  color: #f3f8ff;
}

body.theme-dark .delivery-choice-card small {
  color: #a4b7d8;
}

body.theme-dark .business-password-toggle:hover,
body.theme-dark .business-password-toggle:focus-visible,
body.theme-dark .business-file-input::file-selector-button {
  color: #eaf2ff;
  background: rgba(126, 161, 219, 0.16);
}

body.theme-dark .onboarding-submit {
  border-color: rgba(126, 161, 219, 0.24);
  background: #10254c;
}

@media (max-width: 900px) {
  .form-shell.business-onboarding-shell {
    margin-top: 20px;
  }

  .business-onboarding-hero {
    align-items: flex-start;
    flex-direction: column;
    padding: 32px 28px;
  }

  .business-onboarding-hero-copy {
    width: 100%;
  }

  .business-onboarding-hero-action {
    justify-items: start;
  }

  .business-onboarding-body {
    grid-template-columns: 1fr;
  }

  .business-onboarding-rail {
    position: static;
    gap: 18px;
    padding: 21px 24px;
    border-right: 0;
    border-bottom: 1px solid #dce8fb;
  }

  .business-onboarding-steps {
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 10px;
  }

  .business-onboarding-steps li {
    grid-template-columns: 32px minmax(0, 1fr);
    gap: 8px;
  }

  .business-onboarding-steps li:not(:last-child)::after {
    display: none;
  }

  .business-onboarding-steps li > span {
    width: 32px;
    height: 32px;
    border-radius: 10px;
  }

  .business-onboarding-form-column {
    padding: 4px 28px 30px;
  }
}

@media (max-width: 760px) {
  .form-shell.business-onboarding-shell {
    margin: 18px auto 22px;
  }

  .business-onboarding-card {
    border-radius: 20px;
  }

  .business-onboarding-hero {
    gap: 22px;
    padding: 27px 22px 25px;
    border-radius: 19px 19px 0 0;
  }

  .business-onboarding-hero h1 {
    margin-top: 14px;
    font-size: 1.8rem;
  }

  .business-onboarding-hero p {
    font-size: 0.88rem;
  }

  .business-onboarding-hero-action {
    width: 100%;
  }

  .business-onboarding-login {
    width: 100%;
  }

  .business-onboarding-rail {
    padding: 18px 20px;
  }

  .business-onboarding-steps {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    grid-auto-flow: row;
    overflow: visible;
  }

  .business-onboarding-steps li {
    grid-template-columns: 30px minmax(0, 1fr);
  }

  .business-onboarding-steps li > span {
    width: 30px;
    height: 30px;
  }

  .business-onboarding-review-note {
    padding-top: 14px;
  }

  .business-onboarding-form-column {
    padding: 0 20px 24px;
  }

  .onboarding-section {
    padding: 27px 0 25px;
  }

  .onboarding-section-heading {
    grid-template-columns: 38px minmax(0, 1fr);
    gap: 11px;
    margin-bottom: 19px;
  }

  .onboarding-section-number {
    width: 38px;
    height: 38px;
    border-radius: 12px;
  }

  .onboarding-section-heading h2 {
    font-size: 1.12rem;
  }

  .publication-choice-grid {
    grid-template-columns: 1fr;
  }

  .onboarding-submit {
    grid-template-columns: 1fr;
    gap: 16px;
    padding: 18px;
  }

  .onboarding-submit-actions {
    align-items: stretch;
    flex-direction: column-reverse;
  }

  .onboarding-submit-actions .btn {
    width: 100%;
  }
}

@media (max-width: 410px) {
  .business-onboarding-hero h1 {
    font-size: 1.62rem;
  }

  .business-onboarding-form-column,
  .business-onboarding-rail {
    padding-right: 16px;
    padding-left: 16px;
  }
}

.birth-confirm-modal[hidden] {
  display: none;
}

.birth-confirm-modal {
  position: fixed;
  inset: 0;
  z-index: 1000;
  display: grid;
  place-items: center;
  padding: 20px;
}

.birth-confirm-modal__backdrop {
  position: absolute;
  inset: 0;
  background: rgba(3, 13, 34, 0.54);
  backdrop-filter: blur(6px);
}

.birth-confirm-modal__dialog {
  position: relative;
  width: min(460px, 100%);
  padding: 24px;
  border: 1px solid #cfe0ff;
  border-radius: 26px;
  background: #fff;
  box-shadow: 0 24px 54px rgba(0, 24, 69, 0.28);
}

.birth-confirm-modal__dialog h2 {
  margin: 12px 0 8px;
  color: var(--brand-blue);
}

.birth-confirm-modal__dialog p {
  color: var(--text-soft);
}

.birth-confirm-modal__date {
  margin: 16px 0;
  padding: 16px;
  border-radius: 18px;
  background: #eaf7ff;
  color: var(--brand-blue);
  font-size: 1.25rem;
  font-weight: 900;
  text-align: center;
}

.birth-confirm-modal__actions {
  display: flex;
  justify-content: flex-end;
  gap: 10px;
}

.app-footer-credit {
  width: min(100% - 28px, 1120px);
  margin: 18px auto 10px;
  text-align: center;
  color: rgba(27, 64, 122, 0.28);
  font-size: 0.72rem;
  letter-spacing: 0.03em;
}

.app-footer-credit span {
  display: inline-block;
}

.app-footer-credit small {
  display: block;
  margin-top: 0.18rem;
  font-size: 0.68rem;
  letter-spacing: 0.08em;
  opacity: 0.88;
}

body.theme-dark .app-footer-credit {
  color: rgba(214, 232, 255, 0.5);
}

body.theme-light .app-footer-credit {
  color: rgba(27, 64, 122, 0.28);
}

@media (max-width: 760px) {
  .portal-hero,
  .portal-strip,
  .form-grid,
  .delivery-choice-grid {
    grid-template-columns: 1fr;
  }

  .portal-actions .btn,
  .portal-path-card .btn,
  .onboarding-submit .btn,
  .birth-confirm-modal__actions .btn {
    width: 100%;
    justify-content: center;
  }

  .birth-confirm-modal__actions {
    flex-direction: column-reverse;
  }

  .portal-shell {
    width: min(100% - 28px, 1120px);
    padding-top: 14px;
  }

  .portal-simple-hero {
    min-height: auto;
    padding: 26px 18px;
  }

  .portal-simple-hero h1 {
    font-size: clamp(2rem, 11vw, 3rem);
    line-height: 1;
    letter-spacing: -0.055em;
  }

  .portal-simple-hero p {
    font-size: 0.96rem;
    line-height: 1.48;
  }

  .portal-entry-grid {
    grid-template-columns: 1fr;
    margin-top: 22px;
  }

  .portal-entry-card {
    min-height: 76px;
  }

  .app-footer-credit {
    margin-top: 14px;
    margin-bottom: 8px;
    font-size: 0.68rem;
  }
}

/* Customer conversation polish: keep this late so it wins over generic card/form rules. */
.customer-chat-page {
  display: grid;
  gap: 0.9rem;
  padding-top: 1rem;
}

.customer-chat-page .customer-chat-header {
  align-items: center;
  justify-content: flex-start;
  border-radius: 24px;
  padding: 1rem;
  background: rgba(255, 255, 255, 0.92);
  border: 1px solid rgba(0, 43, 115, 0.1);
  box-shadow: 0 16px 34px rgba(0, 24, 69, 0.08);
}

.customer-chat-page .customer-chat-header .btn {
  flex: 0 0 auto;
  border-radius: 999px;
  padding: 0.6rem 0.9rem;
  font-weight: 800;
  color: var(--brand-blue);
  background: rgba(0, 91, 184, 0.08);
  border: 1px solid rgba(0, 91, 184, 0.18);
}

.customer-chat-page .customer-chat-header h1 {
  margin: 0.2rem 0 0;
  font-size: clamp(1.55rem, 6vw, 2.3rem);
  line-height: 1.05;
  color: var(--brand-blue);
}

.customer-chat-page .customer-chat-thread {
  border-radius: 26px;
  padding: 1rem;
  min-height: 420px;
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.96), rgba(245, 249, 255, 0.94));
  border: 1px solid rgba(0, 43, 115, 0.1);
  box-shadow: 0 16px 34px rgba(0, 24, 69, 0.07);
}

.customer-chat-page .chat-message {
  box-shadow: 0 12px 24px rgba(0, 24, 69, 0.08);
}

.customer-chat-page .chat-message.is-mine {
  color: #fff;
  background: linear-gradient(135deg, #0058b8 0%, #0099ad 100%);
}

.customer-chat-page .chat-message.is-mine p,
.customer-chat-page .chat-message.is-mine small {
  color: #fff;
}

.customer-chat-page .chat-message.is-theirs {
  background: #fff;
  color: var(--brand-blue);
}

.customer-chat-page .chat-message.is-theirs p {
  color: #24406f;
}

.customer-chat-page .chat-message.is-theirs small {
  color: #60749c;
}

.customer-chat-page .customer-chat-form {
  border-radius: 24px;
  padding: 0.75rem;
  background: rgba(255, 255, 255, 0.94);
  border: 1px solid rgba(0, 43, 115, 0.1);
  box-shadow: 0 16px 34px rgba(0, 24, 69, 0.07);
}

.customer-chat-page .customer-chat-form.chat-composer {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: end;
  gap: 0.7rem;
}

.customer-chat-page .customer-chat-form .form-control,
.customer-chat-page .customer-chat-tools .form-control {
  width: 100%;
  min-height: 52px;
  border-radius: 18px;
  border: 1px solid rgba(0, 43, 115, 0.16);
  background: #fff;
  color: var(--brand-blue);
  padding: 0.8rem 0.95rem;
  font: inherit;
  outline: none;
  box-shadow: none;
}

.customer-chat-page .customer-chat-form textarea.form-control {
  resize: vertical;
  min-height: 52px;
  max-height: 120px;
  border-radius: 20px;
  line-height: 1.35;
}

.customer-chat-page .customer-chat-form .btn,
.customer-chat-page .customer-chat-tools .btn {
  border: 0;
  border-radius: 18px;
  padding: 0.9rem 1rem;
  font-weight: 900;
  font: inherit;
  line-height: 1;
}

.customer-chat-page .customer-chat-form .chat-send-button {
  width: 52px;
  height: 52px;
  min-width: 52px;
  display: grid;
  place-items: center;
  padding: 0;
}

.customer-chat-page .customer-chat-form .chat-send-button svg {
  width: 20px;
  height: 20px;
  fill: currentColor;
}

.customer-chat-page .customer-chat-form .btn-brand {
  color: #fff;
  background: linear-gradient(135deg, var(--brand-blue), #005fbd);
  box-shadow: 0 14px 28px rgba(0, 43, 115, 0.18);
}

.customer-chat-page .customer-chat-tools {
  border-radius: 24px;
  padding: 1rem;
  background: rgba(255, 255, 255, 0.9);
  border: 1px solid rgba(0, 43, 115, 0.1);
}

.customer-chat-page .customer-chat-tools summary {
  cursor: pointer;
  color: var(--brand-blue);
  font-weight: 900;
}

.customer-chat-page .customer-chat-tool-actions form {
  display: grid;
  gap: 0.65rem;
}

.customer-chat-page .customer-chat-tools .btn-outline-secondary {
  color: var(--brand-blue);
  background: rgba(0, 91, 184, 0.08);
}

.customer-chat-page .customer-chat-tools .btn-outline-danger {
  color: #b42318;
  background: #fff1f0;
}

body.theme-dark .customer-chat-page .customer-chat-header,
body.theme-dark .customer-chat-page .customer-chat-thread,
body.theme-dark .customer-chat-page .customer-chat-form,
body.theme-dark .customer-chat-page .customer-chat-tools {
  border-color: rgba(119, 167, 255, 0.34);
  background:
    radial-gradient(circle at 92% 0%, rgba(0, 191, 166, 0.08), transparent 16rem),
    rgba(10, 30, 69, 0.92);
  box-shadow: 0 18px 38px rgba(0, 0, 0, 0.22);
}

body.theme-dark .customer-chat-page .customer-chat-header h1 {
  color: #dceaff;
  text-shadow: 0 1px 0 rgba(0, 0, 0, 0.16);
}

body.theme-dark .customer-chat-page .customer-chat-header .btn,
body.theme-dark .customer-chat-page .customer-chat-tools .btn-outline-secondary {
  color: #dceaff;
  background: rgba(29, 86, 168, 0.32);
  border: 1px solid rgba(119, 167, 255, 0.3);
}

body.theme-dark .customer-chat-page .brand-tag {
  color: #ffbd6c;
  background: rgba(245, 124, 0, 0.16);
  border-color: rgba(255, 189, 108, 0.44);
}

body.theme-dark .customer-chat-page .chat-message.is-mine {
  color: #fff;
  background: linear-gradient(135deg, #0965c9 0%, #00a6bd 100%);
  box-shadow: 0 16px 30px rgba(0, 0, 0, 0.18);
}

body.theme-dark .customer-chat-page .chat-message.is-mine p,
body.theme-dark .customer-chat-page .chat-message.is-mine small {
  color: #fff;
}

body.theme-dark .customer-chat-page .chat-message.is-theirs {
  color: #10234d;
  background: #ffffff;
}

body.theme-dark .customer-chat-page .chat-message.is-theirs p {
  color: #10234d;
}

body.theme-dark .customer-chat-page .chat-message.is-theirs small {
  color: #7b8bad;
}

body.theme-dark .customer-chat-page .customer-chat-form .form-control,
body.theme-dark .customer-chat-page .customer-chat-tools .form-control {
  color: #eaf2ff;
  background: rgba(255, 255, 255, 0.08);
  border-color: rgba(119, 167, 255, 0.36);
}

body.theme-dark .customer-chat-page .customer-chat-form .form-control::placeholder,
body.theme-dark .customer-chat-page .customer-chat-tools .form-control::placeholder {
  color: rgba(220, 234, 255, 0.68);
}

body.theme-dark .customer-chat-page .customer-chat-tools summary {
  color: #dceaff;
}

body.theme-dark .customer-chat-page .customer-chat-tools .btn-outline-danger {
  color: #ffd9d6;
  background: rgba(180, 35, 24, 0.22);
  border: 1px solid rgba(255, 177, 170, 0.28);
}

body.theme-dark img[data-public-image-loader] {
  background-color: #132b52;
  background-image:
    radial-gradient(circle at center, rgba(216, 233, 255, 0.22) 0 16%, transparent 17%),
    linear-gradient(105deg, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0.18) 46%, rgba(255, 255, 255, 0) 72%),
    linear-gradient(135deg, #0b1c3c 0%, #12335f 56%, #063f4f 100%);
}

body.theme-dark img[data-public-image-loader].is-image-loaded {
  background-image: none;
  background-color: transparent;
}

body.theme-dark img[data-public-image-loader].is-image-error {
  background-image:
    radial-gradient(circle at center, rgba(216, 233, 255, 0.2) 0 18%, transparent 19%),
    linear-gradient(135deg, #0f2648 0%, #102d55 100%);
}

body.theme-dark #home-content-root.is-loading .business-card::after,
body.theme-dark #home-content-root.is-loading .promo-banner::after,
body.theme-dark #home-content-root.is-loading .vertical-tile::after,
body.theme-dark #home-content-root.is-loading .open-food-callout::after,
body.theme-dark #home-content-root.is-loading .filter-collapse::after,
body.theme-dark #home-content-root.is-loading .home-banner-slide::after,
body.theme-dark #home-content-root.is-loading .card::after {
  background:
    linear-gradient(105deg, transparent 0%, rgba(216, 233, 255, 0.18) 45%, transparent 72%);
  background-size: 220% 100%;
}

@media (prefers-reduced-motion: reduce) {
  #home-content-root.is-loading .business-card::after,
  #home-content-root.is-loading .promo-banner::after,
  #home-content-root.is-loading .vertical-tile::after,
  #home-content-root.is-loading .open-food-callout::after,
  #home-content-root.is-loading .filter-collapse::after,
  #home-content-root.is-loading .home-banner-slide::after,
  #home-content-root.is-loading .card::after {
    animation: none;
  }
}

@media (max-width: 640px) {
  .customer-chat-page {
    gap: 0.75rem;
    padding-inline: 0;
  }

  .customer-chat-page .customer-chat-header {
    display: grid;
    grid-template-columns: auto 1fr;
    gap: 0.85rem;
  }

  .customer-chat-page .customer-chat-thread {
    min-height: 390px;
    padding: 0.85rem;
  }

  .customer-chat-page .chat-message {
    max-width: 86%;
    border-radius: 20px;
    padding: 0.75rem 0.85rem;
  }
}
/* Customer support tickets */
.customer-support-card,
.customer-app-rating-card {
  overflow: hidden;
}

.customer-support-ticket {
  border: 1px solid rgba(0, 43, 115, 0.12);
  border-radius: 24px;
  background: linear-gradient(145deg, rgba(240, 249, 255, 0.9), rgba(255, 255, 255, 0.96));
  padding: 1rem;
  margin: 1rem 0;
}

.customer-support-ticket-head {
  display: flex;
  justify-content: space-between;
  gap: 1rem;
  align-items: flex-start;
  margin-bottom: 1rem;
}

.customer-support-ticket-head strong,
.customer-support-ticket-head span {
  display: block;
}

.customer-support-ticket-head span {
  color: var(--color-primary);
  font-weight: 800;
}

.customer-support-thread {
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
  margin-bottom: 1rem;
}

.customer-support-message {
  max-width: min(86%, 560px);
  border-radius: 22px;
  padding: 0.85rem 1rem;
  box-shadow: 0 14px 30px rgba(0, 43, 115, 0.08);
}

.customer-support-message p {
  margin: 0 0 0.35rem;
}

.customer-support-message small {
  color: #6b7da4;
  font-weight: 700;
}

.customer-support-message.is-mine {
  align-self: flex-end;
  color: #fff;
  background: linear-gradient(135deg, #0757af, #09b8a8);
}

.customer-support-message.is-mine small {
  color: rgba(255, 255, 255, 0.82);
}

.customer-support-message.is-support {
  align-self: flex-start;
  background: #fff;
  border: 1px solid rgba(0, 43, 115, 0.1);
}

.customer-support-form,
.customer-support-reply-form,
.customer-rating-form {
  display: grid;
  gap: 1rem;
}

.customer-support-disabled,
.customer-support-state-note,
.customer-support-rating-done {
  border-radius: 20px;
  padding: 1rem;
  background: rgba(0, 194, 179, 0.08);
  border: 1px solid rgba(0, 194, 179, 0.18);
}

.customer-rating-stars {
  display: flex;
  justify-content: flex-start;
  gap: 0.25rem;
}

.customer-rating-stars input {
  position: absolute;
  opacity: 0;
  pointer-events: none;
}

.customer-rating-stars span {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 2.4rem;
  height: 2.4rem;
  border-radius: 999px;
  color: #bdc7d8;
  background: #f4f7fb;
  font-size: 1.4rem;
  cursor: pointer;
  transition: 160ms ease;
}

.customer-rating-stars label:hover span,
.customer-rating-stars label.is-selected span,
.customer-rating-stars label.is-hot span {
  color: #ff8a00;
  background: #fff3df;
}

body.theme-dark .customer-support-ticket,
body.theme-dark .customer-support-message.is-support,
body.theme-dark .customer-support-disabled,
body.theme-dark .customer-support-state-note,
body.theme-dark .customer-support-rating-done {
  background: rgba(13, 34, 71, 0.9);
  border-color: rgba(109, 161, 255, 0.25);
}

body.theme-dark .customer-support-ticket-head span,
body.theme-dark .customer-support-message.is-support p {
  color: #dbeafe;
}

body.theme-dark .customer-rating-stars span {
  background: rgba(255, 255, 255, 0.08);
}

.customer-blocked-shell {
  min-height: calc(100vh - 140px);
  display: grid;
  place-items: center;
  padding: 2rem 0 4rem;
}

.customer-blocked-card {
  width: min(100%, 560px);
  border: 1px solid rgba(0, 43, 115, .14);
  border-radius: 28px;
  background:
    radial-gradient(circle at top right, rgba(25, 194, 178, .18), transparent 36%),
    linear-gradient(180deg, rgba(255,255,255,.98), rgba(248,251,255,.96));
  box-shadow: 0 26px 70px rgba(0, 43, 115, .14);
  padding: clamp(1.4rem, 5vw, 2.2rem);
}

.customer-blocked-icon {
  width: 76px;
  height: 76px;
  display: grid;
  place-items: center;
  margin: 1rem 0;
  border-radius: 24px;
  color: #003583;
  background: linear-gradient(135deg, rgba(0, 53, 131, .1), rgba(25, 194, 178, .16));
}

.customer-blocked-icon svg {
  width: 42px;
  height: 42px;
  fill: currentColor;
}

.customer-blocked-card h1 {
  margin: 0 0 .5rem;
  color: #002b73;
  font-weight: 900;
  letter-spacing: -.04em;
}

.customer-blocked-card .lead {
  color: #526b9a;
  font-size: 1.05rem;
}

.customer-blocked-reason {
  display: grid;
  gap: .35rem;
  margin: 1.2rem 0;
  padding: 1rem;
  border: 1px solid rgba(255, 145, 0, .32);
  border-radius: 20px;
  background: rgba(255, 244, 229, .72);
  color: #173464;
}

.customer-blocked-reason strong {
  color: #f27a00;
  text-transform: uppercase;
  font-size: .78rem;
  letter-spacing: .08em;
}

.customer-blocked-date {
  color: #6b7fa8;
  font-size: .92rem;
}

body.theme-dark .customer-blocked-card {
  border-color: rgba(109, 161, 255, .22);
  background:
    radial-gradient(circle at top right, rgba(25, 194, 178, .16), transparent 36%),
    linear-gradient(180deg, rgba(13, 34, 71, .98), rgba(5, 18, 44, .96));
}

body.theme-dark .customer-blocked-card h1,
body.theme-dark .customer-blocked-reason {
  color: #dbeafe;
}

body.theme-dark .customer-blocked-card .lead,
body.theme-dark .customer-blocked-date {
  color: #a8b8d8;
}

/* Public commerce offers */
.commerce-offers-strip {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 260px), 1fr));
  gap: 1rem;
}

.commerce-combos-grid {
  grid-template-columns: 1fr;
}

.commerce-combos-grid.is-dense {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.commerce-combos-grid.is-dense .commerce-offer-card {
  height: 100%;
  min-width: 0;
}

.commerce-combos-grid.is-dense h3,
.commerce-combos-grid.is-dense p,
.commerce-combos-grid.is-dense .badge-text {
  overflow-wrap: anywhere;
}

.commerce-combos-grid.is-dense .badge {
  max-width: 100%;
}

.commerce-offer-card {
  display: grid;
  gap: 0.9rem;
  border-color: rgba(0, 191, 166, 0.24);
  background:
    radial-gradient(circle at top right, rgba(0, 191, 166, 0.14), transparent 38%),
    linear-gradient(180deg, rgba(255, 255, 255, 0.98), rgba(248, 252, 255, 0.94));
  box-shadow: 0 20px 46px rgba(0, 43, 115, 0.11);
}

.commerce-offer-card-main {
  display: grid;
  grid-template-columns: 76px minmax(0, 1fr);
  align-items: center;
  gap: 0.85rem;
}

.commerce-offer-card h3 {
  margin: 0.35rem 0 0.25rem;
  color: #002b73;
  font-weight: 900;
  letter-spacing: -0.03em;
}

.commerce-offer-card p {
  margin: 0;
  color: #53678c;
  line-height: 1.35;
}

.commerce-offer-thumb {
  width: 76px;
  height: 76px;
  object-fit: cover;
  border-radius: 24px;
  border: 1px solid rgba(0, 191, 166, 0.24);
  background: #eef7ff;
  box-shadow: 0 14px 28px rgba(0, 43, 115, 0.1);
}

.commerce-offer-thumb-fallback {
  display: grid;
  place-items: center;
  color: #003583;
  font-weight: 900;
  background: linear-gradient(135deg, #eaf7ff, #dffbf5);
}

.commerce-offer-thumb-fallback i {
  font-size: 1.7rem;
}

.commerce-offer-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 0.45rem;
}

.commerce-offer-action {
  display: grid;
  gap: 0.65rem;
}

.commerce-combo-action {
  grid-template-columns: auto minmax(0, 1fr);
  align-items: center;
}

.commerce-combo-qty {
  width: 132px;
}

.cart-discount-line,
.cart-discount-amount {
  color: #008a78;
  font-weight: 800;
}

.cart-combo-inline-form {
  display: contents;
}

body.theme-dark .commerce-offer-card {
  border-color: rgba(109, 161, 255, 0.22);
  background:
    radial-gradient(circle at top right, rgba(0, 191, 166, 0.12), transparent 38%),
    linear-gradient(180deg, rgba(14, 34, 71, 0.98), rgba(8, 21, 50, 0.96));
}

body.theme-dark .commerce-offer-card h3 {
  color: #eaf2ff;
}

body.theme-dark .commerce-offer-card p {
  color: #a8b8d8;
}

body.theme-dark .commerce-offer-thumb-fallback {
  color: #dbeafe;
  background: linear-gradient(135deg, rgba(109, 161, 255, 0.16), rgba(0, 191, 166, 0.18));
}

@media (max-width: 575.98px) {
  .commerce-offer-card-main {
    grid-template-columns: 64px minmax(0, 1fr);
  }

  .commerce-offer-thumb {
    width: 64px;
    height: 64px;
    border-radius: 20px;
  }

  .commerce-combo-action {
    grid-template-columns: 1fr;
  }

  .commerce-combos-grid.is-dense .commerce-offer-card-main {
    grid-template-columns: 1fr;
    align-items: start;
  }

  .commerce-combos-grid.is-dense .commerce-offer-thumb {
    width: 56px;
    height: 56px;
    border-radius: 18px;
  }

  .commerce-combos-grid.is-dense .commerce-combo-qty {
    width: 100%;
  }
}

@media (max-width: 374.98px) {
  .local-promo-grid.is-dense,
  .commerce-combos-grid.is-dense {
    grid-template-columns: 1fr;
  }
}

/* Public seasonal themes. Business-owned premium palettes remain scoped to their cards. */
body[data-public-theme="fiestas_patrias"] {
  --season-primary: #0039a6;
  --season-secondary: #d52b1e;
  --season-highlight: #ffffff;
  --text-main: #071b42;
  --text-soft: #526584;
  --surface: #f5f8ff;
  --surface-alt: #edf3ff;
  --border: #cbdcf7;
  --client-accent: #d52b1e;
  --client-accent-strong: #b51f17;
  --client-accent-soft: #fff0ef;
  --client-accent-border: #f3b4af;
  --client-accent-glow: rgba(213, 43, 30, 0.2);
  --client-accent-ink: #76140e;
  background:
    linear-gradient(145deg, rgba(0, 57, 166, 0.08), transparent 31%),
    linear-gradient(215deg, rgba(213, 43, 30, 0.07), transparent 34%),
    linear-gradient(180deg, #f2f7ff 0%, #ffffff 54%, #f7f9fd 100%);
}

body[data-public-theme="fiestas_patrias"]::before,
body[data-public-theme="navidad_ano_nuevo"]::before {
  content: "";
  position: fixed;
  top: 0;
  right: 0;
  left: 0;
  z-index: 250;
  height: 4px;
  pointer-events: none;
}

body[data-public-theme="fiestas_patrias"]::before {
  background: linear-gradient(90deg, #0039a6 0 33.333%, #ffffff 33.333% 66.666%, #d52b1e 66.666% 100%);
}

body[data-public-theme="fiestas_patrias"] .topbar {
  border-color: rgba(0, 57, 166, 0.22);
  background: linear-gradient(110deg, rgba(255, 255, 255, 0.97), rgba(239, 245, 255, 0.96));
  box-shadow: 0 12px 30px rgba(0, 57, 166, 0.13);
}

body[data-public-theme="fiestas_patrias"] .brand-link::after {
  content: "\2605";
  color: #d52b1e;
  font-size: 0.78rem;
  line-height: 1;
}

body[data-public-theme="fiestas_patrias"] .btn-primary,
body[data-public-theme="fiestas_patrias"] .client-mini-cart__cta {
  background: linear-gradient(135deg, #0039a6, #075ac1);
}

body[data-public-theme="fiestas_patrias"] .chip-active,
body[data-public-theme="fiestas_patrias"] .customer-tab-btn.is-active {
  border-color: #0039a6;
  background: #0039a6;
  color: #ffffff;
}

body[data-public-theme="fiestas_patrias"] .favorite-toggle-icon svg,
body[data-public-theme="navidad_ano_nuevo"] .favorite-toggle-icon svg {
  display: none;
}

body[data-public-theme="fiestas_patrias"] .favorite-toggle-icon::before,
body[data-public-theme="navidad_ano_nuevo"] .favorite-toggle-icon::before {
  content: "\2605";
  font-size: 1.15rem;
  line-height: 1;
}

body[data-public-theme="fiestas_patrias"] .client-bottom-nav__shell {
  border-color: rgba(0, 57, 166, 0.22);
  background: linear-gradient(180deg, rgba(255, 255, 255, 0.98), rgba(239, 245, 255, 0.97));
  box-shadow: 0 20px 42px rgba(0, 57, 166, 0.2);
}

body[data-public-theme="fiestas_patrias"] .client-bottom-nav__item-cart {
  background: linear-gradient(145deg, #075ac1 0%, #0039a6 68%, #b51f17 100%);
  box-shadow: 0 16px 30px rgba(0, 57, 166, 0.32);
}

body[data-public-theme="fiestas_patrias"].theme-dark {
  --text-main: #edf4ff;
  --text-soft: #b2c4df;
  --surface: #0b1833;
  --surface-alt: #122348;
  --border: #36547e;
  --client-accent-soft: rgba(213, 43, 30, 0.2);
  --client-accent-border: rgba(255, 116, 105, 0.48);
  --client-accent-ink: #ffd8d4;
  background:
    linear-gradient(145deg, rgba(0, 74, 201, 0.25), transparent 34%),
    linear-gradient(215deg, rgba(213, 43, 30, 0.18), transparent 37%),
    linear-gradient(180deg, #071127 0%, #0a1833 58%, #0d1b37 100%);
}

body[data-public-theme="fiestas_patrias"].theme-dark .topbar,
body[data-public-theme="fiestas_patrias"].theme-dark .client-bottom-nav__shell {
  border-color: rgba(110, 154, 226, 0.32);
  background: linear-gradient(145deg, rgba(12, 32, 70, 0.97), rgba(8, 22, 50, 0.98));
  box-shadow: 0 20px 42px rgba(1, 6, 20, 0.48);
}

body[data-public-theme="navidad_ano_nuevo"] {
  --season-primary: #0b6b3a;
  --season-secondary: #b51f32;
  --season-highlight: #d5a629;
  --text-main: #10263a;
  --text-soft: #5a6a78;
  --surface: #f5faf7;
  --surface-alt: #edf7f1;
  --border: #cce3d5;
  --client-accent: #b51f32;
  --client-accent-strong: #951627;
  --client-accent-soft: #fff0f2;
  --client-accent-border: #efb4bd;
  --client-accent-glow: rgba(181, 31, 50, 0.2);
  --client-accent-ink: #6f0e1c;
  background:
    linear-gradient(150deg, rgba(11, 107, 58, 0.09), transparent 33%),
    linear-gradient(210deg, rgba(181, 31, 50, 0.07), transparent 37%),
    linear-gradient(180deg, #f3faf6 0%, #ffffff 56%, #fffaf0 100%);
}

body[data-public-theme="navidad_ano_nuevo"]::before {
  background: repeating-linear-gradient(90deg, #0b6b3a 0 44px, #d5a629 44px 52px, #b51f32 52px 96px, #f5f1df 96px 104px);
}

body[data-public-theme="navidad_ano_nuevo"] .topbar {
  border-color: rgba(11, 107, 58, 0.24);
  background: linear-gradient(110deg, rgba(255, 255, 255, 0.97), rgba(240, 249, 244, 0.97));
  box-shadow: 0 12px 30px rgba(11, 107, 58, 0.14);
}

body[data-public-theme="navidad_ano_nuevo"] .brand-link::after {
  content: "\2726";
  color: #d5a629;
  font-size: 0.92rem;
  line-height: 1;
}

body[data-public-theme="navidad_ano_nuevo"] .btn-primary,
body[data-public-theme="navidad_ano_nuevo"] .client-mini-cart__cta {
  background: linear-gradient(135deg, #0b6b3a, #12834a);
}

body[data-public-theme="navidad_ano_nuevo"] .chip-active,
body[data-public-theme="navidad_ano_nuevo"] .customer-tab-btn.is-active {
  border-color: #0b6b3a;
  background: #0b6b3a;
  color: #ffffff;
}

body[data-public-theme="navidad_ano_nuevo"] .client-bottom-nav__shell {
  border-color: rgba(11, 107, 58, 0.22);
  background: linear-gradient(180deg, rgba(255, 255, 255, 0.98), rgba(240, 249, 244, 0.97));
  box-shadow: 0 20px 42px rgba(11, 107, 58, 0.19);
}

body[data-public-theme="navidad_ano_nuevo"] .client-bottom-nav__item-cart {
  background: linear-gradient(145deg, #12834a 0%, #0b6b3a 68%, #8f1828 100%);
  box-shadow: 0 16px 30px rgba(11, 107, 58, 0.3);
}

body[data-public-theme="navidad_ano_nuevo"].theme-dark {
  --text-main: #f0f7f2;
  --text-soft: #b2c9ba;
  --surface: #0d211a;
  --surface-alt: #143326;
  --border: #315d49;
  --client-accent-soft: rgba(181, 31, 50, 0.2);
  --client-accent-border: rgba(239, 116, 132, 0.46);
  --client-accent-ink: #ffd7dd;
  background:
    linear-gradient(150deg, rgba(18, 131, 74, 0.22), transparent 35%),
    linear-gradient(210deg, rgba(181, 31, 50, 0.17), transparent 38%),
    linear-gradient(180deg, #081711 0%, #0d221a 58%, #101f1a 100%);
}

body[data-public-theme="navidad_ano_nuevo"].theme-dark .topbar,
body[data-public-theme="navidad_ano_nuevo"].theme-dark .client-bottom-nav__shell {
  border-color: rgba(102, 183, 137, 0.3);
  background: linear-gradient(145deg, rgba(14, 43, 31, 0.97), rgba(8, 27, 20, 0.98));
  box-shadow: 0 20px 42px rgba(1, 12, 8, 0.5);
}

@media (prefers-reduced-motion: reduce) {
  body[data-public-theme] .topbar,
  body[data-public-theme] .client-bottom-nav__shell,
  body[data-public-theme] .favorite-toggle-btn {
    transition: none !important;
  }
}