* {
    box-sizing: border-box;
    padding: 0;
    margin: 0;
}

html {
    overflow-x: hidden;
    font-size: 62%;
}

body {
    overflow-x: hidden;
}

:root {
    --theme-bg-color: #e9edf0;
    --red-color: #e61238;
    --Inter-Black-fonts: "Inter-Black";
    --Inter-Bold-fonts: "Inter-Bold";
    --Inter-ExtraBold: "Inter-ExtraBold";
    --Inter-ExtraLight-fonts: "Inter-ExtraLight";
    --Inter-Light-fonts: "Inter-Light";
    --Inter-Medium-fonts: "Inter-Medium";
    --Inter-Regular-fonts: "Inter-Regular";
    --Inter-SemiBold-fonts: "Inter-SemiBold";
    --Inter-Thin-fonts: "Inter-Thin";
    --Barlow-font: "Barlow", sans-serif;
}

@media (min-width: 1500px) {
    .container {
        max-width: 1420px;
    }
}

/* Chrome, Safari, Edge, Opera */
input::-webkit-outer-spin-button,
input::-webkit-inner-spin-button {
    -webkit-appearance: none;
    margin: 0;
}

/* Firefox */
input[type="number"] {
    -moz-appearance: textfield;
}

.mx-w100 {
    max-width: 100% !important;
}

.color-red {
    color: var(--red-color) !important;
}

.padd-x25px {
    padding: 0 25px;
}

.padd-x15px {
    padding: 0 15px;
}

.width-60px {
    width: 60px !important;
}

.px-65px {
    padding: 0 65px;
}

.upper-case {
    text-transform: uppercase;
}
.pedtric-pack-content-area{
    display: none;
}
.pedtric-pack-content-area.active{
    display: block;
}
.pedtric-pack-content-area a {
    text-decoration: none;
    cursor: pointer;
    width: 100%;
    display: flex;
    margin: 0 auto;
    align-items: center;
    justify-content: center;
}
.consert-para strong{
    font-weight: bold;
}
.lh-13 {
    line-height: 1.3 !important;
}
.pack-form-area.active {
    display: none;
}
.family-regular {
    font-family: var(--Barlow-font) !important;
    font-weight: 400;
}
.form-input-area.pack-input-area {
    display: flex;
    gap: 20px;
}
::-webkit-scrollbar {
    width: 10px;
}

/* Track */
::-webkit-scrollbar-track {
    box-shadow: inset 0 0 5px grey;
}

/* Handle */
::-webkit-scrollbar-thumb {
    background: red;
}

/* Handle on hover */
::-webkit-scrollbar-thumb:hover {
    background: #b30000;
}

@font-face {
    font-family: "Inter-Black";
    src: url(../font-family/Inter-fonts/static/Inter-Black.ttf);
}

@font-face {
    font-family: "Inter-Bold";
    src: url(../font-family/Inter-fonts/static/Inter-Bold.ttf);
}

@font-face {
    font-family: "Inter-ExtraBold";
    src: url(../font-family/Inter-fonts/static/Inter-ExtraBold.ttf);
}

@font-face {
    font-family: "Inter-ExtraLight";
    src: url(../font-family/Inter-fonts/static/Inter-ExtraLight.ttf);
}

@font-face {
    font-family: "Inter-Light";
    src: url(../font-family/Inter-fonts/static/Inter-Light.ttf);
}

@font-face {
    font-family: "Inter-Medium";
    src: url(../font-family/Inter-fonts/static/Inter-Medium.ttf);
}

@font-face {
    font-family: "Inter-Regular";
    src: url(../font-family/Inter-fonts/static/Inter-Regular.ttf);
}

@font-face {
    font-family: "Inter-SemiBold";
    src: url(../font-family/Inter-fonts/static/Inter-SemiBold.ttf);
}

@font-face {
    font-family: "Inter-Thin";
    src: url(../font-family/Inter-fonts/static/Inter-Thin.ttf);
}

/* header start */

