/* glassified skin fills */
:root {
  --bn-skin-glass: rgba(255, 255, 255, 0.34);
  --bn-skin-glass-soft: rgba(255, 255, 255, 0.28);
}
/**
 * decto-skin.css — thin hotfix layer AFTER tokens + primitives + ui + page bundles.
 * Prefer fixing sources over !important. Keep only breakage patches here.
 */

/* Soft token sync for bundles that redefine :root (no dark lock) */
:root,
[data-theme='light'],
html,
html[data-theme='light'],
body,
body.app-shell,
body.auth-page,
body.index-page {
  --bn-cream: #f7f6f3 !important;
  --bn-cream-2: #f1f0ec !important;
  --bn-ivory: #faf9f7 !important;
  --bn-white: #ffffff !important;
  --bn-text: #142821 !important;
  --bn-text-2: #3d4f48 !important;
  --bn-text-3: #66756e !important;
  --bn-color-text: #142821 !important;
  --bn-color-text-secondary: #3d4f48 !important;
  --bn-color-text-muted: #66756e !important;
  --bn-surface: rgba(255, 255, 255, 0.78) !important;
  --bn-surface-2: rgba(255, 255, 255, 0.62) !important;
  --bn-color-bg: #f7f6f3 !important;
  --bn-color-bg-subtle: #f1f0ec !important;
  --bn-color-surface: rgba(255, 255, 255, 0.78) !important;
  --bn-skin-glass: rgba(255, 255, 255, 0.58) !important;
  --bn-skin-glass-soft: rgba(255, 255, 255, 0.42) !important;
  --bn-text-body-size: 1.0625rem !important;
  --bn-text-body-lh: 1.78 !important;
  --bn-text-body-sm-size: 0.9375rem !important;
  --bn-text-caption-size: 0.875rem !important;
  --bn-text-label-size: 0.9375rem !important;
  --bn-text-button-size: 1.0625rem !important;
  --bn-ambient-bg:
    radial-gradient(ellipse 90% 55% at 12% 0%, rgba(255, 255, 255, 0.9), transparent 55%),
    radial-gradient(ellipse 70% 50% at 92% 8%, rgba(232, 239, 234, 0.55), transparent 52%),
    linear-gradient(180deg, #faf9f7 0%, #f5f4f0 46%, #f0efea 100%) !important;
}

html,
body,
body.app-shell,
body.index-page,
body.auth-page {
  background-color: #f7f6f3 !important;
  background-image: var(--bn-ambient-bg) !important;
  background-attachment: fixed !important;
  background-repeat: no-repeat !important;
  background-size: cover !important;
  color: var(--bn-color-text, #142821);
  font-family: var(--bn-font-body);
  font-size: var(--bn-text-body-size, 1.0625rem) !important;
  line-height: var(--bn-text-body-lh, 1.78) !important;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}

/* --------------------------------------------------------------------------
   2) Never blank pages (motion / FOUC leftovers)
   -------------------------------------------------------------------------- */
.pm-reveal,
.pm-reveal:not(.pm-visible),
.pm-page-enter,
.bn-lazy-enter,
.bn-lazy-enter:not(.bn-entered),
.bn-app-page,
.bn-app-page.pm-page-enter,
.bn-profile-page,
.bn-feed-page,
.bn-explore-page,
.bn-chat-page,
.bn-settings-page {
  opacity: 1 !important;
  visibility: visible !important;
  transform: none !important;
  filter: none !important;
}

/* --------------------------------------------------------------------------
   3) Shell integrity (Django: flex on INNERS only)
   -------------------------------------------------------------------------- */
body.app-shell .app-header,
body.app-shell .app-header--luxury {
  display: block !important;
  height: var(--bn-header-h) !important;
  background: var(--bn-glass-1, rgba(255, 255, 255, 0.5)) !important;
  border-bottom: 1px solid var(--bn-glass-border-ink, rgba(23, 56, 47, 0.08)) !important;
  box-shadow: var(--bn-glass-shadow-1, 0 8px 24px rgba(15, 36, 29, 0.05)) !important;
}
body.app-shell .app-header-inner {
  display: flex !important;
  align-items: center !important;
}
body.app-shell .bottom-nav,
body.app-shell .bottom-nav--luxury {
  display: block !important;
  position: fixed !important;
  left: 0 !important;
  right: 0 !important;
  inset-inline: 0 !important;
  bottom: 0 !important;
  top: auto !important;
  z-index: 300 !important;
  width: 100% !important;
  height: calc(var(--bn-dock-h) + env(safe-area-inset-bottom, 0px)) !important;
  min-height: calc(var(--bn-dock-h) + env(safe-area-inset-bottom, 0px)) !important;
  max-height: calc(var(--bn-dock-h) + env(safe-area-inset-bottom, 0px)) !important;
  padding: 0 !important;
  padding-bottom: env(safe-area-inset-bottom, 0px) !important;
  margin: 0 !important;
  background: var(--bn-skin-glass) !important;
  border-top: 1.5px solid rgba(23, 56, 47, 0.14) !important;
  border-radius: 0 !important;
  box-shadow: 0 -6px 20px rgba(23, 56, 47, 0.07) !important;
  grid-template-columns: none !important;
  transform: translate3d(0, 0, 0) !important;
  -webkit-transform: translate3d(0, 0, 0) !important;
  backface-visibility: hidden !important;
  -webkit-backface-visibility: hidden !important;
  pointer-events: auto !important;
  overflow: hidden !important;
  /* stop iOS/Firefox mobile toolbar resize from stretching the dock */
  transition: none !important;
}
/* Kill leftover floating pill dock (site bundle / luxury) */
body.app-shell .global-auth-bottom-nav,
body.bn-authed .global-auth-bottom-nav {
  position: fixed !important;
  left: 0 !important;
  right: 0 !important;
  bottom: 0 !important;
  top: auto !important;
  width: 100% !important;
  height: calc(var(--bn-dock-h) + env(safe-area-inset-bottom, 0px)) !important;
  min-height: calc(var(--bn-dock-h) + env(safe-area-inset-bottom, 0px)) !important;
  max-height: calc(var(--bn-dock-h) + env(safe-area-inset-bottom, 0px)) !important;
  padding: 0 !important;
  padding-bottom: env(safe-area-inset-bottom, 0px) !important;
  background: var(--bn-skin-glass) !important;
  border-radius: 0 !important;
  pointer-events: auto !important;
  transform: translate3d(0, 0, 0) !important;
}
body.app-shell .global-auth-bottom-nav .bottom-nav-inner,
body.bn-authed .global-auth-bottom-nav .bottom-nav-inner {
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  padding: 0 !important;
  min-height: var(--bn-dock-h) !important;
  height: var(--bn-dock-h) !important;
  max-height: var(--bn-dock-h) !important;
}
body.app-shell .bottom-nav-inner {
  display: grid !important;
  grid-template-columns: repeat(5, 1fr) !important;
  height: var(--bn-dock-h) !important;
  min-height: var(--bn-dock-h) !important;
  max-height: var(--bn-dock-h) !important;
}
body.app-shell .bottom-nav-item,
body.app-shell .global-auth-bottom-nav .bottom-nav-item {
  font-size: 0.8125rem !important;
  font-weight: 700 !important;
  letter-spacing: -0.01em;
  gap: 4px !important;
  line-height: 1.25 !important;
}
body.app-shell .bottom-nav-item svg,
body.app-shell .bottom-nav-item .bn-ui-icon,
body.app-shell .global-auth-bottom-nav .bottom-nav-item svg,
body.app-shell .global-auth-bottom-nav .bottom-nav-item .bn-ui-icon {
  width: 24px !important;
  height: 24px !important;
}
body.app-shell .bottom-nav,
body.app-shell .bottom-nav--luxury,
body.app-shell .global-auth-bottom-nav,
body.app-shell .bottom-nav-inner,
body.app-shell .global-auth-bottom-nav .bottom-nav-inner,
body.app-shell .app-header,
body.app-shell .app-header-inner {
  direction: rtl !important;
}

html[dir='rtl'],
html,
body.app-shell {
  direction: rtl !important;
}

.bn-media-studio__canvas {
  position: relative;
  z-index: 1;
}

.bn-ms-crop-overlay {
  z-index: 6 !important;
}

.bn-ms-crop-corner,
.bn-ms-crop-edge {
  z-index: 7 !important;
  pointer-events: auto !important;
}
body.app-shell .bottom-nav-inner {
  overflow: visible !important;
}
body.app-shell .bottom-nav-item--create,
body.app-shell .bottom-nav-item[data-nav="create"] {
  overflow: visible !important;
  padding-top: 0 !important;
}
body.app-shell .bottom-nav-item--create > span:first-child,
body.app-shell .bottom-nav-item[data-nav="create"] > span:first-child {
  display: grid !important;
  place-items: center !important;
  transform: translateY(-3px) !important;
  line-height: 0 !important;
}
body.app-shell .bottom-nav-item--create svg,
body.app-shell .bottom-nav-item[data-nav="create"] svg,
body.app-shell .bottom-nav-item--create .bn-ui-icon,
body.app-shell .bottom-nav-item[data-nav="create"] .bn-ui-icon {
  width: 26px !important;
  height: 26px !important;
  overflow: visible !important;
}
body.app-shell #navbar,
body.app-shell nav.navbar,
body.app-shell .navbar--premium {
  display: none !important;
}

/* --------------------------------------------------------------------------
   4) Hide cinematic / gold-frame / glow leftovers (display only)
   -------------------------------------------------------------------------- */
.bn-profile-gold-frame,
.bn-profile-cover-mesh,
.bn-settings-lux-glow,
.patient-ai-lux-banner__aurora,
.dp-owner-hero__glow,
.dp-owner-hero-btn__glow,
.composer-modal__aurora,
.lux-landing-glow,
.cinema-vignette,
.bn-gold-frame,
[class*='cinematic'],
.dp-cover-vignette {
  display: none !important;
}

body.bn-profile--gold-frame .bn-profile-page,
body.doctor-profile .bn-profile-page,
body.clinic-profile .bn-profile-page {
  filter: none;
}

/* Soften leftover gold borders into mist/botanical */
.dp-gold-avatar-ring,
.bn-profile-avatar-ring.dp-gold-avatar-ring,
.dp-visitor-specialty-gold {
  box-shadow: none;
  border-color: var(--bn-border);
  color: var(--bn-green-mid);
  background: var(--bn-mist);
}

/* --------------------------------------------------------------------------
   5) Explore — modal ONLY when .open
   -------------------------------------------------------------------------- */
#explorePostModal,
.explore-modal {
  display: none !important;
  pointer-events: none !important;
}
#explorePostModal.open,
.explore-modal.open,
#explorePostModal.is-open,
.explore-modal.is-open,
#explorePostModal[aria-hidden='false'].open {
  display: flex !important;
  pointer-events: auto !important;
  position: fixed !important;
  inset: 0 !important;
  z-index: var(--bn-z-modal) !important;
  background: rgba(16, 26, 23, 0.88) !important;
  align-items: center;
  justify-content: center;
}
.explore-post-seo,
.explore-post-seo--index,
.explore-post-seo--sr,
#explorePostSeo {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  overflow: hidden !important;
  clip: rect(0, 0, 0, 0) !important;
  white-space: nowrap !important;
  border: 0 !important;
  padding: 0 !important;
  margin: -1px !important;
}

