:root{
  color-scheme: dark;

  /* BTG palette */
  --btg-gold: #d4af37;
  --btg-gold-soft: #e6c55a;

  /* dark UI */
  --bg-main: #0E111E;
  --bg-surface: #151a23;
  --bg-elevated: #1b2230;
  --bg-hover: rgba(255,255,255,.04);
  --border: #2a3342;
  --text: #e7eaf0;
  --muted: #9aa6b2;

  --shadow: 0 10px 30px rgba(0,0,0,.35);
}

/* ================== BASE ================== */
html,
body{
  background: var(--bg-main) !important;
  color: var(--text) !important;
}

body{
  background: var(--bg-main) !important;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

/* ================== HEADER / BRAND ================== */
#header{
  background-color: rgba(21, 26, 51, 0.92) !important;
  border-bottom: 1px solid var(--border) !important;
  backdrop-filter: blur(10px);
}

/* Brand container */
.navbar-brand{
  display: flex !important;
  align-items: center !important;
  gap: 14px !important;
}

/* Custom links injected via nginx sub_filter */
.btg-logo-link{
  display: inline-flex !important;
  align-items: center !important;
  text-decoration: none !important;
}

.btg-title-link{
  display: inline-flex !important;
  align-items: center !important;
  text-decoration: none !important;
}

/* ================== LOGO ANIMATION ================== */
@keyframes btgGlowPulse{
  0%, 100%{
    filter:
      drop-shadow(0 0 10px rgba(212,175,55,.28))
      drop-shadow(0 0 22px rgba(212,175,55,.16));
  }
  50%{
    filter:
      drop-shadow(0 0 18px rgba(212,175,55,.52))
      drop-shadow(0 0 38px rgba(212,175,55,.30));
  }
}

.trezor-logo{
  position: static !important;
  display: inline-block !important;
  flex: 0 0 auto !important;

  background-image: url("/btg-logo.png") !important;
  width: 54px !important;
  height: 54px !important;
  background-size: contain !important;
  background-repeat: no-repeat !important;
  background-position: center !important;

  transform: rotate(0deg);
  transform-origin: 50% 50%;
  transition: transform 0.35s ease !important;
  animation: btgGlowPulse 2s ease-in-out infinite !important;
  will-change: transform, filter;
}

.btg-logo-link:hover .trezor-logo,
.navbar-brand:hover .btg-logo-link .trezor-logo{
  transform: rotate(20deg);
}

@media (prefers-reduced-motion: reduce){
  .trezor-logo{
    animation: none !important;
    transform: none !important;
    transition: none !important;
    filter:
      drop-shadow(0 0 12px rgba(212,175,55,.30))
      drop-shadow(0 0 26px rgba(212,175,55,.18)) !important;
  }

  .btg-logo-link:hover .trezor-logo,
  .navbar-brand:hover .btg-logo-link .trezor-logo{
    transform: none !important;
  }
}

/* Title text */
.navbar-brand span:last-child,
.btg-title-link span{
  padding-left: 0 !important; /* overrides inline padding-left:140px */
  margin-left: 0 !important;
  color: var(--btg-gold) !important;
  font-weight: 700 !important;
  font-size: 1.15rem !important;
  letter-spacing: .02em !important;
}

/* ================== NAV / HAMBURGER ================== */
.navbar-toggler{
  border: 1px solid rgba(212,175,55,.30) !important;
  border-radius: 12px !important;
  background: rgba(27,34,48,.65) !important;
  box-shadow: 0 8px 20px rgba(0,0,0,.25) !important;
}

.navbar-toggler:focus,
.navbar-toggler:focus-visible{
  outline: none !important;
  box-shadow: 0 8px 20px rgba(0,0,0,.25), 0 0 0 2px rgba(212,175,55,.45) !important;
}

.navbar-toggler-icon{
  width: 1.35em !important;
  height: 1.35em !important;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3E%3Cpath stroke='rgba(212,175,55,0.95)' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2.2' d='M4 7h22M4 15h22M4 23h22'/%3E%3C/svg%3E") !important;
}

/* ================== LINKS ================== */
a{
  color: var(--btg-gold) !important;
}

a:hover{
  color: var(--btg-gold-soft) !important;
}

#header a,
.nav-link{
  color: var(--text) !important;
}

#header a:hover,
.nav-link:hover{
  color: var(--btg-gold-soft) !important;
}

/* ================== SEARCH ================== */
input.form-control,
.form-control{
  background-color: var(--bg-elevated) !important;
  border: 1px solid var(--border) !important;
  color: var(--text) !important;
  border-radius: 12px !important;
}