#header {
    background-color: #b6151e;
    /* background-image: url(../images/section-bg-img.png); */
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
    text-align: center;
    padding: 15px 0;
    box-shadow: 0 1px 5.7px 0 #0000005c;
    position: relative;
    z-index: 1;
}

.logo {
    /* background-color: white; */
    max-width: 420px;
    width: 22vw;
}

/* header end */

/* form css start */

#progress-bar {
    background-color: #6868688f;

    height: 12px;
    position: absolute;
    left: 0;
    top: 0;
    transition: 0.3s;
}

.form-section {
    padding: 50px 0;
    background-color: var(--theme-bg-color);
    min-height: calc(100vh - 94px);
    position: relative;
    background-image: url(../images/section-bg-img.png);
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
    background-color: #F6F3E6;
}

.form-step-area {
    text-align: center;
    text-align: -webkit-center;
}

.step-pre-btn,
.Doctors-visits-btn {
    position: absolute;
    font-size: 2rem;
    color: black;
    background-color: transparent;
    border: none;
    top: 30px;
    left: 30px;
}

.form-title {
    font-size: 6rem;
    font-family: var(--Barlow-font);
    font-weight: 700;
    color: var(--red-color);
    text-align: center;
    line-height: 1.2;
}

.bg-left-img {
    position: absolute;
    bottom: 0;
    max-width: 380px;
    width: 20vw;
    left: 0;
}

.form-md-title {
    font-size: 3.4rem;
    font-family: var(--Barlow-font);
    font-weight: 500;
    color: black;
    line-height: 1.2;
    text-align: center;
}

.form-sm-title {
    font-size: 2.4rem;
    font-family: var(--Barlow-font);
    font-weight: 500;
    color: black;
    margin: 10px 0 25px;
    line-height: 1.2;
}

.input-radio-area {
    max-width: 210px;
    width: 100%;
}

.form-label-order {
    font-size: 2rem;
    font-family: var(--Barlow-font);
    font-weight: 500;
    color: black;
    padding: 14px 10px;
    height: 100%;
    width: 100%;
    cursor: pointer;
    background-color: white;
    border-radius: 50px;
    box-shadow: 0 2px 2px 0 #00000045;
    height: 50px;
    display: flex;
    justify-content: center;
    align-items: center;
}

.input-form-radio:checked+.form-label-order {
    background-color: var(--red-color);
    color: white;
}

.flex-input-area {
    margin-bottom: 50px;
}

.input-area {
    max-width: 436px;
    width: 100%;
    margin-bottom: 30px;
}

.form-label {
    font-size: 2rem;
    color: black;
    font-family: var(--Barlow-font);
    font-weight: 400;
    padding: 14px 19px 14px 19px;
    height: 50px;
    border-radius: 20px;
    background: rgb(238, 240, 245);
    background: linear-gradient(183deg,
            rgba(238, 240, 245, 1) 0%,
            rgba(230, 233, 239, 1) 100%);
    margin: 0;
    box-shadow: -12px -12px 20px 0 #ffffffcc, 10px 10px 20px 0 #a6b4c8c9;
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 30px;
    cursor: pointer;
    text-align: start;
    border: 2px solid transparent;
    position: relative;
}

.fa-square-check {
    opacity: 0;
    position: absolute;
    top: 10px;
    right: 10px;
}

.radio-circle {
    display: block;
    height: 20px;
    width: 20px;
    border-radius: 50%;
    position: relative;
    background-color: transparent;
    box-shadow: inset -4px -4px 9px 0 #ffffff, inset 4px 4px 5px 0 #a6b4c894;
}

.radio-circle::before {
    content: " ";
    display: block;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    height: 11px;
    width: 11px;
    border-radius: 50%;
    background: rgb(238, 240, 245);
    background: linear-gradient(195deg,
            rgba(238, 240, 245, 1) 0%,
            rgba(230, 233, 239, 1) 100%);
}


.order-imput:checked+.form-label .radio-circle::before {
    background: var(--red-color);
}

