/*
  ФАЙЛ: favorites.css
  Назначение: строка BAG-поиска и окно избранных сумок.
  Здесь только оформление. Механика поиска/избранного/редактирования остается прежней.
*/

/* ===== MAIN BAG ROW ===== */

#bagSearchWrap,
.bag-search-wrap{
  width: var(--site-visual-width, min(500px, calc(100vw - 24px))) !important;
  max-width: var(--site-max-width, 500px) !important;
  margin: 4px auto 12px auto !important;
  box-sizing: border-box !important;
  position: relative !important;
  z-index: 6 !important;
}

#bagSearchWrap .bag-search-row,
.bag-search-row{
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) 44px 44px !important;
  align-items: center !important;
  gap: 10px !important;
  width: 100% !important;
  box-sizing: border-box !important;
}

#bagSearchWrap .bag-search-field,
.bag-search-field{
  position: relative !important;
  min-width: 0 !important;
  width: 100% !important;
}

#bagSearchInput,
.bag-search-input{
  width: 100% !important;
  height: 44px !important;
  min-height: 44px !important;
  max-height: 44px !important;
  border-radius: 12px !important;
  border: 1px solid #d8dde6 !important;
  background: #ffffff !important;
  color: #111827 !important;
  padding: 0 94px 0 14px !important;
  box-sizing: border-box !important;
  font-size: 14px !important;
  font-family: Arial, sans-serif !important;
  font-weight: 800 !important;
  line-height: 1 !important;
  outline: none !important;
  box-shadow: none !important;
  appearance: none !important;
  -webkit-appearance: none !important;
  transition: border-color .16s ease, background-color .16s ease, color .16s ease, opacity .16s ease !important;
}

#bagSearchInput::placeholder,
.bag-search-input::placeholder{
  color: #7d8593 !important;
  opacity: 1 !important;
  font-weight: 700 !important;
}

#bagSearchInput:focus,
.bag-search-input:focus{
  border-color: #ff8c00 !important;
}

#bagSearchInput.wallet-ui-disabled,
.bag-search-input.wallet-ui-disabled,
#bagSearchInput:disabled,
.bag-search-input:disabled{
  opacity: .45 !important;
  cursor: not-allowed !important;
  pointer-events: none !important;
}

#bagFavoriteInlineBtn,
.bag-fav-inline{
  position: absolute !important;
  top: 50% !important;
  right: 10px !important;
  transform: translateY(-50%) !important;
  width: 28px !important;
  height: 28px !important;
  border: 0 !important;
  background: transparent !important;
  color: #ff8c00 !important;
  padding: 0 !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  cursor: pointer !important;
  box-shadow: none !important;
  outline: none !important;
  z-index: 3 !important;
}

#bagFavoriteInlineBtn svg,
.bag-fav-inline svg{
  width: 18px !important;
  height: 18px !important;
  display: block !important;
}

#bagFavoriteInlineBtn.active,
.bag-fav-inline.active{
  opacity: 1 !important;
}

#bagFavoriteInlineBtn.is-disabled,
#bagFavoriteInlineBtn.wallet-ui-disabled,
#bagFavoriteInlineBtn:disabled,
.bag-fav-inline.is-disabled,
.bag-fav-inline.wallet-ui-disabled,
.bag-fav-inline:disabled{
  opacity: .45 !important;
  cursor: not-allowed !important;
  pointer-events: none !important;
  filter: grayscale(.08) !important;
}

#bagSearchClear,
.bag-search-clear{
  position: absolute !important;
  top: 50% !important;
  right: 42px !important;
  transform: translateY(-50%) !important;
  width: 24px !important;
  height: 24px !important;
  border: 0 !important;
  background: transparent !important;
  color: #8b93a1 !important;
  padding: 0 !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  cursor: pointer !important;
  font-size: 18px !important;
  line-height: 1 !important;
  box-shadow: none !important;
  outline: none !important;
  z-index: 3 !important;
}

#bagSearchClear[hidden],
.bag-search-clear[hidden],
#bagFavoriteInlineBtn[hidden],
.bag-fav-inline[hidden]{
  display: none !important;
}

#bagSearchBtn,
.bag-search-btn{
  height: 48px !important;
  min-height: 44px !important;
  width: 44px !important;
  max-width: 44px !important;
  min-width: 44px !important;
  padding: 0 !important;
  border-radius: 12px !important;
  border: 1px solid #18a957 !important;
  background: #18a957 !important;
  color: #ffffff !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 0 !important;
  box-shadow: none !important;
  outline: none !important;
  cursor: pointer !important;
  white-space: nowrap !important;
  transition: opacity .16s ease, transform .08s ease !important;
}

#bagSearchBtn svg,
.bag-search-btn svg{
  width: 18px !important;
  height: 18px !important;
  display: block !important;
  color: #ffffff !important;
  stroke: currentColor !important;
}

.bag-search-btn-text{
  display: inline-block !important;
  font-size: 13px !important;
  font-weight: 900 !important;
  line-height: 1 !important;
  color: #ffffff !important;
  letter-spacing: .02em !important;
}

#bagSearchBtn.wallet-ui-disabled,
#bagSearchBtn:disabled,
.bag-search-btn.wallet-ui-disabled,
.bag-search-btn:disabled{
  opacity: .45 !important;
  cursor: not-allowed !important;
  pointer-events: none !important;
}

#favoritesToggleBtn,
.favorites-toggle-btn{
  height: 48px !important;
  min-height: 44px !important;
  width: 44px !important;
  max-width: 44px !important;
  min-width: 44px !important;
  padding: 0 !important;
  border-radius: 12px !important;
  border: 1px solid #d8dde6 !important;
  background: #ffffff !important;
  color: #111827 !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 8px !important;
  box-shadow: none !important;
  outline: none !important;
  cursor: pointer !important;
  white-space: nowrap !important;
  transition: opacity .16s ease, transform .08s ease, border-color .16s ease, background-color .16s ease, color .16s ease !important;
}

#favoritesToggleBtn svg,
.favorites-toggle-btn svg{
  width: 18px !important;
  height: 18px !important;
  display: block !important;
  color: #ff8c00 !important;
  fill: currentColor !important;
}

.favorites-toggle-btn-text{
  display: inline-block !important;
  font-size: 12px !important;
  font-weight: 900 !important;
  line-height: 1 !important;
  letter-spacing: .01em !important;
}

#favoritesToggleBtn.is-disabled,
#favoritesToggleBtn.wallet-ui-disabled,
#favoritesToggleBtn:disabled,
.favorites-toggle-btn.is-disabled,
.favorites-toggle-btn.wallet-ui-disabled,
.favorites-toggle-btn:disabled{
  opacity: .45 !important;
  cursor: not-allowed !important;
  pointer-events: none !important;
  filter: grayscale(.08) !important;
}

#bagSearchBtn:active,
#favoritesToggleBtn:active{
  transform: scale(.98) !important;
}

#bagFavoriteNotice,
.bag-favorite-notice{
  position: absolute !important;
  right: 0 !important;
  top: -24px !important;
  min-height: 18px !important;
  font-size: 12px !important;
  font-weight: 800 !important;
  line-height: 18px !important;
  color: #18a957 !important;
  opacity: 0 !important;
  transform: translateY(4px) !important;
  transition: opacity .16s ease, transform .16s ease !important;
  pointer-events: none !important;
  white-space: nowrap !important;
}

#bagFavoriteNotice.show,
.bag-favorite-notice.show{
  opacity: 1 !important;
  transform: translateY(0) !important;
}

#bagSearchHistory,
.bag-search-history{
  position: absolute !important;
  left: 0 !important;
  right: 0 !important;
  top: calc(100% + 6px) !important;
  border: 1px solid #d8dde6 !important;
  border-radius: 12px !important;
  background: #ffffff !important;
  box-shadow: 0 12px 32px rgba(15, 23, 42, .12) !important;
  padding: 8px !important;
  box-sizing: border-box !important;
  z-index: 30 !important;
  max-height: min(42vh, 280px) !important;
  overflow: auto !important;
}

.bag-search-history-item{
  width: 100% !important;
  min-height: 40px !important;
  border: 1px solid #d8dde6 !important;
  border-radius: 10px !important;
  background: #ffffff !important;
  color: #111827 !important;
  text-align: left !important;
  padding: 10px 12px !important;
  box-sizing: border-box !important;
  font-size: 13px !important;
  font-weight: 800 !important;
  line-height: 1.2 !important;
  margin: 0 0 6px 0 !important;
}

.bag-search-history-item:last-child{
  margin-bottom: 0 !important;
}

.bag-search-history-empty{
  padding: 10px 12px !important;
  font-size: 13px !important;
  color: #6b7280 !important;
  text-align: center !important;
}

/* ===== FAVORITES MODAL ===== */

#favoritesWrap{
  display: block !important;
  visibility: hidden !important;
  pointer-events: none !important;
}

#favoritesHeaderBtn{
  display: none !important;
}

#favoritesOverlay{
  position: fixed !important;
  inset: 0 !important;
  display: block !important;
  visibility: hidden !important;
  opacity: 0 !important;
  pointer-events: none !important;
  background: rgba(15, 23, 42, .32) !important;
  transition: opacity 220ms ease !important;
  z-index: 2147483644 !important;
}

#favoritesPanel{
  position: fixed !important;
  left: 50% !important;
  top: max(6px, env(safe-area-inset-top, 0px)) !important;
  bottom: max(4px, env(safe-area-inset-bottom, 0px)) !important;
  width: var(--site-visual-width, min(500px, calc(100vw - 24px))) !important;
  max-width: var(--site-max-width, 500px) !important;
  transform: translate3d(-50%, calc(100% + 32px), 0) scale(0.985) !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 12px !important;
  visibility: hidden !important;
  opacity: 0 !important;
  pointer-events: none !important;
  background: #ffffff !important;
  border: 1px solid #d8dde6 !important;
  border-radius: 18px !important;
  box-shadow: 0 18px 48px rgba(15, 23, 42, .18) !important;
  padding: 14px !important;
  box-sizing: border-box !important;
  overflow: hidden !important;
  transition: transform 260ms cubic-bezier(0.2, 0.8, 0.2, 1), opacity 160ms linear !important;
  z-index: 2147483645 !important;
}

body.favorites-open #favoritesWrap,
body.favorites-closing #favoritesWrap{
  visibility: visible !important;
  pointer-events: auto !important;
}

body.favorites-open #favoritesOverlay,
body.favorites-closing #favoritesOverlay,
body.favorites-open #favoritesPanel,
body.favorites-closing #favoritesPanel{
  visibility: visible !important;
}

body.favorites-open #favoritesOverlay{
  opacity: 1 !important;
  pointer-events: auto !important;
}