.form-control:focus{
  border-color: var(--btg-gold) !important;
  box-shadow: 0 0 0 1px rgba(212,175,55,.85) !important;
}

.navbar-form ::placeholder{
  color: #6f7a8b !important;
}

.search-icon{
  filter: invert(92%) sepia(6%) saturate(100%) hue-rotate(180deg) brightness(95%) !important;
}

/* ================== TRANSACTION / DETAIL CARDS ================== */
.tx-detail{
  background-color: var(--bg-surface) !important;
  color: var(--text) !important;
  border-radius: 18px !important;
  box-shadow: var(--shadow) !important;
}

.tx-detail > .head,
.tx-detail > .head *{
  color: var(--text) !important;
  opacity: 1 !important;
}

.tx-in .col-12,
.tx-out .col-12,
.tx-addr .col-12{
  background-color: var(--bg-elevated) !important;
  border-bottom: 1px solid var(--border) !important;
  color: var(--text) !important;
}

.tx-detail a{
  color: var(--btg-gold) !important;
}

.tx-detail a:hover{
  color: var(--btg-gold-soft) !important;
}

.tx-detail > .footer{
  color: var(--muted) !important;
  opacity: 1 !important;
}

.tx-detail > .footer .amt,
.tx-detail > .footer .txvalue,
.tx-detail > .footer .tx-amt,
.tx-detail > .footer .prim-amt,
.tx-detail > .footer .sec-amt,
.tx-detail > .footer .csec-amt,
.tx-detail > .footer .base-amt,
.tx-detail > .footer .cbase-amt,
.tx-detail > .footer b,
.tx-detail > .footer strong,
.tx-detail > .footer a{
  color: var(--text) !important;
  opacity: 1 !important;
}

/* ================== TABLES ================== */
table.table{
  --bs-table-bg: var(--bg-surface) !important;
  --bs-table-color: var(--text) !important;
  --bs-table-border-color: var(--border) !important;
  --bs-table-hover-bg: var(--bg-hover) !important;
  --bs-table-hover-color: var(--text) !important;
}

table.table.data-table{
  background-color: var(--bg-surface) !important;
  border-radius: 18px !important;
  overflow: hidden !important;
  border-collapse: separate !important;
  border-spacing: 0 !important;
  box-shadow: var(--shadow) !important;
}

table.table.data-table tbody{
  background-color: var(--bg-surface) !important;
  box-shadow: none !important;
}

table.table.data-table > :not(caption) > * > *{
  background-color: var(--bg-surface) !important;
  color: var(--text) !important;
  box-shadow: none !important;
  border-bottom-color: var(--border) !important;
}

table.table.data-table tbody tr:hover > *{
  background-color: var(--bg-hover) !important;
  color: var(--text) !important;
}

/* Disable hover effect on info/status tables */
table.table.info-table tbody tr:hover > *{
  background-color: var(--bg-surface) !important;
  color: var(--text) !important;
}

table.table.info-table tr > td:first-child{
  color: var(--muted) !important;
}

table.table.info-table tr:nth-child(4){
  display: none !important;
}

table.table.info-table h5,
table.table.info-table h5 *{
  color: var(--text) !important;
  opacity: 1 !important;
  text-shadow: none !important;
}

table.table.info-table td{
  color: var(--text) !important;
}

table.table.info-table h5{
  font-weight: 700 !important;
  margin: 0 !important;
}

/* ================== HEADINGS ================== */
h1,
h3{
  color: var(--btg-gold) !important;
}

main#wrap .container h1:first-of-type{
  margin-top: 10px !important;
}

/* ================== PAGING ================== */
.paging-group{
  border: 1px solid var(--border) !important;
  border-radius: 14px !important;
  background: transparent !important;
  outline: none !important;
  box-shadow: none !important;
}

.paging-group:focus,
.paging-group:focus-visible,
.paging-group:focus-within{
  outline: none !important;
  box-shadow: none !important;
}

.bb-group{
  border: 1px solid var(--border) !important;
  background-color: var(--bg-elevated) !important;
  border-radius: 14px !important;
  padding: 6px !important;
  box-shadow: var(--shadow) !important;
  outline: none !important;
}

.bb-group:focus,
.bb-group:focus-visible,
.bb-group:focus-within{
  outline: none !important;
  box-shadow: var(--shadow) !important;
}

