@charset "UTF-8";
    @import url("https://fonts.googleapis.com/css2?family=Inter&display=swap");

    .input {
        border-color: #BCC7D4;
        box-shadow: none;
        background-color: white;
    }

    .input:focus {
        border: 2px solid #0936dd;
        box-shadow: none;
    }

    .input:disabled {
        background-color: #F9FAFB;
    }

    .button {
        font-weight: bold;
        text-transform: uppercase;
    }

    .notification {
        height: 100%;
        border: 1px solid #BCC7D4;
    }

    .box {
        box-shadow: none !important;
        height: 100%;
    }

    .card {
        height: 100%;
        border: 1px solid #9DAEC1;
        box-shadow: none !important;
    }


    a,
    .has-text-link {
        text-decoration: none;
        color: #0936dd;
    }

    .sectionDivider {
        height: 4px;
    }

    hr {
        height: 1px;
        background-color: #BCC7D4;
    }

    .label {
        text-transform: uppercase;
    }

    .smallHyperlink {
        font-size: small;
        color: #0936dd;
    }

    .smallItalics {
        font-size: small;
        font-style: italic;
        color: #3B4A5B;
        margin-top: 0.25rem;
    }

    .gradientBackground {
        background-image: radial-gradient(circle, #E9EDF1, #9DAEC1);
    }

    .title {
        color: black;
    }

    .notification .title {
        color: black
    }

    .notification-container {
        position: fixed;
        /* Fixes the container relative to the viewport */
        bottom: 20px;
        /* Adjusts the distance from the bottom of the page */
        left: 50%;
        /* Moves the left edge to the center of the page */
        transform: translateX(-50%);
        /* Shifts the container left by half its width to center it precisely */
        z-index: 1000;
        /* Ensures the notification is above other content */
        width: 90%;
        /* Optional: Adjust width for responsiveness, a max-width can also be set */
        max-width: 800px;
        /* Optional: Set a maximum width for better presentation */
    }

    [x-cloak] {
        display: none !important;
    }

    .top-navbar {
        z-index: 4;
    }

    div.top-navbar {
        position: fixed;
        display: flex;
        height: 3.25rem;
        top: 0;
        left: 0;
        justify-content: space-between;
        align-items: center;
        padding: 0.5rem;
        width: 100%;
        overflow: visible;
    }

    .bottomRightFAB {
        position: fixed;
        right: 16px;
        bottom: 16px;
        padding: 5px;
    }

    .modal-close {
        position: absolute;
    }

    .modal-close::before,
    .modal-close::after {
        background-color: #BCC7D4;
        content: "";
        display: block;
        left: 50%;
        position: absolute;
        top: 50%;
        transform: translateX(-50%) translateY(-50%) rotate(45deg);
        transform-origin: center center;
    }


    .modal-close:hover,
    .modal-close:focus {
        background-color: #E9EDF1;
    }

    gmp-map {
        height: 400px;
    }

    .topBottomBorder {
        border-top: 1px solid #BCC7D4;
        border-bottom: 1px solid #BCC7D4;
        padding-top: 0.5rem;
        padding-bottom: 0.5rem;
        background-color: #FFFBEB;
        color: black;
    }

    .has-background-primary-95 {
        background-color: #e7ecfe;
        border-bottom: 1px solid #BCC7D4;
    }

    .has-background-info-95 {
        border-bottom: 1px solid #BCC7D4;
    }

    .card {
        background-color: white;
    }

    /* The following style hides the triangle for HTML accordion  */
    details>summary {
        list-style: none;
    }

    summary::-webkit-details-marker {
        display: none
    }