body.favorites-open #favoritesPanel{
  opacity: 1 !important;
  pointer-events: auto !important;
  transform: translate3d(-50%, 0, 0) scale(1) !important;
}

body.favorites-closing #favoritesOverlay{
  opacity: 0 !important;
  pointer-events: none !important;
}

body.favorites-closing #favoritesPanel{
  opacity: 0 !important;
  pointer-events: none !important;
  transform: translate3d(-50%, calc(100% + 32px), 0) scale(0.985) !important;
}

.favorites-panel-header{
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 12px !important;
  flex: 0 0 auto !important;
}

.favorites-panel-title{
  font-size: 18px !important;
  line-height: 1.2 !important;
  font-weight: 900 !important;
  color: #111827 !important;
}

.favorites-close-btn{
  width: 36px !important;
  height: 36px !important;
  min-width: 36px !important;
  border-radius: 10px !important;
  border: 1px solid #d8dde6 !important;
  background: #ffffff !important;
  color: #111827 !important;
  padding: 0 !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  font-size: 24px !important;
  line-height: 1 !important;
  box-shadow: none !important;
  outline: none !important;
}

#favoritesList{
  list-style: none !important;
  margin: 0 !important;
  padding: 0 4px 0 0 !important;
  flex: 1 1 auto !important;
  min-height: 0 !important;
  overflow: auto !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 10px !important;
}

#favoritesList li{
  list-style: none !important;
  margin: 0 !important;
  padding: 0 !important;
}

.favorite-history-item{
  position: relative !important;
  width: 100% !important;
}

.favorite-history-btn{
  width: 100% !important;
  min-height: 74px !important;
  border-radius: 14px !important;
  border: 1px solid #d8dde6 !important;
  background: #ffffff !important;
  color: #111827 !important;
  padding: 12px 94px 12px 14px !important;
  box-sizing: border-box !important;
  display: flex !important;
  flex-direction: column !important;
  justify-content: center !important;
  gap: 5px !important;
  text-align: left !important;
  box-shadow: none !important;
  outline: none !important;
}

.favorite-history-item-has-alias .favorite-history-btn{
  min-height: 88px !important;
}

.favorite-bag-name{
  display: block !important;
  width: 100% !important;
  min-width: 0 !important;
  font-size: 14px !important;
  line-height: 1.24 !important;
  font-weight: 900 !important;
  color: inherit !important;
  white-space: normal !important;
  overflow-wrap: anywhere !important;
  word-break: break-word !important;
}

.favorite-bag-address{
  display: block !important;
  width: 100% !important;
  font-size: 10px !important;
  line-height: 1.2 !important;
  font-weight: 700 !important;
  color: #6b7280 !important;
  white-space: normal !important;
  overflow-wrap: anywhere !important;
  word-break: break-word !important;
}

.favorite-item-tools{
  position: absolute !important;
  top: 10px !important;
  right: 10px !important;
  display: inline-flex !important;
  align-items: center !important;
  gap: 8px !important;
}

.favorite-edit-btn,
.favorite-remove-btn,
.favorite-edit-save-btn,
.favorite-edit-cancel-btn{
  width: 32px !important;
  height: 32px !important;
  min-width: 32px !important;
  border-radius: 10px !important;
  border: 1px solid #d8dde6 !important;
  background: #ffffff !important;
  padding: 0 !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  box-shadow: none !important;
  outline: none !important;
}

.favorite-edit-btn,
.favorite-remove-btn{
  color: #ff8c00 !important;
}

.favorite-edit-save-btn{
  color: #18a957 !important;
  font-size: 18px !important;
  font-weight: 900 !important;
}

.favorite-edit-cancel-btn{
  color: #ef4444 !important;
  font-size: 18px !important;
  font-weight: 900 !important;
}

.favorite-edit-card{
  width: 100% !important;
  min-height: 88px !important;
  border-radius: 14px !important;
  border: 1px solid #d8dde6 !important;
  background: #ffffff !important;
  padding: 12px !important;
  box-sizing: border-box !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 10px !important;
}

.favorite-edit-input{
  width: 100% !important;
  min-height: 42px !important;
  border-radius: 10px !important;
  border: 1px solid #d8dde6 !important;
  background: #ffffff !important;
  color: #111827 !important;
  padding: 0 12px !important;
  box-sizing: border-box !important;
  font-size: 14px !important;
  font-weight: 800 !important;
  outline: none !important;
}

.favorite-edit-actions{
  display: flex !important;
  justify-content: flex-end !important;
  gap: 8px !important;
}

.favorite-empty{
  width: 100% !important;
}

.favorite-empty-card{
  width: 100% !important;
  border-radius: 14px !important;
  border: 1px solid #d8dde6 !important;
  background: #ffffff !important;
  color: #6b7280 !important;
  padding: 14px !important;
  box-sizing: border-box !important;
  text-align: center !important;
  font-size: 14px !important;
  font-weight: 700 !important;
}

/* ===== DARK THEME ===== */

html[data-theme="dark"] #bagSearchInput,
html[data-theme="dark"] .bag-search-input,
body.dark #bagSearchInput,
body.dark .bag-search-input,
html[data-theme="dark"] #favoritesToggleBtn,
html[data-theme="dark"] .favorites-toggle-btn,
body.dark #favoritesToggleBtn,
body.dark .favorites-toggle-btn,
html[data-theme="dark"] #favoritesPanel,
body.dark #favoritesPanel,
html[data-theme="dark"] .favorites-close-btn,
html[data-theme="dark"] .favorite-history-btn,
html[data-theme="dark"] .favorite-edit-card,
html[data-theme="dark"] .favorite-edit-input,
html[data-theme="dark"] .favorite-edit-btn,
html[data-theme="dark"] .favorite-remove-btn,
html[data-theme="dark"] .favorite-edit-save-btn,
html[data-theme="dark"] .favorite-edit-cancel-btn,
html[data-theme="dark"] .favorite-empty-card,
body.dark .favorites-close-btn,
body.dark .favorite-history-btn,
body.dark .favorite-edit-card,
body.dark .favorite-edit-input,
body.dark .favorite-edit-btn,
body.dark .favorite-remove-btn,
body.dark .favorite-edit-save-btn,
body.dark .favorite-edit-cancel-btn,
body.dark .favorite-empty-card{
  background: #2a2c31 !important;
  border-color: #3a3c42 !important;
  color: #f1f1f1 !important;
}

html[data-theme="dark"] .favorite-bag-address,
body.dark .favorite-bag-address{
  color: #bfc4cf !important;
}

html[data-theme="dark"] #bagSearchInput::placeholder,
html[data-theme="dark"] .bag-search-input::placeholder,
body.dark #bagSearchInput::placeholder,
body.dark .bag-search-input::placeholder{
  color: #9aa2ae !important;
}

html[data-theme="dark"] #bagSearchHistory,
html[data-theme="dark"] .bag-search-history,
body.dark #bagSearchHistory,
body.dark .bag-search-history{
  background: #1f2228 !important;
  border-color: #3a3c42 !important;
  box-shadow: 0 16px 34px rgba(0,0,0,.3) !important;
}

html[data-theme="dark"] .bag-search-history-item,
body.dark .bag-search-history-item{
  background: #2a2c31 !important;
  border-color: #3a3c42 !important;
  color: #f1f1f1 !important;
}

html[data-theme="dark"] #favoritesOverlay,
body.dark #favoritesOverlay{
  background: rgba(0,0,0,.58) !important;
}

/* ===== ACCESS ===== */

#favoritesToggleBtn.is-disabled,
#favoritesToggleBtn.wallet-ui-disabled,
#favoritesToggleBtn:disabled,
#bagFavoriteInlineBtn.is-disabled,
#bagFavoriteInlineBtn.wallet-ui-disabled,
#bagFavoriteInlineBtn:disabled{
  opacity: .45 !important;
  cursor: not-allowed !important;
  pointer-events: none !important;
  filter: grayscale(.08) !important;
}

/* ===== THEME SWITCH STABILITY ===== */

body.theme-animating #bagSearchWrap,
body.theme-animating #bagSearchInput,
body.theme-animating #bagSearchBtn,
body.theme-animating #favoritesToggleBtn,
body.theme-animating #bagFavoriteInlineBtn,
body.theme-animating #bagSearchClear,
body.theme-freeze #bagSearchWrap,
body.theme-freeze #bagSearchInput,
body.theme-freeze #bagSearchBtn,
body.theme-freeze #favoritesToggleBtn,
body.theme-freeze #bagFavoriteInlineBtn,
body.theme-freeze #bagSearchClear{
  opacity: 1 !important;
  visibility: visible !important;
  animation: none !important;
}

.theme-transition-clone #bagSearchWrap,
.theme-transition-clone #bagSearchInput,
.theme-transition-clone #bagSearchBtn,
.theme-transition-clone #favoritesToggleBtn,
.theme-transition-clone #bagFavoriteInlineBtn,
.theme-transition-clone #bagSearchClear{
  opacity: 0 !important;
  visibility: hidden !important;
  animation: none !important;
}

/* ===== MOBILE ===== */

@media (max-width: 768px){
  #bagSearchWrap,
  .bag-search-wrap{
    margin-top: 10px !important;
  }

  #bagSearchWrap .bag-search-row,
  .bag-search-row{
    grid-template-columns: 1fr 1fr !important;
    gap: 8px !important;
  }

  #bagSearchWrap .bag-search-field,
  .bag-search-field{
    grid-column: 1 / -1 !important;
  }

  #bagSearchInput,
  .bag-search-input{
    height: 44px !important;
    min-height: 44px !important;
    max-height: 44px !important;
    padding-right: 88px !important;
    font-size: 16px !important;
  }

  #bagSearchBtn,
  .bag-search-btn,
  #favoritesToggleBtn,
  .favorites-toggle-btn{
    width: 100% !important;
    min-width: 0 !important;
    height: 44px !important;
    min-height: 44px !important;
    padding: 0 12px !important;
    justify-content: center !important;
  }

  .bag-search-btn-text,
  .favorites-toggle-btn-text{
    font-size: 11px !important;
  }

  #favoritesPanel{
    top: max(4px, env(safe-area-inset-top, 0px)) !important;
    bottom: max(4px, env(safe-area-inset-bottom, 0px)) !important;
    width: calc(100vw - 16px) !important;
    max-width: calc(100vw - 16px) !important;
    border-radius: 16px !important;
    padding: 12px !important;
  }
}


/* FIX v44: icon-only BAG action buttons */
.bag-search-btn-text,
.favorites-toggle-btn-text{
  display: none !important;
}

