/* VibeForge Modern: final dark-mode surface layer.
 * This file is loaded after every legacy and page-specific stylesheet. */
body.night-mode {
  --vf-dark-canvas: #09111c;
  --vf-dark-surface: #111b28;
  --vf-dark-surface-raised: #162334;
  --vf-dark-line: rgba(148, 170, 201, .24);
  --vf-dark-line-strong: rgba(164, 187, 220, .36);
  --vf-dark-text: #edf4ff;
  --vf-dark-muted: #a9bbd2;
  --vf-dark-link: #8cbcff;
  background: var(--vf-dark-canvas) !important;
  color: var(--vf-dark-text);
}

body.night-mode :is(.main-wrapper, #vf-main-content, .sg-offcanvas, .sg-offcanvas-mainbar) {
  background-color: var(--vf-dark-canvas) !important;
  color: var(--vf-dark-text);
}

body.night-mode:not(.vf-page-profile) #vf-main-content :is(
  .card, .post, .publisher, .panel, .widget, .vf-side-card,
  .sidebar-meta-widget, .vf-sponsored-card, .modal-content,
  .dropdown-menu, .action-dropdown-menu, .list-group-item
) {
  border-color: var(--vf-dark-line) !important;
  background-color: var(--vf-dark-surface) !important;
  color: var(--vf-dark-text) !important;
}

body.night-mode :is(.modal-content, .dropdown-menu, .action-dropdown-menu, .vf-share-slideout) {
  border-color: var(--vf-dark-line-strong) !important;
  background-color: var(--vf-dark-surface-raised) !important;
  color: var(--vf-dark-text) !important;
  box-shadow: 0 18px 46px rgba(0, 0, 0, .42) !important;
}

body.night-mode :is(.dropdown-menu, .action-dropdown-menu) .dropdown-item { color: var(--vf-dark-text) !important; }
body.night-mode :is(.dropdown-menu, .action-dropdown-menu) .dropdown-item:is(:hover, :focus, .active) {
  background: rgba(72, 138, 232, .20) !important;
  color: #fff !important;
}

body.night-mode:not(.vf-page-profile) #vf-main-content :is(.card-header, .card-footer, .panel-heading, .panel-footer, .list-group-item, .table > :not(caption) > * > *, .table-bordered) {
  border-color: var(--vf-dark-line) !important;
  color: inherit;
}
body.night-mode:not(.vf-page-profile) #vf-main-content :is(.text-muted, .post-meta, .post-time, .description, .form-text, .help-block, .card-text-muted, .small.text-muted) { color: var(--vf-dark-muted) !important; }
body.night-mode:not(.vf-page-profile) #vf-main-content :is(.card-title, .panel-title, .section-title, .widget-title, .modal-title, .form-label, h1, h2, h3, h4, h5, h6) { color: var(--vf-dark-text); }

body.night-mode :is(#vf-main-content, #modal, #external-link-modal, .vf-share-slideout) :is(
  .form-control, .form-select, .custom-select, textarea,
  input[type="text"], input[type="search"], input[type="email"], input[type="url"],
  input[type="tel"], input[type="number"], input[type="password"]
) {
  border-color: var(--vf-dark-line-strong) !important;
  background-color: #0d1724 !important;
  color: var(--vf-dark-text) !important;
}
body.night-mode :is(#vf-main-content, #modal, #external-link-modal, .vf-share-slideout) :is(.form-control, .form-select, .custom-select, textarea)::placeholder { color: #91a5c0 !important; opacity: 1; }
body.night-mode :is(#vf-main-content, #modal, #external-link-modal, .vf-share-slideout) :is(.form-control, .form-select, .custom-select, textarea):focus {
  border-color: #5c9dff !important;
  box-shadow: 0 0 0 3px rgba(92, 157, 255, .18) !important;
}

/* Feed and story surfaces had the most specific legacy white declarations. */
body.night-mode.vf-page-index #vf-main-content .vf-home-look-neighborhood .vf-stories-card,
body.night-mode.vf-page-index #vf-main-content .vf-home-look-neighborhood .vf-stories-card.vf-stories-card-empty,
body.night-mode.vf-page-index #vf-main-content .vf-home-look-neighborhood .composer-launcher,
body.night-mode.vf-page-index #vf-main-content .vf-home-look-neighborhood .composer-launcher-input {
  border-color: var(--vf-dark-line) !important;
  background: var(--vf-dark-surface) !important;
  color: var(--vf-dark-text) !important;
}
body.night-mode.vf-page-index #vf-main-content .vf-home-look-neighborhood .vf-stories-card .stories,
body.night-mode.vf-page-index #vf-main-content .vf-home-look-neighborhood .vf-stories-card .story,
body.night-mode.vf-page-index #vf-main-content .vf-home-look-neighborhood .vf-stories-card .add-story,
body.night-mode.vf-page-index #vf-main-content .vf-home-look-neighborhood .composer-launcher :is(.card-body, .publisher-tools, .publisher-footer) {
  border-color: var(--vf-dark-line) !important;
  background: var(--vf-dark-surface) !important;
  color: var(--vf-dark-text) !important;
}
body.night-mode.vf-page-index #vf-main-content .vf-home-look-neighborhood .vf-stories-card :is(.vf-story-create-title, .add-story::after, .story > .item-link > .info) { color: var(--vf-dark-text) !important; }
body.night-mode.vf-page-index #vf-main-content .vf-home-look-neighborhood .vf-composer-quick-actions { border-color: var(--vf-dark-line) !important; }
body.night-mode.vf-page-index #vf-main-content .vf-home-look-neighborhood .composer-launcher :is(a, button):not(.btn-primary) { color: #cbd9eb !important; }

