/*
  Fixes the broken two-step hover highlight:
  - removes underline/partial-border pseudo-elements
  - prevents border-bottom-only rules from winning
  - uses a stable full button frame + inset hover ring
*/

/* Browse List / checklist icon in the top bar */
.topbar #listBtn.icon-btn,
#listBtn.icon-btn{
  appearance:none !important;
  -webkit-appearance:none !important;
  box-sizing:border-box !important;
  width:44px !important;
  height:44px !important;
  min-width:44px !important;
  min-height:44px !important;
  padding:10px !important;
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  border:1px solid rgba(255,255,255,.12) !important;
  border-radius:10px !important;
  background:var(--panel) !important;
  color:var(--text) !important;
  opacity:1 !important;
  outline:0 !important;
  box-shadow:inset 0 0 0 0 rgba(255,255,255,0) !important;
  transform:none !important;
  transition:background-color .14s ease, background .14s ease, box-shadow .14s ease, color .14s ease, opacity .14s ease !important;
}
.topbar #listBtn.icon-btn::before,
.topbar #listBtn.icon-btn::after,
#listBtn.icon-btn::before,
#listBtn.icon-btn::after{
  content:none !important;
  display:none !important;
}
.topbar #listBtn.icon-btn:hover,
.topbar #listBtn.icon-btn:focus-visible,
#listBtn.icon-btn:hover,
#listBtn.icon-btn:focus-visible{
  border-color:rgba(255,255,255,.6) !important;
  background:rgba(255,255,255,.08) !important;
  color:#fff !important;
  opacity:1 !important;
  outline:0 !important;
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.60) !important;
  transform:none !important;
}

/* Top-level comic cut arrows under search */
#result > #comicCutNav.comic-cut-nav .comic-cut-nav-icon-btn:not(.ccc-shared-icon-control),
#result > .comic-cut-nav .comic-cut-nav-icon-btn:not(.ccc-shared-icon-control),
#comicCutNav.comic-cut-nav > .comic-cut-nav-icon-btn:not(.ccc-shared-icon-control){
  appearance:none !important;
  -webkit-appearance:none !important;
  box-sizing:border-box !important;
  width:44px !important;
  height:40px !important;
  min-width:44px !important;
  min-height:40px !important;
  padding:0 !important;
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  border:1px solid rgba(255,255,255,.12) !important;
  border-bottom:1px solid rgba(255,255,255,.12) !important;
  border-radius:12px !important;
  background:transparent !important;
  color:var(--text) !important;
  opacity:1 !important;
  outline:0 !important;
  box-shadow:inset 0 0 0 0 rgba(255,255,255,0) !important;
  transform:none !important;
  transition:background-color .14s ease, background .14s ease, box-shadow .14s ease, color .14s ease, opacity .14s ease !important;
}
#result > #comicCutNav.comic-cut-nav .comic-cut-nav-icon-btn:not(.ccc-shared-icon-control)::before,
#result > #comicCutNav.comic-cut-nav .comic-cut-nav-icon-btn:not(.ccc-shared-icon-control)::after,
#result > .comic-cut-nav .comic-cut-nav-icon-btn:not(.ccc-shared-icon-control)::before,
#result > .comic-cut-nav .comic-cut-nav-icon-btn:not(.ccc-shared-icon-control)::after,
#comicCutNav.comic-cut-nav > .comic-cut-nav-icon-btn:not(.ccc-shared-icon-control)::before,
#comicCutNav.comic-cut-nav > .comic-cut-nav-icon-btn:not(.ccc-shared-icon-control)::after{
  content:none !important;
  display:none !important;
  opacity:0 !important;
  transform:none !important;
}
#result > #comicCutNav.comic-cut-nav .comic-cut-nav-icon-btn:not(.ccc-shared-icon-control):hover,
#result > #comicCutNav.comic-cut-nav .comic-cut-nav-icon-btn:not(.ccc-shared-icon-control):focus-visible,
#result > .comic-cut-nav .comic-cut-nav-icon-btn:not(.ccc-shared-icon-control):hover,
#result > .comic-cut-nav .comic-cut-nav-icon-btn:not(.ccc-shared-icon-control):focus-visible,
#comicCutNav.comic-cut-nav > .comic-cut-nav-icon-btn:not(.ccc-shared-icon-control):hover,
#comicCutNav.comic-cut-nav > .comic-cut-nav-icon-btn:not(.ccc-shared-icon-control):focus-visible{
  border-color:rgba(255,255,255,.12) !important;
  border-bottom-color:rgba(255,255,255,.12) !important;
  background:rgba(255,255,255,.08) !important;
  color:#fff !important;
  opacity:1 !important;
  outline:0 !important;
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.60) !important;
  transform:none !important;
}

