/*Layout style Start*/

.summer-img {
    width: 100%;
    max-width: 520px;
    object-fit: cover;
    aspect-ratio: 4 / 2;
}

.layout-btn-darkblue {
    min-width: 150px;
}

.layout-btn-darkblue {
    background-color: var(--orange);
    color: var(--font-black);
    box-shadow: 5px 5px 5px darkgrey;
    font-weight: bold;
}

    .layout-btn-darkblue:hover, .btn-darkblue:focus, btn.btn-darkblue:active {
        background-color: var(--orange) !important;
        color: var(--font-black) !important;
    }

.navLeft-img {
    object-fit: cover;
}

.navbar-toggler-custom {
    font-size: 24px;
    margin: 4px 0;
}

.nav-link-pointer {
    cursor: pointer;
}

.nav-link-btn {
    background: none;
    border: none;
    cursor: pointer;
    color: inherit;
    padding: 0.5rem 0;
}

.padding-top-20 {
    padding-top: 20px;
}
/*Layout style end*/
/*Timeout pop-up style Start*/
.timeout-dialog {
    border-radius: 0.5rem;
    top: calc(50vh - 128px);
    font-family: inherit;
}

.ui-dialog {
    padding: 0;
}

.ui-widget-header, .ui-widget-content {
    border: none;
}

.ui-dialog .ui-dialog-titlebar {
    background-color: white;
}

.ui-dialog .ui-dialog-title {
    white-space: normal;
    text-overflow: initial;
    font-size: 24px;
}

.ui-dialog-titlebar-close {
    display: none;
}

.ui-dialog .ui-dialog-buttonpane .ui-dialog-buttonset {
    display: flex;
    justify-content: center;
    float: none;
    flex-direction: column;
    padding: 0 16px;
}

.ui-dialog .ui-dialog-buttonpane button {
    background-color: var(--orange);
    color: var(--font-black);
    box-shadow: 5px 5px 5px darkgrey;
    border: 1px solid transparent;
    border-radius: 0.375rem;
    padding: 0.375rem 0.75rem;
    transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
    font-weight: bold;
    outline: 0px;
}

    .ui-dialog .ui-dialog-buttonpane button#timeout-sign-out-button {
        background-color: white;
        color: var(--darkblue);
        border: 1px solid var(--darkblue);
    }
/*Time out pop-up style End*/

/*Footer Styles Start*/

.centered-container {
    margin: 0 auto;
    max-width: 768px;
    padding: 0 15px;
}

.vertical-bar {
    font-size: 22px;
    vertical-align: -5px;
}

.button-style {
    padding: 0 16px;
}

.close-modal-btn {
    border: 3px solid black;
    border-radius: 50%;
    width: 27px;
    height: 27px;
}

.page-title1 {
    color: var(--font-black);
}
/*Footer Styles End*/

/*Terms and condition Styles Start*/

.font-bold-large {
    font-size: 22px;
    font-weight: bold;
}
/*Terms and condition Styles End*/

/*Exit Modal Styles Start*/
.exit-modal-dialog-centered {
    padding-top: calc(50vh - 200px);
}

.exit-modal-flex-center-margin {
    display: flex;
    justify-content: center;
    margin: 16px;
}

.exit-modal-min-width-200 {
    min-width: 200px;
}
/*Exit Modal Styles End*/

/* AddEthnicity Dropdown Styles start*/
.dropdown-menu {
    max-height: 200px;
    overflow-y: auto;
    position: relative;
    width: 100%;
}

    .dropdown-menu li {
        padding: 5px;
    }

        .dropdown-menu li label {
            width: 100%;
            display: block;
            cursor: pointer;
        }

#raceDropdown1, #newDropdown, #ancestryDropdown {
    width: 100%;
    background-color: white;
    text-wrap: auto;
    display: flex;
    justify-content: space-between;
}

    #raceDropdown1:hover, #newDropdown:hover, #ancestryDropdown:hover,
    #raceDropdown1:focus, #newDropdown:focus, #ancestryDropdown:focus,
    #raceDropdown1:active, #newDropdown:active, #ancestryDropdown:active {
        background-color: white;
    }

    #raceDropdown1::after, #newDropdown::after, #ancestryDropdown::after {
        margin: 10px;
        float: right;
    }

    #raceDropdown1 .caret, #newDropdown .caret, #ancestryDropdown .caret {
        display: none;
    }