#bagSearchBtn,
.bag-search-btn,
#favoritesToggleBtn,
.favorites-toggle-btn{
  justify-content: center !important;
  gap: 0 !important;
}

#bagSearchBtn svg,
.bag-search-btn svg,
#favoritesToggleBtn svg,
.favorites-toggle-btn svg{
  flex: 0 0 auto !important;
}

/* keep one horizontal row on mobile too */
@media (max-width: 768px){
  #bagSearchWrap,
  .bag-search-wrap{
    margin: 4px auto 12px auto !important;
  }

  #bagSearchWrap .bag-search-row,
  .bag-search-row{
    grid-template-columns: minmax(0, 1fr) 44px 44px !important;
    gap: 8px !important;
  }

  #bagSearchWrap .bag-search-field,
  .bag-search-field{
    grid-column: auto !important;
  }

  #bagSearchInput,
  .bag-search-input{
    height: 44px !important;
    min-height: 44px !important;
    max-height: 44px !important;
    padding-right: 88px !important;
    font-size: 16px !important;
  }

  #bagSearchBtn,
  .bag-search-btn,
  #favoritesToggleBtn,
  .favorites-toggle-btn{
    width: 44px !important;
    max-width: 44px !important;
    min-width: 44px !important;
    height: 44px !important;
    min-height: 44px !important;
    padding: 0 !important;
  }
}


/* FIX v47: final hard overrides for BAG row + favorites modal */

/* same control geometry as plus/minus buttons */
#bagSearchWrap .bag-search-row,
.bag-search-row{
  grid-template-columns: minmax(0, 1fr) var(--jukebox-wallet-control-size, 44px) var(--jukebox-wallet-control-size, 44px) !important;
  gap: var(--jukebox-wallet-gap, 6px) !important;
}

#bagSearchInput,
.bag-search-input,
#bagSearchBtn,
.bag-search-btn,
#favoritesToggleBtn,
.favorites-toggle-btn{
  height: var(--jukebox-wallet-control-size, 44px) !important;
  min-height: var(--jukebox-wallet-control-size, 44px) !important;
  max-height: var(--jukebox-wallet-control-size, 44px) !important;
  border-radius: 8px !important;
}

#bagSearchBtn,
.bag-search-btn,
#favoritesToggleBtn,
.favorites-toggle-btn{
  width: var(--jukebox-wallet-control-size, 44px) !important;
  min-width: var(--jukebox-wallet-control-size, 44px) !important;
  max-width: var(--jukebox-wallet-control-size, 44px) !important;
  padding: 0 !important;
  justify-content: center !important;
  gap: 0 !important;
}

#bagSearchBtn svg,
.bag-search-btn svg,
#favoritesToggleBtn svg,
.favorites-toggle-btn svg{
  width: 18px !important;
  height: 18px !important;
  margin: 0 !important;
}

#bagSearchInput,
.bag-search-input{
  padding-right: 94px !important;
}

/* keep icon-only buttons */
.bag-search-btn-text,
.favorites-toggle-btn-text{
  display: none !important;
}

/* modal should almost touch browser top/bottom on desktop and mobile */
#favoritesPanel{
  top: max(4px, env(safe-area-inset-top, 0px)) !important;
  bottom: auto !important;
  height: calc(100dvh - 8px - env(safe-area-inset-top, 0px) - env(safe-area-inset-bottom, 0px)) !important;
  min-height: calc(100dvh - 8px - env(safe-area-inset-top, 0px) - env(safe-area-inset-bottom, 0px)) !important;
  max-height: calc(100dvh - 8px - env(safe-area-inset-top, 0px) - env(safe-area-inset-bottom, 0px)) !important;
  border-radius: 16px !important;
}

@media (max-width: 768px){
  #bagSearchWrap,
  .bag-search-wrap{
    margin-top: var(--jukebox-wallet-stack-gap, 4px) !important;
  }

  #bagSearchWrap .bag-search-row,
  .bag-search-row{
    grid-template-columns: minmax(0, 1fr) var(--jukebox-wallet-control-size, 44px) var(--jukebox-wallet-control-size, 44px) !important;
    gap: var(--jukebox-wallet-gap, 6px) !important;
  }

  #bagSearchWrap .bag-search-field,
  .bag-search-field{
    grid-column: auto !important;
  }

  #bagSearchInput,
  .bag-search-input,
  #bagSearchBtn,
  .bag-search-btn,
  #favoritesToggleBtn,
  .favorites-toggle-btn{
    height: var(--jukebox-wallet-control-size, 44px) !important;
    min-height: var(--jukebox-wallet-control-size, 44px) !important;
    max-height: var(--jukebox-wallet-control-size, 44px) !important;
    border-radius: 8px !important;
  }

  #bagSearchBtn,
  .bag-search-btn,
  #favoritesToggleBtn,
  .favorites-toggle-btn{
    width: var(--jukebox-wallet-control-size, 44px) !important;
    min-width: var(--jukebox-wallet-control-size, 44px) !important;
    max-width: var(--jukebox-wallet-control-size, 44px) !important;
    padding: 0 !important;
  }

  #bagSearchInput,
  .bag-search-input{
    padding-right: 94px !important;
  }

  #favoritesPanel{
    top: max(4px, env(safe-area-inset-top, 0px)) !important;
    width: calc(100vw - 8px) !important;
    max-width: calc(100vw - 8px) !important;
    height: calc(100dvh - 8px - env(safe-area-inset-top, 0px) - env(safe-area-inset-bottom, 0px)) !important;
    min-height: calc(100dvh - 8px - env(safe-area-inset-top, 0px) - env(safe-area-inset-bottom, 0px)) !important;
    max-height: calc(100dvh - 8px - env(safe-area-inset-top, 0px) - env(safe-area-inset-bottom, 0px)) !important;
    border-radius: 14px !important;
  }
}


/* FIX v48: empty favorites state is a plain text line, not a button/card */
.favorite-empty{
  width: 100% !important;
  display: block !important;
}

.favorite-empty-card{
  width: 100% !important;
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  padding: 6px 0 2px 0 !important;
  color: #6b7280 !important;
  text-align: left !important;
  font-size: 14px !important;
  font-weight: 700 !important;
  line-height: 1.35 !important;
}

html[data-theme="dark"] .favorite-empty-card,
body.dark .favorite-empty-card{
  background: transparent !important;
  border: 0 !important;
  color: #bfc4cf !important;
}

/* FIX v48: favorites modal must visually win over Content List + billing */
body.favorites-open #tracksToggle,
body.favorites-closing #tracksToggle,
body.favorites-open .tracks-toggle,
body.favorites-closing .tracks-toggle{
  opacity: 0 !important;
  visibility: hidden !important;
  pointer-events: none !important;
  filter: blur(12px) !important;
  -webkit-filter: blur(12px) !important;
}

body.favorites-open #billingNoticeLine,
body.favorites-closing #billingNoticeLine,
body.favorites-open .billing-notice,
body.favorites-closing .billing-notice{
  opacity: 0 !important;
  visibility: hidden !important;
  pointer-events: none !important;
  filter: blur(12px) !important;
  -webkit-filter: blur(12px) !important;
}

/* make favorites overlay/panel definitely above everything in page UI */
#favoritesOverlay{
  z-index: 2147483646 !important;
}
#favoritesPanel{
  z-index: 2147483647 !important;
}


/* FIX v49: favorites modal must be fully opaque and visually cover all underlying UI */
#favoritesOverlay{
  background: rgba(255,255,255,1) !important;
  opacity: 1 !important;
}

html[data-theme="dark"] #favoritesOverlay,
body.dark #favoritesOverlay{
  background: rgba(0,0,0,1) !important;
  opacity: 1 !important;
}

#favoritesPanel{
  background: #ffffff !important;
  opacity: 1 !important;
  box-shadow: none !important;
}

html[data-theme="dark"] #favoritesPanel,
body.dark #favoritesPanel{
  background: #1a1a1c !important;
  opacity: 1 !important;
}

/* FIX v49: empty favorites state is just a text line, not a button/card */
.favorite-empty{
  display: block !important;
  width: 100% !important;
}

.favorite-empty-card{
  display: block !important;
  width: 100% !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  padding: 6px 0 2px 0 !important;
  margin: 0 !important;
  text-align: left !important;
  font-size: 14px !important;
  font-weight: 700 !important;
  line-height: 1.35 !important;
  color: #6b7280 !important;
}

html[data-theme="dark"] .favorite-empty-card,
body.dark .favorite-empty-card{
  background: transparent !important;
  border: 0 !important;
  color: #bfc4cf !important;
}

/* FIX v49: remove invisible gap before clear button and enlarge clear button */
#bagSearchInput,
.bag-search-input{
  padding-right: 72px !important;
}

#bagSearchClear,
.bag-search-clear{
  right: 38px !important;
  width: 30px !important;
  height: 30px !important;
  font-size: 24px !important;
  font-weight: 900 !important;
  line-height: 1 !important;
}

#bagFavoriteInlineBtn,
.bag-fav-inline{
  right: 10px !important;
}


/* FIX v50: desktop Favorite bags must be fully white/opaque like mobile */
#favoritesOverlay,
body.favorites-open #favoritesOverlay,
body.favorites-closing #favoritesOverlay{
  background: rgba(255,255,255,1) !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
  opacity: 1 !important;
}

#favoritesPanel,
body.favorites-open #favoritesPanel,
body.favorites-closing #favoritesPanel{
  background: #ffffff !important;
  opacity: 1 !important;
  box-shadow: none !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}

html[data-theme="dark"] #favoritesOverlay,
html[data-theme="dark"] body.favorites-open #favoritesOverlay,
html[data-theme="dark"] body.favorites-closing #favoritesOverlay,
body.dark #favoritesOverlay,
body.dark.favorites-open #favoritesOverlay,
body.dark.favorites-closing #favoritesOverlay{
  background: rgba(0,0,0,1) !important;
  opacity: 1 !important;
}

html[data-theme="dark"] #favoritesPanel,
html[data-theme="dark"] body.favorites-open #favoritesPanel,
html[data-theme="dark"] body.favorites-closing #favoritesPanel,
body.dark #favoritesPanel,
body.dark.favorites-open #favoritesPanel,
body.dark.favorites-closing #favoritesPanel{
  background: #1a1a1c !important;
  opacity: 1 !important;
  box-shadow: none !important;
}

/* FIX v50: empty state is plain localized text line */
.favorite-empty{
  list-style: none !important;
}
.favorite-empty-card{
  display: block !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  padding: 6px 0 2px 0 !important;
  margin: 0 !important;
  text-align: left !important;
  font-size: 14px !important;
  font-weight: 700 !important;
  line-height: 1.35 !important;
}

