@import "../node_modules/maplibre-gl/dist/maplibre-gl.css";

body {
    margin: 0 auto;
}

#wrapper {
    width: 100%;
}

.mainContent {
    width: 100%;
}

.mapContainer {
    width: 100%;
    height: 450px;
}

.layerTitle, .formTitle {
    margin-bottom: 5px;
}
.attribution  {
    margin-left: 10px; 
}

/* The following will need to be fixed in EUI too */


.maplibre-popup-close-button {
    padding-left: 7px;
    padding-right: 7px;
}

.euiSideNavItem__items {
    overflow-x: hidden;
    overflow-y: auto;
    max-height: 1235px;
}

.euiPage--paddingMedium .euiPageSideBar {
    min-width: 220px;
}

.euiSideNavItem--root.euiSideNavItem--rootIcon 
> .euiSideNavItem__items {
    margin-left: 10px;
}

/* Harcode the EUI icon, instead of maplibre default */
.mapboxgl-ctrl button.mapboxgl-ctrl-fullscreen .mapboxgl-ctrl-icon, .maplibregl-ctrl button.maplibregl-ctrl-fullscreen .maplibregl-ctrl-icon
{
    background-image: url("data:image/svg+xml,%0A%3Csvg xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' width='16' height='16' viewBox='0 0 16 16'%3E%3Cg fill-rule='evenodd'%3E%3Cpath d='M13,3 L13,7 L12,7 L12,4 L9,4 L9,3 L13,3 Z M3,3 L7,3 L7,4 L4,4 L4,7 L3,7 L3,3 Z M13,13 L9,13 L9,12 L12,12 L12,9 L13,9 L13,13 Z M3,13 L3,9 L4,9 L4,12 L7,12 L7,13 L3,13 Z M0,1.99406028 C0,0.892771196 0.894513756,0 1.99406028,0 L14.0059397,0 C15.1072288,0 16,0.894513756 16,1.99406028 L16,14.0059397 C16,15.1072288 15.1054862,16 14.0059397,16 L1.99406028,16 C0.892771196,16 0,15.1054862 0,14.0059397 L0,1.99406028 Z M1,1.99406028 L1,14.0059397 C1,14.5539384 1.44579254,15 1.99406028,15 L14.0059397,15 C14.5539384,15 15,14.5542075 15,14.0059397 L15,1.99406028 C15,1.44606163 14.5542075,1 14.0059397,1 L1.99406028,1 C1.44606163,1 1,1.44579254 1,1.99406028 Z'/%3E%3C/g%3E%3C/svg%3E%0A");
}

.mapboxgl-ctrl button.mapboxgl-ctrl-shrink .mapboxgl-ctrl-icon, .maplibregl-ctrl button.maplibregl-ctrl-shrink .maplibregl-ctrl-icon
{
    background-image: url("data:image/svg+xml,%3Csvg width='16' height='16' viewBox='0 0 16 16' xmlns='http://www.w3.org/2000/svg' class='euiIcon eui-alignMiddle css-1h0bwsh-euiIcon-m-isLoaded' role='img' data-icon-type='fullScreenExit' data-is-loaded='true' aria-hidden='true'%3E%3Cpath d='M9 7V3h1v3h3v1H9zM7 7H3V6h3V3h1v4zm2 2h4v1h-3v3H9V9zM7 9v4H6v-3H3V9h4zM0 1.994C0 .893.895 0 1.994 0h12.012C15.107 0 16 .895 16 1.994v12.012A1.995 1.995 0 0114.006 16H1.994A1.995 1.995 0 010 14.006V1.994zm1 0v12.012c0 .548.446.994.994.994h12.012a.995.995 0 00.994-.994V1.994A.995.995 0 0014.006 1H1.994A.995.995 0 001 1.994z'%3E%3C/path%3E%3C/svg%3E");
}

/* Pop up feature list */

dl.popup_feature_list dt {
    font-weight: bold;
    font-size: 0.64286rem;
    color: #343741;
}

dl.popup_feature_list dd {
    font-size: 0.85714rem;
}

dl.popup_feature_list dd:not(:last-child){
    margin-bottom: 5px;
}

/* dark mode tweaks */
body[data-eui-mode="dark"] .maplibregl-ctrl-fullscreen,
body[data-eui-mode="dark"] .maplibregl-ctrl-attrib,
body[data-eui-mode="dark"] .maplibregl-ctrl-shrink
{
    background-color: #63635c;
}

body[data-eui-mode="dark"][data-eui-theme="borealis"] .maplibregl-ctrl-fullscreen,
body[data-eui-mode="dark"][data-eui-theme="borealis"] .maplibregl-ctrl-attrib,
body[data-eui-mode="dark"][data-eui-theme="borealis"] .maplibregl-ctrl-shrink {
    background-color: #2a57a0;
}