/* Open Library Publications — Icon Accent + Sticky Gap — 2026-08-28 v1
 * Keeps icon areas clearly visible with solid Tel-U red backgrounds.
 * Also separates the sticky portal search from the unified sticky header.
 */
:root{
  --ol32-red:#c91f2b;
  --ol32-red-dark:#a91823;
  --ol32-red-soft:#fff4f5;
  --ol32-header-h:68px;
  --ol32-sticky-gap:12px;
}

/* --------------------------------------------------------------------------
   1. STACKED STICKY HEADER + SEARCH: never touch/overlap each other
   -------------------------------------------------------------------------- */
html body .openlib_site_header--unified{
  position:sticky!important;
  top:0!important;
  z-index:1250!important;
}
html body.openlib-site-index .openlib_search_panel--primary,
html body.openlib-site-index.openlib-search-is-fixed .openlib_search_panel--primary{
  top:calc(var(--ol32-header-h) + var(--ol32-sticky-gap))!important;
  z-index:1180!important;
}

/* --------------------------------------------------------------------------
   2. SEARCH + FILTER FIELD ICONS: solid red tile, white SVG
   -------------------------------------------------------------------------- */
html body.openlib-site-index .openlib_field_icon{
  left:10px!important;
  width:32px!important;
  height:32px!important;
  border:1px solid var(--ol32-red)!important;
  border-radius:9px!important;
  background:var(--ol32-red)!important;
  color:#fff!important;
  box-shadow:0 4px 10px rgba(169,24,35,.14)!important;
  overflow:hidden!important;
}
html body.openlib-site-index .openlib_field_icon svg{
  width:14px!important;
  height:14px!important;
  color:#fff!important;
}
html body.openlib-site-index .openlib_field_icon--filter svg{
  width:13px!important;
  height:13px!important;
  fill:#fff!important;
  stroke:none!important;
}
html body.openlib-site-index .openlib_discovery__query input[type="search"]{
  padding-left:54px!important;
}
html body.openlib-site-index .openlib_journal_filter input{
  padding-left:52px!important;
}

/* Search button icon uses the same visual language. */
html body.openlib-site-index .openlib_button_icon{
  flex:0 0 28px!important;
  width:28px!important;
  height:28px!important;
  border:1px solid var(--ol32-red)!important;
  border-radius:8px!important;
  background:var(--ol32-red)!important;
  color:#fff!important;
  box-shadow:none!important;
}
html body.openlib-site-index .openlib_button_icon svg{
  width:13px!important;
  height:13px!important;
  stroke:#fff!important;
}
html body.openlib-site-index .openlib_discovery__form>button:hover .openlib_button_icon,
html body.openlib-site-index .openlib_discovery__form>button:focus .openlib_button_icon{
  background:var(--ol32-red-dark)!important;
  border-color:var(--ol32-red-dark)!important;
  color:#fff!important;
}

/* --------------------------------------------------------------------------
   3. DARK/LIGHT ICON IN AUTH CAPSULE: red tile, same radius as the rest
   -------------------------------------------------------------------------- */
html body .openlib_account_cluster--guest>.openlib_color_mode_toggle,
html[data-openlib-color-mode="dark"] body .openlib_account_cluster--guest>.openlib_color_mode_toggle{
  border:1px solid var(--ol32-red)!important;
  border-radius:10px!important;
  background:var(--ol32-red)!important;
  color:#fff!important;
  box-shadow:none!important;
}
html body .openlib_account_cluster--guest>.openlib_color_mode_toggle .fa,
html[data-openlib-color-mode="dark"] body .openlib_account_cluster--guest>.openlib_color_mode_toggle .fa{
  color:#fff!important;
}
html body .openlib_account_cluster--guest>.openlib_color_mode_toggle:hover,
html body .openlib_account_cluster--guest>.openlib_color_mode_toggle:focus{
  border-color:var(--ol32-red-dark)!important;
  background:var(--ol32-red-dark)!important;
  color:#fff!important;
}

/* --------------------------------------------------------------------------
   4. ADVANCED FILTER ICON: same red icon tile for consistency
   -------------------------------------------------------------------------- */
html body .openlib_search_advanced summary .openlib_advanced_icon{
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  width:28px!important;
  height:28px!important;
  min-width:28px!important;
  margin:0 9px 0 0!important;
  padding:0!important;
  border:1px solid var(--ol32-red)!important;
  border-radius:8px!important;
  background:var(--ol32-red)!important;
  color:#fff!important;
  box-shadow:none!important;
}
html body .openlib_search_advanced summary .openlib_advanced_icon svg{
  width:13px!important;
  height:13px!important;
  color:#fff!important;
  stroke:#fff!important;
}

html[data-openlib-color-mode="dark"] body.openlib-site-index .openlib_field_icon,
html[data-openlib-color-mode="dark"] body.openlib-site-index .openlib_button_icon,
html[data-openlib-color-mode="dark"] body .openlib_search_advanced summary .openlib_advanced_icon{
  background:#d72d38!important;
  border-color:#d72d38!important;
  color:#fff!important;
}

@media(max-width:600px){
  :root{--ol32-header-h:62px;--ol32-sticky-gap:8px;}
  html body.openlib-site-index .openlib_field_icon{left:8px!important;width:30px!important;height:30px!important;border-radius:8px!important;}
  html body.openlib-site-index .openlib_discovery__query input[type="search"]{padding-left:48px!important;}
  html body.openlib-site-index .openlib_journal_filter input{padding-left:48px!important;}
}
