/* =========================================================
   BRAVO CRM — ASSETS & PORTFOLIO PAGES
   (Assets list, Deposits, Withdrawals, Portfolio overview,
    Single asset detail, Crypto, OnchainTx)
   ========================================================= */

/* -------------------------------------------------------
   SHARED: ASSETS TABLE SYSTEM
-------------------------------------------------------- */

.assets__table {
    display: grid;
    gap: 8px;
    overflow: hidden;
}

.assets__row {
    display: grid;
    align-items: center;
    padding: 14px 18px;
    border-radius: 14px;
    border: 1px solid rgba(15,23,42,.06);
    background: var(--surface);
    transition: background .15s ease,
                box-shadow .15s ease,
                border-color .15s ease;
    column-gap: 10px;
}

.assets__row:hover {
    background: #f8fafc;
    box-shadow: 0 2px 8px rgba(15,23,42,.07);
    border-color: rgba(15,23,42,.10);
}

.assets__row--head:hover {
    background: transparent;
    box-shadow: none;
    border-color: transparent;
    cursor: default;
}

.assets__row--head {
    background: transparent;
    border: none;
    font-size: 12px;
    font-weight: 600;
    color: #64748b;
    padding: 6px 18px;
}

/* Column layouts */
.assets__row--cols-tx7 {
    grid-template-columns: 140px 80px 90px 1fr 80px 130px 1fr 100px;
}

.assets__row--cols-tx6 {
    grid-template-columns: 140px 80px 90px 120px 1fr 100px;
}

/* Deposits/Withdrawals stronger shadow */
.pf__tableCard {
    border: 1px solid var(--border) !important;
    border-radius: 18px !important;
    background: var(--surface) !important;
    padding: 22px !important;
    box-shadow: 0 4px 20px rgba(15,23,42,.07), 0 1px 4px rgba(15,23,42,.04) !important;
}

.assets__row:not(.assets__row--head) {
    border: 1px solid rgba(15,23,42,.07) !important;
    box-shadow: 0 1px 4px rgba(15,23,42,.04) !important;
}


/* -------------------------------------------------------
   ASSETS TABS
-------------------------------------------------------- */

.assets__tabs {
    display: flex;
    gap: 10px;
}

.assets__tab {
    padding: 8px 16px;
    border-radius: 999px;
    font-size: 13px;
    font-weight: 500;
    color: #64748b;
    background: #f1f5f9;
    text-decoration: none;
    transition: all .2s ease;
}

.assets__tab:hover {
    background: #e2e8f0;
}

.assets__tab.active {
    background: #0f172a;
    color: #ffffff;
}

.btn-outline-light {
    border-radius: 10px;
    font-size: 12px;
    padding: 6px 12px;
    border: 1px solid rgba(15,23,42,.1);
    background: var(--surface);
    color: #0f172a;
}

.btn-outline-light:hover {
    background: #f1f5f9;
}


/* -------------------------------------------------------
   PORTFOLIO TABS (pf__tabs)
-------------------------------------------------------- */

.pf__tabs {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    background: #f4f6fa;
    padding: 6px;
    border-radius: 999px;
    border: 1px solid rgba(15,23,42,.06);
}

.pf__tab {
    padding: 7px 16px;
    border-radius: 999px;
    text-decoration: none;
    font-size: 13px;
    font-weight: 500;
    color: #64748b;
    transition: all .18s ease;
    position: relative;
}

.pf__tab:hover {
    color: #0f172a;
    background: rgba(15,23,42,.04);
}

.pf__tab.active {
    background: #ffffff;
    color: #0f172a;
    font-weight: 600;
    box-shadow: 0 2px 8px rgba(15,23,42,.08);
}


/* -------------------------------------------------------
   PORTFOLIO / ASSET PAGE HEADER
-------------------------------------------------------- */