/* FIX v50: clear button vertically centered and larger */
#bagSearchClear,
.bag-search-clear{
  top: 50% !important;
  right: 38px !important;
  transform: translateY(-50%) !important;
  width: 32px !important;
  height: 32px !important;
  min-width: 32px !important;
  min-height: 32px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  padding: 0 !important;
  margin: 0 !important;
  font-size: 24px !important;
  font-weight: 900 !important;
  line-height: 1 !important;
}

#bagSearchInput,
.bag-search-input{
  padding-right: 72px !important;
}


/* FIX v51: desktop Favorite bags must be fully opaque white like mobile */
body.favorites-open #favoritesWrap,
body.favorites-closing #favoritesWrap{
  position: fixed !important;
  inset: 0 !important;
  z-index: 2147483646 !important;
}

body.favorites-open #favoritesWrap::before,
body.favorites-closing #favoritesWrap::before{
  content: "" !important;
  position: fixed !important;
  inset: 0 !important;
  background: #ffffff !important;
  opacity: 1 !important;
  pointer-events: none !important;
  z-index: 2147483646 !important;
}

html[data-theme="dark"] body.favorites-open #favoritesWrap::before,
html[data-theme="dark"] body.favorites-closing #favoritesWrap::before,
body.dark.favorites-open #favoritesWrap::before,
body.dark.favorites-closing #favoritesWrap::before{
  background: #000000 !important;
}

body.favorites-open #favoritesOverlay,
body.favorites-closing #favoritesOverlay{
  background: transparent !important;
  opacity: 1 !important;
  z-index: 2147483647 !important;
}

body.favorites-open #favoritesPanel,
body.favorites-closing #favoritesPanel{
  z-index: 2147483648 !important;
  background: #ffffff !important;
  opacity: 1 !important;
  box-shadow: none !important;
}

html[data-theme="dark"] body.favorites-open #favoritesPanel,
html[data-theme="dark"] body.favorites-closing #favoritesPanel,
body.dark.favorites-open #favoritesPanel,
body.dark.favorites-closing #favoritesPanel{
  background: #1a1a1c !important;
}

/* FIX v51: clear button optically centered */
#bagSearchClear,
.bag-search-clear{
  top: 50% !important;
  transform: translateY(-50%) !important;
  line-height: 0.9 !important;
  padding-bottom: 1px !important;
  font-size: 26px !important;
}



/* FIX v53: Favorite bags matches Operations history panel visuals/animation */
#favoritesOverlay,
body.favorites-open #favoritesOverlay,
body.favorites-closing #favoritesOverlay{
  background: rgba(255,255,255,1) !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
  transition: opacity .18s ease !important;
  opacity: 0 !important;
}

body.favorites-open #favoritesOverlay{
  opacity: 1 !important;
}

body.favorites-closing #favoritesOverlay{
  opacity: 0 !important;
}

#favoritesPanel{
  background: rgba(255, 255, 255, 0.96) !important;
  border: 1px solid rgba(15, 18, 25, 0.08) !important;
  border-radius: 12px !important;
  box-shadow: none !important;
  opacity: 0 !important;
  transform: translate3d(-50%, 18px, 0) scale(0.985) !important;
  transition: transform 260ms cubic-bezier(0.2, 0.8, 0.2, 1), opacity 180ms ease !important;
}

body.favorites-open #favoritesPanel{
  opacity: 1 !important;
  transform: translate3d(-50%, 0, 0) scale(1) !important;
}

body.favorites-closing #favoritesPanel{
  opacity: 0 !important;
  transform: translate3d(-50%, 18px, 0) scale(0.985) !important;
}

html[data-theme="dark"] #favoritesOverlay,
html[data-theme="dark"] body.favorites-open #favoritesOverlay,
html[data-theme="dark"] body.favorites-closing #favoritesOverlay,
body.dark #favoritesOverlay,
body.dark.favorites-open #favoritesOverlay,
body.dark.favorites-closing #favoritesOverlay{
  background: rgba(0,0,0,1) !important;
}

html[data-theme="dark"] #favoritesPanel,
html[data-theme="dark"] body.favorites-open #favoritesPanel,
html[data-theme="dark"] body.favorites-closing #favoritesPanel,
body.dark #favoritesPanel,
body.dark.favorites-open #favoritesPanel,
body.dark.favorites-closing #favoritesPanel{
  background: rgba(28, 31, 37, 0.96) !important;
  border-color: rgba(255, 255, 255, 0.08) !important;
  box-shadow: none !important;
}

.favorites-panel-title{
  color: #111827 !important;
}

html[data-theme="dark"] .favorites-panel-title,
body.dark .favorites-panel-title{
  color: #f1f1f1 !important;
}

/* FIX v53: empty state must be plain text, no phantom button/card */
.favorite-empty,
#favoritesList .favorite-empty{
  display: block !important;
  margin: 0 !important;
  padding: 0 !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
}

.favorite-empty-card,
#favoritesList .favorite-empty-card{
  display: block !important;
  width: 100% !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  outline: none !important;
  appearance: none !important;
  -webkit-appearance: none !important;
  padding: 4px 0 0 0 !important;
  margin: 0 !important;
  text-align: left !important;
  font-size: 14px !important;
  font-weight: 700 !important;
  line-height: 1.35 !important;
  color: #6b7280 !important;
  pointer-events: none !important;
}

html[data-theme="dark"] .favorite-empty-card,
body.dark .favorite-empty-card{
  color: #bfc4cf !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
}

/* FIX v53: clear button lifted slightly */
#bagSearchClear,
.bag-search-clear{
  transform: translateY(calc(-50% - 1px)) !important;
}



/* FIX v54: Favorite bags must match Operations history exactly */
#favoritesOverlay {
  position: fixed !important;
  inset: 0 !important;
  background: rgba(0, 0, 0, 0.12) !important;
  backdrop-filter: blur(10px) !important;
  -webkit-backdrop-filter: blur(10px) !important;
  opacity: 0 !important;
  pointer-events: none !important;
  transition: opacity 180ms ease !important;
  z-index: 2147483646 !important;
}

#favoritesPanel {
  position: fixed !important;
  left: 50% !important;
  top: max(10px, env(safe-area-inset-top, 0px)) !important;
  bottom: calc(8px + var(--safe-b)) !important;
  width: min(94vw, 560px) !important;
  max-width: calc(100vw - 24px) !important;
  max-height: none !important;
  height: auto !important;
  min-height: calc(100dvh - max(10px, env(safe-area-inset-top, 0px)) - (8px + var(--safe-b))) !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 10px !important;
  padding: 14px !important;
  border-radius: 18px !important;
  background: rgba(255, 255, 255, 0.96) !important;
  border: 1px solid rgba(15, 18, 25, 0.08) !important;
  box-shadow: 0 18px 50px rgba(0, 0, 0, 0.18) !important;
  transform: translate3d(-50%, calc(100% + 32px), 0) scale(0.985) !important;
  opacity: 0 !important;
  pointer-events: none !important;
  transition: transform 260ms cubic-bezier(0.2, 0.8, 0.2, 1), opacity 160ms linear, top 220ms ease, max-height 220ms ease !important;
  z-index: 2147483647 !important;
  overflow: hidden !important;
}

body.favorites-open #favoritesOverlay {
  display: block !important;
  opacity: 1 !important;
  pointer-events: auto !important;
}

body.favorites-closing #favoritesOverlay {
  display: block !important;
  opacity: 0 !important;
  pointer-events: none !important;
}

body.favorites-open #favoritesPanel {
  display: flex !important;
  opacity: 1 !important;
  pointer-events: auto !important;
  transform: translate3d(-50%, 0, 0) scale(1) !important;
}

body.favorites-closing #favoritesPanel {
  display: flex !important;
  opacity: 0 !important;
  pointer-events: none !important;
  transform: translate3d(-50%, calc(100% + 32px), 0) scale(0.985) !important;
}

html[data-theme="dark"] #favoritesPanel,
body.dark #favoritesPanel {
  background: rgba(28, 31, 37, 0.96) !important;
  border-color: rgba(255, 255, 255, 0.08) !important;
  box-shadow: 0 18px 50px rgba(0, 0, 0, 0.18) !important;
}

html[data-theme="dark"] .favorites-panel-title,
body.dark .favorites-panel-title {
  color: #f1f1f1 !important;
}

.favorites-panel-title {
  color: #111827 !important;
}

/* FIX v54: favoriteEmpty is plain text only, never clickable */
.favorite-empty,
#favoritesList .favorite-empty,
.favorite-empty-card,
#favoritesList .favorite-empty-card {
  pointer-events: none !important;
  cursor: default !important;
  user-select: none !important;
  -webkit-user-select: none !important;
}

.favorite-empty {
  list-style: none !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  padding: 0 !important;
  margin: 0 !important;
}

.favorite-empty-card {
  display: block !important;
  width: 100% !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  outline: none !important;
  padding: 4px 0 0 0 !important;
  margin: 0 !important;
  text-align: left !important;
  font-size: 14px !important;
  font-weight: 700 !important;
  line-height: 1.35 !important;
}


/* FIX v55: Favorite bags width must match Content List button 1:1 */
#favoritesPanel,
body.favorites-open #favoritesPanel,
body.favorites-closing #favoritesPanel{
  width: var(--site-visual-width, min(500px, calc(100vw - 24px))) !important;
  max-width: var(--site-max-width, 500px) !important;
  box-shadow: 0 18px 50px rgba(0, 0, 0, 0.18) !important;
}

@media (max-width: 640px){
  #favoritesPanel,
  body.favorites-open #favoritesPanel,
  body.favorites-closing #favoritesPanel{
    width: var(--site-visual-width, min(500px, calc(100vw - 24px))) !important;
    max-width: var(--site-max-width, 500px) !important;
  }
}


/* FIX v56: Favorite bags background blur/transparency should match Operations history */
#favoritesOverlay{
  background: rgba(0, 0, 0, 0.12) !important;
  backdrop-filter: blur(10px) !important;
  -webkit-backdrop-filter: blur(10px) !important;
  opacity: 0 !important;
  pointer-events: none !important;
  transition: opacity 180ms ease !important;
}

body.favorites-open #favoritesOverlay{
  display: block !important;
  opacity: 1 !important;
  pointer-events: auto !important;
}

body.favorites-closing #favoritesOverlay{
  display: block !important;
  opacity: 0 !important;
  pointer-events: none !important;
}


/* FIX v57: remove any white desktop backing; use history-like blur overlay only */
#favoritesWrap::before,
body.favorites-open #favoritesWrap::before,
body.favorites-closing #favoritesWrap::before{
  content: none !important;
  display: none !important;
  background: transparent !important;
}

