/* Widget Manager — external styles (supplement inline CSS in index.html) */

/* Sub-panel popout buttons */
.pw-sub-popout {
    width: 20px; height: 20px; display: flex; align-items: center; justify-content: center;
    background: transparent; border: 1px solid transparent; border-radius: 3px;
    color: var(--text-3); cursor: pointer; font-size: 10px; padding: 0;
    opacity: 0; transition: all 0.12s;
}
.pw-sub:hover .pw-sub-popout { opacity: 0.7; }
.pw-sub-popout:hover { opacity: 1 !important; color: var(--text-1); background: var(--bg-hover); }

/* Reset button in layout modal */
.sw-reset-btn {
    padding: 6px 12px; background: var(--bg-4); border: 1px solid var(--border);
    color: var(--text-2); border-radius: 4px; cursor: pointer; font-size: 10px;
}
.sw-reset-btn:hover { background: rgba(255,77,106,0.12); color: var(--red); border-color: var(--red); }

/* === US LIQUIDITY MONITOR TILES === */
.liq-tile {
    transition: border-color 0.15s, box-shadow 0.15s;
}
.liq-tile:hover {
    border-color: var(--border-light) !important;
    box-shadow: 0 4px 16px rgba(0,0,0,0.15);
}

.liq-period-btn {
    padding: 3px 10px;
    font-size: 10px;
    font-weight: 600;
    cursor: pointer;
    border-radius: 4px;
    border: 1px solid var(--border);
    background: var(--bg-4);
    color: var(--text-3);
    transition: all 0.1s;
}
.liq-period-btn.active {
    background: var(--blue);
    color: #fff;
    border-color: var(--blue);
}
.liq-period-btn:hover:not(.active) {
    background: var(--bg-hover);
    color: var(--text-1);
}

.liq-chart-type {
    padding: 5px 14px;
    font-size: 11px;
    font-weight: 600;
    cursor: pointer;
    border-radius: 6px;
    border: 1px solid var(--border);
    background: var(--bg-4);
    color: var(--text-3);
    transition: all 0.1s;
}
.liq-chart-type.active {
    background: var(--text-1);
    color: var(--bg-1);
    border-color: var(--text-1);
}
.liq-chart-type:hover:not(.active) {
    background: var(--bg-hover);
    color: var(--text-1);
}