/* --------------------------------------------------------------------------
   6) Stories — keep circles circular & sized
   -------------------------------------------------------------------------- */
.story-item,
.story-bubble,
.bn-story-item {
  flex: 0 0 auto;
}
.story-avatar,
.story-avatar-wrap,
.story-item img,
.bn-story-avatar,
.story-ring {
  width: 66px !important;
  height: 66px !important;
  max-width: 66px !important;
  max-height: 66px !important;
  border-radius: 50% !important;
  object-fit: cover !important;
}

/* --------------------------------------------------------------------------
   7) Profile avatars — never full-bleed giants
   -------------------------------------------------------------------------- */
.bn-profile-avatar,
.dp-avatar,
.dp-owner-hero__avatar,
.bn-profile-avatar-ring,
.dp-avatar-ring,
.bn-profile-avatar-ring img,
.dp-avatar-ring img {
  width: 76px !important;
  height: 76px !important;
  max-width: 76px !important;
  max-height: 76px !important;
  border-radius: 50% !important;
  object-fit: cover !important;
}

/* Patient owner — ring must beat flat 76px lock (22s) */
body.patient-profile .pp-avatar-ring,
body.patient-profile-owner .pp-avatar-ring,
.bn-profile-page.pp-own-profile .pp-avatar-ring {
  width: 108px !important;
  height: 108px !important;
  max-width: 108px !important;
  max-height: 108px !important;
  padding: 3px !important;
  box-sizing: border-box !important;
  border-radius: 50% !important;
  background: linear-gradient(145deg, #c9a45e, #17382f) !important;
  display: grid !important;
  place-items: center !important;
  overflow: hidden !important;
}
body.patient-profile .pp-avatar,
body.patient-profile-owner .pp-avatar,
.bn-profile-page.pp-own-profile .pp-avatar,
body.patient-profile .pp-avatar-ring img,
body.patient-profile-owner .pp-avatar-ring img,
.bn-profile-page.pp-own-profile .pp-avatar-ring img {
  width: 100px !important;
  height: 100px !important;
  max-width: 100px !important;
  max-height: 100px !important;
  border-radius: 50% !important;
  object-fit: cover !important;
  border: 2.5px solid #fffaf2 !important;
}

.bn-profile-page.pp-own-profile #patientOwnerHero,
body.patient-profile-owner #patientOwnerHero {
  display: flex !important;
  flex-direction: column !important;
  opacity: 1 !important;
  visibility: visible !important;
}

body.patient-profile-owner .pp-owner-nav-stack:not([hidden]) {
  display: flex !important;
}

/* Owner profile always visible */
.bn-profile-page.dp-own-profile #doctorOwnerHero,
.bn-profile-page.cp-own-profile #clinicOwnerHero,
body.doctor-profile-owner #doctorOwnerHero,
body.clinic-profile-owner #clinicOwnerHero {
  display: flex !important;
  flex-direction: column !important;
  opacity: 1 !important;
  visibility: visible !important;
}
.bn-profile-page.dp-own-profile .bn-profile-social-shell > .bn-profile-hero,
.bn-profile-page.cp-own-profile .bn-profile-social-shell > .bn-profile-hero {
  display: none !important;
}

/* --------------------------------------------------------------------------
   8) Feed / post detail — layout owned by decto-ui (#postDetailModal)
   -------------------------------------------------------------------------- */
/* (kept empty anchor — do not re-apply composer-modal styles) */

/* --------------------------------------------------------------------------
   9) Composer / publisher — usable sheet
   -------------------------------------------------------------------------- */
.composer-modal[aria-hidden='true'],
.composer-modal[hidden] {
  display: none !important;
}
.composer-sheet,
.composer-pro-sheet,
.dp-pub-hub__panel {
  background: var(--bn-skin-glass) !important;
  color: var(--bn-text) !important;
  border-radius: var(--bn-radius) var(--bn-radius) 0 0 !important;
  border: 1px solid var(--bn-border-soft) !important;
  box-shadow: var(--bn-shadow-lg) !important;
}
.composer-pro__header,
.composer-pro__footer,
.dp-pub-hub__head {
  background: var(--bn-surface) !important;
  border-color: var(--bn-border-soft) !important;
}
.composer-pro__input,
.composer-pro__textarea,
.composer-pro__field input,
.composer-pro__field textarea {
  background: var(--bn-surface) !important;
  border: 1px solid var(--bn-border) !important;
  border-radius: 14px !important;
  color: var(--bn-text) !important;
}

/* --------------------------------------------------------------------------
   10) Chat dock clearance (belt + suspenders with decto-chat.css)
   -------------------------------------------------------------------------- */
body.app-shell.bn-chat-active .main-content {
  padding-bottom: calc(var(--bn-dock-h) + env(safe-area-inset-bottom, 0px) + 12px) !important;
  overflow: hidden !important;
}
body.bn-chat-active #chatMessages,
body.bn-chat-active .bn-chat-messages,
body.bn-chat-active #chatConversationList {
  overflow-y: auto !important;
  min-height: 0 !important;
  -webkit-overflow-scrolling: touch;
}
body.bn-chat-active #chatCompose:not([hidden]) {
  position: relative !important;
  z-index: 5 !important;
  background: var(--bn-skin-glass) !important;
}

/* Landing mobile: declutter header — brand + CTA only in first row */
@media (max-width: 767px) {
  body.index-page .bl-topnav__links,
  body.index-page .landing-nav__links,
  .bl-landing-app-bar .bl-topnav__links {
    display: none !important;
  }
  body.index-page .bl-topnav,
  body.index-page .bl-header {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 10px !important;
    padding: 10px 14px !important;
  }
}

/* --------------------------------------------------------------------------
   12) Buttons — botanical primary, champagne accent sparingly
   -------------------------------------------------------------------------- */
.bn-btn--primary,
.btn-primary,
button.bn-btn--primary,
.dp-book-lux-cta,
.composer-pro__submit {
  background: var(--bn-green) !important;
  color: var(--bn-cream) !important;
  border: 0 !important;
  border-radius: 999px !important;
}
.bn-btn--ghost,
.btn-outline {
  background: transparent !important;
  color: var(--bn-green) !important;
  border: 1px solid var(--bn-border) !important;
  border-radius: 999px !important;
}