#favoritesOverlay,
body.favorites-open #favoritesOverlay,
body.favorites-closing #favoritesOverlay{
  background: rgba(0, 0, 0, 0.12) !important;
  backdrop-filter: blur(10px) !important;
  -webkit-backdrop-filter: blur(10px) !important;
  opacity: 0 !important;
  pointer-events: none !important;
  transition: opacity 180ms ease !important;
}

body.favorites-open #favoritesOverlay{
  display: block !important;
  opacity: 1 !important;
  pointer-events: auto !important;
}

body.favorites-closing #favoritesOverlay{
  display: block !important;
  opacity: 0 !important;
  pointer-events: none !important;
}

/* keep panel itself normal, not transparent, but without site-covering white backdrop */
#favoritesPanel,
body.favorites-open #favoritesPanel,
body.favorites-closing #favoritesPanel{
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}

html[data-theme="dark"] #favoritesOverlay,
html[data-theme="dark"] body.favorites-open #favoritesOverlay,
html[data-theme="dark"] body.favorites-closing #favoritesOverlay,
body.dark #favoritesOverlay,
body.dark.favorites-open #favoritesOverlay,
body.dark.favorites-closing #favoritesOverlay{
  background: rgba(0, 0, 0, 0.12) !important;
}


/* FIX v132.2: copy button under edit in Favorite bags, styled like history copy */
.favorite-item-tools{
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  gap: 8px !important;
}

.favorite-copy-btn{
  width: 32px !important;
  height: 32px !important;
  min-width: 32px !important;
  border: 1px solid #d9dce3 !important;
  border-radius: 10px !important;
  background: #ffffff !important;
  color: #0d1118 !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  cursor: pointer !important;
  outline: none !important;
  box-shadow: none !important;
  -webkit-tap-highlight-color: transparent !important;
  transition: background-color 0.12s ease, border-color 0.12s ease, color 0.12s ease, transform 0.08s ease !important;
}

.favorite-copy-btn svg{
  width: 16px !important;
  height: 16px !important;
  display: block !important;
}

.favorite-copy-btn:focus,
.favorite-copy-btn:focus-visible{
  outline: none !important;
  box-shadow: none !important;
}

.favorite-copy-btn:active,
.favorite-copy-btn.is-copied{
  background: #ff8c00 !important;
  border-color: #ff8c00 !important;
  color: #ffffff !important;
  transform: scale(0.97) !important;
}

html[data-theme="dark"] .favorite-copy-btn,
body.dark .favorite-copy-btn{
  background: #2a2c31 !important;
  border-color: #3a3c42 !important;
  color: #f1f1f1 !important;
}

html[data-theme="dark"] .favorite-copy-btn:active,
html[data-theme="dark"] .favorite-copy-btn.is-copied,
body.dark .favorite-copy-btn:active,
body.dark .favorite-copy-btn.is-copied{
  background: #ff8c00 !important;
  border-color: #ff8c00 !important;
  color: #ffffff !important;
}


/* FIX v132.3: Favorite bags action buttons layout
   top-left = edit
   top-right = delete
   below edit = copy
*/
.favorite-item-tools{
  position: absolute !important;
  top: 10px !important;
  right: 10px !important;
  display: grid !important;
  grid-template-columns: 32px 32px !important;
  grid-template-rows: 32px 32px !important;
  column-gap: 8px !important;
  row-gap: 8px !important;
  align-items: start !important;
  justify-items: start !important;
}

.favorite-edit-btn{
  grid-column: 1 !important;
  grid-row: 1 !important;
}

.favorite-remove-btn{
  grid-column: 2 !important;
  grid-row: 1 !important;
}

.favorite-copy-btn{
  grid-column: 1 !important;
  grid-row: 2 !important;
}


/* FIX v132.4: Favorite bags items always use full two-line height so action buttons fit comfortably */
.favorite-history-btn,
.favorite-history-item .favorite-history-btn,
.favorite-history-item-has-alias .favorite-history-btn{
  min-height: 88px !important;
  height: 88px !important;
  padding-top: 12px !important;
  padding-bottom: 12px !important;
  justify-content: center !important;
}

.favorite-history-item{
  min-height: 88px !important;
}

.favorite-item-tools{
  grid-template-rows: 32px 32px !important;
  min-height: 72px !important;
}

.favorite-bag-name{
  min-height: 18px !important;
}

.favorite-bag-address{
  min-height: 12px !important;
}


/* FIX v132.5: lift Favorite bags action buttons slightly for equal top/bottom spacing */
.favorite-item-tools{
  top: 8px !important;
}


/* FIX v132.6: remove phantom outer rounded card in Favorite bags */
#favoritesList,
.favorites-history-list{
  padding: 0 !important;
  margin: 0 !important;
}

#favoritesList li,
.favorites-history-list li,
.favorite-history-item{
  list-style: none !important;
  margin: 0 !important;
  padding: 0 !important;
  background: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  outline: none !important;
  overflow: visible !important;
}

.favorite-history-item::before,
.favorite-history-item::after,
#favoritesList li::before,
#favoritesList li::after{
  content: none !important;
  display: none !important;
}

.favorite-history-btn{
  position: relative !important;
  z-index: 1 !important;
  margin: 0 !important;
  box-shadow: none !important;
}

.favorite-edit-card{
  margin: 0 !important;
  box-shadow: none !important;
}


/* FIX v132.7: keep only inner real card, restore active orange highlight there, keep tools visible */
#favoritesList li,
.favorites-history-list li,
.favorite-history-item{
  background: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  padding: 0 !important;
  margin: 0 !important;
}

.favorite-history-btn{
  position: relative !important;
  z-index: 1 !important;
  cursor: pointer !important;
  transition: background-color 0.2s ease, border-color 0.2s ease, color 0.2s ease, transform 0.08s ease !important;
}

.favorite-history-btn:active,
.favorite-history-btn.press-armed,
.favorite-history-btn.favorite-picked{
  background-color: #ff8c00 !important;
  border-color: #ff8c00 !important;
  color: #ffffff !important;
  transform: scale(0.99) !important;
}

.favorite-history-btn:active .favorite-bag-address,
.favorite-history-btn.press-armed .favorite-bag-address,
.favorite-history-btn.favorite-picked .favorite-bag-address{
  color: #ffffff !important;
}

.favorite-item-tools{
  z-index: 3 !important;
}

.favorite-edit-btn,
.favorite-remove-btn,
.favorite-copy-btn{
  position: relative !important;
  z-index: 4 !important;
  opacity: 1 !important;
  visibility: visible !important;
}


/* FIX v132.8: Favorite bags search controls mirror Operations history */
.favorites-panel-actions{
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
}

.favorites-search-wrap{
  display: block !important;
  overflow: visible !important;
  max-height: 0 !important;
  opacity: 0 !important;
  transform: translateY(-4px) !important;
  pointer-events: none !important;
  margin-top: 0 !important;
  padding: 2px 8px 0 0 !important;
  transition: max-height 220ms ease, opacity 180ms ease, transform 220ms ease, margin-top 220ms ease, padding-top 220ms ease !important;
}

.favorites-search-wrap.open{
  max-height: 72px !important;
  opacity: 1 !important;
  transform: translateY(0) !important;
  pointer-events: auto !important;
  margin-top: 8px !important;
  padding-top: 6px !important;
}

.favorites-search-field{
  position: relative !important;
}

.favorites-search-input{
  width: 100% !important;
  min-width: 0 !important;
  height: 42px !important;
  box-sizing: border-box !important;
  border: 1px solid #d9dce3 !important;
  border-radius: 12px !important;
  background: #ffffff !important;
  color: #0d1118 !important;
  padding: 0 42px 0 14px !important;
  font-size: 14px !important;
}

.favorites-search-input:focus{
  outline: none !important;
  border-color: #3b82f6 !important;
}

.favorites-search-clear-btn{
  position: absolute !important;
  right: 7px !important;
  top: 50% !important;
  transform: translateY(-50%) !important;
  width: 28px !important;
  height: 28px !important;
  border: 0 !important;
  border-radius: 8px !important;
  background: transparent !important;
  color: #6b7280 !important;
  font-size: 20px !important;
  line-height: 1 !important;
  display: none !important;
  align-items: center !important;
  justify-content: center !important;
}

.favorites-search-wrap.has-value .favorites-search-clear-btn{
  display: inline-flex !important;
}

.favorites-search-toggle-btn{
  font-size: 18px !important;
}

.favorites-close-btn:focus,
.favorites-close-btn:focus-visible,
.favorites-search-toggle-btn:focus,
.favorites-search-toggle-btn:focus-visible{
  outline: none !important;
  box-shadow: none !important;
}

.favorites-close-btn:active,
.favorites-search-toggle-btn:active,
.favorites-search-toggle-btn.is-active{
  background: #ff8c00 !important;
  border-color: #ff8c00 !important;
  color: #ffffff !important;
  transform: scale(0.97) !important;
}

html[data-theme="dark"] .favorites-search-input,
body.dark .favorites-search-input{
  background: #2a2c31 !important;
  border-color: #3a3c42 !important;
  color: #f1f1f1 !important;
}

html[data-theme="dark"] .favorites-search-clear-btn,
body.dark .favorites-search-clear-btn{
  color: #bfc4cf !important;
}


/* FIX v132.10: no browser blue focus/tap background on favorite cards when pressing copy */
.favorite-history-btn,
.favorite-history-btn:focus,
.favorite-history-btn:focus-visible,
.favorite-history-btn:active,
.favorite-history-item,
.favorite-history-item:focus,
.favorite-history-item:focus-visible{
  outline: none !important;
  box-shadow: none !important;
  -webkit-tap-highlight-color: transparent !important;
}

.favorite-history-btn::-moz-focus-inner,
.favorite-copy-btn::-moz-focus-inner{
  border: 0 !important;
}

.favorite-copy-btn,
.favorite-copy-btn:focus,
.favorite-copy-btn:focus-visible,
.favorite-copy-btn:active{
  outline: none !important;
  box-shadow: none !important;
  -webkit-tap-highlight-color: transparent !important;
}

.favorite-item-tools{
  z-index: 5 !important;
}

.favorite-copy-btn{
  touch-action: manipulation !important;
  user-select: none !important;
  -webkit-user-select: none !important;
}

.favorite-copy-btn.is-copied{
  background: #ff8c00 !important;
  border-color: #ff8c00 !important;
  color: #ffffff !important;
  transform: scale(0.97) !important;
}


/* FIX v132.11: edit/remove should blink orange like copy */
.favorite-edit-btn:active,
.favorite-edit-btn.is-flashed,
.favorite-remove-btn:active,
.favorite-remove-btn.is-flashed{
  background: #ff8c00 !important;
  border-color: #ff8c00 !important;
  color: #ffffff !important;
  transform: scale(0.97) !important;
}

