/**
 * DECTO Champagne Glass FULL — nuclear last skin.
 * Kills matte #fff fills; shells transparent; rafts frosted.
 * Reels immersive black stays untouched.
 */

:root,
html,
body,
body.app-shell,
body.index-page,
body.auth-page {
  --bn-skin-glass: rgba(255, 255, 255, 0.3) !important;
  --bn-skin-glass-soft: rgba(255, 255, 255, 0.22) !important;
  --bn-surface: rgba(255, 255, 255, 0.32) !important;
  --bn-surface-2: rgba(255, 255, 255, 0.24) !important;
  --bn-color-surface: rgba(255, 255, 255, 0.32) !important;
  --bn-color-bg: transparent !important;
  --bn-color-bg-subtle: transparent !important;
  --bn-cream: transparent !important;
  --bn-cream-2: transparent !important;
  --bn-ivory: rgba(255, 255, 255, 0.28) !important;
  --bn-premium-glass: rgba(255, 255, 255, 0.32) !important;
  --bn-premium-glass-soft: rgba(255, 255, 255, 0.22) !important;
  --bn-premium-border: rgba(255, 255, 255, 0.55) !important;
  --bn-raft: rgba(255, 255, 255, 0.3) !important;
  --bn-raft-plain: rgba(255, 255, 255, 0.22) !important;
  --bn-raft-border: rgba(255, 255, 255, 0.62) !important;
  --bn-glass-filter: blur(26px) saturate(1.45) !important;
  --bn-ambient-bg:
    radial-gradient(ellipse 100% 70% at 82% 0%, rgba(255, 246, 230, 0.95), transparent 55%),
    radial-gradient(ellipse 80% 60% at 8% 100%, rgba(197, 164, 109, 0.28), transparent 55%),
    radial-gradient(ellipse 70% 50% at 95% 75%, rgba(23, 56, 47, 0.16), transparent 50%),
    radial-gradient(ellipse 55% 45% at 45% 35%, rgba(255, 255, 255, 0.55), transparent 60%),
    linear-gradient(165deg, #cfdfd6 0%, #e8e0d4 35%, #d5e2da 68%, #efe8dc 100%) !important;
}

/* ===== Atmospheric stage ===== */
html:not(:has(body.bn-explore-reels-open)) {
  background-color: #cfdfd6 !important;
  background-image: var(--bn-ambient-bg) !important;
  background-repeat: no-repeat !important;
  background-size: cover !important;
  background-attachment: scroll !important;
  min-height: 100% !important;
}

/* No stacked overlay — single ambient on html only (ivory may refine) */
html:not(:has(body.bn-explore-reels-open))::before {
  content: none !important;
  display: none !important;
}

html:not(:has(body.bn-explore-reels-open)) body {
  position: relative !important;
  z-index: 1 !important;
}

/* ===== Kill every hard page shell ===== */
html:not(:has(body.bn-explore-reels-open)) body,
html:not(:has(body.bn-explore-reels-open)) body.app-shell,
html:not(:has(body.bn-explore-reels-open)) body.index-page,
html:not(:has(body.bn-explore-reels-open)) body.auth-page,
html:not(:has(body.bn-explore-reels-open)) body.bn-profile--visitor,
html:not(:has(body.bn-explore-reels-open)) body.bn-chat-active,
html:not(:has(body.bn-explore-reels-open)) body.app-shell.bn-profile--visitor,
html:not(:has(body.bn-explore-reels-open)) body.app-shell.bn-chat-active,
html:not(:has(body.bn-explore-reels-open)) main,
html:not(:has(body.bn-explore-reels-open)) .main-content,
html:not(:has(body.bn-explore-reels-open)) .bn-main,
html:not(:has(body.bn-explore-reels-open)) .container,
html:not(:has(body.bn-explore-reels-open)) .app-shell,
body.app-shell:not(.bn-explore-reels-open) .bn-app-page,
body.app-shell:not(.bn-explore-reels-open) .bn-feed-page,
body.app-shell:not(.bn-explore-reels-open) .bn-explore-page,
body.app-shell:not(.bn-explore-reels-open) .bn-search-page,
body.app-shell:not(.bn-explore-reels-open) .bn-settings-page,
body.app-shell:not(.bn-explore-reels-open) .bn-settings-app-page,
body.app-shell:not(.bn-explore-reels-open) .bn-doctors-page,
body.app-shell:not(.bn-explore-reels-open) .doctors-page,
body.app-shell:not(.bn-explore-reels-open) .bn-profile-page,
body.app-shell:not(.bn-explore-reels-open) .bn-chat-page,
body.app-shell:not(.bn-explore-reels-open) .bn-appointments-page,
body.app-shell:not(.bn-explore-reels-open) .bn-notifications-page,
body.app-shell:not(.bn-explore-reels-open) .bn-tools-page,
body.app-shell:not(.bn-explore-reels-open) .bn-chat-layout,
body.app-shell:not(.bn-explore-reels-open) .bn-chat-sidebar,
body.app-shell:not(.bn-explore-reels-open) .bn-chat-main,
body.app-shell:not(.bn-explore-reels-open) .bn-chat-messages,
body.app-shell:not(.bn-explore-reels-open) #chatApp,
body.app-shell:not(.bn-explore-reels-open) #chatLayout,
body.app-shell:not(.bn-explore-reels-open) #chatMessages,
body.app-shell:not(.bn-explore-reels-open) #chatConversationList,
body.app-shell:not(.bn-explore-reels-open) .bn-chat-list,
body.index-page .dl-landing,
body.index-page .dl-hero,
body.index-page .dl-section,
body.index-page .dl-scenarios,
body.index-page .dl-journey,
body.index-page .dl-final,
body.index-page .main-content,
body.auth-page .auth-container,
body.auth-page .auth-container--clean,
body.auth-page .auth-container--notebook,
body.bn-profile--visitor .dp-visitor-stack,
body.bn-profile--visitor .bn-glass--heavy,
body.bn-profile--visitor .iconic-surface,
body.bn-profile--visitor .main-content,
body.bn-chat-active .main-content {
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
}

/* Nested card guts must NOT paint solid white over glass parent */
body.app-shell .bn-feed-card__body,
body.app-shell .bn-feed-card__body.feed-post-body,
body.app-shell .feed-post-body,
body.app-shell .feed-post-compact-actions,
body.app-shell .bn-feed-card__caption,
body.app-shell .feed-post-caption,
body.app-shell .bn-feed-card__author,
body.app-shell .bn-feed-card__author--app,
body.app-shell .bn-feed-card__media,
body.app-shell .feed-post-media-wrap,
body.app-shell .feed-post-media,
body.app-shell .bn-feed-card__media .feed-post-media,
body.bn-profile--visitor .tab-panel,
body.bn-profile--visitor .bn-profile-panel,
body.bn-profile--visitor #profileStoriesSection {
  background: transparent !important;
  background-color: transparent !important;
}

