/* Shared Market Map and sentiment chrome, including their terminal panels. */
:is(#sector-heatmap, #trader-fear-index) {
    background: #0c0c0c;
    box-shadow: none;
}

:is(#sector-heatmap, #trader-fear-index)::after,
:is(#sector-heatmap, #trader-fear-index) .decoration-line {
    display: none;
}

:is(#sector-heatmap, #trader-fear-index) .widget-header {
    min-height: 30px;
    flex: 0 0 auto;
    gap: 8px;
    padding: 7px 10px;
    background: #151515;
    border-bottom: 1px solid #303030;
}

:is(#sector-heatmap, #trader-fear-index) .widget-header h2 {
    margin: 0;
    font: 700 10px/1.4 'JetBrains Mono', monospace;
    letter-spacing: .03em;
    color: #d5d5d5;
    text-shadow: none;
    -webkit-font-smoothing: auto;
}

:is(#sector-heatmap, #trader-fear-index) .status-container {
    gap: 4px;
    margin: 0;
    white-space: nowrap;
}

:is(#sector-heatmap, #trader-fear-index) .status-text,
#sector-heatmap .market-map-ts {
    font: 7px/1.4 'JetBrains Mono', monospace;
    letter-spacing: .03em;
    color: #8c8c8c;
    text-shadow: none;
}

:is(#sector-heatmap, #trader-fear-index) .status-dot {
    width: 4px;
    height: 4px;
    border-radius: 0;
    background: #65ad8d;
    font-size: 0;
    box-shadow: none;
    animation: none;
}

:is(#sector-heatmap, #trader-fear-index) :is(.status-cached, .status-stale) .status-dot {
    background: #b49259;
}

#sector-heatmap .market-map-ts { margin-left: 3px; color: #666; }

#sector-heatmap .widget-content {
    display: flex;
    flex-direction: column;
    align-items: stretch;
    padding: 0;
    background: #0c0c0c;
}

#sector-heatmap .market-map-index {
    color: #b59a6b;
    font-size: 8px;
    font-weight: 400;
    white-space: nowrap;
}

#sector-heatmap .market-map-widget-host {
    min-height: 0;
    max-height: none;
    border: 0;
    border-radius: 0;
    background: #0c0c0c;
    box-shadow: none;
    aspect-ratio: auto;
}

#sector-heatmap .tradingview-widget-copyright {
    right: 5px;
    bottom: 4px;
    padding: 2px 4px;
    border-radius: 0;
    background: #101010e8;
    color: #818181;
    font-size: 7px;
    letter-spacing: 0;
}

#sector-heatmap .tradingview-widget-copyright :is(a, .blue-text) { color: #829ba9; }

#trader-fear-index {
    height: 104px;
}

#trader-fear-index .widget-content {
    padding: 7px 12px;
    background: #0c0c0c;
}

#trader-fear-index .tfi-container {
    --sentiment-color: #c4a258;
    width: 100%;
    padding: 0;
    gap: 5px;
    font-family: 'JetBrains Mono', monospace;
}

#trader-fear-index :is(.tfi-red, .tfi-extreme-fear) { --sentiment-color: #d36579; }
#trader-fear-index :is(.tfi-green, .tfi-extreme-greed) { --sentiment-color: #65b895; }

#trader-fear-index .tfi-display {
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
    gap: 12px;
}

#trader-fear-index .tfi-score-readout { display: flex; align-items: baseline; gap: 5px; }

#trader-fear-index .tfi-score {
    color: var(--sentiment-color);
    font: 500 26px/1 'JetBrains Mono', monospace;
    font-variant-numeric: tabular-nums;
    letter-spacing: -.06em;
    text-shadow: none;
    animation: none;
    -webkit-font-smoothing: auto;
}

#trader-fear-index .tfi-score-total { color: #676767; font-size: 8px; }
#trader-fear-index .tfi-summary { display: flex; flex-direction: column; gap: 4px; text-align: right; }
#trader-fear-index .tfi-caption { color: #6e6e6e; font-size: 7px; letter-spacing: .05em; }

#trader-fear-index .tfi-rating {
    color: var(--sentiment-color);
    font: 500 10px/1.2 'JetBrains Mono', monospace;
    letter-spacing: .04em;
}

#trader-fear-index .tfi-bar-chart { height: 6px; gap: 2px; }

#trader-fear-index .tfi-seg {
    background: #242424;
    border-radius: 0;
    box-shadow: none;
    transition: background-color .2s ease;
    transition-delay: 0ms;
    animation: none;
}

#trader-fear-index .tfi-seg.active {
    background: var(--sentiment-color);
    color: var(--sentiment-color);
    box-shadow: none;
    animation: none;
}

#trader-fear-index .tfi-scale-labels {
    display: flex;
    justify-content: space-between;
    margin-top: -3px;
    color: #696969;
    font-size: 7px;
    line-height: 1.2;
}

#trader-fear-index .tfi-vix-ref {
    flex: 1;
    min-width: 0;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
    text-align: right;
    margin: 0;
    font: 7px/1.3 'JetBrains Mono', monospace;
    letter-spacing: 0;
    color: #767676;
}

#trader-fear-index .tfi-damage-number { font-size: 12px; text-shadow: none; }

:is(.terminal-window, .terminal-native-panel) #sector-heatmap .market-map-widget-host {
    min-height: 0;
    max-height: none;
}

@media (min-width: 769px) {
    /* Keep the map usable when the dashboard is shorter than the column. */
    .right-col:has(> #sector-heatmap) {
        overflow-y: auto;
        scrollbar-width: thin;
        scrollbar-color: #343434 transparent;
    }
    .right-col:has(> #sector-heatmap):focus-visible {
        outline: 1px solid #b49259;
        outline-offset: 2px;
    }
    .right-col > #sector-heatmap {
        flex: 1 0 290px;
        min-height: 290px;
    }
}

@media (max-width: 768px) {
    :is(#sector-heatmap, #trader-fear-index) .widget-header { min-height: 30px; }
    #trader-fear-index { height: auto; min-height: 104px; }
}