.order-imput:checked+.form-label .fa-square-check {
    opacity: 1;
    color: var(--red-color);
}

.order-imput:checked+.form-label {
    border-color: var(--red-color);
}

.form-btn,
.allergy-step-btn {
    font-size: 2rem;
    font-family: var(--Barlow-font);
    font-weight: 500;
    color: white;
    background-color: var(--red-color);
    max-width: 400px;
    width: 100%;
    height: 50px;
    padding: 10px 10px;
    border-radius: 99px;
    border: none;
    box-shadow: 0 2px 2px 0 #00000070;
}

.form-btn:disabled {
    background-color: #d1d1d1;
    cursor: not-allowed;
}

.form-para {
    font-size: 1.4rem;
    font-family: var(--Barlow-font);
    font-weight: 400;
    color: black;
    line-height: 1.3;
}

.step:not(.active) {
    display: none;
}

.form-sb-title {
    font-size: 2rem;
    font-family: var(--Barlow-font);
    font-weight: 500;
    color: var(--red-color);
    line-height: 1.2;
    /*text-transform: capitalize;*/
}

.mx-width-436 {
    max-width: 436px;
    width: 100%;
}

.select2-hidden-accessible {
    opacity: 0;
    display: none;
    visibility: hidden;
}

.select2.select2-container.select2-container--default {
    font-size: 2rem;
    font-family: var(--Barlow-font);
    font-weight: 500;
    color: black;
    background: rgb(238, 240, 245);
    background: linear-gradient(122deg,
            rgba(238, 240, 245, 1) 0%,
            rgba(230, 233, 239, 1) 100%);
    border: none;
    height: 50px;
    max-width: 436px;
    width: 100% !important;
    padding: 0 0px 0 20px;
    box-shadow: -12px -12px 20px 0 #ffffff9c, 10px 10px 20px 0 #a6b4c8cc;
    border-radius: 5px;
    text-align: start;
    display: flex;
    align-items: center;
}

.selection {
    width: 100%;
    position: relative;
    z-index: 1;
}

.select2-results__option {
    font-size: 2rem;
    font-family: var(--Barlow-font);
    font-weight: 500;
    color: black;
    background: rgb(238, 240, 245);
    background: linear-gradient(122deg,
            rgba(238, 240, 245, 1) 0%,
            rgba(230, 233, 239, 1) 100%);
    height: 50px;
    padding: 0 20px;
    max-width: 436px;
    width: 100% !important;
    border: none;
    display: flex;
    align-items: center;
    border-radius: 5px;
}

.select2-dropdown {
    background-color: transparent;
    background: rgb(238, 240, 245);
    background: linear-gradient(122deg,
            rgba(238, 240, 245, 1) 0%,
            rgba(230, 233, 239, 1) 100%);
    box-shadow: 10px 10px 20px 0 #a6b4c8cc;
    border: none;
    box-sizing: border-box;
    display: block;
    position: absolute;
    left: -100000px;
    width: 100%;
    z-index: 1051;
}

.select2-container--open .select2-dropdown--below {
    border-radius: 0px 0px 5px 5px;
}

.select2-selection__rendered {
    color: unset !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
}

.select2-container--default .select2-results__option--highlighted.select2-results__option--selectable {
    background-color: var(--red-color);
    background: var(--red-color);
    color: white;
}

.select2-selection.select2-selection--single {
    border-radius: unset;
    background-color: transparent;
    height: unset;
    border: none;
}

.select2-selection__arrow {
    display: none;
}

.select2-search__field {
    display: none;
}

.select2-search--dropdown {
    padding: 0;
}

.select2-selection__rendered:focus-visible {
    outline: none;
    border: none;
}

.select-angle {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    right: 20px;
    font-size: 2rem;
    color: black;
    z-index: 0;
}

.select-to-area {
    position: relative;
}

.flex-checkbox {
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-wrap: wrap;
    gap: 25px 20px;
    margin-bottom: 45px;
}

