/* Open Library Publications — Integrated Red UI — 2026-08-28 v6
 * SVG icon alignment hotfix. Uses dedicated icon wrappers instead of Font Awesome
 * pseudo elements so search/filter icons stay centered in all states.
 */
:root{
  --ol6-red:#c51f29;
  --ol6-red-dark:#95151e;
  --ol6-muted:#7b8798;
}

/* Hide only the old Font Awesome field icons, if stale markup/cache still contains them. */
html body.openlib-site-index .openlib_discovery__query > .fa,
html body.openlib-site-index .openlib_journal_filter > .fa,
html body.openlib-site-index .openlib_discovery__form > button > .fa{
  display:none!important;
}

/* Search/filter wrappers are always the positioning context. */
html body.openlib-site-index .openlib_discovery__query,
html body.openlib-site-index .openlib_journal_filter{
  position:relative!important;
}

/* Dedicated field SVG icons — simple, no bubble/chip, true vertical centering. */
html body.openlib-site-index .openlib_field_icon{
  position:absolute!important;
  left:17px!important;
  top:50%!important;
  z-index:6!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  width:18px!important;
  height:18px!important;
  margin:0!important;
  padding:0!important;
  border:0!important;
  border-radius:0!important;
  background:transparent!important;
  color:var(--ol6-red)!important;
  transform:translateY(-50%)!important;
  pointer-events:none!important;
  box-shadow:none!important;
  overflow:visible!important;
}
html body.openlib-site-index .openlib_field_icon svg{
  display:block!important;
  width:17px!important;
  height:17px!important;
  margin:0!important;
  overflow:visible!important;
  fill:none!important;
  stroke:currentColor!important;
  stroke-width:1.9!important;
  stroke-linecap:round!important;
  stroke-linejoin:round!important;
}
html body.openlib-site-index .openlib_field_icon--filter svg{
  width:16px!important;
  height:16px!important;
  fill:currentColor!important;
  stroke:none!important;
}

/* Explicit insets matching the icon position. */
html body.openlib-site-index .openlib_discovery__query input[type="search"]{
  padding-left:48px!important;
  padding-right:18px!important;
}
html body.openlib-site-index .openlib_journal_filter input{
  padding-left:46px!important;
  padding-right:16px!important;
}

/* Submit icon uses the same SVG language and is part of normal flex flow. */
html body.openlib-site-index .openlib_discovery__form > button{
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  gap:8px!important;
}
html body.openlib-site-index .openlib_button_icon{
  position:static!important;
  flex:0 0 16px!important;
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  width:16px!important;
  height:16px!important;
  margin:0!important;
  padding:0!important;
  border:0!important;
  border-radius:0!important;
  background:transparent!important;
  color:var(--ol6-red)!important;
  box-shadow:none!important;
}
html body.openlib-site-index .openlib_button_icon svg{
  display:block!important;
  width:15px!important;
  height:15px!important;
  fill:none!important;
  stroke:currentColor!important;
  stroke-width:2!important;
  stroke-linecap:round!important;
  stroke-linejoin:round!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{
  color:var(--ol6-red-dark)!important;
}

/* Dark mode: retain high contrast inside dark fields. */
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{
  color:#ff7f88!important;
}

@media(max-width:767px){
  html body.openlib-site-index .openlib_field_icon{left:15px!important;}
  html body.openlib-site-index .openlib_discovery__query input[type="search"]{padding-left:44px!important;}
  html body.openlib-site-index .openlib_journal_filter input{padding-left:43px!important;}
}