html[data-theme="dark"] .favorite-edit-btn:active,
html[data-theme="dark"] .favorite-edit-btn.is-flashed,
html[data-theme="dark"] .favorite-remove-btn:active,
html[data-theme="dark"] .favorite-remove-btn.is-flashed,
body.dark .favorite-edit-btn:active,
body.dark .favorite-edit-btn.is-flashed,
body.dark .favorite-remove-btn:active,
body.dark .favorite-remove-btn.is-flashed{
  background: #ff8c00 !important;
  border-color: #ff8c00 !important;
  color: #ffffff !important;
}


/* FIX v132.13: unify Favorite bags radii to site canon (same as TON button) */
#favoritesPanel,
#favoritesOverlay,
.favorites-close-btn,
.favorites-search-toggle-btn,
.favorites-search-input,
.favorites-search-clear-btn,
.favorite-history-btn,
.favorite-copy-btn,
.favorite-edit-btn,
.favorite-remove-btn,
.favorite-edit-card,
.favorite-edit-input,
.favorite-edit-save-btn,
.favorite-edit-cancel-btn,
.favorite-empty-card{
  border-radius: 8px !important;
}


/* FIX v134.2: dark theme orange blink for Favorite bags buttons */
html[data-theme="dark"] .favorite-history-btn:active,
html[data-theme="dark"] .favorite-history-btn.press-armed,
html[data-theme="dark"] .favorite-history-btn.favorite-picked,
body.dark .favorite-history-btn:active,
body.dark .favorite-history-btn.press-armed,
body.dark .favorite-history-btn.favorite-picked{
  background-color: #ff8c00 !important;
  border-color: #ff8c00 !important;
  color: #ffffff !important;
  transform: scale(0.99) !important;
}

html[data-theme="dark"] .favorite-history-btn:active .favorite-bag-address,
html[data-theme="dark"] .favorite-history-btn.press-armed .favorite-bag-address,
html[data-theme="dark"] .favorite-history-btn.favorite-picked .favorite-bag-address,
body.dark .favorite-history-btn:active .favorite-bag-address,
body.dark .favorite-history-btn.press-armed .favorite-bag-address,
body.dark .favorite-history-btn.favorite-picked .favorite-bag-address{
  color: #ffffff !important;
}

html[data-theme="dark"] .favorite-copy-btn:active,
html[data-theme="dark"] .favorite-copy-btn.is-copied,
html[data-theme="dark"] .favorite-edit-btn:active,
html[data-theme="dark"] .favorite-edit-btn.is-flashed,
html[data-theme="dark"] .favorite-remove-btn:active,
html[data-theme="dark"] .favorite-remove-btn.is-flashed,
body.dark .favorite-copy-btn:active,
body.dark .favorite-copy-btn.is-copied,
body.dark .favorite-edit-btn:active,
body.dark .favorite-edit-btn.is-flashed,
body.dark .favorite-remove-btn:active,
body.dark .favorite-remove-btn.is-flashed{
  background: #ff8c00 !important;
  border-color: #ff8c00 !important;
  color: #ffffff !important;
  transform: scale(0.97) !important;
}


/* FIX v134.11: BAG search field text smaller, mobile clear X optically centered */
#bagSearchInput,
.bag-search-input{
  font-size: 10px !important;
  line-height: 1.1 !important;
  padding-left: 12px !important;
  padding-right: 84px !important;
}

#bagSearchInput::placeholder,
.bag-search-input::placeholder{
  font-size: 10px !important;
  font-weight: 700 !important;
}

@media (max-width: 768px), (pointer: coarse){
  #bagSearchClear,
  .bag-search-clear{
    top: 50% !important;
    transform: translateY(calc(-50% + 1px)) !important;
    width: 24px !important;
    height: 24px !important;
    font-size: 19px !important;
    line-height: 24px !important;
    padding: 0 !important;
    margin: 0 !important;
  }
}


/* FIX v134.13: BAG search field should not get orange focus border on desktop or mobile */
#bagSearchInput:focus,
.bag-search-input:focus,
#bagSearchInput:focus-visible,
.bag-search-input:focus-visible,
#bagSearchInput:active,
.bag-search-input:active{
  border-color: #d8dde6 !important;
  outline: none !important;
  box-shadow: none !important;
}

html[data-theme="dark"] #bagSearchInput:focus,
html[data-theme="dark"] .bag-search-input:focus,
html[data-theme="dark"] #bagSearchInput:focus-visible,
html[data-theme="dark"] .bag-search-input:focus-visible,
html[data-theme="dark"] #bagSearchInput:active,
html[data-theme="dark"] .bag-search-input:active,
body.dark #bagSearchInput:focus,
body.dark .bag-search-input:focus,
body.dark #bagSearchInput:focus-visible,
body.dark .bag-search-input:focus-visible,
body.dark #bagSearchInput:active,
body.dark .bag-search-input:active{
  border-color: #3a3c42 !important;
  outline: none !important;
  box-shadow: none !important;
}


/* FIX v134.14: larger BAG search text/hint and larger centered clear X */
#bagSearchInput,
.bag-search-input{
  font-size: 15px !important;
  line-height: 1.1 !important;
  padding-left: 12px !important;
  padding-right: 88px !important;
}

#bagSearchInput::placeholder,
.bag-search-input::placeholder{
  font-size: 15px !important;
  font-weight: 700 !important;
  line-height: 1.1 !important;
}

#bagSearchClear,
.bag-search-clear{
  top: 50% !important;
  right: 40px !important;
  transform: translateY(-50%) !important;
  width: 28px !important;
  height: 28px !important;
  min-width: 28px !important;
  min-height: 28px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  padding: 0 !important;
  margin: 0 !important;
  font-size: 22px !important;
  line-height: 1 !important;
}

@media (max-width: 768px), (pointer: coarse){
  #bagSearchInput,
  .bag-search-input{
    font-size: 15px !important;
  }

  #bagSearchInput::placeholder,
  .bag-search-input::placeholder{
    font-size: 15px !important;
  }

  #bagSearchClear,
  .bag-search-clear{
    top: 50% !important;
    right: 40px !important;
    transform: translateY(-50%) !important;
    width: 28px !important;
    height: 28px !important;
    min-width: 28px !important;
    min-height: 28px !important;
    font-size: 22px !important;
    line-height: 1 !important;
    padding: 0 !important;
    margin: 0 !important;
  }
}


/* FIX v134.16: BAG search text/hint reduced by 0.5x from current size; clear X centered on desktop + mobile */
#bagSearchInput,
.bag-search-input{
  font-size: 7.5px !important;
  line-height: 1 !important;
}

#bagSearchInput::placeholder,
.bag-search-input::placeholder{
  font-size: 7.5px !important;
  line-height: 1 !important;
}

#bagSearchClear,
.bag-search-clear{
  top: 50% !important;
  right: 40px !important;
  transform: translateY(-50%) !important;
  width: 28px !important;
  height: 28px !important;
  min-width: 28px !important;
  min-height: 28px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  padding: 0 !important;
  margin: 0 !important;
  font-size: 22px !important;
  line-height: 28px !important;
}

@media (max-width: 768px), (pointer: coarse){
  #bagSearchInput,
  .bag-search-input{
    font-size: 7.5px !important;
    line-height: 1 !important;
  }

  #bagSearchInput::placeholder,
  .bag-search-input::placeholder{
    font-size: 7.5px !important;
    line-height: 1 !important;
  }

  #bagSearchClear,
  .bag-search-clear{
    top: 50% !important;
    right: 40px !important;
    transform: translateY(-50%) !important;
    width: 28px !important;
    height: 28px !important;
    min-width: 28px !important;
    min-height: 28px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    padding: 0 !important;
    margin: 0 !important;
    font-size: 22px !important;
    line-height: 28px !important;
  }
}


/* FIX v134.17: desktop BAG search clear X lifted slightly to align with favorite star */
@media (min-width: 769px) and (pointer: fine){
  #bagSearchClear,
  .bag-search-clear{
    top: 50% !important;
    transform: translateY(calc(-50% - 1px)) !important;
  }
}


/* FIX v134.18: slightly larger BAG search text and HINT */
#bagSearchInput,
.bag-search-input{
  font-size: 9px !important;
  line-height: 1.05 !important;
}

#bagSearchInput::placeholder,
.bag-search-input::placeholder{
  font-size: 9px !important;
  line-height: 1.05 !important;
}

@media (max-width: 768px), (pointer: coarse){
  #bagSearchInput,
  .bag-search-input{
    font-size: 9px !important;
    line-height: 1.05 !important;
  }

  #bagSearchInput::placeholder,
  .bag-search-input::placeholder{
    font-size: 9px !important;
    line-height: 1.05 !important;
  }
}


/* FIX v134.19: Favorite bags loader + slightly larger BAG search text/HINT */
.favorites-loader{
  display: none !important;
  align-items: center !important;
  justify-content: center !important;
  min-height: 24px !important;
  margin: -2px 0 6px 0 !important;
  flex: 0 0 auto !important;
}

.favorites-loader.is-visible{
  display: flex !important;
}

.favorites-loader-spinner{
  width: 22px !important;
  height: 22px !important;
  border-radius: 999px !important;
  border: 3px solid rgba(255, 170, 0, 0.22) !important;
  border-top-color: #ffb300 !important;
  border-right-color: #ffb300 !important;
  box-sizing: border-box !important;
  animation: favoritesLoaderSpin 0.8s linear infinite !important;
  filter: drop-shadow(0 0 2px rgba(255, 179, 0, 0.28)) !important;
}

@keyframes favoritesLoaderSpin{
  from{ transform: rotate(0deg); }
  to{ transform: rotate(360deg); }
}

html[data-theme="dark"] .favorites-loader-spinner,
body.dark .favorites-loader-spinner{
  border-color: rgba(255, 184, 0, 0.18) !important;
  border-top-color: #ffb300 !important;
  border-right-color: #ffb300 !important;
}

#bagSearchInput,
.bag-search-input{
  font-size: 10px !important;
  line-height: 1.05 !important;
}

#bagSearchInput::placeholder,
.bag-search-input::placeholder{
  font-size: 10px !important;
  line-height: 1.05 !important;
}

@media (max-width: 768px), (pointer: coarse){
  #bagSearchInput,
  .bag-search-input{
    font-size: 10px !important;
    line-height: 1.05 !important;
  }

  #bagSearchInput::placeholder,
  .bag-search-input::placeholder{
    font-size: 10px !important;
    line-height: 1.05 !important;
  }
}


/* FIX v134.20: slightly larger BAG search text + HINT */
#bagSearchInput,
.bag-search-input{
  font-size: 11px !important;
  line-height: 1.08 !important;
}