/* --------------------------------------------------------------------------
   13) PERF + scroll: pan-y on media; BA rail/handle capture horizontal drag
   -------------------------------------------------------------------------- */
.ba-slider,
.ba-slider.ba-slider--ds,
.ba-slider.ba-slider--pro,
.feed-post-media .ba-slider,
.explore-ba-mount .ba-slider,
.bn-feed-card__media .ba-slider,
.explore-card-media .ba-slider,
.explore-modal-media .ba-slider,
.bn-post-detail-media .ba-slider,
.post-carousel,
.post-carousel-track,
.feed-post-media,
.bn-feed-card__media {
  touch-action: pan-y !important;
  cursor: default !important;
}
.ba-slider.is-dragging,
.ba-slider.is-dragging .ba-slider-rail,
.ba-slider.is-dragging .ba-slider-handle {
  touch-action: none !important;
  cursor: ew-resize !important;
}
.ba-slider-rail,
.ba-slider-handle,
.ba-slider .ba-slider-handle,
.ba-slider .ba-slider-rail,
.feed-post-media .ba-slider-handle,
.feed-post-media .ba-slider-rail,
.explore-ba-mount .ba-slider-handle,
.explore-ba-mount .ba-slider-rail {
  pointer-events: auto !important;
  touch-action: none !important;
  cursor: ew-resize !important;
}
.ba-slider-rail {
  position: absolute !important;
  top: 0 !important;
  bottom: 0 !important;
  left: 50% !important;
  width: 56px !important;
  height: auto !important;
  transform: translateX(-50%) !important;
  z-index: 7 !important;
  background: transparent !important;
  border: 0 !important;
}
.ba-slider-handle,
.ba-slider .ba-slider-handle,
.feed-post-media .ba-slider-handle,
.explore-ba-mount .ba-slider-handle {
  top: 0 !important;
  bottom: 0 !important;
  width: 56px !important;
  height: auto !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  transform: translateX(-50%) !important;
  z-index: 8 !important;
}
.ba-handle-grip,
.ba-slider-handle .ba-handle-grip,
.ba-handle-grip--chevrons {
  position: absolute !important;
  top: 50% !important;
  left: 50% !important;
  bottom: auto !important;
  width: auto !important;
  height: auto !important;
  padding: 6px 8px !important;
  border-radius: 999px !important;
  border: 1px solid rgba(23, 56, 47, 0.12) !important;
  background: rgba(255, 255, 255, 0.72) !important;
  box-shadow: 0 4px 14px rgba(16, 37, 29, 0.16) !important;
  transform: translate(-50%, -50%) !important;
  pointer-events: none !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 6px !important;
  font-size: 0 !important;
  color: #17382F !important;
  filter: none !important;
  backdrop-filter: blur(6px) !important;
  -webkit-backdrop-filter: blur(6px) !important;
}
.ba-handle-grip::before,
.ba-handle-grip::after {
  display: none !important;
  content: none !important;
}
.ba-handle-grip i,
.ba-handle-grip .fa {
  display: none !important;
}
.ba-handle-grip .ba-chevron {
  display: block !important;
  width: 14px !important;
  height: 18px !important;
  color: #17382F !important;
}
.ba-slider-rail {
  position: absolute !important;
  top: 0 !important;
  bottom: 0 !important;
  width: 56px !important;
  transform: translateX(-50%) !important;
  z-index: 7 !important;
  touch-action: none !important;
  cursor: ew-resize !important;
  background: transparent !important;
  pointer-events: auto !important;
}
.ba-nav,
.ba-nav--prev,
.ba-nav--next {
  display: none !important;
  pointer-events: none !important;
  opacity: 0 !important;
  visibility: hidden !important;
}
.ba-slider::before,
.ba-slider::after {
  display: none !important;
  content: none !important;
}

/* Feed: one aspect box — kill nested 4/5 on BA (caption gap) */
.bn-feed-card__media {
  aspect-ratio: 4 / 5 !important;
  height: auto !important;
  max-height: none !important;
  overflow: hidden !important;
  position: relative !important;
}
.bn-feed-card__media .feed-post-media {
  position: absolute !important;
  inset: 0 !important;
  aspect-ratio: auto !important;
  width: 100% !important;
  height: 100% !important;
  max-height: none !important;
  overflow: hidden !important;
}
.bn-feed-card__media .feed-post-media img,
.bn-feed-card__media .feed-post-media video,
.bn-feed-card__media .bn-feed-media-img {
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  max-height: none !important;
}
.bn-feed-card__media .feed-post-media .ba-slider,
.bn-feed-card__media .ba-slider,
.feed-post-media .ba-slider,
.feed-post-media .post-carousel,
.bn-feed-card__media .post-carousel {
  aspect-ratio: auto !important;
  width: 100% !important;
  height: 100% !important;
  min-height: 100% !important;
  max-height: 100% !important;
  border-radius: 0 !important;
}
.bn-feed-card__body,
.bn-feed-card__caption,
.feed-post-caption {
  margin-top: 0 !important;
  padding-top: 0 !important;
}

.post-carousel {
  touch-action: pan-y pinch-zoom !important;
  overscroll-behavior-x: contain;
}

/* Explore — always 3 columns; tiles fill width */
.explore-app-grid,
#exploreMasonry,
.explore-masonry,
.iconic-bento,
body .bn-explore-page #exploreMasonry {
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: 4px !important;
}

/* Loading overlay must never stick and blank the page */
#loadingOverlay:not(.active):not(.show),
.loading-overlay:not(.active):not(.show) {
  display: none !important;
  opacity: 0 !important;
  visibility: hidden !important;
  pointer-events: none !important;
}

/* --------------------------------------------------------------------------
   14) Owner doctor / clinic profiles — professional botanical home
   -------------------------------------------------------------------------- */
.bn-profile-page.dp-own-profile,
.bn-profile-page.cp-own-profile,
body.doctor-profile-owner .bn-profile-page,
body.clinic-profile-owner .bn-profile-page {
  display: flex !important;
  flex-direction: column !important;
  gap: 14px !important;
  opacity: 1 !important;
  visibility: visible !important;
  min-height: 40vh !important;
  padding: 10px 12px 28px !important;
}

.bn-profile-page.dp-own-profile #doctorOwnerHero,
.bn-profile-page.cp-own-profile #clinicOwnerHero,
body.doctor-profile-owner #doctorOwnerHero,
body.clinic-profile-owner #clinicOwnerHero {
  display: flex !important;
  flex-direction: column !important;
  gap: 14px !important;
  opacity: 1 !important;
  visibility: visible !important;
  min-height: 120px !important;
  padding: 18px 16px !important;
  margin: 0 !important;
  border-radius: 22px !important;
  background:
    linear-gradient(145deg, #ffffff 0%, #faf9f5 55%, #eef5f1 100%) !important;
  border: 1px solid rgba(23, 56, 47, 0.08) !important;
  box-shadow: 0 10px 28px rgba(23, 56, 47, 0.06) !important;
  color: #17382f !important;
}

body.bn-profile--visitor #doctorOwnerHero,
body.bn-profile--visitor #clinicOwnerHero,
body.bn-profile--visitor #doctorOwnerActionDeck,
body.bn-profile--visitor #clinicOwnerActionDeck,
body.bn-profile--visitor [data-owner-only] {
  display: none !important;
}

/* Owner chrome: keep visible after refresh (pm-reveal must not stay at opacity 0) */
body.doctor-profile-owner .dp-owner-hero.pm-reveal,
body.doctor-profile-owner .dp-owner-nav-stack.pm-reveal,
body.clinic-profile-owner .dp-owner-hero.pm-reveal,
body.clinic-profile-owner .dp-owner-nav-stack.pm-reveal,
body.patient-profile-owner .pp-owner-hero.pm-reveal,
body.patient-profile-owner .pp-owner-nav-stack.pm-reveal,
body.patient-profile-owner #patientOwnerHero.pm-reveal,
body.doctor-profile-owner .pm-reveal.pm-visible,
body.clinic-profile-owner .pm-reveal.pm-visible,
body.patient-profile-owner .pm-reveal.pm-visible {
  opacity: 1 !important;
  visibility: visible !important;
  transform: none !important;
  filter: none !important;
}

/* Visitor layout lock: keep single column; full-bleed white (no forced max-width) */
body.bn-profile--visitor .bn-profile-social-shell,
body.bn-profile--visitor .bn-profile-page {
  display: flex !important;
  flex-direction: column !important;
}