.bb-group > .btn{
  background: transparent !important;
  color: var(--muted) !important;
  border-radius: 12px !important;
  padding: 8px 12px !important;
  margin: 0 2px !important;
  border: 1px solid transparent !important;
  outline: none !important;
  box-shadow: none !important;
}

.bb-group > .btn:hover{
  background-color: rgba(212,175,55,.10) !important;
  color: var(--btg-gold-soft) !important;
  border-color: rgba(212,175,55,.25) !important;
}

.bb-group > .btn-check:checked + .btn,
.bb-group .btn.active{
  background-color: var(--btg-gold) !important;
  color: #0b0d12 !important;
  font-weight: 800 !important;
}

.bb-group .btn:focus,
.bb-group .btn:focus-visible,
.paging-group a:focus,
.paging-group a:focus-visible,
.paging-group button:focus,
.paging-group button:focus-visible{
  outline: none !important;
  box-shadow: none !important;
}

a.btn-paging,
button.btn-paging,
span.btn-paging{
  background-color: var(--bg-elevated) !important;
  border: 1px solid var(--border) !important;
  color: var(--btg-gold) !important;
  border-radius: 14px !important;
  padding: 14px 22px !important;
  font-weight: 750 !important;
  box-shadow: var(--shadow) !important;
  text-decoration: none !important;
  outline: none !important;
}

a.btn-paging:hover,
button.btn-paging:hover{
  background-color: rgba(212,175,55,.10) !important;
  border-color: rgba(212,175,55,.35) !important;
  color: var(--btg-gold-soft) !important;
}

a.btn-paging:focus,
a.btn-paging:focus-visible,
button.btn-paging:focus,
button.btn-paging:focus-visible{
  outline: none !important;
  box-shadow: none !important;
}

span.btn-paging{
  cursor: default !important;
  opacity: .9 !important;
}

/* ================== BADGES ================== */
.badge.bg-success{
  background-color: var(--btg-gold) !important;
  color: #0b0d12 !important;
  font-weight: 700 !important;
}

/* ================== FORM SELECTS ================== */
select,
select.w-100{
  background-color: var(--bg-elevated) !important;
  color: var(--text) !important;
  border: 1px solid var(--border) !important;
  border-radius: 12px !important;
  padding: 10px 12px !important;
  outline: none !important;
}

select:focus,
select.w-100:focus{
  border-color: var(--btg-gold) !important;
  box-shadow: 0 0 0 1px rgba(212,175,55,.85) !important;
}

select option{
  background-color: var(--bg-surface) !important;
  color: var(--text) !important;
}

/* ================== REMOVE ORIGINAL NOTICE / FOOTER ================== */
main#wrap .container > span.text-muted{
  display: none !important;
}

#footer{
  display: none !important;
}

/* ================== CUSTOM FOOTER BAR ================== */
.btg-footer-bar{
  width: 100% !important;
  display: flex !important;
  justify-content: center !important;
  align-items: center !important;
  flex-wrap: wrap !important;
  gap: 0 !important;
  text-align: center !important;
  padding: 18px 16px !important;
  margin-top: 20px !important;
  background: rgba(21,26,35,.92) !important;
  color: var(--muted) !important; /* Powered by Blockbook */
  font-weight: 600 !important;
  letter-spacing: .02em !important;
  border-top: 1px solid var(--border) !important;
  box-sizing: border-box !important;
}

.btg-footer-bar a,
.btg-footer-bar a:visited,
.btg-footer-bar a:active{
  color: var(--btg-gold) !important; /* Privacy Policy */
  text-decoration: none !important;
}

.btg-footer-bar a:hover{
  color: var(--btg-gold-soft) !important;
  text-decoration: underline !important;
}

.btg-sep{
  color: var(--muted) !important;
  margin: 0 8px !important;
}

/* Keep output/input amounts readable on hover */
.tx-detail .txvalue,
.tx-detail .tx-amt,
.tx-detail .amt,
.tx-detail .prim-amt,
.tx-detail .sec-amt,
.tx-detail .csec-amt,
.tx-detail .base-amt,
.tx-detail .cbase-amt{
  color: var(--text) !important;
}

.tx-detail .txvalue:hover,
.tx-detail .tx-amt:hover,
.tx-detail .amt:hover,
.tx-detail .prim-amt:hover,
.tx-detail .sec-amt:hover,
.tx-detail .csec-amt:hover,
.tx-detail .base-amt:hover,
.tx-detail .cbase-amt:hover{
  color: var(--text) !important;
  opacity: 1 !important;
}
