@import 'https://api.mapbox.com/mapbox-gl-js/v1.12.0/mapbox-gl.css';

#content {
    display        : flex;
    flex-direction : column;
    flex           : 1;
}

#main {
    display        : flex;
    flex-direction : row;
    flex           : 1 1 100%;

    .b-resource-header {
        height : 100%;
    }

    > .b-panel .b-toolbar {
        height                 : 5em;
        border-bottom          : 1px solid var(--b-grid-header-border-color);

        --b-toolbar-background : var(--b-grid-header-background);

        .widget-title {
            display     : flex;
            align-items : center;
            font-size   : 1.2em;
        }
    }
}

/* Tweak the bordered style to use darker shades */
.b-sch-event-wrap {
    --b-sch-event-box-shadow : var(--b-elevation-1);

    .b-sch-event-content {
        flex-direction  : column;
        justify-content : center;
        align-items     : flex-start;
    }
}

.b-sch-event-content {
    display         : flex;
    height          : 100%;
    flex-direction  : column;
    justify-content : space-evenly;
}

.event-name {
    font-size : 1.3em;
}

.location {
    display     : block;
    margin-top  : 0.3em;
    font-weight : normal;
}

.fa-map-marker-alt {
    margin-inline : 1px 0.4em; /* Clipped to the left without for some reason */
}

/* Mapbox CSS adaptions */

.mapboxgl-popup-anchor-top {
    .mapboxgl-popup-tip {
        border-bottom-color : var(--b-neutral-100);
    }
}

.mapboxgl-popup-anchor-right {
    .mapboxgl-popup-tip {
        border-inline-start-color : var(--b-neutral-100);
    }
}

.mapboxgl-popup-anchor-bottom {
    .mapboxgl-popup-tip {
        border-top-color : var(--b-neutral-100);
    }
}

.mapboxgl-popup-anchor-left {
    .mapboxgl-popup-tip {
        border-inline-end-color : var(--b-neutral-100);
    }
}

/* Tooltip is misaligned when anchored to bottom (which Mapbox calls 'top') */
.mapboxgl-popup.mapboxgl-popup-anchor-top {
    margin-top : -1.2em;
}

.mapboxgl-popup-content {
    padding        : 1em;
    box-shadow     : 0 1px 3px rgba(0, 0, 0, .5);
    pointer-events : none;
    background     : var(--b-neutral-100);

    transition     : background .2s;
}

.mapboxgl-popup-close-button {
    display : none;
}

.mapboxgl-popup .event-name {
    display     : block;
    margin      : 0 0 1.5em 0;
    font-size   : 1.4em;
    font-weight : bold;
}

.mapboxgl-marker {
    cursor : pointer;
}

.mapboxgl-canvas:focus {
    outline : none !important;
}

/* EOF Mapbox CSS adaptions */

.address-results .b-list-item i {
    font-size : 1.5em;
    margin    : 0 0.7em 0 0.2em;
}

.address-container {
    display        : flex;
    flex-direction : column;
}

.address-name {
    flex          : 1;
    margin-bottom : 0.4em;
    font-size     : 1.1em;
}

.lat-long {
    flex      : 1;
    color     : #bbb;
    font-size : 0.9em;
}

.b-drag-proxy .b-sch-event-wrap {
    position : static;
    opacity  : 0.6;
}

.ag-root-wrapper {
    border-radius : 0;
    border-top    : 0;
}

.b-panel-content.b-ag-grid-panel-content {
    padding : 0;
}