#custom-weather-radar {
    width: 100%
}

.loading-spinner {
    left: unset !important;
}

.tnt-weather-radar {
    background: unset;
    margin-bottom: 0;
}

.tnt-weather-radar > div {
    border-radius: var(--weather-border-radius);
}

/* Tool styling */
.wxmap--src-widgets-map-components-layouts-default-top-bar-top-bar__root.wxmap--src-widgets-map-components-layouts-default-top-bar-top-bar__dark-gray,
.wxmap--src-widgets-map-components-layouts-default-timeline-timeline-time__root.wxmap--src-widgets-map-components-layouts-default-timeline-timeline-time__dark-gray,
.wxmap--src-widgets-map-components-layouts-default-timeline-timeline-controls__root.wxmap--src-widgets-map-components-layouts-default-timeline-timeline-controls__dark-gray,
.wxmap--src-widgets-map-components-layouts-default-timeline-timeline-slider__root.wxmap--src-widgets-map-components-layouts-default-timeline-timeline-slider__dark-gray,
.wxmap--src-widgets-map-components-layouts-default-common-button__root.wxmap--src-widgets-map-components-layouts-default-common-button__dark-gray,
.wxmap--src-widgets-map-components-layouts-default-timeline-timeline-mode__root.wxmap--src-widgets-map-components-layouts-default-timeline-timeline-mode__dark-gray .wxmap--src-widgets-map-components-layouts-default-timeline-timeline-mode__label {
    background: rgba(0, 0, 0, 0.3);
    color: white;
}

.wxmap--src-widgets-map-components-layouts-default-top-bar-legends-legends__root.wxmap--src-widgets-map-components-layouts-default-top-bar-legends-legends__dark-gray .wxmap--src-widgets-map-components-layouts-default-top-bar-legends-legends__legend {
    background: rgba(0,0,0,0);
}

.wxmap--src-widgets-map-components-layouts-default-top-bar-top-bar-title__root.wxmap--src-widgets-map-components-layouts-default-top-bar-top-bar-title__dark-gray .wxmap--src-widgets-map-components-layouts-default-top-bar-top-bar-title__title {
    color: white;
}

.wxmap--src-widgets-map-components-layouts-default-common-button__icon,
.wxmap--src-widgets-map-components-layouts-default-timeline-timeline-controls__root.wxmap--src-widgets-map-components-layouts-default-timeline-timeline-controls__dark-gray .wxmap--src-widgets-map-components-layouts-default-timeline-timeline-controls__icon {
    fill: white;
}

.wxmap--src-widgets-map-components-layouts-default-common-button__root_icon {
    width: 26px;
    height: 28px;
}

.wxmap--src-widgets-map-components-layouts-default-zoom-zoom__button {
    border: none;
    margin: 1px 0;
}

/* Zoom icons */
.wxmap--src-widgets-map-components-layouts-default-zoom-zoom__root {
    left: 4px;
    top: 203px;
}

.wxmap--src-widgets-map-components-layouts-default-common-button__root_icon .wxmap--src-widgets-map-components-layouts-default-common-button__icon {
    width: 12px;
    height: 12px;
    top: 9px;
    left: 7px;
}

div.wxmap--src-widgets-map-components-layouts-default-zoom-zoom__root > button:nth-child(1) {
    border-radius: 4px 4px 0 0;
}

div.wxmap--src-widgets-map-components-layouts-default-zoom-zoom__root > button:nth-child(2) {
    border-radius: 0 0 4px 4px;
}

/* Slider */
.wxmap--src-widgets-map-components-layouts-common-slider__fill_horizontal {
   background: #ffcb27;
}

/* Show/Hide tools*/
.wxmap--src-widgets-map-components-layouts-default-top-bar-top-bar__dark-gray,
.wxmap--src-widgets-map-components-layouts-default-map-ui-map-ui__navbar,
.__wxmap_MapboxAttribution,
.wxmap--src-widgets-map-components-layouts-default-zoom-zoom__root {
    transition: all 500ms ease-in-out;
}

.wxmap--src-widgets-map-components-layouts-default-top-bar-top-bar__dark-gray,
.wxmap--src-widgets-map-components-layouts-default-map-ui-map-ui__navbar,
.wxmap--src-widgets-map-components-layouts-default-zoom-zoom__root {
    /*opacity: 0;*/
}

.custom-hide.wxmap--src-widgets-map-components-layouts-default-top-bar-top-bar__dark-gray {
    top: -36px;
    opacity: 0;
}

.custom-hide.wxmap--src-widgets-map-components-layouts-default-map-ui-map-ui__navbar {
    bottom: -36px;
    opacity: 0;
}

.displace.__wxmap_MapboxAttribution{
    bottom: 0px !important;
}

.custom-hide.wxmap--src-widgets-map-components-layouts-default-zoom-zoom__root {
    left: -36px;
    opacity: 0;
}

.custom-show {
    opacity: 1;
}