/* ASTrade Chart Workspace Polish v1 */

.chart-workspace,
.chart-panel,
.chart-card,
.live-market-workspace{
    background:linear-gradient(180deg,#0e1821,#091119)!important;
    border:1px solid rgba(145,180,194,.13)!important;
    border-radius:18px!important;
    box-shadow:0 22px 60px rgba(0,0,0,.25)!important;
    color:#edf6f7!important;
}

.chart-workspace-head,
.chart-panel-top,
.live-market-head{
    min-height:68px!important;
    padding:14px 18px!important;
    background:linear-gradient(180deg,rgba(255,255,255,.022),rgba(255,255,255,.006))!important;
    border-bottom:1px solid rgba(145,180,194,.075)!important;
}

.chart-workspace-head h3,
.chart-panel-top h3,
.live-market-head h3{
    color:#f1f8f9!important;
    margin:0!important;
    font-size:1rem!important;
    font-weight:850!important;
}

.chart-badges,
.chart-status-badges,
.workspace-badges{
    display:flex!important;
    align-items:center!important;
    gap:7px!important;
    flex-wrap:wrap!important;
}

.chart-badge,
.workspace-badge,
.status-pill{
    min-height:32px!important;
    display:inline-flex!important;
    align-items:center!important;
    gap:5px!important;
    padding:6px 10px!important;
    border-radius:999px!important;
    background:#101c25!important;
    border:1px solid rgba(145,180,194,.10)!important;
    color:#9eb2bb!important;
    font-size:.66rem!important;
    font-weight:800!important;
}

.status-pill.connected,
.status-pill.success{
    color:#62e4b1!important;
    border-color:rgba(71,220,160,.20)!important;
    background:rgba(71,220,160,.045)!important;
}

.status-pill.connected::before,
.status-pill.success::before{
    content:""!important;
    width:7px!important;
    height:7px!important;
    border-radius:50%!important;
    background:#47dca0!important;
    box-shadow:0 0 10px rgba(71,220,160,.40)!important;
}

.chart-toolbar,
.chart-controls,
.chart-actions{
    min-height:52px!important;
    padding:8px 12px!important;
    display:flex!important;
    align-items:center!important;
    gap:6px!important;
    flex-wrap:wrap!important;
    background:#081119!important;
    border-bottom:1px solid rgba(145,180,194,.075)!important;
}

.chart-toolbar button,
.chart-toolbar .btn,
.chart-controls button,
.chart-controls .btn,
.chart-actions button,
.chart-actions .btn,
.chart-tool-btn{
    min-height:34px!important;
    height:34px!important;
    padding:0 10px!important;
    border-radius:8px!important;
    background:#111d27!important;
    color:#aebfc6!important;
    border:1px solid rgba(145,180,194,.09)!important;
    box-shadow:none!important;
    font-size:.66rem!important;
    font-weight:800!important;
}

.chart-toolbar button:hover,
.chart-toolbar button:focus,
.chart-toolbar button:active,
.chart-controls button:hover,
.chart-controls button:focus,
.chart-controls button:active,
.chart-actions button:hover,
.chart-actions button:focus,
.chart-actions button:active{
    background:#172630!important;
    color:#eff8f9!important;
    border-color:rgba(54,213,195,.22)!important;
    outline:none!important;
    box-shadow:none!important;
}

.chart-toolbar button.active,
.chart-toolbar .btn.active,
.chart-controls button.active,
.chart-actions button.active,
.chart-tool-btn.active,
.chart-tool-btn[aria-pressed="true"]{
    background:linear-gradient(135deg,#32d2bf,#49d2ee)!important;
    color:#041014!important;
    border-color:transparent!important;
    box-shadow:0 8px 20px rgba(54,213,195,.10)!important;
}

.chart-year-controls,
.chart-filter-controls{
    display:flex!important;
    align-items:center!important;
    gap:7px!important;
    margin-left:auto!important;
}

.chart-year-controls label,
.chart-filter-controls label{
    color:#7f939d!important;
    font-size:.68rem!important;
    font-weight:800!important;
}

.chart-year-controls input,
.chart-filter-controls input,
.chart-year-controls select,
.chart-filter-controls select{
    min-height:34px!important;
    height:34px!important;
    border-radius:8px!important;
    background:#0b151d!important;
    color:#e8f2f4!important;
    border:1px solid rgba(145,180,194,.10)!important;
    padding:0 9px!important;
}

.chart-status-row,
.chart-status-bar,
.chart-meta-row{
    min-height:38px!important;
    padding:6px 10px!important;
    display:flex!important;
    align-items:center!important;
    gap:8px!important;
    background:#071018!important;
    border-bottom:1px solid rgba(145,180,194,.06)!important;
    color:#9aadb6!important;
}

.chart-status-item,
.chart-status-text{
    min-height:28px!important;
    display:inline-flex!important;
    align-items:center!important;
    padding:5px 9px!important;
    border-radius:8px!important;
    background:#0e1922!important;
    border:1px solid rgba(145,180,194,.07)!important;
    color:#9fb2ba!important;
    font-size:.62rem!important;
    font-weight:750!important;
    white-space:nowrap!important;
}

.chart-status-item:first-child::before,
.chart-status-text:first-child::before{
    content:""!important;
    width:6px!important;
    height:6px!important;
    margin-right:6px!important;
    border-radius:50%!important;
    background:#47dca0!important;
    box-shadow:0 0 10px rgba(71,220,160,.30)!important;
}

.chart-stage,
.chart-container,
.chart-box-pro,
.main-chart-wrap,
.main-chart-container,
.main-chart-canvas{
    background:#071019!important;
    border-color:rgba(145,180,194,.07)!important;
}

.dashboard-control-buttons{
    display:flex!important;
    align-items:center!important;
    gap:7px!important;
}

.dashboard-control-buttons .toggle-panel-btn,
.dashboard-control-buttons button,
.dashboard-control-buttons .btn{
    min-height:42px!important;
    height:42px!important;
    padding:0 14px!important;
    border-radius:10px!important;
    background:#101c25!important;
    color:#c9d8dd!important;
    border:1px solid rgba(145,180,194,.10)!important;
    box-shadow:none!important;
    font-size:.70rem!important;
    font-weight:800!important;
}

.dashboard-control-buttons .toggle-panel-btn:hover,
.dashboard-control-buttons .toggle-panel-btn:focus,
.dashboard-control-buttons .toggle-panel-btn:active,
.dashboard-control-buttons button:hover,
.dashboard-control-buttons button:focus,
.dashboard-control-buttons button:active{
    background:#172630!important;
    color:#f1f8f9!important;
    border-color:rgba(54,213,195,.22)!important;
    outline:none!important;
}

.broker-connected,
.broker-status{
    min-height:42px!important;
    display:inline-flex!important;
    align-items:center!important;
    gap:7px!important;
    padding:0 13px!important;
    border-radius:10px!important;
    background:rgba(71,220,160,.045)!important;
    border:1px solid rgba(71,220,160,.17)!important;
    color:#7ee5ba!important;
    font-size:.68rem!important;
    font-weight:800!important;
}

.broker-connected::before,
.broker-status::before{
    content:""!important;
    width:7px!important;
    height:7px!important;
    border-radius:50%!important;
    background:#47dca0!important;
    box-shadow:0 0 10px rgba(71,220,160,.45)!important;
}

@media (max-width:800px){
    .chart-workspace-head,
    .chart-panel-top,
    .live-market-head{
        align-items:flex-start!important;
        flex-direction:column!important;
    }
    .chart-toolbar,
    .chart-controls,
    .chart-actions{
        overflow-x:auto!important;
        flex-wrap:nowrap!important;
        scrollbar-width:none!important;
    }
    .chart-toolbar::-webkit-scrollbar,
    .chart-controls::-webkit-scrollbar,
    .chart-actions::-webkit-scrollbar{
        display:none!important;
    }
}