/* Open Library Publications — Dark Sticky + Toggle Fix — 2026-08-28 v1
 * 1) keep the theme toggle bright red in every interaction/state
 * 2) preserve visual breathing room below the sticky search, including dark mode
 */
:root{
  --ol38-red:#e3343f;
  --ol38-light-bg:#f7f8fa;
  --ol38-dark-bg:#11151d;
  --ol38-clearance-light:34px;
  --ol38-clearance-dark:48px;
}

/* --------------------------------------------------------------------------
   1. DARK/LIGHT TOGGLE — ALWAYS THE SAME BRIGHT RED
   -------------------------------------------------------------------------- */
html body .openlib_account_cluster--guest > button.openlib_color_mode_toggle,
html body .openlib_account_cluster--guest > button.openlib_color_mode_toggle:hover,
html body .openlib_account_cluster--guest > button.openlib_color_mode_toggle:focus,
html body .openlib_account_cluster--guest > button.openlib_color_mode_toggle:focus-visible,
html body .openlib_account_cluster--guest > button.openlib_color_mode_toggle:active,
html[data-openlib-color-mode="dark"] body .openlib_account_cluster--guest > button.openlib_color_mode_toggle,
html[data-openlib-color-mode="dark"] body .openlib_account_cluster--guest > button.openlib_color_mode_toggle:hover,
html[data-openlib-color-mode="dark"] body .openlib_account_cluster--guest > button.openlib_color_mode_toggle:focus,
html[data-openlib-color-mode="dark"] body .openlib_account_cluster--guest > button.openlib_color_mode_toggle:focus-visible,
html[data-openlib-color-mode="dark"] body .openlib_account_cluster--guest > button.openlib_color_mode_toggle:active{
  background:var(--ol38-red)!important;
  background-color:var(--ol38-red)!important;
  border-color:var(--ol38-red)!important;
  color:#fff!important;
  box-shadow:none!important;
  outline:none!important;
}
html body .openlib_account_cluster--guest > button.openlib_color_mode_toggle .fa,
html[data-openlib-color-mode="dark"] body .openlib_account_cluster--guest > button.openlib_color_mode_toggle .fa{
  color:#fff!important;
}

/* Keep Login/Register bright red on both light and dark backgrounds. */
html body .openlib_site_header--unified .openlib_account_cluster--guest > a.openlib_auth_switch__item,
html body .openlib_journal_header__utility .openlib_account_cluster--guest > a.openlib_auth_switch__item,
html[data-openlib-color-mode="dark"] body .openlib_site_header--unified .openlib_account_cluster--guest > a.openlib_auth_switch__item,
html[data-openlib-color-mode="dark"] body .openlib_journal_header__utility .openlib_account_cluster--guest > a.openlib_auth_switch__item{
  color:var(--ol38-red)!important;
}
html body .openlib_site_header--unified .openlib_account_cluster--guest > a.openlib_auth_switch__item span,
html body .openlib_journal_header__utility .openlib_account_cluster--guest > a.openlib_auth_switch__item span,
html[data-openlib-color-mode="dark"] body .openlib_site_header--unified .openlib_account_cluster--guest > a.openlib_auth_switch__item span,
html[data-openlib-color-mode="dark"] body .openlib_journal_header__utility .openlib_account_cluster--guest > a.openlib_auth_switch__item span{
  color:inherit!important;
}

/* --------------------------------------------------------------------------
   2. SEARCH ↔ BROWSE SPACING
   -------------------------------------------------------------------------- */
/* Use a real flow spacer after the search instead of relying on competing
   historical margins. */
html body.openlib-site-index .openlib_search_panel--primary,
html body.openlib-site-index.openlib-search-is-fixed .openlib_search_panel--primary,
html[data-openlib-color-mode="dark"] body.openlib-site-index .openlib_search_panel--primary,
html[data-openlib-color-mode="dark"] body.openlib-site-index.openlib-search-is-fixed .openlib_search_panel--primary{
  margin-bottom:0!important;
  overflow:visible!important;
}
html body.openlib-site-index .openlib_search_clearance{
  display:block!important;
  width:100%!important;
  height:var(--ol38-clearance-light)!important;
  min-height:var(--ol38-clearance-light)!important;
  margin:0!important;
  padding:0!important;
  border:0!important;
  pointer-events:none!important;
}
html[data-openlib-color-mode="dark"] body.openlib-site-index .openlib_search_clearance{
  height:var(--ol38-clearance-dark)!important;
  min-height:var(--ol38-clearance-dark)!important;
}

/* A small visual buffer below the sticky panel keeps the next section from
   appearing glued to it while scrolling. */
html body.openlib-site-index .openlib_search_panel--primary:after,
html body.openlib-site-index.openlib-search-is-fixed .openlib_search_panel--primary:after{
  position:absolute!important;
  left:0!important;
  right:0!important;
  bottom:-18px!important;
  display:block!important;
  height:18px!important;
  content:""!important;
  background:var(--ol38-light-bg)!important;
  border:0!important;
  box-shadow:none!important;
  pointer-events:none!important;
}
html[data-openlib-color-mode="dark"] body.openlib-site-index .openlib_search_panel--primary:after,
html[data-openlib-color-mode="dark"] body.openlib-site-index.openlib-search-is-fixed .openlib_search_panel--primary:after{
  bottom:-24px!important;
  height:24px!important;
  background:var(--ol38-dark-bg)!important;
}

html body.openlib-site-index .openlib_journal_section{
  margin-top:0!important;
  padding-top:0!important;
}

@media(max-width:767px){
  :root{
    --ol38-clearance-light:24px;
    --ol38-clearance-dark:32px;
  }
  html body.openlib-site-index .openlib_search_panel--primary:after,
  html body.openlib-site-index.openlib-search-is-fixed .openlib_search_panel--primary:after{
    bottom:-12px!important;
    height:12px!important;
  }
  html[data-openlib-color-mode="dark"] body.openlib-site-index .openlib_search_panel--primary:after,
  html[data-openlib-color-mode="dark"] body.openlib-site-index.openlib-search-is-fixed .openlib_search_panel--primary:after{
    bottom:-16px!important;
    height:16px!important;
  }
}