body.night-mode .vf-neighborhood-flat-link.is-active { background: rgba(45, 118, 230, .30) !important; color: #f5f9ff !important; }
body.night-mode .vf-neighborhood-flat-link.is-active > i { background: #126edb !important; color: #fff !important; }
body.night-mode .vf-modern-rail-toggle { border-color: var(--vf-dark-line) !important; background: var(--vf-dark-surface-raised) !important; color: var(--vf-dark-text) !important; }
body.night-mode :is(.vf-side-card, .sidebar-meta-widget, .vf-sponsored-card) :is(.card-header, .card-footer) { background: transparent !important; }
body.night-mode a:not(.btn):not(.vf-neighborhood-flat-link) { color: var(--vf-dark-link); }
body.night-mode a:not(.btn):not(.vf-neighborhood-flat-link):hover { color: #c3dcff; }

/*
 * The neighborhood composition deliberately uses a highly specific
 * html/body daytime path. Match that path here so its forced white surfaces
 * cannot win against this final dark-mode layer.
 */
html body.night-mode.vf-page-index.vf-view-default #vf-main-content .vf-home-look-neighborhood .vf-stories-card,
html body.night-mode.vf-page-index.vf-view-default #vf-main-content .vf-home-look-neighborhood .vf-stories-card.vf-stories-card-empty,
html body.night-mode.vf-page-index.vf-view-default #vf-main-content .vf-home-look-neighborhood .composer-launcher {
  background: var(--vf-dark-surface) !important;
  border-color: var(--vf-dark-line) !important;
  color: var(--vf-dark-text) !important;
  box-shadow: 0 12px 30px rgba(0, 0, 0, .20) !important;
}

html body.night-mode.vf-page-index.vf-view-default #vf-main-content .vf-home-look-neighborhood .composer-launcher-input {
  background: var(--vf-dark-surface-raised) !important;
  border-color: var(--vf-dark-line) !important;
  color: var(--vf-dark-text) !important;
}

html body.night-mode.vf-page-index.vf-view-default #vf-main-content .vf-home-look-neighborhood .composer-launcher-input :is(.vf-composer-prompt, span),
html body.night-mode.vf-page-index.vf-view-default #vf-main-content .vf-home-look-neighborhood .vf-story-create-copy,
html body.night-mode.vf-page-index.vf-view-default #vf-main-content .vf-home-look-neighborhood .vf-story-create-title {
  color: var(--vf-dark-muted) !important;
}

html body.night-mode.vf-page-index.vf-view-default #vf-main-content .vf-home-look-neighborhood .vf-composer-quick-actions {
  border-top-color: var(--vf-dark-line) !important;
}

html body.night-mode.vf-page-index.vf-view-default #vf-main-content .vf-home-look-neighborhood .vf-composer-quick-actions > button:not(.vf-composer-action-publish) {
  border-right-color: var(--vf-dark-line) !important;
  color: #cbd9eb !important;
}

html body.night-mode.vf-page-index.vf-view-default #vf-main-content .vf-home-look-neighborhood .vf-stories-card #stories .add-story {
  background: var(--vf-dark-surface-raised) !important;
  border-color: var(--vf-dark-line) !important;
}

html body.night-mode.vf-page-index.vf-view-default #vf-main-content .vf-home-look-neighborhood .vf-stories-card > .card-body,
html body.night-mode.vf-page-index.vf-view-default #vf-main-content .vf-home-look-neighborhood .vf-stories-card .stories-wrapper {
  background: var(--vf-dark-surface) !important;
  border-color: var(--vf-dark-line) !important;
  color: var(--vf-dark-text) !important;
}

html body.night-mode.vf-page-index.vf-view-default #vf-main-content .vf-home-look-neighborhood .vf-stories-card .add-story :is(.vf-story-create-title, .vf-story-create-description, .vf-story-create-copy) {
  color: var(--vf-dark-muted) !important;
}