.addEthnicity-form-title {
    font-size: 16px;
}

#raceDropdown1, #newDropdown {
    color: #555555;
}
/* AddEthnicity Dropdown Styles end*/

/* AddContactDetails Styles start */
.form-section.padding-top-neg-5 {
    padding-top: -5px;
}

.hide {
    display: none !important;
}




.circle-border {
    border: 3px solid black;
    border-radius: 50%;
    width: 27px;
    height: 27px;
}

.flex-center-margin {
    display: flex;
    justify-content: center;
    margin: 16px;
}

.btn-min-width {
    min-width: 200px;
}
/* AddContactDetails Styles end */

/* AddHouseHoldmemberDetails Styles start */
.font-weight {
    font-weight: bold
}
/* AddHouseHoldmemberDetails Styles end */

/* Stop Styles start */
.square-white {
    background-color: white;
    width: 25px;
    height: 25px;
}
.captcha-error-none {
    display: none;
}
/* Stop Styles end */

/* How this works Styles start */

.img-custom-filter {
    filter: brightness(0) saturate(100%) invert(26%) sepia(100%) saturate(2158%) hue-rotate(187deg) brightness(65%) contrast(105%);
    height: 78px;
    width: 78px;
}
/* How this works Styles end */

/* Add sign Styles start */

.pl-16 {
    padding-left: 16px;
}

.sign-Name-width {
    width: 50%;
}

/* Add sign Styles end */


/* Add Student Styles start */

.icon-angle-down-custom {
    position: absolute;
    margin: 10px;
    right: -5px;
    top: 1px;
    font-size: 12px;
}

.modal-dialog-custom-width {
    max-width: 768px;
}

.button-container-padding {
    padding: 0 16px;
}

.close-btn-custom {
    border: 1px solid black;
    border-radius: 50%;
    width: 27px;
    height: 27px;
}

.ui-autocomplete {
    max-height: 300px;
    overflow-y: auto;
    /* prevent horizontal scrollbar */
    overflow-x: hidden;
    /* add padding to account for vertical scrollbar */
    padding-right: 20px;
}
/* IE 6 doesn't support max-height
        * we use height instead, but this forces the menu to always be this tall
        */
* html .ui-autocomplete {
    height: 300px;
}
/* Add Student Styles end */

/* Add Income Styles start */
.form-section-splitthree input, .form-section-splitthree select {
    width: 33%
}

/*.form-section-splitthree {
    display: flex;
    gap: 8px;
}

    .form-section-splitthree input {
        max-width: 33%;
    }
*/

.custom-disabled {
    color: #000; /* Set the text color to black */
    background-color: #fff; /* Set the background color to white */
    border: 1px solid #000; /* Set the border to match the enabled input */
    opacity: 1; /* Override the default opacity */
    pointer-events: none; /* Keep it disabled */
}
/* Add Income Styles end */

/* App summary Styles start */
.bold-darkblue-bg {
    font-weight: bold;
    background-color: var(--darkblue) !important;
    color: var(--white) !important;
}

/* App summary Styles end */

/* AuthRepresentativ Styles start */
.form-item-half-width {
    width: 50%;
}

/* AuthRepresentativ Styles end */

/* Confirm income style start */

.label-bold-mb10 {
    font-weight: bold;
    margin-bottom: 10px;
    display: block;
}

.p-mb-3 {
    margin-bottom: 3px;
}

.modal-dialog-centered {
    padding-top: calc(50vh - 128px);
}

.flex-center-margin {
    display: flex;
    justify-content: center;
    margin: 16px;
}


/* Confirm income style end */

/* HouseHold style start */
.label-bold-pad {
    font-weight: bold;
    padding: 5px 10px;
    display: inline-block;
}

