/* 2026-10-19 bell palette follow-up: screen colors only.
   Existing logos, form behavior, account rights, scroll visibility, and print unchanged. */
@media screen {
  /* The small top-left logo is already bright. Match its treatment on
     the main hero (whose old rule had filter:none!important) and 1:1. */
  html[data-oreumup-theme="dark"] body #mainHero .hero-visual .visual-card,
  html[data-oreumup-theme="dark"] body.trade-fresh-ui .page-header > .brand {
    background:transparent!important;
    background-color:transparent!important;
    box-shadow:none!important;
  }
  html[data-oreumup-theme="dark"] body #mainHero .hero-visual img.hero-logo,
  html[data-oreumup-theme="dark"] body.trade-fresh-ui .page-header > .brand img {
    background:transparent!important;
    background-color:transparent!important;
    filter:brightness(2.3) saturate(1.4) contrast(1.1)!important;
    mix-blend-mode:screen!important;
    opacity:1!important;
  }
  html[data-oreumup-theme="dark"] body.trade-fresh-ui .page-header > .brand span {
    color:var(--oreumup-bell-text,#fff)!important;
  }

  /* Member guide: the sticky header was authored as white. Change only
     the surface/colors; legal notices and application permissions remain. */
  html[data-oreumup-theme="dark"] body #memberGuideModal :is(
    .member-guide-card,.member-guide-top,.member-guide-top .modal-head,
    .member-guide-top .modal-head-text
  ){
    background:var(--oreumup-bell-panel,#192820)!important;
    background-color:var(--oreumup-bell-panel,#192820)!important;
    border-color:var(--oreumup-bell-border,#496457)!important;
    color:var(--oreumup-bell-text,#fff)!important;
  }
  html[data-oreumup-theme="dark"] body #memberGuideModal
    :is(#memberGuideTitle,.member-guide-top .modal-head h2){
    color:var(--oreumup-bell-text,#fff)!important;
  }
  html[data-oreumup-theme="dark"] body #memberGuideModal .member-guide-top .modal-head p{
    color:var(--oreumup-bell-subtext,#e6e6e6)!important;
  }

  /* Notice create/edit form is injected by the notice builder; the former
     hardcoded #f9fbfc wrapper stays visible over a dark modal without this. */
  html[data-oreumup-theme="dark"] body #noticeModal #noticeCompose{
    background:var(--oreumup-bell-card,#20332a)!important;
    color:var(--oreumup-bell-text,#fff)!important;
    border-color:var(--oreumup-bell-border,#496457)!important;
    box-shadow:inset 0 1px 0 #ffffff0a!important;
  }
  html[data-oreumup-theme="dark"] body #noticeModal #noticeCompose
    :is(.notice-compose-grid,.notice-pin-choice,.board-photo-composer,.board-photo-controls){
    background:transparent!important;
    color:var(--oreumup-bell-text,#fff)!important;
    border-color:var(--oreumup-bell-border,#496457)!important;
  }
  html[data-oreumup-theme="dark"] body #noticeModal #noticeCompose
    :is(label,.notice-pin-choice span,.board-photo-count){
    color:var(--oreumup-bell-subtext,#e6e6e6)!important;
  }
  html[data-oreumup-theme="dark"] body #noticeModal #noticeCompose
    :is(#noticeComposeTitle,#noticeComposeBody,input[type="text"],textarea){
    background:var(--oreumup-bell-panel,#192820)!important;
    color:var(--oreumup-bell-text,#fff)!important;
    caret-color:var(--oreumup-bell-text,#fff)!important;
    border-color:var(--oreumup-bell-border,#496457)!important;
    color-scheme:dark;
  }
  html[data-oreumup-theme="dark"] body #noticeModal #noticeCompose
    :is(input[type="text"],textarea)::placeholder{
    color:var(--oreumup-bell-subtext,#e6e6e6)!important;
    opacity:1!important;
  }
  html[data-oreumup-theme="dark"] body #noticeModal #noticeCompose
    :is(.board-photo-add,.board-photo-save,.board-photo-compose-item button,
        #noticeComposeCancel){
    background:var(--oreumup-bell-panel,#192820)!important;
    color:var(--oreumup-bell-text,#fff)!important;
    border-color:var(--oreumup-bell-border,#496457)!important;
  }
  html[data-oreumup-theme="dark"] body #noticeModal #noticeCompose
    :is(.board-photo-compose-item,.board-photo-manage,.board-photo-thumb){
    background:var(--oreumup-bell-panel,#192820)!important;
    color:var(--oreumup-bell-text,#fff)!important;
    border-color:var(--oreumup-bell-border,#496457)!important;
  }
  html[data-oreumup-theme="dark"] body #noticeModal #noticeCompose .notice-pin-choice input{
    accent-color:var(--oreumup-theme-accent,#76dcac)!important;
    color-scheme:dark;
  }
  html[data-oreumup-theme="dark"] body #noticeModal #noticeCompose
    #noticeComposeSubmit{
    background:var(--oreumup-theme-accent-soft,#1c392a)!important;
    color:var(--oreumup-theme-accent,#76dcac)!important;
    border-color:var(--oreumup-theme-accent,#76dcac)!important;
  }
  html[data-oreumup-theme="dark"] body #noticeModal #noticeCompose
    :is(.notice-compose-status,.board-photo-status){
    color:var(--oreumup-bell-subtext,#e6e6e6)!important;
  }
  html[data-oreumup-theme="dark"] body #noticeModal #noticeCompose
    :is(input,textarea,button):focus-visible{
    outline:2px solid var(--oreumup-theme-focus,#8cc8ff)!important;
    outline-offset:2px!important;
  }
  html[data-oreumup-theme="dark"] body #noticeModal #noticeCompose
    :is(button,input):disabled{
    opacity:.55;
    cursor:not-allowed;
  }

  /* All content windows use this shared ⓘ help button and #oreumupConvTop.
     Its JS owns display, scroll target, position and z-index; only colors here. */
  html[data-oreumup-theme="dark"] body button.oreumup-conv-help,
  html[data-oreumup-theme="dark"] body #oreumupConvTop{
    background:var(--oreumup-bell-card,#20332a)!important;
    background-color:var(--oreumup-bell-card,#20332a)!important;
    color:var(--oreumup-bell-text,#fff)!important;
    border-color:var(--oreumup-bell-border,#496457)!important;
    box-shadow:0 3px 10px #00000035!important;
  }
  html[data-oreumup-theme="dark"] body .oreumup-conv-tip{
    background:var(--oreumup-bell-card,#20332a)!important;
    color:var(--oreumup-bell-text,#fff)!important;
    border-color:var(--oreumup-bell-border,#496457)!important;
    box-shadow:0 14px 38px #00000045!important;
  }
  html[data-oreumup-theme="dark"] body :is(button.oreumup-conv-help,#oreumupConvTop):is(:hover,:focus-visible){
    background:var(--oreumup-bell-hover,#2a4035)!important;
    color:var(--oreumup-theme-accent,#76dcac)!important;
    border-color:var(--oreumup-theme-focus,#8cc8ff)!important;
  }
  html[data-oreumup-theme="dark"] body :is(button.oreumup-conv-help,#oreumupConvTop):focus-visible{
    outline:2px solid var(--oreumup-theme-focus,#8cc8ff)!important;
    outline-offset:2px;
  }
}


/* The quick-tool arrow is inside its scrollable editor, not the tools grid. */
@media screen{
 html[data-oreumup-theme="dark"] body #homeQuickDialog #oreumupQuickTop{
   background:var(--oreumup-bell-card,#20332a)!important;
   border-color:var(--oreumup-bell-border,#496457)!important;
   color:var(--oreumup-bell-text,#fff)!important;
   box-shadow:0 4px 16px #0008!important;
 }
 html[data-oreumup-theme="dark"] body #homeQuickDialog #oreumupQuickTop:is(:hover,:focus-visible){
   background:var(--oreumup-bell-hover,#2a4035)!important;
   color:var(--oreumup-theme-accent,#76dcac)!important;
   border-color:var(--oreumup-theme-focus,#8cc8ff)!important;
 }
}