.flex-checkbox .input-area {
    width: 49%;
    margin: 0;
}

.flex-checkbox .input-area .form-label {
    font-size: 1.8rem;
}

.checkbox-square {
    height: 18px;
    max-width: 18px;
    display: block;
    border: 1px solid black;
    position: relative;
    width: 100%;
}

.checkbox-square::before {
    height: 14px;
    width: 14px;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    content: " ";
    background-color: black;
    visibility: hidden;
    transition: 0.1s;
}

.form-checkox:checked+.form-label .checkbox-square::before {
    visibility: visible;
}

.spinner-border {
    width: 50px;
    height: 50px;
    --bs-spinner-vertical-align: -0.125em;
    --bs-spinner-border-width: 6px;
    --bs-spinner-animation-speed: 0.75s;
    --bs-spinner-animation-name: spinner-border;
    border: var(--bs-spinner-border-width) solid currentcolor;
    border-right-color: var(--red-color);
    color: #e6123836;
}

.emergency-medication-list,
.promotion-code-area {
    padding: 40px 40px;
    background-color: white;
    border-radius: 15px;
    box-shadow: 0 4px 4px 0 #00000045;
    max-height: 800px;
    overflow: auto;
    position: relative;
}
.emergency-medication-list .total {

}

.promotion-code-area {
    padding: 20px 20px;
}

.emergency-medication-img-area {
    width: 20.784%;
    height: 150px;
    max-width: 150px;
    border-radius: 5px;
    background: rgb(238, 240, 245);
    background: linear-gradient(-46deg,
            rgba(238, 240, 245, 1) 0%,
            rgba(230, 233, 239, 1) 100%);
    display: flex;
    justify-content: center;
    align-items: center;
    box-shadow: -12px -12px 20px 0 #ffffffb8, 10px 10px 20px 0 #a6b4c8c7;
}

.emergency-medication-img {
    /* width: 100px; */
    /* height: 138px; */
    width: 100%;
    height: 100%;
    background-color: transparent;
}

.medicine-title {
    font-size: 1.8rem;
    color: black;
    font-family: var(--Barlow-font);
    font-weight: 600;
}

.emergency-medication-area {
    display: flex;
    justify-content: start;
    align-items: center;
    gap: 35px;
    flex-wrap: wrap;
    margin-bottom: 60px;
}

.emergency-medication-list .emergency-medication-area:nth-last-child(2) {
    margin-bottom: 0;
}

.emergency-medication-detail {
    width: 74%;
}

.medicine-discrip {
    font-size: 1.4rem;
    font-family: var(--Barlow-font);
    font-weight: 400;
    color: black;
    line-height: 1.4;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-align: start;
    margin: 0 0 15px;
}

.medicine-qty {
    font-family: var(--Barlow-font);
    font-weight: 400;
    font-size: 1.4rem;
    color: black;
}

.medicine-qty strong {
    font-size: 1.8rem;
    font-family: var(--Barlow-font);
    font-weight: 600;
}

.treated-title {
    font-size: 1.6rem;
    font-family: var(--Barlow-font);
    font-weight: 600;
    color: black;
    margin-bottom: 10px;
}

ul.condition-treated-list,
.agreement-list {
    list-style: disc;
    padding-left: 20px;
}

ul.condition-treated-list li::marker,
ul.agreement-list li::marker {
    font-size: 1.8rem;
}

.medication-detail-left {
    width: 50%;
}

.medication-detail-right {
    width: 40%;
}

.form-btn.w-150px {
    max-width: 150px;
}