html body.night-mode.vf-page-index.vf-view-default #vf-main-content .vf-home-look-neighborhood :is(.vf-neighborhood-welcome-card, .vf-neighborhood-spotlight, .vf-neighborhood-creators) {
  background: var(--vf-dark-surface) !important;
  border-color: var(--vf-dark-line) !important;
  box-shadow: 0 10px 25px rgba(0, 0, 0, .18) !important;
}

html body.night-mode.vf-page-index.vf-view-default #vf-main-content .vf-home-look-neighborhood :is(.vf-neighborhood-welcome-card, .vf-neighborhood-spotlight, .vf-neighborhood-creators) :is(strong, .vf-neighborhood-spotlight-head) {
  color: var(--vf-dark-text) !important;
}

html body.night-mode.vf-page-index.vf-view-default #vf-main-content .vf-home-look-neighborhood :is(.vf-neighborhood-welcome-card, .vf-neighborhood-spotlight, .vf-neighborhood-creators) :is(p, small) {
  color: var(--vf-dark-muted) !important;
}

/* Keep the fixed desktop rail and its sticky host a single dark column. */
html body.night-mode.vf-page-index.vf-view-default {
  background: var(--vf-dark-canvas) !important;
}

html body.night-mode.vf-page-index.vf-view-default #vf-main-content .vf-newsfeed-shell.vf-home-look-neighborhood > .row > .sg-offcanvas-sidebar > .theiaStickySidebar,
html body.night-mode.vf-page-index.vf-view-default #vf-main-content .vf-newsfeed-shell.vf-home-look-neighborhood > .row > .sg-offcanvas-sidebar .vf-rail {
  background: var(--vf-dark-surface) !important;
  border-color: var(--vf-dark-line) !important;
}

@media (max-width: 767.98px) {
  body.night-mode :is(.vf-mobile-bottom-nav, .vf-pwa-bottom-nav, .mobile-navigation) {
    border-color: var(--vf-dark-line) !important;
    background: var(--vf-dark-surface-raised) !important;
  }
  body.night-mode :is(.vf-mobile-bottom-nav, .vf-pwa-bottom-nav, .mobile-navigation) :is(a, button) { color: var(--vf-dark-muted) !important; }
  body.night-mode :is(.vf-mobile-bottom-nav, .vf-pwa-bottom-nav, .mobile-navigation) .active { color: #fff !important; }
}

/* Forge: preset surfaces are light even when night mode supplies light text.
 * Scope to the admin shell and outrank the inline preset/light header rules. */
html body.night-mode.vf-page-admin #vf-main-content .admin-shell .admin-sidebar {
  background: transparent !important;
  border-color: var(--vf-dark-line) !important;
}
html body.night-mode.vf-page-admin #vf-main-content .admin-shell .admin-sidebar .side-nav {
  background: var(--vf-dark-surface) !important;
  border-color: var(--vf-dark-line) !important;
  color: var(--vf-dark-text) !important;
}
html body.night-mode.vf-page-admin #vf-main-content .admin-shell :is(.card-header, .block-title),
html body.night-mode.vf-page-admin .modal-header {
  background: var(--vf-dark-surface-raised) !important;
  border-color: var(--vf-dark-line) !important;
  color: var(--vf-dark-text) !important;
}
html body.night-mode.vf-page-admin #vf-main-content .admin-shell :is(.card-header, .block-title) *,
html body.night-mode.vf-page-admin .modal-header * {
  color: inherit !important;
}
html body.night-mode.vf-page-admin #vf-main-content .admin-shell .admin-sidebar .side-nav a {
  color: var(--vf-dark-text) !important;
}
html body.night-mode.vf-page-admin #vf-main-content .admin-shell .admin-sidebar .side-nav a :is(i, svg, svg *) {
  color: var(--vf-dark-link) !important;
  fill: currentColor !important;
}
html body.night-mode.vf-page-admin #vf-main-content .admin-shell .admin-sidebar .side-nav a:is(:hover, :focus-visible),
html body.night-mode.vf-page-admin #vf-main-content .admin-shell .admin-sidebar .side-nav li.active > a {
  background: #245ac4 !important;
  color: #fff !important;
}
html body.night-mode.vf-page-admin #vf-main-content .admin-shell .admin-sidebar .side-nav a:is(:hover, :focus-visible) :is(i, svg, svg *),
html body.night-mode.vf-page-admin #vf-main-content .admin-shell .admin-sidebar .side-nav li.active > a :is(i, svg, svg *) {
  color: #fff !important;
  fill: currentColor !important;
}
html body.night-mode.vf-page-admin #vf-main-content .admin-shell .admin-sidebar .side-nav a i::before {
  color: inherit !important;
}
html body.night-mode.vf-page-admin #vf-main-content .admin-shell .card {
  border-color: var(--vf-dark-line) !important;
}