.modal-dialog-centered {
    padding-top: calc(50vh - 128px);
}

.flex-center-margin {
    display: flex;
    justify-content: center;
    margin: 16px;
}
/* HouseHold style end */


/* Review Student style start */

.pt-25 {
    padding-top: 25px;
}

.modal-dialog-centered {
    padding-top: calc(50vh - 128px);
}

.min-width-200 {
    min-width: 200px;
}

.modal-dialog-centered {
    padding-top: calc(50vh - 128px);
}

.flex-center-margin {
    display: flex;
    justify-content: center;
    margin: 16px;
}
/* Review Student style end */

/* Splash style start */
.responsive-image {
    width: 100%;
    max-width: 520px;
    object-fit: cover;
    aspect-ratio: 4 / 2;
}

.modal-dialog-centered {
    padding-top: calc(50vh - 128px);
}

.circle {
    border: 1px solid black;
    border-radius: 50%;
    width: 27px;
    height: 27px;
}

.flex-center {
    display: flex;
    justify-content: center;
    align-items: center;
}

/* Splash style end */

/* Submit success style start */

.submit-table-cell-padding {
    padding-bottom: 10px;
    padding-top: 10px;
}

.submit-button-container {
    display: flex; /* Enable flexbox layout */
    flex-direction: column; /* Stack buttons vertically */
    justify-content: center; /* Maintain horizontal centering (optional) */
    align-items: center; /* Center buttons horizontally within container (optional) */
}

.submit-table-content {
    align-items: center;
    display: flex;
    justify-content: center;
    margin: 0 auto;
}

.submit-bottom-btn-row {
    display: flex;
    gap: 8px;
}

@media (max-width: 576px) {
    .submit-table-content {
        justify-content: center;
    }

    .submit-bottom-btn-row {
        flex-direction: column;
    }

        .submit-bottom-btn-row a {
            width: 100%;
        }

    .submit-centered-content {
        text-align: center; /* Center text and button container horizontally */
    }
}
/* Submit success style end */

/* Login style start */

.hidden-error {
    visibility: hidden;
    margin-bottom: 10px;
    color: red;
}
/* Login style end */

/* OTP Auth style start */
.text-center {
    text-align: center;
}

.form-item-flex {
    display: flex;
    flex-direction: column;
    align-items: center;
}

.max-width-90 {
    max-width: 90px;
}

.pointer-darkblue {
    cursor: pointer;
    color: var(--darkblue);
}

.error-center-padding {
    color: red;
    text-align: center;
    padding-top: 10px;
}

.margin-custom {
    margin: 0px 8px 16px 8px;
}
/* OTP Auth style end */


/*common style start*/
.btn-min-width-200 {
    min-width: 200px;
}

.font-size-18 {
    font-size: 18px;
}

.cursor-pointer {
    cursor: pointer;
}

.font-size-12 {
    font-size: 12px;
}

.font-size-40 {
    font-size: 40px;
}

.font-bold {
    font-weight: bold;
}

.font-size-24 {
    font-size: 24px;
}

.font-size-14 {
    font-size: 14px;
}

.font-size-20 {
    font-size: 20px;
}

.padding-x-16 {
    padding: 0 16px;
}

.font-size-22 {
    font-size: 22px;
}

.margin-top-30 {
    margin-top: 30px;
}

/*common style end*/

/*casesummary style start*/
.gap-20 {
    gap: 20px;
}

.icon-width-50 {
    width: 50px;
}

.icon-credit-card {
    font-size: 38px;
    width: 50px;
    display: inline-block;
    text-align: center;
}

.img-margin-right-4 {
    margin-right: 4px;
}
/*common style end*/

/*child info style start*/

.small-font-min-height {
    font-size: 9px;
    min-height: 15px;
}

.img-circle-padding {
    border-radius: 50%;
    padding-right: 2px;
}

.prog-details .prog-accord-body {
    display: none;
}

.prog-details.expand .prog-accord-body {
    display: flex;
}

.prog-details .prog-btn button img {
    transform: rotate(0deg);
    transition: transform 0.3s;
}