.form-input {
    font-size: 1.8rem;
    color: black;
    font-family: var(--Barlow-font);
    font-weight: 500;
    border: none;
    outline: none;
    padding: 10px 20px;
    height: 50px;
    max-width: 313px;
    width: 100%;
    box-shadow: -12px -10px 20px 0 #ffffffc4, 10px 10px 20px 0 #a6b4c89e;
    background: rgb(238, 240, 245);
    background: linear-gradient(-81deg,
            rgba(238, 240, 245, 1) 0%,
            rgba(230, 233, 239, 1) 100%);
    border-radius: 5px;
}
.form-select {
    background-image: var(--bs-form-select-bg-img), var(--bs-form-select-bg-icon, none) !important;
    background-repeat: no-repeat;
    background-position: right .75rem center;
    background-size: 16px 12px;
    background-color: rgb(238, 240, 245);
}
.form-select.form-input:focus {
    border-color: transparent;
    outline: 0;
    box-shadow: -12px -12px 20px 0 #ffffffc4, 10px 10px 20px 0 #a6b4c89e;
}

.form-input::placeholder {
    font-size: 1.8rem;
    color: rgb(131, 131, 131);
    font-family: var(--Barlow-font);
    font-weight: 500;
}

textarea.form-input::placeholder {
    color: rgb(163, 162, 162) !important;
}

.promotion-input-area {
    display: flex;
    justify-content: start;
    align-items: center;
    gap: 15px;
}

.your-total-area {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding-top: 0px;
    margin-top: 20px;
    /* border-top: 2px solid var(--red-color); */
}
ul.Consent-list {
    list-style: disc;
}
.total {
    font-size: 1.9rem;
    color: black;
    font-family: var(--Barlow-font);
    font-weight: 600;
}

.form-note {
    font-size: 1.6rem;
    font-family: var(--Barlow-font);
    font-weight: 500;
    color: black;
    line-height: 1.2;
}

.form-note strong {
    font-weight: 700;
}

.form-input-area {
    margin-bottom: 30px;
}

.date-of-birth .fa-chevron-down,
.select-angle-icon {
    position: absolute;
    top: 50%;
    right: 10px;
    transform: translateY(-50%);
    font-size: 1.4rem;
    color: black;
}

.date-of-birth-area {
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-wrap: wrap;
    margin-bottom: 20px;
}

.date-of-birth {
    width: 31%;
}

.verify-code-popup-wrap,
.shipping-address-popup-wrap ,
.email-existing-popup-wrap {
    height: 100vh;
    width: 100%;
    position: fixed;
    top: 0;
    left: 0;
    display: flex;
    justify-content: center;
    align-items: center;
    background: rgb(238 240 245 / 0%);
    backdrop-filter: blur(14px);
    -webkit-backdrop-filter: blur(14px);
    visibility: hidden;
    z-index: 9999;
}
.email-existing-popup-wrap.active {
    visibility: visible;
}
.email-existing-popup-wrap.active .email-existing-popup {
    transform: scale(1);
}

.shipping-address-popup-wrap.active {
    visibility: visible;
}

.shipping-address-popup-wrap.active .shipping-address-popup {
    transform: scale(1);
}

.verify-code-popup-wrap.active {
    visibility: visible;
}

.verify-code-popup-wrap.active .verify-code-popup {
    transform: scale(1);
}

.verify-code-popup,
.shipping-address-popup ,
.email-existing-popup {
    max-width: 590px;
    width: 100%;
    border-radius: 15px;
    background-color: #F6F3E6;
    box-shadow: 0 4px 4px 0 #0000004f;
    overflow: hidden;
    transform: scale(0);
    transition: 0.5s;
}

.shipping-address-popup {
    max-height: 89vh;
    overflow: auto;
}

.popup-title {
    font-size: 1.8rem;
    font-family: var(--Barlow-font);
    font-weight: 600;
    color: var(--red-color);
    padding: 23.6px 0;
    box-shadow: 0 2px 2px 0 #0000004f;
    text-align: center;
    margin-bottom: 40px;
}

.popup-center-area {
    padding: 0 25px;
}

.fnts-22px {
    font-size: 2.2rem;
}

.form-sb-title strong {
    font-family: var(--Barlow-font);
    font-weight: 500;
    font-style: italic;
}

.popup-btn-area {
    background-color: #f07188;
    padding: 20px 25px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 20px;
}

.shipping-input-area {
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-wrap: wrap;
    gap: 20px 0;
}