/* If both owner+visitor classes ever collide, prefer owner chrome */
body.doctor-profile-owner.bn-profile--visitor #doctorOwnerHero,
body.clinic-profile-owner.bn-profile--visitor #clinicOwnerHero {
  display: flex !important;
}
body.doctor-profile-owner.bn-profile--visitor .bn-profile-social-shell > .bn-profile-hero,
body.clinic-profile-owner.bn-profile--visitor .bn-profile-social-shell > .bn-profile-hero {
  display: none !important;
}

.dp-owner-home__brand,
.dp-owner-home__brand-label,
.dp-owner-hero__name,
#doctorOwnerName,
#clinicOwnerName {
  color: #17382f !important;
  font-family: 'Peyda', 'Vazirmatn', sans-serif !important;
  font-weight: 750 !important;
}

.dp-owner-home__brand-dot {
  background: #c5a46d !important;
}

.dp-owner-action-deck,
.cp-owner-action-deck {
  margin: 0 !important;
  opacity: 1 !important;
  visibility: visible !important;
}
.dp-owner-action-deck__primary,
.cp-owner-action-deck__primary {
  display: grid !important;
  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  gap: 8px !important;
  align-items: stretch !important;
}
.dp-owner-hero-btn,
.cp-owner-hero-btn {
  position: relative !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 6px !important;
  width: 100% !important;
  min-width: 0 !important;
  min-height: 76px !important;
  padding: 12px 6px !important;
  border-radius: 16px !important;
  border: 1px solid rgba(23, 56, 47, 0.1) !important;
  background: var(--bn-skin-glass) !important;
  color: #17382f !important;
  box-shadow: none !important;
  overflow: hidden !important;
}
.dp-owner-hero-btn__icon {
  font-size: 1.15rem !important;
  line-height: 1 !important;
  filter: none !important;
  color: inherit !important;
}
.dp-owner-hero-btn__label {
  font-size: 0.72rem !important;
  font-weight: 750 !important;
  line-height: 1.25 !important;
  text-align: center !important;
}
.dp-owner-hero-btn--post,
.dp-owner-hero-btn--primary {
  background: #17382f !important;
  color: #faf9f5 !important;
  border-color: transparent !important;
}
.dp-owner-hero-btn--schedule {
  background: #f7f1e6 !important;
  color: #17382f !important;
  border-color: rgba(197, 164, 109, 0.35) !important;
}
.dp-owner-hero-btn--patients {
  background: #eef5f1 !important;
  color: #17382f !important;
}
.dp-owner-hero-btn--gear {
  width: 100% !important;
  min-width: 0 !important;
  background: var(--bn-skin-glass) !important;
  color: #17382f !important;
  border: 1px solid rgba(23, 56, 47, 0.12) !important;
}
.dp-owner-hero-btn--gear .dp-owner-hero-btn__icon {
  color: #17382f !important;
  font-size: 1.2rem !important;
}
@media (max-width: 380px) {
  .dp-owner-action-deck__primary,
  .cp-owner-action-deck__primary {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }
}

.bn-profile-page.dp-own-profile .bn-profile-tabs,
.bn-profile-page.cp-own-profile .bn-profile-tabs,
.bn-profile-page.dp-own-profile .bn-profile-content,
.bn-profile-page.cp-own-profile .bn-profile-content {
  opacity: 1 !important;
  visibility: visible !important;
}

.bn-profile-page.dp-own-profile .bn-profile-social-shell > .bn-profile-hero,
.bn-profile-page.cp-own-profile .bn-profile-social-shell > .bn-profile-hero,
.bn-profile-page.dp-own-profile #doctorEditorialProfile,
.bn-profile-page.cp-own-profile #clinicEditorialProfile {
  display: none !important;
}

/* --------------------------------------------------------------------------
   15) Visitor doctor / clinic — seamless white canvas + photo top-left (21p)
   -------------------------------------------------------------------------- */
body.bn-profile--visitor,
body.bn-profile--visitor.app-shell,
body.app-shell.bn-profile--visitor {
  background: var(--bn-skin-glass) !important;
}
body.bn-profile--visitor .main-content,
body.bn-profile--visitor .bn-app-page,
body.bn-profile--visitor .bn-profile-page,
body.bn-profile--visitor .bn-profile-social-shell,
body.bn-profile--visitor .bn-profile-hero,
body.bn-profile--visitor .dp-hero,
body.bn-profile--visitor .iconic-profile-hero,
body.bn-profile--visitor .bn-profile-card,
body.bn-profile--visitor .dp-hero-inner,
body.bn-profile--visitor .dp-visitor-stack,
body.bn-profile--visitor .bn-glass--heavy,
body.bn-profile--visitor .iconic-surface {
  background: var(--bn-skin-glass) !important;
  background-image: none !important;
  border: 0 !important;
  box-shadow: none !important;
  border-radius: 0 !important;
  max-width: none !important;
  margin: 0 !important;
  opacity: 1 !important;
  visibility: visible !important;
  filter: none !important;
  transform: none !important;
}
@media (min-width: 768px) {
  body.bn-profile--visitor .main-content {
    max-width: none !important;
    box-shadow: none !important;
    background: var(--bn-skin-glass) !important;
  }
}
body.bn-profile--visitor .bn-profile-cover,
body.bn-profile--visitor .dp-cover,
body.bn-profile--visitor .bn-profile-cover-mesh,
body.bn-profile--visitor .dp-cover-mesh,
body.bn-profile--visitor .dp-cover-vignette {
  display: none !important;
  height: 0 !important;
  min-height: 0 !important;
}
body.bn-profile--visitor .bn-profile-hero {
  display: block !important;
  overflow: visible !important;
  padding: 0 !important;
}
body.bn-profile--visitor .bn-profile-card,
body.bn-profile--visitor .dp-hero-inner {
  padding: 14px 16px 16px !important;
  border-radius: 22px !important;
  background:
    linear-gradient(165deg, rgba(255, 255, 255, 0.78) 0%, rgba(250, 249, 247, 0.62) 100%) !important;
  border: 1px solid rgba(197, 164, 109, 0.22) !important;
  box-shadow:
    0 1px 0 rgba(255, 255, 255, 0.9) inset,
    0 14px 36px rgba(23, 56, 47, 0.07) !important;
}
body.bn-profile--visitor .bn-profile-nav,
body.bn-profile--visitor .dp-hero-nav {
  display: none !important;
  visibility: hidden !important;
  pointer-events: none !important;
  height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
}
body.bn-profile--visitor .bn-profile-nav-btn,
body.bn-profile--visitor .dp-hero-nav-btn,
body.bn-profile--visitor #doctorShareBtn,
body.bn-profile--visitor #followDoctorBtnTop,
body.bn-profile--visitor #followClinicBtn,
body.bn-profile--visitor #doctorVisitorShareBtn,
body.bn-profile--visitor #clinicVisitorShareBtn {
  display: none !important;
}
body.bn-profile--visitor #followDoctorBtnTop,
body.bn-profile--visitor #doctorVisitorSocialLux,
body.bn-profile--visitor #clinicVisitorSocialLux,
body.bn-profile--visitor #doctorProfileStats,
body.bn-profile--visitor #clinicProfileStats,
body.bn-profile--visitor .dp-stats--social,
body.bn-profile--visitor .bn-profile-stats,
body.bn-profile--visitor .dp-visitor-social-row,
body.bn-profile--visitor .bn-visitor-social-lux,
body.bn-profile--visitor #doctorOfferBanner,
body.bn-profile--visitor #clinicOfferBanner,
body.bn-profile--visitor .bn-vip-offer--visitor-inline,
body.bn-profile--visitor #doctorVisitorAccentCard,
body.bn-profile--visitor #clinicAboutSection {
  display: none !important;
}