/* ===== Frosted raft recipe ===== */
body.app-shell .app-header,
body.app-shell .app-header--luxury,
body.app-shell .bn-feed-card,
body.app-shell .bn-feed-card.feed-post--cinema,
body.app-shell .bn-feed-card.feed-post--iconic,
body.app-shell .feed-card,
body.app-shell .post-card,
body.app-shell .bn-provider-card,
body.app-shell .doctor-card,
body.app-shell .doctor-card--lux,
body.app-shell .bn-search-hub__panel,
body.app-shell .smart-search-panel,
body.app-shell .smart-search-panel--compact,
body.app-shell .search-bar,
body.app-shell .doctors-search-bar,
body.app-shell .bn-search-bar,
body.app-shell .bn-ai-search-studio,
body.app-shell .bn-ai-search-studio--page,
body.app-shell .settings-card,
body.app-shell .bn-settings-card,
body.app-shell .bn-settings-panel,
body.app-shell .settings-row,
body.app-shell .bn-settings-row,
body.app-shell .bn-settings-item,
body.app-shell .tools-card,
body.app-shell .bn-tool-card,
body.app-shell .bn-tools-card,
body.app-shell .appointment-card,
body.app-shell .bn-appt-card,
body.app-shell .notification-item,
body.app-shell .bn-notif-card,
body.app-shell .notification-card,
body.app-shell .notif-item,
body.app-shell .bn-chat-list-item,
body.app-shell #chatConversationList .bn-chat-list-item,
body.app-shell .bn-chat-thread,
body.app-shell .chat-thread-item,
body.app-shell #chatCompose.bn-chat-compose:not([hidden]),
body.app-shell .bn-chat-compose:not([hidden]),
body.app-shell .bn-profile-card,
body.app-shell .bn-profile-sheet,
body.app-shell .bn-profile-tabs,
body.app-shell .dp-tabs,
body.app-shell .dp-visitor-action-tile,
body.app-shell .dp-visitor-action-tile--lg,
body.app-shell .bn-visitor-action,
body.app-shell .dp-visitor-service-chip,
body.app-shell .dp-owner-hero-btn,
body.app-shell .cp-owner-hero-btn,
body.app-shell .pp-owner-nav-btn,
body.app-shell .pp-owner-edit-chip,
body.app-shell .bn-story-rail,
body.app-shell .bn-owner-actions,
body.app-shell .bn-sheet,
body.app-shell .bn-modal-panel,
body.app-shell .modal-content,
body.app-shell .bn-composer-panel,
body.app-shell .composer-sheet,
body.app-shell .composer-pro-sheet,
body.app-shell .dp-pub-hub__panel,
body.app-shell .composer-pro__header,
body.app-shell .composer-pro__footer,
body.app-shell .dp-pub-hub__head,
body.app-shell #postDetailModal .bn-post-detail-sheet,
body.app-shell #postDetailModal .bn-post-detail-head,
body.app-shell #postDetailModal .bn-post-detail-footer,
body.app-shell #postDetailModal .post-detail-comment-form,
body.app-shell .bn-filter-chip,
body.app-shell .chip,
body.app-shell .bn-stat-chip,
body.app-shell .tag-pill,
body.app-shell .bn-profile-sticky,
body.app-shell .profile-sticky-bar,
body.app-shell .bn-book-bar,
body.auth-page .auth-card,
body.auth-page .auth-box,
body.auth-page .auth-panel,
body.auth-page .auth-notebook-sheet,
body.auth-page .auth-container--clean .auth-card,
body.index-page .navbar,
body.index-page #navbar,
body.index-page .dl-scenario-card,
body.index-page .dl-method-card,
body.index-page .dl-audience-card,
body.index-page .dl-journey__step,
body.index-page .dl-final__box,
body.index-page .dl-btn--ghost,
body.index-page .dl-phone,
body.index-page .dl-phone__screen,
body.index-page .lux-feature-card,
.bn-onb-sheet,
.bn-onb-card,
.bn-onb-panel,
[data-bn-onboarding] .bn-onb-sheet,
.bn-gold-lux-frame {
  background: rgba(255, 255, 255, 0.3) !important;
  background-color: rgba(255, 255, 255, 0.3) !important;
  background-image: none !important;
  backdrop-filter: blur(26px) saturate(1.45) !important;
  -webkit-backdrop-filter: blur(26px) saturate(1.45) !important;
  border: 1px solid rgba(255, 255, 255, 0.62) !important;
  box-shadow:
    0 1px 0 rgba(255, 255, 255, 0.88) inset,
    0 12px 36px rgba(15, 36, 29, 0.08),
    0 1px 0 rgba(197, 164, 109, 0.28) !important;
  border-radius: 28px !important;
}