.prog-details.expand .prog-btn button img {
    transform: rotate(90deg);
}

.prog-btn {
    display: flex;
    justify-content: end;
}

    .prog-btn button {
        padding: 4px;
        font-size: 12px;
        margin-top: 4px;
        margin-right: 8px;
        border-radius: 4px;
        border: 0;
    }

        .prog-btn button:hover {
            background-color: #ddd;
        }

.prog-step.active {
    background-color: var(--primary);
    color: #fff;
    z-index: 2
}

.prog-bar {
    display: flex;
    margin-top: 12px;
}

.prog-step {
    position: relative;
    background-color: #ccc;
    color: #000;
    padding: 4px;
    z-index: 1;
    width: 33%;
    text-align: center;
}

    .prog-step:first-child {
        clip-path: polygon(0% 0%, 90% 0%,100% 50%, 90% 100%, 0 100%);
        -webkit-clip-path: polygon(0% 0%, 90% 0%,100% 50%, 90% 100%, 0 100%);
        border-radius: 16px 0px 0px 16px;
    }

    .prog-step:not(:first-child):not(:last-child) {
        clip-path: polygon(0% 0%, 90% 0%, 100% 50%, 90% 100%, 0% 100%, 10% 50%);
        -webkit-clip-path: polygon(0% 0%, 90% 0%, 100% 50%, 90% 100%, 0% 100%, 10% 50%);
    }

    .prog-step:last-child {
        clip-path: polygon(0% 0%, 100% 0%, 100% 100%,0% 100%, 0% 100%, 10% 50%);
        -webkit-clip-path: polygon(0% 0%, 100% 0%, 100% 100%,0% 100%, 0% 100%, 10% 50%);
        border-radius: 0px 16px 16px 0px;
    }

.status-box {
    border: 1px solid grey;
    box-shadow: 2px 2px 5px #888888;
}

.app-card-title {
    font-weight: bold;
    font-size: 16px;
}

.app-card {
    padding: 4px 16px;
}

.app-card-seperator {
    height: 1px;
    width: 100%;
    background-color: black;
}


.width-50 {
    width: 50px;
}

.font-size-38-width-50 {
    font-size: 38px;
    width: 50px;
}

.margin-right-4 {
    margin-right: 4px;
}
/*child info style end*/

/*Managemy benefits style start*/
.img-responsive-cover {
    width: 100%;
    max-width: 520px;
    object-fit: cover;
    aspect-ratio: 4 / 2;
}

.font-30-bold-black {
    font-size: 30px;
    font-weight: bold;
    color: var(--fontblack);
}
/*Managemy benefits style end*/


/*NewCard Confirmation style start*/

.bg-orange-bold-black {
    background-color: orange;
    color: black;
    font-weight: bold;
}

.optout-label {
    margin-bottom: 10px;
    display: block;
}

.optout-form-item {
    margin-left: 10px;
}
/*NewCard Confirmation style end*/

/*update contact style start*/
.form-section-margin {
    margin-top: -5px;
}

.font-12-margin-top-10 {
    font-size: 12px;
    margin-top: 10px;
}

.circle-border-black {
    border: 3px solid black;
    border-radius: 50%;
    width: 27px;
    height: 27px;
    display: inline-block; /* Ensures proper sizing for div/span */
}

.flex-center-margin-16 {
    display: flex;
    justify-content: center;
    margin: 16px;
}
/*update contact style end*/

/*upload style end*/

.flex-gap-5 {
    display: flex;
    gap: 5px;
}

.text-nowrap {
    text-wrap: nowrap; /* Modern property, but not fully supported everywhere */
    white-space: nowrap; /* Widely supported fallback */
}

.padding-top-calc {
    padding-top: calc(50vh - 200px);
}

.modal-padding-top {
    padding-top: calc(50vh - 128px);
}

.grey-max-content {
    color: grey;
    width: max-content;
}

.flex-nowrap {
    display: flex;
    flex-wrap: nowrap;
}

.filenamediv {
    word-break: break-word;
}
/*upload style end*/