body.bn-profile--visitor .dp-visitor-identity,
body.bn-profile--visitor #doctorVisitorPhotoTop {
  display: flex !important;
  flex-direction: row !important;
  align-items: flex-start !important;
  justify-content: space-between !important;
  gap: 14px !important;
  margin: 8px 0 12px !important;
  direction: rtl !important;
  padding-top: 4px !important;
}
body.bn-profile--visitor .dp-visitor-identity__photo,
body.bn-profile--visitor .dp-visitor-photo-wrap {
  display: block !important;
  flex: 0 0 auto !important;
  order: 2 !important;
  margin: 0 !important;
  justify-content: flex-start !important;
}
body.bn-profile--visitor .dp-visitor-identity__copy {
  flex: 1 1 auto !important;
  min-width: 0 !important;
  text-align: start !important;
  order: 1 !important;
}
body.bn-profile--visitor .dp-avatar-ring--square,
body.bn-profile--visitor .dp-avatar-ring--square .bn-profile-avatar,
body.bn-profile--visitor .dp-avatar-ring--square img,
body.bn-profile--visitor .dp-visitor-photo-wrap .dp-avatar,
body.bn-profile--visitor.doctor-profile-page .dp-visitor-photo-wrap .dp-avatar,
body.bn-profile--visitor.doctor-profile-page.bn-profile--lux-photo .dp-visitor-photo-wrap .dp-avatar,
body.bn-profile--visitor .clinic-visitor-avatar-wrap .bn-profile-avatar-ring,
body.bn-profile--visitor .clinic-visitor-avatar-wrap .bn-profile-avatar,
body.bn-profile--visitor .clinic-visitor-avatar-wrap .bn-profile-avatar-ring img {
  width: 132px !important;
  height: 132px !important;
  min-height: 132px !important;
  max-width: 132px !important;
  max-height: 132px !important;
  border-radius: 16px !important;
  object-fit: cover !important;
  margin: 0 !important;
  margin-inline: 0 !important;
}
body.bn-profile--visitor .clinic-visitor-avatar-wrap {
  max-width: 132px !important;
  overflow: hidden !important;
  flex-shrink: 0 !important;
}
body.bn-profile--visitor .dp-avatar-ring--square,
body.bn-profile--visitor .clinic-visitor-avatar-wrap .bn-profile-avatar-ring {
  padding: 0 !important;
  border: 1.5px solid rgba(197, 164, 109, 0.55) !important;
  box-shadow: 0 8px 22px rgba(23, 56, 47, 0.1) !important;
  background: var(--bn-skin-glass) !important;
  overflow: hidden !important;
}
body.bn-profile--visitor .dp-visitor-name,
body.bn-profile--visitor #doctorName,
body.bn-profile--visitor #clinicName {
  margin: 4px 0 8px !important;
  text-align: start !important;
  color: #17382f !important;
  -webkit-text-fill-color: #17382f !important;
  font-weight: 800 !important;
  font-size: 1.32rem !important;
  line-height: 1.3 !important;
}
body.bn-profile--visitor .dp-visitor-identity__meta,
body.bn-profile--visitor #doctorVisitorInfoGrid {
  display: flex !important;
  flex-direction: column !important;
  align-items: stretch !important;
  gap: 8px !important;
  margin: 0 !important;
  grid-template-columns: none !important;
}
body.bn-profile--visitor .dp-visitor-identity__row {
  display: flex !important;
  flex-direction: row !important;
  align-items: flex-start !important;
  justify-content: space-between !important;
  gap: 12px !important;
  width: 100% !important;
}
body.bn-profile--visitor .dp-visitor-identity__license {
  flex: 1 1 auto !important;
  min-width: 0 !important;
  text-align: start !important;
}
body.bn-profile--visitor .dp-visitor-identity__loc {
  flex: 0 1 48% !important;
  max-width: 50% !important;
  text-align: end !important;
  margin: 0 !important;
}
body.bn-profile--visitor .dp-visitor-identity__facts {
  display: flex !important;
  flex-direction: column !important;
  gap: 4px !important;
}
body.bn-profile--visitor .dp-visitor-specialty-gold {
  display: block !important;
  margin: 0 !important;
  width: auto !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  text-align: start !important;
  color: #c5a46d !important;
  -webkit-text-fill-color: #c5a46d !important;
  font-size: 0.92rem !important;
  font-weight: 750 !important;
}
body.bn-profile--visitor .dp-visitor-identity__label {
  display: block !important;
  margin: 0 0 2px !important;
  font-size: 0.72rem !important;
  font-weight: 650 !important;
  color: #6b746f !important;
}
body.bn-profile--visitor .dp-visitor-identity__value,
body.bn-profile--visitor #doctorLicenseNumber,
body.bn-profile--visitor #clinicLicenseValue {
  color: #17382f !important;
  -webkit-text-fill-color: #17382f !important;
}
body.bn-profile--visitor .dp-visitor-location-value,
body.bn-profile--visitor #doctorLocationLine,
body.bn-profile--visitor #clinicCity {
  color: #17382f !important;
  -webkit-text-fill-color: #17382f !important;
  font-weight: 750 !important;
}
body.doctor-profile.bn-profile--visitor .dp-visitor-location-value,
body.doctor-profile.bn-profile--visitor #doctorLocationLine {
  color: #17382f !important;
  -webkit-text-fill-color: #17382f !important;
}
body.bn-profile--visitor #clinicCity {
  color: #17382f !important;
  -webkit-text-fill-color: #17382f !important;
  font-weight: 750 !important;
  text-align: end !important;
}
body.bn-profile--visitor .dp-visitor-info-tile:not([hidden]),
body.bn-profile--visitor .bn-visitor-info-chip:not([hidden]) {
  display: block !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}
body.bn-profile--visitor .dp-visitor-action-grid:not([hidden]),
body.bn-profile--visitor #doctorVisitorActions:not([hidden]),
body.bn-profile--visitor #clinicVisitorActions:not([hidden]) {
  display: flex !important;
  flex-direction: column !important;
  gap: 10px !important;
  margin: 12px 0 8px !important;
  grid-template-columns: none !important;
}
body.bn-profile--visitor .dp-visitor-action-tile--primary,
body.bn-profile--visitor .bn-visitor-action--primary,
body.bn-profile--visitor #bookAppointmentBtn,
body.bn-profile--visitor #clinicBookBtn {
  position: relative !important;
  grid-column: auto !important;
  width: 100% !important;
  min-height: 58px !important;
  flex-direction: row !important;
  gap: 10px !important;
  border-radius: 18px !important;
  background:
    linear-gradient(180deg, #214a3e 0%, #17382f 46%, #122c26 100%) !important;
  color: #faf9f7 !important;
  border: 1px solid rgba(197, 164, 109, 0.42) !important;
  box-shadow:
    0 1px 0 rgba(255, 255, 255, 0.22) inset,
    0 -3px 8px rgba(0, 0, 0, 0.22) inset,
    0 2px 0 rgba(197, 164, 109, 0.28),
    0 12px 28px rgba(18, 44, 38, 0.32) !important;
  font-size: 1.08rem !important;
  font-weight: 780 !important;
  letter-spacing: -0.01em !important;
  transform: translateZ(0) !important;
  transition: transform 180ms var(--bn-ease, cubic-bezier(0.22, 1, 0.36, 1)),
    box-shadow 180ms var(--bn-ease, cubic-bezier(0.22, 1, 0.36, 1)) !important;
}
body.bn-profile--visitor .dp-visitor-action-tile--primary::after,
body.bn-profile--visitor #bookAppointmentBtn::after,
body.bn-profile--visitor #clinicBookBtn::after {
  content: '' !important;
  position: absolute !important;
  inset: 1px 1px auto 1px !important;
  height: 46% !important;
  border-radius: 17px 17px 40% 40% !important;
  background: linear-gradient(180deg, rgba(255, 255, 255, 0.2), transparent) !important;
  pointer-events: none !important;
}
body.bn-profile--visitor .dp-visitor-action-tile--primary:hover,
body.bn-profile--visitor #bookAppointmentBtn:hover,
body.bn-profile--visitor #clinicBookBtn:hover {
  transform: translateY(-1px) !important;
  box-shadow:
    0 1px 0 rgba(255, 255, 255, 0.26) inset,
    0 -3px 8px rgba(0, 0, 0, 0.2) inset,
    0 3px 0 rgba(197, 164, 109, 0.34),
    0 16px 34px rgba(18, 44, 38, 0.36) !important;
}
body.bn-profile--visitor .dp-visitor-action-tile--primary:active,
body.bn-profile--visitor #bookAppointmentBtn:active,
body.bn-profile--visitor #clinicBookBtn:active {
  transform: translateY(1px) !important;
  box-shadow:
    0 1px 0 rgba(255, 255, 255, 0.12) inset,
    0 1px 0 rgba(197, 164, 109, 0.2),
    0 6px 16px rgba(18, 44, 38, 0.28) !important;
}
body.bn-profile--visitor .dp-visitor-action-tile--primary i,
body.bn-profile--visitor #bookAppointmentBtn i,
body.bn-profile--visitor #clinicBookBtn i {
  position: relative !important;
  z-index: 1 !important;
  color: #e4d4b2 !important;
  font-size: 1.1rem !important;
  filter: drop-shadow(0 1px 1px rgba(0, 0, 0, 0.25)) !important;
}
body.bn-profile--visitor .dp-visitor-action-tile--primary span,
body.bn-profile--visitor #bookAppointmentBtn span,
body.bn-profile--visitor #clinicBookBtn span {
  position: relative !important;
  z-index: 1 !important;
}
body.bn-profile--visitor .dp-visitor-action-secondary {
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: 8px !important;
}
body.bn-profile--visitor .dp-visitor-action-tile,
body.bn-profile--visitor .bn-visitor-action,
body.bn-profile--visitor .dp-visitor-action-tile--lg {
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: center !important;
  min-height: 68px !important;
  border-radius: 16px !important;
  border: 1px solid rgba(197, 164, 109, 0.2) !important;
  background:
    linear-gradient(165deg, rgba(255, 255, 255, 0.72), rgba(250, 249, 247, 0.5)) !important;
  color: #142821 !important;
  box-shadow:
    0 1px 0 rgba(255, 255, 255, 0.85) inset,
    0 8px 18px rgba(23, 56, 47, 0.06) !important;
  font-weight: 700 !important;
  font-size: 0.9rem !important;
}
body.bn-profile--visitor .dp-visitor-action-tile i {
  color: #29483d !important;
  filter: none !important;
  text-shadow: none !important;
  font-size: 1.05rem !important;
}
body.bn-profile--visitor .dp-visitor-services-lux {
  margin: 10px 0 6px !important;
  padding: 12px 0 4px !important;
  border: 0 !important;
  border-top: 1px solid rgba(197, 164, 109, 0.2) !important;
  background: transparent !important;
  box-shadow: none !important;
}
body.bn-profile--visitor .dp-visitor-services-lux__title {
  font-size: 1.05rem !important;
  font-weight: 780 !important;
  color: #142821 !important;
}
body.bn-profile--visitor .dp-visitor-name,
body.bn-profile--visitor #doctorName,
body.bn-profile--visitor #clinicName {
  margin: 2px 0 10px !important;
  text-align: start !important;
  color: #142821 !important;
  -webkit-text-fill-color: #142821 !important;
  font-weight: 820 !important;
  font-size: 1.4rem !important;
  line-height: 1.28 !important;
  letter-spacing: -0.02em !important;
}
body.bn-profile--visitor .dp-avatar-ring--square,
body.bn-profile--visitor .clinic-visitor-avatar-wrap .bn-profile-avatar-ring {
  padding: 0 !important;
  border: 1.5px solid rgba(197, 164, 109, 0.58) !important;
  box-shadow:
    0 1px 0 rgba(255, 255, 255, 0.7) inset,
    0 12px 28px rgba(23, 56, 47, 0.12),
    0 0 0 3px rgba(255, 255, 255, 0.55) !important;
  background: rgba(255, 255, 255, 0.7) !important;
  overflow: hidden !important;
}
body.bn-profile--visitor .dp-visitor-identity__label {
  display: block !important;
  margin: 0 0 3px !important;
  font-size: 0.8rem !important;
  font-weight: 650 !important;
  color: #66756e !important;
}
body.bn-profile--visitor .dp-visitor-specialty-gold {
  display: block !important;
  margin: 2px 0 0 !important;
  width: auto !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  text-align: start !important;
  color: #b08f58 !important;
  -webkit-text-fill-color: #b08f58 !important;
  font-size: 0.98rem !important;
  font-weight: 750 !important;
}
body.bn-profile--visitor .bn-profile-tabs,
body.bn-profile--visitor .dp-tabs,
body.bn-profile--visitor .iconic-chips,
body.bn-profile--visitor #profileStoriesSection,
body.bn-profile--visitor .tab-panel,
body.bn-profile--visitor .bn-profile-panel {
  background: var(--bn-skin-glass) !important;
  border-color: rgba(197, 164, 109, 0.22) !important;
}