body.app-shell .app-header,
body.app-shell .app-header--luxury {
  border-radius: 0 !important;
  border-left: none !important;
  border-right: none !important;
  border-top: none !important;
  border-bottom: 1px solid rgba(197, 164, 109, 0.28) !important;
  background: rgba(255, 255, 255, 0.38) !important;
}

body.index-page .navbar,
body.index-page #navbar {
  border-radius: 0 !important;
  border-left: none !important;
  border-right: none !important;
  border-top: none !important;
}

/* Stronger frost for primary sheets */
body.auth-page .auth-card,
body.auth-page .auth-box,
body.auth-page .auth-notebook-sheet,
body.app-shell .composer-sheet,
body.app-shell .composer-pro-sheet,
body.app-shell .dp-pub-hub__panel,
body.app-shell .modal-content,
body.app-shell .bn-modal-panel,
.bn-onb-sheet,
.bn-onb-card {
  background: rgba(255, 255, 255, 0.4) !important;
  backdrop-filter: blur(32px) saturate(1.5) !important;
  -webkit-backdrop-filter: blur(32px) saturate(1.5) !important;
}

/* ===== Floating dock glass (outer transparent, inner frost) ===== */
body.app-shell .bottom-nav,
body.app-shell .bottom-nav--luxury,
body.app-shell .bottom-nav.bottom-nav--glass,
body.app-shell .global-auth-bottom-nav,
body.app-shell .global-auth-bottom-nav.bottom-nav--glass {
  background: transparent !important;
  background-color: transparent !important;
  border: none !important;
  box-shadow: none !important;
}

body.app-shell .bottom-nav--glass .bottom-nav-inner,
body.app-shell .global-auth-bottom-nav.bottom-nav--glass .bottom-nav-inner {
  background: rgba(255, 255, 255, 0.42) !important;
  backdrop-filter: blur(28px) saturate(1.45) !important;
  -webkit-backdrop-filter: blur(28px) saturate(1.45) !important;
  border: 1px solid rgba(255, 255, 255, 0.72) !important;
  border-radius: 28px !important;
  box-shadow:
    0 1px 0 rgba(255, 255, 255, 0.95) inset,
    0 14px 40px rgba(15, 36, 29, 0.14),
    0 0 0 1px rgba(197, 164, 109, 0.18) !important;
}