.pf__kicker-link {
    color: #7b8798;
    text-decoration: none;
}
.pf__kicker-link:hover { color: #0f172a; text-decoration: underline; }

.pf__kicker-sep { color: #cbd5e1; }

.pf__kicker-current {
    color: #0f172a;
    font-weight: 600;
}

.pf__tableHead-title {
    color: #0f172a;
}


/* -------------------------------------------------------
   ONCHAIN TX DETAIL PAGE (txd__*)
-------------------------------------------------------- */

/* Note: txd__* styles are currently inline in the template.
   Dark theme overrides are handled here. */


/* -------------------------------------------------------
   EMPTY STATE
-------------------------------------------------------- */

.empty-state {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 12px;
    padding: 32px 0;
}

.empty-state__text {
    font-size: 14px;
    color: #64748b;
}


/* -------------------------------------------------------
   BRAND BUTTON (CTA)
   Light: black | Dark: gold gradient
-------------------------------------------------------- */

.brand-btn,
input.brand-btn,
button.brand-btn {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    font-size: 13px;
    font-weight: 700;
    padding: 10px 20px;
    border-radius: 12px;
    text-decoration: none !important;
    color: #ffffff !important;
    background: linear-gradient(135deg, #1e293b 0%, #0f172a 100%);
    border: none;
    box-shadow: 0 4px 16px rgba(15,23,42,.22), inset 0 1px 0 rgba(255,255,255,.06);
    cursor: pointer;
    -webkit-appearance: none;
    appearance: none;
    transition:
        transform .3s cubic-bezier(.22,.61,.36,1),
        box-shadow .3s cubic-bezier(.22,.61,.36,1),
        filter .3s ease;
}

.brand-btn svg,
button.brand-btn svg,
input.brand-btn svg { stroke: #ffffff; flex-shrink: 0; }

.brand-btn:hover,
input.brand-btn:hover,
button.brand-btn:hover {
    transform: translateY(-2px);
    box-shadow: 0 8px 28px rgba(15,23,42,.32), inset 0 1px 0 rgba(255,255,255,.08);
    filter: brightness(1.10);
    color: #ffffff !important;
    text-decoration: none !important;
}

.brand-btn:active,
input.brand-btn:active,
button.brand-btn:active {
    background: linear-gradient(135deg, #1e293b 0%, #0f172a 100%);
    color: #ffffff !important;
    transform: translateY(0);
    box-shadow: 0 3px 10px rgba(15,23,42,.20);
    filter: none;
}

:root.theme-dark .brand-btn,
:root.theme-dark input.brand-btn,
:root.theme-dark button.brand-btn {
    color: #1A1E30 !important;
    background: linear-gradient(135deg, #EDC016 0%, #F28739 100%);
    border: 1px solid rgba(242,135,57,.4);
    box-shadow: 0 4px 16px rgba(237,192,22,.28);
}

:root.theme-dark .brand-btn svg,
:root.theme-dark button.brand-btn svg,
:root.theme-dark input.brand-btn svg { stroke: #1A1E30; }

:root.theme-dark .brand-btn:hover,
:root.theme-dark input.brand-btn:hover,
:root.theme-dark button.brand-btn:hover {
    box-shadow: 0 8px 24px rgba(237,192,22,.40);
    color: #1A1E30 !important;
}


/* -------------------------------------------------------
   DARK THEME — ASSETS & PORTFOLIO
-------------------------------------------------------- */

:root.theme-dark .assets__tab {
    background: var(--surface-3);
    color: var(--muted);
}
:root.theme-dark .assets__tab:hover {
    background: var(--surface-2);
    color: #f0b90b;
}
:root.theme-dark .assets__tab.active {
    background: #f0b90b;
    color: #1a1209;
}

:root.theme-dark .btn-outline-light {
    background: var(--surface);
    color: var(--text);
    border-color: var(--border);
}
:root.theme-dark .btn-outline-light:hover { background: var(--surface-2); }

:root.theme-dark .pf__tabs {
    background: var(--surface-2);
    border-color: var(--border-soft);
}
:root.theme-dark .pf__tab       { color: var(--muted); }
:root.theme-dark .pf__tab:hover { color: var(--text); background: var(--surface-3); }
:root.theme-dark .pf__tab.active {
    background: var(--surface) !important;
    color: #f0b90b !important;
    box-shadow: 0 2px 10px rgba(0,0,0,.35) !important;
}

:root.theme-dark .assets__row:hover {
    background: var(--surface-2);
    box-shadow: 0 2px 10px rgba(0,0,0,.25);
    border-color: rgba(255,255,255,.10);
}
:root.theme-dark .assets__row--head {
    color: var(--muted-2) !important;
    background: transparent !important;
    border: none !important;
    box-shadow: none !important;
}

:root.theme-dark .assets__row:not(.assets__row--head) {
    background: var(--surface) !important;
    border: 1px solid rgba(255,255,255,.08) !important;
    box-shadow: 0 1px 4px rgba(0,0,0,.3) !important;
}

:root.theme-dark .pf__tableCard {
    background: var(--surface) !important;
    border: 1px solid rgba(255,255,255,.10) !important;
    box-shadow: 0 6px 30px rgba(0,0,0,.6), 0 1px 4px rgba(0,0,0,.4) !important;
}

:root.theme-dark .pf__table th {
    color: var(--muted-2) !important;
    border-bottom-color: rgba(255,255,255,.07) !important;
}

:root.theme-dark .pf__table td {
    color: var(--text) !important;
    border-bottom-color: rgba(255,255,255,.05) !important;
}

:root.theme-dark .pf__row:hover {
    background: rgba(240,185,11,.04) !important;
}

:root.theme-dark .pf__detail { color: var(--link) !important; }
:root.theme-dark .pf__empty  { color: var(--muted) !important; }

:root.theme-dark .pf__kicker-link        { color: var(--muted) !important; }
:root.theme-dark .pf__kicker-link:hover  { color: var(--text) !important; }
:root.theme-dark .pf__kicker-sep         { color: rgba(255,255,255,.25) !important; }
:root.theme-dark .pf__kicker-current     { color: var(--text) !important; }
:root.theme-dark .pf__tableHead-title    { color: var(--text) !important; }

/* pf summary cards */
:root.theme-dark .pf__summary .pf__card {
    background: var(--surface) !important;
    border: 1px solid rgba(255,255,255,.10) !important;
    box-shadow: 0 4px 24px rgba(0,0,0,.55), 0 1px 4px rgba(0,0,0,.4) !important;
    color: var(--text) !important;
}

:root.theme-dark .pf__card--highlight {
    background:
        radial-gradient(800px 300px at 0% 0%,   rgba(240,185,11,.10) 0%, transparent 55%),
        radial-gradient(600px 250px at 100% 0%,  rgba(240,185,11,.07) 0%, transparent 50%),
        radial-gradient(500px 200px at 60% 100%, rgba(14,203,129,.06)  0%, transparent 55%),
        linear-gradient(180deg, #1e2329 0%, #161a1e 100%) !important;
    border-color: rgba(240,185,11,.15) !important;
    box-shadow: 0 0 40px rgba(240,185,11,.06), 0 8px 32px rgba(0,0,0,.50) !important;
}

:root.theme-dark .pf__label { color: var(--muted) !important; }
:root.theme-dark .pf__big   { color: var(--text) !important; }
:root.theme-dark .pf__value { color: var(--text) !important; }
:root.theme-dark .pf__card-icon {
    background: rgba(255,255,255,.06) !important;
    color: var(--text) !important;
}

:root.theme-dark .pf__kicker,
:root.theme-dark .pf__kicker span { color: var(--muted) !important; }
:root.theme-dark .pf__kicker a    { color: var(--muted) !important; }
:root.theme-dark .pf__title       { color: var(--text) !important; }
:root.theme-dark .pf__subtitle    { color: var(--muted) !important; }

:root.theme-dark .pf__input,
:root.theme-dark input.pf__input,
:root.theme-dark .pf__select,
:root.theme-dark select.pf__select {
    background: var(--surface-2) !important;
    color: var(--text) !important;
    border-color: var(--border) !important;
}
:root.theme-dark .pf__input:focus,
:root.theme-dark .pf__select:focus {
    background: var(--surface) !important;
    border-color: rgba(240,185,11,.45) !important;
    box-shadow: 0 0 0 3px rgba(240,185,11,.10) !important;
}

:root.theme-dark .pf__tableCard h4  { color: var(--text) !important; }
:root.theme-dark .pf .pf__header h4,
:root.theme-dark .pf .pf__tableHead h4 { color: var(--text) !important; }

:root.theme-dark .pf__pill {
    background: rgba(255,255,255,.08) !important;
    color: var(--text-2) !important;
}

:root.theme-dark .pf__muted { color: var(--muted) !important; }

:root.theme-dark .assets__copy {
    background: var(--surface-2) !important;
    border-color: var(--border) !important;
}
:root.theme-dark .assets__copy:hover {
    background: var(--surface-3) !important;
    border-color: rgba(240,185,11,.3) !important;
}
:root.theme-dark .assets__copy::before,
:root.theme-dark .assets__copy::after { border-color: var(--muted) !important; }
:root.theme-dark .assets__copy::after { background: var(--surface-2) !important; }

:root.theme-dark .amount   { color: var(--text) !important; }
:root.theme-dark .tx-hash  { color: var(--muted) !important; }

/* Global card contrast boost */
:root.theme-dark .card,
:root.theme-dark .info-card,
:root.theme-dark .orders-list,
:root.theme-dark .order-detail__card,
:root.theme-dark .settings-card,
:root.theme-dark .pf__tableCard,
:root.theme-dark .sfcard,
:root.theme-dark .sfinfo,
:root.theme-dark .quick-action {
    border-color: rgba(255,255,255,.10) !important;
    box-shadow: 0 4px 24px rgba(0,0,0,.55), 0 1px 4px rgba(0,0,0,.4) !important;
}

/* OnchainTx detail */
:root.theme-dark .txd__header {
    background: linear-gradient(180deg, #1e2329 0%, #161a1e 100%) !important;
    border-color: rgba(240,185,11,.12) !important;
}

:root.theme-dark .txd__kicker { color: var(--muted) !important; }
:root.theme-dark .txd__title  { color: var(--text) !important; }
:root.theme-dark .txd__id     { color: var(--muted) !important; }

:root.theme-dark .txd__pill {
    background: rgba(255,255,255,.07) !important;
    color: var(--text-2) !important;
}

:root.theme-dark .txd__badge {
    background: var(--surface-2) !important;
    border-color: var(--border) !important;
    color: var(--text) !important;
}
:root.theme-dark .txd__badge--ok {
    border-color: rgba(14,203,129,.28) !important;
    background: rgba(14,203,129,.10) !important;
    color: #0ecb81 !important;
}
:root.theme-dark .txd__badge--warn {
    border-color: rgba(245,158,11,.28) !important;
    background: rgba(245,158,11,.10) !important;
    color: #f59e0b !important;
}
:root.theme-dark .txd__badge--bad {
    border-color: rgba(246,70,93,.28) !important;
    background: rgba(246,70,93,.10) !important;
    color: #f6465d !important;
}

:root.theme-dark .txd__summary {
    background: linear-gradient(135deg, rgba(30,35,41,.9) 0%, #161a1e 100%) !important;
    border-color: rgba(255,255,255,.08) !important;
}

:root.theme-dark .txd__label     { color: var(--muted) !important; }
:root.theme-dark .txd__amount    { color: var(--text) !important; }
:root.theme-dark .txd__amountUnit { color: var(--muted) !important; }
:root.theme-dark .txd__sub       { color: var(--muted) !important; }
:root.theme-dark .txd__strong    { color: var(--text) !important; }
:root.theme-dark .txd__value     { color: var(--text) !important; }

:root.theme-dark .txd__card {
    background: var(--surface) !important;
    border-color: rgba(255,255,255,.10) !important;
    box-shadow: 0 4px 20px rgba(0,0,0,.5) !important;
}
:root.theme-dark .txd__cardTitle  { color: var(--text) !important; }
:root.theme-dark .txd__row        { border-top-color: rgba(255,255,255,.06) !important; }
:root.theme-dark .txd__monoBox {
    background: var(--surface-2) !important;
    border-color: var(--border) !important;
}
:root.theme-dark .txd__monoText   { color: var(--text) !important; }

:root.theme-dark .txd__copy {
    background: var(--surface-3) !important;
    border-color: var(--border) !important;
    color: var(--text-2) !important;
}
:root.theme-dark .txd__copy:hover {
    background: rgba(240,185,11,.12) !important;
    border-color: rgba(240,185,11,.3) !important;
    color: #f0b90b !important;
}
:root.theme-dark .txd__copyDone { color: #0ecb81 !important; }
:root.theme-dark .txd__copy.copied {
    background: rgba(14,203,129,.12) !important;
    border-color: rgba(14,203,129,.28) !important;
    color: #0ecb81 !important;
}

:root.theme-dark .txd__btn--ghost {
    background: var(--surface) !important;
    border-color: var(--border) !important;
    color: var(--text) !important;
}
:root.theme-dark .txd__btn--ghost:hover { background: var(--surface-2) !important; }

/* Verify input */
:root.theme-dark .verify__input:focus {
    border-color: rgba(240,185,11,.5) !important;
    box-shadow: 0 0 0 3px rgba(240,185,11,.10) !important;
}

/* Badge colors */
:root.theme-dark .badge.badge-success {
    border-color: rgba(14,203,129,.28) !important;
    background: rgba(14,203,129,.10) !important;
    color: #0ecb81 !important;
}
:root.theme-dark .badge.badge-warning {
    border-color: rgba(245,158,11,.28) !important;
    background: rgba(245,158,11,.10) !important;
    color: #f59e0b !important;
}
:root.theme-dark .badge.badge-danger {
    border-color: rgba(246,70,93,.28) !important;
    background: rgba(246,70,93,.10) !important;
    color: #f6465d !important;
}
:root.theme-dark .badge.badge-default {
    border-color: rgba(255,255,255,.12) !important;
    background: rgba(255,255,255,.06) !important;
    color: var(--text-2) !important;
}
:root.theme-dark .badge-default {
    background: rgba(255,255,255,.08) !important;
    color: #eaecef !important;
    border-color: rgba(255,255,255,.12) !important;
}

/* Typography utility overrides */
:root.theme-dark .tc-dblue  { color: #eaecef !important; }
:root.theme-dark .tc-lblue  { color: #eaecef !important; }
:root.theme-dark .tc-gray-1 { color: rgba(234,236,239,.65) !important; }
:root.theme-dark .tc-gray-2 { color: rgba(234,236,239,.55) !important; }

:root.theme-dark a.tc-dblue,
:root.theme-dark .src.tc-dblue { color: #f0b90b !important; }

:root.theme-dark .tit { color: #eaecef !important; }
:root.theme-dark .txt { color: rgba(234,236,239,.75) !important; }

:root.theme-dark .assets__row .tc-dblue,
:root.theme-dark .assets__row .tit,
:root.theme-dark .assets__row .tw-700 { color: #eaecef !important; }
:root.theme-dark .assets__row .tc-gray-2,
:root.theme-dark .assets__row .txt    { color: rgba(234,236,239,.60) !important; }

/* Scrollbar */
:root.theme-dark ::-webkit-scrollbar {
    width: 6px;
    height: 6px;
}
:root.theme-dark ::-webkit-scrollbar-track { background: #0b0e11; }
:root.theme-dark ::-webkit-scrollbar-thumb {
    background: rgba(240,185,11,.25);
    border-radius: 999px;
}
:root.theme-dark ::-webkit-scrollbar-thumb:hover {
    background: rgba(240,185,11,.45);
}

/* Selection highlight */
:root.theme-dark ::selection {
    background: rgba(240,185,11,.25);
    color: #fcd535;
}