#bagSearchInput::placeholder,
.bag-search-input::placeholder{
  font-size: 11px !important;
  line-height: 1.08 !important;
}

@media (max-width: 768px), (pointer: coarse){
  #bagSearchInput,
  .bag-search-input{
    font-size: 11px !important;
    line-height: 1.08 !important;
  }

  #bagSearchInput::placeholder,
  .bag-search-input::placeholder{
    font-size: 11px !important;
    line-height: 1.08 !important;
  }
}


/* FIX v134.20.1: slightly larger BAG search text and HINT */
#bagSearchInput,
.bag-search-input{
  font-size: 12px !important;
  line-height: 1.08 !important;
}

#bagSearchInput::placeholder,
.bag-search-input::placeholder{
  font-size: 12px !important;
  line-height: 1.08 !important;
}

@media (max-width: 768px), (pointer: coarse){
  #bagSearchInput,
  .bag-search-input{
    font-size: 12px !important;
    line-height: 1.08 !important;
  }

  #bagSearchInput::placeholder,
  .bag-search-input::placeholder{
    font-size: 12px !important;
    line-height: 1.08 !important;
  }
}


/* FIX v134.21.2: mobile BAG row keeps the same vertical gap rhythm as the rest of the main screen */
@media (max-width: 768px){
  #bagSearchWrap,
  .bag-search-wrap{
    margin: 0 auto 10px auto !important;
  }
}


/* FIX v134.21.3: mobile BAG search gap must match the same main-page rhythm step */
@media (max-width: 768px){
  #bagSearchWrap,
  .bag-search-wrap{
    margin: 0 auto 10px auto !important;
  }
}


/* FIX v134.21.4: BAG search block follows the same mobile gap rhythm */
@media (max-width: 768px){
  #bagSearchWrap,
  .bag-search-wrap{
    margin: 0 auto 10px auto !important;
  }
}


/* FIX v134.21.5: mobile BAG row keeps the same vertical rhythm step */
@media (max-width: 768px){
  #bagSearchWrap,
  .bag-search-wrap{
    margin: 0 auto 10px auto !important;
  }
}


/* FIX v134.22.5: when wallet is disconnected, hide BAG search clear X and favorite star */
body:not(.wallet-connected) #bagSearchClear,
body:not(.wallet-connected) #bagFavoriteInlineBtn{
  display: none !important;
}

/* FIX v134.22: mobile BAG search spacing must follow the same desktop block rhythm */
@media (max-width: 768px){
  :root{
    --jukebox-mobile-player-gap: 12px;
  }

  #bagSearchWrap,
  .bag-search-wrap{
    margin-top: 4px !important;
    margin-bottom: var(--jukebox-mobile-player-gap) !important;
  }
}


/* FIX v2.1.5: BAG search field and Favorites button must not blink on theme switch */
body.theme-switch-noanim #bagSearchInput,
body.theme-switch-noanim #bagSearchInput::before,
body.theme-switch-noanim #bagSearchInput::after,
body.theme-switch-noanim #bagSearchInput::placeholder,
body.theme-freeze #bagSearchInput,
body.theme-freeze #bagSearchInput::before,
body.theme-freeze #bagSearchInput::after,
body.theme-freeze #bagSearchInput::placeholder,
body.theme-animating #bagSearchInput,
body.theme-animating #bagSearchInput::before,
body.theme-animating #bagSearchInput::after,
body.theme-animating #bagSearchInput::placeholder,
body.theme-switch-noanim #favoritesToggleBtn,
body.theme-switch-noanim #favoritesToggleBtn *,
body.theme-switch-noanim #favoritesToggleBtn::before,
body.theme-switch-noanim #favoritesToggleBtn::after,
body.theme-freeze #favoritesToggleBtn,
body.theme-freeze #favoritesToggleBtn *,
body.theme-freeze #favoritesToggleBtn::before,
body.theme-freeze #favoritesToggleBtn::after,
body.theme-animating #favoritesToggleBtn,
body.theme-animating #favoritesToggleBtn *,
body.theme-animating #favoritesToggleBtn::before,
body.theme-animating #favoritesToggleBtn::after{
  transition: none !important;
  transition-property: none !important;
  transition-duration: 0s !important;
  transition-delay: 0s !important;
  animation: none !important;
}

body.theme-switch-noanim #bagSearchInput.bag-theme-frozen,
body.theme-freeze #bagSearchInput.bag-theme-frozen,
body.theme-animating #bagSearchInput.bag-theme-frozen,
body.theme-switch-noanim #favoritesToggleBtn.bag-theme-frozen,
body.theme-freeze #favoritesToggleBtn.bag-theme-frozen,
body.theme-animating #favoritesToggleBtn.bag-theme-frozen{
  background: var(--bag-freeze-bg, transparent) !important;
  background-color: var(--bag-freeze-bg, transparent) !important;
  border-color: var(--bag-freeze-border, transparent) !important;
  color: var(--bag-freeze-color, inherit) !important;
  box-shadow: var(--bag-freeze-shadow, none) !important;
  filter: var(--bag-freeze-filter, none) !important;
  opacity: var(--bag-freeze-opacity, 1) !important;
  -webkit-text-fill-color: var(--bag-freeze-color, currentColor) !important;
}

body.theme-switch-noanim #bagSearchInput.bag-theme-frozen::placeholder,
body.theme-freeze #bagSearchInput.bag-theme-frozen::placeholder,
body.theme-animating #bagSearchInput.bag-theme-frozen::placeholder{
  color: var(--bag-freeze-placeholder, var(--bag-freeze-color, inherit)) !important;
  opacity: 1 !important;
}

body.theme-switch-noanim #favoritesToggleBtn .bag-theme-frozen,
body.theme-freeze #favoritesToggleBtn .bag-theme-frozen,
body.theme-animating #favoritesToggleBtn .bag-theme-frozen,
body.theme-switch-noanim #favoritesToggleBtn svg,
body.theme-switch-noanim #favoritesToggleBtn path,
body.theme-freeze #favoritesToggleBtn svg,
body.theme-freeze #favoritesToggleBtn path,
body.theme-animating #favoritesToggleBtn svg,
body.theme-animating #favoritesToggleBtn path{
  color: var(--bag-freeze-color, currentColor) !important;
  fill: var(--bag-freeze-color, currentColor) !important;
  stroke: var(--bag-freeze-color, currentColor) !important;
  opacity: var(--bag-freeze-opacity, 1) !important;
  filter: var(--bag-freeze-filter, none) !important;
  -webkit-text-fill-color: var(--bag-freeze-color, currentColor) !important;
}


/* v136.15 remove mobile blue focus square on favorites */
#favoritesToggleBtn,
.favorites-toggle-btn,
#favoritesToggleBtn *,
.favorites-toggle-btn *{
  -webkit-tap-highlight-color: transparent !important;
  tap-highlight-color: transparent !important;
}

#favoritesToggleBtn:focus,
#favoritesToggleBtn:focus-visible,
.favorites-toggle-btn:focus,
.favorites-toggle-btn:focus-visible{
  outline: none !important;
  box-shadow: none !important;
  -webkit-box-shadow: none !important;
}


/* v136.17 action flash + tap highlight fix */
#bagSearchBtn,
#bagSearchBtn *,
#favoritesToggleBtn,
#favoritesToggleBtn *{
  -webkit-tap-highlight-color: transparent !important;
  tap-highlight-color: transparent !important;
  outline: none !important;
}

#bagSearchBtn:focus,
#bagSearchBtn:focus-visible,
#favoritesToggleBtn:focus,
#favoritesToggleBtn:focus-visible{
  outline: none !important;
  box-shadow: none !important;
}

#bagSearchBtn.is-tapped,
#bagSearchBtn:active,
#favoritesToggleBtn.is-tapped,
#favoritesToggleBtn:active{
  background:#ff8c00 !important;
  background-color:#ff8c00 !important;
  border-color:#ff8c00 !important;
  color:#ffffff !important;
  transform:scale(.98) !important;
}

#bagSearchBtn.is-tapped svg,
#bagSearchBtn:active svg,
#favoritesToggleBtn.is-tapped svg,
#favoritesToggleBtn:active svg{
  color:#ffffff !important;
  fill:currentColor !important;
  stroke:currentColor !important;
}


/* v136.18: proper orange flash for favorites/search and modal header buttons */
html[data-theme="dark"] #favoritesToggleBtn.is-tapped,
html[data-theme="dark"] #favoritesToggleBtn:active,
body.dark #favoritesToggleBtn.is-tapped,
body.dark #favoritesToggleBtn:active,
#favoritesToggleBtn.is-tapped,
#favoritesToggleBtn:active{
  background:#ff8c00 !important;
  background-color:#ff8c00 !important;
  border-color:#ff8c00 !important;
  color:#ffffff !important;
  -webkit-text-fill-color:#ffffff !important;
  transform:scale(.98) !important;
}

html[data-theme="dark"] #favoritesToggleBtn.is-tapped svg,
html[data-theme="dark"] #favoritesToggleBtn:active svg,
body.dark #favoritesToggleBtn.is-tapped svg,
body.dark #favoritesToggleBtn:active svg,
#favoritesToggleBtn.is-tapped svg,
#favoritesToggleBtn:active svg,
html[data-theme="dark"] #favoritesToggleBtn.is-tapped svg *,
html[data-theme="dark"] #favoritesToggleBtn:active svg *,
body.dark #favoritesToggleBtn.is-tapped svg *,
body.dark #favoritesToggleBtn:active svg *,
#favoritesToggleBtn.is-tapped svg *,
#favoritesToggleBtn:active svg *{
  color:#ffffff !important;
  fill:#ffffff !important;
  stroke:#ffffff !important;
}

#bagSearchBtn.is-tapped,
#bagSearchBtn:active,
html[data-theme="dark"] #bagSearchBtn.is-tapped,
html[data-theme="dark"] #bagSearchBtn:active,
body.dark #bagSearchBtn.is-tapped,
body.dark #bagSearchBtn:active{
  background:#ff8c00 !important;
  background-color:#ff8c00 !important;
  border-color:#ff8c00 !important;
  color:#ffffff !important;
  -webkit-text-fill-color:#ffffff !important;
  transform:scale(.98) !important;
}

#bagSearchBtn.is-tapped svg,
#bagSearchBtn:active svg,
html[data-theme="dark"] #bagSearchBtn.is-tapped svg,
html[data-theme="dark"] #bagSearchBtn:active svg,
body.dark #bagSearchBtn.is-tapped svg,
body.dark #bagSearchBtn:active svg{
  color:#ffffff !important;
  stroke:#ffffff !important;
  fill:none !important;
}