body.app-shell .bottom-nav--glass .bottom-nav-item.active,
body.app-shell .bottom-nav--glass .bottom-nav-item.is-active,
body.app-shell .bottom-nav--glass .bottom-nav-item[aria-current='page'],
body.app-shell .global-auth-bottom-nav.bottom-nav--glass .bottom-nav-item.active,
body.app-shell .global-auth-bottom-nav.bottom-nav--glass .bottom-nav-item.is-active,
body.app-shell .global-auth-bottom-nav.bottom-nav--glass .bottom-nav-item[aria-current='page'] {
  color: #122c26 !important;
  background: rgba(197, 164, 109, 0.28) !important;
  box-shadow: 0 0 0 1px rgba(197, 164, 109, 0.4) !important;
  border-radius: 18px !important;
}

/* ===== Buttons ===== */
.btn-primary,
.bn-btn-primary,
.bn-btn--primary,
button.btn-primary,
a.btn-primary,
body .btn.btn-primary,
body.auth-page .btn-primary,
body.auth-page .auth-form .btn-primary,
body.auth-page .btn-block.btn-primary,
body.index-page .btn-primary,
body.index-page .dl-btn--primary,
body.index-page .bl-nav-cta:not(.bl-nav-cta--provider),
body.app-shell .bn-cta-primary,
body.app-shell .bn-book-cta,
.bn-composer-submit {
  background: #17382f !important;
  background-image: none !important;
  color: #faf9f5 !important;
  border: 1px solid rgba(197, 164, 109, 0.35) !important;
  border-radius: 999px !important;
  box-shadow:
    0 1px 0 rgba(255, 255, 255, 0.16) inset,
    0 10px 24px rgba(15, 36, 29, 0.2) !important;
}

.btn-secondary,
.bn-btn-secondary,
.bn-btn--secondary,
.btn-ghost,
.bn-btn-ghost,
body.index-page .dl-btn--ghost,
body.app-shell .bn-cta-secondary {
  background: rgba(255, 255, 255, 0.35) !important;
  backdrop-filter: blur(16px) saturate(1.3) !important;
  -webkit-backdrop-filter: blur(16px) saturate(1.3) !important;
  color: #17382f !important;
  border: 1px solid rgba(255, 255, 255, 0.65) !important;
  border-radius: 999px !important;
}

/* Inputs */
body.auth-page input,
body.auth-page .form-control,
body.app-shell .form-control,
body.app-shell input[type='text'],
body.app-shell input[type='search'],
body.app-shell input[type='tel'],
body.app-shell input[type='password'],
body.app-shell textarea,
body.app-shell .bn-chat-input,
body.app-shell .composer-pro__input,
body.app-shell .composer-pro__textarea {
  background: rgba(255, 255, 255, 0.38) !important;
  border: 1px solid rgba(255, 255, 255, 0.65) !important;
  border-radius: 18px !important;
  backdrop-filter: blur(12px) !important;
  -webkit-backdrop-filter: blur(12px) !important;
  box-shadow: 0 1px 0 rgba(255, 255, 255, 0.7) inset !important;
}

/* Chat bubbles */
body.app-shell .bn-chat-bubble--theirs,
body.app-shell #chatMessages .bn-chat-bubble--theirs {
  background: rgba(255, 255, 255, 0.42) !important;
  backdrop-filter: blur(14px) !important;
  -webkit-backdrop-filter: blur(14px) !important;
  border: 1px solid rgba(255, 255, 255, 0.6) !important;
  border-radius: 22px !important;
}

body.app-shell .bn-chat-bubble--mine,
body.app-shell #chatMessages .bn-chat-bubble--mine {
  background: rgba(23, 56, 47, 0.88) !important;
  color: #faf9f5 !important;
  border: 1px solid rgba(197, 164, 109, 0.3) !important;
  border-radius: 22px !important;
}

/* Onboarding overlay glass */
.decto-onboarding,
body.decto-onboarding-open .decto-onboarding {
  background:
    radial-gradient(1100px 560px at 92% -12%, rgba(197, 164, 109, 0.28), transparent 55%),
    radial-gradient(900px 640px at -10% 108%, rgba(23, 56, 47, 0.16), transparent 58%),
    linear-gradient(165deg, rgba(228, 237, 232, 0.45) 0%, rgba(213, 226, 219, 0.35) 44%, rgba(234, 241, 237, 0.45) 100%) !important;
  backdrop-filter: blur(28px) saturate(1.4) !important;
  -webkit-backdrop-filter: blur(28px) saturate(1.4) !important;
}