/* --------------------------------------------------------------------------
   16) Chat — single full-bleed white canvas (21p)
   -------------------------------------------------------------------------- */
body.bn-chat-active,
body.app-shell.bn-chat-active {
  background: var(--bn-skin-glass) !important;
}
body.app-shell.bn-chat-active .main-content,
body.bn-chat-active .main-content {
  background: var(--bn-skin-glass) !important;
  max-width: none !important;
  box-shadow: none !important;
  margin: 0 !important;
  padding: 0 !important;
  width: 100% !important;
}
body.app-shell.bn-chat-active .bn-chat-page,
body.app-shell.bn-chat-active .bn-chat-layout,
body.app-shell.bn-chat-active .bn-chat-main,
body.app-shell.bn-chat-active .bn-chat-sidebar,
body.app-shell.bn-chat-active #chatMessages.bn-chat-messages,
body.app-shell.bn-chat-active .bn-chat-messages,
body.bn-chat-active .bn-chat-page,
body.bn-chat-active .bn-chat-layout,
body.bn-chat-active .bn-chat-main,
body.bn-chat-active .bn-chat-messages {
  background: var(--bn-skin-glass) !important;
  background-image: none !important;
  max-width: none !important;
  border-radius: 0 !important;
  box-shadow: none !important;
}
body.app-shell.bn-chat-active .bn-chat-sidebar {
  background: var(--bn-skin-glass) !important;
  border-inline-end: 1px solid rgba(197, 164, 109, 0.28) !important;
}
body.app-shell.bn-chat-active #chatCompose.bn-chat-compose:not([hidden]),
body.bn-chat-active #chatCompose.bn-chat-compose:not([hidden]) {
  background: var(--bn-skin-glass) !important;
  border-top: 1px solid rgba(197, 164, 109, 0.35) !important;
  box-shadow: none !important;
}

/* Content-visibility disabled — caused blank/janky cards on low-end phones */
.bn-feed-card,
.bn-chat-list-item,
.explore-card,
.bn-explore-card {
  content-visibility: visible;
  contain-intrinsic-size: auto;
}

/* --------------------------------------------------------------------------
   17) Decto lux dual-bar page loader (21p)
   -------------------------------------------------------------------------- */
.decto-page-loader {
  position: sticky;
  top: var(--bn-header-h, 56px);
  z-index: 40;
  display: none;
  align-items: center;
  justify-content: center;
  min-height: 56px;
  padding: 10px 12px;
  background: rgba(255, 255, 255, 0.92);
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
  border-bottom: 1px solid rgba(197, 164, 109, 0.18);
}
.decto-page-loader.is-on {
  display: flex;
}
.decto-page-loader__mark {
  width: 44px;
  height: 44px;
  color: #c5a46d;
  animation: decto-lux-spin 1.15s cubic-bezier(0.45, 0.05, 0.55, 0.95) infinite;
  transform-origin: 50% 50%;
}
.decto-page-loader__mark path {
  fill: none;
  stroke: currentColor;
  stroke-linecap: round;
  stroke-width: 2.4;
}
.decto-page-loader__mark path:nth-child(2) {
  opacity: 0.55;
  stroke-width: 1.6;
}
@keyframes decto-lux-spin {
  to { transform: rotate(360deg); }
}
.loading-overlay .decto-page-loader__mark {
  width: 52px;
  height: 52px;
  color: #c5a46d;
  animation: decto-lux-spin 1.15s cubic-bezier(0.45, 0.05, 0.55, 0.95) infinite;
}
.loading-overlay,
#loadingOverlay {
  background: rgba(16, 26, 23, 0.28) !important;
  backdrop-filter: none !important;
}
.loading-overlay .spinner {
  display: none !important;
}

/* --------------------------------------------------------------------------
   18) Compact toasts + success cards (21q) — never full-phone banners
   -------------------------------------------------------------------------- */
.toast,
#toast,
#toast.bn-toast--top,
body.app-shell #toast.bn-toast--top.show,
body.app-shell #toast.show {
  position: fixed !important;
  top: calc(10px + env(safe-area-inset-top, 0px)) !important;
  bottom: auto !important;
  left: 50% !important;
  right: auto !important;
  inset-inline: auto !important;
  width: max-content !important;
  max-width: min(78vw, 280px) !important;
  margin: 0 !important;
  padding: 10px 14px !important;
  border-radius: 14px !important;
  font-size: 0.86rem !important;
  font-weight: 700 !important;
  line-height: 1.35 !important;
  transform: translateX(-50%) !important;
  box-shadow: 0 8px 24px rgba(23, 56, 47, 0.18) !important;
  z-index: 13060 !important;
}
#toast:not(.show) {
  opacity: 0 !important;
  visibility: hidden !important;
  pointer-events: none !important;
}