#bagSearchBtn.is-tapped svg *,
#bagSearchBtn:active svg *,
html[data-theme="dark"] #bagSearchBtn.is-tapped svg *,
html[data-theme="dark"] #bagSearchBtn:active svg *,
body.dark #bagSearchBtn.is-tapped svg *,
body.dark #bagSearchBtn:active svg *{
  stroke:#ffffff !important;
  fill:none !important;
}

.favorites-close-btn.is-tapped,
.favorites-search-toggle-btn.is-tapped,
.favorites-close-btn:active,
.favorites-search-toggle-btn:active,
.favorites-search-toggle-btn.is-active,
html[data-theme="dark"] .favorites-close-btn.is-tapped,
html[data-theme="dark"] .favorites-search-toggle-btn.is-tapped,
html[data-theme="dark"] .favorites-close-btn:active,
html[data-theme="dark"] .favorites-search-toggle-btn:active,
html[data-theme="dark"] .favorites-search-toggle-btn.is-active,
body.dark .favorites-close-btn.is-tapped,
body.dark .favorites-search-toggle-btn.is-tapped,
body.dark .favorites-close-btn:active,
body.dark .favorites-search-toggle-btn:active,
body.dark .favorites-search-toggle-btn.is-active{
  background:#ff8c00 !important;
  background-color:#ff8c00 !important;
  border-color:#ff8c00 !important;
  color:#ffffff !important;
  -webkit-text-fill-color:#ffffff !important;
  transform:scale(.97) !important;
}

/* v136.19: hard final flash overrides for favorites/search controls */
#favoritesToggleBtn.is-tapped,
#favoritesToggleBtn:active,
html[data-theme="dark"] #favoritesToggleBtn.is-tapped,
html[data-theme="dark"] #favoritesToggleBtn:active,
body.dark #favoritesToggleBtn.is-tapped,
body.dark #favoritesToggleBtn:active{
  background:#ff8c00 !important;
  background-color:#ff8c00 !important;
  border-color:#ff8c00 !important;
  box-shadow: inset 0 0 0 999px #ff8c00 !important;
  color:#ffffff !important;
  -webkit-text-fill-color:#ffffff !important;
}

#favoritesToggleBtn.is-tapped svg,
#favoritesToggleBtn:active svg,
html[data-theme="dark"] #favoritesToggleBtn.is-tapped svg,
html[data-theme="dark"] #favoritesToggleBtn:active svg,
body.dark #favoritesToggleBtn.is-tapped svg,
body.dark #favoritesToggleBtn:active svg,
#favoritesToggleBtn.is-tapped svg *,
#favoritesToggleBtn:active svg *,
html[data-theme="dark"] #favoritesToggleBtn.is-tapped svg *,
html[data-theme="dark"] #favoritesToggleBtn:active svg *,
body.dark #favoritesToggleBtn.is-tapped svg *,
body.dark #favoritesToggleBtn:active svg *{
  color:#ffffff !important;
  fill:#ffffff !important;
  stroke:#ffffff !important;
  background:transparent !important;
}

.favorites-close-btn.is-tapped,
.favorites-close-btn:active,
.favorites-search-toggle-btn.is-tapped,
.favorites-search-toggle-btn:active,
html[data-theme="dark"] .favorites-close-btn.is-tapped,
html[data-theme="dark"] .favorites-close-btn:active,
html[data-theme="dark"] .favorites-search-toggle-btn.is-tapped,
html[data-theme="dark"] .favorites-search-toggle-btn:active,
body.dark .favorites-close-btn.is-tapped,
body.dark .favorites-close-btn:active,
body.dark .favorites-search-toggle-btn.is-tapped,
body.dark .favorites-search-toggle-btn:active{
  background:#ff8c00 !important;
  background-color:#ff8c00 !important;
  border-color:#ff8c00 !important;
  box-shadow: inset 0 0 0 999px #ff8c00 !important;
  color:#ffffff !important;
  -webkit-text-fill-color:#ffffff !important;
}

#bagSearchBtn.is-tapped,
#bagSearchBtn:active,
html[data-theme="dark"] #bagSearchBtn.is-tapped,
html[data-theme="dark"] #bagSearchBtn:active,
body.dark #bagSearchBtn.is-tapped,
body.dark #bagSearchBtn:active{
  background:#ff8c00 !important;
  background-color:#ff8c00 !important;
  border-color:#ff8c00 !important;
  box-shadow: inset 0 0 0 999px #ff8c00 !important;
  color:#ffffff !important;
  -webkit-text-fill-color:#ffffff !important;
}

#bagSearchBtn svg,
#bagSearchBtn svg *,
#bagSearchBtn circle,
#bagSearchBtn path,
html[data-theme="dark"] #bagSearchBtn svg,
html[data-theme="dark"] #bagSearchBtn svg *,
html[data-theme="dark"] #bagSearchBtn circle,
html[data-theme="dark"] #bagSearchBtn path,
body.dark #bagSearchBtn svg,
body.dark #bagSearchBtn svg *,
body.dark #bagSearchBtn circle,
body.dark #bagSearchBtn path{
  background:transparent !important;
}

#bagSearchBtn.is-tapped svg,
#bagSearchBtn:active svg,
#bagSearchBtn.is-tapped svg *,
#bagSearchBtn:active svg *,
html[data-theme="dark"] #bagSearchBtn.is-tapped svg,
html[data-theme="dark"] #bagSearchBtn:active svg,
html[data-theme="dark"] #bagSearchBtn.is-tapped svg *,
html[data-theme="dark"] #bagSearchBtn:active svg *,
body.dark #bagSearchBtn.is-tapped svg,
body.dark #bagSearchBtn:active svg,
body.dark #bagSearchBtn.is-tapped svg *,
body.dark #bagSearchBtn:active svg *{
  color:#ffffff !important;
  stroke:#ffffff !important;
  fill:none !important;
  background:transparent !important;
}


/* v136.24 final orange flash for favorites and bag search */
#favoritesToggleBtn.is-tapped,
#favoritesToggleBtn:active,
html[data-theme="dark"] #favoritesToggleBtn.is-tapped,
html[data-theme="dark"] #favoritesToggleBtn:active,
body.dark #favoritesToggleBtn.is-tapped,
body.dark #favoritesToggleBtn:active{
  background:#ff8c00 !important;
  border-color:#ff8c00 !important;
  color:#ffffff !important;
  fill:#ffffff !important;
  stroke:#ffffff !important;
}

#favoritesToggleBtn.is-tapped svg,
#favoritesToggleBtn:active svg,
#favoritesToggleBtn.is-tapped svg *,
#favoritesToggleBtn:active svg *,
html[data-theme="dark"] #favoritesToggleBtn.is-tapped svg,
html[data-theme="dark"] #favoritesToggleBtn:active svg,
html[data-theme="dark"] #favoritesToggleBtn.is-tapped svg *,
html[data-theme="dark"] #favoritesToggleBtn:active svg *,
body.dark #favoritesToggleBtn.is-tapped svg,
body.dark #favoritesToggleBtn:active svg,
body.dark #favoritesToggleBtn.is-tapped svg *,
body.dark #favoritesToggleBtn:active svg *{
  color:#ffffff !important;
  fill:#ffffff !important;
  stroke:#ffffff !important;
}

#bagSearchBtn.is-tapped,
#bagSearchBtn:active,
html[data-theme="dark"] #bagSearchBtn.is-tapped,
html[data-theme="dark"] #bagSearchBtn:active,
body.dark #bagSearchBtn.is-tapped,
body.dark #bagSearchBtn:active{
  background:#ff8c00 !important;
  border-color:#ff8c00 !important;
  color:#ffffff !important;
}

#bagSearchBtn.is-tapped svg,
#bagSearchBtn:active svg,
#bagSearchBtn.is-tapped svg *,
#bagSearchBtn:active svg *,
#bagSearchBtn.is-tapped circle,
#bagSearchBtn:active circle,
#bagSearchBtn.is-tapped path,
#bagSearchBtn:active path,
html[data-theme="dark"] #bagSearchBtn.is-tapped svg,
html[data-theme="dark"] #bagSearchBtn:active svg,
html[data-theme="dark"] #bagSearchBtn.is-tapped svg *,
html[data-theme="dark"] #bagSearchBtn:active svg *,
html[data-theme="dark"] #bagSearchBtn.is-tapped circle,
html[data-theme="dark"] #bagSearchBtn:active circle,
html[data-theme="dark"] #bagSearchBtn.is-tapped path,
html[data-theme="dark"] #bagSearchBtn:active path,
body.dark #bagSearchBtn.is-tapped svg,
body.dark #bagSearchBtn:active svg,
body.dark #bagSearchBtn.is-tapped svg *,
body.dark #bagSearchBtn:active svg *,
body.dark #bagSearchBtn.is-tapped circle,
body.dark #bagSearchBtn:active circle,
body.dark #bagSearchBtn.is-tapped path,
body.dark #bagSearchBtn:active path{
  color:#ffffff !important;
  fill:none !important;
  stroke:#ffffff !important;
}

/* v137.53.301 mobile BAG search: reduce dead space before clear X so more BAGID text stays visible */
#bagSearchInput,
.bag-search-input{
  padding-right: 44px !important;
}

#bagSearchClear,
.bag-search-clear{
  right: 8px !important;
  width: 24px !important;
  height: 24px !important;
  min-width: 24px !important;
  min-height: 24px !important;
  font-size: 18px !important;
  line-height: 24px !important;
}

@media (max-width: 768px), (pointer: coarse){
  #bagSearchInput,
  .bag-search-input{
    padding-right: 42px !important;
  }

  #bagSearchClear,
  .bag-search-clear{
    right: 6px !important;
    width: 22px !important;
    height: 22px !important;
    min-width: 22px !important;
    min-height: 22px !important;
    font-size: 17px !important;
    line-height: 22px !important;
  }
}


/* v137.53.302 BAG search clear X: restore original anchor near favorite star and only shrink left dead space for text */
#bagSearchInput,
.bag-search-input{
  padding-right: 72px !important;
}

#bagSearchClear,
.bag-search-clear{
  right: 42px !important;
  width: 24px !important;
  height: 24px !important;
  min-width: 24px !important;
  min-height: 24px !important;
  font-size: 18px !important;
  line-height: 24px !important;
}

@media (max-width: 768px), (pointer: coarse){
  #bagSearchInput,
  .bag-search-input{
    padding-right: 70px !important;
  }

  #bagSearchClear,
  .bag-search-clear{
    right: 42px !important;
    width: 24px !important;
    height: 24px !important;
    min-width: 24px !important;
    min-height: 24px !important;
    font-size: 18px !important;
    line-height: 24px !important;
  }
}