.shipping-input-area .form-input-area {
    width: 49%;
}

textarea.form-input {
    height: 120px;
    resize: none;
}

.identity-verify-option-area {
    background-color: white;
    padding: 40px 40px;
    box-shadow: 0 4px 4px 0 #0000004a;
}

.verify-option-area {
    max-width: 480px;
    width: 100%;
    border: 1px solid black;
    padding: 20px 30px;
}

.verification-select {
    font-size: 2rem;
    font-family: var(--Barlow-font);
    font-weight: 500;
    color: black;
    text-align: center;
    border: none;
    border-bottom: 1px solid black;
    background-color: transparent;
    padding: 6px 10px;
    border-radius: 0;
    width: 100%;
    outline: none;
}

.verification-select::placeholder {
    color: black;
}

.verification-select.form-select:focus {
    border-color: black;
    outline: 0;
    box-shadow: none;
}

.select-add-ons-popup-wrap {
    height: 100vh;
    width: 100%;
    position: fixed;
    top: 0;
    left: 0;
    background: rgb(238 240 245 / 0%);
    backdrop-filter: blur(14px);
    -webkit-backdrop-filter: blur(14px);
    display: flex;
    justify-content: center;
    align-items: center;
    z-index: 999;
    visibility: hidden;
}

.select-add-ons-popup-wrap.active {
    visibility: visible;
}

.select-add-ons-popup-wrap.active .select-add-ons-popup {
    transform: scale(1);
}

.select-add-ons-popup {
    max-width: 800px;
    width: 100%;
    background-color: white;
    border-radius: 5px;
    overflow: hidden;
    box-shadow: 0 0 20px 0 #0000003d;
    transform: scale(0);
    transition: 0.5s;
}

.select-add-ons-top,
.select-add-ons-end {
    background-color: white;
    padding: 20px 20px;
}

.select-add-ons-list {
    height: 70vh;
    background: rgb(238, 240, 245);
    background: linear-gradient(-81deg,
            rgba(238, 240, 245, 1) 0%,
            rgba(230, 233, 239, 1) 100%);
    overflow: auto;
    padding: 30px 20px;
}

.add-ons-medication-area {
    cursor: pointer;
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 10px;
    padding: 20px 30px !important;
    background-color: white;
    border-radius: 5px;
    position: relative;
    margin-bottom: 20px;
}

#selected-add-ons .add-ons-medication-area {
    padding: 20px 20px;
    position: relative;
}

.add-ons-medication-area .checkbox-square , .refill-medication-area .checkbox-square  {
    position: absolute;
    right: 10px;
    top: 5px;
    height: 15px;
    width: 15px;
}

.add-ons-medication-check:checked+.add-ons-medication-area .checkbox-square::before , .refill-medication-check:checked + .emergency-medication-area .checkbox-square::before  {
    visibility: visible;
}
.cursor-pointer {
    cursor: pointer;
}

.remove-add-on {
    background-color: #ff4d4d;
    color: white;
    border: none;
    padding: 5px 10px;
    cursor: pointer;
}

.error {
    font-size: 1.6rem;
    font-family: var(--Barlow-font);
    font-weight: 600;
    color: var(--red-color);
    margin-top: 5px;
    display: none;
}

.Doctors-visits-unabel,
.kidney-disease,
.chronic-medications-text-area,
.liver-disease-yes,
.prolonged-QT-syndrome-yes,
.I-am-allergic {
    display: none;
}

.Doctors-visits-btn {
    display: none;
}

.allergy-text-btn {
    display: none;
}

.form-para {
    font-size: 1.6rem;
    font-family: var(--Barlow-font);
    font-weight: 400;
    color: black;
    text-align: start;
}

.allergy-text-area {
    display: none;
}

.form-select.form-input:disabled {
    background: #d1d1d1;
    cursor: not-allowed;
}

.verified-address-btn {
    display: none;
}