.bn-lux-publish,
.bn-lux-publish.is-visible {
  position: fixed !important;
  inset: auto !important;
  top: calc(12px + env(safe-area-inset-top, 0px)) !important;
  left: 50% !important;
  right: auto !important;
  bottom: auto !important;
  width: max-content !important;
  max-width: min(86vw, 300px) !important;
  padding: 0 !important;
  margin: 0 !important;
  display: block !important;
  place-items: unset !important;
  transform: translateX(-50%) !important;
  background: transparent !important;
  z-index: 13050 !important;
}
.bn-lux-publish[hidden] {
  display: none !important;
}
.bn-lux-publish__backdrop {
  display: none !important;
}
.bn-lux-publish__card {
  width: 100% !important;
  max-width: min(86vw, 300px) !important;
  padding: 14px 16px 12px !important;
  border-radius: 16px !important;
  background: #17382f !important;
  color: #faf9f5 !important;
  border: 1px solid rgba(197, 164, 109, 0.35) !important;
  box-shadow: 0 10px 28px rgba(23, 56, 47, 0.22) !important;
  transform: none !important;
}
.bn-lux-publish__shine { display: none !important; }
.bn-lux-publish__icon {
  width: 34px !important;
  height: 34px !important;
  margin: 0 auto 8px !important;
  border-radius: 11px !important;
  background: #c5a46d !important;
  color: #17382f !important;
  box-shadow: none !important;
  font-size: 0.9rem !important;
}
.bn-lux-publish__eyebrow {
  color: rgba(250, 249, 245, 0.72) !important;
  font-size: 0.68rem !important;
  margin: 0 0 4px !important;
}
.bn-lux-publish__title {
  color: #faf9f5 !important;
  font-size: 0.95rem !important;
  margin: 0 0 4px !important;
  font-weight: 800 !important;
}
.bn-lux-publish__subtitle {
  color: rgba(250, 249, 245, 0.78) !important;
  font-size: 0.78rem !important;
  margin: 0 0 10px !important;
  line-height: 1.45 !important;
}
.bn-lux-publish__btn {
  min-height: 36px !important;
  border-radius: 12px !important;
  background: rgba(255, 255, 255, 0.12) !important;
  color: #faf9f5 !important;
  box-shadow: none !important;
  font-size: 0.82rem !important;
  font-weight: 750 !important;
}
body.bn-lux-publish-open {
  overflow: auto !important;
}

/* Composer: never blank white full-screen without sheet */
body.composer-modal-open .composer-modal.active,
body.composer-modal-open #postComposerModal.active,
#postComposerModal.active,
#postComposerModal[aria-hidden='false'] {
  display: flex !important;
  align-items: flex-end !important;
  justify-content: center !important;
  background: rgba(16, 26, 23, 0.45) !important;
  z-index: 2147483000 !important;
  padding: 0 !important;
}

#bnMsApply,
#bnMsApplyBar,
.bn-ms-actions__apply,
.bn-ms-actions__cancel,
.bn-ms-top-btn--primary,
#bnMsActions {
  pointer-events: auto !important;
  touch-action: manipulation !important;
  cursor: pointer !important;
  opacity: 1;
  position: relative;
  z-index: 80 !important;
}
body.bn-media-studio-open .global-auth-bottom-nav,
body.bn-media-studio-open .bottom-nav,
body.bn-media-studio-open #bnBottomNavSpacer {
  visibility: hidden !important;
  pointer-events: none !important;
  opacity: 0 !important;
}
#bnMsApply.is-loading,
#bnMsApplyBar.is-loading,
.bn-ms-actions__apply.is-loading {
  opacity: 0.85 !important;
  pointer-events: auto !important;
}

/* Sheet forces visibility:visible — must fully unmount hit-testing while editor is open */
body.bn-composer-editing-media #postComposerModal,
body.bn-composer-editing-media #postComposerModal.active,
body.bn-composer-editing-media #postComposerModal[aria-hidden='false'],
body.bn-composer-editing-media .composer-modal.active,
body.bn-media-studio-open #postComposerModal,
body.bn-media-studio-open #postComposerModal.active,
body.bn-media-studio-open #postComposerModal[aria-hidden='false'] {
  display: none !important;
  visibility: hidden !important;
  opacity: 0 !important;
  pointer-events: none !important;
}

body.bn-composer-editing-media #postComposerModal .composer-pro-sheet,
body.bn-composer-editing-media #postComposerModal .composer-sheet,
body.bn-media-studio-open #postComposerModal .composer-pro-sheet,
body.bn-media-studio-open #postComposerModal .composer-sheet,
body.bn-media-studio-open #postComposerModal .composer-pro__body,
body.bn-media-studio-open #postComposerModal .modal-body {
  display: none !important;
  visibility: hidden !important;
  opacity: 0 !important;
  pointer-events: none !important;
}

/* Editor must always sit above composer / hub / story layers — only while open */
#bnMediaStudio.bn-media-studio:not(.is-open),
#bnMediaStudio[hidden] {
  display: none !important;
  pointer-events: none !important;
  visibility: hidden !important;
  opacity: 0 !important;
  z-index: -1 !important;
}
#bnMediaStudio.bn-media-studio.is-open {
  display: flex !important;
  z-index: 2147483646 !important;
  pointer-events: auto !important;
  visibility: visible !important;
  opacity: 1 !important;
}
#postComposerModal .composer-sheet,
#postComposerModal .composer-pro-sheet,
body.composer-modal-open .composer-pro-sheet {
  display: flex !important;
  flex-direction: column !important;
  width: min(100%, 520px) !important;
  max-height: min(92dvh, 760px) !important;
  min-height: 42dvh !important;
  margin: 0 auto !important;
  background: var(--bn-skin-glass) !important;
  color: #17382f !important;
  border-radius: 22px 22px 0 0 !important;
  opacity: 1 !important;
  visibility: visible !important;
  overflow: auto !important;
}
#postComposerModal .composer-pro__body,
#postComposerModal .modal-body {
  color: #17382f !important;
  opacity: 1 !important;
  visibility: visible !important;
}
#postComposerModal .composer-pro__header h3,
#postComposerModal .composer-pro__block h4,
#postComposerModal .composer-type-tab {
  color: #17382f !important;
}

/* Single ivory–gray canvas — pages stay transparent so html stage shows through */
body.app-shell,
body.app-shell .main-content,
body.app-shell.bn-feed-surface,
body.app-shell.bn-feed-surface .main-content,
body.app-shell.bn-feed-surface .bn-feed-page,
body.app-shell .bn-feed-page,
.bn-profile-page,
.bn-app-page,
.bn-explore-page,
.bn-search-page,
.bn-settings-page,
.bn-settings-app-page,
.bn-referral-page {
  background: transparent !important;
  background-image: none !important;
}

/* Search — one white theme provider cards */
.bn-search-page .bn-provider-card,
.bn-search-hub__panel {
  background: var(--bn-skin-glass) !important;
  background-image: none !important;
}

body.app-shell .app-header,
body.app-shell .app-header--luxury,
body.app-shell .app-header-inner {
  background: transparent !important;
  background-image: none !important;
}

body.app-shell .bottom-nav,
body.app-shell .bottom-nav--luxury,
body.app-shell .bottom-nav-inner,
.global-auth-bottom-nav {
  background-image: none !important;
}

.lux-menu-panel,
.lux-menu-sheet,
.lux-menu-scroll {
  background-image: none !important;
}

.bn-feed-card,
.feed-post,
.bn-feed-card.feed-post--cinema,
.bn-feed-card.feed-post--iconic,
.bn-feed-card__body,
.feed-post-body,
.bn-feed-card__caption,
.feed-post-caption,
.bn-feed-card__media,
.feed-post-media-wrap,
.feed-post-media {
  background: var(--bn-skin-glass) !important;
  background-image: none !important;
  box-shadow: none !important;
}

.bn-feed-card__media,
.feed-post-media-wrap {
  aspect-ratio: 4 / 5 !important;
  overflow: hidden !important;
  margin: 0 !important;
  padding: 0 !important;
  line-height: 0 !important;
  border: 0 !important;
  background: var(--bn-skin-glass) !important;
  font-size: 0 !important;
}

/* Change flashes must ignore media font-size:0 (otherwise icons vanish) */
.bn-feed-card__media .bn-change-flashes,
.feed-post-media-wrap .bn-change-flashes,
.explore-reels-slide-media .bn-change-flashes,
.explore-reels-slide > .bn-change-flashes {
  font-size: 0.78rem !important;
  line-height: 1.25 !important;
  z-index: 130 !important;
}

.bn-feed-card__caption,
.feed-post-caption,
.bn-feed-card__body,
.feed-post-body {
  margin-top: 0 !important;
  padding-top: 0 !important;
  background: var(--bn-skin-glass) !important;
  gap: 0 !important;
}

.bn-feed-card__body.feed-post-body {
  display: flex !important;
  flex-direction: column !important;
  gap: 4px !important;
  padding: 2px 12px 12px !important;
  margin: 0 !important;
  background: var(--bn-skin-glass) !important;
}

.feed-post-compact-actions {
  margin: 0 !important;
  padding: 2px 0 0 !important;
  background: transparent !important;
  min-height: 48px !important;
}

.bn-feed-card .feed-post-icon-actions {
  gap: 2px !important;
}

.bn-feed-card .feed-stat-pill,
.bn-feed-card .feed-save-pill,
.bn-feed-card .like-btn,
.bn-feed-card .comment-btn,
.bn-feed-card .share-btn {
  min-height: 48px !important;
  min-width: 48px !important;
  padding: 8px 12px !important;
  font-size: 1rem !important;
  font-weight: 800 !important;
  gap: 6px !important;
}

