
:root {
    --indices-pressure-dashed-val-weekly: -25.04;
    --indices-pressure-dashed-color-weekly: #CCCCCC;
    --indices-pressure-solid-val-weekly: -50.08;
    --indices-pressure-solid-color-weekly: #ffffff;

    --indices-pressure-dashed-val-daily: -26.85;
    --indices-pressure-dashed-color-daily: #888888;
    --indices-pressure-solid-val-daily: -53.7;
    --indices-pressure-solid-color-daily: #ffffff;

    --indices-move-pos-solid-val-weekly: 48.45;
    --indices-move-pos-solid-color-weekly: #ffffff;
    --indices-move-pos-dashed-val-weekly: 24.22;
    --indices-move-pos-dashed-color-weekly: #CCCCCC;
    --indices-move-neg-solid-val-weekly: -48.45;
    --indices-move-neg-solid-color-weekly: #ffffff;
    --indices-move-neg-dashed-val-weekly: -24.22;
    --indices-move-neg-dashed-color-weekly: #CCCCCC;

    --indices-move-pos-solid-val-daily: 42.11;
    --indices-move-pos-solid-color-daily: #ffffff;
    --indices-move-pos-dashed-val-daily: 21.05;
    --indices-move-pos-dashed-color-daily: #CCCCCC;
    --indices-move-neg-solid-val-daily: -42.11;
    --indices-move-neg-solid-color-daily: #ffffff;
    --indices-move-neg-dashed-val-daily: -21.05;
    --indices-move-neg-dashed-color-daily: #CCCCCC;
	
    --dxy-dtwexb-close-color: #00ff00;
    --dxy-dtwexb-short-color: #ffff00;
    --dxy-dtwexb-long-color: #ff3333;
    --dxy-dtwexb-spread-color: #ffff00;
    --dxy-dtwexb-spread-mm-color: #ff3333;
    --dxy-variation-eurusd-color: #00ff00;
    --dxy-variation-eurusd-mm-color: #ffffff;
    --dxy-variation-usdjpy-color: #ffff00;
    --dxy-variation-usdjpy-mm-color: #ff00ff;
    --dxy-variation-usdchf-color: #00ffff;
    --dxy-variation-usdchf-mm-color: #0088ff;
    --dxy-variation-usdcad-color: #ff9900;
    --dxy-variation-usdcad-mm-color: #ff3333;}

.timeframe-weekly #logo-price { bottom: 13%; right: 4%; }
.timeframe-weekly #logo-pressure { bottom: 8%; right: 3%; }
.timeframe-weekly #logo-move { bottom: 10%; right: 3%; }

.timeframe-daily #logo-price { bottom: 8%; right: 4%; }
.timeframe-daily #logo-pressure { bottom: 10%; right: 3%; }
.timeframe-daily #logo-move { bottom: 10%; right: 3%; }
.timeframe-daily #logo-aux-pression { bottom: 10%; right: 4%; }
.timeframe-daily #logo-aux-hvshort { bottom: 10%; right: 4%; }
.timeframe-daily #logo-aux-hvlong { bottom: 10%; right: 4%; }
.timeframe-daily #logo-aux-spread { bottom: 10%; right: 4%; }

#zoom-info-wrapper {
    bottom: 5%;
    left: 3%;}

.dxy-extra-canvas {
    position: absolute;
    inset: 0;
    width: 100% !important;
    height: 100% !important;}

.dxy-extra-legend {
    position: absolute;
    top: 48px;
    left: 12px;
    z-index: 12;
    display: flex;
    flex-wrap: wrap;
    gap: 14px;
    font-size: 12px;
    color: #e0e0e0;
    pointer-events: none;}

.dxy-extra-legend-item {
    display: flex;
    align-items: center;
    gap: 6px;}

.dxy-extra-legend-dot {
    width: 8px;
    height: 8px;
    border-radius: 50%;
    flex: 0 0 auto;}

#dxy-dtwexb-toggle.dxy-dtwexb-fixed-button {
    min-width: 0 !important;}

.dxy-dtwexb-spread-panel {
    min-height: 210px;
    height: 24vh;}

#dxy-variation-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    grid-template-rows: repeat(2, minmax(0, 1fr));
    gap: 8px;
    width: 100%;
    height: calc(100vh - 82px);
    min-height: 620px;}

#dxy-variation-grid.is-hidden {
    display: none !important;}

.dxy-variation-panel {
    min-height: 0;
    height: 100%;}

.dxy-variation-panel > .dxy-extra-canvas {
    top: 0;
    bottom: 0;
    height: 100% !important;}

#app-container.dxy-mode-variation #indices-price-panel {
    min-height: 58px;
    height: 58px;}

#app-container.dxy-mode-variation #indices-price-title,
#app-container.dxy-mode-variation #logo-price {
    display: none !important;}

#dxy-dtwexb-logo {
    bottom: 10%;
    right: 4%;}

#dxy-dtwexb-spread-logo {
    bottom: 10%;
    right: 4%;}

#dxy-variation-eurusd-logo {
    bottom: 10%;
    right: 8%;}

#dxy-variation-usdjpy-logo {
    bottom: 10%;
    right: 8%;}

#dxy-variation-usdchf-logo {
    bottom: 10%;
    right: 8%;}

#dxy-variation-usdcad-logo {
    bottom: 10%;
    right: 8%;}

@media (max-width: 900px) {

#dxy-variation-grid {
    grid-template-columns: 1fr;
    grid-template-rows: none;
    height: auto;
    min-height: 0;}

.dxy-variation-panel {
    min-height: 220px;
    height: 30vh;}
}

#app-container.dxy-mode-dtwexb #indices-chart-stack {
    height: calc(100vh - 36px);
    min-height: 0;}

#app-container.dxy-mode-dtwexb #indices-price-panel {
    flex: 0 0 44vh;}

#app-container.dxy-mode-dtwexb #dxy-dtwexb-spread-panel {
    flex: 1 1 auto;
    height: auto;
    min-height: 210px;}

#app-container.dxy-mode-variation .indices-tooltip {
    pointer-events: none;}

#app-container.dxy-mode-dtwexb .indices-tooltip-header,
#app-container.dxy-mode-variation .indices-tooltip-header {
    pointer-events: auto;}