.remove-btn {
    position: absolute;
    top: 5px;
    right: 10px;
    color: black;
    font-size: 1.6rem;
    background-color: transparent;
    border: none;
    font-family: var(--Barlow-font);
    font-weight: 500;
}

.medication-title-area {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.radio-img {
    height: 130px;
    width: 130px;
    border-radius: 5px;
}

.form-label.height-auto {
    height: auto;
}

.ccicon {
    height: 35px;
    position: absolute;
    right: 6px;
    width: 60px;
    top: 50%;
    transform: translateY(-50%);
}

#after-pay {
    display: none;
}

#after-pay.active {
    display: block;
}

#card-fileds {
    display: none;
}

#card-fileds.active {
    display: block;
}

.bg-batch {
    background-color: #F6F3E6;
}

.med-condtion-doctor-list,
.taking-medications-list,
.drug-allergies-list {
    display: none;
}

.med-condtion-doctor-list.active,
.taking-medications-list.active,
.drug-allergies-list.active {
    display: block;
}

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






.text-area-label {
    font-size: 1.6rem;
    font-family: var(--Inter-Regular-fonts);
    color: black;
    position: absolute;
    left: 20px;
    top: 10px;
}

label.file-pick-label {
    cursor: pointer;
}

.file-pick-label {
    width: 100%;
    font-size: 2rem;
    font-family: var(--Inter-SemiBold-fonts);
    border: 2px solid #0000006b;
    border-radius: 10px;
    padding: 40px 20px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    background-color: white;
    gap: 20px;
    color: #0000006b;
    height: 200px;
    position: relative;
    overflow: hidden;
}

.file-pick-label i {
    font-size: 4rem;
}

.file-item {
    / background-color: #d1d1d1;/ border-radius: 10px;
    / padding: 10px 10px;/ / display: flex;/ / justify-content: center;/ / align-items: center;/ / gap: 10px;/ position: relative;
    height: 100%;
    width: 100%;
}

.id-verify-img {
    height: 100%;
    width: 100%;
    object-fit: cover;
}

.file-name {
    font-size: 1.4rem;
    font-weight: 700;
}

.remove-file i {
    font-size: 1.4rem;
}

.remove-file {
    cursor: pointer;
    position: absolute;
    top: 10px;
    right: 10px;
    height: 20px;
    width: 20px;
    border-radius: 100%;
    background-color: white;
    color: black;
    font-size: 2rem;
}

div#file-preview {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    height: 100%;
    width: 100%;
}




.check-icon-area {
    height: 30px;
    width: 30px;
    display: flex;
    justify-content: center;
    align-items: center;
    border-radius: 50%;
    border: 2px solid var(--red-color);
    background-color: transparent;
    font-size: 1.8rem;
}

.check-icon-area i {
    display: none;
}

#i-agree:checked+.agree-label .check-icon-area {
    background-color: var(--red-color);
    color: white;
}

#i-agree:checked+.agree-label .check-icon-area i {
    display: block;
}


/* .loader-area.active {
  display: none;
} */
/* .emergency-medication-supply {
  display: none;
}
.emergency-medication-supply.active {
  display: block;
} */

.card-field-area {
    padding: 10px 20px;
    height: 50px;
    width: 100%;
    box-shadow: -12px -10px 20px 0 #ffffffc4, 10px 10px 20px 0 #a6b4c89e;
    background: rgb(238, 240, 245);
    background: linear-gradient(-81deg, rgba(238, 240, 245, 1) 0%, rgba(230, 233, 239, 1) 100%);
    border-radius: 5px;
    margin-bottom: 30px;
}

.pregnancy-quetion-area {
    display: none;
}
.pregnancy-quetion-area.active {
    display: block;
}
.pregnancy-month-area {
    display: none;
}
.pregnancy-month-area.active {
    display: block;
}
.swal2-popup.swal2-modal.swal2-icon-success.swal2-show {
    width: 100%;
    max-width: 500px;
}
.swal2-title {
    font-size: 2rem;
    line-height: 1.2;
    font-family: var(--Inter-SemiBold-fonts);
    margin-bottom: 30px;
}
div#swal2-html-container {
    font-size: 1.5rem;
    line-height: 1.2;
    font-family: var(--Inter-SemiBold-fonts);
    margin-bottom: 10px;
}
button.swal2-confirm {
    padding: 1rem 2rem;
    font-size: 1.6rem;
    font-family: var(--Inter-Medium-fonts);
}

