/* ============================================================================ */
/* ============================================================================ */
/* Overwirte OEWM-MVC */
/* This is only temporary and should be replaced with propper styling once the
   sidebar is outside MVC!
/* ============================================================================ */
/* ============================================================================ */

/* MAP */

.oewm-mapviewer-component-map {
    margin-top: 0 !important;
    height: 100% !important;
    position: relative !important;
    top: unset !important;
}

/* Zoom control */
.oewm-mapviewer-component-map .leaflet-control-zoom,
.oewm-mapviewer-component-map .leaflet-control-zoom * {
    font-size: 20px;
}

/* Zoom level */
.oewm-mapviewer-component-map .leaflet-control-zoom-display,
.oewm-mapviewer-component-map .leaflet-control-zoom-display * {
    font-size: 16px;
}

/* Location */
.oewm-mapviewer-component-map .leaflet-control-locate,
.oewm-mapviewer-component-map .leaflet-control-locate * {
    font-size: 20px;
}

    .oewm-mapviewer-component-map .leaflet-control-locate a {
        display: flex;
        justify-content: center;
        align-items: center;
    }

/* Scale control */
.oewm-mapviewer-component-map .leaflet-control-scale,
.oewm-mapviewer-component-map .leaflet-control-scale * {
    font-size: 12px;
}

/* Attribution control */
.oewm-mapviewer-component-map .leaflet-control-attribution,
.oewm-mapviewer-component-map .leaflet-control-attribution * {
    font-size: 12px;
}

/* SIDEBAR */

/* SIDEBAR HIDDEN (initial) */

.oewm-mapviewer-component-info {
   /* Size */
   min-width: 100vw;
   width: 100%;
   max-width: 100vw;
   height: 100%;

   /* hide outside the canvas */
   transform: translateY(100%); 
}

@media (min-width: 480px) {

    .oewm-mapviewer-component-info {
        /* Size */
        min-width: 395px;
        width: 480px;
        max-width: 40%;

        /* hide outside the canvas */
        transform: translateY(0) translateX(-100%);
    }
}

/* SIDEBAR ACTIVE (visible header) */

.oewm-mapviewer-component-info.active {
   /* open only partially to see the header */
   transform: translateY( calc(100% - 180px) ); 
}

@media (min-width: 480px) {

    .oewm-mapviewer-component-info.active {
        /* fully open */
        transform: translateY(0) translateX(0);
    }
}

/* SIDEBAR OPEN (completely open) */

.oewm-mapviewer-component-info.fullSize {
   /* Position */
   transform: translateY(0); /* move up to show header */
}

@media (min-width: 480px) {

    .oewm-mapviewer-component-info.fullSize {
        /* fully open */
        transform: translateY(0) translateX(0);
    }
}

/* --------------- */

.oewm-mapviewer-component-info * {
   color: var(--col-grey-dark);
   font-size: 12.5px;
   box-sizing: initial;
}

.oewm-mapviewer-component-info #feature-name {
   font-size: 20px;
   font-weight: bold;
}

.oewm-mapviewer-component-info #feature-category {
   font-size: 16px;
}

.oewm-mapviewer-component-info h3 {
   margin: 20px 0;
}

.oewm-mapviewer-component-info h4 {
   font-weight: bold;
}

#show-info {
    top: 10px;
}

#decrease-info span,
#increase-info span,
#hide-info span,
#show-info span {
    font-size: 20px;
    color: var(--col-green);
}

#close-info span {
    font-size: 20px;
    color: var(--col-red);
}


.oewm-mapviewer-component-info .geology-chart-subcat-label,
.oewm-mapviewer-component-info .geology-chart-legend-entry-label {
    font-size: 10px;
    text-decoration: none;
}

.oewm-mapviewer-component-info .climate-table-label-cat {
    color: var(--col-green);
}

.oewm-mapviewer-component-info .wine_red_color {
    color: var(--col-red);
}

.oewm-mapviewer-component-info .wine_white_color {
    color: var(--col-green);
}

.oewm-mapviewer-component-info a {
    color: var(--col-green);
    font-style: italic;
    text-decoration: none;
}

.oewm-mapviewer-component-info .geology-chart-axis *,
.oewm-mapviewer-component-info .chart_hundred,
.oewm-mapviewer-component-info .chart_zero {
    font-size: 11px;
}

.oewm-mapviewer-component-info a:hover {
   color: var(--col-green-light);
}

.oewm-mapviewer-component-info button * {
   color: #FFFFFF;
}

/* ============================================================================ */
/* ============================================================================ */
/* Modal */
/* ============================================================================ */
/* ============================================================================ */


/* ============================================================================ */
/* ============================================================================ */
/* Z Index (incomplete overview!) */
/* ============================================================================ */
/* ============================================================================ */

/* 600 ....... .rk-header */

/* 500 ....... .rk-dialog */

/* 450 ....... .oewm-mapviewer-component-info */

/* 420 ....... .leaflet-control-container, .origin-container, #herkunft-info, #show-info */

/* 410 ....... #eu-logo */

/* 400 ....... .rk-map-wrap > .oewm-mapviewer-component-map > .leaflet-pane */

/* ============================================================================ */

/* Sidebar (inside oewm-mvc) */
.oewm-mapviewer-component-info {
    z-index: 450 !important;
}

/* Leaflet container for controls: */
.leaflet-control-container,
.leaflet-control-container *,
/* Control button for origin "layers": */
.origin-container,
.origin-container *,
/* Control menu for origin "layers": */
#herkunft-info,
#herkunft-info *,
/* Toggle button for the sidebar when closed: */
#show-info,
#show-info * {
    z-index: 420 !important;
}

.origin-container {
    position: absolute;
    top: var(--map-edge-spacing);
    right: var(--map-edge-spacing);
    width: fit-content;
}

.origin-button {
    position: unset !important;
    top: unset !important;
    right: unset !important;
}

#herkunft-info {
    top: var(--map-edge-spacing);
}