/* BLOOOW · BA business detail refinement (October 2026)
   Applied after the canonical listing-detail.css. Visual only: preserve
   gallery/lightbox, catalog, analytics, engagement and responsive DOM order.
   Scoped to the public listing-detail template so other pages are unchanged. */
.listing-detail-refresh-page {
  --ld-ink: #111b30;
  --ld-muted: #465773;
  --ld-panel: #ffffff;
  --ld-soft: #f3f6fc;
  --ld-border: #c8d4e7;
  --ld-outline: #9db0d1;
  --ld-blue: #1647eb;
  --ld-blue-soft: #e6edff;
  --ld-shadow: 0 10px 28px rgba(16,42,88,.09);
  --ld-nav: rgba(255,255,255,.96);
}
:root[data-theme="dark"] .listing-detail-refresh-page {
  --ld-ink: #f6f8ff;
  --ld-muted: #c1cde5;
  --ld-panel: #172137;
  --ld-soft: #222e49;
  --ld-border: #4b5d80;
  --ld-outline: #748bb6;
  --ld-blue: #a9c1ff;
  --ld-blue-soft: #233e75;
  --ld-shadow: 0 13px 30px rgba(0,0,0,.30);
  --ld-nav: #172137;
}

/* LISTING DETAIL HEADER — compact scenic top bar, no search or onboarding CTA.
   The marketplace remains the canonical destination for searching/filtering.
   Reuse the homepage image if installed; fall back to the included city illustration. */
