/**
 * CSS override to remove dark background from strategy map
 */

/* Remove dark background from ALL strategy map containers */
.strategy-map-canvas-container,
.strategy-map-container,
#fullPageStrategyMapContainer {
    background-color: transparent !important;
    border: none !important;
    box-shadow: none !important;
    outline: none !important;
}

/* Remove styling from the card container on strategy page */
#strategyPage .card {
    background: transparent !important;
    border: none !important;
    box-shadow: none !important;
    padding: 0 !important;
}

/* Target ANY element with the dark blue background inline style */
[style*="background-color: rgb(0, 24, 51)"],
[style*="background-color:#001833"],
[style*="background-color: #001833"],
[style*="background-color:rgb(0, 24, 51)"],
[style*="background-color:rgb(0,24,51)"] {
    background-color: transparent !important;
}

/* More specific targeting */
#fullPageStrategyMapContainer,
#fullPageStrategyMapContainer.strategy-map-container,
div#fullPageStrategyMapContainer[style] {
    background-color: transparent !important;
    display: flex !important;
    visibility: visible !important;
    opacity: 1 !important;
    border: none !important;
    box-shadow: none !important;
    outline: none !important;
}

/* Target the inner containers as well */
#fullPageStrategyMapContainer .strategy-map-canvas-container,
#strategyMapContainer .strategy-map-canvas-container,
.strategy-map-area .strategy-map-canvas-container,
.strategy-map-canvas-container {
    background-color: transparent !important;
    border: none !important;
    box-shadow: none !important;
    outline: none !important;
}

/* Override any background on the edit window as well */
#edit_window {
    background-color: transparent !important;
}

/* If there's a background on the canvas itself */
#strategy-map-canvas {
    background-color: transparent !important;
    box-shadow: 0 8px 32px rgba(0, 0, 0, 0.6), 0 4px 16px rgba(0, 0, 0, 0.4) !important;
    border-radius: 8px !important;
}