.decto-onb-post-card,
.decto-onb-doc-card,
.decto-onb-budget__card,
.decto-onb-chip {
  background: rgba(255, 255, 255, 0.34) !important;
  backdrop-filter: blur(28px) saturate(1.45) !important;
  -webkit-backdrop-filter: blur(28px) saturate(1.45) !important;
  border: 1px solid rgba(255, 255, 255, 0.65) !important;
  box-shadow:
    0 1px 0 rgba(255, 255, 255, 0.9) inset,
    0 16px 40px rgba(15, 36, 29, 0.1) !important;
}

.decto-onb-chip.is-active {
  background: #17382f !important;
  color: #fffdf9 !important;
  border-color: rgba(197, 164, 109, 0.35) !important;
}

/* Explore grid header glass; reels stay black */
body.app-shell.bn-explore-route:not(.bn-explore-reels-open) .app-header,
body.app-shell:has(.bn-explore-page):not(.bn-explore-reels-open) .app-header {
  background: rgba(255, 255, 255, 0.38) !important;
  backdrop-filter: blur(26px) saturate(1.4) !important;
  -webkit-backdrop-filter: blur(26px) saturate(1.4) !important;
}

body.bn-explore-reels-open,
html:has(body.bn-explore-reels-open),
body.bn-explore-reels-open .main-content,
#explorePostModal.explore-reels-open,
#explorePostModal.explore-reels-open .explore-reels-shell,
#explorePostModal.explore-reels-open .explore-reels-viewport,
#explorePostModal.explore-reels-open .explore-reels-track,
#explorePostModal.explore-reels-open .explore-reels-slide {
  background: #000 !important;
  background-color: #000 !important;
  background-image: none !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}

html:has(body.bn-explore-reels-open)::before {
  display: none !important;
  content: none !important;
}

/* Media stays clear (no frosted video/image) */
body.app-shell .bn-feed-card img,
body.app-shell .bn-feed-card video,
body.app-shell .feed-post-media img,
body.app-shell .feed-post-media video,
body.app-shell .bn-media img,
body.app-shell .bn-media video,
body.app-shell .ba-slider img {
  background: transparent !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}

/* Browser chrome bleed — soft glass tint */
#bnBrowserChromeBleed {
  background: rgba(255, 255, 255, 0.35) !important;
  backdrop-filter: blur(12px) !important;
  -webkit-backdrop-filter: blur(12px) !important;
}

/* ===== Single glass theme lock (ignore leftover dark attribute) ===== */
html[data-theme='dark'],
html.bn-theme-dark,
body.bn-theme-dark {
  color-scheme: light !important;
}

html[data-theme='dark'],
html[data-theme='dark'] body,
html[data-theme='dark'] body.app-shell {
  --bn-text: #17382f !important;
  --bn-text-2: #5a6b64 !important;
  --bn-text-3: #7a8882 !important;
  --bn-color-text: #17382f !important;
  --bn-color-text-secondary: #5a6b64 !important;
  color: #17382f !important;
  background: transparent !important;
  background-image: none !important;
}

html[data-theme='dark'] {
  background-color: #cfdfd6 !important;
  background-image: var(--bn-ambient-bg) !important;
}

/* Reels comments sheet — matte frost (never ultra-transparent ivory) */
.explore-reels-sheet-panel,
#explorePostModal.explore-reels-open .explore-reels-sheet-panel,
#exploreReelsCommentsSheet .explore-reels-sheet-panel {
  background: rgba(248, 250, 248, 0.94) !important;
  background-color: rgba(248, 250, 248, 0.94) !important;
  background-image: none !important;
  backdrop-filter: blur(28px) saturate(1.35) !important;
  -webkit-backdrop-filter: blur(28px) saturate(1.35) !important;
  border-color: rgba(255, 255, 255, 0.75) !important;
  color: #17382f !important;
  box-shadow:
    0 1px 0 rgba(255, 255, 255, 0.95) inset,
    0 -12px 40px rgba(0, 0, 0, 0.28) !important;
}

.explore-reels-sheet-head,
.explore-reels-sheet-caption,
.explore-reels-sheet-list,
.explore-reels-sheet-form {
  background: transparent !important;
  color: #17382f !important;
}

.explore-reels-sheet-comment,
.explore-reels-sheet-comment p,
.explore-reels-sheet-comment strong {
  color: #17382f !important;
}

.explore-reels-sheet-form input {
  background: rgba(255, 255, 255, 0.9) !important;
  color: #17382f !important;
  border: 1px solid rgba(23, 56, 47, 0.12) !important;
}