/*
 * FGC Explorer Theme - Stable Enterprise Version
 * No animations, no transitions that cause crashes
 */

/* Icon Font - icomoon */
@font-face {
    font-family: icomoon;
    src: url(../fonts/iconmoon/icomoon.eot?s0z324);
    src: url(../fonts/iconmoon/icomoon.eot?s0z324#iefix) format("embedded-opentype"),
        url(../fonts/iconmoon/icomoon.ttf?s0z324) format("truetype"),
        url(../fonts/iconmoon/icomoon.woff?s0z324) format("woff"),
        url(../fonts/iconmoon/icomoon.svg?s0z324#icomoon) format("svg");
    font-weight: 400;
    font-style: normal;
}

[class^=icon-],
[class*=" icon-"],
[class^=icon-]:before,
[class*=" icon-"]:before {
    font-family: icomoon !important;
    speak: none;
    font-style: normal;
    font-weight: 400;
    font-variant: normal;
    text-transform: none;
    line-height: 1;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

.icon-copy:before {
    content: "\e906";
    color: var(--gold) !important;
}

.icon-plus:before {
    content: "\e90e";
    color: var(--gold) !important;
}

.icon-minus:before {
    content: "\e907";
    color: var(--gold) !important;
}

.icon-search:before {
    content: "\e909";
}

.icon-arrow:before {
    content: "\e90d";
}

:root {
    --gold: #D4AF37;
    --gold-light: #E8C547;
    --bg-dark: #121212;
    --bg-card: #1a1a1a;
    --bg-hover: #252525;
    --text: #fff;
    --text-dim: #999;
    --border: #333;
    --success: #4CAF50;
    --error: #f44336;
}

/* BASE */
html,
body {
    margin: 0 !important;
    padding: 0 !important;
    background: var(--bg-dark) !important;
    color: var(--text) !important;
    font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif !important;
    font-size: 14px !important;
    line-height: 1.5 !important;
}

a {
    color: var(--gold) !important;
    text-decoration: none !important;
}

/* Remove blue highlight from transaction hashes */
.mark,
.mark:hover {
    background: transparent !important;
    color: var(--gold) !important;
    padding: 0 !important;
}

.wrapper {
    background: var(--bg-dark) !important;
    min-height: 100vh !important;
}

/* ============================================
   HEADER - FIXED STRUCTURE
   ============================================ */
.header {
    background: #1a1a1a !important;
    border-bottom: 1px solid var(--gold) !important;
    height: auto !important;
    min-height: 60px !important;
    padding: 12px 0 !important;
    display: block !important;
}

.header.fixed {
    position: fixed !important;
    top: 0 !important;
    left: 0 !important;
    right: 0 !important;
    z-index: 1000 !important;
}

.header .box {
    max-width: 1400px !important;
    margin: 0 auto !important;
    padding: 0 20px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: flex-start !important;
    flex-wrap: nowrap !important;
    gap: 15px !important;
    flex-direction: row !important;
    width: 100% !important;
    height: auto !important;
}

/* LOGO */
.logo,
a.logo {
    display: inline-block !important;
    float: none !important;
    margin: 0 !important;
    padding: 0 !important;
    order: 0 !important;
    flex-shrink: 0 !important;
}

.logo img,
.logoPic-def {
    height: 40px !important;
    width: auto !important;
    display: block !important;
    vertical-align: middle !important;
}

.logoPic-hover {
    display: none !important;
}

/* Disable hover effect that hides/shows images */
.logo:hover .logoPic-def {
    display: block !important;
}

.logo:hover .logoPic-hover {
    display: none !important;
}

/* NAVIGATION */
.nav {
    display: flex !important;
    align-items: center !important;
    gap: 2px !important;
    flex-wrap: nowrap !important;
    float: none !important;
    order: 1 !important;
    flex-shrink: 1 !important;
}

.nav__item,
.nav a {
    display: inline-block !important;
    color: var(--text-dim) !important;
    padding: 8px 10px !important;
    border-radius: 6px !important;
    font-size: 12px !important;
    font-weight: 500 !important;
    text-transform: none !important;
    border: none !important;
    background: transparent !important;
    white-space: nowrap !important;
}

.nav__item:hover,
.nav a:hover {
    color: var(--gold) !important;
    background: rgba(212, 175, 55, 0.1) !important;
}

.nav__item.active,
.nav a.active {
    color: var(--gold) !important;
    background: rgba(212, 175, 55, 0.15) !important;
}

/* SEARCH */
.search__wrap {
    margin-left: auto !important;
    order: 2 !important;
    float: none !important;
    flex-shrink: 0 !important;
}

.search {
    position: relative !important;
    display: block !important;
}

.search__icon {
    position: absolute !important;
    left: 12px !important;
    top: 50% !important;
    transform: translateY(-50%) !important;
    color: #666 !important;
    pointer-events: none !important;
    z-index: 1 !important;
}

.search input,
.search__wrap input,
.search__field {
    background: #222 !important;
    border: 1px solid var(--border) !important;
    border-radius: 20px !important;
    color: var(--text) !important;
    padding: 8px 14px 8px 36px !important;
    width: 220px !important;
    font-size: 12px !important;
    height: auto !important;
}

.search input:focus,
.search__wrap input:focus {
    border-color: var(--gold) !important;
    outline: none !important;
    box-shadow: none !important;
}

.search input::placeholder {
    color: #666 !important;
}

.search__notFound {
    position: absolute !important;
    top: 100% !important;
    left: 0 !important;
    right: 0 !important;
    background: var(--bg-card) !important;
    border: 1px solid var(--border) !important;
    border-radius: 8px !important;
    padding: 10px !important;
    margin-top: 5px !important;
    color: var(--error) !important;
    font-size: 12px !important;
}

/* LANGUAGE SWITCHER */
.header__lang-switcher {
    order: 3 !important;
    float: none !important;
    width: auto !important;
    padding: 0 !important;
    margin: 0 !important;
    margin-left: 15px !important;
}

.language-switcher {
    position: relative !important;
    display: inline-block !important;
}

.language-switcher__selected {
    background: var(--bg-card) !important;
    border: 1px solid var(--gold) !important;
    border-radius: 6px !important;
    color: var(--gold) !important;
    cursor: pointer !important;
    padding: 8px 14px !important;
    font-size: 13px !important;
    font-weight: 500 !important;
    display: inline-flex !important;
    align-items: center !important;
    gap: 8px !important;
    max-width: none !important;
    width: auto !important;
    white-space: nowrap !important;
}

.language-switcher__selected:hover {
    border-color: var(--gold-light) !important;
    color: var(--gold-light) !important;
    background: var(--bg-hover) !important;
}

.language-switcher__icon {
    float: none !important;
    display: inline !important;
    font-size: 10px !important;
    color: var(--gold) !important;
    opacity: 0.8 !important;
}

.language-switcher__icon img {
    display: none !important;
}

.language-switcher__container {
    display: none !important;
    position: absolute !important;
    top: 100% !important;
    right: 0 !important;
    left: auto !important;
    bottom: auto !important;
    transform: none !important;
    background: var(--bg-card) !important;
    border: 1px solid var(--gold) !important;
    border-radius: 8px !important;
    min-width: 160px !important;
    max-width: none !important;
    margin-top: 5px !important;
    z-index: 1001 !important;
    box-shadow: 0 4px 16px rgba(212, 175, 55, 0.15) !important;
    padding: 6px 0 !important;
}

.language-switcher:hover .language-switcher__container {
    display: block !important;
}

.language-switcher:hover .language-switcher__selected {
    background: var(--bg-hover) !important;
    color: var(--gold-light) !important;
    border-color: var(--gold-light) !important;
}

.language-switcher__item,
.language-switcher__item:link,
.language-switcher__item:visited,
.language-switcher__item:active {
    display: block !important;
    padding: 10px 16px !important;
    color: #ffffff !important;
    font-size: 13px !important;
    width: 100% !important;
    max-width: none !important;
    text-align: left !important;
    box-sizing: border-box !important;
    background: transparent !important;
    text-decoration: none !important;
}

.language-switcher__item:hover {
    background: var(--bg-hover) !important;
    color: var(--gold) !important;
}

.language-switcher__item.selected,
.language-switcher__item.selected:link,
.language-switcher__item.selected:visited {
    color: var(--gold) !important;
    font-weight: 500 !important;
    background: rgba(212, 175, 55, 0.1) !important;
}

/* ============================================
   CONTENT AREA
   ============================================ */
.content {
    background: var(--bg-dark) !important;
    padding: 20px 0 !important;
    min-height: calc(100vh - 140px) !important;
}

.header.fixed~.content {
    padding-top: 90px !important;
}

.box {
    max-width: 1400px !important;
    margin: 0 auto !important;
    padding: 0 20px !important;
    background: transparent !important;
}

/* Two Column Layout - Flex Grid */
.content>.box {
    display: block !important;
    width: 100% !important;
}

/* Row container for side-by-side sections */
.content__row {
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 20px !important;
    width: 100% !important;
    margin-bottom: 20px !important;
}

.content__row .content__left,
.content__row .content__right {
    flex: 1 1 calc(50% - 10px) !important;
    min-width: 350px !important;
}

.content__left {
    background: var(--bg-card) !important;
    border: 1px solid var(--border) !important;
    border-radius: 12px !important;
    padding: 24px !important;
    margin-bottom: 0 !important;
    float: none !important;
    flex: 1 1 400px !important;
    min-width: 0 !important;
    max-width: 100% !important;
}

.content__right {
    background: var(--bg-card) !important;
    border: 1px solid var(--border) !important;
    border-radius: 12px !important;
    padding: 24px !important;
    margin-bottom: 0 !important;
    float: none !important;
    flex: 1 1 400px !important;
    min-width: 0 !important;
    max-width: 100% !important;
}

.content__full {
    background: var(--bg-card) !important;
    border: 1px solid var(--border) !important;
    border-radius: 12px !important;
    padding: 24px !important;
    margin-bottom: 20px !important;
    width: 100% !important;
    flex: 1 1 100% !important;
    box-sizing: border-box !important;
}

/* ============================================
   HEADINGS
   ============================================ */
h1,
h2,
h3,
h4,
h5,
h6,
.heading__title,
.section__title {
    color: var(--gold) !important;
    font-weight: 600 !important;
    margin: 0 !important;
}

.heading {
    display: flex !important;
    align-items: center !important;
    gap: 12px !important;
    margin-bottom: 20px !important;
    flex-wrap: wrap !important;
}

.heading__title {
    flex: 0 0 auto !important;
    margin: 0 !important;
}

.heading__pic {
    display: flex !important;
    align-items: center !important;
    flex-shrink: 0 !important;
}

.heading__pic img {
    height: 32px !important;
    width: auto !important;
}

.heading__linkWrap {
    margin-left: auto !important;
}

.heading__link,
.heading__linkWrap a {
    color: var(--gold) !important;
    font-size: 13px !important;
    text-decoration: none !important;
    transition: opacity 0.2s ease !important;
}

.heading__link:hover,
.heading__linkWrap a:hover {
    opacity: 0.8 !important;
}

/* ============================================
   STATS GRID - Blockchain Info & Value Info
   ============================================ */
.content__list-blockchain {
    display: block !important;
}

/* Stats row layouts */
.stats-row {
    display: grid !important;
    gap: 10px !important;
    margin-bottom: 10px !important;
}

.stats-row:last-child {
    margin-bottom: 0 !important;
}

.stats-row--1col {
    grid-template-columns: 1fr !important;
}

.stats-row--2col {
    grid-template-columns: repeat(2, 1fr) !important;
}

.stats-row--3col {
    grid-template-columns: repeat(3, 1fr) !important;
}

.content__list-blockchain .item {
    background: var(--bg-dark) !important;
    border: 1px solid var(--border) !important;
    border-radius: 8px !important;
    padding: 20px !important;
    margin-bottom: 0 !important;
    display: block !important;
    box-sizing: border-box !important;
    text-align: center !important;
}

.content__list-blockchain .item-large {
    padding: 28px 24px !important;
    text-align: center !important;
    border-color: var(--gold) !important;
    background: linear-gradient(135deg, var(--bg-dark) 0%, rgba(212, 175, 55, 0.05) 100%) !important;
}

.content__list-blockchain .item:hover {
    border-color: var(--gold) !important;
}

.content__list-blockchain .item .label {
    color: var(--gold) !important;
    font-size: 1.5em !important;
    font-weight: 600 !important;
    display: block !important;
    margin-bottom: 8px !important;
    word-break: break-word !important;
}

.content__list-blockchain .item-large .label {
    font-size: 2em !important;
    color: var(--gold) !important;
}

.content__list-blockchain .item-large .labeled {
    font-size: 0.95em !important;
    margin-top: 8px !important;
}

.content__list-blockchain .item .labeled {
    color: var(--text-dim) !important;
    font-size: 0.85em !important;
    text-transform: uppercase !important;
    letter-spacing: 0.5px !important;
}

.content__list-blockchain .item-full {
    display: block !important;
    width: 100% !important;
    box-sizing: border-box !important;
}

.content__list-blockchain .clearfix {
    display: grid !important;
    grid-template-columns: repeat(3, 1fr) !important;
    gap: 12px !important;
    margin-bottom: 12px !important;
}

.content__list-blockchain .clearfix .item {
    margin-bottom: 0 !important;
    display: block !important;
    width: auto !important;
}

.content__list-blockchain .clearfix::after {
    display: none !important;
}

.limiter {
    border-top: 1px solid var(--border) !important;
    margin: 10px 0 !important;
    padding: 0 !important;
    display: block !important;
    width: 100% !important;
}

/* Section heading inside Blockchain Info */
.section__heading {
    margin: 20px 0 15px 0 !important;
    padding-top: 15px !important;
    border-top: 1px solid var(--border) !important;
}

.section__heading--first {
    margin-top: 0 !important;
    padding-top: 0 !important;
    border-top: none !important;
}

.section__title {
    color: var(--gold) !important;
    font-size: 1em !important;
    font-weight: 600 !important;
    text-transform: uppercase !important;
    letter-spacing: 1px !important;
    margin: 0 !important;
}

/* Responsive stats grid */
@media (max-width: 768px) {
    .stats-row--3col {
        grid-template-columns: repeat(2, 1fr) !important;
    }

    .content__list-blockchain .item-large .label {
        font-size: 1.6em !important;
    }
}

@media (max-width: 480px) {

    .stats-row--2col,
    .stats-row--3col {
        grid-template-columns: 1fr !important;
    }

    .content__list-blockchain .item-large {
        padding: 20px 16px !important;
    }

    .content__list-blockchain .item-large .label {
        font-size: 1.4em !important;
    }
}

.section__title {
    color: var(--gold) !important;
    font-size: 1.1em !important;
    font-weight: 600 !important;
    margin: 0 !important;
}

/* Responsive grid for stats */
@media (max-width: 768px) {
    .content__list-blockchain .clearfix {
        grid-template-columns: repeat(2, 1fr) !important;
    }
}

@media (max-width: 480px) {
    .content__list-blockchain .clearfix {
        grid-template-columns: 1fr !important;
    }
}

/* ============================================
   LISTS
   ============================================ */
.list {
    list-style: none !important;
    padding: 0 !important;
    margin: 0 !important;
}

.list__item {
    background: var(--bg-dark) !important;
    border: 1px solid var(--border) !important;
    border-radius: 8px !important;
    padding: 12px 14px !important;
    margin-bottom: 8px !important;
    display: flex !important;
    justify-content: space-between !important;
    align-items: center !important;
    flex-wrap: wrap !important;
    gap: 8px !important;
}

.list__item:hover {
    border-color: #444 !important;
}

.list__left {
    color: var(--text-dim) !important;
}

.list__right {
    color: var(--text) !important;
    text-align: right !important;
}

/* Block List */
.list-blocks__left {
    flex: 0 0 140px !important;
}

.list-blocks__left a,
a.list-blocks__left {
    display: block !important;
    text-decoration: none !important;
}

.list-blocks__left .list__row:first-child {
    color: var(--gold) !important;
    font-weight: 600 !important;
    font-size: 14px !important;
}

.list-blocks__left .list__row.fsz-13 {
    color: var(--text-dim) !important;
    font-size: 12px !important;
    margin-top: 4px !important;
}

.list-blocks__right {
    flex: 1 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 30px !important;
    padding-left: 30px !important;
}

.list-blocks__right .list__row {
    display: inline-flex !important;
    align-items: center !important;
    gap: 8px !important;
    margin-bottom: 0 !important;
    white-space: nowrap !important;
}

.list-blocks__right .mined__help {
    color: var(--text-dim) !important;
    font-size: 13px !important;
}

.list-blocks__right .mined__name {
    color: var(--gold) !important;
    font-size: 13px !important;
    max-width: 120px !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
}

.list-blocks__right .label {
    color: var(--text-dim) !important;
    font-size: 13px !important;
}

.list-blocks__right .labeled {
    color: var(--text) !important;
    font-weight: 500 !important;
    font-size: 13px !important;
}

.list__row {
    display: block !important;
    margin-bottom: 2px !important;
}

/* ============================================
   TABLES
   ============================================ */
table {
    width: 100% !important;
    border-collapse: collapse !important;
    background: transparent !important;
}

table th {
    background: var(--bg-dark) !important;
    color: var(--gold) !important;
    font-weight: 600 !important;
    text-transform: uppercase !important;
    font-size: 11px !important;
    letter-spacing: 0.5px !important;
    padding: 12px !important;
    text-align: left !important;
    border-bottom: 2px solid var(--gold) !important;
}

table td {
    padding: 12px !important;
    border-bottom: 1px solid var(--border) !important;
    color: var(--text) !important;
}

table tr:hover td {
    background: var(--bg-hover) !important;
}

/* ============================================
   BUTTONS
   ============================================ */
.btn,
button:not(.language-switcher__selected) {
    background: linear-gradient(135deg, #C89116 0%, var(--gold) 100%) !important;
    border: none !important;
    border-radius: 6px !important;
    color: #000 !important;
    cursor: pointer !important;
    font-weight: 600 !important;
    padding: 10px 18px !important;
    font-size: 13px !important;
}

/* ============================================
   FORMS
   ============================================ */
input:not(.search__field),
textarea,
select,
.form-control {
    background: var(--bg-dark) !important;
    border: 1px solid var(--border) !important;
    border-radius: 6px !important;
    color: var(--text) !important;
    padding: 10px 14px !important;
}

input:focus,
textarea:focus,
select:focus,
.form-control:focus {
    border-color: var(--gold) !important;
    outline: none !important;
}

/* ============================================
   BADGES & LABELS
   ============================================ */
.badge,
.label-success,
.label-danger,
.label-warning,
.label-default,
.label-info {
    border-radius: 4px !important;
    padding: 4px 10px !important;
    font-size: 11px !important;
    font-weight: 600 !important;
    display: inline-block !important;
}

.label-success,
.badge-success {
    background: var(--success) !important;
    color: #fff !important;
}

.label-danger,
.badge-danger {
    background: var(--error) !important;
    color: #fff !important;
}

.label-warning,
.badge-warning {
    background: #FFC107 !important;
    color: #000 !important;
}

.label-default {
    background: #555 !important;
    color: #fff !important;
}

/* ============================================
   FOOTER
   ============================================ */
.footer {
    background: #1a1a1a !important;
    border-top: 1px solid var(--gold) !important;
    color: var(--text-dim) !important;
    padding: 20px !important;
    text-align: center !important;
    margin-top: 0 !important;
    height: auto !important;
    position: relative !important;
}

/* ============================================
   PAGINATION
   ============================================ */
.pagination {
    display: flex !important;
    gap: 4px !important;
    justify-content: center !important;
    list-style: none !important;
    padding: 0 !important;
    margin: 20px 0 !important;
}

.pagination>li>a,
.pagination>li>span {
    background: var(--bg-card) !important;
    border: 1px solid var(--border) !important;
    color: var(--text) !important;
    padding: 8px 14px !important;
    border-radius: 6px !important;
}

.pagination>li.active>a,
.pagination>li>a:hover {
    background: var(--gold) !important;
    border-color: var(--gold) !important;
    color: #000 !important;
}

/* ============================================
   DROPDOWNS
   ============================================ */
.dropdown-menu {
    background: var(--bg-card) !important;
    border: 1px solid var(--border) !important;
    border-radius: 8px !important;
    padding: 8px 0 !important;
}

.dropdown-menu>li>a {
    color: var(--text) !important;
    padding: 8px 16px !important;
}

.dropdown-menu>li>a:hover {
    background: var(--bg-hover) !important;
    color: var(--gold) !important;
}

/* ============================================
   ALERTS
   ============================================ */
.alert {
    border-radius: 8px !important;
    padding: 14px 18px !important;
    margin-bottom: 15px !important;
}

.alert-success {
    background: rgba(76, 175, 80, 0.15) !important;
    color: var(--success) !important;
    border: 1px solid var(--success) !important;
}

.alert-danger {
    background: rgba(244, 67, 54, 0.15) !important;
    color: var(--error) !important;
    border: 1px solid var(--error) !important;
}

.alert-warning {
    background: rgba(255, 193, 7, 0.15) !important;
    color: #FFC107 !important;
    border: 1px solid #FFC107 !important;
}

.alert-info {
    background: rgba(212, 175, 55, 0.15) !important;
    color: var(--gold) !important;
    border: 1px solid var(--gold) !important;
}

/* ============================================
   LOADING SPINNER
   ============================================ */
.preload__box {
    display: flex !important;
    justify-content: center !important;
    padding: 40px !important;
    background: transparent !important;
}

.preload,
.preloadInner {
    width: 32px !important;
    height: 32px !important;
    border: 3px solid var(--border) !important;
    border-top-color: var(--gold) !important;
    border-radius: 50% !important;
    animation: fgc-spin 0.8s linear infinite !important;
    background: transparent !important;
}

.preloadInner {
    display: none !important;
}

@keyframes fgc-spin {
    to {
        transform: rotate(360deg);
    }
}

/* Empty message */
.empty-message {
    text-align: center !important;
    padding: 40px 20px !important;
    color: var(--text-dim) !important;
}

.empty-message p {
    margin: 0 !important;
    font-size: 14px !important;
}

/* ============================================
   MISC
   ============================================ */
.qrcode-container,
qrcode {
    background: #fff !important;
    padding: 12px !important;
    border-radius: 8px !important;
    display: inline-block !important;
}

.insight__chart {
    background: var(--bg-dark) !important;
    border-radius: 8px !important;
    padding: 16px !important;
}

.hash__data {
    font-family: 'Monaco', 'Menlo', 'Courier New', monospace !important;
    font-size: 12px !important;
    word-break: break-all !important;
}

.copyParent {
    position: relative !important;
    display: inline-flex !important;
    align-items: center !important;
    gap: 10px !important;
}

.copyParent-right {
    flex-direction: row-reverse !important;
}

/* Copy Button with visible icon */
.copyBtn {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    color: var(--gold) !important;
    cursor: pointer !important;
    font-size: 16px !important;
    padding: 6px !important;
    border-radius: 6px !important;
    background: rgba(212, 175, 55, 0.1) !important;
    border: 1px solid rgba(212, 175, 55, 0.3) !important;
    transition: all 0.2s ease !important;
    flex-shrink: 0 !important;
    min-width: 32px !important;
    min-height: 32px !important;
}

.copyBtn:hover {
    color: var(--bg-dark) !important;
    background: var(--gold) !important;
    border-color: var(--gold) !important;
}

.copyBtn.icon-copy:before {
    font-size: 14px !important;
}

/* Copied tooltip - shows on successful copy */
.copyBtn[data-copied="true"]::after,
.copyParent.copied .copyBtn::after {
    content: "Copied!" !important;
    position: absolute !important;
    top: -35px !important;
    left: 50% !important;
    transform: translateX(-50%) !important;
    background: var(--gold) !important;
    color: var(--bg-dark) !important;
    padding: 6px 12px !important;
    border-radius: 6px !important;
    font-size: 12px !important;
    font-weight: 600 !important;
    white-space: nowrap !important;
    z-index: 1000 !important;
    animation: fadeInOut 1.5s ease-in-out !important;
}

@keyframes fadeInOut {
    0% {
        opacity: 0;
        transform: translateX(-50%) translateY(5px);
    }

    15% {
        opacity: 1;
        transform: translateX(-50%) translateY(0);
    }

    85% {
        opacity: 1;
        transform: translateX(-50%) translateY(0);
    }

    100% {
        opacity: 0;
        transform: translateX(-50%) translateY(-5px);
    }
}

/* "Copied!" tooltip that appears on copy - styled for FGC theme */
/* Small inline badge style - doesn't overlay content */
.copied {
    position: fixed !important;
    top: 80px !important;
    left: 50% !important;
    transform: translateX(-50%) !important;
    height: auto !important;
    background: var(--gold) !important;
    color: var(--bg-dark) !important;
    font-size: 14px !important;
    line-height: 1 !important;
    padding: 12px 24px !important;
    font-weight: 600 !important;
    border-radius: 8px !important;
    white-space: nowrap !important;
    z-index: 9999 !important;
    opacity: 0 !important;
    visibility: hidden !important;
    transition: opacity 0.3s ease, visibility 0.3s ease !important;
    pointer-events: none !important;
    box-shadow: 0 4px 20px rgba(212, 175, 55, 0.4) !important;
}

.copied.active {
    opacity: 1 !important;
    visibility: visible !important;
}

/* Bootstrap Tooltip styling */
.tooltip {
    background: var(--bg-card) !important;
    border: 1px solid var(--gold) !important;
    color: var(--gold) !important;
    padding: 6px 12px !important;
    border-radius: 6px !important;
    font-size: 12px !important;
    font-weight: 500 !important;
}

.tooltip-inner {
    background: var(--bg-card) !important;
    color: var(--gold) !important;
    border: 1px solid var(--gold) !important;
    padding: 8px 14px !important;
    border-radius: 6px !important;
    font-weight: 500 !important;
}

.tooltip.top .tooltip-arrow {
    border-top-color: var(--gold) !important;
}

.progress {
    background: var(--bg-dark) !important;
    border-radius: 4px !important;
    height: 8px !important;
    overflow: hidden !important;
}

.progress-bar {
    background: var(--gold) !important;
    height: 100% !important;
}

/* Hide connection errors */
.connection-status,
[ng-show="!$root.isOnline"] {
    display: none !important;
}

/* Scrollbar */
::-webkit-scrollbar {
    width: 8px !important;
    height: 8px !important;
}

::-webkit-scrollbar-track {
    background: var(--bg-dark) !important;
}

::-webkit-scrollbar-thumb {
    background: #444 !important;
    border-radius: 4px !important;
}

/* ============================================
   RESPONSIVE
   ============================================ */
@media (max-width: 1200px) {

    .search input,
    .search__wrap input,
    .search__field {
        width: 180px !important;
    }

    .nav__item,
    .nav a {
        padding: 6px 8px !important;
        font-size: 11px !important;
    }
}

@media (max-width: 1024px) {
    .header .box {
        flex-direction: row !important;
        flex-wrap: wrap !important;
        justify-content: center !important;
    }

    .search__wrap {
        width: 100% !important;
        margin: 10px 0 0 0 !important;
        order: 10 !important;
    }

    .search input,
    .search__wrap input,
    .search__field {
        width: 100% !important;
    }

    .content__left,
    .content__right {
        float: none !important;
        width: 100% !important;
    }

    .nav {
        flex-wrap: wrap !important;
        justify-content: center !important;
    }
}

@media (max-width: 768px) {

    .logo img,
    .logoPic-def {
        height: 32px !important;
    }

    .nav {
        justify-content: center !important;
        width: 100% !important;
    }

    .content__list-blockchain {
        grid-template-columns: 1fr 1fr !important;
    }

    .clearfix {
        grid-template-columns: 1fr 1fr !important;
    }
}

@media (max-width: 480px) {
    .content__list-blockchain {
        grid-template-columns: 1fr !important;
    }

    .clearfix {
        grid-template-columns: 1fr !important;
    }

    .list__item {
        flex-direction: column !important;
        align-items: flex-start !important;
    }

    .list__right {
        text-align: left !important;
        width: 100% !important;
    }
}

/* ============================================
   ABOUT FOOTER - Small section at bottom
   ============================================ */
.about-footer {
    max-width: 1400px !important;
    margin: 40px auto 20px !important;
    padding: 20px !important;
    text-align: center !important;
    border-top: 1px solid var(--border) !important;
}

.about-footer__title {
    color: var(--gold) !important;
    font-size: 14px !important;
    font-weight: 600 !important;
    margin: 0 0 10px 0 !important;
    text-transform: uppercase !important;
    letter-spacing: 1px !important;
}

.about-footer__text {
    color: var(--text-dim) !important;
    font-size: 12px !important;
    line-height: 1.6 !important;
    margin: 0 0 8px 0 !important;
    max-width: 800px !important;
    margin-left: auto !important;
    margin-right: auto !important;
}

.about-footer__text:last-child {
    margin-bottom: 0 !important;
}

/* ============================================
   SEND RAW TRANSACTION SECTION
   ============================================ */
.trans-textarea {
    background: var(--bg-card) !important;
    border: 1px solid var(--border) !important;
    border-radius: 8px !important;
    padding: 15px !important;
    margin-bottom: 20px !important;
}

.trans-textarea .title {
    color: var(--text-dim) !important;
    font-size: 12px !important;
    margin-bottom: 10px !important;
    text-transform: uppercase !important;
}

.trans-textarea .body {
    width: 100% !important;
}

.trans-textarea textarea {
    width: 100% !important;
    min-height: 120px !important;
    background: var(--bg-dark) !important;
    border: 1px solid var(--border) !important;
    border-radius: 4px !important;
    color: var(--text) !important;
    padding: 12px !important;
    font-family: monospace !important;
    font-size: 13px !important;
    resize: vertical !important;
}

.trans-textarea textarea:focus {
    outline: none !important;
    border-color: var(--gold) !important;
}

.trans-textarea.error {
    border-color: var(--error) !important;
}

.trans-textarea .error-msg {
    color: var(--error) !important;
    font-size: 12px !important;
    display: none !important;
}

.trans-textarea.error .error-msg {
    display: block !important;
    margin-bottom: 10px !important;
}

.btn-wrap {
    margin-bottom: 15px !important;
    overflow: visible !important;
    height: auto !important;
    min-height: 50px !important;
    display: block !important;
}

.btn-wrap .error-msg {
    color: var(--error) !important;
    font-size: 12px !important;
    margin-left: 15px !important;
}

/* Fix base .btn class */
.btn {
    height: auto !important;
    line-height: normal !important;
    overflow: visible !important;
}

.btn.btn-blocks {
    display: inline-block !important;
    background: var(--gold) !important;
    color: #000 !important;
    padding: 12px 30px !important;
    border-radius: 6px !important;
    font-weight: 600 !important;
    font-size: 14px !important;
    text-transform: uppercase !important;
    letter-spacing: 0.5px !important;
    cursor: pointer !important;
    border: none !important;
    transition: background 0.2s ease !important;
    height: auto !important;
    line-height: normal !important;
    overflow: visible !important;
    visibility: visible !important;
    opacity: 1 !important;
}

.btn.btn-blocks:hover {
    background: var(--gold-light) !important;
    color: #000 !important;
}

.success {
    color: var(--success) !important;
    font-size: 14px !important;
    display: block !important;
    margin-top: 10px !important;
}

/* Hide the supernova canvas that overlaps content */
.supernova__wrapBox,
.supernova__wrap {
    display: none !important;
}

/* Ensure Send Transaction section is fully visible */
.content__full.air-b {
    margin-bottom: 40px !important;
    padding-bottom: 20px !important;
    position: relative !important;
    z-index: 10 !important;
    overflow: visible !important;
}

/* ============================================
   BLOCKS LIST PAGE - Enterprise Level Design
   ============================================ */

/* NEW Date Navigation Component */
.date-nav {
    display: flex !important;
    justify-content: center !important;
    align-items: center !important;
    gap: 15px !important;
    margin-bottom: 20px !important;
    padding: 20px !important;
    background: var(--bg-card) !important;
    border: 1px solid var(--border) !important;
    border-radius: 12px !important;
}

.date-nav__btn {
    display: inline-flex !important;
    align-items: center !important;
    gap: 8px !important;
    padding: 12px 20px !important;
    background: var(--bg-dark) !important;
    border: 1px solid var(--border) !important;
    border-radius: 8px !important;
    color: var(--text) !important;
    font-size: 14px !important;
    font-weight: 500 !important;
    transition: all 0.2s ease !important;
    text-decoration: none !important;
}

.date-nav__btn:hover {
    background: var(--gold) !important;
    color: #000 !important;
    border-color: var(--gold) !important;
}

.date-nav__btn .icon-arrow-left,
.date-nav__btn .icon-arrow-right2 {
    font-size: 12px !important;
}

.date-nav__current {
    display: flex !important;
    align-items: center !important;
    gap: 12px !important;
    padding: 10px 20px !important;
    background: rgba(212, 175, 55, 0.1) !important;
    border: 1px solid var(--gold) !important;
    border-radius: 8px !important;
}

.date-nav__calendar {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 44px !important;
    height: 44px !important;
    background: var(--gold) !important;
    color: #000 !important;
    border-radius: 8px !important;
    font-size: 20px !important;
    cursor: pointer !important;
    transition: all 0.2s ease !important;
}

.date-nav__calendar:hover {
    background: var(--gold-light) !important;
    transform: scale(1.05) !important;
}

.date-nav__picker {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
}

.date-nav__input {
    background: transparent !important;
    border: none !important;
    color: var(--gold) !important;
    font-size: 16px !important;
    font-weight: 600 !important;
    text-align: center !important;
    width: 140px !important;
    cursor: pointer !important;
}

.date-nav__label {
    color: var(--text-dim) !important;
    font-size: 12px !important;
    margin-top: 2px !important;
}

/* Hide old date navigation */
.date__wrap {
    display: none !important;
}

/* Old date styles hidden - using new date-nav */
.date__wrap .pull-right,
.date__btn,
.date__textWrap,
.date__trigger,
.date__text,
.date__textField {
    display: none !important;
}

/* Datepicker popup styling */
.datepicker-popup,
.uib-datepicker-popup {
    background: var(--bg-card) !important;
    border: 1px solid var(--border) !important;
    border-radius: 8px !important;
    padding: 10px !important;
}

.datepicker,
.uib-datepicker {
    background: var(--bg-card) !important;
}

.datepicker table,
.uib-datepicker table {
    background: var(--bg-card) !important;
}

.datepicker th,
.datepicker td,
.uib-datepicker th,
.uib-datepicker td {
    color: var(--text) !important;
    background: transparent !important;
}

.datepicker .btn,
.uib-datepicker .btn {
    background: var(--bg-dark) !important;
    color: var(--text) !important;
    border: 1px solid var(--border) !important;
}

.datepicker .btn:hover,
.uib-datepicker .btn:hover {
    background: var(--gold) !important;
    color: #000 !important;
}

.datepicker .btn.active,
.uib-datepicker .btn.active {
    background: var(--gold) !important;
    color: #000 !important;
}

/* ============================================
   GENERIC TABLE OVERRIDES - Fix base styles
   ============================================ */
.table {
    width: 100% !important;
    background: transparent !important;
    display: block !important;
}

.tr {
    display: flex !important;
    flex-wrap: nowrap !important;
    align-items: center !important;
    padding: 12px 20px !important;
    overflow: visible !important;
    background: transparent !important;
    border-bottom: 1px solid var(--border) !important;
}

.tr:hover {
    background: var(--bg-hover) !important;
}

.tr-head {
    border-bottom: 2px solid var(--gold) !important;
    margin-bottom: 0 !important;
    background: linear-gradient(135deg, rgba(212, 175, 55, 0.15) 0%, rgba(212, 175, 55, 0.05) 100%) !important;
}

.tr-head:hover {
    background: linear-gradient(135deg, rgba(212, 175, 55, 0.15) 0%, rgba(212, 175, 55, 0.05) 100%) !important;
}

.td,
.th {
    float: none !important;
    display: block !important;
    color: var(--text) !important;
    flex-shrink: 0 !important;
}

.th {
    font-size: 11px !important;
    text-transform: uppercase !important;
    letter-spacing: 1px !important;
    color: var(--gold) !important;
    font-weight: 600 !important;
}

.td {
    font-size: 14px !important;
    color: var(--text) !important;
}

/* Blocks Table - 5 columns: Height, Timestamp, Txns, Mined By, Size */
.section-blocks {
    background: var(--bg-card) !important;
    border: 1px solid var(--border) !important;
    border-radius: 12px !important;
    overflow: hidden !important;
    width: 100% !important;
}

.section-blocks .table {
    width: 100% !important;
    display: block !important;
}

.section-blocks .tr {
    display: flex !important;
    flex-wrap: nowrap !important;
    align-items: center !important;
    padding: 14px 20px !important;
    border-bottom: 1px solid var(--border) !important;
    width: 100% !important;
    box-sizing: border-box !important;
}

.section-blocks .tr:last-child {
    border-bottom: none !important;
}

.section-blocks .tr:not(.tr-head):hover {
    background: var(--bg-hover) !important;
}

.section-blocks .tr-head {
    background: linear-gradient(135deg, rgba(212, 175, 55, 0.15) 0%, rgba(212, 175, 55, 0.05) 100%) !important;
    border-bottom: 2px solid var(--gold) !important;
}

/* Column widths for blocks table */
.section-blocks .th,
.section-blocks .td {
    padding: 0 15px !important;
}

.section-blocks .th:nth-child(1),
.section-blocks .td:nth-child(1) {
    width: 100px !important;
    min-width: 100px !important;
}

.section-blocks .th:nth-child(2),
.section-blocks .td:nth-child(2) {
    flex: 1 !important;
    min-width: 200px !important;
}

.section-blocks .th:nth-child(3),
.section-blocks .td:nth-child(3) {
    width: 120px !important;
    min-width: 120px !important;
    text-align: right !important;
    padding-right: 40px !important;
}

.section-blocks .th:nth-child(4),
.section-blocks .td:nth-child(4) {
    flex: 1 !important;
    min-width: 150px !important;
    padding-left: 40px !important;
}

.section-blocks .th:nth-child(5),
.section-blocks .td:nth-child(5) {
    width: 80px !important;
    min-width: 80px !important;
    text-align: right !important;
}

.section-blocks .th {
    font-size: 11px !important;
    font-weight: 600 !important;
    text-transform: uppercase !important;
    letter-spacing: 1px !important;
    color: var(--gold) !important;
}

.section-blocks .td {
    font-size: 14px !important;
    color: var(--text) !important;
}

.section-blocks .td .mark,
.section-blocks .td .link {
    color: var(--gold) !important;
    background: transparent !important;
    padding: 0 !important;
    font-weight: 500 !important;
}

.section-blocks .td .mark:hover,
.section-blocks .td .link:hover {
    color: var(--gold-light) !important;
    text-decoration: underline !important;
}

.section-blocks .text_r {
    text-align: right !important;
}

/* Block Height Badge */
.section-blocks .td:first-child .mark {
    display: inline-block !important;
    background: linear-gradient(135deg, var(--gold) 0%, #B8960C 100%) !important;
    color: #000 !important;
    padding: 4px 10px !important;
    border-radius: 4px !important;
    font-weight: 600 !important;
    font-size: 13px !important;
}

.section-blocks .td:first-child .mark:hover {
    background: linear-gradient(135deg, var(--gold-light) 0%, var(--gold) 100%) !important;
    text-decoration: none !important;
}

/* Mined By Address */
.section-blocks .td:nth-child(4) .mark {
    font-family: 'Monaco', 'Menlo', monospace !important;
    font-size: 12px !important;
    background: rgba(212, 175, 55, 0.1) !important;
    padding: 4px 8px !important;
    border-radius: 4px !important;
    max-width: 200px !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
    display: inline-block !important;
}

/* Pagination Buttons - OLD - Hidden */
.btn-blocksWrap {
    display: none !important;
}

/* NEW Pagination Component */
.blocks-pagination {
    display: flex !important;
    justify-content: center !important;
    align-items: center !important;
    gap: 12px !important;
    margin: 25px auto 0 auto !important;
    padding: 20px 30px !important;
    background: var(--bg-card) !important;
    border: 1px solid var(--border) !important;
    border-radius: 12px !important;
    width: fit-content !important;
    max-width: 100% !important;
}

.blocks-pagination__btn {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 6px !important;
    padding: 10px 18px !important;
    background: var(--bg-dark) !important;
    border: 1px solid var(--border) !important;
    border-radius: 6px !important;
    color: var(--text) !important;
    font-size: 13px !important;
    font-weight: 500 !important;
    cursor: pointer !important;
    transition: all 0.2s ease !important;
    text-decoration: none !important;
}

.blocks-pagination__btn--icon {
    padding: 10px 14px !important;
    font-size: 18px !important;
    font-weight: 700 !important;
    min-width: 44px !important;
}

.blocks-pagination__btn:hover:not(.disabled) {
    background: var(--gold) !important;
    color: #000 !important;
    border-color: var(--gold) !important;
}

.blocks-pagination__btn.disabled {
    opacity: 0.4 !important;
    cursor: not-allowed !important;
    pointer-events: none !important;
}

.blocks-pagination__info {
    color: var(--text) !important;
    font-size: 14px !important;
    padding: 0 20px !important;
}

.blocks-pagination__info strong {
    color: var(--gold) !important;
    font-weight: 600 !important;
}

.blocks-pagination__total {
    color: var(--text-dim) !important;
    font-size: 12px !important;
    margin-left: 8px !important;
}

/* ============================================
   TRANSACTION PAGINATION
   ============================================ */
.tx-pagination {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 8px !important;
    padding: 20px !important;
    background: var(--bg-card) !important;
    border-top: 1px solid var(--border) !important;
    flex-wrap: wrap !important;
}

.tx-pagination__btn {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    padding: 8px 16px !important;
    background: var(--bg-dark) !important;
    border: 1px solid var(--border) !important;
    border-radius: 6px !important;
    color: var(--text) !important;
    font-size: 13px !important;
    font-weight: 500 !important;
    cursor: pointer !important;
    transition: all 0.2s ease !important;
    text-decoration: none !important;
}

.tx-pagination__btn--icon {
    padding: 8px 12px !important;
    font-weight: 700 !important;
}

.tx-pagination__btn:hover:not(.disabled) {
    background: var(--gold) !important;
    color: #000 !important;
    border-color: var(--gold) !important;
}

.tx-pagination__btn.disabled {
    opacity: 0.4 !important;
    cursor: not-allowed !important;
    pointer-events: none !important;
}

.tx-pagination__info {
    color: var(--text) !important;
    font-size: 14px !important;
    padding: 0 20px !important;
}

.tx-pagination__info strong {
    color: var(--gold) !important;
    font-weight: 600 !important;
}

.tx-pagination__total {
    color: var(--text-dim) !important;
    font-size: 12px !important;
    margin-left: 8px !important;
}

@media (max-width: 768px) {
    .tx-pagination {
        gap: 6px !important;
        padding: 16px 12px !important;
    }

    .tx-pagination__btn {
        padding: 6px 10px !important;
        font-size: 12px !important;
    }

    .tx-pagination__info {
        width: 100% !important;
        text-align: center !important;
        order: -1 !important;
        margin-bottom: 10px !important;
        padding: 0 !important;
    }

    .tx-pagination__total {
        display: block !important;
        margin-left: 0 !important;
        margin-top: 4px !important;
    }
}

/* Alert Messages */
.section-blocks+.alert,
.alert-danger {
    background: rgba(244, 67, 54, 0.1) !important;
    border: 1px solid var(--error) !important;
    border-radius: 8px !important;
    color: var(--error) !important;
    padding: 15px 20px !important;
    margin-top: 20px !important;
    text-align: center !important;
}

/* Preloader in blocks */
.section-blocks .preload__box {
    padding: 40px !important;
    text-align: center !important;
    grid-column: 1 / -1 !important;
}

/* ============================================
   STATUS PAGE STYLES
   ============================================ */

/* Status Hero */
.status-hero {
    display: flex !important;
    align-items: center !important;
    gap: 20px !important;
    background: linear-gradient(135deg, var(--bg-card) 0%, rgba(212, 175, 55, 0.08) 100%) !important;
    border: 1px solid var(--border) !important;
    border-radius: 16px !important;
    padding: 28px 32px !important;
    margin-bottom: 24px !important;
}

.status-hero__icon {
    width: 56px !important;
    height: 56px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    background: linear-gradient(135deg, var(--gold), #c9a430) !important;
    border-radius: 14px !important;
    flex-shrink: 0 !important;
}

.status-hero__icon svg {
    width: 28px !important;
    height: 28px !important;
    color: #000 !important;
}

.status-hero__info {
    flex: 1 !important;
}

.status-hero__title {
    color: var(--text) !important;
    font-size: 26px !important;
    font-weight: 700 !important;
    margin: 0 0 4px 0 !important;
}

.status-hero__subtitle {
    color: var(--text-dim) !important;
    font-size: 14px !important;
    margin: 0 !important;
}

@media (max-width: 768px) {
    .status-hero {
        padding: 20px !important;
    }

    .status-hero__title {
        font-size: 20px !important;
    }
}

/* Status Grid */
.status-grid {
    display: grid !important;
    grid-template-columns: repeat(2, 1fr) !important;
    gap: 20px !important;
}

@media (max-width: 992px) {
    .status-grid {
        grid-template-columns: 1fr !important;
    }
}

/* Status Card */
.status-card {
    background: var(--bg-card) !important;
    border: 1px solid var(--border) !important;
    border-radius: 12px !important;
    overflow: hidden !important;
}

.status-card--wide {
    grid-column: 1 / -1 !important;
}

.status-card__header {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    padding: 16px 20px !important;
    background: linear-gradient(135deg, rgba(212, 175, 55, 0.08) 0%, rgba(212, 175, 55, 0.03) 100%) !important;
    border-bottom: 1px solid var(--border) !important;
}

.status-card__title {
    display: flex !important;
    align-items: center !important;
    gap: 10px !important;
    color: var(--gold) !important;
    font-size: 16px !important;
    font-weight: 600 !important;
    margin: 0 !important;
}

.status-card__icon {
    font-size: 18px !important;
}

.status-card__body {
    padding: 20px !important;
}

/* Status Badge */
.status-badge {
    display: inline-flex !important;
    align-items: center !important;
    padding: 5px 12px !important;
    border-radius: 20px !important;
    font-size: 12px !important;
    font-weight: 600 !important;
    text-transform: uppercase !important;
    letter-spacing: 0.5px !important;
}

.status-badge--success {
    background: rgba(76, 175, 80, 0.15) !important;
    color: #4CAF50 !important;
}

.status-badge--warning {
    background: rgba(255, 152, 0, 0.15) !important;
    color: #FF9800 !important;
}

/* Sync Progress */
.sync-progress {
    margin-bottom: 24px !important;
}

.sync-progress__bar {
    height: 12px !important;
    background: var(--bg-dark) !important;
    border-radius: 6px !important;
    overflow: hidden !important;
    margin-bottom: 8px !important;
}

.sync-progress__fill {
    height: 100% !important;
    background: linear-gradient(90deg, var(--gold), #e8c340) !important;
    border-radius: 6px !important;
    transition: width 0.5s ease !important;
}

.sync-progress__text {
    color: var(--text-dim) !important;
    font-size: 13px !important;
    text-align: right !important;
}

/* Status Stats */
.status-stats {
    display: grid !important;
    grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)) !important;
    gap: 16px !important;
}

.status-stats--compact {
    gap: 12px !important;
}

.status-stat {
    display: flex !important;
    flex-direction: column !important;
    gap: 6px !important;
    padding: 14px 16px !important;
    background: var(--bg-dark) !important;
    border: 1px solid var(--border) !important;
    border-radius: 8px !important;
}

.status-stat__label {
    color: var(--text-dim) !important;
    font-size: 11px !important;
    text-transform: uppercase !important;
    letter-spacing: 0.8px !important;
    font-weight: 500 !important;
}

.status-stat__value {
    color: var(--text) !important;
    font-size: 15px !important;
    font-weight: 600 !important;
    word-break: break-all !important;
}

.status-stat__value--highlight {
    color: var(--gold) !important;
}

.status-stat__value--error {
    color: var(--error) !important;
}

/* Status Hash List */
.status-hash-list {
    display: flex !important;
    flex-direction: column !important;
    gap: 16px !important;
}

.status-hash {
    display: flex !important;
    flex-direction: column !important;
    gap: 8px !important;
    padding: 14px 16px !important;
    background: var(--bg-dark) !important;
    border: 1px solid var(--border) !important;
    border-radius: 8px !important;
}

.status-hash__label {
    color: var(--text-dim) !important;
    font-size: 11px !important;
    text-transform: uppercase !important;
    letter-spacing: 0.8px !important;
    font-weight: 500 !important;
}

.status-hash__value {
    font-family: 'SF Mono', 'Monaco', 'Inconsolata', 'Roboto Mono', monospace !important;
    font-size: 12px !important;
    color: var(--gold) !important;
    word-break: break-all !important;
    text-decoration: none !important;
    transition: color 0.2s ease !important;
}

.status-hash__value:hover {
    color: var(--gold-light) !important;
    text-decoration: underline !important;
}

/* ============================================
   BLOCK DETAIL PAGE STYLES
   ============================================ */

/* Block Hero Section */
.block-hero {
    background: var(--bg-card) !important;
    border: 1px solid var(--border) !important;
    border-radius: 12px !important;
    padding: 24px !important;
    margin-bottom: 16px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    flex-wrap: wrap !important;
    gap: 20px !important;
}

.block-hero__info {
    display: flex !important;
    flex-direction: column !important;
    gap: 4px !important;
}

.block-hero__label {
    color: var(--text-dim) !important;
    font-size: 11px !important;
    text-transform: uppercase !important;
    letter-spacing: 1.5px !important;
    font-weight: 500 !important;
}

.block-hero__number {
    font-size: 32px !important;
    font-weight: 700 !important;
    color: var(--text) !important;
    letter-spacing: -0.5px !important;
}

.block-hero__meta {
    display: flex !important;
    gap: 24px !important;
    flex-wrap: wrap !important;
}

.block-hero__stat {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    gap: 4px !important;
    padding: 12px 20px !important;
    background: var(--bg-dark) !important;
    border: 1px solid var(--border) !important;
    border-radius: 8px !important;
    min-width: 100px !important;
}

.block-hero__stat-label {
    color: var(--text-dim) !important;
    font-size: 11px !important;
    text-transform: uppercase !important;
    letter-spacing: 1px !important;
}

.block-hero__stat-value {
    font-size: 20px !important;
    font-weight: 700 !important;
    color: var(--text) !important;
}

.block-hero__stat-value--gold {
    color: var(--gold) !important;
}

@media (max-width: 768px) {
    .block-hero {
        flex-direction: column !important;
        align-items: flex-start !important;
    }

    .block-hero__number {
        font-size: 26px !important;
    }

    .block-hero__meta {
        width: 100% !important;
    }

    .block-hero__stat {
        flex: 1 !important;
        min-width: 80px !important;
    }
}

/* Block Hash Section */
.block-hash {
    background: var(--bg-card) !important;
    border: 1px solid var(--border) !important;
    border-radius: 10px !important;
    padding: 14px 18px !important;
    margin-bottom: 20px !important;
    display: flex !important;
    align-items: center !important;
    gap: 12px !important;
    flex-wrap: wrap !important;
}

.block-hash__label {
    color: var(--text-dim) !important;
    font-size: 11px !important;
    text-transform: uppercase !important;
    letter-spacing: 1px !important;
    font-weight: 500 !important;
    flex-shrink: 0 !important;
}

.block-hash__value {
    flex: 1 !important;
    display: flex !important;
    align-items: center !important;
    gap: 10px !important;
    background: var(--bg-dark) !important;
    border: 1px solid var(--border) !important;
    border-radius: 6px !important;
    padding: 8px 12px !important;
    min-width: 0 !important;
}

.block-hash__text {
    font-family: 'SF Mono', 'Monaco', 'Inconsolata', 'Roboto Mono', monospace !important;
    font-size: 13px !important;
    color: var(--text) !important;
    word-break: break-all !important;
    flex: 1 !important;
}

.block-hash__copy {
    flex-shrink: 0 !important;
    width: 32px !important;
    height: 32px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    background: linear-gradient(135deg, var(--gold), #c9a430) !important;
    color: #000 !important;
    border-radius: 6px !important;
    font-size: 14px !important;
    cursor: pointer !important;
    transition: all 0.2s ease !important;
    text-decoration: none !important;
}

.block-hash__copy:hover {
    background: linear-gradient(135deg, #e8c340, var(--gold)) !important;
    transform: scale(1.05) !important;
}

.block-hash__copy::before {
    font-family: 'icomoon' !important;
    content: '\\e906' !important;
}

/* Block Summary Section */
.section-summaryBlock {
    background: var(--bg-card) !important;
    border: 1px solid var(--border) !important;
    border-radius: 12px !important;
    overflow: hidden !important;
    margin-bottom: 20px !important;
}

.section-summaryBlock .section__heading {
    display: flex !important;
    align-items: center !important;
    gap: 12px !important;
    padding: 16px 20px !important;
    background: linear-gradient(135deg, rgba(212, 175, 55, 0.08) 0%, rgba(212, 175, 55, 0.03) 100%) !important;
    border-bottom: 1px solid var(--border) !important;
}

.section-summaryBlock .section__title {
    color: var(--gold) !important;
    font-size: 16px !important;
    font-weight: 600 !important;
    margin: 0 !important;
}

.section-summaryBlock .section__status {
    display: flex !important;
    align-items: center !important;
    gap: 6px !important;
    color: #4CAF50 !important;
    font-size: 12px !important;
    font-weight: 500 !important;
    background: rgba(76, 175, 80, 0.12) !important;
    padding: 4px 10px !important;
    border-radius: 20px !important;
}

.section-summaryBlock .section__status--warning {
    color: #FF9800 !important;
    background: rgba(255, 152, 0, 0.12) !important;
}

.status-dot {
    width: 6px !important;
    height: 6px !important;
    border-radius: 50% !important;
}

.status-dot--success {
    background: #4CAF50 !important;
}

.status-dot--warning {
    background: #FF9800 !important;
}

/* Block Details Grid */
.block-details-grid {
    display: grid !important;
    grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)) !important;
    gap: 0 !important;
    list-style: none !important;
    padding: 0 !important;
    margin: 0 !important;
}

.block-details__item {
    padding: 16px 20px !important;
    border-bottom: 1px solid var(--border) !important;
    border-right: 1px solid var(--border) !important;
    display: flex !important;
    flex-direction: column !important;
    gap: 6px !important;
}

.block-details__item:nth-child(even) {
    border-right: none !important;
}

.block-details__item--full {
    grid-column: 1 / -1 !important;
    border-right: none !important;
}

@media (max-width: 768px) {
    .block-details-grid {
        grid-template-columns: 1fr !important;
    }

    .block-details__item {
        border-right: none !important;
    }
}

.block-details__label {
    color: var(--text-dim) !important;
    font-size: 11px !important;
    text-transform: uppercase !important;
    letter-spacing: 0.8px !important;
    font-weight: 500 !important;
}

.block-details__value {
    color: var(--text) !important;
    font-size: 14px !important;
    font-weight: 500 !important;
}

.block-details__value--mono {
    font-family: 'SF Mono', 'Monaco', 'Inconsolata', 'Roboto Mono', monospace !important;
    font-size: 13px !important;
}

.block-details__value--hash {
    display: flex !important;
    align-items: center !important;
    gap: 12px !important;
    font-family: 'SF Mono', 'Monaco', 'Inconsolata', 'Roboto Mono', monospace !important;
    font-size: 12px !important;
    word-break: break-all !important;
}

.block-details__value--hash span {
    flex: 1 !important;
}

.block-details__copy {
    flex-shrink: 0 !important;
    width: 28px !important;
    height: 28px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    background: var(--bg-dark) !important;
    border: 1px solid var(--border) !important;
    color: var(--gold) !important;
    border-radius: 4px !important;
    font-size: 0 !important;
    cursor: pointer !important;
    transition: all 0.2s ease !important;
    text-decoration: none !important;
    overflow: hidden !important;
}

.block-details__copy:hover {
    background: var(--gold) !important;
    color: #000 !important;
    border-color: var(--gold) !important;
}

.block-details__copy::before {
    font-family: 'icomoon' !important;
    content: '\\e906' !important;
    font-size: 12px !important;
}

.block-details__link {
    color: var(--gold) !important;
    text-decoration: none !important;
    font-weight: 500 !important;
    transition: all 0.2s ease !important;
}

.block-details__link:hover {
    color: var(--gold-light) !important;
    text-decoration: underline !important;
}

/* Block Transactions Section */
.section-transactionsBlock {
    background: var(--bg-card) !important;
    border: 1px solid var(--border) !important;
    border-radius: 12px !important;
    overflow: hidden !important;
}

.section-transactionsBlock .section__heading {
    display: flex !important;
    align-items: center !important;
    gap: 10px !important;
    padding: 16px 20px !important;
    background: linear-gradient(135deg, rgba(212, 175, 55, 0.08) 0%, rgba(212, 175, 55, 0.03) 100%) !important;
    border-bottom: 1px solid var(--border) !important;
}

.section-transactionsBlock .section__title {
    color: var(--gold) !important;
    font-size: 16px !important;
    font-weight: 600 !important;
    margin: 0 !important;
}

/* ============================================
   ADDRESS PAGE STYLES
   ============================================ */

/* Address Header */
.heading .ov {
    display: flex !important;
    justify-content: space-between !important;
    align-items: center !important;
    flex-wrap: wrap !important;
    gap: 15px !important;
    overflow: visible !important;
}

.heading .pull-left,
.heading .pull-right {
    float: none !important;
}

.heading__address {
    background: linear-gradient(135deg, #C89116 0%, var(--gold) 100%) !important;
    color: #000 !important;
    padding: 10px 20px !important;
    border-radius: 8px !important;
    font-size: 18px !important;
    font-weight: 700 !important;
}

.heading__sm {
    margin-top: 15px !important;
    width: 100% !important;
}

.heading__smLabeled {
    background: var(--bg-card) !important;
    border: 1px solid var(--border) !important;
    border-radius: 8px !important;
    padding: 12px 16px !important;
    width: 100% !important;
}

.heading__smLabeled .copyParent {
    width: 100% !important;
}

.copyText {
    color: var(--text) !important;
    font-family: 'SF Mono', 'Monaco', 'Inconsolata', 'Roboto Mono', monospace !important;
    font-size: 14px !important;
    word-break: break-all !important;
}

/* ============================================
   ADDRESS HERO SECTION - Clean Professional Design
   ============================================ */
.address-hero {
    background: var(--bg-card) !important;
    border: 1px solid var(--border) !important;
    border-radius: 12px !important;
    padding: 20px 24px !important;
    margin-bottom: 20px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    flex-wrap: wrap !important;
    gap: 16px !important;
}

.address-hero__info {
    display: flex !important;
    flex-direction: column !important;
    gap: 2px !important;
}

.address-hero__label {
    color: var(--text-dim) !important;
    font-size: 11px !important;
    text-transform: uppercase !important;
    letter-spacing: 1.5px !important;
    margin-bottom: 0 !important;
    font-weight: 500 !important;
}

.address-hero__balance {
    font-size: 28px !important;
    font-weight: 700 !important;
    color: var(--gold) !important;
    margin-bottom: 0 !important;
    letter-spacing: -0.5px !important;
    line-height: 1.2 !important;
}

@media (max-width: 768px) {
    .address-hero {
        flex-direction: column !important;
        align-items: flex-start !important;
        padding: 16px !important;
    }

    .address-hero__balance {
        font-size: 24px !important;
    }

    .address-hero__address {
        width: 100% !important;
    }
}

.address-hero__address {
    display: flex !important;
    align-items: center !important;
    gap: 10px !important;
    background: var(--bg-dark) !important;
    border: 1px solid var(--border) !important;
    border-radius: 8px !important;
    padding: 10px 14px !important;
    max-width: 100% !important;
}

.address-hero__hash {
    font-family: 'SF Mono', 'Monaco', 'Inconsolata', 'Roboto Mono', monospace !important;
    font-size: 14px !important;
    color: var(--text) !important;
    word-break: break-all !important;
    letter-spacing: 0.5px !important;
}

@media (max-width: 768px) {
    .address-hero__hash {
        font-size: 12px !important;
    }
}

.address-hero__copy {
    flex-shrink: 0 !important;
    width: 36px !important;
    height: 36px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    background: linear-gradient(135deg, var(--gold), #c9a430) !important;
    color: #000 !important;
    border-radius: 8px !important;
    font-size: 16px !important;
    cursor: pointer !important;
    transition: all 0.2s ease !important;
    text-decoration: none !important;
}

.address-hero__copy:hover {
    background: linear-gradient(135deg, #e8c340, var(--gold)) !important;
    transform: scale(1.05) !important;
    box-shadow: 0 4px 12px rgba(212, 175, 55, 0.4) !important;
}

.address-hero__copy::before {
    font-family: 'icomoon' !important;
    content: '\\e906' !important;
}

/* ============================================
   TRANSACTIONS SECTION - Address Page
   ============================================ */
.section-transactionsAddress {
    background: var(--bg-card) !important;
    border: 1px solid var(--border) !important;
    border-radius: 12px !important;
    margin-top: 20px !important;
    overflow: hidden !important;
}

.section-transactionsAddress .section__heading {
    display: flex !important;
    align-items: center !important;
    gap: 10px !important;
    padding: 16px 20px !important;
    background: linear-gradient(135deg, rgba(212, 175, 55, 0.08) 0%, rgba(212, 175, 55, 0.03) 100%) !important;
    border-bottom: 1px solid var(--border) !important;
}

.section-transactionsAddress .section__title {
    color: var(--gold) !important;
    font-size: 16px !important;
    font-weight: 600 !important;
    margin: 0 !important;
}

.section__count {
    color: var(--text-dim) !important;
    font-size: 13px !important;
    font-weight: 500 !important;
}

.section-transactionsAddress .section__transactions {
    padding: 0 !important;
}

/* ============================================
   SUMMARY SECTION - Enterprise Card Design
   ============================================ */
.section-summaryAddress {
    background: var(--bg-card) !important;
    border: 1px solid var(--border) !important;
    border-radius: 16px !important;
    padding: 0 !important;
    margin-top: 24px !important;
    width: 100% !important;
    max-width: 100% !important;
    overflow: hidden !important;
}

.section-summaryAddress .section__heading {
    display: flex !important;
    align-items: center !important;
    gap: 12px !important;
    padding: 20px 24px !important;
    margin-bottom: 0 !important;
    background: linear-gradient(135deg, rgba(212, 175, 55, 0.1) 0%, rgba(212, 175, 55, 0.05) 100%) !important;
    border-bottom: 1px solid var(--border) !important;
}

.section-summaryAddress .section__title {
    color: var(--gold) !important;
    font-size: 20px !important;
    font-weight: 700 !important;
    margin: 0 !important;
    letter-spacing: -0.3px !important;
}

.section-summaryAddress .section__status {
    color: #4CAF50 !important;
    font-size: 12px !important;
    font-weight: 600 !important;
    background: rgba(76, 175, 80, 0.15) !important;
    padding: 5px 12px !important;
    border-radius: 20px !important;
    text-transform: uppercase !important;
    letter-spacing: 0.5px !important;
}

.in_bl {
    display: inline-block !important;
}

/* Summary Address Layout - Grid of Stats */
.summaryAddress {
    display: grid !important;
    grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)) !important;
    gap: 0 !important;
    padding: 0 !important;
}

.summaryAddress .col {
    flex: none !important;
    width: 100% !important;
    min-width: auto !important;
    float: none !important;
}

.summaryAddress .col-5 {
    width: 100% !important;
    grid-column: 1 / -1 !important;
}

.summaryAddress .col:last-child {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    padding: 24px !important;
    background: rgba(212, 175, 55, 0.03) !important;
}

/* Summary List - Card Grid Style */
.section-summaryAddress .list {
    list-style: none !important;
    padding: 0 !important;
    margin: 0 !important;
    display: grid !important;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)) !important;
    gap: 0 !important;
}

.section-summaryAddress .list__item {
    display: flex !important;
    flex-direction: column !important;
    justify-content: center !important;
    align-items: flex-start !important;
    padding: 20px 24px !important;
    border-bottom: none !important;
    border-right: 1px solid var(--border) !important;
    background: transparent !important;
    border-radius: 0 !important;
    margin-bottom: 0 !important;
    min-height: 90px !important;
    transition: background 0.2s ease !important;
}

.section-summaryAddress .list__item:hover {
    background: rgba(212, 175, 55, 0.03) !important;
}

.section-summaryAddress .list__item:last-child {
    border-right: none !important;
}

/* On smaller screens, add bottom border instead */
@media (max-width: 768px) {
    .section-summaryAddress .list__item {
        border-right: none !important;
        border-bottom: 1px solid var(--border) !important;
    }

    .section-summaryAddress .list__item:last-child {
        border-bottom: none !important;
    }
}

.section-summaryAddress .list__left {
    color: var(--text-dim) !important;
    font-size: 12px !important;
    text-transform: uppercase !important;
    letter-spacing: 0.8px !important;
    margin-bottom: 8px !important;
    order: 1 !important;
}

.section-summaryAddress .list__left b {
    font-weight: 500 !important;
    color: var(--text-dim) !important;
}

.section-summaryAddress .list__right {
    color: var(--text) !important;
    font-size: 22px !important;
    font-weight: 700 !important;
    text-align: left !important;
    order: 2 !important;
    letter-spacing: -0.5px !important;
}

/* Highlight the balance value */
.section-summaryAddress .list__item:nth-child(3) .list__right {
    color: var(--gold) !important;
}

/* QR Toggle Button */
.qr-toggle-item {
    grid-column: span 2 !important;
}

@media (max-width: 768px) {
    .qr-toggle-item {
        grid-column: span 1 !important;
    }
}

.qr-toggle-btn {
    background: linear-gradient(135deg, var(--gold), #c9a430) !important;
    color: #000 !important;
    border: none !important;
    padding: 10px 20px !important;
    border-radius: 8px !important;
    font-size: 13px !important;
    font-weight: 600 !important;
    cursor: pointer !important;
    transition: all 0.3s ease !important;
    text-transform: uppercase !important;
    letter-spacing: 0.5px !important;
    box-shadow: 0 2px 8px rgba(212, 175, 55, 0.3) !important;
}

.qr-toggle-btn:hover {
    background: linear-gradient(135deg, #e8c340, var(--gold)) !important;
    box-shadow: 0 4px 15px rgba(212, 175, 55, 0.5) !important;
    transform: translateY(-1px) !important;
}

.qr-toggle-btn:active {
    transform: translateY(0) !important;
}

/* QR Code Container */
.qr-code-container {
    grid-column: span 2 !important;
    display: flex !important;
    justify-content: center !important;
    padding: 20px !important;
    background: rgba(255, 255, 255, 0.03) !important;
    border-radius: 12px !important;
    margin-top: 10px !important;
    animation: fadeIn 0.3s ease !important;
}

@keyframes fadeIn {
    from {
        opacity: 0;
        transform: translateY(-10px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}

@media (max-width: 768px) {
    .qr-code-container {
        grid-column: span 1 !important;
    }
}

/* QR Code */
.qr__link {
    display: block !important;
    background: #fff !important;
    padding: 16px !important;
    border-radius: 12px !important;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.3) !important;
    transition: transform 0.2s ease, box-shadow 0.2s ease !important;
}

.qr__link:hover {
    transform: scale(1.02) !important;
    box-shadow: 0 6px 25px rgba(0, 0, 0, 0.4) !important;
}

.qr__link qrcode,
.qr__link canvas,
.qr__link img {
    display: block !important;
}

/* Token Dropdown */
.dd {
    position: relative !important;
    cursor: pointer !important;
}

.dd .num {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    background: var(--gold) !important;
    color: #000 !important;
    font-size: 11px !important;
    font-weight: 700 !important;
    min-width: 22px !important;
    height: 22px !important;
    border-radius: 11px !important;
    padding: 0 7px !important;
    margin-right: 8px !important;
}

.ddTrigger {
    color: var(--gold) !important;
    font-size: 13px !important;
}

.ddMenu {
    display: none !important;
    position: absolute !important;
    top: 100% !important;
    right: 0 !important;
    margin-top: 8px !important;
    background: var(--bg-card) !important;
    border: 1px solid var(--border) !important;
    border-radius: 8px !important;
    min-width: 280px !important;
    max-height: 300px !important;
    overflow-y: auto !important;
    z-index: 100 !important;
    box-shadow: 0 8px 25px rgba(0, 0, 0, 0.3) !important;
}

.dd.open .ddMenu {
    display: block !important;
}

.ddMenu__list {
    list-style: none !important;
    padding: 8px !important;
    margin: 0 !important;
}

.ddMenu__item {
    margin-bottom: 4px !important;
}

.ddMenu__item:last-child {
    margin-bottom: 0 !important;
}

.ddMenu__link {
    display: block !important;
    padding: 10px 12px !important;
    border-radius: 6px !important;
    text-decoration: none !important;
    transition: background 0.2s ease !important;
}

.ddMenu__link:hover {
    background: var(--bg-hover) !important;
}

.ddMenu__linkRow {
    display: block !important;
}

.ddMenu__linkRow .left {
    color: var(--text) !important;
    font-size: 13px !important;
}

.ddMenu__linkRow.muted .left {
    color: var(--text-dim) !important;
    font-size: 12px !important;
}

/* Contract Items (Bytecode, ASM) */
.transactions__contractItem {
    background: var(--bg-card) !important;
    border: 1px solid var(--border) !important;
    border-radius: 12px !important;
    margin-top: 20px !important;
    overflow: hidden !important;
}

.transactions__contractItemTitle {
    background: var(--bg-dark) !important;
    color: var(--gold) !important;
    font-size: 14px !important;
    font-weight: 600 !important;
    padding: 12px 20px !important;
    border-bottom: 1px solid var(--border) !important;
}

.transactions__contractItemBody {
    padding: 16px 20px !important;
    max-height: 200px !important;
    overflow: auto !important;
}

.transactions__contractItemBody .list {
    font-family: 'SF Mono', 'Monaco', 'Inconsolata', 'Roboto Mono', monospace !important;
    font-size: 12px !important;
    color: var(--text-dim) !important;
    word-break: break-all !important;
    white-space: pre-wrap !important;
}

/* Storage Section */
.section-storage {
    background: var(--bg-card) !important;
    border: 1px solid var(--border) !important;
    border-radius: 12px !important;
    padding: 24px !important;
    margin-top: 20px !important;
}

.section-storage .section__heading {
    margin-bottom: 20px !important;
}

.section-storage .section__heading .ov {
    display: flex !important;
    align-items: center !important;
    gap: 10px !important;
}

.storage {
    background: var(--bg-dark) !important;
    border-radius: 8px !important;
    overflow: hidden !important;
}

.storage .table-smart-mode .tr-head .th {
    background: var(--bg-dark) !important;
    color: var(--gold) !important;
    font-size: 12px !important;
    font-weight: 600 !important;
    text-transform: uppercase !important;
    padding: 12px 16px !important;
    border-bottom: 1px solid var(--border) !important;
}

.storage .trMain {
    display: flex !important;
    padding: 12px 16px !important;
    border-bottom: 1px solid var(--border) !important;
}

.storage .trMain .td {
    flex: 1 !important;
    padding: 0 !important;
    border: none !important;
}

.storage__tdInFirst,
.storage__tdInLast {
    color: var(--text-dim) !important;
    font-size: 12px !important;
}

.storage__tdInCenter {
    display: flex !important;
    align-items: center !important;
    gap: 10px !important;
}

.storage__num {
    font-family: 'SF Mono', 'Monaco', monospace !important;
    font-size: 12px !important;
    color: var(--text) !important;
}

.storage__arrow {
    color: var(--gold) !important;
    font-size: 14px !important;
}

.storage__btnWrap {
    display: flex !important;
    gap: 10px !important;
    padding: 15px !important;
    justify-content: center !important;
}

.storage__btn {
    background: var(--bg-card) !important;
    border: 1px solid var(--border) !important;
    color: var(--gold) !important;
    padding: 8px 20px !important;
    border-radius: 6px !important;
    font-size: 13px !important;
    text-decoration: none !important;
    transition: all 0.2s ease !important;
}

.storage__btn:hover {
    background: var(--gold) !important;
    color: #000 !important;
}

.mark-bd {
    color: var(--gold) !important;
    text-decoration: none !important;
    border: 1px solid var(--border) !important;
    padding: 2px 8px !important;
    border-radius: 4px !important;
    font-size: 11px !important;
    text-transform: uppercase !important;
}

.mark-bd:hover {
    background: var(--gold) !important;
    color: #000 !important;
}

/* Transactions Section on Address Page */
.section-transactionsAddress {
    background: var(--bg-card) !important;
    border: 1px solid var(--border) !important;
    border-radius: 12px !important;
    padding: 24px !important;
    margin-top: 20px !important;
    width: 100% !important;
    max-width: 100% !important;
}

.section-transactionsAddress .section__heading {
    margin-bottom: 20px !important;
    padding-bottom: 15px !important;
    border-bottom: 1px solid var(--border) !important;
}

.section-transactionsAddress .section__title {
    color: var(--gold) !important;
    font-size: 18px !important;
    font-weight: 600 !important;
    margin: 0 !important;
}

/* Utility classes */
.w-a {
    width: auto !important;
}

.w-320 {
    width: 320px !important;
    max-width: 100% !important;
}

.upp {
    text-transform: uppercase !important;
}

.left {
    float: none !important;
}

.right {
    float: none !important;
    text-align: right !important;
}

.muted {
    opacity: 0.7 !important;
}

.attn {
    color: var(--gold) !important;
    cursor: help !important;
}

/* ============================================
   TRANSACTION LIST STYLES - Modern Design
   ============================================ */

/* Transaction Item Container */
.transactions__item {
    background: var(--bg-dark) !important;
    border: 1px solid var(--border) !important;
    border-radius: 12px !important;
    margin-bottom: 16px !important;
    overflow: hidden !important;
    transition: border-color 0.2s ease !important;
}

.transactions__item:hover {
    border-color: #444 !important;
}

.transactions__item.open {
    border-color: var(--gold) !important;
}

/* Transaction Header */
.transactions__head {
    display: flex !important;
    justify-content: space-between !important;
    align-items: center !important;
    padding: 16px 20px !important;
    background: var(--bg-card) !important;
    border-bottom: 1px solid var(--border) !important;
    flex-wrap: wrap !important;
    gap: 12px !important;
}

.transactions__headLeft {
    display: flex !important;
    align-items: center !important;
    gap: 12px !important;
    flex: 1 !important;
    min-width: 0 !important;
}

.transactions__headRight {
    flex-shrink: 0 !important;
}

.transactions__headRight .date {
    color: var(--text-dim) !important;
    font-size: 13px !important;
}

/* Expand/Collapse Button - Show with proper styling */
.transactions__moreBtn {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 32px !important;
    height: 32px !important;
    background: rgba(212, 175, 55, 0.1) !important;
    border: 1px solid rgba(212, 175, 55, 0.3) !important;
    border-radius: 6px !important;
    cursor: pointer !important;
    flex-shrink: 0 !important;
    transition: all 0.2s ease !important;
}

.transactions__moreBtn:hover {
    background: var(--gold) !important;
    border-color: var(--gold) !important;
}

.transactions__moreBtn:hover .icon-plus:before,
.transactions__moreBtn:hover .icon-minus:before {
    color: var(--bg-dark) !important;
}

.transactions__moreBtn .icon-plus {
    display: block !important;
}

.transactions__moreBtn .icon-minus {
    display: none !important;
}

/* When transaction is open/expanded */
.transactions__item.open .transactions__moreBtn .icon-plus {
    display: none !important;
}

.transactions__item.open .transactions__moreBtn .icon-minus {
    display: block !important;
}

/* Additional info - hidden by default, shown when expanded */
.transactions__addInfo {
    display: none !important;
    margin-top: 8px !important;
    padding: 10px 12px !important;
    background: var(--bg-dark) !important;
    border-radius: 6px !important;
    border: 1px solid var(--border) !important;
}

.transactions__item.open .transactions__addInfo {
    display: block !important;
}

/* Transaction ID in header */
.transactions__head .copyParent {
    display: flex !important;
    align-items: center !important;
    gap: 10px !important;
    min-width: 0 !important;
}

.transactions__head .copyText {
    font-family: 'SF Mono', 'Monaco', monospace !important;
    font-size: 13px !important;
    color: var(--gold) !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
    max-width: 400px !important;
}

.transactions__head .copyText.mark {
    text-decoration: none !important;
}

/* Transaction Body */
.transactions__body {
    padding: 16px 20px !important;
}

.transactions__bodySection {
    display: block !important;
}

.transactions__bodySection .col {
    display: block !important;
    margin-bottom: 12px !important;
}

.transactions__bodySection .col:last-child {
    margin-bottom: 0 !important;
}

/* Hide the confusing arrow circle */
.transactions__bodySection .arrow,
.transactions__bodySection .col .arrow {
    display: none !important;
}

/* Transaction Row */
.transactions__row {
    display: flex !important;
    justify-content: space-between !important;
    align-items: center !important;
    padding: 12px 16px !important;
    background: var(--bg-card) !important;
    border: 1px solid var(--border) !important;
    border-radius: 8px !important;
    margin-bottom: 8px !important;
    gap: 15px !important;
}

.transactions__row:last-child {
    margin-bottom: 0 !important;
}

/* Address/Name in transaction */
.transactions__row .name {
    display: block !important;
    min-width: 0 !important;
    flex: 1 !important;
}

.transactions__row .name__text {
    font-family: 'SF Mono', 'Monaco', monospace !important;
    font-size: 12px !important;
    color: var(--text) !important;
    word-break: break-all !important;
}

.transactions__row a.name .name__text,
.transactions__row .name.mark .name__text {
    color: var(--gold) !important;
}

/* Data/Value in transaction */
.transactions__row .data {
    flex-shrink: 0 !important;
    text-align: right !important;
    font-size: 13px !important;
    font-weight: 600 !important;
    color: var(--text) !important;
    white-space: nowrap !important;
}

.transactions__row .data.attn {
    color: var(--gold) !important;
}

.transactions__row .data .special {
    color: var(--text-dim) !important;
    font-weight: 400 !important;
    font-size: 11px !important;
    margin-left: 4px !important;
}

/* Additional Info - Always visible */
.transactions__addInfo .transactions__row {
    background: transparent !important;
    border: none !important;
    padding: 6px 0 !important;
    margin-bottom: 4px !important;
    border-radius: 0 !important;
    border-bottom: 1px solid var(--border) !important;
}

.transactions__addInfo .transactions__row:last-child {
    border-bottom: none !important;
}

.transactions__addInfo .label {
    color: var(--text-dim) !important;
    font-size: 12px !important;
    min-width: 100px !important;
}

.transactions__addInfo .label b {
    font-weight: 500 !important;
}

.transactions__addInfo .labeled {
    flex: 1 !important;
    font-size: 12px !important;
    color: var(--text) !important;
    word-break: break-all !important;
}

.transactions__addInfo .labeled .copyText {
    font-family: 'SF Mono', 'Monaco', monospace !important;
    font-size: 11px !important;
    word-break: break-all !important;
}

.op-60 {
    opacity: 0.6 !important;
}

/* Transaction Footer */
.transactions__item>.transactions__row {
    background: var(--bg-card) !important;
    border: none !important;
    border-top: 1px solid var(--border) !important;
    border-radius: 0 !important;
    padding: 12px 20px !important;
    margin: 0 !important;
}

.transactions__info {
    display: inline-block !important;
    font-size: 13px !important;
    color: var(--text) !important;
    margin-left: 15px !important;
}

.transactions__info:first-child {
    margin-left: 0 !important;
}

.transactions__info.transp {
    color: var(--text-dim) !important;
}

.transactions__info.error {
    color: var(--error) !important;
    background: rgba(244, 67, 54, 0.1) !important;
    padding: 4px 10px !important;
    border-radius: 4px !important;
}

/* Token Events Section */
.transactions__bodySection-title {
    background: linear-gradient(135deg, rgba(212, 175, 55, 0.1) 0%, rgba(200, 145, 22, 0.1) 100%) !important;
    border: 1px solid rgba(212, 175, 55, 0.3) !important;
    border-radius: 6px !important;
    padding: 8px 12px !important;
    margin-bottom: 12px !important;
}

.transactions__bodySection-title .text {
    color: var(--gold) !important;
    font-size: 13px !important;
}

.transactions__bodySection-title .special2 {
    color: var(--text-dim) !important;
    font-size: 11px !important;
    margin-left: 6px !important;
}

/* Limiter class - simple stacked layout */
.transactions__bodySection.limiter {
    display: block !important;
}

.transactions__bodySection.limiter>.col:first-child {
    padding-right: 0 !important;
    margin-bottom: 12px !important;
    padding-bottom: 12px !important;
    border-bottom: 1px dashed var(--border) !important;
}

.transactions__bodySection.limiter>.col:first-child .arrow {
    display: none !important;
}

.transactions__bodySection.limiter>.col:last-child {
    padding-left: 0 !important;
}

/* Contract Section */
.transactions__contract {
    margin-top: 16px !important;
    background: var(--bg-card) !important;
    border: 1px solid var(--border) !important;
    border-radius: 8px !important;
    overflow: hidden !important;
}

.transactions__contractTitle {
    background: var(--bg-dark) !important;
    color: var(--gold) !important;
    font-size: 14px !important;
    font-weight: 600 !important;
    padding: 12px 16px !important;
    border-bottom: 1px solid var(--border) !important;
}

.transactions__contractBody {
    padding: 16px !important;
}

/* Pull classes fix */
.transactions__item .pull-left,
.transactions__item .pull-right {
    float: none !important;
}

.transactions__item>.transactions__row .pull-left {
    flex: 1 !important;
}

.transactions__item>.transactions__row .pull-right {
    display: flex !important;
    align-items: center !important;
    gap: 15px !important;
}

/* Coinbase/Generated transactions */
.transactions__bodySection .col>div>.transactions__row:only-child .name__text {
    color: var(--success) !important;
    font-style: italic !important;
}

/* Error states */
.text-danger {
    color: var(--error) !important;
    font-size: 12px !important;
    margin-top: 4px !important;
}

.glyphicon-warning-sign::before {
    content: "⚠" !important;
    margin-right: 4px !important;
}

/* Section transactions on address page */
.section__transactions {
    max-height: none !important;
}

/* Responsive */
@media (max-width: 768px) {
    .transactions__head {
        flex-direction: column !important;
        align-items: flex-start !important;
    }

    .transactions__headLeft {
        width: 100% !important;
    }

    .transactions__head .copyText {
        max-width: 100% !important;
    }

    .transactions__row {
        flex-direction: column !important;
        align-items: flex-start !important;
        gap: 8px !important;
    }

    .transactions__row .data {
        text-align: left !important;
    }
}

/* ==========================================================================
   STATISTICS PAGE STYLES
   ========================================================================== */

/* Stats Hero Section */
.stats-hero {
    display: flex !important;
    align-items: center !important;
    gap: 20px !important;
    padding: 32px !important;
    background: linear-gradient(135deg, rgba(212, 175, 55, 0.1) 0%, rgba(18, 18, 18, 0.95) 100%) !important;
    border: 1px solid var(--border) !important;
    border-radius: 12px !important;
    margin-bottom: 24px !important;
}

.stats-hero__icon {
    width: 64px !important;
    height: 64px !important;
    background: linear-gradient(135deg, var(--gold) 0%, #b8962e 100%) !important;
    border-radius: 16px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    flex-shrink: 0 !important;
}

.stats-hero__icon svg {
    width: 32px !important;
    height: 32px !important;
    color: #000 !important;
    stroke: #000 !important;
}

.stats-hero__info {
    flex: 1 !important;
}

.stats-hero__title {
    font-size: 28px !important;
    font-weight: 700 !important;
    color: var(--text-primary) !important;
    margin: 0 0 4px 0 !important;
}

.stats-hero__subtitle {
    font-size: 14px !important;
    color: var(--text-secondary) !important;
    margin: 0 !important;
}

.stats-hero__price {
    display: flex !important;
    flex-direction: column !important;
    align-items: flex-end !important;
    padding: 16px 24px !important;
    background: rgba(212, 175, 55, 0.1) !important;
    border: 1px solid rgba(212, 175, 55, 0.3) !important;
    border-radius: 12px !important;
}

.stats-hero__price-label {
    font-size: 12px !important;
    color: var(--text-secondary) !important;
    text-transform: uppercase !important;
    letter-spacing: 0.5px !important;
    margin-bottom: 4px !important;
}

.stats-hero__price-value {
    font-size: 24px !important;
    font-weight: 700 !important;
    color: var(--gold) !important;
}

/* Stats Dashboard Grid */
.stats-dashboard {
    display: grid !important;
    grid-template-columns: repeat(2, 1fr) !important;
    gap: 20px !important;
}

/* Stats Card */
.stats-card {
    background: var(--bg-card) !important;
    border: 1px solid var(--border) !important;
    border-radius: 12px !important;
    overflow: hidden !important;
}

.stats-card--wide {
    grid-column: span 2 !important;
}

.stats-card__header {
    display: flex !important;
    align-items: center !important;
    gap: 12px !important;
    padding: 16px 20px !important;
    background: var(--bg-dark) !important;
    border-bottom: 1px solid var(--border) !important;
}

.stats-card__icon {
    width: 40px !important;
    height: 40px !important;
    border-radius: 10px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
}

.stats-card__icon svg {
    width: 20px !important;
    height: 20px !important;
}

.stats-card__icon--blocks {
    background: rgba(99, 102, 241, 0.15) !important;
}

.stats-card__icon--blocks svg {
    color: #818cf8 !important;
    stroke: #818cf8 !important;
}

.stats-card__icon--market {
    background: rgba(34, 197, 94, 0.15) !important;
}

.stats-card__icon--market svg {
    color: #4ade80 !important;
    stroke: #4ade80 !important;
}

.stats-card__icon--transactions {
    background: rgba(212, 175, 55, 0.15) !important;
}

.stats-card__icon--transactions svg {
    color: var(--gold) !important;
    stroke: var(--gold) !important;
}

.stats-card__icon--network {
    background: rgba(59, 130, 246, 0.15) !important;
}

.stats-card__icon--network svg {
    color: #60a5fa !important;
    stroke: #60a5fa !important;
}

.stats-card__title {
    font-size: 16px !important;
    font-weight: 600 !important;
    color: var(--text-primary) !important;
    margin: 0 !important;
}

.stats-card__body {
    padding: 20px !important;
}

/* Stats Metric (for simple list cards) */
.stats-metric {
    display: flex !important;
    flex-direction: column !important;
    gap: 0 !important;
}

.stats-metric__row {
    display: flex !important;
    justify-content: space-between !important;
    align-items: center !important;
    padding: 14px 0 !important;
    border-bottom: 1px solid var(--border) !important;
}

.stats-metric__row:last-child {
    border-bottom: none !important;
    padding-bottom: 0 !important;
}

.stats-metric__row:first-child {
    padding-top: 0 !important;
}

.stats-metric__label {
    font-size: 14px !important;
    color: var(--text-secondary) !important;
}

.stats-metric__value {
    font-size: 16px !important;
    font-weight: 600 !important;
    color: var(--text-primary) !important;
    font-family: 'SF Mono', 'Monaco', 'Inconsolata', 'Fira Mono', monospace !important;
}

.stats-metric__value--highlight {
    color: var(--text-primary) !important;
    font-size: 18px !important;
}

.stats-metric__value--gold {
    color: var(--gold) !important;
}

/* Stats Grid (for wide cards with multiple items) */
.stats-grid {
    display: grid !important;
    grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)) !important;
    gap: 20px !important;
}

/* Stats Item (individual metric in grid) */
.stats-item {
    background: var(--bg-dark) !important;
    border: 1px solid var(--border) !important;
    border-radius: 10px !important;
    padding: 16px !important;
}

.stats-item__header {
    display: flex !important;
    justify-content: space-between !important;
    align-items: flex-start !important;
    margin-bottom: 12px !important;
}

.stats-item__label {
    font-size: 13px !important;
    color: var(--text-secondary) !important;
    line-height: 1.3 !important;
}

.stats-item__chart-btn {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 28px !important;
    height: 28px !important;
    background: rgba(212, 175, 55, 0.1) !important;
    border: 1px solid rgba(212, 175, 55, 0.3) !important;
    border-radius: 6px !important;
    color: var(--gold) !important;
    text-decoration: none !important;
    flex-shrink: 0 !important;
}

.stats-item__chart-btn:hover {
    background: rgba(212, 175, 55, 0.2) !important;
    border-color: var(--gold) !important;
}

.stats-item__chart-btn svg {
    width: 14px !important;
    height: 14px !important;
}

.stats-item__value {
    font-size: 22px !important;
    font-weight: 700 !important;
    color: var(--text-primary) !important;
    font-family: 'SF Mono', 'Monaco', 'Inconsolata', 'Fira Mono', monospace !important;
    word-break: break-all !important;
}

.stats-item__value--highlight {
    color: var(--gold) !important;
}

.stats-item__value--gold {
    color: var(--gold) !important;
}

.stats-item__unit {
    font-size: 14px !important;
    font-weight: 500 !important;
    color: var(--text-secondary) !important;
    margin-left: 4px !important;
}

/* Stats Page Responsive */
@media (max-width: 992px) {
    .stats-dashboard {
        grid-template-columns: 1fr !important;
    }

    .stats-card--wide {
        grid-column: span 1 !important;
    }
}

@media (max-width: 768px) {
    .stats-hero {
        flex-direction: column !important;
        text-align: center !important;
        padding: 24px !important;
    }

    .stats-hero__info {
        order: 1 !important;
    }

    .stats-hero__price {
        align-items: center !important;
        width: 100% !important;
        order: 2 !important;
    }

    .stats-grid {
        grid-template-columns: 1fr !important;
    }

    .stats-item__value {
        font-size: 18px !important;
    }
}

/* ==========================================================================
   CHARTS PAGE STYLES
   ========================================================================== */

/* Charts Hero Section */
.charts-hero {
    display: flex !important;
    align-items: center !important;
    gap: 20px !important;
    padding: 32px !important;
    background: linear-gradient(135deg, rgba(212, 175, 55, 0.1) 0%, rgba(18, 18, 18, 0.95) 100%) !important;
    border: 1px solid var(--border) !important;
    border-radius: 12px !important;
    margin-bottom: 24px !important;
}

.charts-hero__icon {
    width: 64px !important;
    height: 64px !important;
    background: linear-gradient(135deg, var(--gold) 0%, #b8962e 100%) !important;
    border-radius: 16px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    flex-shrink: 0 !important;
}

.charts-hero__icon svg {
    width: 32px !important;
    height: 32px !important;
    color: #000 !important;
    stroke: #000 !important;
}

.charts-hero__info {
    flex: 1 !important;
}

.charts-hero__title {
    font-size: 28px !important;
    font-weight: 700 !important;
    color: var(--text-primary) !important;
    margin: 0 0 4px 0 !important;
}

.charts-hero__subtitle {
    font-size: 14px !important;
    color: var(--text-secondary) !important;
    margin: 0 !important;
    max-width: 600px !important;
}

/* Charts Card */
.charts-card {
    background: var(--bg-card) !important;
    border: 1px solid var(--border) !important;
    border-radius: 12px !important;
    margin-bottom: 24px !important;
    overflow: hidden !important;
}

.charts-card__header {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    padding: 16px 20px !important;
    background: var(--bg-dark) !important;
    border-bottom: 1px solid var(--border) !important;
    flex-wrap: wrap !important;
    gap: 12px !important;
}

.charts-card__title {
    font-size: 16px !important;
    font-weight: 600 !important;
    color: var(--text-primary) !important;
    margin: 0 !important;
    display: flex !important;
    align-items: center !important;
    gap: 10px !important;
}

.charts-card__icon {
    font-size: 20px !important;
}

.charts-card__body {
    padding: 20px !important;
}

.charts-card__body--table {
    padding: 0 !important;
}

/* Period Buttons */
.charts-period-buttons {
    display: flex !important;
    gap: 8px !important;
    flex-wrap: wrap !important;
}

.charts-period-btn {
    padding: 8px 16px !important;
    background: var(--bg-dark) !important;
    border: 1px solid var(--border) !important;
    border-radius: 6px !important;
    color: var(--text-secondary) !important;
    font-size: 13px !important;
    font-weight: 500 !important;
    text-decoration: none !important;
    cursor: pointer !important;
}

.charts-period-btn:hover {
    border-color: var(--gold) !important;
    color: var(--gold) !important;
}

.charts-period-btn--active,
.charts-period-btn.active {
    background: rgba(212, 175, 55, 0.15) !important;
    border-color: var(--gold) !important;
    color: var(--gold) !important;
}

/* Chart Canvas */
.charts-canvas-wrap {
    padding: 10px 0 !important;
    min-height: 300px !important;
}

.charts-canvas-wrap canvas {
    width: 100% !important;
}

/* Charts Table */
.charts-table-wrap {
    overflow-x: auto !important;
}

.charts-table {
    width: 100% !important;
    border-collapse: collapse !important;
    min-width: 700px !important;
}

.charts-table th,
.charts-table td {
    padding: 14px 16px !important;
    text-align: left !important;
    border-bottom: 1px solid var(--border) !important;
}

.charts-table th {
    background: var(--bg-dark) !important;
    color: var(--text-secondary) !important;
    font-size: 12px !important;
    font-weight: 600 !important;
    text-transform: uppercase !important;
    letter-spacing: 0.5px !important;
}

.charts-table td {
    color: var(--text-primary) !important;
    font-size: 14px !important;
}

.charts-table tbody tr:hover {
    background: rgba(212, 175, 55, 0.05) !important;
}

.charts-table tbody tr:last-child td {
    border-bottom: none !important;
}

.charts-table__balance {
    font-weight: 500 !important;
}

.charts-table__range {
    color: var(--text-primary) !important;
    font-family: 'SF Mono', 'Monaco', monospace !important;
}

.charts-table__count {
    font-weight: 600 !important;
    color: var(--gold) !important;
}

.charts-table__percent-wrap {
    display: flex !important;
    align-items: center !important;
    gap: 6px !important;
}

.charts-table__percent {
    font-weight: 500 !important;
}

.charts-table__percent--gold {
    color: var(--gold) !important;
}

.charts-table__percent-rel {
    color: var(--text-muted) !important;
    font-size: 12px !important;
}

.charts-table__coins {
    font-family: 'SF Mono', 'Monaco', monospace !important;
}

.charts-table__unit {
    color: var(--text-secondary) !important;
    font-size: 12px !important;
}

.charts-table__usd {
    color: var(--success) !important;
    font-weight: 500 !important;
}

.charts-table__empty {
    text-align: center !important;
    color: var(--text-muted) !important;
    padding: 40px 16px !important;
}

/* Richer Than Grid */
.charts-richer-grid {
    display: grid !important;
    grid-template-columns: repeat(auto-fit, minmax(140px, 1fr)) !important;
    gap: 16px !important;
}

.charts-richer-item {
    background: var(--bg-dark) !important;
    border: 1px solid var(--border) !important;
    border-radius: 10px !important;
    padding: 20px !important;
    text-align: center !important;
}

.charts-richer-item__amount {
    font-size: 14px !important;
    color: var(--text-secondary) !important;
    margin-bottom: 8px !important;
    font-weight: 500 !important;
}

.charts-richer-item__count {
    font-size: 28px !important;
    font-weight: 700 !important;
    color: var(--gold) !important;
    font-family: 'SF Mono', 'Monaco', monospace !important;
    line-height: 1.2 !important;
}

.charts-richer-item__label {
    font-size: 12px !important;
    color: var(--text-muted) !important;
    margin-top: 4px !important;
    text-transform: uppercase !important;
    letter-spacing: 0.5px !important;
}

.charts-richer-item__unit {
    font-size: 11px !important;
    color: var(--gold) !important;
    font-weight: 600 !important;
}

.charts-richer-item__supply {
    font-size: 11px !important;
    color: var(--text-muted) !important;
    margin-top: 6px !important;
    padding-top: 6px !important;
    border-top: 1px solid rgba(255, 255, 255, 0.05) !important;
}

/* Empty State */
.charts-empty {
    text-align: center !important;
    padding: 40px 20px !important;
    color: var(--text-muted) !important;
}

/* Charts Page Responsive */
@media (max-width: 768px) {
    .charts-hero {
        flex-direction: column !important;
        text-align: center !important;
        padding: 24px !important;
    }

    .charts-card__header {
        flex-direction: column !important;
        align-items: flex-start !important;
    }

    .charts-period-buttons {
        width: 100% !important;
    }

    .charts-period-btn {
        flex: 1 !important;
        text-align: center !important;
    }

    .charts-richer-grid {
        grid-template-columns: repeat(2, 1fr) !important;
    }

    .charts-richer-item__count {
        font-size: 22px !important;
    }
}

/* =====================================================
   TOKENS SEARCH PAGE STYLES
   ===================================================== */

/* Tokens Hero */
.tokens-hero {
    display: flex !important;
    align-items: center !important;
    gap: 20px !important;
    background: linear-gradient(135deg, rgba(212, 175, 55, 0.1) 0%, rgba(212, 175, 55, 0.02) 100%) !important;
    border: 1px solid rgba(212, 175, 55, 0.2) !important;
    border-radius: 16px !important;
    padding: 32px !important;
    margin-bottom: 24px !important;
}

.tokens-hero__icon {
    width: 64px !important;
    height: 64px !important;
    background: linear-gradient(135deg, var(--gold) 0%, #b8962d 100%) !important;
    border-radius: 16px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    flex-shrink: 0 !important;
}

.tokens-hero__icon svg {
    width: 32px !important;
    height: 32px !important;
    color: #121212 !important;
}

.tokens-hero__info {
    flex: 1 !important;
}

.tokens-hero__title {
    font-size: 28px !important;
    font-weight: 700 !important;
    color: var(--text-primary) !important;
    margin: 0 0 8px 0 !important;
}

.tokens-hero__subtitle {
    font-size: 14px !important;
    color: var(--text-secondary) !important;
    margin: 0 !important;
}

.tokens-hero__stats {
    display: flex !important;
    gap: 24px !important;
}

.tokens-hero__stat {
    text-align: center !important;
    padding: 12px 20px !important;
    background: rgba(255, 255, 255, 0.03) !important;
    border-radius: 12px !important;
    border: 1px solid rgba(255, 255, 255, 0.05) !important;
}

.tokens-hero__stat-value {
    display: block !important;
    font-size: 24px !important;
    font-weight: 700 !important;
    color: var(--gold) !important;
    font-family: 'SF Mono', 'Monaco', monospace !important;
}

.tokens-hero__stat-label {
    display: block !important;
    font-size: 11px !important;
    color: var(--text-muted) !important;
    text-transform: uppercase !important;
    letter-spacing: 0.5px !important;
    margin-top: 4px !important;
}

/* Tokens Search Card */
.tokens-search-card {
    background: var(--surface) !important;
    border: 1px solid var(--border) !important;
    border-radius: 16px !important;
    overflow: hidden !important;
    margin-bottom: 24px !important;
}

.tokens-search-card__header {
    padding: 20px 24px !important;
    border-bottom: 1px solid var(--border) !important;
    background: rgba(255, 255, 255, 0.02) !important;
}

.tokens-search-card__title {
    font-size: 18px !important;
    font-weight: 600 !important;
    color: var(--text-primary) !important;
    margin: 0 !important;
    display: flex !important;
    align-items: center !important;
    gap: 10px !important;
}

.tokens-search-card__icon {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
}

.tokens-search-card__icon svg {
    width: 20px !important;
    height: 20px !important;
    color: var(--gold) !important;
}

.tokens-search-card__body {
    padding: 24px !important;
}

/* Search Input */
.tokens-search-input-wrap {
    margin-bottom: 20px !important;
    position: relative !important;
}

.tokens-search-input-container {
    position: relative !important;
    display: flex !important;
    align-items: center !important;
}

.tokens-search-input-icon {
    position: absolute !important;
    left: 16px !important;
    width: 20px !important;
    height: 20px !important;
    color: var(--text-muted) !important;
    pointer-events: none !important;
}

.tokens-search-input {
    width: 100% !important;
    padding: 16px 48px 16px 48px !important;
    font-size: 15px !important;
    color: var(--text-primary) !important;
    background: rgba(255, 255, 255, 0.03) !important;
    border: 1px solid var(--border) !important;
    border-radius: 12px !important;
    outline: none !important;
    font-family: inherit !important;
}

.tokens-search-input::placeholder {
    color: var(--text-muted) !important;
}

.tokens-search-input:focus {
    border-color: var(--gold) !important;
    background: rgba(212, 175, 55, 0.05) !important;
}

.tokens-search-input--error {
    border-color: #e74c3c !important;
}

.tokens-search-clear {
    position: absolute !important;
    right: 12px !important;
    width: 32px !important;
    height: 32px !important;
    background: rgba(255, 255, 255, 0.05) !important;
    border: none !important;
    border-radius: 8px !important;
    cursor: pointer !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    padding: 0 !important;
}

.tokens-search-clear svg {
    width: 16px !important;
    height: 16px !important;
    color: var(--text-muted) !important;
}

.tokens-search-clear:hover {
    background: rgba(255, 255, 255, 0.1) !important;
}

.tokens-search-clear:hover svg {
    color: var(--text-secondary) !important;
}

/* Search Error */
.tokens-search-error {
    display: flex !important;
    align-items: center !important;
    gap: 8px !important;
    padding: 12px 16px !important;
    background: rgba(231, 76, 60, 0.1) !important;
    border: 1px solid rgba(231, 76, 60, 0.3) !important;
    border-radius: 8px !important;
    margin-top: 12px !important;
    font-size: 13px !important;
    color: #e74c3c !important;
}

.tokens-search-error svg {
    width: 16px !important;
    height: 16px !important;
    flex-shrink: 0 !important;
}

/* Search Dropdown */
.tokens-search-dropdown {
    position: absolute !important;
    top: 100% !important;
    left: 0 !important;
    right: 0 !important;
    margin-top: 8px !important;
    background: var(--surface) !important;
    border: 1px solid var(--border) !important;
    border-radius: 12px !important;
    overflow: hidden !important;
    z-index: 100 !important;
    box-shadow: 0 8px 32px rgba(0, 0, 0, 0.4) !important;
}

.tokens-search-dropdown__header {
    padding: 12px 16px !important;
    background: rgba(255, 255, 255, 0.02) !important;
    border-bottom: 1px solid var(--border) !important;
    font-size: 12px !important;
    color: var(--text-muted) !important;
    text-transform: uppercase !important;
    letter-spacing: 0.5px !important;
}

.tokens-search-dropdown__list {
    list-style: none !important;
    margin: 0 !important;
    padding: 0 !important;
    max-height: 320px !important;
    overflow-y: auto !important;
}

.tokens-search-dropdown__item {
    border-bottom: 1px solid rgba(255, 255, 255, 0.03) !important;
}

.tokens-search-dropdown__item:last-child {
    border-bottom: none !important;
}

.tokens-search-dropdown__link {
    display: flex !important;
    align-items: center !important;
    gap: 12px !important;
    padding: 14px 16px !important;
    color: var(--text-primary) !important;
    text-decoration: none !important;
}

.tokens-search-dropdown__link:hover {
    background: rgba(212, 175, 55, 0.05) !important;
}

.tokens-search-dropdown__icon {
    width: 40px !important;
    height: 40px !important;
    background: linear-gradient(135deg, rgba(212, 175, 55, 0.2) 0%, rgba(212, 175, 55, 0.1) 100%) !important;
    border-radius: 10px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    flex-shrink: 0 !important;
}

.tokens-search-dropdown__icon svg {
    width: 20px !important;
    height: 20px !important;
    color: var(--gold) !important;
}

.tokens-search-dropdown__info {
    flex: 1 !important;
    min-width: 0 !important;
}

.tokens-search-dropdown__name {
    font-size: 14px !important;
    font-weight: 600 !important;
    color: var(--text-primary) !important;
    margin-bottom: 4px !important;
}

.tokens-search-dropdown__symbol {
    color: var(--gold) !important;
    font-weight: 500 !important;
}

.tokens-search-dropdown__address {
    font-size: 12px !important;
    color: var(--text-muted) !important;
    font-family: 'SF Mono', 'Monaco', monospace !important;
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    margin-bottom: 2px !important;
}

.tokens-search-dropdown__supply {
    font-size: 11px !important;
    color: var(--text-secondary) !important;
}

.tokens-search-dropdown__arrow {
    flex-shrink: 0 !important;
}

.tokens-search-dropdown__arrow svg {
    width: 16px !important;
    height: 16px !important;
    color: var(--text-muted) !important;
}

/* No Results */
.tokens-search-no-results {
    text-align: center !important;
    padding: 32px 20px !important;
    margin-top: 12px !important;
    background: rgba(255, 255, 255, 0.02) !important;
    border-radius: 12px !important;
    border: 1px dashed var(--border) !important;
}

.tokens-search-no-results svg {
    width: 48px !important;
    height: 48px !important;
    color: var(--text-muted) !important;
    margin-bottom: 12px !important;
}

.tokens-search-no-results p {
    font-size: 15px !important;
    color: var(--text-secondary) !important;
    margin: 0 0 4px 0 !important;
}

.tokens-search-no-results span {
    font-size: 13px !important;
    color: var(--text-muted) !important;
}

/* Loading */
.tokens-search-loading {
    text-align: center !important;
    padding: 24px 20px !important;
    margin-top: 12px !important;
}

.tokens-search-spinner {
    width: 32px !important;
    height: 32px !important;
    border: 3px solid var(--border) !important;
    border-top-color: var(--gold) !important;
    border-radius: 50% !important;
    margin: 0 auto 12px auto !important;
    animation: tokensSpin 0.8s linear infinite !important;
}

@keyframes tokensSpin {
    to {
        transform: rotate(360deg);
    }
}

.tokens-search-loading span {
    font-size: 13px !important;
    color: var(--text-muted) !important;
}

/* Search Actions */
.tokens-search-actions {
    display: flex !important;
    gap: 12px !important;
}

.tokens-btn {
    display: inline-flex !important;
    align-items: center !important;
    gap: 8px !important;
    padding: 12px 24px !important;
    font-size: 14px !important;
    font-weight: 600 !important;
    border-radius: 10px !important;
    cursor: pointer !important;
    border: none !important;
    font-family: inherit !important;
}

.tokens-btn svg {
    width: 18px !important;
    height: 18px !important;
}

.tokens-btn--primary {
    background: linear-gradient(135deg, var(--gold) 0%, #b8962d 100%) !important;
    color: #121212 !important;
}

.tokens-btn--primary:hover {
    background: linear-gradient(135deg, #e5c352 0%, var(--gold) 100%) !important;
}

.tokens-btn--primary:disabled {
    opacity: 0.6 !important;
    cursor: not-allowed !important;
}

.tokens-btn--secondary {
    background: rgba(255, 255, 255, 0.05) !important;
    color: var(--text-secondary) !important;
    border: 1px solid var(--border) !important;
}

.tokens-btn--secondary:hover {
    background: rgba(255, 255, 255, 0.08) !important;
    color: var(--text-primary) !important;
}

/* Tokens List Card */
.tokens-list-card {
    background: var(--surface) !important;
    border: 1px solid var(--border) !important;
    border-radius: 16px !important;
    overflow: hidden !important;
}

.tokens-list-card__header {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    padding: 20px 24px !important;
    border-bottom: 1px solid var(--border) !important;
    background: rgba(255, 255, 255, 0.02) !important;
}

.tokens-list-card__title {
    font-size: 18px !important;
    font-weight: 600 !important;
    color: var(--text-primary) !important;
    margin: 0 !important;
    display: flex !important;
    align-items: center !important;
    gap: 10px !important;
}

.tokens-list-card__icon {
    font-size: 20px !important;
}

.tokens-list-card__count {
    font-size: 13px !important;
    color: var(--text-muted) !important;
    background: rgba(255, 255, 255, 0.05) !important;
    padding: 6px 12px !important;
    border-radius: 6px !important;
}

.tokens-list-card__body {
    padding: 0 !important;
}

/* Tokens Empty State */
.tokens-empty {
    text-align: center !important;
    padding: 60px 24px !important;
}

.tokens-empty__icon {
    width: 80px !important;
    height: 80px !important;
    background: rgba(255, 255, 255, 0.03) !important;
    border-radius: 50% !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    margin: 0 auto 20px auto !important;
}

.tokens-empty__icon svg {
    width: 40px !important;
    height: 40px !important;
    color: var(--text-muted) !important;
}

.tokens-empty__title {
    font-size: 18px !important;
    font-weight: 600 !important;
    color: var(--text-secondary) !important;
    margin: 0 0 8px 0 !important;
}

.tokens-empty__text {
    font-size: 14px !important;
    color: var(--text-muted) !important;
    margin: 0 !important;
}

/* Tokens Table */
.tokens-table-wrap {
    overflow-x: auto !important;
}

.tokens-table {
    width: 100% !important;
    border-collapse: collapse !important;
}

.tokens-table__th {
    padding: 14px 20px !important;
    text-align: left !important;
    font-size: 11px !important;
    font-weight: 600 !important;
    color: var(--text-muted) !important;
    text-transform: uppercase !important;
    letter-spacing: 0.5px !important;
    background: rgba(255, 255, 255, 0.02) !important;
    border-bottom: 1px solid var(--border) !important;
    white-space: nowrap !important;
}

.tokens-table__th--rank {
    width: 50px !important;
    text-align: center !important;
}

.tokens-table__th--token {
    min-width: 200px !important;
}

.tokens-table__th--supply {
    min-width: 150px !important;
}

.tokens-table__th--holders {
    min-width: 100px !important;
}

.tokens-table__th--address {
    min-width: 200px !important;
}

.tokens-table__row {
    border-bottom: 1px solid rgba(255, 255, 255, 0.03) !important;
}

.tokens-table__row:hover {
    background: rgba(212, 175, 55, 0.03) !important;
}

.tokens-table__row:last-child {
    border-bottom: none !important;
}

.tokens-table__td {
    padding: 16px 20px !important;
    font-size: 14px !important;
    color: var(--text-primary) !important;
    vertical-align: middle !important;
}

.tokens-table__td--rank {
    text-align: center !important;
}

.tokens-rank {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 28px !important;
    height: 28px !important;
    background: rgba(255, 255, 255, 0.05) !important;
    border-radius: 6px !important;
    font-size: 12px !important;
    font-weight: 600 !important;
    color: var(--text-secondary) !important;
}

/* Token Info Cell */
.tokens-token-info {
    display: flex !important;
    align-items: center !important;
    gap: 12px !important;
    text-decoration: none !important;
    color: inherit !important;
}

.tokens-token-info:hover .tokens-token-symbol {
    color: var(--gold) !important;
}

.tokens-token-icon {
    width: 40px !important;
    height: 40px !important;
    background: linear-gradient(135deg, rgba(212, 175, 55, 0.2) 0%, rgba(212, 175, 55, 0.1) 100%) !important;
    border-radius: 10px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    flex-shrink: 0 !important;
}

.tokens-token-icon span {
    font-size: 16px !important;
    font-weight: 700 !important;
    color: var(--gold) !important;
}

.tokens-token-details {
    display: flex !important;
    flex-direction: column !important;
    gap: 2px !important;
}

.tokens-token-symbol {
    font-size: 15px !important;
    font-weight: 600 !important;
    color: var(--text-primary) !important;
}

.tokens-token-name {
    font-size: 12px !important;
    color: var(--text-muted) !important;
}

.tokens-token-description {
    font-size: 12px !important;
    color: var(--text-muted) !important;
    margin: 8px 0 0 52px !important;
    max-width: 300px !important;
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
}

/* Supply */
.tokens-supply {
    font-family: 'SF Mono', 'Monaco', monospace !important;
    font-size: 13px !important;
    color: var(--text-primary) !important;
}

/* Holders */
.tokens-holders {
    display: flex !important;
    align-items: center !important;
    gap: 6px !important;
    color: var(--text-secondary) !important;
}

.tokens-holders svg {
    width: 16px !important;
    height: 16px !important;
    color: var(--text-muted) !important;
}

.tokens-holders span {
    font-family: 'SF Mono', 'Monaco', monospace !important;
    font-size: 13px !important;
}

/* Address */
.tokens-address {
    display: inline-flex !important;
    align-items: center !important;
    gap: 8px !important;
    color: var(--text-secondary) !important;
    text-decoration: none !important;
    padding: 6px 10px !important;
    background: rgba(255, 255, 255, 0.03) !important;
    border-radius: 6px !important;
    max-width: 100% !important;
}

.tokens-address:hover {
    background: rgba(212, 175, 55, 0.1) !important;
    color: var(--gold) !important;
}

.tokens-address__text {
    font-family: 'SF Mono', 'Monaco', monospace !important;
    font-size: 12px !important;
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    max-width: 180px !important;
}

.tokens-address__icon {
    width: 14px !important;
    height: 14px !important;
    flex-shrink: 0 !important;
    opacity: 0.5 !important;
}

.tokens-address:hover .tokens-address__icon {
    opacity: 1 !important;
}

/* Tokens Page Responsive */
@media (max-width: 768px) {
    .tokens-hero {
        flex-direction: column !important;
        text-align: center !important;
        padding: 24px !important;
    }

    .tokens-hero__stats {
        width: 100% !important;
        justify-content: center !important;
    }

    .tokens-search-actions {
        flex-direction: column !important;
    }

    .tokens-btn {
        width: 100% !important;
        justify-content: center !important;
    }

    .tokens-table__th--address,
    .tokens-table__td--address {
        display: none !important;
    }

    .tokens-token-description {
        display: none !important;
    }
}

/* =====================================================
   RICH LIST PAGE STYLES
   Production-Ready Enterprise Design
   ===================================================== */

/* Rich List Page Container */
.rich-list-page {
    min-height: 100vh;
    background: var(--bg-dark);
    padding-bottom: 60px;
}

/* =====================================================
   Hero Section
   ===================================================== */
.rich-list-hero {
    background: linear-gradient(135deg, #1a1a1a 0%, #0d0d0d 100%);
    border-bottom: 1px solid rgba(212, 175, 55, 0.2);
    padding: 60px 20px;
    text-align: center;
    position: relative;
    overflow: hidden;
}

.rich-list-hero::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: radial-gradient(ellipse at center top, rgba(212, 175, 55, 0.08) 0%, transparent 70%);
    pointer-events: none;
}

.rich-list-hero__content {
    position: relative;
    z-index: 1;
    max-width: 1200px;
    margin: 0 auto;
}

.rich-list-hero__icon {
    width: 80px;
    height: 80px;
    border-radius: 50%;
    background: linear-gradient(135deg, rgba(212, 175, 55, 0.2) 0%, rgba(212, 175, 55, 0.05) 100%);
    border: 2px solid var(--gold);
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0 auto 24px;
    box-shadow: 0 0 40px rgba(212, 175, 55, 0.3);
}

.rich-list-hero__icon .icon-trophy {
    font-size: 36px;
    color: var(--gold);
}

.rich-list-hero__title {
    font-size: 42px;
    font-weight: 700;
    color: var(--text-primary);
    margin: 0 0 12px;
    letter-spacing: -0.5px;
}

.rich-list-hero__subtitle {
    font-size: 18px;
    color: var(--text-secondary);
    margin: 0 0 40px;
}

/* Hero Stats */
.rich-list-stats {
    display: flex;
    justify-content: center;
    gap: 60px;
    flex-wrap: wrap;
}

.rich-list-stat {
    text-align: center;
}

.rich-list-stat__value {
    display: block;
    font-size: 32px;
    font-weight: 700;
    color: var(--gold);
    margin-bottom: 8px;
    font-family: 'SF Mono', 'Monaco', 'Inconsolata', monospace;
}

.rich-list-stat__label {
    display: block;
    font-size: 14px;
    color: var(--text-secondary);
    text-transform: uppercase;
    letter-spacing: 1px;
}

/* =====================================================
   Content Section
   ===================================================== */
.rich-list-content {
    max-width: 1400px;
    margin: 0 auto;
    padding: 40px 20px;
}

/* Loading State */
.rich-list-loading {
    text-align: center;
    padding: 100px 20px;
}

.rich-list-loading__spinner {
    width: 48px;
    height: 48px;
    border: 3px solid rgba(212, 175, 55, 0.2);
    border-top-color: var(--gold);
    border-radius: 50%;
    margin: 0 auto 20px;
    animation: richListSpin 1s linear infinite;
}

@keyframes richListSpin {
    to { transform: rotate(360deg); }
}

.rich-list-loading__text {
    color: var(--text-secondary);
    font-size: 16px;
}

/* =====================================================
   Controls Section
   ===================================================== */
.rich-list-controls {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 20px;
    margin-bottom: 30px;
    flex-wrap: wrap;
}

/* Search Input */
.rich-list-search {
    flex: 1;
    max-width: 400px;
    position: relative;
}

.rich-list-search__icon {
    position: absolute;
    left: 16px;
    top: 50%;
    transform: translateY(-50%);
    color: var(--text-muted);
    font-size: 16px;
}

.rich-list-search__input {
    width: 100%;
    padding: 14px 16px 14px 48px;
    background: rgba(255, 255, 255, 0.03);
    border: 1px solid rgba(255, 255, 255, 0.1);
    border-radius: 12px;
    color: var(--text-primary);
    font-size: 15px;
    outline: none;
}

.rich-list-search__input:focus {
    border-color: var(--gold);
    background: rgba(212, 175, 55, 0.05);
}

.rich-list-search__input::placeholder {
    color: var(--text-muted);
}

/* Filter Select */
.rich-list-filter {
    display: flex;
    align-items: center;
    gap: 12px;
}

.rich-list-filter__label {
    color: var(--text-secondary);
    font-size: 14px;
}

.rich-list-filter__select {
    padding: 12px 40px 12px 16px;
    background: rgba(255, 255, 255, 0.03);
    border: 1px solid rgba(255, 255, 255, 0.1);
    border-radius: 10px;
    color: var(--text-primary);
    font-size: 14px;
    cursor: pointer;
    outline: none;
    appearance: none;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12'%3E%3Cpath fill='%23999' d='M6 8L1 3h10z'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: right 14px center;
}

.rich-list-filter__select:focus {
    border-color: var(--gold);
}

.rich-list-filter__select option {
    background: #1a1a1a;
    color: var(--text-primary);
}

/* =====================================================
   Empty State
   ===================================================== */
.rich-list-empty {
    text-align: center;
    padding: 80px 20px;
    background: rgba(255, 255, 255, 0.02);
    border-radius: 16px;
    border: 1px solid rgba(255, 255, 255, 0.05);
}

.rich-list-empty__icon {
    font-size: 48px;
    color: var(--text-muted);
    margin-bottom: 20px;
    display: block;
}

.rich-list-empty__title {
    font-size: 20px;
    color: var(--text-primary);
    margin: 0 0 10px;
}

.rich-list-empty__text {
    font-size: 15px;
    color: var(--text-secondary);
    margin: 0;
}

/* =====================================================
   Table Styles
   ===================================================== */
.rich-list-table-wrapper {
    background: rgba(255, 255, 255, 0.02);
    border-radius: 16px;
    border: 1px solid rgba(255, 255, 255, 0.06);
    overflow: hidden;
}

.rich-list-table {
    width: 100%;
    border-collapse: collapse;
}

/* Table Header */
.rich-list-table__head {
    background: rgba(0, 0, 0, 0.3);
}

.rich-list-table__th {
    padding: 18px 20px;
    text-align: left;
    font-size: 12px;
    font-weight: 600;
    color: var(--text-muted);
    text-transform: uppercase;
    letter-spacing: 1px;
    border-bottom: 1px solid rgba(255, 255, 255, 0.06);
}

.rich-list-table__th--rank {
    width: 80px;
    text-align: center;
}

.rich-list-table__th--address {
    min-width: 300px;
}

.rich-list-table__th--balance {
    text-align: right;
    width: 180px;
}

.rich-list-table__th--percent {
    width: 200px;
}

.rich-list-table__th--mined {
    text-align: center;
    width: 120px;
}

/* Table Body */
.rich-list-table__row {
    border-bottom: 1px solid rgba(255, 255, 255, 0.04);
}

.rich-list-table__row:hover {
    background: rgba(212, 175, 55, 0.03);
}

.rich-list-table__row--top3 {
    background: rgba(212, 175, 55, 0.02);
}

.rich-list-table__row--top3:hover {
    background: rgba(212, 175, 55, 0.05);
}

.rich-list-table__td {
    padding: 16px 20px;
    vertical-align: middle;
}

.rich-list-table__td--rank {
    text-align: center;
}

.rich-list-table__td--balance {
    text-align: right;
}

.rich-list-table__td--mined {
    text-align: center;
}

/* =====================================================
   Rank Badge
   ===================================================== */
.rich-list-rank {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    border-radius: 10px;
    font-size: 14px;
    font-weight: 600;
    color: var(--text-secondary);
    background: rgba(255, 255, 255, 0.05);
}

.rich-list-rank--gold {
    background: linear-gradient(135deg, #FFD700 0%, #FFA500 100%);
    color: #000;
    box-shadow: 0 4px 15px rgba(255, 215, 0, 0.3);
}

.rich-list-rank--gold .icon-trophy {
    color: #000;
}

.rich-list-rank--silver {
    background: linear-gradient(135deg, #C0C0C0 0%, #A8A8A8 100%);
    color: #000;
    box-shadow: 0 4px 15px rgba(192, 192, 192, 0.3);
}

.rich-list-rank--silver .icon-trophy {
    color: #000;
}

.rich-list-rank--bronze {
    background: linear-gradient(135deg, #CD7F32 0%, #A0522D 100%);
    color: #fff;
    box-shadow: 0 4px 15px rgba(205, 127, 50, 0.3);
}

.rich-list-rank--bronze .icon-trophy {
    color: #fff;
}

/* =====================================================
   Address Link
   ===================================================== */
.rich-list-address {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    color: var(--gold);
    text-decoration: none;
    font-family: 'SF Mono', 'Monaco', 'Inconsolata', monospace;
    font-size: 14px;
}

.rich-list-address:hover {
    color: var(--gold-light);
}

.rich-list-address__text {
    word-break: break-all;
}

.rich-list-address__icon {
    font-size: 12px;
    opacity: 0;
}

.rich-list-address:hover .rich-list-address__icon {
    opacity: 0.7;
}

/* =====================================================
   Balance Display
   ===================================================== */
.rich-list-balance {
    display: flex;
    align-items: baseline;
    justify-content: flex-end;
    gap: 6px;
}

.rich-list-balance__amount {
    font-size: 15px;
    font-weight: 600;
    color: var(--text-primary);
    font-family: 'SF Mono', 'Monaco', 'Inconsolata', monospace;
}

.rich-list-balance__unit {
    font-size: 12px;
    color: var(--text-muted);
    font-weight: 500;
}

/* =====================================================
   Percentage Bar
   ===================================================== */
.rich-list-percent {
    display: flex;
    align-items: center;
    gap: 12px;
}

.rich-list-percent__bar {
    flex: 1;
    height: 8px;
    background: rgba(255, 255, 255, 0.1);
    border-radius: 4px;
    overflow: hidden;
}

.rich-list-percent__fill {
    height: 100%;
    background: linear-gradient(90deg, var(--gold) 0%, #FFD700 100%);
    border-radius: 4px;
    min-width: 2px;
}

.rich-list-percent__value {
    font-size: 13px;
    color: var(--text-secondary);
    font-family: 'SF Mono', 'Monaco', 'Inconsolata', monospace;
    min-width: 60px;
    text-align: right;
}

/* =====================================================
   Blocks Mined
   ===================================================== */
.rich-list-mined {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    color: var(--text-secondary);
    font-size: 14px;
}

.rich-list-mined--active {
    color: var(--success);
}

.rich-list-mined .icon-cube-outline {
    font-size: 14px;
}

/* =====================================================
   Pagination Info
   ===================================================== */
.rich-list-pagination {
    margin-top: 24px;
    text-align: center;
}

.rich-list-pagination__text {
    color: var(--text-secondary);
    font-size: 14px;
}

.rich-list-pagination__text strong {
    color: var(--text-primary);
}

/* =====================================================
   Responsive Design
   ===================================================== */
@media (max-width: 1024px) {
    .rich-list-hero {
        padding: 40px 20px;
    }
    
    .rich-list-hero__title {
        font-size: 32px;
    }
    
    .rich-list-stats {
        gap: 30px;
    }
    
    .rich-list-stat__value {
        font-size: 24px;
    }
    
    .rich-list-table__th--percent,
    .rich-list-table__td--percent {
        display: none;
    }
}

@media (max-width: 768px) {
    .rich-list-hero {
        padding: 30px 16px;
    }
    
    .rich-list-hero__icon {
        width: 60px;
        height: 60px;
    }
    
    .rich-list-hero__icon .icon-trophy {
        font-size: 28px;
    }
    
    .rich-list-hero__title {
        font-size: 26px;
    }
    
    .rich-list-hero__subtitle {
        font-size: 15px;
        margin-bottom: 30px;
    }
    
    .rich-list-stats {
        flex-direction: column;
        gap: 20px;
    }
    
    .rich-list-controls {
        flex-direction: column;
        align-items: stretch;
    }
    
    .rich-list-search {
        max-width: 100%;
    }
    
    .rich-list-filter {
        justify-content: space-between;
    }
    
    .rich-list-table__th,
    .rich-list-table__td {
        padding: 12px 10px;
    }
    
    .rich-list-table__th--mined,
    .rich-list-table__td--mined {
        display: none;
    }
    
    .rich-list-address__text {
        max-width: 180px;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }
    
    .rich-list-balance__amount {
        font-size: 13px;
    }
}

@media (max-width: 480px) {
    .rich-list-content {
        padding: 20px 12px;
    }
    
    .rich-list-hero__title {
        font-size: 22px;
    }
    
    .rich-list-stat__value {
        font-size: 20px;
    }
    
    .rich-list-stat__label {
        font-size: 12px;
    }
    
    .rich-list-rank {
        width: 32px;
        height: 32px;
        font-size: 12px;
    }
    
    .rich-list-address__text {
        max-width: 120px;
        font-size: 12px;
    }
    
    .rich-list-table__th--balance,
    .rich-list-table__td--balance {
        text-align: left;
    }
}