.bn-feed-card .feed-stat-pill i,
.bn-feed-card .feed-save-pill i,
.bn-feed-card .like-btn i,
.bn-feed-card .comment-btn i,
.bn-feed-card .share-btn i {
  font-size: 1.35rem !important;
  line-height: 1 !important;
}

.bn-feed-card .likes-count,
.bn-feed-card .comments-count {
  font-size: 0.95rem !important;
  font-weight: 800 !important;
}

.bn-feed-card .bn-feed-card__caption,
.bn-feed-card .feed-post-caption {
  margin: 0 !important;
  padding-top: 2px !important;
  font-family: 'Vazirmatn', var(--bn-font-body, system-ui), sans-serif !important;
  font-size: 14.5px !important;
  font-weight: 800 !important;
  line-height: 1.55 !important;
  letter-spacing: -0.01em !important;
  color: #0a1f18 !important;
  -webkit-font-smoothing: antialiased;
}

.bn-feed-card .bn-feed-card__caption[data-feed-expandable],
.bn-feed-card .feed-post-caption[data-feed-expandable],
.bn-feed-card .bn-feed-card__desc[data-feed-expandable],
.bn-feed-card .feed-post-desc[data-feed-expandable] {
  display: -webkit-box !important;
  -webkit-box-orient: vertical !important;
  -webkit-line-clamp: 3 !important;
  line-clamp: 3 !important;
  overflow: hidden !important;
}

.bn-feed-card .bn-feed-card__caption[data-feed-expandable].is-expanded,
.bn-feed-card .feed-post-caption[data-feed-expandable].is-expanded,
.bn-feed-card .bn-feed-card__desc[data-feed-expandable].is-expanded,
.bn-feed-card .feed-post-desc[data-feed-expandable].is-expanded,
.bn-feed-card .bn-feed-card__caption[data-feed-expandable].expanded,
.bn-feed-card .feed-post-caption[data-feed-expandable].expanded {
  display: block !important;
  -webkit-line-clamp: unset !important;
  line-clamp: unset !important;
  overflow: visible !important;
}

.bn-feed-caption-toggle {
  appearance: none;
  border: 0;
  background: transparent;
  padding: 0;
  margin: 0;
  font-family: 'Vazirmatn', var(--bn-font-body, system-ui), sans-serif;
  font-size: 0.82rem;
  font-weight: 800;
  color: #6f7a74;
  cursor: pointer;
}

.bn-feed-caption-toggle[hidden] {
  display: none !important;
}

.bn-feed-card .bn-feed-card__caption strong,
.bn-feed-card .feed-post-caption strong,
.bn-feed-card .feed-post-author-name {
  font-family: inherit !important;
  font-weight: 900 !important;
  color: #061510 !important;
}

.bn-feed-card__media img,
.bn-feed-card__media video,
.feed-post-media img,
.feed-post-media video,
.bn-feed-card__media .bn-feed-media-img,
.feed-post-media .ba-slider,
.bn-feed-card__media .ba-slider {
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  background: var(--bn-skin-glass) !important;
  display: block !important;
  vertical-align: top !important;
  margin: 0 !important;
  padding: 0 !important;
}

/* Kill any leftover black strip under media */
.bn-feed-card.feed-post--cinema .bn-feed-card__media,
.bn-feed-card.feed-post--iconic .bn-feed-card__media,
.bn-feed-card .feed-post-media,
body.app-shell .bn-feed-card__media,
body.app-shell .bn-feed-card__media .feed-post-media {
  background: var(--bn-skin-glass) !important;
  background-image: none !important;
}

a.post-detail-author-link,
.post-detail-author-link {
  display: flex !important;
  align-items: center !important;
  gap: 10px !important;
  text-decoration: none !important;
  color: inherit !important;
  cursor: pointer !important;
}

/* Post detail: locked solid sheet — no shake / dvh bounce */
body.post-detail-open,
body.post-detail-open .main-content {
  overflow: hidden !important;
  overscroll-behavior: none !important;
}

#postDetailModal.bn-post-detail-modal.is-open,
#postDetailModal.bn-post-detail-modal.open,
#postDetailModal.bn-post-detail-modal.active,
#postDetailModal.is-open,
#postDetailModal.open,
#postDetailModal.active {
  position: fixed !important;
  inset: 0 !important;
  display: flex !important;
  align-items: stretch !important;
  justify-content: center !important;
  padding: 0 !important;
  margin: 0 !important;
  background: var(--bn-skin-glass) !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
  overflow: hidden !important;
  overscroll-behavior: none !important;
  touch-action: manipulation !important;
  transform: none !important;
  animation: none !important;
  z-index: 2147483500 !important;
}

#postDetailModal .bn-post-detail {
  width: 100% !important;
  max-width: 100% !important;
  height: 100% !important;
  max-height: 100% !important;
  min-height: 0 !important;
  margin: 0 !important;
  border-radius: 0 !important;
  background: var(--bn-skin-glass) !important;
  box-shadow: none !important;
  transform: none !important;
  animation: none !important;
  overflow: hidden !important;
}

#postDetailModal .bn-post-detail-grid {
  display: flex !important;
  flex-direction: column !important;
  height: 100% !important;
  max-height: 100% !important;
  transform: none !important;
}

#postDetailModal .bn-post-detail-media {
  flex: 0 0 auto !important;
  position: relative !important;
  isolation: isolate !important;
  height: min(42svh, 380px) !important;
  max-height: min(42svh, 380px) !important;
  min-height: 180px !important;
  background: #111 !important;
  margin: 0 !important;
  overflow: hidden !important;
  z-index: 1 !important;
}

#postDetailModal .bn-post-detail-media .ba-slider,
#postDetailModal .bn-post-detail-media .post-carousel,
#postDetailModal .bn-post-detail-media .feed-post-media {
  position: absolute !important;
  inset: 0 !important;
  width: 100% !important;
  height: 100% !important;
  max-height: 100% !important;
  z-index: 1 !important;
}

#postDetailModal .bn-post-detail-panel {
  flex: 1 1 auto !important;
  min-height: 0 !important;
  margin: 0 !important;
  border-radius: 0 !important;
  background: var(--bn-skin-glass) !important;
  transform: none !important;
  overflow: hidden !important;
  position: relative !important;
  z-index: 2 !important;
  display: flex !important;
  flex-direction: column !important;
}

#postDetailModal .bn-post-detail-body,
#postDetailModal .bn-post-detail-head,
#postDetailModal .bn-post-detail-footer,
#postDetailModal .post-detail-comment-form {
  background: var(--bn-skin-glass) !important;
}

/* Publisher hub — always visible when opened (safety if feature CSS late) */
#doctorPublisherHub.dp-pub-hub {
  position: fixed !important;
  inset: 0 !important;
  z-index: 2147482800 !important;
  display: grid !important;
  place-items: end center !important;
  pointer-events: none !important;
}
#doctorPublisherHub.dp-pub-hub[hidden],
#doctorPublisherHub.dp-pub-hub[aria-hidden='true']:not(.is-open) {
  display: none !important;
}
#doctorPublisherHub.dp-pub-hub.is-open {
  pointer-events: auto !important;
  display: grid !important;
}
#doctorPublisherHub .dp-pub-hub__backdrop {
  position: absolute !important;
  inset: 0 !important;
  background: rgba(8, 20, 16, 0.52) !important;
}
#doctorPublisherHub.is-open .dp-pub-hub__sheet {
  position: relative !important;
  width: min(100%, 520px) !important;
  max-height: min(88vh, 680px) !important;
  overflow-y: auto !important;
  padding: 12px 18px calc(24px + env(safe-area-inset-bottom)) !important;
  border-radius: 28px 28px 0 0 !important;
  background: var(--bn-skin-glass) !important;
  box-shadow: 0 -20px 56px rgba(8, 20, 16, 0.18) !important;
  transform: none !important;
}

@media (min-width: 768px) {
  #postDetailModal.is-open,
  #postDetailModal.open,
  #postDetailModal.active {
    background: rgba(10, 18, 16, 0.72) !important;
    align-items: center !important;
    padding: 20px !important;
  }
  #postDetailModal .bn-post-detail {
    width: min(920px, 100%) !important;
    height: min(88vh, 820px) !important;
    max-height: min(88vh, 820px) !important;
    border-radius: 20px !important;
  }
  #postDetailModal .bn-post-detail-grid {
    display: grid !important;
    grid-template-columns: minmax(0, 1.2fr) minmax(280px, 0.9fr) !important;
  }
  #postDetailModal .bn-post-detail-media {
    height: 100% !important;
    max-height: none !important;
  }
}