.listing-detail-refresh-page .blooow-header {
  position: relative;
  isolation: isolate;
  z-index: 30;
  width: min(calc(100% - 28px), 1560px);
  min-height: 100px;
  margin: 12px auto 0;
  padding: 14px clamp(14px, 2.6vw, 36px);
  overflow: visible;
  border: 1.5px solid var(--ld-border);
  border-radius: 23px;
  background: var(--ld-panel);
  box-shadow: var(--ld-shadow);
  color: var(--ld-ink);
}
.listing-detail-refresh-page .blooow-header::before {
  content: "";
  position: absolute;
  z-index: -1;
  inset: 0;
  border-radius: inherit;
  pointer-events: none;
  background-image: url("../images/home/businesses.b8a44842eaf0.webp"), url("../images/listings/detail-skyline.4d4bbb5ded7b.svg");
  background-position: 72% 52%, 75% 55%;
  background-size: cover, cover;
  background-repeat: no-repeat;
  opacity: .64;
  -webkit-mask-image: linear-gradient(90deg, transparent 4%, transparent 38%, #000 91%);
  mask-image: linear-gradient(90deg, transparent 4%, transparent 38%, #000 91%);
}
:root[data-theme="dark"] .listing-detail-refresh-page .blooow-header::before { opacity: .49; }
.listing-detail-refresh-page .blooow-header-top,
.listing-detail-refresh-page .blooow-header-frame {
  width: 100%;
  max-width: 100%;
  min-height: 70px;
  margin: 0;
  padding: 0;
  display: grid;
  grid-template-columns: minmax(110px,145px) minmax(0,1fr) auto;
  align-items: center;
  gap: clamp(8px, 1.5vw, 22px);
}
.listing-detail-refresh-page .blooow-header-brand {
  position: relative !important;
  inset: auto !important;
  z-index: 1;
  justify-self: start;
  width: clamp(108px, 10vw, 138px) !important;
  max-width: 100%;
  height: auto !important;
  aspect-ratio: 1134 / 780;
  margin: 0;
  padding: 0;
}
.listing-detail-refresh-page .blooow-header-brand .blooow-brand-lockup { width:100%;height:100%; }
.listing-detail-refresh-page .blooow-header-slogan { display: none !important; }
.listing-detail-refresh-page .blooow-header-center {width:100%;min-width:0;}
.listing-detail-refresh-page .blooow-main-nav-shell {width:100%;margin:0;padding:0;}
.listing-detail-refresh-page .blooow-main-nav-desktop {
  display:flex;
  width:max-content;
  max-width:100%;
  min-height:46px;
  margin:0 auto;
  padding:4px;
  gap:1px;
  border:1px solid var(--ld-border);
  border-radius:999px;
  background:var(--ld-nav);
  box-shadow: 0 2px 10px rgba(14,31,68,.06);
}
.listing-detail-refresh-page .blooow-main-nav-mobile {display:none;}
.listing-detail-refresh-page .blooow-main-nav a,
.listing-detail-refresh-page .blooow-nav-more summary {
  padding: 11px clamp(7px,.85vw,12px);
  font-size:clamp(.67rem,.78vw,.79rem);
  line-height:1.2;
  font-weight:800;
  color:var(--ld-ink);
  opacity:1;
}
.listing-detail-refresh-page .blooow-main-nav a.active,
.listing-detail-refresh-page .blooow-main-nav a:hover,
.listing-detail-refresh-page .blooow-main-nav a:focus-visible,
.listing-detail-refresh-page .blooow-nav-more.active > summary,
.listing-detail-refresh-page .blooow-nav-more[open] > summary {
  color:var(--ld-blue);
  background:var(--ld-blue-soft);
}
.listing-detail-refresh-page .blooow-header-actions {
  display:flex;
  width:auto;
  min-width:0;
  align-items:center;
  justify-content:flex-end;
  gap:8px;
}
.listing-detail-refresh-page .home-language-switcher {
  display:flex;
  flex:0 0 auto;
  align-items:center;
  min-height:40px;
  padding:3px;
  gap:1px;
  border:1px solid var(--ld-border);
  border-radius:999px;
  background:var(--ld-nav);
}
.listing-detail-refresh-page .home-language-switcher form {display:flex;margin:0;}
.listing-detail-refresh-page .home-language-choice {
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:32px;
  padding:6px 9px;
  border:0;
  border-radius:999px;
  background:transparent;
  color:var(--ld-ink);
  font:800 .72rem/1.2 Inter,"Noto Sans Sinhala","Noto Sans Tamil",system-ui,sans-serif;
  white-space:nowrap;
  cursor:pointer;
}
.listing-detail-refresh-page .home-language-choice.is-current {
  color:var(--ld-blue);
  background:var(--ld-blue-soft);
}
.listing-detail-refresh-page .home-language-choice:not(.is-current):hover {background:var(--ld-soft);}
.listing-detail-refresh-page .blooow-header-actions .blooow-theme-toggle {
  position:relative;
  display:grid;
  place-items:center;
  flex:0 0 42px;
  width:42px;
  height:42px;
  min-width:42px;
  padding:0;
  overflow:hidden;
  border:1.5px solid #bd8529;
  border-radius:50%;
  background:linear-gradient(145deg,#fffefa,#ffedc9);
  box-shadow:0 2px 9px rgba(116,68,0,.12);
}
.listing-detail-refresh-page .blooow-header-actions .blooow-theme-toggle::before {display:none;}
.listing-detail-refresh-page .blooow-header-actions .blooow-theme-icon-stage,
:root[data-theme="dark"] .listing-detail-refresh-page .blooow-header-actions .blooow-theme-icon-stage,
:root[data-theme="light"] .listing-detail-refresh-page .blooow-header-actions .blooow-theme-icon-stage {
  position:absolute;
  inset:0;
  display:block;
  width:auto;
  height:auto;
  border-radius:50%;
  background:none;
  box-shadow:none;
  transform:none !important;
}
.listing-detail-refresh-page .blooow-header-actions .blooow-theme-icon {
  position:absolute;
  inset:auto;
  top:50%; left:50%;
  width:22px; height:22px;
  margin:0;
  stroke-width:2.2;
  transform:translate(-50%,-50%) !important;
}
:root[data-theme="light"] .listing-detail-refresh-page .blooow-header-actions .blooow-theme-sun {display:block;opacity:1;color:#b46c00;}
:root[data-theme="light"] .listing-detail-refresh-page .blooow-header-actions .blooow-theme-moon {display:none;}
:root[data-theme="dark"] .listing-detail-refresh-page .blooow-header-actions .blooow-theme-toggle {
  border-color:#829ae7;
  background:linear-gradient(145deg,#26365e,#111f41);
  box-shadow:0 2px 11px rgba(0,0,0,.28);
}
:root[data-theme="dark"] .listing-detail-refresh-page .blooow-header-actions .blooow-theme-moon {display:block;opacity:1;color:#e0e9ff;}
:root[data-theme="dark"] .listing-detail-refresh-page .blooow-header-actions .blooow-theme-sun {display:none;}
.listing-detail-refresh-page .blooow-header-actions .blooow-theme-toggle:focus-visible {outline:3px solid var(--ld-blue);outline-offset:3px;}

/* Stronger surface boundaries: never rely on shadows alone in light mode. */
.listing-detail-refresh-page .listing-detail-shell {
  --detail-card-border: var(--ld-border);
  --detail-card-soft: var(--ld-soft);
  --detail-muted: var(--ld-muted);
  --detail-blue: var(--ld-blue);
  width:min(calc(100% - 28px), 1270px);
  padding-top:18px;
}
.listing-detail-refresh-page .listing-gallery-card,
.listing-detail-refresh-page .listing-summary-card,
.listing-detail-refresh-page .listing-description-panel,
.listing-detail-refresh-page .detail-side-card,
.listing-detail-refresh-page .listing-map-preview,
.listing-detail-refresh-page .related-section {
  border:1.5px solid var(--ld-border);
  border-radius:17px;
  background:var(--ld-panel);
  color:var(--ld-ink);
  box-shadow:var(--ld-shadow);
}
.listing-detail-refresh-page .storefront-page-heading { margin: 5px 0 20px; }
.listing-detail-refresh-page .storefront-page-heading h1 {
  max-width: 100%;
  font-size:clamp(1.7rem,3.25vw,3rem);
  letter-spacing:-.045em;
  line-height:1.14;
}
.listing-detail-refresh-page .storefront-heading-overline .listing-kind-pill {
  border:1px solid color-mix(in srgb,var(--ld-blue) 48%,var(--ld-border));
  background:var(--ld-blue-soft);
  color:var(--ld-blue);
  font-weight:900;
}
.listing-detail-refresh-page .storefront-verified-mark {
  padding:5px 9px;
  border-radius:999px;
  border:1px solid #6ed6a1;
  background:#def8e9;
  color:#087a43;
  font-weight:900;
}
:root[data-theme="dark"] .listing-detail-refresh-page .storefront-verified-mark {
  background:#153d32;
  color:#83f2bb;
  border-color:#2b9669;
}
.listing-detail-refresh-page .storefront-heading-subtitle { color:var(--ld-muted); font-weight:670; }
.listing-detail-refresh-page .listing-breadcrumbs { border-color:var(--ld-border);background:var(--ld-soft); }
.listing-detail-refresh-page .listing-breadcrumb-current [aria-current="page"] {color:var(--ld-ink);}

/* Gallery: retain contain-fit for real posters, logos and all zoom behavior. */
.listing-detail-refresh-page .listing-gallery-card { overflow:hidden; }
.listing-detail-refresh-page .listing-main-media { background:#090c14; }
.listing-detail-refresh-page .gallery-thumbnails {
  gap:9px;
  padding:12px;
  border-top:1px solid var(--ld-border);
  background:var(--ld-panel);
}
.listing-detail-refresh-page .gallery-thumbnail {
  width:76px;
  border:2px solid var(--ld-outline);
  border-radius:11px;
  opacity:.82;
  background:#090c14;
  transition: border-color .16s, box-shadow .16s, opacity .16s;
}
.listing-detail-refresh-page .gallery-thumbnail.selected,
.listing-detail-refresh-page .gallery-thumbnail[aria-pressed="true"] {
  border:3px solid #2b5cf5;
  opacity:1;
  box-shadow:0 0 0 2px var(--ld-panel),0 0 0 4px #90afff;
}
.listing-detail-refresh-page .gallery-thumbnail:hover,
.listing-detail-refresh-page .gallery-thumbnail:focus-visible {
  border-color:var(--ld-blue);
  opacity:1;
  outline:2px solid var(--ld-blue);
  outline-offset:2px;
}
.listing-detail-refresh-page .gallery-nav {background:rgba(10,19,42,.82);border:1.5px solid rgba(255,255,255,.82);color:#fff;}
.listing-detail-refresh-page .gallery-counter {border:1px solid rgba(255,255,255,.5);background:rgba(8,15,32,.85);}

/* Connect card: strong action affordances and distinct supporting elements. */
.listing-detail-refresh-page .listing-summary-card {padding:20px;gap:13px;}
.listing-detail-refresh-page .listing-summary-topline {padding-bottom:9px;border-bottom:1px solid var(--ld-border);}
.listing-detail-refresh-page .listing-summary-topline .detail-eyebrow {color:var(--ld-ink);}
.listing-detail-refresh-page .listing-reference {opacity:1;color:var(--ld-muted);}
.listing-detail-refresh-page .verification-panel {
  border:1px solid color-mix(in srgb,#4479ed 45%,var(--ld-border));
  background:color-mix(in srgb,#3b70ff 9%,var(--ld-panel));
}
.listing-detail-refresh-page .verification-panel strong { color:var(--ld-blue); }
.listing-detail-refresh-page .verification-panel p { color:var(--ld-muted);opacity:1; }
.listing-detail-refresh-page .desktop-contact-actions {gap:10px;}
.listing-detail-refresh-page .desktop-contact-actions .contact-button {
  min-height:47px;
  border-radius:11px;
  border-width:1.5px;
  font-weight:900;
  box-shadow:0 4px 12px rgba(0,0,0,.11);
}
.listing-detail-refresh-page .desktop-contact-actions .contact-button-call { background:#d82842;border-color:#af1b31;color:#fff; }
.listing-detail-refresh-page .desktop-contact-actions .contact-button-whatsapp { background:#069b55;border-color:#08723f;color:#fff; }
.listing-detail-refresh-page .desktop-contact-actions .contact-button-call:hover {background:#b51e35;color:#fff;}
.listing-detail-refresh-page .desktop-contact-actions .contact-button-whatsapp:hover {background:#067a43;color:#fff;}
.listing-detail-refresh-page .listing-action-row .detail-action-button {
  min-height:43px;
  border:1.5px solid var(--ld-outline);
  border-radius:11px;
  background:var(--ld-soft);
  color:var(--ld-ink);
  font-weight:800;
}
.listing-detail-refresh-page .listing-action-row .detail-action-button:hover,
.listing-detail-refresh-page .listing-action-row .detail-action-button:focus-visible,
.listing-detail-refresh-page .listing-action-row .detail-action-button.selected {
  background:var(--ld-blue-soft);
  color:var(--ld-blue);
  border-color:var(--ld-blue);
}
.listing-detail-refresh-page .listing-socials-top {border-top:1px solid var(--ld-border);}
.listing-detail-refresh-page .engagement-row {color:var(--ld-muted);}
.listing-detail-refresh-page .storefront-published {color:var(--ld-muted);border-top-color:var(--ld-border);}

/* Offerings before About: existing order deliberately left untouched. */
.listing-detail-refresh-page .storefront-story-stack {gap:16px;}
.listing-detail-refresh-page .listing-description-panel {padding:22px 24px;}
.listing-detail-refresh-page .storefront-offerings .business-catalog-heading,
.listing-detail-refresh-page .related-heading {gap:8px;}
.listing-detail-refresh-page .storefront-offerings .business-catalog-count {
  min-width:28px;
  padding:4px 8px;
  border-radius:999px;
  background:var(--ld-blue-soft);
  color:var(--ld-blue);
  font-weight:900;
  text-align:center;
}
.listing-detail-refresh-page .storefront-offerings .related-compact-card,
.listing-detail-refresh-page .related-section .related-compact-card {
  border:1.5px solid var(--ld-border);
  border-radius:13px;
  background:var(--ld-panel);
  box-shadow:0 3px 12px rgba(10,29,68,.065);
  transition:border-color .18s,box-shadow .18s,transform .18s;
}
.listing-detail-refresh-page .storefront-offerings .related-compact-card:hover,
.listing-detail-refresh-page .related-section .related-compact-card:hover,
.listing-detail-refresh-page .storefront-offerings .related-compact-card:focus-visible,
.listing-detail-refresh-page .related-section .related-compact-card:focus-visible {
  border-color:var(--ld-blue);
  box-shadow:0 6px 18px rgba(28,73,145,.18);
  transform:translateY(-2px);
  outline:0;
}
.listing-detail-refresh-page .storefront-about .listing-description {color:var(--ld-ink);line-height:1.75;}
.listing-detail-refresh-page .listing-side-stack {gap:14px;}
.listing-detail-refresh-page .detail-side-card {padding:20px 22px;}
.listing-detail-refresh-page .detail-side-card p,
.listing-detail-refresh-page .side-meta {color:var(--ld-muted);}
.listing-detail-refresh-page .listing-map-preview {overflow:hidden;}
.listing-detail-refresh-page .listing-map-preview-frame {background:var(--ld-soft);}
.listing-detail-refresh-page .listing-map-preview-action {background:rgba(10,19,40,.92);color:#fff;border:1px solid rgba(255,255,255,.32);}
.listing-detail-refresh-page .related-section {padding:20px 22px;}
.listing-detail-refresh-page .related-heading > a {color:var(--ld-blue);font-weight:850;}
.listing-detail-refresh-page .public-profile-notice {border-color:#c69732;}
/* Keyboard access and reduced motion. */
.listing-detail-refresh-page a:focus-visible,
.listing-detail-refresh-page button:focus-visible {outline:3px solid var(--ld-blue);outline-offset:3px;}
@media (prefers-reduced-motion:reduce) {
  .listing-detail-refresh-page .gallery-thumbnail,
  .listing-detail-refresh-page .related-compact-card {transition:none;transform:none;}
}

/* A single visible heading per section — no repeated "ABOUT / About" or
   "PRODUCTS / Available products" combinations. */
.listing-detail-refresh-page .storefront-about h2 {margin-top:0;}
.listing-detail-refresh-page .storefront-offerings .business-catalog-group:first-child {margin-top:0;}
.listing-detail-refresh-page .storefront-offerings .business-catalog-heading h3 {
  margin:0;
  font-size:clamp(1rem,1.6vw,1.15rem);
  font-weight:850;
  color:var(--ld-ink);
}
.listing-detail-refresh-page .storefront-related-inline .related-heading h2,
.listing-detail-refresh-page > .related-section .related-heading h2 {margin-top:0;}

/* Responsive: retain the same five tabs as the marketplace without
   creating an extra toolbar row or overflowing in Sinhala/Tamil. */
@media(max-width:1120px) {
  .listing-detail-refresh-page .blooow-header-top,
  .listing-detail-refresh-page .blooow-header-frame {grid-template-columns:108px minmax(0,1fr) auto;gap:8px;}
  .listing-detail-refresh-page .blooow-main-nav-desktop a {padding-inline:6px;}
  .listing-detail-refresh-page .home-language-choice {padding-inline:7px;}
}
@media(max-width:980px) {
  .listing-detail-refresh-page .blooow-header {min-height:0;padding:12px 15px;}
  .listing-detail-refresh-page .blooow-header-top,
  .listing-detail-refresh-page .blooow-header-frame {
    grid-template-columns:minmax(104px,1fr) auto;
    grid-template-areas:"brand actions" "nav nav";
    row-gap:8px;
  }
  .listing-detail-refresh-page .blooow-header-brand {grid-area:brand;width:clamp(107px,17vw,130px) !important;}
  .listing-detail-refresh-page .blooow-header-center {grid-area:nav;}
  .listing-detail-refresh-page .blooow-header-actions {grid-area:actions;}
  .listing-detail-refresh-page .blooow-main-nav-desktop {display:none;}
  .listing-detail-refresh-page .blooow-main-nav-mobile {
    display:flex;
    justify-content:space-between;
    width:100%;
    min-height:41px;
    padding:3px;
    gap:2px;
    border:1px solid var(--ld-border);
    border-radius:999px;
    background:var(--ld-nav);
  }
  .listing-detail-refresh-page .blooow-main-nav-mobile > a,
  .listing-detail-refresh-page .blooow-main-nav-mobile > .blooow-nav-more {flex:1 1 0;min-width:0;text-align:center;}
  .listing-detail-refresh-page .blooow-main-nav-mobile > a,
  .listing-detail-refresh-page .blooow-main-nav-mobile > .blooow-nav-more > summary {
    display:flex;justify-content:center;align-items:center;
    min-height:32px;padding:6px 3px;font-size:.71rem;
  }
  .listing-detail-refresh-page .blooow-header::before {
    background-position:75% 50%,75% 50%;
    -webkit-mask-image:linear-gradient(90deg,transparent 0%,transparent 28%,#000 100%);
    mask-image:linear-gradient(90deg,transparent 0%,transparent 28%,#000 100%);
    opacity:.47;
  }
}
@media(max-width:640px) {
  .listing-detail-refresh-page .blooow-header {width:calc(100% - 16px);margin-top:8px;padding:10px 12px;border-radius:19px;}
  .listing-detail-refresh-page .blooow-header-top,
  .listing-detail-refresh-page .blooow-header-frame {grid-template-columns:minmax(88px,1fr) auto;gap:8px;}
  .listing-detail-refresh-page .blooow-header-brand {width:clamp(104px,24vw,128px) !important;}
  .listing-detail-refresh-page .home-language-switcher {min-height:35px;padding:2px;}
  .listing-detail-refresh-page .home-language-choice {padding:5px 6px;min-height:30px;font-size:.67rem;}
  .listing-detail-refresh-page .blooow-header-actions {gap:6px;}
  .listing-detail-refresh-page .blooow-header-actions .blooow-theme-toggle {width:38px;height:38px;min-width:38px;flex-basis:38px;}
  .listing-detail-refresh-page .blooow-header-actions .blooow-theme-icon {width:21px;height:21px;}
  .listing-detail-refresh-page .listing-detail-shell {width:calc(100% - 16px);padding-top:13px;}
  .listing-detail-refresh-page .storefront-page-heading {margin-bottom:12px;}
  .listing-detail-refresh-page .listing-summary-card,
  .listing-detail-refresh-page .listing-description-panel,
  .listing-detail-refresh-page .detail-side-card,
  .listing-detail-refresh-page .related-section {padding:16px;}
  .listing-detail-refresh-page .listing-main-media {aspect-ratio:4/3;max-height:420px;}
  .listing-detail-refresh-page .gallery-thumbnail {width:69px;}
  .listing-detail-refresh-page .listing-breadcrumbs {margin-bottom:12px;}
  .listing-detail-refresh-page .storefront-story-stack {gap:11px;}
  .listing-detail-refresh-page .storefront-offerings .business-catalog-list {grid-template-columns:1fr;}
}
@media(max-width:355px) {
  .listing-detail-refresh-page .blooow-header {padding:10px 9px;}
  .listing-detail-refresh-page .blooow-header-brand {width:96px !important;}
  .listing-detail-refresh-page .home-language-choice {font-size:.60rem;padding:5px 4px;}
  .listing-detail-refresh-page .blooow-header-actions .blooow-theme-toggle {width:35px;height:35px;min-width:35px;flex-basis:35px;}
  .listing-detail-refresh-page .blooow-main-nav-mobile > a,
  .listing-detail-refresh-page .blooow-main-nav-mobile > .blooow-nav-more > summary {font-size:.64rem;padding:6px 2px;}
}

/* Legacy V4 sets some dark-mode panels to near-black with a more-specific
   selector; explicitly restore the layered card surface for this redesign. */
:root[data-theme="dark"] .listing-detail-refresh-page .listing-gallery-card,
:root[data-theme="dark"] .listing-detail-refresh-page .listing-summary-card,
:root[data-theme="dark"] .listing-detail-refresh-page .listing-description-panel,
:root[data-theme="dark"] .listing-detail-refresh-page .detail-side-card,
:root[data-theme="dark"] .listing-detail-refresh-page .listing-map-preview,
:root[data-theme="dark"] .listing-detail-refresh-page .related-section {
  background:var(--ld-panel);
  border-color:var(--ld-border);
  color:var(--ld-ink);
}
:root[data-theme="dark"] .listing-detail-refresh-page .storefront-offerings .related-compact-card,
:root[data-theme="dark"] .listing-detail-refresh-page .related-section .related-compact-card {
  background:var(--ld-soft);
  border-color:var(--ld-border);
  color:var(--ld-ink);
}

/* The detail hero already masks the image. Refine its light-only transition. */
:root:not([data-theme="dark"]) .listing-detail-refresh-page .blooow-header::before {
  opacity:.56;
  -webkit-mask-image:linear-gradient(90deg, transparent 0%, transparent 46%, rgba(0,0,0,.28) 68%, #000 100%);
  mask-image:linear-gradient(90deg, transparent 0%, transparent 46%, rgba(0,0,0,.28) 68%, #000 100%);
}