/* Card-mounted left/right arrows: these had later rules that could beat the top-nav selectors */
.card .comic-cut-card-action-stack > #comicCutNav.comic-cut-nav #backToSetBtn:not(.ccc-shared-icon-control),
.card .comic-cut-card-action-stack > #comicCutNav.comic-cut-nav #nextComicCutBtn:not(.ccc-shared-icon-control),
.card .comic-cut-card-action-stack > .comic-cut-nav .comic-cut-nav-btn:not(.ccc-shared-icon-control),
.card .comic-cut-card-action-stack > .comic-cut-nav .comic-cut-nav-icon-btn:not(.ccc-shared-icon-control){
  box-sizing:border-box !important;
  border:1px solid rgba(255,255,255,.12) !important;
  border-bottom:1px solid rgba(255,255,255,.12) !important;
  border-radius:12px !important;
  background:var(--panel) !important;
  color:var(--text) !important;
  box-shadow:inset 0 0 0 0 rgba(255,255,255,0) !important;
  transform:none !important;
  text-decoration:none !important;
  transition:background-color .14s ease, background .14s ease, box-shadow .14s ease, color .14s ease, opacity .14s ease !important;
}
.card .comic-cut-card-action-stack > #comicCutNav.comic-cut-nav #backToSetBtn:not(.ccc-shared-icon-control)::before,
.card .comic-cut-card-action-stack > #comicCutNav.comic-cut-nav #backToSetBtn:not(.ccc-shared-icon-control)::after,
.card .comic-cut-card-action-stack > #comicCutNav.comic-cut-nav #nextComicCutBtn:not(.ccc-shared-icon-control)::before,
.card .comic-cut-card-action-stack > #comicCutNav.comic-cut-nav #nextComicCutBtn:not(.ccc-shared-icon-control)::after,
.card .comic-cut-card-action-stack > .comic-cut-nav .comic-cut-nav-btn:not(.ccc-shared-icon-control)::before,
.card .comic-cut-card-action-stack > .comic-cut-nav .comic-cut-nav-btn:not(.ccc-shared-icon-control)::after,
.card .comic-cut-card-action-stack > .comic-cut-nav .comic-cut-nav-icon-btn:not(.ccc-shared-icon-control)::before,
.card .comic-cut-card-action-stack > .comic-cut-nav .comic-cut-nav-icon-btn:not(.ccc-shared-icon-control)::after{
  content:none !important;
  display:none !important;
  opacity:0 !important;
  transform:none !important;
}
.card .comic-cut-card-action-stack > #comicCutNav.comic-cut-nav #backToSetBtn:not(.ccc-shared-icon-control):hover,
.card .comic-cut-card-action-stack > #comicCutNav.comic-cut-nav #backToSetBtn:not(.ccc-shared-icon-control):focus-visible,
.card .comic-cut-card-action-stack > #comicCutNav.comic-cut-nav #nextComicCutBtn:not(.ccc-shared-icon-control):hover,
.card .comic-cut-card-action-stack > #comicCutNav.comic-cut-nav #nextComicCutBtn:not(.ccc-shared-icon-control):focus-visible,
.card .comic-cut-card-action-stack > .comic-cut-nav .comic-cut-nav-btn:not(.ccc-shared-icon-control):hover,
.card .comic-cut-card-action-stack > .comic-cut-nav .comic-cut-nav-btn:not(.ccc-shared-icon-control):focus-visible,
.card .comic-cut-card-action-stack > .comic-cut-nav .comic-cut-nav-icon-btn:not(.ccc-shared-icon-control):hover,
.card .comic-cut-card-action-stack > .comic-cut-nav .comic-cut-nav-icon-btn:not(.ccc-shared-icon-control):focus-visible{
  border-color:rgba(255,255,255,.12) !important;
  border-bottom-color:rgba(255,255,255,.12) !important;
  background:rgba(255,255,255,.08) !important;
  color:#fff !important;
  outline:0 !important;
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.60) !important;
  transform:none !important;
  text-decoration:none !important;
}

/* Logged-in Set Checklist pill: same stable full-frame hover */
#comicCutNav.ccc-logged-in-checklist-mode #backToSetBtn:not(.ccc-shared-icon-control),
.card .comic-cut-card-action-stack > #comicCutNav.ccc-logged-in-checklist-mode #backToSetBtn:not(.ccc-shared-icon-control){
  border:1px solid rgba(255,255,255,.12) !important;
  border-bottom:1px solid rgba(255,255,255,.12) !important;
  border-radius:999px !important;
  background:rgba(255,255,255,.04) !important;
  box-shadow:inset 0 0 0 0 rgba(255,255,255,0) !important;
}
#comicCutNav.ccc-logged-in-checklist-mode #backToSetBtn:not(.ccc-shared-icon-control):hover,
#comicCutNav.ccc-logged-in-checklist-mode #backToSetBtn:not(.ccc-shared-icon-control):focus-visible,
.card .comic-cut-card-action-stack > #comicCutNav.ccc-logged-in-checklist-mode #backToSetBtn:not(.ccc-shared-icon-control):hover,
.card .comic-cut-card-action-stack > #comicCutNav.ccc-logged-in-checklist-mode #backToSetBtn:not(.ccc-shared-icon-control):focus-visible{
  border-color:rgba(255,255,255,.12) !important;
  border-bottom-color:rgba(255,255,255,.12) !important;
  background:rgba(255,255,255,.08) !important;
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.60) !important;
  color:#fff !important;
}

@media (max-width:780px){
  #result > #comicCutNav.comic-cut-nav .comic-cut-nav-icon-btn:not(.ccc-shared-icon-control),
  #result > .comic-cut-nav .comic-cut-nav-icon-btn:not(.ccc-shared-icon-control),
  #comicCutNav.comic-cut-nav > .comic-cut-nav-icon-btn:not(.ccc-shared-icon-control){
    width:42px !important;
    height:38px !important;
    min-width:42px !important;
    min-height:38px !important;
  }
}
