/* Fullscreen background color fix */
/* Ensure proper background color in fullscreen mode */

/* Apply to the fullscreen container with high specificity */
body .fullscreen-mode,
body #fullPageStrategyMapContainer.fullscreen-mode,
body .strategy-map-container.fullscreen-mode,
body div.fullscreen-mode {
    background-color: #0a2340 !important; /* Match the header bar color */
    background-image: none !important;
}

/* Also apply to the pseudo-element backdrop */
.fullscreen-mode::backdrop,
#fullPageStrategyMapContainer:fullscreen::backdrop,
.strategy-map-container:fullscreen::backdrop,
#fullPageStrategyMapContainer::backdrop {
    background-color: #0a2340 !important;
    background: #0a2340 !important;
}

/* For browsers that support :fullscreen */
:fullscreen,
#fullPageStrategyMapContainer:fullscreen,
.strategy-map-container:fullscreen {
    background-color: #0a2340 !important;
    background-image: none !important;
}

/* For webkit browsers */
:-webkit-full-screen,
#fullPageStrategyMapContainer:-webkit-full-screen,
.strategy-map-container:-webkit-full-screen {
    background-color: #0a2340 !important;
    background-image: none !important;
}

/* For Firefox */
:-moz-full-screen,
#fullPageStrategyMapContainer:-moz-full-screen,
.strategy-map-container:-moz-full-screen {
    background-color: #0a2340 !important;
    background-image: none !important;
}

/* For IE/Edge */
:-ms-fullscreen,
#fullPageStrategyMapContainer:-ms-fullscreen,
.strategy-map-container:-ms-fullscreen {
    background-color: #0a2340 !important;
    background-image: none !important;
}

/* Apply to any element in fullscreen mode */
*:fullscreen {
    background-color: #0a2340 !important;
}

/* Ensure the canvas container remains transparent */
.fullscreen-mode .strategy-map-canvas-container,
:fullscreen .strategy-map-canvas-container {
    background-color: transparent !important;
    background: transparent !important;
}