/* Enclave Bazaar — layer on top of the shared zameen.css / portal-unify.css
   token system. Uses --z-* and --be-* variables so light + dark both work.  */

/* ── Hero ── */
.bz-hero {
  background: linear-gradient(135deg, #0a5c44 0%, #0d6b4d 45%, #127a5c 100%);
  color: #fff;
  padding: 34px 0 40px;
}
.bz-hero h1 {
  margin: 0 0 6px;
  font-size: clamp(1.5rem, 4.2vw, 2.1rem);
  color: #fff;
}
.bz-hero p { margin: 0 0 20px; opacity: 0.92; font-size: 0.98rem; }
.bz-search {
  display: flex;
  gap: 10px;
  max-width: 720px;
  background: #fff;
  padding: 8px;
  border-radius: 14px;
  box-shadow: 0 18px 40px -12px rgba(0, 0, 0, 0.35);
}
.bz-search-field {
  flex: 1;
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 0 10px;
}
.bz-search-icon { font-size: 1.05rem; opacity: 0.7; }
.bz-search-field input {
  width: 100%;
  border: 0;
  outline: 0;
  font-size: 1rem;
  padding: 12px 0;
  background: transparent;
  color: #14201b;
  font-family: inherit;
}
.bz-search-btn { white-space: nowrap; border-radius: 10px; }

/* Search page */
.bz-search-chips { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 14px; max-width: 660px; }
.bz-chip { display: inline-block; padding: 6px 13px; border-radius: 999px; background: rgba(255,255,255,.16);
  color: #fff; text-decoration: none; font-size: .85rem; font-weight: 600; border: 1px solid rgba(255,255,255,.25); }
.bz-chip:hover { background: rgba(255,255,255,.28); }
.bz-search-intro { padding: 26px 0 60px; }
.bz-search-portal { display: grid; grid-template-columns: 1fr; gap: 14px; }
@media (min-width: 720px) { .bz-search-portal { grid-template-columns: repeat(3, 1fr); } }
.bz-search-portal a { display: flex; flex-direction: column; gap: 3px; padding: 22px; border-radius: 14px; text-decoration: none;
  background: var(--z-card); border: 1px solid var(--be-border, var(--z-border)); color: inherit; transition: transform .12s, border-color .12s, box-shadow .12s; }
.bz-search-portal a:hover { transform: translateY(-3px); border-color: var(--z-green); box-shadow: var(--be-shadow-hover, var(--shadow-hover)); }
.bz-search-portal span { font-size: 1.8rem; }
.bz-search-portal b { font-size: 1.05rem; }
.bz-search-portal small { color: var(--be-text-muted, var(--z-muted)); }
.bz-search-sec { margin-bottom: 34px; }
.bz-sec-head { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; margin: 0 0 14px; }
.bz-sec-head h2 { font-size: 1.15rem; margin: 0; display: flex; align-items: center; gap: 8px; }
.bz-sec-head h2 span { font-size: .78rem; font-weight: 700; color: var(--be-text-muted, var(--z-muted)); background: var(--be-surface-2, #eef1f0); padding: 2px 9px; border-radius: 999px; }

/* ── Layout ── */
.bz-main { padding: 22px 16px 60px; }

/* ── Rich landing (home) ── */
.bz-hero-home {
  position: relative;
  padding: 56px 0 62px;
  background-color: #0a5240;
  background-image:
    linear-gradient(90deg, rgba(6,42,31,.94) 0%, rgba(6,42,31,.62) 40%, rgba(6,42,31,.14) 66%, rgba(6,42,31,0) 84%),
    url("../img/hero-bazaar.svg");
  background-size: cover;
  background-position: center right;
  background-repeat: no-repeat;
  /* No overflow:hidden — the search autocomplete panel must be able to open
     below the search card (esp. when it stacks at the bottom on mobile). The
     banner is a background image, so it can't overflow anyway. */
}
.bz-hero-inner { display: flex; align-items: center; justify-content: space-between; gap: 40px; }
.bz-hero-copy { flex: 1 1 440px; min-width: 0; max-width: 520px; }
.bz-hero .bz-hero-h1 { margin: 0 0 14px; font-weight: 800; line-height: 1.1; letter-spacing: -.01em; color: #fff;
  font-size: clamp(1.9rem, 4.4vw, 3rem); }
.bz-hero-accent { background: linear-gradient(90deg, #f0d585, #a8db6b); -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent; color: transparent; }
.bz-hero-copy p { margin: 0; font-size: 1rem; line-height: 1.5; color: rgba(255,255,255,.9); max-width: 440px; }
.bz-hero-search-card { flex: 0 0 auto; width: 520px; max-width: 48%;
  background: rgba(5,38,28,.5); border: 1px solid rgba(255,255,255,.14); border-radius: 20px; padding: 16px;
  box-shadow: 0 24px 60px -22px rgba(0,0,0,.6); backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px); }
.bz-hero-search-card .bz-search { max-width: none; margin: 0; }
.bz-hsc-cat { display: flex; align-items: center; gap: 6px; padding: 0 10px 0 6px; border-inline-end: 1px solid #e2e6e4; white-space: nowrap; }
.bz-hsc-cat select { border: 0; background: transparent; font-family: inherit; font-size: .9rem; font-weight: 600; color: #14201b; outline: 0; cursor: pointer; padding: 11px 0; max-width: 128px; }
.bz-hero-pills { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 14px; }
.bz-hero-pills a { background: rgba(255,255,255,.14); border: 1px solid rgba(255,255,255,.24); color: #fff; text-decoration: none;
  padding: 7px 14px; border-radius: 999px; font-size: .84rem; font-weight: 600; }
.bz-hero-pills a:hover { background: rgba(255,255,255,.26); }
@media (max-width: 900px) {
  .bz-hero-inner { flex-direction: column; align-items: stretch; gap: 16px; justify-content: flex-start; }
  /* CRITICAL: reset flex on the copy. Its desktop `flex:1 1 440px` treats 440px
     as a WIDTH in the row layout, but once stacked into a column that 440px
     becomes a HEIGHT and flex-grow inflates it — leaving ~300px of dead space
     that shoved the search bar to the bottom of the screen. Natural height only. */
  .bz-hero-copy { flex: 0 0 auto; max-width: 100%; }
  /* The 90deg gradient is built for the desktop split layout (dark left, image
     right). Stacked full-width on mobile it leaves the headline's right half
     over the washed-out image — so switch to an even vertical overlay that keeps
     white text readable edge-to-edge, and centre the banner. */
  .bz-hero-home {
    padding: 30px 0 34px;
    background-image:
      linear-gradient(180deg, rgba(5,40,29,.90) 0%, rgba(5,40,29,.74) 100%),
      url("../img/hero-bazaar.svg");
    background-position: center;
  }
  /* Drop the glass card on mobile — a dark translucent card wrapping a white
     search box on top of a photo reads as heavy clutter. Let the white search
     module + pills sit directly on the hero. */
  .bz-hero-search-card {
    width: 100%; max-width: 100%;
    background: transparent; border: 0; box-shadow: none; padding: 0;
    backdrop-filter: none; -webkit-backdrop-filter: none;
  }
}
@media (max-width: 560px) {
  .bz-hero-search-card .bz-search { flex-wrap: wrap; }
  .bz-hsc-cat { border-inline-end: 0; border-bottom: 1px solid #e2e6e4; width: 100%; padding-bottom: 4px; }
  .bz-hsc-cat select { max-width: none; flex: 1; }
  .bz-hero-search-card .bz-search-field { flex-basis: 100%; }
  .bz-hero-search-card .bz-search-btn { flex-basis: 100%; }
}
.bz-home { padding: 8px 16px 60px; }
.bz-home-sec { margin: 30px 0; }
.bz-home-sec .bz-sec-head { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; margin-bottom: 14px; }
.bz-home-sec .bz-sec-head h2 { font-size: 1.2rem; margin: 0; letter-spacing: -.02em; }
.bz-home-cats { display: grid; grid-template-columns: repeat(auto-fill, minmax(140px, 1fr)); gap: 10px; }
.bz-home-cat { display: flex; flex-direction: column; align-items: center; gap: 4px; padding: 16px 10px; border-radius: 13px; text-decoration: none;
  background: var(--z-card); border: 1px solid var(--be-border, var(--z-border)); color: var(--be-text, var(--z-text)); transition: transform .12s, border-color .12s; text-align: center; }
.bz-home-cat:hover { transform: translateY(-3px); border-color: var(--z-green); }
.bz-home-cat span { font-size: 1.7rem; }
.bz-home-cat b { font-size: .84rem; font-weight: 600; line-height: 1.25; }
.bz-home-cat small { font-size: .72rem; color: var(--be-text-muted, var(--z-muted)); font-variant-numeric: tabular-nums; }
.bz-home-cat-prop { background: linear-gradient(140deg, rgba(37,99,168,.12), transparent); border-color: rgba(37,99,168,.3); }
.bz-home-row { display: flex; gap: 14px; overflow-x: auto; padding: 2px 2px 12px; scroll-snap-type: x proximity; }
.bz-home-row .bz-card { flex: 0 0 210px; scroll-snap-align: start; }
@media (min-width: 640px) { .bz-home-row .bz-card { flex-basis: 230px; } }
.bz-home-row::-webkit-scrollbar { height: 7px; }
.bz-home-row::-webkit-scrollbar-thumb { background: var(--be-border-strong, var(--z-border)); border-radius: 99px; }
/* Responsive grid: tiles wrap into as many uniform rows as needed and the column
   count adapts to the viewport (no horizontal scroll). Text is clamped so labels
   never wrap into a ragged block. */
.bz-home-tiles { display: grid; grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); gap: 12px; }
.bz-home-tile { min-width: 0;
  display: flex; flex-direction: column; gap: 3px; padding: 16px; border-radius: 14px; text-decoration: none;
  background: var(--z-card); border: 1px solid var(--be-border, var(--z-border)); color: var(--be-text, var(--z-text)); transition: transform .12s, border-color .12s, box-shadow .12s; }
.bz-home-tile:hover { transform: translateY(-3px); border-color: var(--z-green); box-shadow: var(--be-shadow-hover, var(--shadow-hover)); }
.bz-home-tile-ic { font-size: 1.9rem; }
.bz-home-tile b { font-size: .96rem; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 100%; }
.bz-home-tile small { font-size: .8rem; color: var(--be-text-muted, var(--z-muted)); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 100%; }
.bz-home-cta { display: flex; align-items: center; justify-content: space-between; gap: 18px; flex-wrap: wrap; margin: 34px 0 10px;
  padding: 26px; border-radius: 16px; background: linear-gradient(135deg, #0a5c44, #12805f); color: #fff; }
.bz-home-cta h2 { margin: 0 0 4px; color: #fff; }
.bz-home-cta p { margin: 0; opacity: .92; font-size: .95rem; }
.bz-home-cta .btn-primary { background: #fff; color: var(--z-green); white-space: nowrap; }

/* ── Category rail ── */
.bz-cats {
  display: flex;
  gap: 8px;
  overflow-x: auto;
  padding: 4px 0 12px;
  scrollbar-width: thin;
  -webkit-overflow-scrolling: touch;
}
.bz-cat {
  flex: 0 0 auto;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 9px 14px;
  border-radius: 999px;
  background: var(--z-card);
  border: 1px solid var(--be-border, var(--z-border));
  color: var(--be-text, var(--z-text));
  text-decoration: none;
  font-size: 0.9rem;
  font-weight: 600;
  white-space: nowrap;
  transition: border-color 0.15s, background 0.15s, transform 0.1s;
}
.bz-cat:hover { border-color: var(--z-green); transform: translateY(-1px); }
.bz-cat.is-active { background: var(--z-green); color: #fff; border-color: var(--z-green); }
.bz-cat-icon { font-size: 1.05rem; }
.bz-cat-count {
  font-size: 0.72rem;
  background: rgba(0, 0, 0, 0.08);
  padding: 1px 7px;
  border-radius: 999px;
}
.bz-cat.is-active .bz-cat-count { background: rgba(255, 255, 255, 0.25); }
.bz-cat-prop.is-active { background: #2f6fb0; border-color: #2f6fb0; color: #fff; }
.bz-cat-prop:hover { border-color: #2f6fb0; }

/* Property tag on cards + promo strip + purpose label */
.bz-tag-prop {
  position: absolute; top: 8px; left: 8px; background: #2563a8; color: #fff;
  font-size: 0.68rem; font-weight: 800; text-transform: uppercase; letter-spacing: 0.03em;
  padding: 3px 8px; border-radius: 6px;
}
.bz-promo {
  display: flex; align-items: center; gap: 16px; margin: 4px 0 4px; padding: 15px 18px;
  border-radius: 14px; border: 1px solid var(--be-border, var(--z-border));
  background: linear-gradient(120deg, rgba(37, 99, 168, 0.10), transparent);
}
.bz-promo-ic { font-size: 1.7rem; }
.bz-promo-txt { flex: 1; display: flex; flex-direction: column; }
.bz-promo-txt b { font-size: 0.98rem; }
.bz-promo-txt span { font-size: 0.84rem; color: var(--be-text-muted, var(--z-muted)); }
.bz-promo-btn {
  background: #2563a8; color: #fff; border: 0; padding: 10px 16px; border-radius: 10px;
  font-weight: 700; font-size: 0.86rem; text-decoration: none; white-space: nowrap;
}
.bz-promo-btn:hover { filter: brightness(1.06); }
.bz-prop-purpose { font-size: 0.82rem; font-weight: 700; color: #2563a8; text-transform: uppercase; letter-spacing: 0.03em; margin-top: 2px; }
:root[data-theme="dark"] .bz-prop-purpose { color: #6ea8e8; }
.bz-promo-svc { background: linear-gradient(120deg, var(--emerald-soft, rgba(13,107,77,0.10)), transparent); }
.bz-promo-btn-svc { background: var(--z-green); }
:root[data-theme="dark"] .bz-promo-btn-svc { color: #06281e; }

/* ── Filter bar ── */
.bz-filters {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-end;
  gap: 12px;
  padding: 14px 16px;
  margin: 6px 0 20px;
  background: var(--z-card);
  border: 1px solid var(--be-border, var(--z-border));
  border-radius: 12px;
}
.bz-filter { display: flex; flex-direction: column; gap: 5px; }
.bz-filter > span {
  font-size: 0.7rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  color: var(--be-text-muted, var(--z-muted));
}
.bz-filter select,
.bz-filter input {
  padding: 8px 10px;
  border: 1px solid var(--be-border, var(--z-border));
  border-radius: 8px;
  font-size: 0.9rem;
  font-family: inherit;
  background: var(--be-surface, #fff);
  color: var(--be-text, var(--z-text));
}
.bz-price-range { display: flex; gap: 6px; }
.bz-price-range input { width: 90px; }
.bz-filter-apply {
  background: var(--z-green);
  color: #fff;
  border: 0;
  padding: 9px 16px;
  border-radius: 8px;
  font-weight: 600;
  cursor: pointer;
}
.bz-filter-clear {
  color: var(--be-text-muted, var(--z-muted));
  text-decoration: none;
  font-size: 0.85rem;
  padding: 9px 4px;
}
.bz-filter-clear:hover { color: var(--z-green); }

/* ── Results ── */
.bz-results-head { margin: 0 0 14px; color: var(--be-text-soft, var(--z-muted)); font-size: 0.92rem; }
.bz-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 14px;
}
@media (min-width: 640px) { .bz-grid { grid-template-columns: repeat(3, 1fr); } }
@media (min-width: 960px) { .bz-grid { grid-template-columns: repeat(4, 1fr); gap: 18px; } }

.bz-card {
  display: flex;
  flex-direction: column;
  background: var(--z-card);
  border: 1px solid var(--be-border, var(--z-border));
  border-radius: 12px;
  overflow: hidden;
  text-decoration: none;
  color: inherit;
  transition: transform 0.12s, box-shadow 0.12s, border-color 0.12s;
}
.bz-card:hover {
  transform: translateY(-3px);
  box-shadow: var(--be-shadow-hover, var(--shadow-hover));
  border-color: var(--z-green);
}
.bz-card.is-featured { border-color: var(--z-gold); }
.bz-card-media {
  position: relative;
  aspect-ratio: 4 / 3;
  background: var(--be-surface-2, #eef1f0);
  overflow: hidden;
}
.bz-card-media img { width: 100%; height: 100%; object-fit: cover; display: block; }
.bz-card-noimg {
  width: 100%; height: 100%;
  display: flex; align-items: center; justify-content: center;
  font-size: 2.8rem;
  filter: drop-shadow(0 2px 6px rgba(0, 0, 0, 0.25));
}
.bz-gallery-tile { display: grid; place-items: center; }
.bz-gallery-tile span { font-size: 5.5rem; filter: drop-shadow(0 3px 10px rgba(0, 0, 0, 0.28)); }
.bz-badge {
  position: absolute;
  top: 8px; left: 8px;
  background: var(--z-gold);
  color: #1a1a1a;
  font-size: 0.68rem;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: 0.03em;
  padding: 3px 8px;
  border-radius: 6px;
}
.bz-card-body { padding: 10px 12px 13px; display: flex; flex-direction: column; gap: 4px; }
.bz-card-price { font-size: 1.05rem; font-weight: 800; color: var(--z-green); font-family: var(--be-font-display, inherit); }
html[data-theme="dark"] .bz-card-price { color: var(--z-green-dark, #34D399); }
.bz-neg { font-size: 0.7rem; font-weight: 600; color: var(--be-text-muted, var(--z-muted)); }
.bz-price-ask { font-size: 0.9rem; font-weight: 600; color: var(--be-text-muted, var(--z-muted)); }
.bz-card-title {
  font-size: 0.92rem;
  line-height: 1.35;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.bz-card-meta {
  display: flex; flex-wrap: wrap; gap: 8px;
  font-size: 0.78rem;
  color: var(--be-text-muted, var(--z-muted));
  margin-top: 2px;
}

/* ── Empty / error state ── */
.bz-empty { text-align: center; padding: 60px 20px; }
.bz-empty-icon { font-size: 3rem; margin-bottom: 8px; }
.bz-empty h2 { margin: 0 0 6px; }
.bz-empty p { margin: 0 0 18px; color: var(--be-text-muted, var(--z-muted)); }

/* ── Home Services (S2) ── */
.bz-hero-hs { background: linear-gradient(135deg, #0a5c44 0%, #12805f 50%, #0f6ba0 100%); }
.bz-hs-tile .bz-dir-tile-count { min-height: 2.4em; }
.bz-hs-note { margin: 6px 0 50px; color: var(--be-text-muted, var(--z-muted)); font-size: .88rem; }
.bz-hs-note a { color: var(--z-green); }
.bz-hs-grid { display: grid; grid-template-columns: 1fr; gap: 22px; padding-bottom: 60px; }
@media (min-width: 860px) { .bz-hs-grid { grid-template-columns: 1.1fr 1fr; align-items: start; } }
.bz-hs-request { background: var(--z-card); border: 1px solid var(--be-border, var(--z-border)); border-radius: 16px; padding: 20px; }
.bz-hs-request h2, .bz-hs-pros h2 { font-size: 1.15rem; margin: 0 0 6px; }
.bz-hs-request .bz-field, .bz-hs-request .btn-primary { margin-top: 12px; }
.bz-hs-request textarea, .bz-hs-request input, .bz-hs-request select { width: 100%; padding: 10px 12px; border: 1px solid var(--be-border-strong, var(--z-border));
  border-radius: 9px; font-family: inherit; font-size: .95rem; background: var(--be-surface, #fff); color: var(--be-text, var(--z-text)); }
.bz-hs-request .btn-primary { width: 100%; }
.bz-hs-pros { min-width: 0; }
.bz-hs-banner { display: flex; align-items: center; gap: 16px; margin: 16px 0 4px; padding: 18px; border-radius: 14px;
  background: linear-gradient(120deg, rgba(15,107,160,.12), transparent); border: 1px solid var(--be-border, var(--z-border)); }
.bz-hs-banner-ic { font-size: 2rem; }
.bz-hs-banner-txt { flex: 1; }
.bz-hs-banner-txt b { font-size: 1rem; }
.bz-hs-banner-txt span { display: block; font-size: .85rem; color: var(--be-text-muted, var(--z-muted)); }
.bz-hs-banner-btn { background: #0f6ba0; color: #fff; text-decoration: none; padding: 10px 16px; border-radius: 10px; font-weight: 700; font-size: .86rem; white-space: nowrap; }

/* ── Services & Business directory ── */
.bz-hero-dir { background: linear-gradient(135deg, #0a5c44 0%, #106b52 45%, #0e7c6a 100%); }
.bz-dir-tiles { display: grid; grid-template-columns: repeat(auto-fill, minmax(200px, 1fr)); gap: 14px; padding-bottom: 50px; }
.bz-dir-tile { display: flex; flex-direction: column; gap: 4px; padding: 20px; border-radius: 14px; text-decoration: none;
  background: var(--z-card); border: 1px solid var(--be-border, var(--z-border)); color: inherit;
  transition: transform .12s, box-shadow .12s, border-color .12s; }
.bz-dir-tile:hover { transform: translateY(-3px); box-shadow: var(--be-shadow-hover, var(--shadow-hover)); border-color: var(--z-green); }
.bz-dir-tile-ic { font-size: 2rem; }
.bz-dir-tile-name { font-weight: 700; font-size: 1rem; }
.bz-dir-tile-count { font-size: .82rem; color: var(--be-text-muted, var(--z-muted)); }

.bz-dir-list { display: flex; flex-direction: column; gap: 12px; padding-bottom: 50px; }
.bz-dir-card { display: flex; gap: 14px; align-items: center; background: var(--z-card);
  border: 1px solid var(--be-border, var(--z-border)); border-radius: 12px; padding: 14px 16px; }
/* Default category avatar for directory rows (photo when available, else emoji). */
.bz-dir-av { position: relative; width: 58px; height: 58px; flex: 0 0 auto; border-radius: 50%; overflow: hidden;
  display: grid; place-items: center; text-decoration: none;
  background: linear-gradient(140deg, var(--z-green-light, #e6f7f0), var(--z-bg)); }
.bz-dir-av.is-doc { background: linear-gradient(140deg, #e6f7f0, #cdeee0); }
.bz-dir-av.is-law { background: linear-gradient(140deg, #fff4e0, #ffe8bf); }
.bz-dir-av img { width: 100%; height: 100%; object-fit: cover; }
.bz-dir-av-emoji { font-size: 1.7rem; line-height: 1; }
.bz-dir-av-check { position: absolute; right: -2px; bottom: -2px; font-size: 19px; line-height: 0;
  filter: drop-shadow(0 1px 1.5px rgba(0,0,0,.35)); }
:root[data-theme="dark"] .bz-dir-av { background: linear-gradient(140deg, #123a2c, #0d2a20); }
:root[data-theme="dark"] .bz-dir-av.is-doc { background: linear-gradient(140deg, #123a2c, #0d2a20); }
:root[data-theme="dark"] .bz-dir-av.is-law { background: linear-gradient(140deg, #40320f, #2a2109); }
:root[data-theme="dark"] .bz-dir-av-check { color: #06281e; }
.bz-dir-facts { display: flex; flex-wrap: wrap; gap: 6px; margin: 4px 0 5px; }
.bz-dir-fact { display: inline-flex; align-items: center; gap: 4px; font-size: .76rem; font-weight: 600;
  color: var(--z-green-dark, #0a7d3a); background: var(--z-green-light, #e9f6ef);
  padding: 2px 9px; border-radius: 999px; white-space: nowrap; }
:root[data-theme="dark"] .bz-dir-fact { color: #8fe3b8; background: #123a2c80; }
.bz-dir-card-main { flex: 1; min-width: 0; text-decoration: none; color: inherit; }
.bz-dir-card-name { font-weight: 700; font-size: 1rem; }
.bz-dir-card-cat { font-size: .84rem; color: var(--z-green); margin: 1px 0; }
:root[data-theme="dark"] .bz-dir-card-cat { color: var(--z-green-dark, #34D399); }
.bz-dir-card-meta { display: flex; flex-wrap: wrap; gap: 10px; font-size: .82rem; color: var(--be-text-muted, var(--z-muted)); }
.bz-dir-card-actions { flex: 0 0 auto; }
.bz-dir-call { display: inline-block; background: var(--z-green); color: #fff; padding: 9px 14px; border-radius: 9px; font-weight: 700; font-size: .86rem; text-decoration: none; }
:root[data-theme="dark"] .bz-dir-call { color: #06281e; }
.bz-dir-card-actions-col { display: flex; gap: 6px; align-items: center; }
.bz-dir-wa { display: inline-grid; place-items: center; width: 38px; height: 38px; border-radius: 9px; text-decoration: none;
  border: 1px solid var(--wa, #1FA855); color: var(--wa, #128C4B); font-size: 1rem; }
.bz-dir-wa:hover { background: rgba(31,168,85,.1); }
:root[data-theme="dark"] .bz-dir-wa { color: #34d399; border-color: #34d399; }
.bz-promo-hs { background: linear-gradient(120deg, rgba(15,107,160,.10), transparent); }
.bz-promo-btn-hs { background: #0f6ba0; }

.bz-biz { max-width: 720px; background: var(--z-card); border: 1px solid var(--be-border, var(--z-border)); border-radius: 16px; padding: 24px; margin-bottom: 60px; }
.bz-biz-head { display: flex; gap: 14px; align-items: center; }
.bz-biz-ic { font-size: 2.4rem; }
.bz-biz-name { margin: 0; font-size: 1.4rem; }
.bz-biz-cat { color: var(--z-green); font-size: .9rem; font-weight: 600; }
:root[data-theme="dark"] .bz-biz-cat { color: var(--z-green-dark, #34D399); }
.bz-biz-facts { list-style: none; padding: 0; margin: 18px 0; display: flex; flex-direction: column; gap: 10px; }
.bz-biz-facts li { display: flex; justify-content: space-between; gap: 14px; font-size: .92rem; }
.bz-biz-facts span { color: var(--be-text-muted, var(--z-muted)); }
.bz-biz-facts strong { text-align: end; }
.bz-biz-detail { color: var(--be-text-soft, var(--z-text)); line-height: 1.7; margin-bottom: 18px; }
.bz-biz-contact h3 { font-size: 1rem; margin: 0 0 10px; }
.bz-biz-phones { display: flex; flex-direction: column; gap: 10px; }
.bz-biz-phone { display: flex; gap: 8px; flex-wrap: wrap; }
.bz-biz-call { text-align: center; }
.bz-biz-note { font-size: .82rem; color: var(--be-text-muted, var(--z-muted)); margin-top: 20px; }
.bz-biz-note a { color: var(--z-green); }

/* Rich business profile (S1) */
.bz-biz-headmain { flex: 1; min-width: 0; }
.bz-biz-sub { display: flex; flex-wrap: wrap; gap: 10px; align-items: center; margin-top: 6px; font-size: .86rem; }
.bz-stars { color: #f5a623; letter-spacing: 1px; }
.bz-stars-sm { color: #f5a623; letter-spacing: .5px; font-size: .82rem; }
.bz-rating-num { color: var(--be-text-muted, var(--z-muted)); font-weight: 600; }
/* Rating slot on every professional card: stars + value, or a neutral "New". */
.bz-rating { display: inline-flex; align-items: center; gap: 4px; }
.bz-rating-val { color: var(--be-text-muted, var(--z-muted)); font-weight: 600; direction: ltr; }
.bz-rating-new { gap: 7px; }
.bz-rating-new-lbl { font-weight: 800; font-size: .68rem; letter-spacing: .03em; text-transform: uppercase;
  color: #0f6ba0; background: rgba(15,107,160,.12); padding: 2px 8px; border-radius: 999px; }
.bz-rating-new-sub { color: var(--be-text-muted, var(--z-muted)); font-size: .8rem; }
:root[data-theme="dark"] .bz-rating-new-lbl { color: #6ea8e8; background: rgba(110,168,232,.16); }
.bz-open { color: #0a7d3a; font-weight: 700; }
.bz-open-sm { color: #0a7d3a; font-weight: 700; font-size: .8rem; }
.bz-bookable-sm { color: #0f6ba0; font-weight: 700; font-size: .8rem; }
:root[data-theme="dark"] .bz-bookable-sm { color: #6ea8e8; }
:root[data-theme="dark"] .bz-open, :root[data-theme="dark"] .bz-open-sm { color: #34d399; }
.bz-closed { color: var(--be-text-muted, var(--z-muted)); font-weight: 600; }
.bz-biz-gallery { display: flex; gap: 8px; overflow-x: auto; margin: 16px 0; padding-bottom: 4px; }
.bz-biz-gallery img { width: 150px; height: 110px; object-fit: cover; border-radius: 10px; flex: 0 0 auto; }
.bz-biz-chips { display: flex; flex-wrap: wrap; gap: 7px; margin: 14px 0; }
.bz-biz-chip { font-size: .8rem; font-weight: 600; padding: 4px 11px; border-radius: 999px; background: var(--emerald-soft, var(--z-green-light)); color: var(--z-green); }
:root[data-theme="dark"] .bz-biz-chip { color: var(--z-green-dark, #34D399); }
.bz-biz-services h3 { font-size: 1rem; margin: 18px 0 8px; }
.bz-biz-services ul { margin: 0; padding-left: 20px; color: var(--be-text-soft, var(--z-text)); font-size: .9rem; }
.bz-biz-actions { display: flex; flex-wrap: wrap; gap: 10px; margin: 20px 0; }
.bz-biz-actions .btn-primary, .bz-biz-actions .bz-contact-wa, .bz-btn-req { padding: 11px 16px; font-weight: 700; border-radius: 11px; font-size: .92rem; }
.bz-btn-req { background: none; border: 1px solid var(--z-green); color: var(--z-green); cursor: pointer; }
.bz-btn-req:hover { background: var(--emerald-soft, var(--z-green-light)); }
:root[data-theme="dark"] .bz-btn-req { color: var(--z-green-dark, #34D399); border-color: var(--z-green-dark, #34D399); }

.bz-reviews { margin-top: 24px; border-top: 1px solid var(--be-border, var(--z-border)); padding-top: 18px; }
.bz-reviews-head { display: flex; justify-content: space-between; align-items: center; gap: 12px; margin-bottom: 14px; }
.bz-reviews-head h3 { margin: 0; font-size: 1.1rem; }
.bz-review { padding: 12px 0; border-bottom: 1px solid var(--be-border, var(--z-border)); }
.bz-review-head { display: flex; gap: 8px; align-items: center; flex-wrap: wrap; font-size: .9rem; }
.bz-review-text { margin: 6px 0 0; color: var(--be-text-soft, var(--z-text)); line-height: 1.6; }
.bz-review-reply { margin: 8px 0 0; padding: 8px 12px; background: var(--be-surface-2, #f4f7f5); border-radius: 8px; font-size: .86rem; }
.bz-starpick { display: flex; gap: 4px; margin-bottom: 12px; }
.bz-starbtn { background: none; border: 0; font-size: 1.9rem; line-height: 1; color: #f5a623; cursor: pointer; padding: 0; }
/* Appointment booking (S3) */
.bz-book { margin-top: 22px; padding-top: 18px; border-top: 1px solid var(--be-border, var(--z-border)); }
.bz-book h2 { font-size: 1.1rem; margin: 0 0 12px; }
.bz-book-dates { display: flex; gap: 8px; overflow-x: auto; padding-bottom: 8px; margin-bottom: 12px; }
.bz-book-date { flex: 0 0 auto; padding: 8px 14px; border-radius: 10px; border: 1px solid var(--be-border, var(--z-border));
  background: var(--z-card); color: var(--be-text, var(--z-text)); font-weight: 600; font-size: .85rem; cursor: pointer; white-space: nowrap; }
.bz-book-date.on { background: var(--z-green); border-color: var(--z-green); color: #fff; }
:root[data-theme="dark"] .bz-book-date.on { color: #06281e; }
.bz-book-slots { display: flex; flex-wrap: wrap; gap: 8px; }
.bz-book-slots[hidden] { display: none; } /* [hidden] loses to display:flex — restore it (CLAUDE.md §9) */
.bz-slot { padding: 8px 14px; border-radius: 9px; border: 1px solid var(--z-green); background: var(--emerald-soft, var(--z-green-light));
  color: var(--z-green); font-weight: 600; font-size: .86rem; cursor: pointer; font-variant-numeric: tabular-nums; }
.bz-slot:hover { background: var(--z-green); color: #fff; }
:root[data-theme="dark"] .bz-slot { color: var(--z-green-dark, #34D399); }
.bz-slot.booked { background: var(--z-green); color: #fff; border-color: var(--z-green); cursor: default; }
.bz-slot.gone { opacity: .5; text-decoration: line-through; cursor: not-allowed; }
#bz-book-signin { margin-top: 12px; }

/* Availability editor + dashboard appointments */
.bz-avail { border: 1px solid var(--be-border, var(--z-border)); border-radius: 12px; padding: 8px 14px 14px; margin: 4px 0; }
.bz-avail legend { padding: 0 6px; }
.bz-avail-days { display: flex; flex-wrap: wrap; gap: 8px; margin: 8px 0 12px; }
.bz-daychip { display: inline-flex; align-items: center; gap: 5px; padding: 5px 10px; border-radius: 999px;
  border: 1px solid var(--be-border-strong, var(--z-border)); font-size: .82rem; font-weight: 600; cursor: pointer; }
.bz-dash-appts { margin: 8px 0 14px; }
.bz-dash-appts h4 { margin: 0 0 8px; font-size: .82rem; text-transform: uppercase; letter-spacing: .05em; color: var(--be-text-muted, var(--z-muted)); }
.bz-appt-row-actions { display: flex; gap: 12px; margin-top: 4px; }

.bz-review-form { background: var(--be-surface-2, #f4f7f5); border: 1px solid var(--be-border, var(--z-border)); border-radius: 12px; padding: 16px; margin: 4px 0 16px; }
.bz-review-form textarea { width: 100%; padding: 10px 12px; border: 1px solid var(--be-border-strong, var(--z-border)); border-radius: 9px; font-family: inherit; font-size: .95rem; background: var(--be-surface, #fff); color: var(--be-text, var(--z-text)); resize: vertical; }
.bz-rev-anon { margin: 12px 0; }
.bz-rev-anon small { color: var(--be-text-muted, var(--z-muted)); font-weight: 400; }
.bz-review-form-actions { display: flex; gap: 10px; }
.bz-review-note { font-size: .78rem; color: var(--be-text-muted, var(--z-muted)); margin: 10px 0 0; }

.bz-fchip { text-decoration: none; font-size: .84rem; font-weight: 600; padding: 7px 13px; border-radius: 999px;
  border: 1px solid var(--be-border, var(--z-border)); background: var(--z-card); color: var(--be-text, var(--z-text)); }
.bz-fchip:hover { border-color: var(--z-green); }
.bz-fchip.on { background: var(--z-green); border-color: var(--z-green); color: #fff; }
:root[data-theme="dark"] .bz-fchip.on { color: #06281e; }
.bz-fchip-clear { text-decoration: none; font-size: .84rem; font-weight: 600; padding: 7px 8px; color: var(--be-text-muted, var(--z-muted)); }

/* ── Professional directory: sort/filter toolbar, cards, pagination ── */
.bz-protools { display: flex; flex-wrap: wrap; align-items: flex-end; gap: 12px 16px; margin: 4px 0 18px;
  padding: 14px 16px; background: var(--z-card); border: 1px solid var(--be-border, var(--z-border)); border-radius: 14px; }
.bz-protools-selects { display: flex; flex-wrap: wrap; gap: 10px; }
.bz-protool { display: flex; flex-direction: column; gap: 4px; font-size: .68rem; font-weight: 700;
  letter-spacing: .04em; text-transform: uppercase; color: var(--be-text-muted, var(--z-muted)); }
.bz-protool select { font: inherit; text-transform: none; letter-spacing: 0; font-weight: 600; font-size: .9rem;
  padding: 8px 12px; border-radius: 10px; border: 1px solid var(--be-border, var(--z-border));
  background: var(--z-card); color: var(--be-text, var(--z-text)); cursor: pointer; max-width: 220px; }
.bz-protool select:focus-visible { outline: 2px solid var(--z-green); outline-offset: 1px; }
.bz-protools-toggles { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; }
.bz-protools-toggles .bz-fchip { display: inline-flex; align-items: center; gap: 5px; cursor: pointer; position: relative; }
.bz-protools-toggles .bz-fchip input { position: absolute; opacity: 0; width: 0; height: 0; pointer-events: none; }
.bz-protools-toggles .bz-fchip:focus-within { outline: 2px solid var(--z-green); outline-offset: 2px; }
.bz-protools-apply { display: flex; align-items: center; gap: 8px; margin-left: auto; }
.bz-results-page { color: var(--be-text-muted, var(--z-muted)); font-weight: 600; }

.bz-pro-list { display: grid; grid-template-columns: repeat(auto-fill, minmax(330px, 1fr)); gap: 14px; padding-bottom: 40px; }
.bz-pro-card { position: relative; display: flex; flex-direction: column; gap: 12px; background: var(--z-card);
  border: 1px solid var(--be-border, var(--z-border)); border-radius: 18px; padding: 18px;
  box-shadow: 0 1px 2px rgba(16,24,40,.04); transition: box-shadow .16s ease, transform .16s ease, border-color .16s ease; }
.bz-pro-card:hover { box-shadow: 0 10px 30px rgba(16,24,40,.11); transform: translateY(-2px); }
.bz-pro-card.is-verified { border-color: rgba(29,155,240,.30); }
.bz-pro-flag { position: absolute; top: 12px; right: 12px; font-size: .68rem; font-weight: 800; letter-spacing: .02em;
  padding: 3px 9px; border-radius: 999px; color: #92600a; background: #fdf0d0; }
:root[data-theme="dark"] .bz-pro-flag { color: #f3c969; background: rgba(243,201,105,.14); }
/* Header is one big tap target into the profile. */
.bz-pro-head { display: flex; gap: 14px; align-items: flex-start; text-decoration: none; color: inherit; }
.bz-pro-head .bz-dir-av { width: 66px; height: 66px; box-shadow: 0 0 0 3px var(--be-surface-2, #eef1f0); }
:root[data-theme="dark"] .bz-pro-head .bz-dir-av { box-shadow: 0 0 0 3px rgba(255,255,255,.06); }
.bz-pro-head .bz-dir-av-emoji { font-size: 1.9rem; }
.bz-pro-id { min-width: 0; flex: 1; display: flex; flex-direction: column; gap: 2px; padding-right: 8px; }
.bz-pro-name { font-size: 1.05rem; font-weight: 800; color: var(--be-text, var(--z-text)); line-height: 1.3; }
.bz-pro-head:hover .bz-pro-name { color: var(--z-green-dark, var(--z-green)); }
.bz-pro-name .bz-vbadge { font-size: 17px; }
.bz-pro-spec { font-size: .9rem; font-weight: 700; color: var(--z-green-dark, #0a7d3a); }
.bz-pro-qual { font-size: .82rem; color: var(--be-text-soft, var(--z-muted)); }
.bz-pro-rating { margin-top: 3px; font-size: .84rem; }
.bz-pro-chips { display: flex; flex-wrap: wrap; gap: 6px; }
.bz-pro-chip { display: inline-flex; align-items: center; gap: 5px; font-size: .77rem; font-weight: 600;
  padding: 4px 10px; border-radius: 999px; background: var(--be-surface-2, #eef1f0); color: var(--be-text, var(--z-text)); }
.bz-pro-chip.is-open { background: rgba(10,125,58,.12); color: #0a7d3a; }
.bz-pro-chip.is-open .bz-dot { width: 7px; height: 7px; border-radius: 50%; background: #12a150; box-shadow: 0 0 0 3px rgba(18,161,80,.18); }
.bz-pro-chip.is-book { background: rgba(15,107,160,.12); color: #0f6ba0; }
.bz-pro-loc { display: flex; flex-wrap: wrap; gap: 6px 14px; font-size: .83rem; color: var(--be-text-muted, var(--z-muted)); }
.bz-pro-loc span { display: inline-flex; align-items: center; gap: 5px; }
/* Footer pinned to the bottom so every card in a row ends the same way. */
.bz-pro-foot { margin-top: auto; padding-top: 13px; border-top: 1px solid var(--be-border, var(--z-border));
  display: flex; flex-direction: column; gap: 9px; }
.bz-pro-contact { display: flex; gap: 8px; }
.bz-pro-call, .bz-pro-wa { flex: 1; display: inline-flex; align-items: center; justify-content: center; gap: 6px;
  text-decoration: none; font-weight: 700; font-size: .9rem; padding: 10px 12px; border-radius: 11px; border: 1px solid transparent; }
.bz-pro-call { background: var(--z-green); color: #fff; }
.bz-pro-call:hover { background: var(--z-green-dark, #0a7d3a); }
:root[data-theme="dark"] .bz-pro-call { color: #06281e; }
.bz-pro-wa { background: transparent; color: #128c7e; border-color: rgba(18,140,126,.45); }
.bz-pro-wa:hover { background: rgba(18,140,126,.09); }
:root[data-theme="dark"] .bz-pro-wa { color: #4fd1b5; border-color: rgba(79,209,181,.4); }
.bz-pro-view { text-align: center; text-decoration: none; font-weight: 700; font-size: .86rem;
  color: var(--z-green-dark, var(--z-green)); padding: 3px; border-radius: 8px; }
.bz-pro-view:hover { text-decoration: underline; }
.bz-pro-view.is-solo { background: var(--z-green); color: #fff; padding: 10px 12px; border-radius: 11px; font-size: .9rem; }
.bz-pro-view.is-solo:hover { background: var(--z-green-dark, #0a7d3a); text-decoration: none; }
:root[data-theme="dark"] .bz-pro-view.is-solo { color: #06281e; }
:root[data-theme="dark"] .bz-pro-view { color: #4ade80; }
.bz-pro-empty { grid-column: 1 / -1; text-align: center; padding: 44px 20px; display: flex; flex-direction: column;
  align-items: center; gap: 14px; color: var(--be-text-muted, var(--z-muted)); }
:root[data-theme="dark"] .bz-pro-chip { background: rgba(255,255,255,.07); }
:root[data-theme="dark"] .bz-pro-chip.is-open { background: rgba(52,211,153,.16); color: #34d399; }
:root[data-theme="dark"] .bz-pro-chip.is-book { background: rgba(110,168,232,.16); color: #6ea8e8; }
:root[data-theme="dark"] .bz-pro-spec { color: #34d399; }

.bz-pagination { display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: 6px; padding: 8px 0 60px; }
.bz-page-num, .bz-page-btn { text-decoration: none; font-weight: 700; font-size: .9rem; min-width: 38px; height: 38px;
  padding: 0 10px; display: inline-flex; align-items: center; justify-content: center; border-radius: 10px;
  border: 1px solid var(--be-border, var(--z-border)); background: var(--z-card); color: var(--be-text, var(--z-text)); }
.bz-page-num:hover, .bz-page-btn:hover { border-color: var(--z-green); }
.bz-page-num.is-cur { background: var(--z-green); border-color: var(--z-green); color: #fff; }
:root[data-theme="dark"] .bz-page-num.is-cur { color: #06281e; }
.bz-page-btn.is-off { opacity: .4; pointer-events: none; }

@media (max-width: 560px) {
  .bz-pro-list { grid-template-columns: 1fr; }
  .bz-protools-apply { margin-left: 0; width: 100%; }
  .bz-protool select { max-width: none; width: 100%; }
  .bz-protool { flex: 1 1 140px; }
}

/* ── Domestic-help registration ── */
/* A flex/grid element ignores the bare [hidden] attribute (CLAUDE.md §9), and
   these cards are display:flex — so the mode-exclusive resident/self blocks and
   the sign-in/form/done panels would all show at once without this guard. */
.bz-post-card[hidden], .bz-dh-form[hidden], .bz-dh [hidden] { display: none !important; }
/* .btn-primary is display:inline-block (an author rule), which beats the UA
   [hidden]{display:none} — so a hidden .btn-primary stays visible. Restore it
   globally (fixes e.g. the signed-out "Send request" and admin "Add" buttons). */
.btn-primary[hidden] { display: none !important; }
.bz-dh { max-width: 780px; margin: 0 auto; padding-bottom: 60px; display: flex; flex-direction: column; gap: 16px; }
.bz-dh-lang { display: inline-flex; align-items: center; gap: 8px; margin-top: 14px; flex-wrap: wrap; }
.bz-dh-lang-lbl { font-weight: 700; opacity: .9; }
.bz-dh-lang-btn { font: inherit; font-size: 1rem; font-weight: 700; padding: 9px 22px; border-radius: 999px; cursor: pointer;
  background: rgba(255,255,255,.16); color: #fff; border: 2px solid rgba(255,255,255,.5); }
.bz-dh-lang-btn.on { background: #fff; color: var(--z-green-dark, #0a5c31); border-color: #fff; }
.bz-dh-form { display: flex; flex-direction: column; gap: 16px; }
.bz-dh-modes { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.bz-dh-mode { display: flex; flex-direction: column; align-items: flex-start; gap: 2px; text-align: left; cursor: pointer;
  padding: 16px; border-radius: 14px; border: 2px solid var(--be-border, var(--z-border)); background: var(--be-surface, var(--z-card)); color: inherit; font: inherit; }
.bz-dh-mode.on { border-color: var(--z-green); background: var(--z-green-light); }
.bz-dh-mode-ic { font-size: 1.7rem; line-height: 1; }
.bz-dh-mode b { font-size: 1rem; }
.bz-dh-mode small { color: var(--be-text-muted, var(--z-muted)); }
.bz-dh-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 12px 16px; }
.bz-dh-note { font-size: .84rem; margin: 0 0 10px; }
.bz-dh-file { margin-top: 10px; }
.bz-dh-file-lbl { display: flex; align-items: center; gap: 10px; padding: 12px 14px; border-radius: 12px; cursor: pointer;
  border: 1.5px dashed var(--be-border-strong, var(--z-border)); background: var(--be-surface-2, #f6f8f7); transition: border-color .15s, background .15s; }
.bz-dh-file-lbl:hover { border-color: var(--z-green); }
.bz-dh-file.has-file .bz-dh-file-lbl { border-style: solid; border-color: var(--z-green); background: var(--z-green-light); }
.bz-dh-file-ic { font-size: 1.15rem; }
.bz-dh-file-txt { font-weight: 600; }
.bz-dh-file-state { margin-left: auto; font-size: .84rem; color: var(--be-text-muted, var(--z-muted)); max-width: 45%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.bz-dh-file.has-file .bz-dh-file-state { color: var(--z-green-dark, #0a7d3a); font-weight: 700; }
html[dir="rtl"] .bz-dh-file-state { margin-left: 0; margin-right: auto; }
html[dir="rtl"] .bz-dh-mode { text-align: right; align-items: flex-end; }
.bz-checkrow { display: flex; align-items: flex-start; gap: 10px; font-size: .9rem; line-height: 1.5; cursor: pointer; margin-bottom: 12px; }
.bz-checkrow input { margin-top: 3px; flex: none; width: 18px; height: 18px; }
.bz-dh-submit-btn { width: 100%; padding: 13px; font-size: 1rem; }
.bz-dh-done { text-align: center; }
.bz-dh-done-ic { font-size: 3rem; }
.bz-dh-done h2 { margin: 6px 0; }
/* Helper-check result + report textarea */
.bz-dh textarea { width: 100%; padding: 10px 12px; border: 1px solid var(--be-border-strong, var(--z-border)); border-radius: 9px; font: inherit; font-size: .95rem; background: var(--be-surface, #fff); color: var(--be-text, var(--z-text)); resize: vertical; }
.bz-hc-result { display: flex; flex-direction: column; gap: 3px; margin-top: 12px; padding: 14px 16px; border-radius: 12px; font-size: .9rem; }
.bz-hc-result b { font-size: 1rem; }
.bz-hc-result.flagged { background: rgba(193,42,26,.10); color: #a12a1a; border: 1px solid rgba(193,42,26,.3); }
.bz-hc-result.clear { background: rgba(10,125,58,.10); color: #0a7d3a; border: 1px solid rgba(10,125,58,.3); }
.bz-hc-result.warn { background: rgba(214,147,0,.12); color: #92600a; border: 1px solid rgba(214,147,0,.3); }
.bz-hc-disclaimer { background: rgba(214,147,0,.10); border: 1px solid rgba(214,147,0,.35); border-radius: 14px; padding: 14px 18px; }
.bz-hc-disclaimer b { display: block; margin-bottom: 4px; color: #92600a; }
.bz-hc-disclaimer p { margin: 0; font-size: .84rem; line-height: 1.6; color: var(--be-text-soft, var(--z-text)); }
:root[data-theme="dark"] .bz-hc-disclaimer { background: rgba(243,201,105,.10); }
:root[data-theme="dark"] .bz-hc-disclaimer b { color: #f3c969; }

/* ── Domestic staff landing (mockup redesign) ── */
.dh { --v: #169c5b; --v-bg: #edf9f2; --p: #f59e0b; --p-bg: #fff8e8; --bl: #e53935; --bl-bg: #fff0f0;
  --dh-green: #0e4a3c; --dh-green2: #087a58; --dh-teal: #159f98; --dh-ink: #18352e;
  display: flex; flex-direction: column; margin: 0 0 12px; }
.dh svg { display: block; }
/* White hero stage — airy, illustration bleeds to the right edge */
.dh-stage { position: relative; z-index: 2; background: linear-gradient(150deg, #eef9f3 0%, #ffffff 52%);
  border: 1px solid #e6f0ea; border-radius: 26px; padding: 38px 40px 34px; overflow: hidden;
  box-shadow: 0 14px 40px rgba(5,74,55,.08); }
.dh-hero { display: grid; grid-template-columns: 1.15fr .95fr; gap: 24px; align-items: center; }
.dh-h1 { margin: 0; font-size: clamp(2.1rem, 4.4vw, 3.4rem); font-weight: 800; line-height: 1.04; letter-spacing: -.025em; color: var(--dh-green); }
.dh-tl { color: var(--dh-teal); }
.dh-sub { margin: 16px 0 0; font-size: 1.14rem; color: #46564f; max-width: 32ch; line-height: 1.5; }
.dh-usp { list-style: none; display: flex; flex-wrap: wrap; gap: 8px 20px; margin: 18px 0 0; padding: 0; font-weight: 600; font-size: .95rem; color: #3f5a50; }
.dh-usp li { position: relative; padding-left: 16px; }
.dh-usp li::before { content: ""; position: absolute; left: 0; top: 50%; width: 7px; height: 7px; margin-top: -3px; border-radius: 50%; background: var(--dh-teal); }
html[dir="rtl"] .dh-usp li { padding-left: 0; padding-right: 16px; }
html[dir="rtl"] .dh-usp li::before { left: auto; right: 0; }
.dh-cta { display: flex; flex-wrap: wrap; gap: 14px; margin-top: 26px; }
.dh-btn { display: inline-flex; align-items: center; gap: 9px; text-decoration: none; font-weight: 700; font-size: 1.02rem;
  padding: 14px 26px; border-radius: 14px; border: 2px solid transparent; transition: transform .14s ease, box-shadow .14s ease; }
.dh-btn:hover { transform: translateY(-1px); }
.dh-bic { display: inline-flex; }
.dh-bic svg { width: 20px; height: 20px; }
.dh-btn-primary { background: var(--dh-green2); color: #fff; box-shadow: 0 10px 22px rgba(8,122,88,.30); }
.dh-btn-primary:hover { box-shadow: 0 12px 28px rgba(8,122,88,.40); }
.dh-btn-ghost { background: #fff; color: var(--dh-green2); border-color: #d3e6dd; }
.dh-btn-ghost:hover { border-color: var(--dh-green2); }
.dh-hero-art { align-self: stretch; min-width: 0; margin: -38px -40px 0 0; }
.dh-hero-art img { width: 100%; height: 100%; min-height: 300px; object-fit: cover; object-position: center top; border-radius: 0 0 0 44px; display: block; }
html[dir="rtl"] .dh-hero-art { margin: -38px 0 0 -40px; }
html[dir="rtl"] .dh-hero-art img { border-radius: 0 0 44px 0; }
/* Trust strip — sits at the foot of the white hero */
.dh-trust { position: relative; z-index: 3; display: flex; flex-wrap: wrap; align-items: center; gap: 16px 10px;
  background: #fff; border: 1px solid #e9f1ec; border-radius: 16px; padding: 16px 22px; margin: 26px 0 0;
  box-shadow: 0 12px 30px rgba(5,74,55,.10); }
.dh-trust-item { display: flex; align-items: center; gap: 12px; flex: 1 1 168px; }
.dh-trust-item.dh-trust-wide { flex: 1.7 1 260px; }
.dh-trust-ic { flex: none; width: 44px; height: 44px; border-radius: 13px; display: grid; place-items: center; }
.dh-trust-ic svg { width: 23px; height: 23px; }
.dh-trust-ic.tone-g { background: var(--v-bg); color: var(--v); }
.dh-trust-ic.tone-b { background: #e8f0fe; color: #2563eb; }
.dh-trust-ic.tone-p { background: #f1ecfe; color: #7c3aed; }
.dh-trust-item b { display: block; font-size: .95rem; color: var(--dh-ink); }
.dh-trust-item small { color: #6c7b76; font-size: .82rem; line-height: 1.35; }
/* Teal zone: profiles panel (the only teal area, like the design) */
.dh-panel { background: linear-gradient(180deg, #0f5a47 0%, #0b3f32 100%); border-radius: 26px; padding: 34px 26px 30px; margin-top: 16px; }
.dh-phead { display: flex; align-items: center; gap: 16px; }
.dh-phead::before, .dh-phead::after { content: ""; flex: 1; height: 1px; background: rgba(255,255,255,.22); }
.dh-phead span { font-size: 1.5rem; font-weight: 800; color: #eaf6f0; white-space: nowrap; }
.dh-sample-note { text-align: center; margin: 8px 0 20px; font-size: .82rem; color: rgba(234,246,240,.7); }
.dh-cards { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; }
.dh-card { position: relative; border-radius: 18px; padding: 18px; display: flex; flex-direction: column; gap: 14px;
  background: #fff; border: 1px solid #e5efe9; box-shadow: 0 12px 26px rgba(0,0,0,.16); }
.dh-card.is-verified { background: #f4fbf7; } .dh-card.is-nonverified { background: #fffaf0; } .dh-card.is-blacklisted { background: #fff5f5; }
.dh-card-badge { align-self: flex-start; display: inline-flex; align-items: center; gap: 6px; font-size: .72rem; font-weight: 800; letter-spacing: .04em; text-transform: uppercase; padding: 5px 12px 5px 8px; border-radius: 999px; color: #fff; }
.dh-badge-ic { display: inline-flex; } .dh-badge-ic svg { width: 15px; height: 15px; color: #fff; }
.is-verified .dh-card-badge { background: var(--v); } .is-nonverified .dh-card-badge { background: var(--p); } .is-blacklisted .dh-card-badge { background: var(--bl); }
.dh-card-top { display: flex; gap: 14px; align-items: center; }
.dh-card-photo { flex: none; width: 92px; height: 104px; object-fit: cover; border-radius: 14px; background: #eef1f0; }
.dh-card-id h3 { margin: 0; font-size: 1.18rem; color: var(--dh-ink); }
.dh-card-role { color: #3f5a50; font-weight: 700; font-size: .92rem; margin-top: 1px; }
.dh-card-loc { display: flex; align-items: center; gap: 5px; color: #6c7b76; font-size: .82rem; margin-top: 5px; }
.dh-pin svg { width: 15px; height: 15px; color: #6c7b76; }
.dh-card-status { display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; }
.dh-st { display: flex; flex-direction: column; align-items: center; gap: 2px; padding: 9px 4px; border-radius: 11px; text-align: center; background: #fff; border: 1px solid #eef2f0; }
.dh-st-ic svg { width: 19px; height: 19px; }
.dh-st b { font-size: .74rem; color: var(--dh-ink); } .dh-st small { font-weight: 700; font-size: .68rem; }
.dh-st-ok { background: var(--v-bg); border-color: #d6efe2; } .dh-st-ok .dh-st-ic, .dh-st-ok small { color: var(--v); }
.dh-st-pend { background: var(--p-bg); border-color: #f6e6c2; } .dh-st-pend .dh-st-ic, .dh-st-pend small { color: var(--p); }
.dh-st-no { background: var(--bl-bg); border-color: #f6d5d5; } .dh-st-no .dh-st-ic, .dh-st-no small { color: var(--bl); }
.dh-card-note { display: flex; align-items: center; gap: 8px; margin-top: auto; font-weight: 700; font-size: .87rem; padding: 11px 13px; border-radius: 11px; }
.dh-note-ic { display: inline-flex; } .dh-note-ic svg { width: 18px; height: 18px; }
.is-verified .dh-card-note { background: var(--v-bg); color: var(--v); } .is-nonverified .dh-card-note { background: var(--p-bg); color: #b5730a; } .is-blacklisted .dh-card-note { background: var(--bl-bg); color: var(--bl); }
/* Join row (on teal) */
.dh-join { display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: 14px; margin-top: 24px; }
.dh-btn-onteal { background: transparent; color: #eaf6f0; border-color: rgba(255,255,255,.5); }
.dh-btn-onteal:hover { border-color: #fff; background: rgba(255,255,255,.08); }
.dh-join-link { width: 100%; text-align: center; font-weight: 600; color: #9fe6cf; text-decoration: none; }
.dh-join-link:hover { text-decoration: underline; }
/* Footer bar */
.dh-footbar { display: flex; flex-wrap: wrap; justify-content: center; align-items: center; gap: 10px 28px; padding: 16px; margin-top: 12px;
  border-radius: 16px; background: #0a3a2d; color: #eaf6f0; font-weight: 600; font-size: .9rem; }
.dh-footbar span { display: inline-flex; align-items: center; gap: 8px; }
.dh-fic { display: inline-flex; } .dh-fic svg { width: 17px; height: 17px; color: #9fe6cf; }
@media (max-width: 860px) {
  .dh-stage { padding: 24px 20px 26px; }
  .dh-hero { grid-template-columns: 1fr; gap: 18px; }
  .dh-hero-art { order: -1; margin: -24px -20px 0; }
  .dh-hero-art img { min-height: 200px; border-radius: 16px 16px 0 0; }
  html[dir="rtl"] .dh-hero-art { margin: -24px -20px 0; }
  .dh-cards { grid-template-columns: 1fr; }
  .dh-phead span { font-size: 1.25rem; white-space: normal; }
}
/* Domestic-staff landing — dark mode: darken the white hero stage + trust pill
   (the teal panel and sample cards already read fine on dark). */
:root[data-theme="dark"] .dh-stage { background: linear-gradient(150deg, #10352b 0%, #0f2a23 55%); border-color: rgba(255,255,255,.08); }
:root[data-theme="dark"] .dh-h1 { color: #eaf6f0; }
:root[data-theme="dark"] .dh-sub { color: #c4d6ce; }
:root[data-theme="dark"] .dh-usp { color: #8fe3bf; }
:root[data-theme="dark"] .dh-btn-ghost { background: transparent; color: #bfeeda; border-color: rgba(255,255,255,.28); }
:root[data-theme="dark"] .dh-trust { background: #13332a; border-color: rgba(255,255,255,.08); }
:root[data-theme="dark"] .dh-trust-item b { color: #eaf6f0; }
:root[data-theme="dark"] .dh-trust-item small { color: #9fb3aa; }

:root[data-theme="dark"] .bz-hc-result.flagged { color: #f0a094; }
:root[data-theme="dark"] .bz-hc-result.clear { color: #6ee7a8; }
:root[data-theme="dark"] .bz-hc-result.warn { color: #f3c969; }
@media (max-width: 560px) {
  .bz-dh-modes, .bz-dh-grid { grid-template-columns: 1fr; }
  .bz-dh-file-state { max-width: 38%; }
}

/* Owner dashboard (My Businesses) */
.bz-biz-dash { margin-top: 30px; padding-top: 20px; border-top: 1px solid var(--be-border, var(--z-border)); }
.bz-dash-h { font-size: 1.15rem; margin: 0 0 14px; }
.bz-dash-biz { background: var(--z-card); border: 1px solid var(--be-border, var(--z-border)); border-radius: 13px; padding: 16px; margin-bottom: 14px; }
.bz-dash-bizhead { display: flex; justify-content: space-between; align-items: center; gap: 12px; margin-bottom: 12px; flex-wrap: wrap; }
.bz-dash-bizhead a { text-decoration: none; color: inherit; }
.bz-dash-cols { display: grid; grid-template-columns: 1fr; gap: 18px; }
@media (min-width: 720px) { .bz-dash-cols { grid-template-columns: 1fr 1fr; } }
.bz-dash-col h4 { margin: 0 0 8px; font-size: .82rem; text-transform: uppercase; letter-spacing: .05em; color: var(--be-text-muted, var(--z-muted)); }
.bz-dash-req { font-size: .86rem; padding: 8px 0; border-bottom: 1px solid var(--be-border, var(--z-border)); }
.bz-dash-req a { color: var(--z-green); }
.bz-dash-reqmsg { color: var(--be-text-soft, var(--z-muted)); margin: 2px 0; }
.bz-dash-when { display: block; font-size: .74rem; color: var(--be-text-muted, var(--z-muted)); }
.bz-dash-rev { font-size: .86rem; padding: 8px 0; border-bottom: 1px solid var(--be-border, var(--z-border)); }
.bz-dash-replybox { display: flex; gap: 6px; margin-top: 5px; }
.bz-dash-replybox input { flex: 1; padding: 6px 10px; border: 1px solid var(--be-border-strong, var(--z-border)); border-radius: 8px; font-size: .84rem; background: var(--be-surface, #fff); color: var(--be-text, var(--z-text)); }

/* ── Detail ── */
.bz-detail { padding: 18px 16px 60px; }
.bz-breadcrumb { display: flex; gap: 8px; align-items: center; font-size: 0.85rem; margin-bottom: 14px; color: var(--be-text-muted, var(--z-muted)); }
.bz-breadcrumb a { color: var(--z-green); text-decoration: none; }
.bz-detail-grid { display: grid; grid-template-columns: 1fr; gap: 24px; }
@media (min-width: 900px) { .bz-detail-grid { grid-template-columns: 1.6fr 1fr; align-items: start; } }

.bz-gallery-main {
  aspect-ratio: 4 / 3;
  background: var(--be-surface-2, #eef1f0);
  border-radius: 14px;
  overflow: hidden;
  border: 1px solid var(--be-border, var(--z-border));
}
.bz-gallery-main img { width: 100%; height: 100%; object-fit: contain; display: block; }
.bz-gallery-empty { display: flex; align-items: center; justify-content: center; color: var(--be-text-muted, var(--z-muted)); }
.bz-gallery-thumbs { display: flex; gap: 8px; margin-top: 10px; flex-wrap: wrap; }
.bz-thumb {
  width: 66px; height: 66px;
  border-radius: 8px; overflow: hidden;
  border: 2px solid transparent;
  padding: 0; cursor: pointer; background: none;
}
.bz-thumb.is-active { border-color: var(--z-green); }
.bz-thumb img { width: 100%; height: 100%; object-fit: cover; }

.bz-detail-desc { margin-top: 24px; }
.bz-detail-desc h2 { font-size: 1.15rem; margin: 0 0 10px; }
.bz-desc-body { color: var(--be-text-soft, var(--z-text)); line-height: 1.7; }

.bz-detail-card {
  background: var(--z-card);
  border: 1px solid var(--be-border, var(--z-border));
  border-radius: 14px;
  padding: 18px;
  position: sticky;
  top: 16px;
}
.bz-detail-price { font-size: 1.7rem; font-weight: 800; color: var(--z-green); font-family: var(--be-font-display, inherit); }
html[data-theme="dark"] .bz-detail-price { color: var(--z-green-dark, #34D399); }
.bz-detail-title { font-size: 1.15rem; margin: 4px 0 14px; }
.bz-detail-facts { list-style: none; padding: 0; margin: 0 0 16px; display: flex; flex-direction: column; gap: 9px; }
.bz-detail-facts li { display: flex; justify-content: space-between; gap: 12px; font-size: 0.9rem; }
.bz-detail-facts span { color: var(--be-text-muted, var(--z-muted)); }
.bz-detail-facts strong { text-align: end; font-weight: 600; }

.bz-contact { display: flex; flex-direction: column; gap: 8px; }
.bz-contact-call { text-align: center; }
.bz-contact-wa {
  display: block; text-align: center;
  padding: 11px 16px; border-radius: 10px;
  border: 1px solid #25D366; color: #128C4B;
  font-weight: 700; text-decoration: none;
}
.bz-contact-wa:hover { background: rgba(37, 211, 102, 0.1); }
html[data-theme="dark"] .bz-contact-wa { color: #34d399; border-color: #34d399; }
.bz-contact-none, .bz-chat-soon { font-size: 0.82rem; color: var(--be-text-muted, var(--z-muted)); margin: 10px 0 0; text-align: center; }
.bz-contact-msg { display: block; text-align: center; padding: 11px 16px; border-radius: 10px;
  border: 1px solid var(--be-border-strong, var(--z-border)); color: var(--be-text, var(--z-text));
  font-weight: 700; text-decoration: none; background: var(--be-surface-2, transparent); }
.bz-contact-msg:hover { border-color: var(--z-green); color: var(--z-green); }
.bz-contact-msg-solo { background: var(--z-green); color: #fff; border-color: var(--z-green); }
:root[data-theme="dark"] .bz-contact-msg-solo { color: #06281e; }

/* ── Chat (messages page) ── */
.bz-msg-wrap { padding: 20px 16px 40px; }
.bz-chat { display: grid; grid-template-columns: 320px 1fr; gap: 18px; min-height: 62vh;
  background: var(--z-card); border: 1px solid var(--be-border, var(--z-border)); border-radius: 16px; overflow: hidden; }
/* display:grid beats the UA [hidden] rule, so the empty shell flashes over the
   "Loading…" card before JS runs unless we guard it explicitly (CLAUDE.md §9). */
.bz-chat[hidden] { display: none; }
.bz-inbox { border-right: 1px solid var(--be-border, var(--z-border)); display: flex; flex-direction: column; min-height: 0; }
.bz-inbox-head { padding: 16px 18px; border-bottom: 1px solid var(--be-border, var(--z-border)); }
.bz-inbox-head h2 { margin: 0; font-size: 1.05rem; }
.bz-inbox-list { overflow-y: auto; flex: 1; }
.bz-inbox-empty { padding: 24px 18px; color: var(--be-text-muted, var(--z-muted)); }
.bz-conv { display: flex; gap: 11px; align-items: center; width: 100%; text-align: left; background: none;
  border: 0; border-bottom: 1px solid var(--be-border, var(--z-border)); padding: 12px 16px; cursor: pointer; color: inherit; }
.bz-conv:hover { background: var(--be-surface-2, #f4f7f5); }
.bz-conv.is-active { background: var(--emerald-soft, var(--z-green-light)); }
.bz-conv-thumb { width: 44px; height: 44px; border-radius: 9px; overflow: hidden; flex: 0 0 auto; display: grid;
  place-items: center; background: var(--be-surface-2, #eef1f0); font-size: 1.3rem; }
.bz-conv-thumb img { width: 100%; height: 100%; object-fit: cover; }
.bz-conv-main { flex: 1; min-width: 0; }
.bz-conv-title { font-weight: 600; font-size: .9rem; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.bz-conv-last { font-size: .8rem; color: var(--be-text-muted, var(--z-muted)); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.bz-conv-who { font-size: .72rem; color: var(--be-text-muted, var(--z-muted)); flex: 0 0 auto; }

.bz-thread { display: flex; flex-direction: column; min-height: 0; }
.bz-thread-empty { flex: 1; display: flex; flex-direction: column; align-items: center; justify-content: center;
  color: var(--be-text-muted, var(--z-muted)); gap: 6px; }
.bz-thread-head { display: flex; align-items: center; gap: 12px; padding: 14px 18px; border-bottom: 1px solid var(--be-border, var(--z-border)); }
.bz-thread-back { display: none; font-size: 1.5rem; text-decoration: none; color: var(--z-green); line-height: 1; }
.bz-thread-listing { flex: 1; min-width: 0; }
.bz-thread-title { font-weight: 700; font-size: .95rem; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.bz-thread-who { font-size: .78rem; color: var(--be-text-muted, var(--z-muted)); }
.bz-msgs { flex: 1; overflow-y: auto; padding: 18px; display: flex; flex-direction: column; gap: 8px; min-height: 240px; }
.bz-bubble { max-width: 74%; padding: 8px 12px; border-radius: 14px; font-size: .9rem; line-height: 1.4;
  display: flex; flex-direction: column; gap: 2px; }
.bz-bubble-text { white-space: pre-wrap; word-break: break-word; }
.bz-bubble-time { font-size: .66rem; opacity: .7; align-self: flex-end; }
.bz-bubble.mine { align-self: flex-end; background: var(--z-green); color: #fff; border-bottom-right-radius: 4px; }
:root[data-theme="dark"] .bz-bubble.mine { color: #06281e; }
.bz-bubble.theirs { align-self: flex-start; background: var(--be-surface-2, #eef1f0); color: var(--be-text, var(--z-text)); border-bottom-left-radius: 4px; }
.bz-composer { display: flex; gap: 8px; padding: 12px 14px; border-top: 1px solid var(--be-border, var(--z-border)); }
.bz-composer input { flex: 1; padding: 10px 14px; border: 1px solid var(--be-border-strong, var(--z-border)); border-radius: 999px;
  font-size: .95rem; font-family: inherit; background: var(--be-surface, #fff); color: var(--be-text, var(--z-text)); }
.bz-chat-note { font-size: .74rem; color: var(--be-text-muted, var(--z-muted)); text-align: center; margin: 0 0 12px; }

@media (max-width: 760px) {
  .bz-chat { grid-template-columns: 1fr; }
  .bz-inbox { border-right: 0; }
  .bz-chat.show-thread .bz-inbox { display: none; }
  .bz-chat:not(.show-thread) .bz-thread { display: none; }
  .bz-thread-back { display: block; }
}

/* ── Moderation ── */
.bz-admin { padding: 24px 16px 70px; max-width: 900px; }
.bz-admin-tabs { display: flex; gap: 8px; margin: 16px 0 20px; flex-wrap: wrap; }
.bz-tab { background: var(--z-card); border: 1px solid var(--be-border, var(--z-border)); border-radius: 999px;
  padding: 8px 16px; font-weight: 600; font-size: .88rem; color: var(--be-text, var(--z-text)); cursor: pointer; }
.bz-tab.is-on { background: var(--z-green); border-color: var(--z-green); color: #fff; }
:root[data-theme="dark"] .bz-tab.is-on { color: #06281e; }
.bz-tab span { font-variant-numeric: tabular-nums; opacity: .8; }
.bz-admin-list { display: flex; flex-direction: column; gap: 14px; }
.bz-adm-card { display: flex; gap: 14px; background: var(--z-card); border: 1px solid var(--be-border, var(--z-border));
  border-radius: 13px; padding: 14px; }
.bz-adm-media { width: 120px; height: 120px; border-radius: 10px; overflow: hidden; flex: 0 0 auto;
  background: var(--be-surface-2, #eef1f0); display: grid; place-items: center; }
.bz-adm-media img { width: 100%; height: 100%; object-fit: cover; }
.bz-adm-noimg { font-size: 2rem; opacity: .6; }
.bz-adm-body { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 4px; }
.bz-adm-price { font-weight: 800; color: var(--z-green); font-variant-numeric: tabular-nums; }
:root[data-theme="dark"] .bz-adm-price { color: var(--z-green-dark, #34D399); }
.bz-adm-title { font-weight: 600; }
.bz-adm-meta { font-size: .82rem; color: var(--be-text-muted, var(--z-muted)); }
.bz-adm-desc { font-size: .84rem; color: var(--be-text-soft, var(--z-muted)); max-height: 3.6em; overflow: hidden; }
.bz-adm-seller { font-size: .78rem; color: var(--be-text-muted, var(--z-muted)); margin-top: 2px; }
.bz-adm-reason { font-size: .82rem; color: #c0392b; }
.bz-adm-actions { display: flex; gap: 10px; align-items: center; margin-top: 8px; flex-wrap: wrap; }
.bz-adm-actions .btn-primary { padding: 8px 18px; }
/* Destructive admin action (delete / cancel) — red-tinted ghost button. */
.bz-btn-ghost.bz-danger { color: #b42318; border-color: rgba(180,35,24,.35); }
.bz-btn-ghost.bz-danger:hover { background: rgba(180,35,24,.08); border-color: rgba(180,35,24,.6); }
/* Featured ribbon on an admin card's media. */
.bz-adm-media { position: relative; }
.bz-adm-badge { position: absolute; top: 8px; left: 8px; background: #f59e0b; color: #3a2a00; font-weight: 800; font-size: .72rem; padding: 3px 9px; border-radius: 999px; box-shadow: 0 2px 8px rgba(0,0,0,.2); }
/* Bulk multi-select on moderation queues. */
.bz-adm-card { position: relative; }
.bz-bulk-cb { position: absolute; top: 10px; left: 10px; z-index: 2; background: rgba(255,255,255,.92); border: 1px solid var(--z-border); border-radius: 7px; padding: 3px 5px; display: inline-flex; cursor: pointer; box-shadow: 0 1px 4px rgba(0,0,0,.12); }
:root[data-theme=dark] .bz-bulk-cb { background: rgba(18,27,23,.92); }
.bz-bulk-cb input { width: 17px; height: 17px; margin: 0; cursor: pointer; accent-color: var(--z-green); }
.bz-bulkbar { position: sticky; top: 0; z-index: 6; display: flex; align-items: center; gap: 10px; flex-wrap: wrap; background: var(--z-green); color: #fff; border-radius: 12px; padding: 10px 14px; margin-bottom: 14px; box-shadow: 0 6px 18px rgba(5,74,55,.25); }
.bz-bulkbar-n { font-weight: 800; }
.bz-bulkbar-sp { flex: 1; }
.bz-bulkbar .bz-btn-ghost { color: #fff; border-color: rgba(255,255,255,.4); background: rgba(255,255,255,.08); }
.bz-bulkbar .bz-btn-ghost:hover { background: rgba(255,255,255,.2); }
.bz-bulkbar .bz-btn-ghost.bz-danger { color: #ffe0dd; border-color: rgba(255,180,170,.5); }
.bz-bulkbar .btn-primary { background: #fff; color: var(--z-green-dark); }
/* Move up/down ordering controls. */
.bz-btn-ghost.bz-ord { padding: 6px 10px; font-weight: 700; line-height: 1; }
/* Drag-to-reorder. */
.bz-drag-hint { color: var(--z-muted); font-size: .85rem; margin: 0 0 10px; }
.bz-drag-zone [draggable="true"] { cursor: grab; }
.bz-drag-zone [draggable="true"]:active { cursor: grabbing; }
.bz-adm-card.bz-dragging { opacity: .45; outline: 2px dashed var(--z-green); }
.bz-drag-handle { position: absolute; top: 50%; left: 4px; transform: translateY(-50%); color: var(--z-muted); font-size: 1.2rem; line-height: 1; cursor: grab; user-select: none; padding: 0 4px; z-index: 2; }
.bz-drag-zone .bz-adm-card { padding-left: 22px; }
/* Logo thumbnail on food admin cards (was missing — cards were text-only). */
.bz-adm-media--logo { background: var(--z-green-light); }
.bz-adm-media--logo img { width: 100%; height: 100%; object-fit: cover; }
.bz-adm-media--logo .bz-adm-noimg { display: flex; align-items: center; justify-content: center; height: 100%; font-size: 2rem; }
@media (max-width: 560px) { .bz-adm-card { flex-direction: column; } .bz-adm-media { width: 100%; height: 160px; } }

/* Submission audit trail (IP · geo · device) — collapsed by default. */
.bz-audit { margin-top: 8px; border: 1px solid var(--be-border, var(--z-border)); border-radius: 8px; background: var(--be-surface-2, #f6f8f7); font-size: .78rem; }
.bz-audit > summary { cursor: pointer; list-style: none; padding: 6px 10px; color: var(--be-text-muted, var(--z-muted)); font-weight: 600; user-select: none; }
.bz-audit > summary::-webkit-details-marker { display: none; }
.bz-audit > summary::before { content: "▸ "; }
.bz-audit[open] > summary::before { content: "▾ "; }
.bz-audit[open] > summary { border-bottom: 1px solid var(--be-border, var(--z-border)); }
.bz-audit-body { padding: 4px 10px 8px; }
.bz-audit-row { display: flex; gap: 10px; justify-content: space-between; padding: 3px 0; border-bottom: 1px dashed var(--be-border, #e3e8e6); }
.bz-audit-row:last-child { border-bottom: 0; }
.bz-audit-row > span { color: var(--be-text-muted, var(--z-muted)); flex: 0 0 auto; }
.bz-audit-row > b { text-align: right; word-break: break-word; font-weight: 600; }
:root[data-theme="dark"] .bz-audit { background: rgba(255,255,255,.03); }
.bzc-subtle { font-size: .72rem; color: var(--be-text-muted, var(--z-muted)); margin-top: 2px; }

.bz-safety {
  margin-top: 16px;
  background: linear-gradient(180deg, var(--be-surface, #fff), var(--be-surface-2, #f4f7f5));
  border: 1px solid var(--be-border, var(--z-border));
  border-radius: 14px;
  padding: 16px 18px;
}
.bz-safety h3 { margin: 0 0 12px; font-size: .92rem; font-weight: 700; display: flex; align-items: center; gap: 8px; }
.bz-safety-ic { font-size: 1.02rem; line-height: 1; }
.bz-safety ul { margin: 0; padding: 0; list-style: none; display: flex; flex-direction: column; gap: 9px; }
.bz-safety li { position: relative; padding-inline-start: 27px; font-size: .855rem; line-height: 1.45; color: var(--be-text-soft, var(--z-text)); }
.bz-safety li::before {
  content: "✓"; position: absolute; inset-inline-start: 0; top: 1px;
  width: 18px; height: 18px; border-radius: 50%;
  background: rgba(21,115,71,.13); color: #157347;
  font-size: .7rem; font-weight: 800;
  display: flex; align-items: center; justify-content: center;
}
html[data-theme="dark"] .bz-safety li::before { background: rgba(52,211,153,.18); color: #34d399; }
.bz-report {
  display: inline-flex; align-items: center; gap: 7px;
  margin-top: 14px; padding-top: 13px; width: 100%;
  border-top: 1px solid var(--be-border, var(--z-border));
  background: none; border-left: 0; border-right: 0; border-bottom: 0;
  padding-left: 0; padding-right: 0;
  color: var(--be-text-muted, var(--z-muted)); font-size: .82rem; font-weight: 600;
  font-family: inherit; text-decoration: none; cursor: pointer; transition: color .12s;
}
.bz-report:hover { color: #d9534f; }

/* nav dark-toggle + chat button spacing reuse from portal-unify; keep the
   Bazaar "Post ad" pill readable in both themes */
.header-nav .nav-chat { background: none; border: 0; cursor: pointer; font: inherit; }

/* ── Promote (S4) ── */
.bz-promote-target { display: flex; align-items: center; gap: 10px; font-size: 1.05rem; margin: 10px 0; }
.bz-promote-target span { font-size: 1.5rem; }
.bz-promote-price { font-size: 1.5rem; font-weight: 800; color: var(--z-green); font-variant-numeric: tabular-nums; }
:root[data-theme="dark"] .bz-promote-price { color: var(--z-green-dark, #34D399); }
.bz-promote-price span { font-size: .82rem; font-weight: 600; color: var(--be-text-muted, var(--z-muted)); }
.bz-pay-details { list-style: none; padding: 0; margin: 10px 0; display: flex; flex-direction: column; gap: 10px; }
.bz-pay-details li { display: flex; justify-content: space-between; gap: 14px; font-size: .95rem; border-bottom: 1px solid var(--be-border, var(--z-border)); padding-bottom: 8px; }
.bz-pay-details span { color: var(--be-text-muted, var(--z-muted)); }
.bz-pay-details strong { font-variant-numeric: tabular-nums; user-select: all; }
.bz-promoted-sm { color: #d69300; }
.bz-promoted-badge { font-size: .72rem; font-weight: 800; color: #7a5b00; background: #ffe9a8; padding: 2px 8px; border-radius: 6px; vertical-align: middle; margin-right: 6px; }
:root[data-theme="dark"] .bz-promoted-badge { color: #ffe9a8; background: rgba(214,147,0,.22); }
.bz-dash-bizactions { display: flex; gap: 12px; align-items: center; }
.bz-link.feature { color: #b8891a; font-weight: 700; }
:root[data-theme="dark"] .bz-link.feature { color: #e0b544; }

/* ── Post an ad (dedicated page) ── */
.bz-post-page { max-width: 640px; padding: 22px 16px 70px; }
.bz-post-page > h1 { margin: 6px 0 16px; }
.bz-back { display: inline-block; color: var(--z-green); text-decoration: none; font-weight: 600; font-size: .9rem; }
.bz-post-card { background: var(--z-card); border: 1px solid var(--be-border, var(--z-border)); border-radius: 16px;
  padding: 22px; display: flex; flex-direction: column; gap: 14px; }
.bz-post-card .bz-auth-icon { font-size: 2.4rem; }
.bz-post-card h2 { margin: 0; }
#bzp-recaptcha { margin: 4px 0; }
.bz-post-foot { display: flex; justify-content: flex-end; gap: 10px; margin-top: 4px; }
.bz-post-foot .bz-btn-ghost { display: inline-flex; align-items: center; }

/* ── Account ── */
.bz-acct { padding: 26px 16px 70px; max-width: 860px; }
.bz-muted { color: var(--be-text-muted, var(--z-muted)); }
.bz-auth-card { text-align: center; background: var(--z-card); border: 1px solid var(--be-border, var(--z-border));
  border-radius: 16px; padding: 40px 24px; max-width: 460px; margin: 30px auto; }
.bz-auth-icon { font-size: 2.6rem; margin-bottom: 6px; }
.bz-auth-card h1 { margin: 0 0 8px; font-size: 1.4rem; }
.bz-auth-card p { color: var(--be-text-soft, var(--z-muted)); margin: 0 0 18px; }
.bz-auth-fine { font-size: .8rem; margin: 14px 0 0 !important; }
.bz-google { width: 100%; max-width: 300px; }
.bz-acct-head { display: flex; justify-content: space-between; align-items: flex-start; gap: 16px; flex-wrap: wrap; }
.bz-acct-head h1 { margin: 0 0 2px; }
.bz-acct-actions { display: flex; gap: 10px; align-items: center; }
.bz-btn-ghost { background: none; border: 1px solid var(--be-border-strong, var(--z-border)); color: var(--be-text, var(--z-text));
  border-radius: 10px; padding: 9px 14px; font-weight: 600; cursor: pointer; }
.bz-btn-ghost:hover { border-color: var(--z-green); }
.bz-quota { margin: 14px 0 4px; font-size: .88rem; color: var(--be-text-muted, var(--z-muted)); }
.bz-admin-pill { border-color: #2563a8; color: #2563a8; text-decoration: none; }
.bz-admin-pill:hover { border-color: #2563a8; background: rgba(37, 99, 168, .08); }
:root[data-theme="dark"] .bz-admin-pill { color: #6ea8e8; border-color: #3a5f88; }

.bz-ads { display: flex; flex-direction: column; gap: 12px; margin-top: 18px; }
.bz-adrow { display: flex; gap: 14px; align-items: center; background: var(--z-card);
  border: 1px solid var(--be-border, var(--z-border)); border-radius: 12px; padding: 12px; }
.bz-adthumb { width: 72px; height: 72px; border-radius: 9px; overflow: hidden; flex: 0 0 auto;
  background: var(--be-surface-2, #eef1f0); display: grid; place-items: center; font-size: 1.6rem; }
.bz-adthumb img { width: 100%; height: 100%; object-fit: cover; }
.bz-adinfo { flex: 1; min-width: 0; }
.bz-adtitle { font-weight: 600; font-size: .95rem; display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.bz-admeta { font-size: .82rem; color: var(--be-text-muted, var(--z-muted)); margin-top: 3px; }
.bz-adnote { font-size: .8rem; color: #c0392b; margin-top: 3px; }
.bz-adactions { display: flex; flex-direction: column; gap: 6px; align-items: flex-end; }
.bz-pill { font-size: .68rem; font-weight: 800; text-transform: uppercase; letter-spacing: .03em; padding: 2px 8px; border-radius: 6px; }
.bz-pill.live { background: var(--z-green); color: #fff; }
.bz-pill.pending { background: #f0ad4e; color: #3a2600; }
.bz-pill.sold { background: #6b7280; color: #fff; }
.bz-pill.rejected { background: #d9534f; color: #fff; }
.bz-pill.expired { background: var(--be-surface-2, #e6e6e6); color: var(--be-text-muted, var(--z-muted)); }
.bz-link { background: none; border: 0; color: var(--z-green); font-weight: 600; font-size: .84rem; cursor: pointer; text-decoration: none; padding: 0; }
.bz-link:hover { text-decoration: underline; }
.bz-link.danger { color: #c0392b; }

/* ── Modals ── */
.bz-modal { position: fixed; inset: 0; z-index: 100; background: rgba(8, 20, 15, .55);
  display: flex; align-items: flex-start; justify-content: center; padding: 24px 14px; overflow-y: auto; }
.bz-modal[hidden] { display: none; }
.bz-modal-card { background: var(--z-card); border: 1px solid var(--be-border, var(--z-border)); border-radius: 16px;
  width: 100%; max-width: 560px; box-shadow: var(--be-shadow-hover, 0 20px 50px rgba(0,0,0,.3)); }
.bz-modal-sm { max-width: 420px; }
.bz-modal-head { display: flex; justify-content: space-between; align-items: center; padding: 16px 18px; border-bottom: 1px solid var(--be-border, var(--z-border)); }
.bz-modal-head h2 { margin: 0; font-size: 1.1rem; }
.bz-modal-x { background: none; border: 0; font-size: 1.1rem; color: var(--be-text-muted, var(--z-muted)); cursor: pointer; }
.bz-modal-body { padding: 18px; display: flex; flex-direction: column; gap: 14px; }
.bz-modal-foot { display: flex; justify-content: flex-end; gap: 10px; padding: 14px 18px; border-top: 1px solid var(--be-border, var(--z-border)); }

.bz-field { display: flex; flex-direction: column; gap: 6px; }
.bz-field > span { font-size: .8rem; font-weight: 600; color: var(--be-text-soft, var(--z-text)); }
.bz-field > span small { color: var(--be-text-muted, var(--z-muted)); font-weight: 400; }
.bz-field input, .bz-field select, .bz-field textarea { padding: 10px 12px; border: 1px solid var(--be-border-strong, var(--z-border));
  border-radius: 9px; font-size: .95rem; font-family: inherit; background: var(--be-surface, #fff); color: var(--be-text, var(--z-text)); }
.bz-field textarea { resize: vertical; }
.bz-field-row { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.bz-price-row { display: flex; gap: 10px; flex-wrap: wrap; align-items: center; }
/* Rate/price type as pills — wrap gracefully at any width (no lonely 3+1 row). */
.bz-ptype { display: flex; flex-wrap: wrap; gap: 8px; }
.bz-ptype button { background: var(--be-surface, #fff); border: 1px solid var(--be-border-strong, var(--z-border)); border-radius: 999px;
  padding: 8px 16px; font-weight: 600; font-size: .86rem; cursor: pointer; color: var(--be-text-soft, var(--z-text));
  transition: border-color .12s, background .12s, color .12s; }
.bz-ptype button:hover { border-color: var(--z-green); }
.bz-ptype button.is-on { background: var(--z-green); color: #fff; border-color: var(--z-green); }
.bz-price-amount { display: flex; flex-direction: column; gap: 4px; }
.bz-price-amount input { max-width: 240px; }
/* Category-specific fields (Mobiles, Computers, Bikes, …) in the post form. */
.bz-specs-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.bz-specs-grid:empty { display: none; }
@media (max-width: 520px) { .bz-specs-grid { grid-template-columns: 1fr; } }
.bz-price-row input { flex: 1; min-width: 120px; padding: 9px 12px; border: 1px solid var(--be-border-strong, var(--z-border));
  border-radius: 9px; font-family: inherit; background: var(--be-surface, #fff); color: var(--be-text, var(--z-text)); }
.bz-hint { color: var(--be-text-muted, var(--z-muted)); font-size: .78rem; }
.bz-previews { display: flex; gap: 8px; flex-wrap: wrap; margin-top: 8px; }
.bz-previews img { width: 70px; height: 70px; object-fit: cover; border-radius: 8px; border: 2px solid transparent; }
.bz-previews img.is-cover { border-color: var(--z-green); }
/* Preview tiles with a remove button + cover tag (drag/drop uploader). */
.bz-prev { position: relative; display: inline-flex; }
.bz-prev.is-cover img { border-color: var(--z-green); }
.bz-prev-rm { position: absolute; top: -6px; right: -6px; width: 20px; height: 20px; border-radius: 50%; border: none; background: rgba(17,24,20,.82); color: #fff; font-size: 15px; line-height: 18px; cursor: pointer; padding: 0; display: flex; align-items: center; justify-content: center; }
.bz-prev-rm:hover { background: #b3261e; }
.bz-prev-cover { position: absolute; left: 4px; bottom: 4px; font-size: .58rem; font-weight: 800; letter-spacing: .03em; color: #fff; background: var(--z-green,#0a7d3f); border-radius: 4px; padding: 1px 5px; }

/* Drag-and-drop photo zone. */
.bz-dropzone { display: block; border: 1.5px dashed var(--be-border, var(--z-border, #c9d3cd)); border-radius: 12px; background: var(--be-surface-2, #f6faf7); cursor: pointer; transition: border-color .15s, background .15s; }
html[data-theme="dark"] .bz-dropzone { background: rgba(255,255,255,.03); }
.bz-dropzone:hover { border-color: var(--z-green,#0a7d3f); }
.bz-dropzone.is-drag { border-color: var(--z-green,#0a7d3f); background: rgba(10,125,63,.07); border-style: solid; }
.bz-dropzone-inner { display: flex; flex-direction: column; align-items: center; text-align: center; gap: 3px; padding: 22px 16px; pointer-events: none; }
.bz-dropzone-ic { color: var(--z-green,#0a7d3f); line-height: 0; }
.bz-dropzone-inner b { font-size: .92rem; }
.bz-dropzone-inner small { font-size: .76rem; color: var(--z-muted); }
.bz-photo-msg { font-size: .78rem; color: #c77700; font-weight: 600; margin: 6px 0 0; }
.bz-check { display: flex; gap: 9px; align-items: flex-start; font-size: .85rem; color: var(--be-text-soft, var(--z-text)); }
.bz-check input { margin-top: 3px; }
.bz-err { color: #c0392b; font-size: .86rem; margin: 0; }
.bz-ok { color: var(--z-green); font-weight: 600; font-size: .9rem; margin: 0; }
#bz-recaptcha, #bzw-recaptcha { margin: 4px 0; }
.bz-ptype button[hidden] { display: none; }
@media (max-width: 520px) { .bz-field-row { grid-template-columns: 1fr; } }

/* ── Post wizard ── */
.bz-wizard { max-width: 860px; }
/* Only the category step uses the full width (two columns). The account/verify
   and details cards, plus the stepper, stay readable-narrow and centred so the
   wider canvas isn't wasted on a lonely form. */
.bz-wizard #bz-steps,
.bz-wizard .bz-post-card:not(.bz-catpick),
.bz-wizard .bz-idchip { max-width: 600px; margin-inline: auto; }
/* Step sections, type blocks, the id-chip and OTP sub-steps are display:flex/grid,
   so the bare [hidden] attribute won't hide them (CLAUDE.md §9). Force it, scoped. */
.bz-wizard [hidden] { display: none !important; }
.bz-steps { list-style: none; display: flex; margin: 10px 0 20px; padding: 0; counter-reset: step; }
.bz-steps li { flex: 1; position: relative; display: flex; flex-direction: column; align-items: center; gap: 6px; }
.bz-steps li::before { content: ""; position: absolute; top: 15px; left: -50%; width: 100%; height: 2px;
  background: var(--be-border-strong, var(--z-border)); z-index: 0; }
.bz-steps li:first-child::before { display: none; }
.bz-steps li.is-done::before, .bz-steps li.is-on::before { background: var(--z-green); }
.bz-steps-num { position: relative; z-index: 1; width: 30px; height: 30px; border-radius: 50%; display: grid; place-items: center;
  background: var(--be-surface, #fff); border: 2px solid var(--be-border-strong, var(--z-border));
  color: var(--be-text-muted, var(--z-muted)); font-weight: 800; font-size: .85rem; transition: all .2s; }
.bz-steps li.is-on .bz-steps-num { border-color: var(--z-green); color: var(--z-green); box-shadow: 0 0 0 4px rgba(16,163,110,.14); }
.bz-steps li.is-done .bz-steps-num { background: var(--z-green); border-color: var(--z-green); color: #fff; font-size: 0; }
.bz-steps li.is-done .bz-steps-num::after { content: "✓"; font-size: .9rem; }
.bz-steps-lbl { font-size: .74rem; font-weight: 600; color: var(--be-text-muted, var(--z-muted)); text-align: center; }
.bz-steps li.is-on .bz-steps-lbl, .bz-steps li.is-done .bz-steps-lbl { color: var(--be-text, var(--z-text)); }

.bz-idchip { display: flex; align-items: center; gap: 8px; margin: 0 0 14px; padding: 8px 12px; border-radius: 10px;
  background: rgba(16,163,110,.10); border: 1px solid rgba(16,163,110,.28); font-size: .84rem; color: var(--be-text, var(--z-text)); }
.bz-idchip-ok { width: 20px; height: 20px; border-radius: 50%; background: var(--z-green); color: #fff; display: grid; place-items: center; font-size: .7rem; font-weight: 800; flex: 0 0 auto; }

.bz-step-card { text-align: center; align-items: center; }
.bz-step-card h1 { margin: 4px 0 0; font-size: 1.35rem; }
.bz-step-card > p.bz-muted { max-width: 460px; margin: 0 auto; }
.bz-step-card .bz-field, .bz-step-card #bzw-phone-step1, .bz-step-card #bzw-phone-step2 { text-align: left; width: 100%; max-width: 340px; }
.bz-step-card #bzw-phone-step1, .bz-step-card #bzw-phone-step2 { display: flex; flex-direction: column; gap: 12px; align-items: center; }
.bz-step-card #bzw-phone-step1 .bz-field, .bz-step-card #bzw-phone-step2 .bz-field { max-width: 340px; }
.bz-step-card .btn-primary { min-width: 220px; }

/* verified confirmation */
.bz-verified-step .bz-verified-burst { width: 68px; height: 68px; border-radius: 50%; display: grid; place-items: center;
  background: var(--z-green); color: #fff; font-size: 2rem; font-weight: 800; margin: 4px auto 2px;
  box-shadow: 0 0 0 8px rgba(16,163,110,.14); animation: bzPop .35s ease-out; }
@keyframes bzPop { 0% { transform: scale(.4); opacity: 0; } 70% { transform: scale(1.08); } 100% { transform: scale(1); opacity: 1; } }
.bz-verified-num { font-size: 1.5rem; font-weight: 800; letter-spacing: .04em; color: var(--z-green);
  background: rgba(16,163,110,.10); border: 1px dashed rgba(16,163,110,.4); border-radius: 12px; padding: 10px 22px; }

/* type chooser */
.bz-typegrid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 14px; width: 100%; margin-top: 6px; }
.bz-typecard { display: flex; flex-direction: column; align-items: center; gap: 6px; text-align: center; cursor: pointer;
  background: var(--z-card); border: 2px solid var(--be-border, var(--z-border)); border-radius: 14px; padding: 22px 14px;
  color: var(--be-text, var(--z-text)); transition: transform .15s, border-color .15s, box-shadow .15s; }
.bz-typecard:hover { transform: translateY(-3px); border-color: var(--tc); box-shadow: 0 12px 26px rgba(0,0,0,.10); }
.bz-typecard-ic { font-size: 2.2rem; }
.bz-typecard b { font-size: 1.02rem; }
.bz-typecard small { color: var(--be-text-muted, var(--z-muted)); font-size: .78rem; line-height: 1.35; }

/* ── Step 2 — category picker ── */
.bz-catpick { text-align: start; align-items: stretch; padding: 20px 22px; gap: 10px; }
.bz-catpick > h1 { text-align: center; }
.bz-catpick > p.bz-muted { text-align: center; margin-bottom: 4px; }
.bz-catpick-quick { display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px; width: 100%; margin: 4px 0; }
/* Items | Services side by side on desktop, divided; stacks on mobile. */
.bz-catpick-cols { display: grid; grid-template-columns: 1fr 1fr; gap: 0; }
.bz-catpick-col { padding: 2px 22px; min-width: 0; }
.bz-catpick-col:first-child { padding-inline-start: 2px; }
.bz-catpick-col:last-child { padding-inline-end: 2px; border-inline-start: 1px solid var(--be-border, var(--z-border)); }
.bz-catpick-col .bz-catpick-h { margin-top: 6px; }
.bz-catq { display: flex; align-items: center; gap: 12px; padding: 14px 16px; border-radius: 14px; text-decoration: none;
  background: var(--z-card); border: 1px solid var(--be-border, var(--z-border)); border-inline-start: 4px solid var(--tc, var(--z-green));
  color: var(--be-text, var(--z-text)); transition: transform .12s, box-shadow .12s, border-color .12s; }
.bz-catq:hover { transform: translateY(-2px); box-shadow: 0 12px 26px -12px rgba(0,0,0,.28); }
.bz-catq > span:first-child { font-size: 1.7rem; line-height: 1; flex: 0 0 auto; }
.bz-catq-tx { display: flex; flex-direction: column; min-width: 0; }
.bz-catq-tx b { font-size: 1rem; }
.bz-catq-tx small { color: var(--be-text-muted, var(--z-muted)); font-size: .76rem; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.bz-catpick-h { font-size: .82rem; font-weight: 800; text-transform: uppercase; letter-spacing: .05em;
  color: var(--be-text-muted, var(--z-muted)); margin: 22px 0 10px; display: flex; align-items: center; gap: 8px; }
.bz-catpick-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(104px, 1fr)); gap: 8px; width: 100%; }
.bz-catcard { display: flex; flex-direction: column; align-items: center; gap: 6px; text-align: center; cursor: pointer;
  background: var(--z-card); border: 1px solid var(--be-border, var(--z-border)); border-radius: 12px; padding: 12px 8px;
  color: var(--be-text, var(--z-text)); transition: transform .12s, border-color .12s, box-shadow .12s; }
.bz-catcard:hover { transform: translateY(-2px); border-color: var(--z-green); box-shadow: 0 10px 22px -12px rgba(0,0,0,.22); }
.bz-catcard:focus-visible { outline: 3px solid var(--z-green); outline-offset: 2px; }
.bz-catcard-ic { font-size: 1.7rem; line-height: 1; }
.bz-catcard b { font-size: .8rem; font-weight: 600; line-height: 1.22; }
@media (max-width: 640px) {
  /* Stack the two sections with a horizontal divider between them. */
  .bz-catpick-cols { grid-template-columns: 1fr; }
  .bz-catpick-col { padding-inline: 0; }
  .bz-catpick-col:last-child { border-inline-start: 0; border-top: 1px solid var(--be-border, var(--z-border)); margin-top: 10px; padding-top: 4px; }
}
@media (max-width: 560px) {
  .bz-catpick-quick { grid-template-columns: 1fr; }
  .bz-catq-tx small { white-space: normal; }
}

/* adaptive form header */
/* A clear pill button (not a plain green link) so it reads unmistakably as
   "Back" — the old text link sat under the "‹ My account" link and got missed. */
.bz-wiz-back { align-self: flex-start; display: inline-flex; align-items: center; gap: 5px; cursor: pointer;
  background: var(--be-surface-2, #f1f5f3); border: 1px solid var(--be-border-strong, var(--z-border)); border-radius: 999px;
  padding: 8px 15px; margin: 0; color: var(--be-text, var(--z-text)); font-weight: 700; font-size: .86rem; font-family: inherit; }
.bz-wiz-back:hover { border-color: var(--z-green); color: var(--z-green); background: var(--be-surface, #fff); }
:root[data-theme="dark"] .bz-wiz-back { background: rgba(255,255,255,.05); }
.bz-typebadge { display: flex; align-items: center; gap: 6px; font-size: .9rem; color: var(--be-text-soft, var(--z-text));
  background: var(--be-surface-2, #f3f6f5); border-radius: 10px; padding: 8px 12px; }
.bz-typebadge #bzw-type-emoji { font-size: 1.1rem; }
.bz-typebadge .bz-link { margin-left: auto; }
.bz-typeblk { display: flex; flex-direction: column; gap: 14px; }
:root[data-theme="dark"] .bz-typebadge { background: rgba(255,255,255,.05); }

@media (max-width: 560px) {
  .bz-typegrid { grid-template-columns: 1fr; }
  .bz-steps-lbl { font-size: .68rem; }
}

/* ── Urdu / RTL ──
   dir="rtl" on <html> mirrors flex/grid automatically; these tweaks fix the
   Urdu webfont, a couple of absolutely-positioned bits, and directional arrows. */
html[dir="rtl"] body, html[dir="rtl"] .btn-primary, html[dir="rtl"] input,
html[dir="rtl"] select, html[dir="rtl"] textarea, html[dir="rtl"] button {
  font-family: "Noto Nastaliq Urdu", "Noto Naskh Arabic", "Inter", system-ui, -apple-system, "Segoe UI", sans-serif;
}
/* Nastaliq is a tall, diagonal script — it needs extra line spacing to breathe. */
html[dir="rtl"] body { line-height: 2.1; }
html[dir="rtl"] .bz-field span, html[dir="rtl"] .bz-seclbl { line-height: 1.9; }
html[dir="rtl"] .bz-tag-verified { left: auto; right: 8px; }
html[dir="rtl"] .bz-steps li::before { left: auto; right: -50%; }
html[dir="rtl"] .bz-idchip-ok, html[dir="rtl"] .bz-typebadge .bz-link { margin-left: 0; }
html[dir="rtl"] .bz-typebadge .bz-link { margin-right: auto; }
html[dir="rtl"] .bz-back { direction: rtl; }
/* numbers/prices stay LTR so they read correctly inside RTL text */
.bz-card-price, .bz-detail-price, .bz-verified-num, .bz-price-row input { direction: ltr; }
html[dir="rtl"] .bz-card-price, html[dir="rtl"] .bz-detail-price { text-align: right; }

/* ── Service credentials / evidence ── */
/* Privacy reassurance banner (top of the doctor/provider Details step). */
.bz-privacy-banner { display: flex; gap: 12px; align-items: flex-start; background: #eaf5ee; border: 1px solid #bfe2cd; border-radius: 12px; padding: 12px 14px; margin: 0 0 16px; }
:root[data-theme="dark"] .bz-privacy-banner { background: rgba(31,138,76,.12); border-color: rgba(31,138,76,.35); }
.bz-privacy-ic { flex: 0 0 auto; color: #1f8a4c; display: inline-flex; }
.bz-privacy-ic svg { width: 26px; height: 26px; }
.bz-privacy-banner b { display: block; font-size: .92rem; color: #17603a; }
:root[data-theme="dark"] .bz-privacy-banner b { color: #7fd6a3; }
.bz-privacy-banner small { display: block; margin-top: 2px; color: var(--z-muted); line-height: 1.4; }

/* Doctor onboarding: 2-column (form left, Verified-Badge panel right). Aside is
   hidden for non-doctor categories → the main column is full width. */
#bz-wizard.bz-doc-wide { max-width: 1000px; }
/* The details card is normally capped at 600px; the doctor 2-col needs the room. */
#bz-wizard.bz-doc-wide #bzw-form { max-width: 1000px; }
.bz-post-2col { display: flex; gap: 24px; align-items: flex-start; }
.bz-post-main { flex: 1 1 auto; min-width: 0; display: flex; flex-direction: column; gap: 14px; }
.bz-post-aside { flex: 0 0 320px; align-self: stretch; }
.bz-post-aside { background: linear-gradient(180deg,#f6fbf8,#eef7f1); border: 1px solid #d7ecdf; border-radius: 16px; padding: 18px; position: sticky; top: 84px; }
:root[data-theme="dark"] .bz-post-aside { background: rgba(31,138,76,.10); border-color: rgba(31,138,76,.30); }
.bz-vp-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 10px; }
.bz-vp-kicker { font-size: .82rem; color: var(--z-muted); font-weight: 600; }
.bz-vp-title { margin: 0; font-size: 1.25rem; font-weight: 800; line-height: 1.1; color: var(--z-green,#0a7d3f); }
.bz-vp-seal { font-size: 1.5rem; color: #1d9bf0; }
.bz-vp-sub { margin: 4px 0 14px; font-size: .86rem; color: var(--z-muted); }
.bz-vp-sample { display: flex; gap: 12px; align-items: center; background: var(--z-card,#fff); border: 1px solid var(--be-border,var(--z-border)); border-radius: 12px; padding: 12px; box-shadow: 0 2px 10px rgba(16,40,30,.05); }
.bz-vp-avatar { width: 52px; height: 52px; flex: 0 0 auto; border-radius: 50%; background: linear-gradient(140deg,#e7f0fc,#c7dbf6); display: grid; place-items: center; font-size: 1.7rem; border: 2px solid #fff; object-fit: cover; box-shadow: 0 1px 4px rgba(0,0,0,.12); }
.bz-vp-sample-body { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.bz-vp-name { display: flex; align-items: center; gap: 5px; font-weight: 800; font-size: .95rem; }
.bz-vp-spec { font-size: .8rem; color: var(--z-muted); }
.bz-vp-rating { font-size: .82rem; font-weight: 700; } .bz-vp-rating .star { color: #F6A000; } .bz-vp-rating small { color: var(--z-muted); font-weight: 600; }
.bz-badge-online { display: inline-flex; align-items: center; gap: 4px; align-self: flex-start; margin-top: 3px; font-size: .68rem; font-weight: 800; color: #1f8a4c; background: #e6f5ec; border-radius: 999px; padding: 2px 8px; }
.bz-vp-samplenote { margin: 6px 0 14px; font-size: .72rem; color: var(--z-muted); }
.bz-vp-lead { margin: 0 0 8px; font-size: .84rem; font-weight: 700; }
.bz-vp-benefits { list-style: none; margin: 0 0 14px; padding: 0; display: flex; flex-direction: column; gap: 7px; }
.bz-vp-benefits li { position: relative; padding-left: 24px; font-size: .84rem; line-height: 1.35; }
.bz-vp-benefits li::before { content: "✓"; position: absolute; left: 0; top: 0; width: 17px; height: 17px; display: grid; place-items: center; border-radius: 50%; background: #1f8a4c; color: #fff; font-size: .62rem; font-weight: 900; }
.bz-vp-privacy { display: flex; gap: 10px; align-items: flex-start; background: #eaf5ee; border: 1px solid #bfe2cd; border-radius: 12px; padding: 11px 12px; }
:root[data-theme="dark"] .bz-vp-privacy { background: rgba(31,138,76,.14); border-color: rgba(31,138,76,.32); }
.bz-vp-lock { flex: 0 0 auto; color: #1f8a4c; display: inline-flex; }
.bz-vp-privacy b { display: block; font-size: .82rem; color: #17603a; }
:root[data-theme="dark"] .bz-vp-privacy b { color: #7fd6a3; }
.bz-vp-privacy small { display: block; margin-top: 2px; font-size: .74rem; color: var(--z-muted); line-height: 1.4; }
@media (max-width: 900px) {
  .bz-post-2col { flex-direction: column; }
  .bz-post-aside { flex: 1 1 auto; width: 100%; position: static; }
}

/* Consultation-type cards (doctors) */
.bz-field-lbl { display: block; font-weight: 600; margin-bottom: 6px; }
.bz-consult-grid { display: grid; grid-template-columns: repeat(4,1fr); gap: 10px; }
.bz-consult-card { position: relative; text-align: left; padding: 12px 12px 12px 34px; border: 1.5px solid var(--be-border,var(--z-border)); border-radius: 12px; background: var(--z-card,#fff); cursor: pointer; display: flex; flex-direction: column; gap: 2px; min-height: 44px; font: inherit; color: inherit; }
.bz-consult-card::before { content: ""; position: absolute; left: 12px; top: 14px; width: 16px; height: 16px; border-radius: 5px; border: 2px solid #c4ccc8; box-sizing: border-box; }
.bz-consult-card.is-on { border-color: var(--z-green,#0a7d3f); background: rgba(10,125,63,.05); }
.bz-consult-card.is-on::before { border-color: var(--z-green,#0a7d3f); background: var(--z-green,#0a7d3f); }
/* Checkmark (multi-select) — drawn as a rotated border tick over the filled box. */
.bz-consult-card.is-on::after { content: ""; position: absolute; left: 17px; top: 16px; width: 5px; height: 9px; border: solid #fff; border-width: 0 2px 2px 0; transform: rotate(45deg); box-sizing: border-box; }
.bz-consult-card b { font-size: .9rem; } .bz-consult-card small { color: var(--z-muted); font-size: .74rem; }
.bz-consult-new { position: absolute; top: 8px; right: 8px; font-size: .58rem; font-weight: 800; letter-spacing: .03em; color: #1f8a4c; background: #e6f5ec; border-radius: 999px; padding: 1px 6px; }
@media (max-width: 560px) { .bz-consult-grid { grid-template-columns: 1fr 1fr; } }

/* ── Healthcare professional — public display (detail + card) ── */
.bz-detail-prof { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 10px; margin: 4px 0 2px; }
.bz-detail-prof-type { font-weight: 700; font-size: .95rem; }
.bz-detail-prof-qual { font-size: .85rem; color: var(--z-muted); }
.bz-detail-prof-reg { font-size: .74rem; font-weight: 800; color: #1d7fd0; background: rgba(29,155,240,.12); border-radius: 999px; padding: 2px 9px; }
.bz-tag-online { position: absolute; left: 8px; bottom: 8px; font-size: .64rem; font-weight: 800; color: #fff; background: #1f8a4c; border-radius: 999px; padding: 2px 8px; }
.bz-card-prof { font-size: .76rem; color: var(--z-muted); margin-top: 3px; line-height: 1.35; }
.bz-card-prof-reg { color: #1d7fd0; font-weight: 700; white-space: nowrap; }

/* ── Description character counter ── */
.bz-charcount { display: block; margin-top: 4px; text-align: right; font-size: .72rem; color: var(--z-muted); font-variant-numeric: tabular-nums; }
.bz-charcount.is-near { color: #c77700; font-weight: 700; }

/* ── Review & Publish card (doctor path) ── */
.bz-review-head { display: flex; gap: 12px; align-items: flex-start; margin-bottom: 4px; }
.bz-review-badge { font-size: 1.7rem; line-height: 1; }
.bz-review-head h1 { margin: 0 0 3px; font-size: 1.3rem; }
.bz-review-head .bz-muted { margin: 0; font-size: .86rem; }
.bz-review-body { display: grid; grid-template-columns: minmax(120px, 34%) 1fr; gap: 0; margin: 16px 0; border: 1px solid var(--z-border, #e2e6ea); border-radius: 12px; overflow: hidden; }
.bz-review-body dt { padding: 11px 14px; font-size: .8rem; font-weight: 700; color: var(--z-muted); background: rgba(0,0,0,.02); border-top: 1px solid var(--z-border, #e2e6ea); }
.bz-review-body dd { padding: 11px 14px; margin: 0; font-size: .9rem; border-top: 1px solid var(--z-border, #e2e6ea); word-break: break-word; }
.bz-review-body dt:first-of-type, .bz-review-body dd:first-of-type { border-top: 0; }
:root[data-theme="dark"] .bz-review-body dt { background: rgba(255,255,255,.03); }
.bz-review-verify { border-radius: 12px; padding: 12px 14px; margin: 12px 0; background: #fff8ec; border: 1px solid #f0d9a8; }
.bz-review-verify.is-on { background: #eaf5ee; border-color: #bfe2cd; }
:root[data-theme="dark"] .bz-review-verify { background: rgba(240,180,40,.10); border-color: rgba(240,180,40,.28); }
:root[data-theme="dark"] .bz-review-verify.is-on { background: rgba(31,138,76,.14); border-color: rgba(31,138,76,.32); }
.bz-review-verify b { display: block; font-size: .88rem; margin-bottom: 2px; }
.bz-review-verify span { display: block; font-size: .78rem; color: var(--z-muted); line-height: 1.45; }
.bz-review-privacy { margin: 12px 0 4px; }
@media (max-width: 480px) { .bz-review-body { grid-template-columns: 1fr; } .bz-review-body dd { padding-top: 0; border-top: 0; } .bz-review-body dt { border-top: 1px solid var(--z-border, #e2e6ea); } }

.bz-cred { background: rgba(37,99,235,.05); border: 1px solid rgba(37,99,235,.20); border-radius: 12px; padding: 14px; }
:root[data-theme="dark"] .bz-cred { background: rgba(96,140,240,.08); border-color: rgba(96,140,240,.28); }
.bz-cred-head { display: flex; gap: 10px; align-items: flex-start; }
.bz-cred-ic { font-size: 1.5rem; line-height: 1; }
.bz-cred-head b { display: block; font-size: .95rem; }
.bz-cred-head small { display: block; margin-top: 2px; }
.bz-req { color: #c0392b; font-weight: 700; }
.bz-cred-privacy { font-size: .78rem; margin: 2px 0 0 !important; }
.bz-doc-chip { display: inline-flex; align-items: center; gap: 4px; padding: 8px 10px; border-radius: 8px;
  background: var(--be-surface-2, #eef1f0); font-size: .82rem; color: var(--be-text, var(--z-text)); }

/* ── Verified trust seal (blue scalloped badge, buyers recognise it) ── */
.bz-vbadge { display: inline-flex; align-items: center; gap: 4px; vertical-align: middle; line-height: 1; }
.bz-vseal { flex: none; display: block; }
.bz-vlabel { font-size: .74rem; font-weight: 700; color: #1d9bf0; letter-spacing: .01em; white-space: nowrap; }
/* "Unverified" chip — neutral amber, informational (not an error/red). Admin-added
   kitchens carry it until an owner claims + verifies. Pill shape so it reads as a
   status tag, not a seal. Colour via a single token so both glyph + text match. */
.bz-unvbadge { --bz-unv: #b26a00; display: inline-flex; align-items: center; gap: 3px; vertical-align: middle;
  line-height: 1; padding: 2px 8px 2px 6px; border-radius: 999px; color: var(--bz-unv);
  background: rgba(217, 143, 0, .12); border: 1px solid rgba(217, 143, 0, .35); }
.bz-unvseal { flex: none; display: block; }
.bz-unvlabel { font-size: .72rem; font-weight: 700; letter-spacing: .01em; white-space: nowrap; }
html[data-theme="dark"] .bz-unvbadge { --bz-unv: #f0b45e; background: rgba(240, 180, 94, .14); border-color: rgba(240, 180, 94, .34); }
/* On the food card title the chip sits next to the name; keep it from bloating the row. */
.bz-food-card-body h3 .bz-unvbadge { vertical-align: -.15em; }
/* Inline verified pill on profile headers — seal + word, sized up a touch. */
.bz-verified-badge { display: inline-flex; align-items: center; margin: 6px 0 2px; font-size: 1rem; }
.bz-verified-badge .bz-vlabel { font-size: .82rem; }
/* Corner tag on card thumbnails — seal alone, shadowed so it reads over photos. */
.bz-tag-verified { position: absolute; left: 8px; bottom: 8px; z-index: 2; font-size: 22px;
  filter: drop-shadow(0 1px 3px rgba(0,0,0,.45)); }

/* ── Business / doctor profile (Ola-style header + avatar placeholder) ── */
.bz-doc-head { display: flex; gap: 18px; align-items: center; }
.bz-doc-avatar { position: relative; width: 96px; height: 96px; flex: 0 0 auto; border-radius: 50%; overflow: hidden;
  display: grid; place-items: center; background: linear-gradient(140deg, #e8f1ff, #dbeafe); box-shadow: 0 4px 14px rgba(0,0,0,.08); }
.bz-doc-avatar.is-doc { background: linear-gradient(140deg, #e6f7f0, #cdeee0); }
.bz-doc-avatar.is-law { background: linear-gradient(140deg, #fff4e0, #ffe8bf); }
.bz-doc-avatar img { width: 100%; height: 100%; object-fit: cover; }
.bz-doc-avatar-emoji { font-size: 2.8rem; line-height: 1; }
.bz-doc-avatar-initial { display: none; }
.bz-doc-avatar-check { position: absolute; right: 0; bottom: 0; z-index: 2; font-size: 30px; line-height: 0;
  filter: drop-shadow(0 1px 2px rgba(0,0,0,.35)); }
:root[data-theme="dark"] .bz-doc-avatar { background: linear-gradient(140deg, #16324a, #0f2740); }
:root[data-theme="dark"] .bz-doc-avatar.is-doc { background: linear-gradient(140deg, #123a2c, #0d2a20); }
:root[data-theme="dark"] .bz-doc-avatar.is-law { background: linear-gradient(140deg, #40320f, #2a2109); }
.bz-doc-qual { font-size: .92rem; font-weight: 600; color: var(--be-text-soft, var(--z-text)); margin-top: 2px; }
.bz-doc-stats { display: flex; flex-wrap: wrap; gap: 6px 16px; margin-top: 8px; }
.bz-doc-stat { font-size: .88rem; color: var(--be-text-soft, var(--z-text)); }
.bz-doc-stat b { color: var(--be-text, var(--z-text)); }
.bz-doc-stat .bz-stars { color: var(--z-gold, #c9a227); }
.bz-doc-loc { color: var(--be-text-muted, var(--z-muted)); font-size: .85rem; }
.bz-claim-cta { display: flex; align-items: center; gap: 14px; flex-wrap: wrap; justify-content: space-between;
  background: var(--be-surface-2, #f3f6f5); border-radius: 12px; padding: 14px 16px; margin-top: 18px; }
.bz-claim-cta > div { flex: 1; min-width: 210px; }
.bz-claim-cta b { display: block; margin-bottom: 2px; }
:root[data-theme="dark"] .bz-claim-cta { background: rgba(255,255,255,.05); }
@media (max-width: 520px) {
  .bz-doc-head { gap: 14px; }
  .bz-doc-avatar { width: 76px; height: 76px; }
  .bz-doc-avatar-emoji { font-size: 2.2rem; }
}

/* Admin roster (User Management tab) */
.bz-admin-add { display: flex; gap: 10px; margin-top: 12px; flex-wrap: wrap; }
.bz-admin-add input { flex: 1; min-width: 220px; padding: 10px 12px; border: 1px solid var(--be-border, #d5dbd9);
  border-radius: 10px; font-size: .95rem; background: var(--be-surface, #fff); color: inherit; }
.bz-badge { display: inline-block; font-size: .72rem; font-weight: 700; padding: 2px 8px; border-radius: 999px;
  background: var(--be-surface-2, #eef1f0); color: var(--be-text-muted, #5c6b66); vertical-align: middle; }
.bz-badge-owner { background: #fdf1da; color: #9a6512; }

/* Account dropdown: destructive styling for the sign-out item (parity with the portal). */
.be-user-drop #bz-menu-signout { color: #b02226; margin-top: 0.15rem; border-top: 1px solid var(--be-border, #e2e8e5); border-radius: 0 0 8px 8px; }

/* Admin directory management */
.bza-dir-bar { display: flex; gap: 10px; flex-wrap: wrap; align-items: center; margin-bottom: 12px; }
.bza-dir-bar input[type="search"], .bza-dir-bar select { padding: 9px 12px; border: 1px solid var(--be-border, #d5dbd9);
  border-radius: 10px; background: var(--be-surface, #fff); color: inherit; font-size: .92rem; }
.bza-dir-bar input[type="search"] { flex: 1; min-width: 200px; }
.bza-form { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; margin: 10px 0 14px; }
.bza-field { display: flex; flex-direction: column; gap: 4px; font-size: .82rem; font-weight: 600; color: var(--be-text-muted, #5c6b66); }
.bza-field input, .bza-field textarea { padding: 9px 12px; border: 1px solid var(--be-border, #d5dbd9); border-radius: 10px;
  font-size: .95rem; font-weight: 400; background: var(--be-surface, #fff); color: var(--be-text, inherit); font-family: inherit; }
.bza-field:nth-child(7) { grid-column: 1 / -1; }
.bz-badge-hidden { background: #fde2e2; color: #a12b2b; }
@media (max-width: 640px) { .bza-form { grid-template-columns: 1fr; } }

.bz-badge-verified { background: #dcfce7; color: #166534; }
.bza-check { flex-direction: row !important; align-items: center; gap: 8px; font-weight: 400 !important; }
.bza-check input { width: auto !important; }

/* Admin dashboard */
.bza-sec-h { font-size: .8rem; font-weight: 700; text-transform: uppercase; letter-spacing: .06em; color: var(--be-text-muted, #5c6b66); margin: 18px 0 8px; }
.bza-stats { display: grid; grid-template-columns: repeat(auto-fill, minmax(130px, 1fr)); gap: 12px; }
.bza-stat { display: flex; flex-direction: column; gap: 2px; align-items: flex-start; padding: 16px; border: 1px solid var(--be-border, #e2e8e5);
  border-radius: 14px; background: var(--be-surface, #fff); color: inherit; cursor: pointer; text-align: left; transition: border-color .15s; }
.bza-stat:hover { border-color: var(--be-primary, #0d6b4d); }
.bza-stat-n { font-size: 1.8rem; font-weight: 800; font-family: var(--be-font-display, inherit); line-height: 1; }
.bza-stat-l { font-size: .82rem; color: var(--be-text-muted, #5c6b66); }
.bza-stat-warn { background: #fff7ed; border-color: #f5c98a; }
.bza-stat-warn .bza-stat-n { color: #b45309; }

/* ============ Admin console (bzc-*) ============ */
body.bza-console-body{margin:0;background:var(--z-bg);color:var(--z-text)}
body.bza-console-body .bz-auth-card{max-width:400px;margin:14vh auto;background:var(--z-card);border:1px solid var(--z-border);border-radius:16px;padding:34px;text-align:center;box-shadow:var(--shadow)}
.bzc-app{display:grid;grid-template-columns:246px 1fr;min-height:100vh}
.bzc-app[hidden]{display:none}/* [hidden] can't override display:grid on its own (see CLAUDE.md §9) */
.bzc-side{background:var(--z-card);border-right:1px solid var(--z-border);position:sticky;top:0;height:100vh;overflow-y:auto;display:flex;flex-direction:column}
.bzc-brand{display:flex;align-items:center;gap:10px;padding:17px 18px 13px;border-bottom:1px solid var(--z-border)}
.bzc-brand .mk{width:34px;height:34px;border-radius:9px;background:var(--z-green);display:grid;place-items:center;font-size:17px;flex:none}
.bzc-brand b{font-size:14.5px;letter-spacing:-.2px;display:block}
.bzc-brand small{font-size:10.5px;color:var(--z-muted);font-weight:700;letter-spacing:.09em;text-transform:uppercase}
.bzc-nav{padding:10px;display:flex;flex-direction:column;gap:2px}
.bzc-navgroup{font-size:10.5px;font-weight:700;letter-spacing:.09em;text-transform:uppercase;color:var(--z-muted);padding:14px 12px 6px}
.bzc-navitem{display:flex;align-items:center;gap:10px;padding:8px 12px;border-radius:9px;cursor:pointer;color:var(--z-text);border:none;background:none;font:inherit;text-align:left;width:100%}
.bzc-navitem:hover{background:var(--z-green-light)}
.bzc-navitem.on{background:var(--z-green-light);color:var(--z-green-dark);font-weight:600}
.bzc-navitem .ic{width:20px;text-align:center;font-size:15px;flex:none}
.bzc-navitem .ct{margin-left:auto;font-size:11.5px;color:var(--z-muted);font-variant-numeric:tabular-nums;font-weight:600}
.bzc-main{min-width:0;display:flex;flex-direction:column}
.bzc-topbar{display:flex;align-items:center;gap:12px;padding:14px 24px;border-bottom:1px solid var(--z-border);background:var(--z-card);position:sticky;top:0;z-index:5}
.bzc-titlewrap h1{margin:0;font-size:18px;letter-spacing:-.3px}
.bzc-sub{font-size:12px;color:var(--z-muted)}
.bzc-search{margin-left:auto}
.bzc-search input{width:220px;max-width:38vw;padding:8px 12px;border:1px solid var(--z-border);border-radius:9px;background:var(--z-bg);color:var(--z-text);font:inherit}
.bzc-burger{display:none;border:none;background:none;font-size:20px;cursor:pointer;color:var(--z-text)}
.bzc-content{padding:22px 24px 60px;max-width:1180px;width:100%}
.bzc-tablewrap{background:var(--z-card);border:1px solid var(--z-border);border-radius:14px;box-shadow:var(--shadow);overflow:hidden}
.bzc-tabletop{display:flex;align-items:center;gap:10px;padding:12px 16px;border-bottom:1px solid var(--z-border);flex-wrap:wrap}
.bzc-count{font-size:12.5px;color:var(--z-muted);font-weight:600}
.bzc-filter{display:flex;gap:6px;flex-wrap:wrap;margin-left:auto}
.bzc-filter button{border:1px solid var(--z-border);background:none;color:var(--z-muted);padding:4px 10px;border-radius:999px;font:inherit;font-size:12px;cursor:pointer}
.bzc-filter button.on{background:var(--z-green-light);color:var(--z-green-dark);border-color:transparent;font-weight:600}
.bzc-scrollx{overflow-x:auto}
.bzc-table{width:100%;border-collapse:collapse;font-size:13.5px}
.bzc-table thead th{text-align:left;font-size:11px;font-weight:700;letter-spacing:.05em;text-transform:uppercase;color:var(--z-muted);padding:11px 16px;border-bottom:1px solid var(--z-border);white-space:nowrap}
.bzc-table tbody td{padding:10px 16px;border-bottom:1px solid var(--z-border);vertical-align:middle}
.bzc-table tbody tr:last-child td{border-bottom:none}
.bzc-table tbody tr:hover{background:var(--z-green-light)}
.bzc-cellname{font-weight:600;display:flex;align-items:center;gap:10px}
/* Drag-to-reorder handle + row-in-flight state. */
.bzc-reorder-hint{margin:0;padding:9px 16px;font-size:12px;color:var(--z-muted);background:var(--z-green-light);border-bottom:1px solid var(--z-border)}
.bzc-griph{width:26px}
.bzc-grip{width:26px;text-align:center;color:var(--z-muted);cursor:grab;user-select:none;letter-spacing:-1px}
.bzc-table tbody tr[draggable="true"]:hover .bzc-grip{color:var(--z-text)}
.bzc-table tbody tr.bzc-dragging{opacity:.5;background:var(--z-green-light)}
.bzc-table tbody tr.bzc-dragging .bzc-grip{cursor:grabbing}
.bzc-num{font-variant-numeric:tabular-nums}

/* ── Directory admin: compact provider cards (4–5 per row) ── */
.bzc-cardgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(228px,1fr));gap:14px;padding:16px}
.bzc-dcard{position:relative;display:flex;flex-direction:column;gap:9px;background:var(--z-card);border:1px solid var(--z-border);border-radius:14px;padding:15px 14px 11px;box-shadow:var(--shadow);transition:box-shadow .15s,transform .15s}
.bzc-dcard:hover{box-shadow:0 6px 20px rgba(0,0,0,.09);transform:translateY(-1px)}
.bzc-dcard.bz-dragging{opacity:.45;outline:2px dashed var(--z-green)}
.bzc-dcard-grip{position:absolute;top:7px;left:8px;color:var(--z-muted);opacity:.45;cursor:grab;font-size:12px;line-height:1;letter-spacing:-1px}
.bzc-dcard:hover .bzc-dcard-grip{opacity:.8}
.bzc-dcard-grip:active{cursor:grabbing}
.bzc-dcard-star{position:absolute;top:6px;right:9px;background:none;border:none;padding:2px;font-size:16px;line-height:1;cursor:pointer;color:var(--z-gold)}
.bzc-dcard-star:not(.on){color:var(--z-muted);opacity:.5}
.bzc-dcard-star:not(.on):hover{opacity:1}
.bzc-dcard-head{display:flex;gap:10px;align-items:center;padding-right:18px}
.bzc-dcard-av{position:relative;flex:0 0 auto;width:46px;height:46px;border-radius:50%;overflow:hidden;background:var(--z-green-light);display:flex;align-items:center;justify-content:center;font-size:20px}
.bzc-dcard-av img{width:100%;height:100%;object-fit:cover;display:block}
.bzc-dcard-check{position:absolute;right:-2px;bottom:-2px;width:17px;height:17px;border-radius:50%;background:var(--z-green);color:#fff;font-size:10px;font-weight:700;display:flex;align-items:center;justify-content:center;border:2px solid var(--z-card)}
.bzc-dcard-idw{min-width:0}
.bzc-dcard-name{font-weight:700;font-size:14px;line-height:1.25;color:var(--z-text);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.bzc-dcard-spec{font-size:12px;color:var(--z-muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;margin-top:1px}
.bzc-dcard-meta{display:flex;flex-direction:column;gap:3px;font-size:12px;color:var(--z-text)}
.bzc-dcard-meta .bzc-dcard-row{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.bzc-dcard-meta a{color:inherit;text-decoration:none}
.bzc-dcard-meta a:hover{text-decoration:underline;color:var(--z-green-dark)}
.bzc-dcard-row.dim{color:var(--z-muted);opacity:.7}
.bzc-dcard-foot{display:flex;align-items:center;justify-content:space-between;gap:6px;flex-wrap:wrap;margin-top:auto;padding-top:9px;border-top:1px solid var(--z-border)}
.bzc-dcard-acts{display:flex;gap:3px;align-items:center}
.bzc-dcard-acts .bz-btn-ghost{padding:3px 8px;font-size:12px}
.bzc-pill.live{background:var(--z-green-light);color:var(--z-green-dark)}
.bzc-pill.hide{background:#eef0f2;color:#7a828a}
.bzc-pill.del{background:#fdecea;color:#a12a1a}
.bzc-muted{color:var(--z-muted)}
.bzc-tag{display:inline-block;padding:2px 8px;border-radius:6px;background:var(--z-green-light);color:var(--z-green-dark);font-size:11.5px;margin:1px 2px 1px 0}
.bzc-rowacts{display:flex;gap:4px;justify-content:flex-end}
.bzc-pill{display:inline-flex;align-items:center;gap:5px;padding:2px 9px;border-radius:999px;font-size:11.5px;font-weight:600;white-space:nowrap}
.bzc-pill.ok{background:var(--z-green-light);color:var(--z-green-dark)}
.bzc-pill.warn{background:#fdf1da;color:#b45309}
.bzc-pill.off{background:#fdeaea;color:#dc2626}
.bzc-pill.info{background:#e7f0fb;color:#2563a8}
:root[data-theme=dark] .bzc-pill.warn{background:#3a2c1580;color:#f0b45f}
:root[data-theme=dark] .bzc-pill.off{background:#3a1c1c80;color:#f2a0a0}
:root[data-theme=dark] .bzc-pill.info{background:#1a2c4180;color:#7fb0e6}
.bzc-avatar{border-radius:50%;background:radial-gradient(circle at 50% 32%,var(--z-green-light),var(--z-bg));display:grid;place-items:center;position:relative;flex:none;color:var(--z-green-dark);overflow:hidden}
.bzc-avatar img{width:100%;height:100%;object-fit:cover}
.bzc-av-sm{width:34px;height:34px;font-size:16px}
.bzc-photoblock{display:flex;align-items:center;gap:16px;padding-bottom:12px;margin-bottom:4px;border-bottom:1px dashed var(--z-border)}
.bzc-photoav{width:78px;height:78px;font-size:36px}
.bzc-photoav .badge{position:absolute;right:-1px;bottom:-1px;width:26px;height:26px;border-radius:50%;background:var(--z-green);color:#fff;display:grid;place-items:center;font-size:12px;border:3px solid var(--z-card)}
.bzc-photoacts{display:flex;flex-direction:column;gap:6px;align-items:flex-start}
.bzc-photohint{font-size:11px;color:var(--z-muted);max-width:250px;line-height:1.45}
.bzc-klabel{font-size:11px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--z-muted);margin:8px 0 10px}
.bzc-stats{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:12px;margin-bottom:22px}
.bzc-stat{background:var(--z-card);border:1px solid var(--z-border);border-radius:12px;padding:16px;text-align:left;cursor:pointer;box-shadow:var(--shadow)}
.bzc-stat:hover{border-color:var(--z-green)}
.bzc-stat .n{font-size:26px;font-weight:800;line-height:1;font-variant-numeric:tabular-nums;letter-spacing:-.5px}
.bzc-stat .l{font-size:12.5px;color:var(--z-muted);margin-top:5px}
.bzc-stat.attn{border-left:3px solid #b45309}.bzc-stat.attn .n{color:#b45309}
.bzc-stat.attn.zero{border-left-color:var(--z-border)}.bzc-stat.attn.zero .n{color:var(--z-text)}
/* ── Overview dashboard (KPIs · attention · donut charts) ── */
.bzc-dash{display:flex;flex-direction:column}
.bzc-kpis{display:grid;grid-template-columns:repeat(auto-fit,minmax(210px,1fr));gap:14px;margin-bottom:22px}
.bzc-kpi{display:flex;align-items:center;gap:14px;background:var(--z-card);border:1px solid var(--z-border);border-radius:16px;padding:18px 20px 18px 22px;cursor:pointer;text-align:left;box-shadow:var(--shadow);transition:transform .14s ease,box-shadow .14s ease;position:relative;overflow:hidden}
.bzc-kpi:hover{transform:translateY(-2px);box-shadow:0 12px 28px rgba(5,74,55,.12)}
.bzc-kpi::before{content:"";position:absolute;left:0;top:0;bottom:0;width:5px;background:var(--kpi)}
.bzc-kpi.tone-teal{--kpi:#159f98}.bzc-kpi.tone-green{--kpi:#12a150}.bzc-kpi.tone-blue{--kpi:#2563eb}.bzc-kpi.tone-lime{--kpi:#65a30d}
.bzc-kpi.tone-amber{--kpi:#f59e0b}.bzc-kpi.tone-violet{--kpi:#8b5cf6}
.bzc-kpi.tone-amber .bzc-kpi-ic{background:rgba(245,158,11,.15)}.bzc-kpi.tone-violet .bzc-kpi-ic{background:rgba(139,92,246,.15)}
.bzc-kpi-ic{flex:none;width:48px;height:48px;border-radius:14px;display:grid;place-items:center;font-size:1.45rem;background:var(--z-green-light)}
.bzc-kpi.tone-teal .bzc-kpi-ic{background:rgba(21,159,152,.14)}.bzc-kpi.tone-green .bzc-kpi-ic{background:rgba(18,161,80,.14)}
.bzc-kpi.tone-blue .bzc-kpi-ic{background:rgba(37,99,235,.13)}.bzc-kpi.tone-lime .bzc-kpi-ic{background:rgba(101,163,13,.15)}
.bzc-kpi-b{display:flex;flex-direction:column;min-width:0}
.bzc-kpi-n{font-size:30px;font-weight:800;line-height:1;font-variant-numeric:tabular-nums;letter-spacing:-1px;color:var(--z-text)}
.bzc-kpi-l{font-size:12.5px;color:var(--z-muted);margin-top:5px}
.bzc-attns{display:grid;grid-template-columns:repeat(auto-fill,minmax(148px,1fr));gap:10px;margin-bottom:22px}
.bzc-attn{display:flex;flex-direction:column;gap:3px;background:var(--z-card);border:1px solid var(--z-border);border-radius:12px;padding:13px 15px;cursor:pointer;text-align:left;position:relative;transition:border-color .14s ease}
.bzc-attn-ic{font-size:1.05rem;line-height:1}
.bzc-attn-n{font-size:23px;font-weight:800;line-height:1;font-variant-numeric:tabular-nums;color:var(--z-text)}
.bzc-attn-l{font-size:12px;color:var(--z-muted)}
.bzc-attn.hot{border-color:rgba(245,158,11,.55);background:rgba(245,158,11,.07)}
.bzc-attn.hot .bzc-attn-n{color:#b45309}
.bzc-attn.hot::after{content:"";position:absolute;top:11px;right:11px;width:8px;height:8px;border-radius:50%;background:#f59e0b;box-shadow:0 0 0 3px rgba(245,158,11,.22)}
.bzc-attn.zero{opacity:.66}
.bzc-attn:hover{border-color:var(--z-green);opacity:1}
.bzc-charts{display:grid;grid-template-columns:repeat(auto-fit,minmax(330px,1fr));gap:16px;margin-bottom:22px}
.bzc-chartcard{background:var(--z-card);border:1px solid var(--z-border);border-radius:16px;padding:18px 20px;box-shadow:var(--shadow)}
.bzc-ch-h{font-size:13px;font-weight:700;letter-spacing:.02em;margin-bottom:16px;color:var(--z-text)}
.bzc-ch-body{display:flex;align-items:center;gap:22px;flex-wrap:wrap}
.bzc-donut{width:152px;height:152px;flex:none}
.bzc-donut-n{font-size:34px;font-weight:800;fill:var(--z-text);font-variant-numeric:tabular-nums}
.bzc-donut-l{font-size:11px;fill:var(--z-muted);text-transform:uppercase;letter-spacing:.08em}
.bzc-legend{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:7px;flex:1;min-width:150px}
.bzc-legend li{display:flex;align-items:center;gap:9px;font-size:13px;padding:4px 7px;border-radius:8px}
.bzc-legend li[data-goto]{cursor:pointer}
.bzc-legend li[data-goto]:hover{background:var(--z-green-light)}
.bzc-legend .dot{width:11px;height:11px;border-radius:3px;flex:none}
.bzc-legend .lg-l{flex:1;color:var(--z-text);min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.bzc-legend .lg-n{font-weight:800;font-variant-numeric:tabular-nums;color:var(--z-text)}
.bzc-ministats{display:grid;grid-template-columns:repeat(auto-fill,minmax(165px,1fr));gap:12px;margin-bottom:22px}
.bzc-mini{display:flex;flex-direction:column;gap:3px;background:var(--z-card);border:1px solid var(--z-border);border-radius:12px;padding:14px 16px 14px 20px;cursor:pointer;text-align:left;position:relative;overflow:hidden;transition:border-color .14s ease}
.bzc-mini:hover{border-color:var(--z-green)}
.bzc-mini-bar{position:absolute;left:0;top:0;bottom:0;width:5px}
.bzc-mini-n{font-size:23px;font-weight:800;font-variant-numeric:tabular-nums;line-height:1;color:var(--z-text)}
.bzc-mini-l{font-size:12px;color:var(--z-muted)}
@media (max-width:560px){.bzc-ch-body{gap:14px}.bzc-donut{width:128px;height:128px}}
.bzc-scrim{position:fixed;inset:0;background:rgba(10,20,16,.42);opacity:0;pointer-events:none;transition:opacity .2s;z-index:40}
.bzc-scrim.on{opacity:1;pointer-events:auto}
.bzc-drawer{position:fixed;top:0;right:0;height:100vh;width:min(480px,95vw);background:var(--z-card);border-left:1px solid var(--z-border);transform:translateX(100%);transition:transform .24s cubic-bezier(.4,0,.2,1);z-index:41;display:flex;flex-direction:column;box-shadow:-20px 0 50px rgba(10,20,16,.16)}
.bzc-drawer.on{transform:none}
.bzc-dhead{display:flex;align-items:center;gap:10px;padding:16px 20px;border-bottom:1px solid var(--z-border)}
.bzc-dhead h2{margin:0;font-size:16px}
.bzc-dhead .ki{width:34px;height:34px;border-radius:9px;background:var(--z-green-light);color:var(--z-green-dark);display:grid;place-items:center;font-size:17px}
.bzc-x{margin-left:auto}
.bzc-dbody{padding:18px 20px;overflow-y:auto;flex:1;display:flex;flex-direction:column;gap:13px}
.bzc-field{display:flex;flex-direction:column;gap:5px}
.bzc-field label{font-size:12px;font-weight:600;color:var(--z-muted)}
.bzc-field input,.bzc-field select,.bzc-field textarea{padding:9px 11px;border:1px solid var(--z-border);border-radius:9px;background:var(--z-bg);color:var(--z-text);font:inherit;width:100%}
.bzc-field .hint{font-size:11px;color:var(--z-muted)}
.bzc-grid2{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.bzc-checkrow{display:flex;align-items:center;gap:8px}.bzc-checkrow input{width:auto}
.bzc-seclbl{font-size:11px;font-weight:700;letter-spacing:.07em;text-transform:uppercase;color:var(--z-green-dark);margin-top:4px;padding-top:12px;border-top:1px dashed var(--z-border)}
.bzc-dfoot{display:flex;gap:10px;padding:13px 20px;border-top:1px solid var(--z-border)}
.bzc-dfoot>button{flex:1}
.bzc-toast{position:fixed;bottom:22px;left:50%;transform:translateX(-50%) translateY(20px);background:var(--z-text);color:var(--z-bg);padding:11px 18px;border-radius:10px;font-weight:600;font-size:13px;opacity:0;pointer-events:none;transition:.25s;z-index:50}
.bzc-toast.on{opacity:1;transform:translateX(-50%)}
@media (max-width:820px){.bzc-app{grid-template-columns:1fr}.bzc-side{position:fixed;left:0;top:0;z-index:60;width:240px;transform:translateX(-100%);transition:transform .2s}.bzc-side.open{transform:none}.bzc-burger{display:block}.bzc-search input{width:130px}}

/* Card age — quiet, secondary to price and location. */
.bz-card-age { color: var(--z-muted); }

/* ══════════════════════ Food ordering module ══════════════════════ */
/* Warm, appetite-forward palette — distinct from the green Services world. */
.bz-food-hero { background: linear-gradient(135deg, #b8410f 0%, #d9622a 48%, #e8912f 100%); }
.bz-food-sell { display: inline-block; background: #fff; color: #b8410f; margin-top: 6px; }
.bz-food-wrap { padding: 24px 0 48px; }
.bz-muted { color: var(--be-text-muted, var(--z-muted)); }

/* Food design tokens — warm, appetite-forward, distinct from the green world. */
:root { --food-deep: #a8380c; --food: #d9622a; --food-warm: #e8912f; --food-tint: #fff3e9; --food-ink: #b8410f; }
html[data-theme="dark"] { --food-tint: #2a1a10; --food-ink: #f0a54a; }

/* Discovery bar — search + quick chips + cuisine/sort selects (sticky on scroll). */
.bz-food-discover { position: sticky; top: 8px; z-index: 20; display: flex; flex-direction: column; gap: 12px;
  background: var(--be-surface, #fff); border: 1px solid var(--be-border, var(--z-border));
  border-radius: 18px; padding: 14px; margin: 0 0 18px; box-shadow: 0 10px 30px -22px rgba(168,56,12,.5); }
.bz-food-search { display: flex; align-items: center; gap: 10px; padding: 0 14px; border-radius: 12px;
  background: var(--be-surface-2, var(--food-tint)); border: 1.5px solid transparent; transition: border-color .15s ease, box-shadow .15s ease; }
.bz-food-search:focus-within { border-color: var(--food-warm); box-shadow: 0 0 0 3px rgba(232,145,47,.22); }
.bz-food-search svg { color: var(--food-ink); flex: none; }
.bz-food-q { flex: 1; border: 0; background: transparent; padding: 13px 0; font-size: 1rem; color: inherit; outline: none; min-width: 0; }
.bz-food-q::placeholder { color: var(--be-text-muted, var(--z-muted)); }
.bz-food-controls { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; }
.bz-food-chips { display: flex; flex-wrap: wrap; gap: 8px; }
.bz-food-chip { display: inline-flex; align-items: center; gap: 5px; cursor: pointer; font: inherit; font-size: .84rem; font-weight: 600;
  padding: 8px 14px; border-radius: 999px; border: 1.5px solid var(--be-border, var(--z-border)); background: var(--be-surface, #fff); color: inherit; transition: all .14s ease; }
.bz-food-chip:hover { border-color: var(--food-warm); }
.bz-food-chip.is-on { background: var(--food); border-color: var(--food); color: #fff; box-shadow: 0 6px 16px -8px rgba(217,98,42,.7); }
.bz-food-selects { display: flex; gap: 10px; margin-inline-start: auto; }
.bz-food-sel select { font: inherit; font-size: .86rem; padding: 8px 12px; border-radius: 10px; cursor: pointer;
  border: 1.5px solid var(--be-border, var(--z-border)); background: var(--be-surface, #fff); color: inherit; }
.bz-food-sel select:focus-visible { outline: 2px solid var(--food-warm); outline-offset: 1px; }
.bz-sr { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.bz-food-count .bz-food-clear { color: var(--food-ink); font-weight: 600; font-size: .88rem; text-decoration: none; }
.bz-food-count .bz-food-clear:hover { text-decoration: underline; }

/* Dish results strip — horizontal-scroll cards so customers find food, not just kitchens. */
.bz-food-dishes { margin: 0 0 22px; }
.bz-food-dishes-h { margin: 0 0 12px; font-size: 1.02rem; font-weight: 700; letter-spacing: -.01em; }
/* Appetising dish showcase on the Food hub — big-photo tiles that deep-link to the
   exact item so a tempting photo turns into an order in one tap. */
.bz-food-showcase { margin: 4px 0 24px; }
.bz-food-showcase-head { display: flex; align-items: baseline; gap: 12px; flex-wrap: wrap; margin: 0 0 12px; }
.bz-food-showcase-head h2 { margin: 0; font-size: 1.2rem; }
.bz-food-showcase-sub { color: var(--be-text-muted, var(--z-muted)); font-size: .86rem; }
.bz-food-showrow { display: flex; gap: 14px; overflow-x: auto; padding-bottom: 8px; scroll-snap-type: x proximity; -webkit-overflow-scrolling: touch; }
.bz-show-card { flex: 0 0 auto; width: 182px; scroll-snap-align: start; text-decoration: none; color: inherit;
  background: var(--be-surface, #fff); border: 1px solid var(--be-border, var(--z-border)); border-radius: 16px; overflow: hidden;
  display: flex; flex-direction: column; transition: transform .12s, box-shadow .12s, border-color .12s; }
.bz-show-card:hover { transform: translateY(-4px); box-shadow: 0 16px 34px -18px rgba(168,56,12,.5); border-color: var(--food-warm); }
.bz-show-card.is-closed { opacity: .72; }
.bz-show-img { display: block; aspect-ratio: 4 / 3; background: var(--food-tint, #fff6ec); overflow: hidden; }
.bz-show-img img { width: 100%; height: 100%; object-fit: cover; }
.bz-show-body { padding: 9px 11px 11px; display: flex; flex-direction: column; gap: 2px; }
.bz-show-name { font-weight: 700; font-size: .9rem; line-height: 1.25; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.bz-show-from { font-size: .74rem; color: var(--be-text-muted, var(--z-muted)); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.bz-show-price { margin-top: 2px; font-weight: 800; font-size: .9rem; color: var(--food-deep, #c2521a); }
@media (max-width: 600px) { .bz-show-card { width: 150px; } }
.bz-food-dishrow { display: flex; gap: 12px; overflow-x: auto; padding-bottom: 6px; scroll-snap-type: x proximity; -webkit-overflow-scrolling: touch; }
.bz-food-dish { flex: 0 0 auto; width: 220px; scroll-snap-align: start; display: flex; gap: 10px; align-items: center; text-decoration: none; color: inherit;
  background: var(--be-surface, #fff); border: 1px solid var(--be-border, var(--z-border)); border-radius: 14px; padding: 8px; transition: transform .14s ease, box-shadow .14s ease, border-color .14s ease; }
.bz-food-dish:hover { transform: translateY(-3px); box-shadow: 0 14px 30px -18px rgba(168,56,12,.4); border-color: var(--food-warm); }
.bz-food-dish.is-closed { opacity: .72; }
.bz-food-dish-img { width: 62px; height: 62px; flex: none; border-radius: 11px; overflow: hidden; display: flex; align-items: center; justify-content: center;
  background: linear-gradient(135deg, var(--food-deep), var(--food-warm)); }
.bz-food-dish-img img { width: 100%; height: 100%; object-fit: cover; }
.bz-food-dish-img span { font-size: 1.6rem; }
.bz-food-dish-body { min-width: 0; display: flex; flex-direction: column; gap: 1px; }
.bz-food-dish-name { font-weight: 700; font-size: .9rem; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.bz-food-dish-from { font-size: .74rem; color: var(--be-text-muted, var(--z-muted)); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.bz-food-dish-price { font-size: .82rem; font-weight: 800; color: var(--food-ink); margin-top: 2px; }

.bz-food-loadstatus { text-align: center; color: var(--be-text-muted, var(--z-muted)); font-size: .86rem; min-height: 1.2em; margin: 16px 0 0; }
@media (max-width: 640px) {
  .bz-food-selects { width: 100%; margin-inline-start: 0; }
  .bz-food-sel { flex: 1; } .bz-food-sel select { width: 100%; }
}

/* Hub grid */
.bz-food-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(250px, 1fr)); gap: 18px; }
.bz-food-card { display: flex; flex-direction: column; background: var(--be-surface, #fff); border: 1px solid var(--be-border, var(--z-border));
  border-radius: 18px; overflow: hidden; text-decoration: none; color: inherit; transition: transform .14s ease, box-shadow .14s ease; }
.bz-food-card:hover { transform: translateY(-4px); box-shadow: 0 18px 40px -16px rgba(168,56,12,.35); border-color: var(--food-warm); }
.bz-food-card.is-closed { opacity: .78; }
.bz-food-card-logo { position: relative; height: 158px; background: linear-gradient(135deg, var(--food-deep), var(--food) 60%, var(--food-warm)); display: flex; align-items: center; justify-content: center; }
.bz-food-card-logo img { width: 100%; height: 100%; object-fit: cover; }
.bz-food-card-logo::after { content: ""; position: absolute; inset: 0; background: linear-gradient(to top, rgba(0,0,0,.42), rgba(0,0,0,0) 55%); }
/* Emoji fallback ONLY — must exclude .bz-food-status, which is also a <span> here.
   A bare `.bz-food-card-logo span` clobbered the status pill's font-size (→ 3rem),
   ballooning it into a giant badge over the logo. Scope tightly. See CLAUDE.md §9. */
.bz-food-card-logo > span:not(.bz-food-status) { font-size: 3rem; filter: drop-shadow(0 2px 6px rgba(0,0,0,.3)); }
/* Hub open/closed badge — a clean floating pill with backdrop, top-inline-start. */
.bz-food-card-logo .bz-food-status { position: absolute; top: 10px; inset-inline-start: 10px; z-index: 1; box-shadow: 0 4px 12px rgba(0,0,0,.28); }
.bz-food-status { display: inline-flex; align-items: center; gap: 4px; font-size: .66rem; font-weight: 800; padding: 4px 10px; border-radius: 999px; text-transform: uppercase; letter-spacing: .04em; }
.bz-food-status.open { background: #16a34a; color: #fff; } .bz-food-status.open::before { content: "●"; font-size: .6em; }
.bz-food-status.closed { background: #6b7280; color: #fff; }
.bz-food-card-body { padding: 13px 15px 15px; display: flex; flex-direction: column; gap: 3px; }
.bz-food-card-body h3 { margin: 0; font-size: 1.05rem; font-weight: 700; letter-spacing: -.01em; }
.bz-food-cuisine { margin: 0; font-size: .82rem; color: var(--be-text-muted, var(--z-muted)); }
.bz-food-rating { margin: 2px 0 0; font-size: .84rem; display: flex; align-items: center; gap: 4px; }
.bz-food-rating b { font-weight: 800; }
.bz-star { color: #f5a623; font-size: .95em; line-height: 1; }
.bz-food-rcount { color: var(--be-text-muted, var(--z-muted)); font-size: .78rem; }
.bz-food-rating-none { color: var(--be-text-muted, var(--z-muted)); font-weight: 600; font-size: .76rem; }
.bz-food-card-meta { display: flex; flex-wrap: wrap; gap: 6px; font-size: .74rem; color: var(--be-text-muted, var(--z-muted)); margin-top: 8px; }
.bz-food-card-meta span { background: var(--be-surface-2, var(--food-tint)); padding: 3px 9px; border-radius: 999px; }
.bz-food-empty { text-align: center; padding: 56px 16px; }
.bz-food-empty-ic { font-size: 3rem; }
.bz-food-back { margin-top: 20px; }

/* Storefront — premium restaurant header */
/* Logical page order regardless of DOM order: header → order confirmation (when
   shown) → menu → ratings/reviews last (you rate after eating). Flex-order keeps
   the markup stable while fixing the IA. Modals are position:fixed → unaffected. */
.bz-food-store { padding: 20px 0 48px; display: flex; flex-direction: column; }
.bz-food-store > .bz-food-vhead { order: 1; }
.bz-food-store > .bz-food-summary { order: 1; }
.bz-food-store > .bz-food-claim-banner { order: 1; }
.bz-food-store > #bz-food-done { order: 2; }
.bz-food-store > .bz-food-hours { order: 3; }
.bz-food-store > .bz-food-menuphotos { order: 4; }
.bz-food-store > .bz-food-layout { order: 5; }
.bz-food-store > #bz-food-cartbar { order: 6; }
.bz-food-store > .bz-food-reviews { order: 7; }
.bz-food-store > .bz-food-contact-end { order: 8; }

/* Small-print marketplace T&C shown at every order touchpoint (legal safety). */
.bz-food-legal { margin: 14px auto 0; max-width: 60ch; font-size: .72rem; line-height: 1.5; color: var(--be-text-muted, var(--z-muted)); text-align: left; }
.bz-food-legal strong { color: var(--be-text-soft, inherit); }
[dir="rtl"] .bz-food-legal { text-align: right; }

/* "Claim your kitchen" banner (shown on import-owned listings). */
.bz-food-claim-banner { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 12px; margin: 0 0 18px;
  padding: 12px 16px; border-radius: 14px; background: var(--be-surface-2, var(--food-tint)); border: 1px dashed var(--food-warm); }
.bz-food-claim-banner span { font-weight: 700; font-size: .95rem; }
.bz-food-claim-banner em { display: block; font-style: normal; font-weight: 500; font-size: .84rem; color: var(--be-text-muted, var(--z-muted)); margin-top: 2px; }
.bz-food-claim-btn { flex: none; cursor: pointer; font: inherit; font-weight: 800; font-size: .9rem; color: #fff; background: var(--food); border: 0;
  padding: 10px 18px; border-radius: 999px; box-shadow: 0 8px 20px -10px rgba(217,98,42,.8); }
.bz-food-claim-btn:hover { background: var(--food-deep); }

/* Opening-hours schedule (Pakistan time). Ordering + the Open/Closed badge derive
   from this in real time; today's row is highlighted. */
.bz-food-hours { margin: 0 0 18px; background: var(--be-surface, #fff); border: 1px solid var(--be-border, var(--z-border)); border-radius: 14px; padding: 14px 16px; }
.bz-food-hours h2 { margin: 0 0 8px; font-size: 1rem; }
.bz-food-hours-tz { font-size: .72rem; font-weight: 600; color: var(--be-text-muted, var(--z-muted)); }
.bz-food-hours-closed { margin: 0 0 10px; font-size: .9rem; font-weight: 600; color: #b91c1c; background: #fef2f2; border: 1px solid #fecaca; border-radius: 10px; padding: 9px 12px; }
html[data-theme="dark"] .bz-food-hours-closed { color: #fca5a5; background: #2a1414; border-color: #4a1f1f; }
.bz-food-hours-list { list-style: none; margin: 0; padding: 0; display: grid; gap: 2px; max-width: 340px; }
.bz-food-hours-list li { display: flex; justify-content: space-between; gap: 16px; padding: 4px 8px; border-radius: 7px; font-size: .9rem; }
.bz-food-hours-list li.is-today { background: var(--be-surface-2, var(--food-tint)); font-weight: 700; }
.bz-food-hours-list li span { color: var(--be-text-soft, var(--z-muted)); }
.bz-food-hours-list li.is-today span { color: var(--food-ink); }
/* Store hero — a premium card. Grid so the badge row + Call/WhatsApp span the
   FULL card width below the logo/name row (mockup layout), at every breakpoint. */
/* Desktop: logo column spans; info/badges/buttons stack in the right column.
   Tablet/phone (≤768) flip badges + buttons to full width (see media query). */
.bz-food-vhead { position: relative; display: grid; column-gap: 20px; row-gap: 12px;
  grid-template-columns: auto minmax(0, 1fr);
  grid-template-areas: "logo info" "logo meta" "logo actions";
  align-items: start; padding: 22px 24px; margin-bottom: 16px;
  border-radius: 24px; overflow: hidden; color: #fff;
  /* End the gradient on a deeper warm (not #e8912f) so white text/chips stay AA-legible. */
  background: linear-gradient(125deg, var(--food-deep) 0%, var(--food) 60%, #c2521a 100%);
  box-shadow: 0 22px 50px -24px rgba(168,56,12,.65); }
.bz-food-vhead.is-closed { filter: saturate(.55) brightness(.82); }
/* Subtle food-doodle pattern for a premium, on-theme feel (decorative, low opacity). */
.bz-food-vhead::before { content: ""; position: absolute; inset: 0; pointer-events: none; opacity: .12; z-index: 0;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='140' height='140' viewBox='0 0 140 140' fill='none' stroke='%23ffffff' stroke-width='2'%3E%3Ccircle cx='30' cy='32' r='14'/%3E%3Cpath d='M24 32h12'/%3E%3Cpath d='M100 18v26M96 18v10a4 4 0 008 0V18'/%3E%3Cpath d='M108 84c0 10-8 18-18 18s-18-8-18-18z'/%3E%3Cpath d='M90 84v-14'/%3E%3Ccircle cx='40' cy='104' r='16'/%3E%3Cpath d='M32 104a8 8 0 0116 0'/%3E%3C/svg%3E");
  background-size: 150px 150px; }
/* Left-anchored scrim keeps the text column dark enough for white copy. */
.bz-food-vhead::after { content: ""; position: absolute; inset: 0; pointer-events: none; z-index: 0;
  background: linear-gradient(90deg, rgba(0,0,0,.24) 0%, rgba(0,0,0,0) 60%); }
.bz-food-vlogo { grid-area: logo; position: relative; z-index: 1; width: 96px; height: 96px; border-radius: 20px; overflow: hidden;
  background: #fff; display: flex; align-items: center; justify-content: center; box-shadow: 0 8px 22px rgba(0,0,0,.28); border: 3px solid rgba(255,255,255,.9); }
.bz-food-vlogo img { width: 100%; height: 100%; object-fit: cover; } .bz-food-vlogo span { font-size: 2.6rem; }
.bz-food-vinfo { grid-area: info; position: relative; z-index: 1; min-width: 0; text-shadow: 0 1px 2px rgba(0,0,0,.28); }
.bz-food-vinfo .bz-food-status { position: static; box-shadow: 0 4px 12px rgba(0,0,0,.2); margin-bottom: 8px; }
.bz-food-vinfo h1 { margin: 0 0 4px; font-size: 1.7rem; line-height: 1.12; letter-spacing: -.02em; overflow-wrap: anywhere; }
/* Scoped to the hero so it beats the muted card rule (.bz-food-cuisine at ~1565)
   — otherwise the card's dark text colour bleeds onto the dark hero (invisible). */
.bz-food-vinfo .bz-food-cuisine { margin: 0; font-size: .92rem; font-weight: 600; color: rgba(255,255,255,.94); }
/* Clamped to 2 lines so the menu shows first; the "More" toggle expands it. */
.bz-food-vdesc { margin: 8px 0 0; font-size: .88rem; opacity: .9; max-width: 60ch; white-space: pre-line;
  display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; position: relative; z-index: 1; }
.bz-food-vdesc.expanded { -webkit-line-clamp: unset; overflow: visible; }
.bz-food-vdesc-more { margin: 4px 0 0; padding: 0; border: 0; background: none; cursor: pointer;
  font-size: .82rem; font-weight: 800; color: #fff; text-decoration: underline; position: relative; z-index: 1; }
.bz-food-vdesc-more[hidden] { display: none; }
/* On phones, the floating "Ask" chat launcher overlaps the bottom "View order"
   bar on the food ordering page — hide it here so ordering is never blocked. */
@media (max-width: 600px) {
  body.bz-food-store-page .bechat-launch { display: none !important; }
}
.bz-food-vrating { margin: 6px 0 0; display: flex; align-items: center; gap: 5px; font-size: .92rem; position: relative; z-index: 1; }
.bz-food-vrating .bz-star { color: #ffd45e; font-size: 1.05em; }
.bz-food-vrating b { font-weight: 800; }
.bz-food-vrating .bz-food-rcount { color: rgba(255,255,255,.82); font-size: .82rem; }
/* Verified seal: on the storefront hero the label goes white to read on the
   orange card; in hub-card titles the seal sits inline beside the name. */
.bz-food-vverified { position: relative; z-index: 1; margin: 2px 0 4px; }
.bz-food-vverified .bz-vlabel { color: #fff; }
/* Unverified chip on the (always-orange) hero: a solid white pill so the amber
   reads in both light and dark themes — the second selector out-specifies the
   dark-theme base rule for .bz-unvbadge. */
.bz-food-vunverified .bz-unvbadge,
html[data-theme="dark"] .bz-food-vunverified .bz-unvbadge {
  background: #fff; color: #b26a00; border-color: rgba(0,0,0,.06); box-shadow: 0 2px 8px rgba(0,0,0,.16); }
/* "Prices are indicative" note above an unverified kitchen's menu. */
.bz-food-indicative { margin: 0 0 14px; padding: 9px 13px; border-radius: 10px; font-size: .86rem;
  color: #8a5a00; background: #fff7e6; border: 1px solid #ffe2a8; }
html[data-theme="dark"] .bz-food-indicative { color: #f0c46a; background: #2a2213; border-color: #4a3a1a; }
.bz-food-card-body h3 .bz-vbadge { vertical-align: -.12em; }

/* Ratings & reviews block (storefront, full width below the menu) */
.bz-food-reviews { margin: 30px 0 0; }
.bz-food-reviews h2 { font-size: 1.15rem; margin: 0 0 14px; }
.bz-food-reviewlist { display: grid; gap: 12px; max-width: 720px; }
.bz-food-review { background: var(--be-surface, #fff); border: 1px solid var(--be-border, var(--z-border)); border-radius: 12px; padding: 12px 15px; }
.bz-food-review-stars { color: #f5a623; letter-spacing: 2px; font-size: .95rem; }
.bz-food-review-text { margin: 5px 0 0; font-size: .9rem; color: var(--be-text, inherit); }
.bz-food-vmeta { grid-area: meta; position: relative; z-index: 1; display: flex; flex-wrap: wrap; gap: 8px; font-size: .8rem; }
.bz-food-vmeta span { display: inline-flex; align-items: center; gap: 5px; background: rgba(255,255,255,.16); backdrop-filter: blur(2px);
  border: 1px solid rgba(255,255,255,.18); padding: 6px 12px; border-radius: 999px; font-weight: 600; text-shadow: none; white-space: nowrap; }
.bz-food-vcontact { grid-area: actions; display: flex; flex-wrap: wrap; gap: 10px; position: relative; z-index: 1; }
.bz-food-call, .bz-food-wa { flex: 0 1 auto; display: inline-flex; align-items: center; justify-content: center; gap: 8px;
  padding: 13px 22px; min-height: 48px; border-radius: 14px;
  font-weight: 800; font-size: .95rem; text-decoration: none; transition: transform .1s, filter .1s; }
.bz-food-call:hover, .bz-food-wa:hover { transform: translateY(-1px); }
.bz-food-call { background: #fff; color: var(--food-ink); box-shadow: 0 6px 16px rgba(0,0,0,.18); }
.bz-food-wa { background: #25d366; color: #043b1c; font-weight: 700; } /* dark-on-green for AA contrast (panel #19) */
/* on the no-menu / nomenu block (light ground) the buttons need their own colors */
.bz-food-nomenu .bz-food-call { background: var(--z-green); color: #fff; }
.bz-food-layout-nomenu { grid-template-columns: 1fr; }
.bz-food-nomenu { text-align: center; padding: 40px 20px; background: var(--be-surface-2, var(--food-tint));
  border: 1px dashed var(--food-warm); border-radius: 18px; }
.bz-food-nomenu-ic { font-size: 3rem; }
.bz-food-nomenu h2 { margin: 8px 0 4px; font-size: 1.3rem; }
.bz-food-nomenu p { margin: 0 auto 16px; max-width: 420px; color: var(--be-text-muted, var(--z-muted)); font-size: .92rem; }
.bz-food-nomenu .bz-food-vcontact { justify-content: center; margin-top: 0; }
/* "Your order" summary bar — full-width tap target below the hero. */
.bz-food-summary { display: flex; align-items: center; gap: 12px; width: 100%; margin: 0 0 18px; padding: 14px 16px;
  background: var(--be-surface, #fff); border: 1px solid var(--be-border, var(--z-border)); border-radius: 16px;
  box-shadow: 0 8px 22px -16px rgba(0,0,0,.35); cursor: pointer; text-align: start; font: inherit; color: inherit;
  transition: border-color .12s, box-shadow .12s, transform .1s; }
.bz-food-summary:hover { border-color: var(--food-warm); box-shadow: 0 12px 26px -14px rgba(168,56,12,.4); }
.bz-food-summary:active { transform: scale(.995); }
.bz-food-summary-ic { flex: none; width: 42px; height: 42px; border-radius: 12px; display: grid; place-items: center; font-size: 1.25rem;
  background: var(--food-tint); }
.bz-food-summary-txt { flex: 1; min-width: 0; display: flex; flex-direction: column; line-height: 1.25; }
.bz-food-summary-txt b { font-size: 1rem; }
.bz-food-summary-meta { font-size: .86rem; color: var(--be-text-muted, var(--z-muted)); font-variant-numeric: tabular-nums; }
.bz-food-summary-cta { flex: none; display: inline-flex; align-items: center; gap: 4px; font-weight: 800; font-size: .9rem;
  color: var(--z-green, #0a7d3f); background: color-mix(in srgb, var(--z-green, #0a7d3f) 12%, transparent);
  padding: 8px 14px; border-radius: 999px; }
html[data-theme="dark"] .bz-food-summary-ic { background: #3a2417; }
/* Desktop shows the cart as a visible sticky panel, so the summary bar (which
   opens the mobile sheet) is redundant there. */
@media (min-width: 1001px) { .bz-food-summary { display: none; } }

/* Cart bottom-sheet (mobile): the desktop sticky panel becomes a slide-up sheet.
   Backdrop + sheet transforms are only activated inside the mobile media query;
   on desktop the backdrop and sheet chrome never render. */
.bz-food-sheet-backdrop { display: none; }
.bz-food-sheet-handle, .bz-food-cart-close { display: none; }
.bz-food-cart-head { display: flex; align-items: center; justify-content: space-between; gap: 10px; }

.bz-food-layout { display: grid; grid-template-columns: minmax(0, 1fr) 340px; gap: 26px; align-items: start; }
.bz-food-sec { margin-bottom: 26px; }
.bz-food-sec h2 { font-size: .82rem; margin: 0 0 12px; text-transform: uppercase; letter-spacing: .08em; font-weight: 800;
  color: var(--food-ink); display: flex; align-items: center; gap: 10px; }
.bz-food-sec h2::after { content: ""; flex: 1; height: 1px; background: var(--be-border, var(--z-border)); }
/* Menu item — appetizing card row */
.bz-food-item { display: flex; gap: 14px; align-items: center; padding: 14px; margin-bottom: 10px; border-radius: 16px;
  border: 1px solid var(--be-border, var(--z-border)); background: var(--be-surface, #fff); transition: box-shadow .12s, border-color .12s;
  scroll-margin-top: 90px; /* clear any sticky header when deep-linked from search */ }
.bz-food-item:hover { box-shadow: 0 10px 26px -14px rgba(0,0,0,.22); border-color: var(--food-warm); }
/* Deep-link flash: briefly ring + tint the dish a customer searched for. */
.bz-food-item.bz-item-flash { animation: bz-item-flash 2.4s ease; }
@keyframes bz-item-flash {
  0%, 12% { box-shadow: 0 0 0 3px var(--food, #e8912f), 0 10px 26px -14px rgba(0,0,0,.22); background: var(--food-tint, #fff6ec); }
  100% { box-shadow: 0 0 0 0 transparent; }
}
@media (prefers-reduced-motion: reduce) { .bz-food-item.bz-item-flash { animation: none; outline: 2px solid var(--food, #e8912f); } }
.bz-food-item-img { width: 92px; height: 92px; border-radius: 14px; overflow: hidden; flex: 0 0 auto; }
.bz-food-item-img img { width: 100%; height: 100%; object-fit: cover; }
.bz-food-item-info { flex: 1; min-width: 0; }
.bz-food-item-info h3 { margin: 0 0 3px; font-size: 1.02rem; font-weight: 700; }
.bz-food-item-info p { margin: 0 0 6px; font-size: .84rem; color: var(--be-text-muted, var(--z-muted)); line-height: 1.4;
  display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.bz-food-item-price { font-weight: 800; font-size: 1rem; color: var(--food-ink); }
.bz-food-add { flex: 0 0 auto; align-self: center; background: var(--food-ink); color: #fff; border: 0; border-radius: 12px;
  padding: 10px 16px; font-weight: 800; cursor: pointer; font-size: .88rem; box-shadow: 0 6px 16px -6px rgba(168,56,12,.6); transition: transform .1s, filter .1s; }
.bz-food-add:hover { transform: translateY(-1px); filter: brightness(1.08); }
.bz-food-add[disabled] { opacity: .45; cursor: not-allowed; box-shadow: none; }

/* Cart — premium order panel */
.bz-food-cart { position: sticky; top: 16px; background: var(--be-surface, #fff); border: 1px solid var(--be-border, var(--z-border));
  border-radius: 20px; padding: 20px; box-shadow: 0 18px 44px -26px rgba(0,0,0,.4); }
.bz-food-cart h2 { margin: 0 0 14px; font-size: 1.15rem; letter-spacing: -.01em; }
.bz-cart-empty { color: var(--be-text-muted, var(--z-muted)); font-size: .88rem; }
.bz-cart-line { display: grid; grid-template-columns: 1fr auto auto auto; gap: 8px; align-items: center; padding: 8px 0; border-bottom: 1px dashed var(--be-border, #e3e8e6); }
.bz-cart-lname { font-size: .88rem; } .bz-cart-lname span { display: block; font-size: .74rem; color: var(--be-text-muted, var(--z-muted)); }
.bz-cart-qty { display: flex; align-items: center; gap: 8px; }
.bz-cart-qty button { width: 26px; height: 26px; border-radius: 7px; border: 1px solid var(--be-border, var(--z-border)); background: var(--be-surface-2, #f3f5f4); font-size: 1rem; cursor: pointer; line-height: 1; }
.bz-cart-lt { font-weight: 700; font-size: .86rem; min-width: 62px; text-align: right; }
/* Per-line remove button — the familiar cart trash control. */
.bz-cart-del { display: inline-grid; place-items: center; width: 30px; height: 30px; padding: 0; border: 0; border-radius: 8px;
  background: none; color: var(--be-text-muted, var(--z-muted)); cursor: pointer; transition: color .12s, background .12s; }
.bz-cart-del:hover { color: #c0392b; background: rgba(192,57,43,.12); }
.bz-cart-del:focus-visible { outline: 2px solid #c0392b; outline-offset: 1px; }
.bz-cart-row { display: flex; justify-content: space-between; padding: 4px 0; font-size: .9rem; }
.bz-cart-total { font-size: 1.15rem; font-weight: 800; border-top: 2px solid var(--be-border, var(--z-border)); margin-top: 8px; padding-top: 10px; }
.bz-cart-total b { color: var(--food-ink); }
.bz-cart-min { color: #c0392b; font-size: .8rem; margin: 6px 0 0; }
.bz-cart-feenote { color: var(--be-text-muted, var(--z-muted)); font-size: .76rem; line-height: 1.4; margin: 4px 0 0; }
.bz-checkout { display: flex; flex-direction: column; gap: 9px; margin-top: 12px; }
.bz-checkout input { padding: 10px 12px; border: 1px solid var(--be-border, var(--z-border)); border-radius: 9px; font-family: inherit; font-size: .9rem; background: var(--be-surface, #fff); color: var(--be-text, var(--z-text)); }
.bz-food-fulfil { display: flex; gap: 10px; font-size: .9rem; }
.bz-food-fulfil label { flex: 1; justify-content: center; padding: 9px; border: 1.5px solid var(--be-border, var(--z-border));
  border-radius: 12px; font-weight: 600; transition: border-color .1s, background .1s; }
.bz-food-fulfil label:has(input:checked) { border-color: var(--food-warm); background: var(--food-tint); color: var(--food-ink); }
.bz-food-fulfil input { accent-color: var(--food-ink); }
.bz-food-place { width: 100%; padding: 14px; font-size: 1.02rem; border-radius: 12px; }
.bz-food-fulfil label, .bz-fm-check { display: flex; align-items: center; gap: 6px; cursor: pointer; }
.bz-food-place { width: 100%; } .bz-food-place[disabled] { opacity: .6; cursor: not-allowed; }
.bz-food-signin-note { font-size: .76rem; color: var(--be-text-muted, var(--z-muted)); margin: 0; }
.bz-checkout-msg { font-size: .84rem; margin: 4px 0 0; } .bz-checkout-msg.err { color: #c0392b; }
.bz-food-done { text-align: center; max-width: 460px; margin: 40px auto; padding: 32px; background: var(--be-surface, #fff); border: 1px solid var(--be-border, var(--z-border)); border-radius: 16px; }
.bz-food-done-ic { font-size: 3rem; } .bz-food-done-no { font-weight: 800; color: #b8410f; }
.bz-food-done-acts { display: flex; gap: 10px; justify-content: center; margin-top: 14px; flex-wrap: wrap; }
/* The order isn't sent until this is tapped, so the confirmation screen is an
   ACTION prompt: a "Last step" chip + a big pulsing WhatsApp button as the hero. */
.bz-food-action { border-color: var(--food-warm); box-shadow: 0 18px 44px -22px rgba(37,211,102,.5); }
.bz-food-step { display: inline-block; margin: 4px 0 2px; font-size: .72rem; font-weight: 800; letter-spacing: .08em; text-transform: uppercase;
  color: #0a7d3f; background: #dcfce7; padding: 4px 12px; border-radius: 999px; }
html[data-theme="dark"] .bz-food-step { color: #6ee7a8; background: #10391f; }
/* WhatsApp hand-off CTA — the guaranteed way to actually send the order. */
.bz-food-wa-send { display: inline-flex; align-items: center; gap: 9px; margin: 18px auto 6px; padding: 17px 30px; border-radius: 999px;
  background: #25d366; color: #043b1c; font-weight: 800; font-size: 1.14rem; text-decoration: none;
  box-shadow: 0 12px 28px -8px rgba(37,211,102,.8); animation: bz-wa-pulse 1.9s ease-in-out infinite; transition: transform .12s ease, box-shadow .12s ease; }
.bz-food-wa-send:hover { transform: translateY(-2px); animation: none; box-shadow: 0 18px 34px -10px rgba(37,211,102,.9); }
@keyframes bz-wa-pulse { 0%,100% { box-shadow: 0 12px 28px -8px rgba(37,211,102,.7); } 50% { box-shadow: 0 12px 34px -6px rgba(37,211,102,1); transform: scale(1.02); } }
@media (prefers-reduced-motion: reduce) { .bz-food-wa-send { animation: none; } }
.bz-food-wa-note { margin: 14px auto 0; max-width: 42ch; font-size: .9rem; color: #8a5a00; background: #fff7e6; border: 1px solid #ffe2a8; border-radius: 10px; padding: 10px 12px; }
html[data-theme="dark"] .bz-food-wa-note { color: #f0c46a; background: #2a2213; border-color: #4a3a1a; }
.bz-food-wa-sent { margin: 10px auto 0; max-width: 42ch; font-size: .9rem; color: #0a7d3f; font-weight: 600; }
html[data-theme="dark"] .bz-food-wa-sent { color: #6ee7a8; }
/* My-orders: relay/WhatsApp education banner + per-order WhatsApp send button. */
.bz-food-orders-note { font-size: .9rem; line-height: 1.5; color: var(--be-text-soft, var(--z-muted)); background: var(--be-surface-2, var(--food-tint));
  border: 1px solid var(--be-border, var(--z-border)); border-radius: 12px; padding: 12px 14px; margin: 0 0 16px; }
.bz-food-wa-mini { display: inline-flex; align-items: center; gap: 5px; background: #25d366; color: #043b1c; font-weight: 700; font-size: .84rem;
  padding: 6px 12px; border-radius: 999px; text-decoration: none; }
.bz-food-wa-mini:hover { filter: brightness(.96); }
/* Inline "rate this order" widget on each My-orders card. */
.bz-food-ordrow { flex-wrap: wrap; }
.bz-food-orate { flex-basis: 100%; display: flex; flex-wrap: wrap; align-items: center; gap: 8px 12px;
  margin-top: 12px; padding-top: 12px; border-top: 1px dashed var(--be-border, var(--z-border)); }
.bz-orate-lbl { font-weight: 700; font-size: .88rem; }
.bz-orate-stars { display: inline-flex; }
.bz-orate-star { background: none; border: 0; cursor: pointer; font-size: 1.5rem; line-height: 1; padding: 0 2px;
  color: var(--be-border, #d1d5db); transition: color .1s ease, transform .1s ease; }
.bz-orate-star:hover { transform: scale(1.12); }
.bz-orate-star.on { color: #f5a623; }
.bz-orate-cmt { flex: 1; min-width: 160px; padding: 8px 11px; border: 1px solid var(--be-border, var(--z-border));
  border-radius: 9px; font: inherit; font-size: .88rem; background: var(--be-surface, #fff); color: inherit; }
.bz-orate-cmt:focus-visible { outline: none; border-color: var(--food-warm); box-shadow: 0 0 0 3px rgba(232,145,47,.2); }
.bz-orate-submit { flex: none; background: var(--food-ink); color: #fff; border: 0; border-radius: 10px; min-height: 40px;
  padding: 0 16px; font-weight: 800; font-size: .86rem; cursor: pointer; }
.bz-orate-submit:hover { filter: brightness(1.08); } .bz-orate-submit[disabled] { opacity: .6; cursor: not-allowed; }
.bz-orate-msg { flex-basis: 100%; font-size: .82rem; color: #c0392b; }
.bz-orate-msg.muted { color: var(--be-text-muted, var(--z-muted)); }
.bz-adactions { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; }

/* Vendor dashboard */
.bz-fm-form, .bz-fm-itemform { display: flex; flex-direction: column; gap: 12px; max-width: 640px; background: var(--be-surface, #fff); border: 1px solid var(--be-border, var(--z-border)); border-radius: 14px; padding: 20px; }
.bz-fm-form label, .bz-fm-itemform label { display: flex; flex-direction: column; gap: 4px; font-size: .86rem; font-weight: 600; }
.bz-fm-form input, .bz-fm-form textarea, .bz-fm-form select,
.bz-fm-itemform input, .bz-fm-itemform select { padding: 10px 12px; border: 1px solid var(--be-border-strong, var(--z-border)); border-radius: 9px; font-family: inherit; font-size: .92rem; font-weight: 400; background: var(--be-surface, #fff); color: var(--be-text, var(--z-text)); transition: border-color .12s, box-shadow .12s; }
.bz-fm-form input:focus, .bz-fm-form textarea:focus, .bz-fm-form select:focus,
.bz-fm-itemform input:focus, .bz-fm-itemform select:focus { outline: 0; border-color: var(--z-green); box-shadow: 0 0 0 3px rgba(16,163,110,.14); }
/* Native selects look unstyled — give them the input chrome + a consistent chevron. */
.bz-fm-form select, .bz-fm-itemform select { appearance: none; -webkit-appearance: none; cursor: pointer; padding-inline-end: 34px;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%23718096' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E");
  background-repeat: no-repeat; background-position: right 12px center; background-size: 12px; }
html[dir="rtl"] .bz-fm-form select, html[dir="rtl"] .bz-fm-itemform select { background-position: left 12px center; }
.bz-fm-fulfil { display: flex; flex-wrap: wrap; gap: 14px; align-items: center; border: 1px solid var(--be-border, var(--z-border)); border-radius: 10px; padding: 12px; }
.bz-fm-fulfil label { flex-direction: row; align-items: center; gap: 6px; }
.bz-fm-fulfil input[type=number] { width: 110px; }
.bz-fm-logo-row { display: flex; align-items: center; gap: 14px; }
.bz-fm-logo-prev { width: 64px; height: 64px; border-radius: 12px; overflow: hidden; background: linear-gradient(135deg,#fff3e9,#ffe4cf); display: flex; align-items: center; justify-content: center; flex: 0 0 auto; font-size: 1.6rem; }
.bz-fm-logo-prev img { width: 100%; height: 100%; object-fit: cover; }
.bz-fm-dashhead { display: flex; justify-content: space-between; align-items: flex-start; gap: 16px; flex-wrap: wrap; margin-bottom: 16px; }
.bz-fm-dashhead h2 { margin: 0 0 6px; }
.bz-fm-dashacts { display: flex; gap: 10px; align-items: center; flex-wrap: wrap; }
.bz-fm-opentoggle { display: flex; align-items: center; gap: 6px; font-weight: 700; font-size: .88rem; }
.bz-fm-tabs { display: flex; gap: 4px; border-bottom: 1px solid var(--be-border, var(--z-border)); margin-bottom: 16px; }
.bz-fm-tab { background: none; border: none; padding: 10px 16px; font-weight: 700; cursor: pointer; color: var(--be-text-muted, var(--z-muted)); border-bottom: 3px solid transparent; }
.bz-fm-tab.is-active { color: #b8410f; border-bottom-color: #b8410f; }
.bz-fm-badge { background: #b8410f; color: #fff; border-radius: 999px; font-size: .7rem; padding: 1px 7px; }
.bz-fm-itemgrid { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.bz-fm-itemgrid .bz-fm-check { grid-column: 1 / -1; flex-direction: row; align-items: center; justify-content: flex-start; gap: 8px; }
.bz-fm-itemgrid .bz-fm-check input { width: auto; }
.bz-fm-menulist { margin-top: 18px; display: flex; flex-direction: column; gap: 8px; }
.bz-fm-menurow { display: flex; align-items: center; gap: 12px; background: var(--be-surface, #fff); border: 1px solid var(--be-border, var(--z-border)); border-radius: 11px; padding: 10px 12px; }
.bz-fm-menurow.is-off { opacity: .6; }
.bz-fm-menuimg { width: 48px; height: 48px; border-radius: 8px; overflow: hidden; background: var(--be-surface-2, #f3f5f4); display: flex; align-items: center; justify-content: center; flex: 0 0 auto; }
.bz-fm-menuimg img { width: 100%; height: 100%; object-fit: cover; }
.bz-fm-menuinfo { flex: 1; font-size: .9rem; } .bz-fm-menuprice { font-weight: 800; color: #b8410f; }
.bz-fm-menuacts { display: flex; gap: 10px; }
.bz-fm-orderbar { margin-bottom: 12px; display: flex; gap: 8px; flex-wrap: wrap; }
.bz-fm-alertbar { background: #b8410f; color: #fff; padding: 12px 16px; border-radius: 10px; margin-bottom: 12px; font-weight: 700; cursor: pointer; }
.bz-fm-order { background: var(--be-surface, #fff); border: 1px solid var(--be-border, var(--z-border)); border-radius: 12px; padding: 12px 14px; margin-bottom: 10px; }
.bz-fm-order.is-new { border-left: 4px solid #b8410f; background: color-mix(in srgb, #b8410f 5%, var(--be-surface, #fff)); }
.bz-fm-ordhead { font-weight: 700; } .bz-fm-orditems { font-size: .9rem; margin: 4px 0; }
.bz-fm-ostatus { font-size: .72rem; font-weight: 700; padding: 2px 8px; border-radius: 999px; margin-inline-start: 6px; white-space: nowrap; }
.bz-os-placed { background: #fde3d3; color: #b8410f; } .bz-os-accepted { background: #e5f0ff; color: #1c5fd6; }
.bz-os-preparing { background: #fff3cd; color: #8a6d1b; } .bz-os-ready { background: #e3f6e8; color: #1b7a3d; }
.bz-os-out_for_delivery { background: #e3f0ff; color: #1c5fd6; } .bz-os-completed { background: #e3f6e8; color: #1b7a3d; }
.bz-os-cancelled { background: #f8d7da; color: #a12622; }
.bz-fm-cd { display: inline-block; margin: 8px 0 2px; font-weight: 700; font-size: .95rem; color: #8a6d1b; }
.bz-fm-cd.is-soon { color: #b8410f; } .bz-fm-cd.is-expired { color: #a12622; }
.bz-fm-ordacts { margin-top: 10px; display: flex; gap: 8px; flex-wrap: wrap; }
.bz-fm-ordacts button { padding: 11px 18px; border-radius: 10px; border: 0; font-weight: 700; cursor: pointer; font-size: .95rem; }
.bz-fm-ordacts button:disabled { opacity: .55; cursor: default; }
.bz-btn-accept { background: #1b7a3d; color: #fff; flex: 2; }
.bz-btn-primary { background: var(--be-primary, #b8410f); color: #fff; flex: 2; }
.bz-btn-danger-ghost { background: transparent; border: 1px solid #a12622 !important; color: #a12622; }

/* Reusable admin image manager (car/goods/directory/food editors). */
.bza-imgs { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 4px; }
.bza-img { position: relative; width: 84px; height: 84px; border-radius: 8px; overflow: hidden; border: 1px solid var(--be-border, #ddd); }
.bza-img.is-cover { outline: 2px solid var(--be-primary, #b8410f); outline-offset: -2px; }
.bza-img img { width: 100%; height: 100%; object-fit: cover; display: block; }
.bza-img-badge { position: absolute; left: 0; right: 0; bottom: 0; background: var(--be-primary, #b8410f); color: #fff; font-size: .6rem; text-align: center; padding: 1px 0; }
.bza-img-setcover { position: absolute; left: 0; right: 0; bottom: 0; background: rgba(0,0,0,.62); color: #fff; border: 0; font-size: .6rem; padding: 2px 0; cursor: pointer; }
.bza-img-rm { position: absolute; top: 2px; right: 2px; width: 18px; height: 18px; line-height: 16px; border-radius: 50%; border: 0; background: rgba(0,0,0,.62); color: #fff; cursor: pointer; font-size: .7rem; padding: 0; }
.bza-img-add { width: 84px; height: 84px; border: 1px dashed var(--be-border, #bbb); border-radius: 8px; display: flex; align-items: center; justify-content: center; font-size: 1.5rem; color: var(--be-muted, #888); cursor: pointer; }
.bza-img-add.is-busy { opacity: .5; pointer-events: none; }

/* Admin: homepage Top-3 picks */
.bza-hp-tabs { display: flex; gap: 6px; margin-bottom: 10px; }
.bza-hp-tab.is-on { background: var(--z-green, #0a7d3f); color: #fff; border-color: transparent; }
.bza-hp-chosen { display: flex; flex-wrap: wrap; gap: 8px; margin: 8px 0 14px; }
.bza-hp-chip { display: inline-flex; align-items: center; gap: 8px; background: var(--z-card); border: 1px solid var(--be-border, var(--z-border)); border-radius: 999px; padding: 6px 12px; font-size: .9rem; }
.bza-hp-chip button { border: 0; background: transparent; cursor: pointer; color: var(--z-muted); font-size: .95rem; }
.bza-hp-search { width: 100%; max-width: 360px; padding: 9px 12px; border: 1px solid var(--be-border, var(--z-border)); border-radius: 10px; margin-bottom: 10px; }
.bza-hp-cands { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; max-height: 460px; overflow: auto; }
@media (max-width: 640px) { .bza-hp-cands { grid-template-columns: 1fr; } }
.bza-hp-row { display: flex; align-items: center; gap: 10px; padding: 8px 11px; border: 1px solid var(--be-border, var(--z-border)); border-radius: 10px; cursor: pointer; }
.bza-hp-row.is-on { border-color: var(--z-green, #0a7d3f); background: rgba(10,125,63,.06); }
.bza-hp-thumb { width: 48px; height: 48px; flex: 0 0 auto; border-radius: 8px; background: #eee center/cover no-repeat; display: flex; align-items: center; justify-content: center; font-size: 1.1rem; color: #9aa0a6; }
.bza-hp-thumb.is-ph { background: #f1efe9; }
.bza-hp-meta { display: flex; flex-direction: column; line-height: 1.25; min-width: 0; }
.bza-hp-meta b { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; }
.bza-hp-meta small { color: var(--z-muted); }
.bza-hp-vbadge { display: inline-flex; align-items: center; gap: 3px; font-size: .68rem; font-weight: 800; color: #0a7d3f; background: rgba(10,125,63,.12); border-radius: 999px; padding: 1px 7px; letter-spacing: .02em; }
.bza-hp-vbadge.sm { padding: 0 4px; }
.bza-hp-chip-th { width: 22px; height: 22px; flex: 0 0 auto; border-radius: 5px; background: #eee center/cover no-repeat; }
.bza-hp-actions { margin-top: 14px; display: flex; align-items: center; gap: 12px; }

/* Listing-detail Save + Share actions (highest-intent page). */
.bz-detail-actions { display: flex; gap: 8px; margin: 4px 0 10px; }
.bz-detail-act { display: inline-flex; align-items: center; gap: 6px; padding: 7px 14px; border-radius: 999px; border: 1px solid var(--be-border, var(--z-border)); background: var(--be-surface, #fff); color: var(--be-text, var(--z-text)); font-weight: 600; font-size: .9rem; cursor: pointer; }
.bz-detail-act:hover { border-color: var(--be-primary, #b8410f); }
.bz-detail-act.on { border-color: #e0245e; color: #e0245e; }
.bz-detail-act .bz-detail-act-ic { font-size: 1.05rem; line-height: 1; }

/* Related rails on the listing detail page (reuse the home .eb-rail scroller). */
.bz-detail-rail { margin: 22px auto 8px; }
.bz-detail-rail-h { font-size: 1.15rem; font-weight: 700; margin: 0 0 12px; }

/* Guest enquiry form on phone-less listings (no sign-in contact). */
.bz-guestlead { display: flex; flex-direction: column; gap: 8px; }
.bz-guestlead-lbl { font-size: .9rem; color: var(--be-muted, #667); margin: 0 0 2px; }
.bz-guestlead input, .bz-guestlead textarea { width: 100%; padding: 10px 12px; border: 1px solid var(--be-border, var(--z-border)); border-radius: 10px; background: var(--be-surface, #fff); color: var(--be-text, var(--z-text)); font: inherit; }
.bz-guestlead .btn-primary { width: 100%; }
.bz-lead-result { font-size: .9rem; font-weight: 600; margin: 4px 0 0; }

/* /notifications inbox. */
.bz-notifs-page { max-width: 720px; padding-top: 18px; padding-bottom: 40px; }
.bz-notifs-h { font-size: 1.4rem; font-weight: 800; margin: 0 0 14px; }
.bz-auth-inline { display: flex; flex-direction: column; align-items: flex-start; gap: 10px; }
.bz-notif-link { display: block; text-decoration: none; color: inherit; }
.bz-notif { border: 1px solid var(--be-border, var(--z-border)); border-radius: 12px; padding: 12px 14px; margin-bottom: 10px; background: var(--be-surface, #fff); }
.bz-notif.is-unread { border-inline-start: 4px solid var(--be-primary, #b8410f); background: color-mix(in srgb, var(--be-primary, #b8410f) 4%, var(--be-surface, #fff)); }
.bz-notif-title { font-weight: 700; }
.bz-notif-body { font-size: .92rem; color: var(--be-muted, #667); margin-top: 2px; }
.bz-notif-time { font-size: .78rem; color: var(--be-muted, #98a); margin-top: 6px; }

/* Unread conversation rows in the chat inbox. */
.bz-conv.is-unread .bz-conv-title { font-weight: 800; }
.bz-conv.is-unread .bz-conv-last { color: var(--be-text, var(--z-text)); font-weight: 600; }
.bz-conv .bz-conv-thumb { position: relative; }
.bz-conv-dot { position: absolute; top: -3px; right: -3px; width: 11px; height: 11px; border-radius: 50%; background: var(--be-primary, #b8410f); border: 2px solid var(--be-surface, #fff); }
.bz-food-vstatus, .bz-fm-vstatus { font-size: .85rem; }

/* Admin food filter chips (light panel context) */
.bzc-chiprow { display: flex; gap: 8px; flex-wrap: wrap; margin-bottom: 14px; }
.bzc-chiprow .bz-chip { background: var(--be-surface-2, #eef1f0); color: var(--be-text, var(--z-text)); border: 1px solid var(--be-border, var(--z-border)); cursor: pointer; }
.bzc-chiprow .bz-chip.on { background: #b8410f; color: #fff; border-color: #b8410f; }

/* ── User-journey view (activity feed + per-user timeline drawer) ── */
.bzc-jfilters { display: flex; gap: 8px; flex-wrap: wrap; align-items: center; margin: 4px 0 14px; }
.bzc-chip { background: var(--be-surface-2, #eef1f0); color: var(--be-text, var(--z-text)); border: 1px solid var(--be-border, var(--z-border)); border-radius: 999px; padding: 6px 12px; font-size: 13px; font-weight: 600; cursor: pointer; }
.bzc-chip.on { background: var(--be-primary, #0d6b4d); color: #fff; border-color: var(--be-primary, #0d6b4d); }
.bzc-jsep { flex: 1 1 auto; }
.bzc-jsum { background: var(--be-surface-2, #f5f7f6); border: 1px solid var(--be-border, var(--z-border)); border-radius: 12px; padding: 14px 16px; margin-bottom: 16px; }
.bzc-jsum-top { font-size: 14px; margin-bottom: 8px; }
.bzc-jstats { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 6px; }
.bzc-jstat { background: var(--be-card, #fff); border: 1px solid var(--be-border, var(--z-border)); border-radius: 999px; padding: 4px 10px; font-size: 13px; font-weight: 600; }
.bzc-jblk { margin-top: 10px; display: flex; flex-wrap: wrap; gap: 6px; align-items: center; }
.bzc-jtarget { font-size: 13px; }

/* Journey aggregate dashboard: stat tiles + Top-5 bar cards */
.bzc-stats { display: grid; grid-template-columns: repeat(4, 1fr); gap: 12px; margin: 4px 0 16px; }
.bzc-stat { background: var(--be-card, #fff); border: 1px solid var(--be-border, var(--z-border)); border-radius: 12px; padding: 14px 16px; }
.bzc-stat-v { font-size: 26px; font-weight: 800; line-height: 1.1; color: var(--be-primary, #0d6b4d); font-family: var(--be-font-display, inherit); }
.bzc-stat-l { font-size: 12px; font-weight: 600; text-transform: uppercase; letter-spacing: .04em; color: var(--be-text-muted, #5c5c5c); margin-top: 4px; }
.bzc-topgrid { display: grid; grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); gap: 14px; margin-bottom: 20px; }
.bzc-topcard { background: var(--be-card, #fff); border: 1px solid var(--be-border, var(--z-border)); border-radius: 12px; padding: 14px 16px; }
.bzc-topcard .bzc-seclbl { margin-bottom: 10px; }
.bzc-barrow { display: grid; grid-template-columns: minmax(0, 1fr) 84px auto; align-items: center; gap: 10px; margin-bottom: 9px; }
.bzc-barlabel { font-size: 13px; font-weight: 600; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.bzc-barlabel .bz-muted { font-weight: 400; }
.bzc-bartrack { height: 8px; border-radius: 999px; background: var(--be-surface-2, #eef1f0); overflow: hidden; }
.bzc-barfill { display: block; height: 100%; border-radius: 999px; background: linear-gradient(90deg, var(--be-primary, #0d6b4d), var(--be-primary-strong, #0f7d5a)); }
.bzc-barval { font-size: 13px; font-weight: 700; text-align: right; color: var(--be-text, var(--z-text)); }
.bzc-barempty { margin: 4px 0 0; }
@media (max-width: 720px) { .bzc-stats { grid-template-columns: repeat(2, 1fr); } }

/* Journey time-window bar (segmented) + custom date pickers */
.bzc-rangebar { display: flex; flex-wrap: wrap; align-items: center; gap: 12px; margin: 2px 0 16px; }
.bzc-seggroup { display: inline-flex; background: var(--be-surface-2, #eef1f0); border: 1px solid var(--be-border, var(--z-border)); border-radius: 10px; padding: 3px; gap: 2px; }
.bzc-seg { border: 0; background: transparent; padding: 7px 14px; border-radius: 8px; font-weight: 600; font-size: 13px; cursor: pointer; color: var(--be-text-muted, #5c5c5c); }
.bzc-seg.on { background: var(--be-card, #fff); color: var(--be-primary, #0d6b4d); box-shadow: var(--be-shadow-xs, 0 1px 2px rgba(0,0,0,.08)); }
.bzc-daterow { display: inline-flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.bzc-date { padding: 8px 10px; border: 1px solid var(--be-border, var(--z-border)); border-radius: 8px; background: var(--be-card, #fff); color: var(--be-text, var(--z-text)); font: inherit; }
.bzc-dateapply { padding: 8px 14px; }
.bzc-rangenote { font-size: 12px; font-weight: 600; }

/* Journey feed controls: app/sort selects + search */
.bzc-jselect, .bzc-jsearch { padding: 7px 10px; border: 1px solid var(--be-border, var(--z-border)); border-radius: 8px; background: var(--be-card, #fff); color: var(--be-text, var(--z-text)); font: inherit; font-size: 13px; }
.bzc-jsearch { min-width: 200px; }

/* Journey pagination */
.bzc-pager { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 10px; margin-top: 12px; font-size: 13px; }
.bzc-pagerbtns { display: inline-flex; align-items: center; gap: 8px; }
.bzc-pagebtn { padding: 7px 12px; border: 1px solid var(--be-border, var(--z-border)); border-radius: 8px; background: var(--be-card, #fff); color: var(--be-text, var(--z-text)); font-weight: 600; cursor: pointer; }
.bzc-pagebtn:disabled { opacity: .45; cursor: default; }
.bzc-pageat { font-weight: 600; color: var(--be-text-muted, #5c5c5c); }

/* Sidebar cross-console link (Properties Portal) */
.bzc-navlink { text-decoration: none; }
.bzc-navext { margin-left: auto; opacity: .6; font-size: 12px; }

/* Notification bell (pending actions) + dropdown */
.bzc-bellwrap { position: relative; }
.bzc-bell { position: relative; border: 1px solid var(--be-border, var(--z-border)); background: var(--be-card, #fff); border-radius: 10px; width: 40px; height: 40px; font-size: 18px; cursor: pointer; line-height: 1; }
.bzc-bell.open, .bzc-bell.has { border-color: var(--be-primary, #0d6b4d); }
.bzc-bell-ct { position: absolute; top: -6px; right: -6px; min-width: 18px; height: 18px; padding: 0 5px; border-radius: 999px; background: #d64545; color: #fff; font-size: 11px; font-weight: 800; line-height: 18px; text-align: center; box-shadow: 0 0 0 2px var(--be-card, #fff); }
.bzc-notif { position: absolute; top: calc(100% + 8px); right: 0; width: 320px; max-width: 88vw; max-height: 70vh; overflow-y: auto; background: var(--be-card, #fff); border: 1px solid var(--be-border, var(--z-border)); border-radius: 12px; box-shadow: var(--be-shadow-hover, 0 8px 24px rgba(0,0,0,.14)); z-index: 60; padding: 6px; }
.bzc-notifhead { display: flex; align-items: center; gap: 8px; font-weight: 700; font-size: 13px; padding: 8px 10px 6px; color: var(--be-text-muted, #5c5c5c); text-transform: uppercase; letter-spacing: .04em; }
.bzc-notifhct { background: #d64545; color: #fff; border-radius: 999px; padding: 1px 8px; font-size: 12px; }
.bzc-notifrow { display: flex; align-items: center; gap: 10px; width: 100%; text-align: left; border: 0; background: transparent; padding: 10px; border-radius: 9px; cursor: pointer; color: var(--be-text, var(--z-text)); font: inherit; }
.bzc-notifrow:hover { background: var(--be-surface-2, #eef1f0); }
.bzc-notifrow .ic { font-size: 17px; }
.bzc-notiflabel { flex: 1 1 auto; font-weight: 600; font-size: 14px; }
.bzc-notifct { background: var(--be-primary, #0d6b4d); color: #fff; border-radius: 999px; min-width: 22px; padding: 2px 8px; text-align: center; font-weight: 800; font-size: 12px; }
.bzc-notifclear { padding: 18px 12px; text-align: center; color: var(--be-text-muted, #5c5c5c); font-size: 14px; }

/* ── Mobile bottom navigation (phones only) ─────────────────────────────────
   Primary quick-nav fixed at the bottom on phones; hidden where the full top nav
   shows. Lifts the floating chat button + food cart bar above it, and reserves
   body space so nothing hides behind it (incl. iOS safe-area). */
.bz-botnav { display: none; }
@media (max-width: 768px) {
  .bz-botnav { display: flex; position: fixed; left: 0; right: 0; bottom: 0; z-index: 60;
    background: var(--be-surface, #fff); border-top: 1px solid var(--be-border, var(--z-border));
    box-shadow: 0 -6px 20px -14px rgba(0, 0, 0, .4); padding-bottom: env(safe-area-inset-bottom); }
  .bz-botnav a { flex: 1; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 2px;
    min-height: 52px; padding: 7px 2px 6px; font-size: .64rem; font-weight: 700; letter-spacing: .01em;
    text-decoration: none; color: var(--be-text-muted, var(--z-muted)); }
  .bz-botnav a.on { color: var(--z-green, #0a7d3f); }
  .bz-botnav-ic { font-size: 1.2rem; line-height: 1; }
  /* Centre "Post" as a raised FAB (approved rebrand direction). */
  .bz-botnav a.bz-botnav-fab { color: var(--z-green, #0a7d3f); }
  .bz-botnav a.bz-botnav-fab .bz-botnav-ic { width: 50px; height: 50px; margin-top: -20px; border-radius: 50%;
    background: var(--z-green, #0a7d3f); color: #fff; display: grid; place-items: center; font-size: 1.9rem; font-weight: 400;
    box-shadow: 0 6px 16px rgba(10, 125, 63, .38); }
  body { padding-bottom: calc(54px + env(safe-area-inset-bottom)); }
  /* Keep the floating chat button + food order bar above the bottom nav. */
  .bechat-launch { bottom: calc(66px + env(safe-area-inset-bottom)) !important; }
  .bz-food-cartbar { bottom: calc(66px + env(safe-area-inset-bottom)) !important; }
}

.bz-food-vinfo { min-width: 0; } /* let a long vendor name wrap, not overflow */
/* Floating order bar + bottom-sheet cart are activated below the two-column breakpoint. */
.bz-food-cartbar { display: none; }

/* ≤1000px: single column; the cart panel becomes a slide-up bottom-sheet so the
   menu keeps full width instead of being squeezed into a narrow sidebar. */
@media (max-width: 1000px) {
  .bz-food-layout { grid-template-columns: 1fr; }
  .bz-food-store { padding-bottom: 88px; }   /* clear the floating order bar */
  /* Dimming backdrop — fully class-driven (no JS timers) so it can't get stuck. */
  .bz-food-sheet-backdrop { display: block; position: fixed; inset: 0; z-index: 60; background: rgba(0, 0, 0, .5);
    opacity: 0; pointer-events: none; transition: opacity .22s ease; }
  .bz-food-store.bz-sheet-open .bz-food-sheet-backdrop { opacity: 1; pointer-events: auto; }
  .bz-food-cart { position: fixed; left: 0; right: 0; bottom: 0; top: auto; z-index: 61; margin: 0;
    max-height: 85vh; overflow-y: auto; border-radius: 22px 22px 0 0;
    transform: translateY(101%); transition: transform .28s cubic-bezier(.4, 0, .2, 1); pointer-events: none;
    padding-bottom: calc(20px + env(safe-area-inset-bottom)); box-shadow: 0 -18px 44px -18px rgba(0, 0, 0, .55); }
  .bz-food-store.bz-sheet-open .bz-food-cart { transform: translateY(0); pointer-events: auto; }
  .bz-food-sheet-handle { display: block; width: 42px; height: 4px; padding: 0; border: 0; border-radius: 999px;
    background: var(--be-border, #d1d5db); margin: 0 auto 12px; }
  .bz-food-cart-close { display: inline-grid; place-items: center; width: 36px; height: 36px; border-radius: 999px;
    border: 1px solid var(--be-border, var(--z-border)); background: var(--be-surface-2, #f3f5f4); color: inherit; font-size: 1rem; cursor: pointer; }
  .bz-food-cartbar { display: flex; position: fixed; left: 12px; right: 12px; bottom: calc(12px + env(safe-area-inset-bottom)); z-index: 55;
    align-items: center; gap: 12px; background: var(--food-ink); color: #fff; border: 0; border-radius: 14px;
    padding: 14px 18px; font-weight: 800; font-size: .98rem; cursor: pointer; box-shadow: 0 14px 34px -10px rgba(0, 0, 0, .55); }
  .bz-food-cartbar[hidden] { display: none; }
  .bz-cartbar-count { background: rgba(255, 255, 255, .24); border-radius: 999px; padding: 2px 11px; font-variant-numeric: tabular-nums; }
  .bz-cartbar-lbl { flex: 1; text-align: start; }
  .bz-cartbar-total { font-variant-numeric: tabular-nums; }
}
@media (prefers-reduced-motion: reduce) { .bz-food-cart { transition: none; } }

/* ≤768px (tablet portrait → phone): badges + buttons go full width beneath the
   logo/name row (mockup layout), and the buttons split equal widths. */
@media (max-width: 768px) {
  .bz-food-vhead { padding: 16px; grid-template-columns: auto minmax(0, 1fr) auto;
    grid-template-areas: "logo info actions" "meta meta meta"; }
  .bz-food-vlogo { width: 76px; height: 76px; }
  .bz-food-vinfo h1 { font-size: 1.5rem; }
  .bz-food-call, .bz-food-wa { flex: 1 1 0; }
}

/* ≤640px: compact hero + Apple-44 touch targets. The hero grid already stacks the
   badge row + buttons full-width; here we just size down for phones. */
@media (max-width: 640px) {
  .bz-food-add { min-height: 44px; }
  .bz-dir-call { min-height: 44px; display: inline-flex; align-items: center; }
  .bz-food-vhead { padding: 16px; column-gap: 14px; row-gap: 12px; }
  .bz-food-vlogo { width: 64px; height: 64px; border-radius: 16px; }
  .bz-food-vlogo span { font-size: 1.8rem; }
  .bz-food-vinfo h1 { font-size: 1.35rem; }
  .bz-food-vinfo .bz-food-status { margin-bottom: 6px; }
  .bz-food-vdesc { font-size: .84rem; -webkit-line-clamp: 2; }
  .bz-food-vrating { font-size: .84rem; }
  .bz-food-vmeta { font-size: .74rem; gap: 6px; }
  .bz-food-vmeta span { padding: 5px 10px; }
  .bz-food-call, .bz-food-wa { flex: 1 1 0; min-height: 46px; font-size: .9rem; padding: 12px; white-space: nowrap; }
  /* On the menu page (compact variant) the hero stays small so food shows first:
     Call/WhatsApp become icon-only circles stacked in the top-right corner (the
     "actions" grid column), not a full row below. The no-menu fallback keeps its
     full-width labelled CTAs (that's the only way to order there). */
  .bz-food-vcontact--compact { flex-direction: column; flex-wrap: nowrap; gap: 8px;
    align-items: flex-end; align-self: start; }
  .bz-food-vcontact--compact .bz-food-btn-label { display: none; }
  .bz-food-vcontact--compact .bz-food-call,
  .bz-food-vcontact--compact .bz-food-wa { flex: 0 0 auto; width: 44px; min-width: 44px; height: 44px;
    min-height: 44px; padding: 0; border-radius: 50%; font-size: 1.1rem; gap: 0; }
  /* Trim vertical bulk so the card stays ≤~40% of the screen. */
  .bz-food-vhead { row-gap: 8px; }
  .bz-food-vlogo { width: 60px; height: 60px; }
  /* Ordering comes first on phones: push the hours table AND the owner-only
     "claim this kitchen" banner below the menu. Both stay visible after the items. */
  .bz-food-store > .bz-food-hours { order: 6; }
  .bz-food-store > .bz-food-claim-banner { order: 6; }
  .bz-food-claim-banner { flex-direction: column; align-items: stretch; text-align: center;
    padding: 12px 14px; gap: 8px; margin-bottom: 14px; }
  .bz-food-claim-banner span { font-size: .9rem; }
  .bz-food-claim-banner em { font-size: .8rem; margin-top: 0; }
  .bz-food-claim-btn { width: 100%; min-height: 44px; }
  .bz-food-hours-list { max-width: none; }
}
@media (max-width: 540px) { .bz-fm-itemgrid { grid-template-columns: 1fr; } }

/* Dark mode: warm tints need to sit on dark surfaces. */
:root[data-theme="dark"] .bz-food-card-logo,
:root[data-theme="dark"] .bz-food-vlogo,
:root[data-theme="dark"] .bz-fm-logo-prev { background: linear-gradient(135deg,#3a2417,#2a1a10); }
:root[data-theme="dark"] .bz-food-add { background: #3a2417; color: #f0a565; border-color: #7a4a1e; }
:root[data-theme="dark"] .bz-food-item-price, :root[data-theme="dark"] .bz-food-done-no,
:root[data-theme="dark"] .bz-fm-menuprice, :root[data-theme="dark"] .bz-fm-tab.is-active { color: #f0a565; }

/* ══════════════════════ Home redesign (v2) ══════════════════════ */

/* CTA banner with trust badges */
.bz-cta-main { display: flex; align-items: center; gap: 16px; }
.bz-cta-ic { font-size: 2.3rem; flex: 0 0 auto; line-height: 1; }
.bz-cta-side { display: flex; flex-direction: column; align-items: flex-end; gap: 10px; }
.bz-cta-btn { background: #fff; color: var(--z-green); font-weight: 800; white-space: nowrap; }
.bz-cta-badges { display: flex; flex-wrap: wrap; gap: 8px 16px; font-size: .82rem; color: rgba(255,255,255,.9); }
.bz-cta-badges span { white-space: nowrap; }
@media (max-width: 680px) {
  .bz-home-cta { flex-direction: column; align-items: stretch; text-align: left; }
  .bz-cta-side { align-items: stretch; }
  .bz-cta-btn { text-align: center; }
  .bz-cta-badges { justify-content: flex-start; }
}

/* Fresh in Services — wide horizontal cards (logo left, details right) */
.bz-service-row { display: grid; grid-template-columns: repeat(2, 1fr); gap: 14px; overflow: visible; padding: 0; }
.bz-service-row .bz-card { flex: 1 1 auto; flex-direction: row; align-items: stretch; }
.bz-service-row .bz-card-media { aspect-ratio: auto; width: 130px; flex: 0 0 130px; height: auto; background: #fff; display: flex; align-items: center; justify-content: center; }
.bz-service-row .bz-card-media img { object-fit: contain; padding: 12px; }
.bz-service-row .bz-card-body { flex: 1; justify-content: center; }
html[data-theme="dark"] .bz-service-row .bz-card-media { background: #101a16; }
@media (max-width: 640px) { .bz-service-row { grid-template-columns: 1fr; } }

/* Home Services — single horizontal scroll row of pill tiles */
.bz-hs-row { display: flex; gap: 10px; overflow-x: auto; padding: 2px 2px 12px; scroll-snap-type: x proximity; }
.bz-hs-row .bz-home-tile { flex: 0 0 auto; min-width: 188px; flex-direction: row; align-items: center; gap: 10px; scroll-snap-align: start; }
.bz-hs-row .bz-home-tile-ic { font-size: 1.5rem; flex: 0 0 auto; }
.bz-hs-row .bz-home-tile-txt { display: flex; flex-direction: column; min-width: 0; }
.bz-hs-row::-webkit-scrollbar { height: 7px; }
.bz-hs-row::-webkit-scrollbar-thumb { background: var(--be-border-strong, var(--z-border)); border-radius: 99px; }

/* ── Full footer ── */
.site-footer { background: #0a3d2b; color: rgba(255,255,255,.82); margin-top: 44px; }
.footer-grid { display: grid; grid-template-columns: 1.7fr 1fr 1fr 1fr 1.5fr; gap: 30px; padding: 46px 16px 34px; }
.footer-col { min-width: 0; }
.footer-brandcol { max-width: 330px; }
.footer-brand { display: inline-flex; align-items: center; gap: 10px; font-size: 1.15rem; font-weight: 800; color: #fff; text-decoration: none; margin-bottom: 12px; }
.footer-brand img { display: block; }
.footer-muted { font-size: .82rem; line-height: 1.65; color: rgba(255,255,255,.6); margin: 0 0 14px; }
.footer-muted a { color: rgba(255,255,255,.82); }
.footer-social { display: flex; flex-wrap: wrap; gap: 10px; }
.footer-social a { width: 36px; height: 36px; border-radius: 10px; display: grid; place-items: center; background: rgba(255,255,255,.10); color: #fff; transition: background .15s, transform .15s; }
.footer-social a:hover { background: #1f9d63; transform: translateY(-1px); }
.footer-social a svg { width: 20px; height: 20px; display: block; }
.footer-col h3 { font-size: .78rem; text-transform: uppercase; letter-spacing: .06em; color: rgba(255,255,255,.5); margin: 0 0 14px; font-weight: 700; }
.footer-col nav, .footer-col > a { }
.footer-col a[href] { display: block; color: rgba(255,255,255,.82); text-decoration: none; font-size: .9rem; padding: 5px 0; }
.footer-col a[href]:hover { color: #fff; }
.footer-brandcol .footer-muted a { display: inline; padding: 0; }
.footer-newscol { max-width: 290px; }
.footer-news { display: flex; margin-top: 12px; background: rgba(255,255,255,.08); border: 1px solid rgba(255,255,255,.14); border-radius: 10px; overflow: hidden; }
.footer-news input { flex: 1; min-width: 0; background: transparent; border: 0; outline: 0; color: #fff; padding: 11px 14px; font-family: inherit; font-size: .88rem; }
.footer-news input::placeholder { color: rgba(255,255,255,.5); }
.footer-news button { background: #1f9d63; color: #fff; border: 0; padding: 0 18px; font-size: 1.1rem; cursor: pointer; }
.footer-news button:hover { background: #23b371; }
.footer-bottom { border-top: 1px solid rgba(255,255,255,.1); padding: 16px 0; text-align: center; font-size: .82rem; color: rgba(255,255,255,.55); }
@media (max-width: 900px) { .footer-grid { grid-template-columns: 1fr 1fr; } .footer-brandcol, .footer-newscol { grid-column: 1 / -1; max-width: none; } }
@media (max-width: 520px) { .footer-grid { grid-template-columns: 1fr; } }

/* ── Favourites (Saved ads) ── */
.bz-fav-btn { position: absolute; top: 8px; right: 8px; z-index: 3; width: 32px; height: 32px; border: 0; border-radius: 50%;
  background: rgba(255,255,255,.92); color: #5b6b64; display: flex; align-items: center; justify-content: center;
  cursor: pointer; box-shadow: 0 2px 8px rgba(0,0,0,.18); transition: transform .1s, color .12s; padding: 0; }
.bz-fav-btn:hover { transform: scale(1.1); }
.bz-fav-btn svg { width: 18px; height: 18px; fill: none; stroke: currentColor; stroke-width: 2; }
.bz-fav-btn.on { color: #e0245e; }
.bz-fav-btn.on svg { fill: #e0245e; stroke: #e0245e; }
html[dir="rtl"] .bz-fav-btn { right: auto; left: 8px; }
.bz-nav-badge { display: inline-flex; min-width: 17px; height: 17px; padding: 0 5px; border-radius: 999px;
  background: #e0245e; color: #fff; font-size: .68rem; font-weight: 700; align-items: center; justify-content: center; vertical-align: middle; }
/* inline-flex beats the UA [hidden] rule, so the "0" badge stayed visible (CLAUDE.md §9). */
.bz-nav-badge[hidden] { display: none; }
.nav-saved { white-space: nowrap; }
.bz-saved-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(200px, 1fr)); gap: 14px; }

/* ── Content / doc page (How it works) ── */
.bz-doc { max-width: 860px; padding: 24px 16px 56px; }
.bz-doc-toc { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 26px; }
.bz-doc-toc a { font-size: .84rem; font-weight: 600; text-decoration: none; padding: 7px 14px; border-radius: 999px;
  background: var(--be-surface-2, #eef1f0); color: var(--be-text, var(--z-text)); border: 1px solid var(--be-border, var(--z-border)); }
.bz-doc-toc a:hover { border-color: var(--z-green); color: var(--z-green); }
.bz-doc-sec { margin: 0 0 32px; scroll-margin-top: 80px; }
.bz-doc-sec h2 { font-size: 1.3rem; margin: 0 0 12px; letter-spacing: -.01em; }
.bz-doc-sec p { line-height: 1.65; color: var(--be-text-soft, var(--z-text)); margin: 0 0 12px; }
.bz-doc-cols { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
.bz-doc-card { background: var(--be-surface, #fff); border: 1px solid var(--be-border, var(--z-border)); border-radius: 14px; padding: 18px 20px; }
.bz-doc-card h3 { margin: 0 0 12px; font-size: 1.02rem; }
.bz-doc-card ol { margin: 0; padding-inline-start: 20px; display: flex; flex-direction: column; gap: 8px; }
.bz-doc-card li, .bz-doc-list li { line-height: 1.5; color: var(--be-text-soft, var(--z-text)); }
.bz-doc-list { margin: 0; padding: 0; list-style: none; display: flex; flex-direction: column; gap: 10px; }
.bz-doc-list li { position: relative; padding-inline-start: 27px; }
.bz-doc-list li::before { content: "✓"; position: absolute; inset-inline-start: 0; top: 1px; width: 18px; height: 18px;
  border-radius: 50%; background: rgba(21,115,71,.13); color: #157347; font-size: .7rem; font-weight: 800;
  display: flex; align-items: center; justify-content: center; }
html[data-theme="dark"] .bz-doc-list li::before { background: rgba(52,211,153,.18); color: #34d399; }
.bz-doc-fine { font-size: .85rem; color: var(--be-text-muted, var(--z-muted)); }
@media (max-width: 620px) { .bz-doc-cols { grid-template-columns: 1fr; } }

/* Seller: bump button + cooldown */
.bz-link.bump { color: #b8410f; font-weight: 700; }
.bz-adbump-wait { font-size: .8rem; color: var(--be-text-muted, var(--z-muted)); }

/* Save this search + saved-search rows */
.bz-results-head { display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: wrap; }
.bz-btn-savesearch { background: var(--be-surface-2, #eef1f0); border: 1px solid var(--be-border, var(--z-border)); color: var(--z-green); font-weight: 700; font-size: .84rem; padding: 7px 14px; border-radius: 999px; cursor: pointer; white-space: nowrap; }
.bz-btn-savesearch:hover { border-color: var(--z-green); }
.bz-btn-savesearch.saved { background: #dcfce7; color: #166534; border-color: #bbf7d0; cursor: default; }
.bz-saved-ss-sec { margin-top: 34px; }
.bz-saved-ss-sec h2 { font-size: 1.15rem; margin: 0 0 12px; }
.bz-ss-row { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 12px 14px; border: 1px solid var(--be-border, var(--z-border)); border-radius: 12px; margin-bottom: 8px; background: var(--be-surface, #fff); }
.bz-ss-info { min-width: 0; }
.bz-ss-acts { display: flex; align-items: center; gap: 12px; flex: 0 0 auto; }
.bz-ss-alert { display: inline-flex; align-items: center; gap: 5px; font-size: .82rem; cursor: pointer; }

/* Richer empty states (save-search cross-sell) */
.bz-empty-acts { display: flex; gap: 10px; justify-content: center; flex-wrap: wrap; }
.bz-empty-acts .btn-primary.saved { background: #dcfce7; color: #166534; cursor: default; }
.bz-empty-alt { margin-top: 16px; }
.bz-empty-alt a { color: var(--z-green); text-decoration: none; font-weight: 600; }

/* Seller trust signals */
.bz-card-trust { margin-top: 6px; font-size: .72rem; font-weight: 600; color: var(--be-text-muted, var(--z-muted));
  display: inline-flex; align-items: center; gap: 5px; background: none; padding: 0; }
/* One "verified" colour across the whole app — the blue seal (matches .bz-vseal),
   not a competing green tick, so the trust signal reads the same everywhere. */
.bz-card-trust::before { content: "✓"; flex: 0 0 auto; width: 15px; height: 15px; border-radius: 50%;
  background: #1d9bf0; color: #fff; font-size: .62rem; font-weight: 800; line-height: 1;
  display: inline-flex; align-items: center; justify-content: center; }
html[data-theme="dark"] .bz-card-trust::before { background: #1d9bf0; color: #fff; }
.bz-seller-verified { color: #1478c9; font-weight: 700; font-size: .85em; }
html[data-theme="dark"] .bz-seller-verified { color: #6fc0f5; }
.bz-seller-note { font-size: .82rem; color: var(--be-text-muted, var(--z-muted)); margin: 8px 0 0; }

/* Professional role badge (Doctor / Lawyer) — distinct from the blue "Verified
   seller" tick so credentialed providers read as professionals, not sellers.
   Green = medical, amber = legal; the ✓ shows only when admin-verified. */
.bz-card-pro { display: inline-flex; align-items: center; gap: 5px; margin: 0 0 7px;
  padding: 3px 9px 3px 8px; border-radius: 999px; font-size: .72rem; font-weight: 700; line-height: 1.5; }
.bz-card-pro .bz-pro-ic { font-size: .82rem; line-height: 1; }
.bz-card-pro .bz-pro-check { display: inline-flex; align-items: center; justify-content: center;
  width: 14px; height: 14px; border-radius: 50%; font-size: .58rem; font-weight: 800; color: #fff; }
.bz-card-pro.is-doc { background: #dff5ec; color: #0b6b4f; }
.bz-card-pro.is-doc .bz-pro-check { background: #0b6b4f; }
.bz-card-pro.is-law { background: #fbeccf; color: #8a5712; }
.bz-card-pro.is-law .bz-pro-check { background: #8a5712; }
/* A hairline left accent on the whole card echoes the profession colour. */
.bz-card.is-pro.is-doc { box-shadow: inset 3px 0 0 0 #10b981; }
.bz-card.is-pro.is-law { box-shadow: inset 3px 0 0 0 #d97706; }
html[data-theme="dark"] .bz-card-pro.is-doc { background: rgba(16,185,129,.16); color: #6fe3ba; }
html[data-theme="dark"] .bz-card-pro.is-doc .bz-pro-check { background: #10b981; color: #04231a; }
html[data-theme="dark"] .bz-card-pro.is-law { background: rgba(217,119,6,.20); color: #f2c078; }
html[data-theme="dark"] .bz-card-pro.is-law .bz-pro-check { background: #f0a93a; color: #3a2708; }
/* RTL: flip the profession accent stripe to the right edge. */
html[dir="rtl"] .bz-card.is-pro.is-doc { box-shadow: inset -3px 0 0 0 #10b981; }
html[dir="rtl"] .bz-card.is-pro.is-law { box-shadow: inset -3px 0 0 0 #d97706; }
/* Self-declared professional details on a service card. Specialty sits under the
   title (profession-tinted); availability is a quieter line below the meta. */
.bz-card-spec { font-size: .82rem; font-weight: 600; color: var(--be-text-soft, #45564f); margin-top: 1px; }
.bz-card-spec.is-doc { color: #0b6b4f; }
.bz-card-spec.is-law { color: #8a5712; }
html[data-theme="dark"] .bz-card-spec { color: var(--be-text-soft, #c4d0cb); }
html[data-theme="dark"] .bz-card-spec.is-doc { color: #6fe3ba; }
html[data-theme="dark"] .bz-card-spec.is-law { color: #f2c078; }
.bz-card-avail { font-size: .76rem; color: var(--be-text-muted, var(--z-muted)); margin-top: 4px; }

/* RTL: keep Featured/Property badge clear of the heart (which flips to left in RTL) */
html[dir="rtl"] .bz-tag-prop, html[dir="rtl"] .bz-badge { left: auto; right: 8px; }

/* ══════════════════════ Cars marketplace ══════════════════════ */
/* Automotive blue — distinct from green Bazaar / warm Food. */
.bz-cars-hero { background: linear-gradient(135deg, #123a5c 0%, #17557f 50%, #1b7fa8 100%); }
.bz-cars-sell { display: inline-block; background: #fff; color: #123a5c; margin-top: 6px; }
.bz-cars-wrap { padding: 22px 0 48px; }

/* ── Cars filter panel ── */
.bz-cars-filters { display: flex; flex-direction: column; gap: 16px;
  background: var(--z-card); border: 1px solid var(--be-border, var(--z-border)); border-radius: 16px;
  padding: 18px 20px; margin-bottom: 20px; box-shadow: 0 8px 24px -18px rgba(0,0,0,.3); }
/* Prominent search with a leading icon. */
.bz-cf-search { position: relative; }
.bz-cf-search svg { position: absolute; inset-inline-start: 15px; top: 50%; transform: translateY(-50%); color: var(--be-text-muted, var(--z-muted)); pointer-events: none; }
.bz-cf-search input { width: 100%; padding: 13px 16px 13px 44px; border: 1px solid var(--be-border-strong, var(--z-border)); border-radius: 11px;
  font-family: inherit; font-size: 1rem; background: var(--be-surface, #fff); color: var(--be-text, var(--z-text)); }
html[dir="rtl"] .bz-cf-search input { padding: 13px 44px 13px 16px; }
/* Labelled field grid. */
.bz-cf-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap: 12px 14px; }
.bz-cf-field { display: flex; flex-direction: column; gap: 6px; min-width: 0; }
.bz-cf-field > span { font-size: .7rem; font-weight: 800; text-transform: uppercase; letter-spacing: .05em; color: var(--be-text-muted, var(--z-muted)); }
.bz-cf-field select, .bz-cf-field input { width: 100%; padding: 10px 12px; border: 1px solid var(--be-border-strong, var(--z-border)); border-radius: 10px;
  font-family: inherit; font-size: .92rem; background: var(--be-surface, #fff); color: var(--be-text, var(--z-text)); min-width: 0; }
.bz-cf-field select { appearance: none; -webkit-appearance: none; cursor: pointer; padding-inline-end: 34px;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%23718096' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E");
  background-repeat: no-repeat; background-position: right 12px center; background-size: 12px; }
html[dir="rtl"] .bz-cf-field select { background-position: left 12px center; }
.bz-cf-search input:focus, .bz-cf-field select:focus, .bz-cf-field input:focus { outline: 0; border-color: var(--z-green); box-shadow: 0 0 0 3px rgba(16,163,110,.14); }
.bz-cf-range { display: flex; align-items: center; gap: 8px; }
.bz-cf-range input { flex: 1; }
.bz-cf-dash { color: var(--be-text-muted, var(--z-muted)); flex: 0 0 auto; }
/* Footer: sort on one side, actions on the other. */
.bz-cf-foot { display: flex; align-items: flex-end; justify-content: space-between; gap: 16px; flex-wrap: wrap;
  border-top: 1px solid var(--be-border, var(--z-border)); padding-top: 16px; }
.bz-cf-sort { min-width: 190px; }
.bz-cf-actions { display: flex; align-items: center; gap: 14px; }
.bz-cf-actions .btn-primary { white-space: nowrap; padding-inline: 26px; }
.bz-cars-clear { color: var(--be-text-muted, var(--z-muted)); text-decoration: none; font-size: .88rem; font-weight: 600; white-space: nowrap; }
.bz-cars-clear:hover { color: var(--z-green); text-decoration: underline; }
.bz-cars-status { text-align: center; color: var(--be-text-muted, var(--z-muted)); font-size: .9rem; padding: 18px 0 46px; min-height: 1.2em; }
.bz-cars-filtoggle { display: none; } /* mobile-only toggle; desktop shows the form */

/* Detail: gallery + info */
.bz-car-detail { display: grid; grid-template-columns: 1.15fr 1fr; gap: 28px; padding: 22px 0 48px; align-items: start; }
.bz-car-main { aspect-ratio: 4 / 3; border-radius: 16px; overflow: hidden; background: var(--be-surface-2, #eef1f0); display: flex; align-items: center; justify-content: center; }
.bz-car-main img { width: 100%; height: 100%; object-fit: cover; }
.bz-car-noimg { font-size: 4rem; }
.bz-car-thumbs { display: flex; gap: 8px; margin-top: 10px; overflow-x: auto; padding-bottom: 4px; }
.bz-car-thumb { width: 74px; height: 56px; border-radius: 8px; overflow: hidden; border: 2px solid transparent; padding: 0; cursor: pointer; flex: 0 0 auto; background: none; }
.bz-car-thumb.on { border-color: #1b7fa8; }
.bz-car-thumb img { width: 100%; height: 100%; object-fit: cover; }
.bz-car-facts { display: grid; grid-template-columns: 1fr 1fr; gap: 2px 22px; }
.bz-detail-desc h3 { margin: 16px 0 6px; font-size: 1rem; }
.bz-detail-desc p { line-height: 1.6; color: var(--be-text-soft, var(--z-text)); }
.bz-detail-seller-meta { font-size: .82rem; color: var(--be-text-muted, var(--z-muted)); margin: 12px 0; }

/* Post form: photo thumbnails */
.bz-carphotos { margin: 4px 0; }
.bz-carphotos-label { font-weight: 600; font-size: .86rem; margin-bottom: 6px; }
.bz-carphotos-grid { display: flex; flex-wrap: wrap; gap: 10px; margin-bottom: 8px; }
.bz-carphoto { position: relative; width: 104px; height: 78px; border-radius: 10px; overflow: hidden; border: 1px solid var(--be-border, var(--z-border)); }
.bz-carphoto img { width: 100%; height: 100%; object-fit: cover; }
.bz-carphoto button { position: absolute; top: 4px; right: 4px; width: 22px; height: 22px; border-radius: 50%; border: 0;
  background: rgba(0,0,0,.62); color: #fff; cursor: pointer; line-height: 20px; font-size: 1rem; padding: 0; }
.bz-carphoto.is-cover { border-color: var(--z-green); }
.bz-carphoto-badge { position: absolute; left: 0; bottom: 0; background: var(--z-green); color: #fff; font-size: .62rem;
  font-weight: 800; text-transform: uppercase; letter-spacing: .04em; padding: 2px 7px; border-top-right-radius: 8px; }
.bz-carphoto-loading { display: flex; align-items: center; justify-content: center; background: var(--be-surface-2, #f1f5f3);
  border-style: dashed; font-size: 1.3rem; }
.bz-carphoto-add { width: 104px; height: 78px; border-radius: 10px; border: 2px dashed var(--be-border-strong, var(--z-border));
  background: var(--be-surface-2, #f7faf8); cursor: pointer; display: flex; flex-direction: column; align-items: center; justify-content: center;
  gap: 2px; color: var(--be-text-soft, var(--z-text)); font-family: inherit; }
.bz-carphoto-add span { font-size: 1.5rem; line-height: 1; color: var(--z-green); }
.bz-carphoto-add small { font-size: .7rem; font-weight: 600; }
.bz-carphoto-add:hover { border-color: var(--z-green); background: var(--be-surface, #fff); }
.bz-photo-count { float: inline-end; font-variant-numeric: tabular-nums; color: var(--be-text-muted, var(--z-muted)); font-weight: 700; font-size: .82rem; }
.bz-visually-hidden { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; }
.bz-carmine-h { margin: 30px 0 12px; }

@media (max-width: 820px) { .bz-car-detail { grid-template-columns: 1fr; } }
@media (max-width: 520px) { .bz-car-facts { grid-template-columns: 1fr; } }

/* Section cross-link category tiles */
.bz-home-cat-cars { background: linear-gradient(140deg, rgba(27,127,168,.12), transparent); border-color: rgba(27,127,168,.3); }
.bz-home-cat-food { background: linear-gradient(140deg, rgba(216,98,42,.12), transparent); border-color: rgba(216,98,42,.3); }

/* ── Hero search autocomplete ── */
.bz-searchbox { position: relative; }
.bz-search-ic { color: #7a8a83; flex: 0 0 auto; margin: 0 2px 0 4px; }
.bz-suggest {
  position: absolute; top: calc(100% + 8px); left: 0; right: 0; z-index: 40;
  background: var(--be-surface, #fff); border: 1px solid var(--be-border, var(--z-border)); border-radius: 14px;
  box-shadow: 0 22px 55px -14px rgba(0,0,0,.45); max-height: 60vh; overflow-y: auto; padding: 4px 0; text-align: start;
}
.bz-suggest-h { font-size: .66rem; text-transform: uppercase; letter-spacing: .07em; font-weight: 700;
  color: var(--be-text-muted, var(--z-muted)); padding: 10px 15px 3px; }
.bz-suggest-row { display: flex; align-items: center; gap: 11px; padding: 9px 15px; text-decoration: none;
  color: var(--be-text, var(--z-text)); font-size: .92rem; }
.bz-suggest-row:hover, .bz-suggest-row.on { background: var(--be-surface-2, #f1f5f3); }
.bz-suggest-ic { width: 20px; text-align: center; flex: 0 0 auto; font-size: 1rem; }
.bz-suggest-lbl { flex: 1; min-width: 0; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.bz-suggest-kind { font-size: .64rem; text-transform: uppercase; letter-spacing: .05em; color: var(--be-text-muted, var(--z-muted)); flex: 0 0 auto; }

/* ══════════════════════ Mobile-first fixes (QA pass) ══════════════════════ */
/* Explicit colour (not `inherit`) — the header ground is white/dark per theme and
   inherit was resolving to white, making the icon invisible on the light header. */
.nav-burger { display: none; background: none; border: 0; color: var(--be-text, var(--z-text)); cursor: pointer; padding: 8px; margin-inline-start: auto; border-radius: 10px; }
.nav-burger:hover { background: var(--be-surface-2, #f1f5f3); }

@media (max-width: 768px) {
  .nav-burger { display: inline-flex; align-items: center; }
  .header-row { position: relative; flex-wrap: nowrap; align-items: center; }
  .header-nav { display: none; position: absolute; top: calc(100% + 6px); inset-inline: 0; z-index: 60;
    flex-direction: column; align-items: stretch; gap: 2px; padding: 8px;
    background: var(--be-surface, #fff); border: 1px solid var(--be-border, var(--z-border));
    border-radius: 14px; box-shadow: 0 20px 55px -14px rgba(0,0,0,.45); max-height: 80vh; overflow-y: auto; }
  .header-nav.open { display: flex; }
  .header-nav .nav-link { width: 100%; padding: 13px 14px; border-radius: 10px; font-size: 1rem; }
  .header-nav .nav-link:hover { background: var(--be-surface-2, #f1f5f3); }
  .be-user { width: 100%; }
  .be-user .nav-acct, .be-user-btn { width: 100%; justify-content: flex-start; padding: 13px 14px; }
  .be-user-menu { width: 100%; }
  .be-lang-toggle, .be-theme-toggle { align-self: flex-start; }
}

/* iOS Safari zooms the page when a focused input is < 16px — force 16px on phones. */
@media (max-width: 640px) {
  .bz-cars-filters input, .bz-cars-filters select,
  .bz-checkout input, .bz-fm-form input, .bz-fm-form textarea, .bz-fm-itemform input,
  .bz-filters input, .bz-filters select, .bz-price-range input,
  .bz-search-field input, input[type="search"], input[type="number"], input[type="text"],
  input[type="email"], input[type="tel"], select, textarea { font-size: 16px; }
}

/* Larger touch targets on phones (Apple 44 / Material 48). */
@media (max-width: 640px) {
  .bz-fav-btn { width: 40px; height: 40px; }
  .bz-fav-btn svg { width: 20px; height: 20px; }
  .bz-cart-qty button { width: 44px; height: 44px; font-size: 1.2rem; } /* Apple 44 min */
  .bz-cart-del { width: 40px; height: 40px; }
  .bz-carphoto button { width: 30px; height: 30px; line-height: 28px; }
  .bz-suggest-row { padding: 12px 15px; }
  .bz-cf-grid { grid-template-columns: 1fr 1fr; }
  .bz-cf-foot { flex-direction: column; align-items: stretch; }
  .bz-cf-actions { justify-content: space-between; }
  .bz-cf-actions .btn-primary { flex: 1; text-align: center; }
  /* Mobile: collapse the filter form behind a toggle button (JS adds .is-open). */
  .bz-cars-filters { display: none; }
  .bz-cars-filters.is-open { display: flex; }
  .bz-cars-filtoggle { display: block; width: 100%; cursor: pointer; font-weight: 700; font-size: .95rem; font-family: inherit;
    padding: 13px 16px; margin-bottom: 12px; text-align: start; border: 1px solid var(--be-border, var(--z-border));
    border-radius: 12px; background: var(--be-surface, #fff); color: var(--be-text, var(--z-text)); }
}

/* RTL: a few physical values → logical. */
html[dir="rtl"] .bz-search-ic { margin: 0 4px 0 2px; }
html[dir="rtl"] .bz-cart-lt { text-align: left; }

/* Photo-quality nudge + brand heading polish */
.bz-photo-hint, .bz-carphotos-hint { font-size: .82rem; color: var(--be-text-muted, var(--z-muted)); margin: 4px 0 8px; line-height: 1.45; background: var(--be-surface-2, #f4f7f5); border-radius: 8px; padding: 8px 11px; }
html[data-theme="dark"] .bz-photo-hint, html[data-theme="dark"] .bz-carphotos-hint { background: rgba(255,255,255,.04); }
.bz-sec-head h2, .bz-home-sec .bz-sec-head h2 { letter-spacing: -.015em; font-weight: 800; }

/* ── Food vendor onboarding card + menu photos ── */
.bz-fm-onboard { background: linear-gradient(135deg, rgba(216,98,42,.08), transparent); border: 1px solid var(--be-border, var(--z-border)); border-radius: 12px; padding: 14px 16px; }
.bz-fm-onboard-lead { font-weight: 700; margin: 0 0 8px; }
.bz-fm-onboard-benefits { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 6px; font-size: .88rem; color: var(--be-text-soft, var(--z-text)); }
.bz-fm-menufiles { background: var(--be-surface-2, #f4f7f5); border: 1px dashed var(--be-border, var(--z-border)); border-radius: 12px; padding: 16px; margin-bottom: 16px; }
.bz-fm-menufiles h3 { margin: 0 0 6px; }
.bz-food-menuphotos { margin: 0 0 22px; }
.bz-food-menuphotos h2 { font-size: 1.1rem; margin: 0 0 10px; }
.bz-food-menuphotos-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(140px, 1fr)); gap: 10px; }
.bz-food-menuphotos-grid a { display: block; border-radius: 12px; overflow: hidden; border: 1px solid var(--be-border, var(--z-border)); }
.bz-food-menuphotos-grid img { width: 100%; height: auto; aspect-ratio: 3 / 4; object-fit: cover; display: block; }

/* ── "What would you like to post?" chooser ── */
.bz-sell-hero { background: linear-gradient(135deg, #0a5c44 0%, #0d6b4d 50%, #127a5c 100%); }
.bz-sell-wrap { padding: 26px 0 52px; }
.bz-sell-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(240px, 1fr)); gap: 16px; }
.bz-sell-card { display: flex; flex-direction: column; gap: 6px; padding: 22px; border-radius: 16px; text-decoration: none;
  background: var(--be-surface, #fff); border: 1px solid var(--be-border, var(--z-border)); border-top: 3px solid var(--a, var(--z-green));
  color: var(--be-text, var(--z-text)); transition: transform .12s, box-shadow .12s, border-color .12s; }
.bz-sell-card:hover { transform: translateY(-3px); box-shadow: 0 16px 40px -14px rgba(0,0,0,.25); border-color: var(--a, var(--z-green)); }
.bz-sell-card:focus-visible { outline: 3px solid var(--a, var(--z-green)); outline-offset: 2px; border-color: var(--a, var(--z-green)); }
.bz-sell-ic { font-size: 2.2rem; line-height: 1; }
.bz-sell-card h3 { margin: 6px 0 0; font-size: 1.15rem; }
.bz-sell-card p { margin: 0; font-size: .88rem; color: var(--be-text-muted, var(--z-muted)); line-height: 1.45; flex: 1; }
/* Text tint uses the darker --at token (AA-legible on white); the accent bar keeps --a. */
.bz-sell-go { margin-top: 8px; font-weight: 700; font-size: .9rem; color: var(--at, var(--a, var(--z-green))); }
.bz-sell-go::after { content: "\2192"; margin-inline-start: 4px; } /* → flips in RTL below */
html[dir="rtl"] .bz-sell-go::after { content: "\2190"; } /* ← */
.bz-sell-help { text-align: center; color: var(--be-text-muted, var(--z-muted)); margin-top: 22px; font-size: .9rem; }
.sell-item { --a: #2563a8; --at: #1d4f87; } .sell-car { --a: #1b7fa8; --at: #145f7e; } .sell-food { --a: #d8622a; --at: #b04e1f; }
.sell-service { --a: #0f7d5a; --at: #0c6447; } .sell-prop { --a: #2f6fb0; --at: #26588e; } .sell-domestic { --a: #7c3aed; --at: #6b2fd0; }
html[data-theme="dark"] .bz-sell-go { color: var(--a, var(--z-green)); } /* on dark ground the bright tint is legible */
/* Signed-out food onboarding: center the value prop above the sign-in button. */
.bz-fm-onboard-benefits--center { align-items: center; text-align: center; }
.bz-fm-signedout .bz-fm-onboard-lead { margin: 4px 0 12px; }
.bz-fm-signin-note { font-size: .82rem; margin: 10px 0 0; }
@media (max-width: 520px) { .bz-sell-grid { grid-template-columns: 1fr; } }

/* ══════════════════════ UX pass — a11y + primary CTA ══════════════════════ */

/* Skip-to-content: first tab stop on every page, visually hidden until focused.
   Targets the #bz-main anchor emitted right after the header. */
.skip-link { position: absolute; inset-inline-start: 8px; top: -60px; z-index: 200;
  background: var(--z-green); color: #fff; padding: 10px 16px; border-radius: 0 0 12px 12px;
  text-decoration: none; font-weight: 600; transition: top .15s ease; }
.skip-link:focus { top: 0; outline: 2px solid #fff; outline-offset: 2px; }

/* A single visible keyboard focus ring for every custom-styled control. Most of
   the app relied on the (often-removed) browser default; these had none. */
a:focus-visible, button:focus-visible, [tabindex]:focus-visible,
input:focus-visible, select:focus-visible, textarea:focus-visible,
.bz-card:focus-visible, .bz-cat:focus-visible, .bz-chip:focus-visible, .bz-tab:focus-visible,
.bz-fchip:focus-visible, .bz-dh-mode:focus-visible, .bz-slot:focus-visible,
.bz-book-date:focus-visible, .bz-ptype button:focus-visible, .bz-thumb:focus-visible,
.bz-modal-x:focus-visible, .bz-starbtn:focus-visible, .bz-typecard:focus-visible,
.bz-fav-btn:focus-visible, .bz-carphoto button:focus-visible {
  outline: 2px solid var(--z-green); outline-offset: 2px;
}
/* The hero search input clears its own outline; ring the whole pill on focus. */
.bz-search:focus-within { outline: 2px solid var(--z-green); outline-offset: 3px; }

/* Required-field marker on wizard labels. */
.bz-req { color: #d64545; margin-inline-start: 3px; font-weight: 700; }
html[data-theme="dark"] .bz-req { color: #f08a8a; }

/* Posting wizard — inline validation, deferred-auth note, in-page success. */
.bz-invalid, .bz-invalid:focus { border-color: #d64545 !important; box-shadow: 0 0 0 2px rgba(214,69,69,.18) !important; }
.bz-errlist { margin: 0; padding-inline-start: 20px; }
.bz-errlist li { margin: 2px 0; }
.bz-post-signin-note { font-size: .84rem; margin: 6px 0 10px; }
.bz-done-step { text-align: center; }
.bz-done-acts { display: flex; gap: 10px; justify-content: center; flex-wrap: wrap; margin-top: 18px; }
.bz-link-locked { color: var(--be-text-muted, var(--z-muted)); cursor: help; }

/* Cars detail — share, zoomable gallery, lightbox */
.bz-detail-titlerow { display: flex; align-items: flex-start; gap: 12px; justify-content: space-between; }
.bz-share-btn { display: inline-flex; align-items: center; gap: 6px; flex: 0 0 auto; cursor: pointer;
  background: var(--be-surface-2, #f1f5f3); color: var(--be-text, var(--z-text)); border: 1px solid var(--be-border, var(--z-border));
  border-radius: 999px; padding: 7px 13px; font: inherit; font-size: .85rem; font-weight: 600; }
.bz-share-btn:hover { background: var(--z-green-light); border-color: var(--z-green); color: var(--z-green-dark); }
button.bz-car-main { position: relative; display: block; width: 100%; padding: 0; border: 0; background: none; cursor: zoom-in; }
.bz-car-zoom { position: absolute; inset-block-end: 10px; inset-inline-end: 10px; background: rgba(0,0,0,.55); color: #fff;
  width: 34px; height: 34px; border-radius: 50%; display: grid; place-items: center; font-size: .95rem; }
.bz-lightbox { position: fixed; inset: 0; z-index: 200; background: rgba(0,0,0,.92); display: flex; align-items: center; justify-content: center; }
.bz-lightbox[hidden] { display: none; }
.bz-lb-img { max-width: 92vw; max-height: 86vh; object-fit: contain; border-radius: 6px; }
.bz-lb-x { position: absolute; top: 14px; inset-inline-end: 16px; background: rgba(255,255,255,.14); color: #fff; border: 0;
  width: 44px; height: 44px; border-radius: 50%; font-size: 1.3rem; cursor: pointer; }
.bz-lb-nav { position: absolute; top: 50%; transform: translateY(-50%); background: rgba(255,255,255,.14); color: #fff; border: 0;
  width: 48px; height: 48px; border-radius: 50%; font-size: 2rem; line-height: 1; cursor: pointer; }
.bz-lb-prev { inset-inline-start: 12px; } .bz-lb-next { inset-inline-end: 12px; }
html[dir="rtl"] .bz-lb-prev { transform: translateY(-50%) scaleX(-1); } html[dir="rtl"] .bz-lb-next { transform: translateY(-50%) scaleX(-1); }
.bz-lb-x:hover, .bz-lb-nav:hover { background: rgba(255,255,255,.28); }
.bz-lb-count { position: absolute; inset-block-end: 16px; inset-inline: 0; text-align: center; color: #fff; font-size: .9rem; opacity: .85; }
@media (max-width: 640px) { .bz-lb-nav { width: 40px; height: 40px; font-size: 1.6rem; } }

/* Food: add-to-cart confirmation flash */
.bz-food-add.is-added { background: var(--z-green) !important; color: #fff !important; border-color: var(--z-green) !important; }

/* Food checkout OTP modal */
.bz-otp-recaptcha { margin: 10px 0; min-height: 78px; }
#bz-otp-step2 input { width: 100%; padding: 11px 12px; border: 1px solid var(--be-border, var(--z-border)); border-radius: 9px;
  background: var(--be-surface, var(--z-card)); color: var(--be-text, var(--z-text)); font-size: 1.1rem; letter-spacing: .25em; text-align: center; margin-bottom: 10px; }
#bz-otp-step1 .btn-primary, #bz-otp-step2 .btn-primary { width: 100%; }
#bz-otp-retry { display: inline-block; margin-top: 10px; }

/* Cars: "New" condition badge — top-opposite-corner so it never overlaps Featured */
.bz-badge-new { left: auto; right: 8px; background: #1d9bf0; color: #fff; }
html[dir="rtl"] .bz-badge-new { right: auto; left: 8px; }

/* ══════════════════════ Design-system unification ══════════════════════ */

/* Shared radius scale (available for new components; existing ones keep their values). */
:root { --bz-radius-sm: 9px; --bz-radius-md: 14px; --bz-radius-pill: 999px; }

/* Dark-mode overrides for surfaces that were left on light hex values. */
html[data-theme="dark"] .bz-btn-savesearch.saved,
html[data-theme="dark"] .bz-empty-acts .btn-primary.saved { background: rgba(16,185,129,.16); color: #6ee7b7; border-color: rgba(16,185,129,.4); }
html[data-theme="dark"] .bz-badge-verified { background: rgba(16,185,129,.16); color: #6ee7b7; }
html[data-theme="dark"] .bz-badge-owner { background: rgba(201,162,39,.16); color: #e6c45a; }
html[data-theme="dark"] .bza-stat-warn { background: rgba(180,83,9,.14); border-color: rgba(180,83,9,.5); }
html[data-theme="dark"] .bza-stat-warn .bza-stat-n { color: #f0a44a; }

/* Finish the 44px tap-target sweep on the last small controls (phones). */
@media (max-width: 640px) {
  .bz-modal-x { width: 40px; height: 40px; }
  .bz-dir-wa, .bz-page-num, .bz-page-btn { min-width: 44px; min-height: 44px; }
  .bz-starbtn { min-width: 40px; min-height: 40px; }
}

.bzc-inline-add { margin-inline-start: auto; padding: 7px 14px; font-size: .85rem; }

/* ══════════════ Food kitchen onboarding wizard ══════════════ */
.bz-fmw { max-width: 640px; margin: 24px auto 48px; }
.bz-fmw-steps { display: flex; list-style: none; padding: 0; margin: 0 0 22px; counter-reset: s; }
.bz-fmw-steps li { flex: 1; display: flex; flex-direction: column; align-items: center; gap: 6px; position: relative; color: var(--be-text-muted, var(--z-muted)); font-size: .8rem; font-weight: 600; }
.bz-fmw-steps li::before { content: ""; position: absolute; top: 15px; inset-inline-start: -50%; width: 100%; height: 2px; background: var(--be-border, var(--z-border)); z-index: 0; }
.bz-fmw-steps li:first-child::before { display: none; }
.bz-fmw-n { width: 32px; height: 32px; border-radius: 50%; display: grid; place-items: center; background: var(--be-surface-2, #eef1f0);
  border: 2px solid var(--be-border, var(--z-border)); font-weight: 800; position: relative; z-index: 1; }
.bz-fmw-steps li.is-on { color: var(--z-green); } .bz-fmw-steps li.is-on .bz-fmw-n { background: var(--z-green); border-color: var(--z-green); color: #fff; }
.bz-fmw-steps li.is-done .bz-fmw-n { background: var(--z-green); border-color: var(--z-green); color: #fff; }
.bz-fmw-steps li.is-done::before, .bz-fmw-steps li.is-on::before { background: var(--z-green); }
.bz-fmw-card { background: var(--be-surface, var(--z-card)); border: 1px solid var(--be-border, var(--z-border)); border-radius: 18px;
  padding: 26px 28px; box-shadow: 0 12px 40px -22px rgba(0,0,0,.4); }
.bz-fmw-card h2 { margin: 0 0 6px; font-size: 1.4rem; letter-spacing: -.01em; }
.bz-fmw-ic { font-size: 2.6rem; line-height: 1; }
.bz-fmw-sub { margin: 20px 0 8px; font-size: 1rem; color: var(--be-text, var(--z-text)); }
.bz-fmw-benefits { list-style: none; padding: 0; margin: 14px 0 18px; display: flex; flex-direction: column; gap: 8px; }
.bz-fmw-benefits li { font-size: .92rem; }
.bz-fmw-btn { width: 100%; padding: 13px; font-size: 1rem; }
.bz-fmw-note { font-size: .84rem; margin: 10px 0 0; text-align: center; }
.bz-fmw-input { width: 100%; padding: 12px 13px; border: 1px solid var(--be-border, var(--z-border)); border-radius: 10px; font: inherit; margin-bottom: 10px;
  background: var(--be-surface-2, #fff); color: var(--be-text, var(--z-text)); }
.bz-fmw-fld { display: block; margin: 0 0 12px; font-size: .84rem; font-weight: 600; }
.bz-fmw-fld > span { display: block; margin-bottom: 4px; }
.bz-fmw-fld input, .bz-fmw-fld textarea, .bz-fmw-fld select { width: 100%; padding: 10px 12px; border: 1px solid var(--be-border, var(--z-border)); border-radius: 10px;
  font: inherit; font-weight: 400; background: var(--be-surface-2, #fff); color: var(--be-text, var(--z-text)); }
.bz-fmw-fld input:focus, .bz-fmw-fld textarea:focus, .bz-fmw-fld select:focus, .bz-fmw-input:focus { outline: 2px solid var(--z-green); outline-offset: 1px; }
/* Schedule grid time inputs are auto-width, not full-width like other fields. */
.fm-sched-row input[type="time"] { width: auto; }
.bz-fmw-logo-row { display: flex; align-items: center; gap: 14px; margin-bottom: 16px; }
.bz-fmw-foot { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-top: 20px; }
.bz-fmw-foot .btn-primary { padding-inline: 24px; }
.bz-fmw-done { text-align: center; }
.bz-fmw-burst { width: 64px; height: 64px; border-radius: 50%; background: var(--z-green); color: #fff; font-size: 2rem; font-weight: 800;
  display: grid; place-items: center; margin: 4px auto 14px; }
/* Wizard menu list (added items) */
.bz-fm-mitem { display: flex; align-items: center; gap: 12px; padding: 10px 0; border-bottom: 1px solid var(--be-border, var(--z-border)); }
.bz-fm-mthumb { width: 46px; height: 46px; border-radius: 8px; overflow: hidden; flex: 0 0 auto; display: grid; place-items: center; background: var(--be-surface-2, #f1f5f3); font-size: 1.3rem; }
.bz-fm-mthumb img { width: 100%; height: 100%; object-fit: cover; }
.bz-fm-mbody { flex: 1; font-size: .92rem; } .bz-fm-macts { display: flex; gap: 10px; flex: 0 0 auto; }
@media (max-width: 560px) { .bz-fmw-card { padding: 20px 18px; } .bz-fmw-steps li .bz-fmw-l { font-size: .7rem; } }

/* Admin in-console food vendor editor */
.bza-food-editor, .bza-food-menu { background: var(--be-surface, var(--z-card)); border: 1px solid var(--be-border, var(--z-border));
  border-radius: 14px; padding: 18px 20px; margin-bottom: 16px; }
.bza-food-h { margin: 0 0 4px; font-size: 1.15rem; }
.bza-food-sub { color: var(--be-text-muted, var(--z-muted)); font-size: .85rem; margin-bottom: 14px; }
.bza-food-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.bza-fld { display: flex; flex-direction: column; gap: 4px; font-size: .82rem; font-weight: 600; }
.bza-fld-full { grid-column: 1 / -1; }
.bza-fld input, .bza-fld textarea, .bza-mi-form input, .bza-mi-form textarea {
  padding: 9px 11px; border: 1px solid var(--be-border, var(--z-border)); border-radius: 9px; font: inherit; font-weight: 400;
  background: var(--be-surface-2, #fff); color: var(--be-text, var(--z-text)); }
.bza-fld input:focus, .bza-fld textarea:focus { outline: 2px solid var(--z-green); outline-offset: 1px; }
.bza-fld select { padding: 9px 11px; border: 1px solid var(--be-border, var(--z-border)); border-radius: 9px; font: inherit; font-weight: 400;
  background: var(--be-surface-2, #fff); color: var(--be-text, var(--z-text)); }
/* Opening-schedule time-picker grid (admin editor + vendor dashboard share this). */
.fe-sched, .fm-sched { display: flex; flex-direction: column; gap: 6px; margin-top: 4px; }
.fe-sched-row, .fm-sched-row { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.fe-sched-day, .fm-sched-day { display: inline-flex; align-items: center; gap: 6px; font-weight: 700; min-width: 74px; }
.fe-sched-row input[type="time"], .fm-sched-row input[type="time"] { padding: 7px 9px; border: 1px solid var(--be-border, var(--z-border)); border-radius: 8px;
  font: inherit; background: var(--be-surface-2, #fff); color: var(--be-text, var(--z-text)); }
.fe-sched-to, .fm-sched-to { color: var(--be-text-muted, var(--z-muted)); font-weight: 400; }
.fe-sched-copy, .fm-sched-copy { margin-top: 8px; font-size: .82rem; }
.bza-hint { font-weight: 400; font-size: .78rem; color: var(--be-text-muted, var(--z-muted)); }
.bza-chk { display: flex; align-items: center; gap: 8px; font-size: .85rem; font-weight: 600; }
.bza-food-actions { display: flex; align-items: center; gap: 12px; margin-top: 14px; }
.bza-food-msg { font-size: .85rem; } .bza-food-msg.ok { color: var(--z-green); } .bza-food-msg.err { color: #d64545; }
.bza-mi { display: flex; align-items: center; gap: 12px; padding: 10px 0; border-bottom: 1px solid var(--be-border, var(--z-border)); }
.bza-mi:last-of-type { border-bottom: 0; }
.bza-mi-thumb { width: 46px; height: 46px; border-radius: 8px; overflow: hidden; flex: 0 0 auto; display: grid; place-items: center;
  background: var(--be-surface-2, #f1f5f3); font-size: 1.3rem; }
.bza-mi-thumb img { width: 100%; height: 100%; object-fit: cover; }
.bza-mi-body { flex: 1; font-size: .9rem; } .bza-mi-desc { color: var(--be-text-muted, var(--z-muted)); font-size: .8rem; margin-top: 2px; }
.bza-mi-acts { display: flex; gap: 10px; flex: 0 0 auto; }
.bza-mi-form { margin-top: 16px; padding-top: 16px; border-top: 2px dashed var(--be-border, var(--z-border)); }
.bza-mi-prev { grid-column: 1 / -1; } .bza-mi-prev img { max-width: 90px; border-radius: 8px; }
@media (max-width: 640px) { .bza-food-grid { grid-template-columns: 1fr; } }

/* Admin "Add listing" launcher — per-category cards that open the post form */
.bza-addcat-note { margin: 0 0 16px; max-width: 60ch; }
.bza-addcat-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(180px, 1fr)); gap: 12px; }
.bza-addcat { display: flex; align-items: center; gap: 10px; padding: 14px 16px; border-radius: 12px; text-decoration: none;
  background: var(--be-surface, var(--z-card)); border: 1px solid var(--be-border, var(--z-border)); color: var(--be-text, var(--z-text));
  transition: transform .1s, box-shadow .1s, border-color .1s; }
.bza-addcat:hover { transform: translateY(-2px); box-shadow: 0 12px 28px -14px rgba(0,0,0,.3); border-color: var(--z-green); }
.bza-addcat-ic { font-size: 1.5rem; line-height: 1; flex: 0 0 auto; }
.bza-addcat-lb { flex: 1; font-weight: 600; font-size: .92rem; }
.bza-addcat-go { flex: 0 0 auto; font-size: .78rem; font-weight: 700; color: var(--z-green); }

/* Cars post: "Make cover" on non-cover photos */
.bz-carphoto-cover { position: absolute; inset-block-end: 4px; inset-inline-start: 4px; font-size: .68rem; font-weight: 600;
  background: rgba(0,0,0,.62); color: #fff; border: 0; border-radius: 6px; padding: 3px 7px; cursor: pointer; }
.bz-carphoto-cover:hover { background: var(--z-green); }

/* "Post ad" is the primary action — make it read like one (filled pill), not a
   quiet outline link, and keep it reachable on mobile where the nav collapses. */
.nav-post { background: var(--z-green); color: #fff !important; font-weight: 600;
  border-radius: 999px; padding: 9px 18px; }
.nav-post:hover { background: var(--z-green-dark); }
.nav-post-m { display: none; }  /* desktop: the in-nav .nav-post is enough */
@media (max-width: 768px) {
  .nav-post-m { display: inline-flex; align-items: center; gap: 5px; margin-inline-start: auto;
    background: var(--z-green); color: #fff; font-weight: 700; border-radius: 999px;
    padding: 9px 15px; text-decoration: none; font-size: .92rem; white-space: nowrap; }
  .nav-post-m:hover { background: var(--z-green-dark); }
  .nav-burger { margin-inline-start: 6px; }  /* .nav-post-m now owns the auto push */
  .header-nav .nav-post { display: none; }   /* avoid a duplicate Post in the drawer */
}

/* ============================================================
   SEO landing pages (/food-delivery, …) — hero reuses .bz-hero.
   ============================================================ */
.bz-landing{max-width:960px;margin:0 auto;padding:8px 16px 48px}
.bz-landing-sec{margin-top:36px}
.bz-landing-sec>h2{font-size:1.4rem;margin:0 0 16px;color:var(--z-text)}
.bz-landing-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(210px,1fr));gap:16px}
.bz-landing-card{display:flex;flex-direction:column;background:var(--z-card);border:1px solid var(--z-border);border-radius:14px;overflow:hidden;text-decoration:none;color:inherit;transition:box-shadow .15s,transform .15s}
.bz-landing-card:hover{box-shadow:var(--shadow-hover);transform:translateY(-2px)}
.bz-landing-card__img{display:block;height:130px;background:var(--z-green-light) center/cover no-repeat}
.bz-landing-card__img--ph{display:flex;align-items:center;justify-content:center;font-size:2.6rem}
.bz-landing-card__body{display:flex;flex-direction:column;gap:3px;padding:12px 14px}
.bz-landing-card__name{font-weight:700;color:var(--z-text)}
.bz-landing-card__sub{font-size:.85rem;color:var(--z-muted)}
.bz-landing-card__meta{display:flex;align-items:center;gap:10px;margin-top:6px;font-size:.82rem}
.bz-landing-card__rating{color:var(--z-gold);font-weight:600}
.bz-landing-card__rating span{color:var(--z-muted);font-weight:400}
.bz-landing-card__status{margin-inline-start:auto;color:var(--z-muted);font-weight:600}
.bz-landing-card__status.is-open{color:var(--z-green-dark)}
.bz-landing-all{margin-top:16px}
.bz-landing-all a,.bz-landing-links a{color:var(--z-green-dark);font-weight:600;text-decoration:none}
.bz-landing-all a:hover,.bz-landing-links a:hover{text-decoration:underline}
.bz-landing-steps{list-style:none;margin:0;padding:0;display:grid;gap:14px}
.bz-landing-steps li{display:flex;gap:14px;align-items:flex-start}
.bz-landing-steps__n{flex:0 0 32px;height:32px;border-radius:50%;background:var(--z-green);color:#fff;font-weight:700;display:flex;align-items:center;justify-content:center}
.bz-landing-steps li>span:last-child{display:flex;flex-direction:column;gap:2px}
.bz-landing-steps strong{color:var(--z-text)}
.bz-landing-steps span span{color:var(--z-muted)}
.bz-landing-faq details{border:1px solid var(--z-border);border-radius:12px;background:var(--z-card);padding:2px 16px;margin-bottom:10px}
.bz-landing-faq summary{cursor:pointer;font-weight:600;color:var(--z-text);padding:12px 0;list-style:none}
.bz-landing-faq summary::-webkit-details-marker{display:none}
.bz-landing-faq summary::after{content:"+";float:inline-end;color:var(--z-green);font-weight:700}
.bz-landing-faq details[open] summary::after{content:"–"}
.bz-landing-faq p{margin:0 0 14px;color:var(--z-muted)}
.bz-landing-links ul{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:10px 22px}
.bz-food-guide-link{color:inherit;text-decoration:underline;text-underline-offset:3px;opacity:.9;white-space:nowrap;font-weight:600}
.bz-food-guide-link:hover{opacity:1}
/* "24 hours" toggle in the food schedule editors. */
.fe-sched-24, .fm-sched-24 { font-size: .85rem; white-space: nowrap; display: inline-flex; align-items: center; gap: 4px; color: var(--z-muted); }
.fe-sched-row input[disabled], .fm-sched-row input[disabled] { opacity: .5; }

/* Food delivery-coverage multi-select (register form + admin editor) */
.bz-fm-areas, .bza-food-areas { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 6px; }
.bz-fm-area, .bza-food-area { display: inline-flex; align-items: center; gap: 6px; padding: 6px 12px; border: 1px solid var(--be-border, #e2e8e5); border-radius: 999px; font-size: 13px; cursor: pointer; background: var(--be-surface, #fff); }
.bz-fm-area input, .bza-food-area input { accent-color: var(--be-green, #047857); }
.bz-food-delivers { margin: 4px 0 0; font-size: 12px; color: var(--be-muted, #66756f); }

/* ── Checkout: delivery address + optional map pin ───────────────────────── */
.bz-ord-label { margin: 4px 0 6px; font-size: 12px; font-weight: 700; letter-spacing: .03em; text-transform: uppercase; color: var(--be-muted, #66756f); }
.bz-ord-label-opt { display: flex; align-items: center; gap: 6px; text-transform: none; letter-spacing: 0; font-size: 13px; }
.bz-ord-label-opt span { font-weight: 500; opacity: .75; }

.bz-ord-geo-row { display: flex; gap: 8px; margin-bottom: 8px; }
.bz-ord-geo-row > * { flex: 1; min-width: 0; }

/* One consistent field look for selects + inputs + textarea */
.bz-ord-select, .bz-ord-input {
  width: 100%; box-sizing: border-box; font: inherit; line-height: 1.3;
  padding: 10px 12px; border: 1px solid var(--be-border, #dfe8e3);
  border-radius: 10px; background: var(--be-surface, #fff); color: var(--be-text, #1f2d28);
  transition: border-color .15s ease, box-shadow .15s ease;
}
.bz-ord-select {
  appearance: none; -webkit-appearance: none; padding-right: 32px; cursor: pointer;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath fill='none' stroke='%2366756f' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round' d='M1 1.5 6 6.5l5-5'/%3E%3C/svg%3E");
  background-repeat: no-repeat; background-position: right 11px center;
}
.bz-ord-address { resize: vertical; min-height: 46px; }
.bz-ord-select:focus, .bz-ord-input:focus {
  outline: none; border-color: var(--be-green, #047857);
  box-shadow: 0 0 0 3px rgba(4, 120, 87, .16);
}

/* Optional map-pin group — visually set apart from the required fields above */
.bz-ord-pin { margin-top: 12px; padding: 10px; border: 1px dashed var(--be-border, #dfe8e3); border-radius: 12px; background: var(--be-soft, #f6faf8); }
.bz-ord-map { width: 100%; height: 190px; border-radius: 10px; margin: 2px 0 8px; border: 1px solid var(--be-border, #dfe8e3); overflow: hidden; }
.bz-ord-pin .bz-ord-geo-btn { width: 100%; margin: 0; }
.bz-ord-maphint { margin: 6px 0 0; font-size: 12px; color: var(--be-muted, #66756f); }

.bz-ord-coverage { margin: 6px 0 8px; padding: 8px 10px; border-radius: 8px; background: #fdecea; color: #a12a1a; font-size: 13px; }
.bz-ord-geo-msg { margin: 6px 0 0; font-size: 12px; color: var(--be-muted, #66756f); }
.bz-ord-geo-msg:empty { display: none; }
.bz-ord-geo-msg.ok { color: var(--be-green, #047857); }
.bz-ord-geo-msg.err { color: #a12a1a; }

/* Dark mode */
html[data-theme="dark"] .bz-ord-select,
html[data-theme="dark"] .bz-ord-input {
  background: var(--be-surface, #16211d); color: var(--be-text, #e8f0ec); border-color: var(--be-border, #2b3a34);
}
html[data-theme="dark"] .bz-ord-select {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath fill='none' stroke='%23a7b7b0' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round' d='M1 1.5 6 6.5l5-5'/%3E%3C/svg%3E");
}
html[data-theme="dark"] .bz-ord-pin { background: rgba(255, 255, 255, .03); border-color: var(--be-border, #2b3a34); }
html[data-theme="dark"] .bz-ord-coverage { background: #3a1512; color: #ffb4a8; }
html[data-theme="dark"] .bz-ord-geo-msg.err { color: #ffb4a8; }

/* Gated contact reveal — pill button (on the header gradient) + reveal modal */
.bz-food-contact-btn { display: inline-flex; align-items: center; gap: 6px; padding: 9px 16px; border-radius: 999px; border: 1px solid rgba(255,255,255,.55); background: rgba(255,255,255,.15); color: #fff; font: inherit; font-weight: 600; cursor: pointer; transition: background .15s; }
.bz-food-contact-btn:hover { background: rgba(255,255,255,.28); }
.bz-food-nomenu .bz-food-contact-btn { border-color: var(--be-border,#dfe8e3); background: var(--be-green,#047857); }
.bz-fc-modal { position: fixed; inset: 0; z-index: 1000; display: flex; align-items: center; justify-content: center; padding: 16px; background: rgba(0,0,0,.5); }
.bz-fc-modal[hidden] { display: none; }
.bz-fc-card { position: relative; width: 100%; max-width: 360px; background: var(--be-surface,#fff); color: var(--be-text,#1f2d28); border-radius: 16px; padding: 24px 20px 18px; box-shadow: 0 20px 50px rgba(0,0,0,.25); text-align: center; }
.bz-fc-x { position: absolute; top: 8px; right: 10px; border: none; background: none; font-size: 26px; line-height: 1; color: var(--be-muted,#66756f); cursor: pointer; }
.bz-fc-card h3 { margin: 0 0 6px; font-size: 18px; }
.bz-fc-name { margin: 0 0 14px; font-weight: 700; }
.bz-fc-actions { display: flex; flex-direction: column; gap: 10px; margin-bottom: 14px; }
.bz-fc-actions a { display: block; padding: 12px; border-radius: 10px; font-weight: 700; text-decoration: none; }
.bz-fc-actions .bz-food-call { background: #eef4f1; color: #0b3d2e; }
.bz-fc-actions .bz-food-wa { background: #25d366; color: #fff; }
.bz-fc-note { margin: 0; font-size: 12px; color: var(--be-muted,#66756f); line-height: 1.5; }
html[data-theme="dark"] .bz-fc-card { background: #16211d; color: #e8f0ec; }
html[data-theme="dark"] .bz-fc-actions .bz-food-call { background: #22302b; color: #cdebd9; }

/* Delivery shown as a SEPARATE, secondary line — never part of the food total */
.bz-cart-feerow { color: var(--be-muted, #66756f); font-weight: 400; }
.bz-cart-feerow b { font-weight: 500; }
.bz-cart-feenote { margin: 6px 0 0; font-size: 12px; color: var(--be-muted, #66756f); line-height: 1.5; }

/* ── Storefront revamp: slimmer header, collapsed hours, contact-at-end ───── */
.bz-food-vhead { padding: 14px 16px; }
.bz-food-vlogo { width: 60px; height: 60px; flex: 0 0 60px; }
.bz-food-vhead h1 { font-size: 19px; line-height: 1.2; margin: 2px 0; }
.bz-food-vhead .bz-food-cuisine { font-size: 13px; margin: 2px 0; }
.bz-food-vdesc { font-size: 13px; -webkit-line-clamp: 2; }
.bz-food-vmeta { gap: 6px 8px; margin-top: 6px; }
.bz-food-vmeta span { font-size: 12px; }

/* Opening hours → collapsed one-liner (native <details>) that expands to the week */
.bz-food-hours { margin: 12px 0; border: 1px solid var(--be-border, #dfe8e3); border-radius: 12px; padding: 10px 14px; background: var(--be-surface, #fff); }
.bz-food-hours > summary { cursor: pointer; list-style: none; display: flex; align-items: center; gap: 6px; font-size: 14px; }
.bz-food-hours > summary::-webkit-details-marker { display: none; }
.bz-food-hours > summary::after { content: "\25BE"; margin-inline-start: auto; color: var(--be-muted, #66756f); transition: transform .15s ease; }
.bz-food-hours[open] > summary::after { transform: rotate(180deg); }
.bz-food-hours .bz-food-hours-tz { color: var(--be-muted, #66756f); font-size: 12px; font-weight: 400; }
.bz-food-hours-list { list-style: none; margin: 10px 0 0; padding: 0; }
.bz-food-hours-list li { display: flex; justify-content: space-between; padding: 5px 0; font-size: 13px; border-top: 1px solid var(--be-border, #eef2f0); }
.bz-food-hours-list li.is-today { font-weight: 500; color: var(--be-green, #047857); }

/* Direct contact — end of page, de-emphasized (order-first) */
.bz-food-contact-end { margin: 22px 0 8px; text-align: center; padding-top: 16px; border-top: 1px solid var(--be-border, #dfe8e3); }
.bz-food-contact-end p { margin: 0 0 8px; font-size: 13px; color: var(--be-muted, #66756f); }
.bz-food-contact-btn--ghost { background: transparent; color: var(--be-green, #047857); border: 1px solid var(--be-border, #dfe8e3); }
.bz-food-contact-btn--ghost:hover { background: var(--be-soft, #f6faf8); }
html[data-theme="dark"] .bz-food-hours { background: #16211d; border-color: #2b3a34; }
html[data-theme="dark"] .bz-food-contact-btn--ghost:hover { background: rgba(255,255,255,.05); }

/* ══════════════════════════════════════════════════════════════════════════
   Find a Doctor — premium directory hero + Register CTA (/doctors)
   ══════════════════════════════════════════════════════════════════════════ */
.bz-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; }

.bz-doc-hero { background: linear-gradient(135deg, #0c5237 0%, #0a4630 55%, #06351f 100%); color: #fff; padding: 40px 0 34px; }
.bz-doc-hero-in { display: flex; gap: 28px; align-items: stretch; }
.bz-doc-hero-main { flex: 1 1 auto; min-width: 0; }
.bz-doc-hero-h1 { margin: 0 0 8px; font-size: clamp(2.1rem, 5vw, 3.1rem); font-weight: 800; line-height: 1.05; color: #fff; }
.bz-doc-hero-accent { color: #f2b134; }
.bz-doc-hero-sub { margin: 0 0 20px; font-size: clamp(.95rem, 2vw, 1.08rem); color: rgba(255,255,255,.82); max-width: 40ch; }

.bz-doc-search { display: flex; gap: 10px; background: #fff; border-radius: 14px; padding: 8px; box-shadow: 0 10px 30px rgba(0,0,0,.18); max-width: 720px; }
.bz-doc-search-field { flex: 1 1 auto; display: flex; align-items: center; gap: 8px; padding: 0 12px; min-width: 0; }
.bz-doc-search-icon { color: #6b7b74; font-size: 1rem; }
.bz-doc-search-field input { flex: 1 1 auto; border: 0; outline: 0; font: inherit; font-size: 1rem; background: transparent; color: #12241c; min-width: 0; padding: 12px 0; }
.bz-doc-search-area { display: flex; align-items: center; border-left: 1px solid #e2e8e4; }
.bz-doc-search-area select { border: 0; outline: 0; background: transparent; font: inherit; font-size: .95rem; color: #12241c; padding: 12px 10px; max-width: 150px; cursor: pointer; }
.bz-doc-search-btn { flex: 0 0 auto; border: 0; border-radius: 10px; background: var(--z-green, #0a7d3f); color: #fff; font: inherit; font-weight: 700; font-size: 1rem; padding: 0 26px; cursor: pointer; }
.bz-doc-search-btn:hover { filter: brightness(1.06); }

.bz-doc-trust { list-style: none; margin: 22px 0 0; padding: 0; display: grid; grid-template-columns: repeat(4, 1fr); gap: 14px; max-width: 760px; }
.bz-doc-trust li { display: flex; align-items: flex-start; gap: 10px; }
.bz-doc-trust-ic { flex: 0 0 auto; color: #f2b134; margin-top: 1px; }
.bz-doc-trust b { display: block; font-size: .86rem; color: #fff; line-height: 1.2; }
.bz-doc-trust small { display: block; font-size: .74rem; color: rgba(255,255,255,.7); line-height: 1.3; margin-top: 2px; }

.bz-doc-join { flex: 0 0 300px; align-self: flex-start; background: #fffdf6; border: 1px solid #f0e3c2; border-radius: 16px; padding: 22px 20px; text-align: center; box-shadow: 0 12px 30px rgba(0,0,0,.16); }
.bz-doc-join-ic { display: inline-grid; place-items: center; width: 56px; height: 56px; border-radius: 50%; background: #fbeecb; color: #b9821a; margin-bottom: 10px; }
.bz-doc-join-h { margin: 0 0 6px; font-size: 1.12rem; font-weight: 800; color: #12241c; }
.bz-doc-join-p { margin: 0 0 16px; font-size: .84rem; color: #55635c; line-height: 1.45; }
.bz-doc-join-cta { display: block; background: linear-gradient(135deg, #f2b134, #e0982c); color: #4a2f00; font-weight: 800; font-size: .98rem; text-decoration: none; border-radius: 11px; padding: 13px 16px; box-shadow: 0 6px 16px rgba(224,152,44,.36); }
.bz-doc-join-cta:hover { filter: brightness(1.04); }
.bz-doc-join-trust { display: block; margin-top: 12px; font-size: .78rem; color: #55635c; }

:root[data-theme="dark"] .bz-doc-join { background: #1b2620; border-color: rgba(240,227,194,.18); }
:root[data-theme="dark"] .bz-doc-join-h { color: #f0f4f1; }
:root[data-theme="dark"] .bz-doc-join-p, :root[data-theme="dark"] .bz-doc-join-trust { color: #aab6af; }

/* Secondary "Are you a doctor?" CTA below results */
.bz-doc-cta2 { display: flex; flex-wrap: wrap; align-items: center; gap: 16px 24px; margin: 26px 0 10px; padding: 20px 22px; background: #fffdf6; border: 1px solid #f0e3c2; border-radius: 16px; }
:root[data-theme="dark"] .bz-doc-cta2 { background: #1b2620; border-color: rgba(240,227,194,.18); }
.bz-doc-cta2-ic { flex: 0 0 auto; display: inline-grid; place-items: center; width: 64px; height: 64px; border-radius: 50%; background: #fbeecb; color: #b9821a; }
.bz-doc-cta2-txt { flex: 1 1 220px; }
.bz-doc-cta2-txt h2 { margin: 0 0 4px; font-size: 1.2rem; font-weight: 800; }
.bz-doc-cta2-txt p { margin: 0; font-size: .88rem; color: #55635c; }
:root[data-theme="dark"] .bz-doc-cta2-txt p { color: #aab6af; }
.bz-doc-cta2-benefits { list-style: none; margin: 0; padding: 0; flex: 1 1 300px; display: grid; grid-template-columns: 1fr 1fr; gap: 6px 16px; font-size: .82rem; color: #3a4742; }
:root[data-theme="dark"] .bz-doc-cta2-benefits { color: #cdd6d0; }
.bz-doc-cta2-btn { flex: 0 0 auto; align-self: center; }

@media (max-width: 900px) {
  .bz-doc-hero-in { flex-direction: column; }
  .bz-doc-join { flex-basis: auto; width: 100%; }
  .bz-doc-trust { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 620px) {
  .bz-doc-search { flex-wrap: wrap; }
  .bz-doc-search-area { border-left: 0; border-top: 1px solid #e2e8e4; width: 100%; }
  .bz-doc-search-area select { max-width: none; width: 100%; }
  .bz-doc-search-btn { width: 100%; padding: 12px; }
  .bz-doc-cta2-benefits { grid-template-columns: 1fr; }
  .bz-doc-cta2-btn { width: 100%; text-align: center; }
}

/* ── Journey table: sortable headers + per-column filter row + scroll status ── */
.bzc-jtable thead th.bzc-jsort{cursor:pointer;user-select:none;transition:color .12s,background .12s}
.bzc-jtable thead th.bzc-jsort:hover{color:var(--z-green,#0a7d3f);background:rgba(10,125,63,.05)}
.bzc-jar{font-size:10px;color:var(--z-green,#0a7d3f);margin-left:2px}
.bzc-jfrow th{padding:6px 12px 8px;border-bottom:1px solid var(--z-border);background:var(--be-surface-2,#f6faf7)}
:root[data-theme="dark"] .bzc-jfrow th{background:rgba(255,255,255,.03)}
.bzc-jcf{width:100%;min-width:90px;padding:5px 8px;border:1px solid var(--be-border,var(--z-border));border-radius:7px;background:var(--be-card,#fff);color:var(--be-text,var(--z-text));font:inherit;font-size:12px;text-transform:none;letter-spacing:normal;font-weight:400}
.bzc-jcf:focus{outline:none;border-color:var(--z-green,#0a7d3f)}
/* Sticky header so columns stay labelled while scroll-paginating a long feed. */
.bzc-jtable thead th{position:sticky;top:0;z-index:2;background:var(--be-card,var(--z-card,#fff))}
.bzc-jtable thead tr.bzc-jfrow th{top:37px}
.bzc-jstatus{text-align:center;font-size:12.5px;padding:12px 0 2px}
#bza-jsentinel{height:1px}

/* ── Journey analytics charts (traffic timeline + mobile/desktop donut) ── */
.bzc-charts{display:grid;grid-template-columns:2fr 1fr;gap:14px;margin:6px 0 16px}
.bzc-chartcard{background:var(--z-card);border:1px solid var(--z-border);border-radius:14px;box-shadow:var(--shadow);padding:14px 16px}
.bzc-spark{display:block;width:100%;height:auto;margin-top:4px;overflow:visible}
.bzc-spx{font-size:11px;fill:var(--z-muted)}
.bzc-sppeak{fill:#e0982c;stroke:var(--z-card,#fff);stroke-width:1.5}
.bzc-spmeta{display:flex;justify-content:space-between;align-items:center;gap:10px;margin-top:6px;font-size:12px}
.bzc-sppeaklbl{color:#c77700;font-weight:700}
.bzc-donutwrap{display:flex;align-items:center;gap:14px;flex-wrap:wrap;margin-top:4px}
.bzc-donut{width:130px;height:130px;flex:none}
.bzc-dncenter{font-size:30px;font-weight:800;fill:var(--z-text,#1a1a1a)}
:root[data-theme="dark"] .bzc-dncenter{fill:#f0f4f1}
.bzc-dnsub{font-size:12px;fill:var(--z-muted)}
.bzc-dnlegend{display:flex;flex-direction:column;gap:7px;font-size:13px}
.bzc-dnleg{display:flex;align-items:center;gap:7px;white-space:nowrap}
.bzc-dndot{width:11px;height:11px;border-radius:3px;flex:none}
@media (max-width:900px){.bzc-charts{grid-template-columns:1fr}}

/* ── Journey dashboard: deltas · timeline toggle · busiest-hours heatmap ── */
.bzc-stat-v{display:flex;align-items:baseline;gap:8px;flex-wrap:wrap}
.bzc-delta{font-size:12px;font-weight:800;border-radius:999px;padding:1px 8px;line-height:1.5}
.bzc-delta-up{color:#1f8a4c;background:rgba(31,138,76,.12)}
.bzc-delta-down{color:#c0392b;background:rgba(192,57,43,.12)}
.bzc-delta-flat{color:var(--z-muted);background:rgba(0,0,0,.05)}
.bzc-charthead{display:flex;align-items:center;justify-content:space-between;gap:10px}
.bzc-jtoggle{display:inline-flex;background:var(--be-surface-2,#eef3f0);border-radius:999px;padding:2px}
.bzc-tgl{border:0;background:none;font:inherit;font-size:12px;font-weight:700;color:var(--z-muted);padding:4px 12px;border-radius:999px;cursor:pointer}
.bzc-tgl.is-on{background:var(--z-green,#0a7d3f);color:#fff}
.bzc-charts2{margin-top:0}
.bzc-heat{display:grid;grid-template-columns:repeat(24,1fr);gap:3px;margin-top:6px}
.bzc-hcell{height:34px;border-radius:4px;border:1.5px solid transparent}
.bzc-hcell.is-peak{border-color:#e0982c;box-shadow:0 0 0 2px rgba(224,152,44,.25)}
.bzc-hlabs{display:flex;justify-content:space-between;font-size:11px;color:var(--z-muted);margin-top:4px}
.bzc-hmeta{display:flex;justify-content:space-between;align-items:center;gap:10px;margin-top:6px;font-size:12px}

/* ── Journey dashboard: click-to-filter drill-down ── */
.bzc-clickable{cursor:pointer;transition:background .12s,box-shadow .12s,transform .06s}
.bzc-barrow.bzc-clickable:hover{background:rgba(10,125,63,.06);border-radius:8px}
.bzc-barrow.bzc-clickable.is-on{background:rgba(10,125,63,.12);border-radius:8px;box-shadow:inset 3px 0 0 var(--z-green,#0a7d3f)}
.bzc-dnleg.bzc-clickable{border-radius:8px;padding:3px 6px;margin:-3px -6px}
.bzc-dnleg.bzc-clickable:hover{background:rgba(10,125,63,.08)}
.bzc-dnleg.bzc-clickable.is-on{background:rgba(10,125,63,.14);font-weight:700}
.bzc-hcell.bzc-clickable:hover{transform:translateY(-2px);box-shadow:0 3px 8px rgba(16,40,30,.22)}
.bzc-hcell.bzc-clickable.is-on{outline:2px solid var(--z-green,#0a7d3f);outline-offset:1px}
.bzc-drillbar{display:flex;align-items:center;flex-wrap:wrap;gap:8px;background:rgba(10,125,63,.06);border:1px solid rgba(10,125,63,.18);border-radius:12px;padding:8px 12px;margin-bottom:12px}
.bzc-drilllbl{font-size:12px;font-weight:800;color:var(--z-green,#0a7d3f);text-transform:uppercase;letter-spacing:.03em}
.bzc-drill{display:inline-flex;align-items:center;gap:6px;background:#fff;border:1px solid var(--z-border);border-radius:999px;padding:3px 6px 3px 11px;font-size:13px}
:root[data-theme="dark"] .bzc-drill{background:#1b2620}
.bzc-drill b{font-weight:700;color:var(--z-muted)}
.bzc-drillx{border:0;background:rgba(0,0,0,.06);color:inherit;border-radius:50%;width:18px;height:18px;line-height:1;cursor:pointer;font-size:11px;display:inline-flex;align-items:center;justify-content:center}
.bzc-drillx:hover{background:#b3261e;color:#fff}
.bzc-drillclear{font-size:12px;margin-left:auto}

/* ── Journey "active now" live pulse ── */
.bzc-pulse{display:flex;align-items:center;flex-wrap:wrap;gap:14px 22px;background:linear-gradient(100deg,#0c5237,#0a4630);color:#fff;border-radius:14px;padding:14px 18px;margin-bottom:14px}
.bzc-pulse:empty{display:none}
.bzc-pulse-l{display:flex;align-items:center;gap:11px}
.bzc-livedot{width:12px;height:12px;border-radius:50%;background:#37e08a;box-shadow:0 0 0 0 rgba(55,224,138,.7);animation:bzcpulse 1.6s infinite}
@keyframes bzcpulse{0%{box-shadow:0 0 0 0 rgba(55,224,138,.6)}70%{box-shadow:0 0 0 10px rgba(55,224,138,0)}100%{box-shadow:0 0 0 0 rgba(55,224,138,0)}}
@media (prefers-reduced-motion:reduce){.bzc-livedot{animation:none}}
.bzc-pulse-n{font-size:26px;font-weight:800;line-height:1}
.bzc-pulse-lbl{font-size:11px;color:rgba(255,255,255,.75);text-transform:uppercase;letter-spacing:.04em;margin-top:2px}
.bzc-pulse-stats{display:flex;gap:16px;font-size:13px;color:rgba(255,255,255,.85)}
.bzc-pulse-stats b{color:#fff;font-size:15px}
.bzc-pulse-spark{display:flex;flex-direction:column;gap:2px}
.bzc-psvg{width:200px;height:34px;display:block}
.bzc-pulse-sparklbl{font-size:10.5px;color:rgba(255,255,255,.6)!important}
.bzc-pulse-viewing{flex-basis:100%;display:flex;flex-wrap:wrap;gap:8px;align-items:center;font-size:12.5px;border-top:1px solid rgba(255,255,255,.14);padding-top:10px}
.bzc-pulse-viewing .bz-muted{color:rgba(255,255,255,.7)!important}
.bzc-pv{background:rgba(255,255,255,.12);border-radius:999px;padding:3px 10px}
.bzc-pv .bzc-pill{background:rgba(255,255,255,.22);color:#fff}
.bzc-pv b{color:#37e08a}

/* ── Doctor engagement funnel ── */
.bzc-doccard{margin-bottom:14px}
.bzc-funnel{display:grid;grid-template-columns:220px 1fr;gap:22px;align-items:center}
.bzc-fnsum{text-align:center;border-right:1px solid var(--z-border);padding-right:20px}
.bzc-fnbig{font-size:44px;font-weight:800;line-height:1;color:var(--z-green,#0a7d3f)}
.bzc-fnbiglbl{font-size:12px;color:var(--z-muted);text-transform:uppercase;letter-spacing:.04em;margin-top:2px}
.bzc-fndocs{margin-top:10px;font-size:13px}
.bzc-fnmethods{display:flex;justify-content:center;gap:14px;margin-top:10px;font-size:12.5px;color:var(--z-muted)}
.bzc-fnmethods b{color:var(--z-text,#1a1a1a)}
:root[data-theme="dark"] .bzc-fnmethods b{color:#f0f4f1}
.bzc-fnstages{display:flex;flex-direction:column;gap:14px}
.bzc-fnhead{display:flex;justify-content:space-between;font-size:13.5px;margin-bottom:4px}
.bzc-fnhead b{font-size:16px}
.bzc-fntrack{background:var(--be-surface-2,#eef3f0);border-radius:8px;height:16px;overflow:hidden}
.bzc-fnfill{display:block;height:16px;border-radius:8px;transition:width .5s}
.bzc-fnsub{font-size:12px;margin-top:3px}
.bzc-fnlb{grid-column:1/-1;border-top:1px solid var(--z-border);padding-top:12px;margin-top:4px}
.bzc-fnlblhd{font-size:12px;font-weight:800;color:var(--z-muted);text-transform:uppercase;letter-spacing:.04em;margin-bottom:6px}
@media (max-width:720px){.bzc-funnel{grid-template-columns:1fr}.bzc-fnsum{border-right:0;border-bottom:1px solid var(--z-border);padding:0 0 14px}}

/* ── Engagement widgets per vertical ── */
.bzc-vwgrid{display:grid;grid-template-columns:repeat(auto-fit,minmax(210px,1fr));gap:12px}
.bzc-vw{border:1px solid var(--z-border);border-top:3px solid var(--vc,#0a7d3f);border-radius:12px;padding:12px 14px;background:var(--z-card,#fff)}
.bzc-vw-hd{display:flex;align-items:center;gap:8px;margin-bottom:10px}
.bzc-vw-ic{font-size:20px;line-height:1}
.bzc-vw-lbl{font-weight:800;font-size:14px}
.bzc-vw-conv{margin-left:auto;font-size:13px;font-weight:800;color:var(--vc,#0a7d3f);background:color-mix(in srgb,var(--vc) 12%,transparent);border-radius:999px;padding:2px 9px}
.bzc-vw-nums{display:flex;gap:14px;margin-bottom:9px}
.bzc-vw-nums>div{display:flex;flex-direction:column}
.bzc-vw-nums b{font-size:21px;font-weight:800;line-height:1.1}
.bzc-vw-nums small{font-size:11px;color:var(--z-muted)}
.bzc-vw-bar{height:7px;background:var(--be-surface-2,#eef3f0);border-radius:5px;overflow:hidden;margin-bottom:8px}
.bzc-vw-bar span{display:block;height:7px;border-radius:5px;background:var(--vc,#0a7d3f)}
.bzc-vw-foot{font-size:11.5px}
.bzc-vw-empty{font-size:12.5px;padding:8px 0 10px}

/* ── Engagement widget click state + "views, no contacts" watchlist ── */
.bzc-vw.bzc-clickable:hover{box-shadow:0 6px 16px rgba(16,40,30,.14);transform:translateY(-2px)}
.bzc-vw.bzc-clickable.is-on{box-shadow:0 0 0 2px var(--vc,#0a7d3f) inset,0 6px 16px rgba(16,40,30,.12)}
.bzc-wl{display:flex;flex-direction:column;gap:2px}
.bzc-wlrow{display:grid;grid-template-columns:26px 1fr 120px 74px;align-items:center;gap:10px;padding:7px 4px;border-bottom:1px solid var(--z-border)}
.bzc-wlrow:last-child{border-bottom:0}
.bzc-wlk{width:24px;height:24px;border-radius:7px;display:grid;place-items:center;font-size:13px;color:#fff}
.bzc-wlname{min-width:0;display:flex;flex-direction:column;font-size:13.5px;font-weight:600}
.bzc-wlname{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.bzc-wlname small{font-size:11px;font-weight:400}
.bzc-wlbar{background:var(--be-surface-2,#eef3f0);border-radius:5px;height:7px;overflow:hidden}
.bzc-wlbar span{display:block;height:7px;border-radius:5px}
.bzc-wlv{text-align:right;font-weight:800;font-size:13px}
@media (max-width:620px){.bzc-wlrow{grid-template-columns:24px 1fr 60px}.bzc-wlbar{display:none}}