/* Assets tab specific styles */
.list-assets .row {
    grid-template-columns: auto 1fr auto;
}

.amount {
    font-weight: 800;
}

.asset-meta {
    display: grid;
    gap: 2px;
}

/* Loading modal */
.loading-modal {
    position: fixed;
    inset: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    background: rgba(0, 0, 0, .45);
    backdrop-filter: blur(8px);
    z-index: 1000;
}

.loading-card {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    padding: 12px 14px;
    border-radius: 14px;
    border: 1px solid var(--line);
    background: var(--card);
    color: var(--fg);
    box-shadow: var(--shadow);
    min-width: 140px;
    justify-content: center;
}

.loading-spin {
    width: 22px;
    height: 22px;
    animation: spin 1s linear infinite;

    filter: brightness(0) invert(1);
}

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

.assets-toggle {
    display: flex;
    gap: 10px;
    margin: 0 0 12px;
    justify-content: center;
}

.toggle-btn {
    flex: 1;
    padding: 8px 16px;
    border-radius: var(--radius-sm);
    font-weight: 600;
    font-size: 14px;
    color: var(--primary);
    background: var(--grey-grad);
    border: none;
    cursor: pointer;
    transition: all 0.2s ease-in-out;
}

.toggle-btn.active {
    background: var(--gold-grad);
    color: #000;
    box-shadow: var(--shadow);
}

.toggle-btn:hover {
    opacity: 0.9;
}

#assets-list-all .row.selected,
#assets-list-selected .row.selected {
    border: .85px solid var(--accent);
    box-shadow: inset 0 2px 20px rgba(245, 206, 102, 0.47);
}

/* === Select mode overlay & bar === */
.select-overlay {
    position: fixed;
    inset: 0;
    z-index: 40;
    background: rgba(0, 0, 0, .35);
    backdrop-filter: blur(2px);
}

.select-bar {
    position: fixed;
    left: 12px;
    right: 12px;
    bottom: 10px;
    background: var(--surface-2);
    border: 1px solid var(--line);
    border-radius: var(--radius);
    box-shadow: var(--shadow);
    padding: 10px;
    display: flex;
    gap: 8px;
    z-index: 50;
}

.select-bar .btn {
    flex: 1;
    min-height: var(--tap);
}

.hidden {
    display: none !important;
}

#tab-assets.select-mode .asset-ico {
    display: none !important;
}


#tab-assets.select-mode .list .row {
    border: .85px solid var(--accent);
    box-shadow: inset 0 2px 20px rgba(245, 206, 102, .25);
}

.row.selectable .badge {
    display: flex;
    align-items: center;
    justify-content: center;
}

.select-mark {
    width: 28px;
    height: 28px;
    border-radius: 50%;
    border: 1.5px solid var(--muted);
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: 700;
    user-select: none;
}

.row.chosen .select-mark {
    border-color: var(--accent);
    background: var(--gold-grad);
    color: #000;
}

#sel-confirm[disabled] {
    opacity: .6;
    pointer-events: none;
}

#sel-confirm.is-busy {
    cursor: progress;
}

#assets-select-overlay{
    position: fixed;
    inset: 0;
    background: rgba(0,0,0,.45);
    backdrop-filter: blur(6px);
    -webkit-backdrop-filter: blur(6px);
    opacity: 0;
    pointer-events: none;
    z-index: 60;
    transition: opacity .18s ease;
}
.select-mode #assets-select-overlay{
    opacity: 1;
    pointer-events: auto;
}

.select-mode .list-assets .row{
    position: relative;
    z-index: 90;
}

#assets-select-bar{
    position: fixed;
    left: 0; right: 0; bottom: 0;
    z-index: 100;
}

.select-mode .page-header,
.select-mode .portfolio-total,
.select-mode .seg-nav{
    filter: none;
}

.select-mode-btn {
    height: 35px;
    width: 100%;
    padding: 0 14px;
    border-radius: 12px;
    border: 1px solid var(--accent);
    background: var(--primary);
    color: var(--fg);
    font-weight: 600;
    cursor: pointer;

    position: relative;
    box-shadow:
            0 0 10px var(--accent),
            0 0 0 0 rgba(245,206,102,.35);
    animation: btn-pulse-shadow 1.5s ease-in-out infinite;
}

@keyframes btn-pulse-shadow {
    0% {
        box-shadow:
                0 0 10px var(--accent),
                0 0 0 0 rgba(245,206,102,.35);
    }
    50% {
        box-shadow:
                0 0 7px var(--accent),
                0 0 0 8px rgba(245,206,102,0);
    }
    100% {
        box-shadow:
                0 0 10px var(--accent),
                0 0 0 0 rgba(245,206,102,0);
    }
}

.select-mode-btn:disabled,
.select-mode-btn[aria-disabled="true"],
.select-mode-btn.disabled {
    opacity: .55;
    cursor: not-allowed;
    color: var(--muted);
    background: var(--primary);
    border-color: var(--line);

    box-shadow: none !important;
    animation: none !important;
    animation-play-state: paused !important;

    pointer-events: none;
}