/* form css end */



.selectize-control.multi .selectize-input>div {
    padding: 5px;
    font-size: 16px;
    font-family: var(--Inter-Medium-fonts);
    background-color: var(--red-color);
    color: white;
    border-radius: 5px;
}

.selectize-input {
    border: none;
    padding: 8px 8px;
    display: inline-block;
    width: 100%;
    position: relative;
    z-index: 1;
    box-sizing: border-box;
    box-shadow: none;
    border-radius: 5px;
    background-color: transparent;
}

.selectize-input.focus {
    box-shadow: none;
}

.selectize-input>input {
    font-size: 1.8rem;
    color: black;
    font-family: var(--Barlow-font);
    font-weight: 500;
}

.selectize-dropdown {
    position: unset !important;
    background-color: white !important;
}
.dashboard-link {
    position: absolute;
    top: 50%;
    right: 20px;
    transform: translateY(-50%);
    font-size: 2rem;
    font-family: var(--Barlow-font);
    font-weight: 500;
    color: black;
    padding: 10px 20px;
    background-color: white;
    border-radius: 50px;
    box-shadow: 0 2px 2px 0 #00000045;
}

.pl-50px {
    padding-left: 50px;
}
.include-price-list {
    padding-left: 100px;
    list-style: circle;
}
.include-price-list .your-total-area {
    justify-content: start !important;
    gap: 20px;
}
.phone-number {
    padding: 10px 20px 10px 40px;
}
span.us-code {
    position: absolute;
    top: 51%;
    transform: translateY(-50%);
    left: 15px;
    font-size: 16px;
    font-weight: 600;
    color: black;
    font-family: var(--Inter-Medium-fonts);
}

.same-ship-label {
    font-size: 2.2rem;
    font-family: var(--Inter-Medium-fonts);
    color: black;
    cursor: pointer;
    display: flex;
    justify-content: start;
    align-items: center;
    gap: 10px;
    margin: 40px 0 20px;
    text-transform: capitalize;
}
.same-ship-label input {
    height: 25px;
    width: 25px;
    accent-color: var(--red-color);
}
.pediatric-pack-div{
    display: none !important;
}
.pediatric-pack-div.active {
    display: block !important;
}
input#medication {
    width: 30px;
    height: 21px;
    accent-color: var(--red-color);
    margin-top: 3px;
}
.form-sb-title.text-start.text-black.medication-label.active{
    display: flex;
}
.form-sb-title.text-start.text-black.medication-label {
    display: none;
    gap: 11px;
    margin-top: 16px;
}
/* body {
    position: relative;
}
body::before {
    content: " ";
    left: 0;
    top: 0;
    height: 100vh;
    background-color: #0000008f;
    z-index: 99;
    width: 100%;
} */

.inner-radio-area {
    max-width: 590px;
    width: 100%;
    border-radius: 15px;
    background-color: #F6F3E6;
    box-shadow: 0 4px 4px 0 #0000004f;
    transition: 0.5s;
    padding: 50px;
}

.body-load-radio-show {
   height: 100vh;
    width: 100%;
    position: fixed;
    top: 0;
    left: 0;
        transition: 0.5s;
    display: flex;
    justify-content: center;
    align-items: center;
    background: rgb(238 240 245 / 0%);
    backdrop-filter: blur(14px);
    -webkit-backdrop-filter: blur(14px);
  transform: scale(0);
    z-index: 9999;
}
.body-load-radio-show.active{
       transform: scale(1);
}
.inner-radio-area .form-title {
    font-size: 25px;
    margin-bottom: 20px;
}