@import url('https://fonts.googleapis.com/css2?family=Open+Sans:ital,wght@0,300..800;1,300..800&display=swap');

:root {
    --primary-color: #00004D;
    --secondary-color: #00B45D;
    --white-color: #fff;
    --black-color: #121212;
    --grey-color: #eeeeee;
    --dark-grey: #dedede;
}

/* CSS Reset */
*,
*::before,
*::after {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

html,
body {
    font-family: "Open Sans", sans-serif !important;
}

body {
    height: 100vh;
    line-height: 1.5 !important;
    -webkit-font-smoothing: antialiased !important;
}

img,
picture,
video,
canvas,
svg {
    display: block !important;
    max-width: 100% !important;
}

input,
button,
textarea,
select {
    font: inherit !important;
    font-size: 0.825rem !important;
}

    input:focus,
    button:focus,
    textarea:focus,
    select:focus {
        box-shadow: none !important;
        border: var(--bs-border-width) solid var(--bs-border-color) !important;
    }

p,
h1,
h2,
h3,
h4,
h5,
h6 {
    overflow-wrap: break-word !important;
}

a {
    text-decoration: none !important;
}

.text-primary {
    color: var(--primary-color) !important;
}

.text-secondary {
    color: var(--secondary-color) !important;
}

.bg-gray {
    background: var(--grey-color);
}

.fs-12 {
    font-size: 12px !important;
}

.fs-13 {
    font-size: 13px !important;
}

.fs-14 {
    font-size: 14px !important;
}

.phone-icon {
    width: 14px;
}

/* Code Starts here */
.home-container {
    height: 90vh !important;
}

.modal-fullscreen {
    height: 100vh !important;
}

.tab-content > .tab-pane {
    height: 85vh;
    height: 85lvh;
    overflow-x: hidden !important;
}

.btn.btn-primary {
    background-color: var(--primary-color) !important;
    color: var(--white-color) !important;
    border-radius: 0.4rem !important;
    border-color: var(--primary-color) !important;
}

.btn.btn-secondary {
    background-color: var(--secondary-color) !important;
    color: var(--white-color) !important;
    border-radius: 0.4rem !important;
    border-color: var(--secondary-color) !important;
}

.btn.btn-outline-primary {
    color: var(--primary-color) !important;
    border-radius: 0.4rem !important;
    border-color: var(--primary-color) !important;
}

.card {
    border-color: var(--dark-grey) !important;
}

.tab-content > .tab-pane {
    overflow-y: scroll !important;
}

.step-counter {
    font-size: 0.825rem !important;
}

.form-select option {
    font-size: 0.825rem !important;
    width: 100vw;
}

.bottom-nav {
    z-index: 1049;
    display: flex !important;
    justify-content: space-around !important;
    background-color: var(--primary-color) !important;
    padding: 12px !important;
    position: fixed !important;
    bottom: 0 !important;
    left: 0 !important;
    width: 100% !important;
}

    .bottom-nav .nav-item {
        display: flex !important;
        align-items: center !important;
        text-decoration: none !important;
        color: var(--white-color) !important;
        padding: 12px 16px !important;
        border-radius: 50px !important;
        background-color: rgba(255, 255, 255, 0) !important;
    }

        .bottom-nav .nav-item span {
            width: 0 !important;
            overflow: hidden !important;
        }

        .bottom-nav .nav-item.active {
            text-decoration: none !important;
            color: var(--white-color) !important;
            background-color: rgba(255, 255, 255, 0.2) !important;
            transition: .2s !important;
        }

            .bottom-nav .nav-item.active span {
                width: 100% !important;
                margin-left: 8px !important;
                transition: .2s !important;
            }

.nav-tabs .nav-link {
    color: var(--bs-secondary-color) !important;
}

    .nav-tabs .nav-link.active {
        font-weight: 700 !important;
        color: var(--primary-color) !important;
    }

.location-icon {
    width: 12px !important;
}

.location-text {
    width: 100% !important;
    font-size: 12px !important;
    overflow: hidden !important;
    display: -webkit-box !important;
    -webkit-line-clamp: 1 !important;
    -webkit-box-orient: vertical !important;
}

.add-appt-btn {
    z-index: 1045;
    position: fixed !important;
    right: 14px !important;
    bottom: 80px !important;
}
