// Common/Global Styles
// Use this file for global styles that don't or won't have their own stylesheet
body {
    font-size: 16px;
    background-color: #fff;
    color: #4D5151;

    .container-fluid {
        max-width: 576px; //Remove once desktop app is complete

        &.container-shadow {
            box-shadow: 0px 0px 6px 0px rgba(0, 0, 0, 0.15); //Use instead of Bootstrap's helper
        }

        &.make-tall {
            height: 100vh;
            display: flex;
            flex-direction: column;
        }

        .prevent-squish {
            overflow-x: unset;
        }
    }

    .pointer {
        cursor: pointer;
    }

    .container,
    .container-fluid {
        overflow: hidden;
    }

    .sub-container {
        &.make-tall {
            height: 100%;
            width: 100%;
            display: flex;
            flex-direction: column;
            overflow-x: hidden;
        }
    }

    .sr-only {
        position: absolute;
        left: -10000px;
        top: auto;
        width: 1px;
        height: 1px;
        overflow: hidden;
    }

    .pac-container {
        z-index: 10000 !important;
    }

    .page-container-grouped-styles {
        @extend .container-fluid, .shadow, .p-0, .position-relative, .make-tall;
    }

    //Footer modal backdrop adjustments for positioning
    .modal-backdrop {
        left: 50%;
        transform: translateX(-50%);
        max-width: 576px;

        &.show {
            opacity: 0.4;
        }
    }

    // Scroll page when modal isn't open
    .fade-on-route-transition {
        height: calc(100% - 10px);
        overflow: auto;
    }

    // Prevent scroll when modal is open
    &.modal-open {
        div.page-container-grouped-styles {
            overflow: hidden;
        }

        .fade-on-route-transition {
            overflow: hidden;
        }
    }

    .modal-text {
        display: inline;
        color: $blue;
        cursor: pointer;
        border: none;
        font-size: 14px;
        line-height: 24px;
        font-weight: 500;
    }
}