.contact-wdget {
    font-family: 'anekdevanagari-medium';
}
.intro-section {
    padding-top: 50px;
    display: flex;
    justify-content: center;
    flex-direction: column;
    align-items: center;
}

    .intro-section > div {
        text-align: center;
    }

.intro-title {
    color: var(--Colors-Text-Text-Brand, #FF795C);
    font-size: 24px;
    font-style: normal;
    font-family: 'anekdevanagari-bold';
    font-weight: 700;
    line-height: 32px;
}

.intro-desc {
    color: var(--Colors-Text-Text-Primary, #000);
    font-size: 40px;
    font-style: normal;
    font-weight: 400;
    line-height: normal;
}

    .intro-desc .bld {
        font-family: 'anekdevanagari-bold';
        font-weight: 700;
    }

.intro-desc-2 {
    color: var(--Colors-Text-Text-Secondary, #737195);
    font-size: 22px;
    font-style: normal;
    font-weight: 500;
    line-height: 32px;
    margin-top: 28px;
}

/*..........................*/

.contact-us-form-wrapper {
    margin-top: 70px;
    margin-bottom: 40px;
    display: flex;
    justify-content: center;
}

.contact-us-form {
    width: 1261px;
    padding: var(--Spaces-Space-2XLarge, 48px);
    gap: var(--Spaces-Space-Large, 32px);
    border-radius: var(--Corner-Radius-Semi-Rounded, 8px);
    background: var(--Colors-Surface-Surface-White, #FFF);
    box-shadow: 0px 3px 6px 0px rgba(0, 0, 0, 0.10);
}

    .contact-us-form .title {
        color: var(--Colors-Text-Text-Primary, #000);
        font-size: 32px;
        font-style: normal;
        font-weight: 700;
        font-family: 'anekdevanagari-bold';
        line-height: 48px; /* 150% */
    }

.form-input label:not(.error) {
    color: var(--Colors-Text-Text-Primary, #000);
    font-size: 16px;
    font-weight: 500;
    line-height: 24px; /* 150% */
}

.invoice-upload-box {
    display: flex;
    max-width: 421px;
    padding: 32px 24px;
    align-items: center;
    border: 1px dashed #28255C;
    background-color: #F3F5FB;
    gap: 16px;
}

.gallery-image {
    width: 56px;
    height: 56px;
    display: flex;
    justify-content: center;
    align-items: center;
    gap: var(--Spaces-Space-XSmall, 8px);
    border: 1px solid var(--Colors-Borders-Border-Secondary, #DFDEE7);
    background: var(--Colors-Surface-Surface-Secondary, #E9E8EE);
}

#uploadedFileName {
    color: var(--Colors-Text-Text-Brand, #FF795C);
    text-overflow: ellipsis;
    font-size: 18px;
    font-weight: 500;
    line-height: 24px;
}

#fileSizeInfo {
    overflow: hidden;
    color: var(--Colors-Text-Text-Secondary, #737195);
    text-overflow: ellipsis;
    font-size: 12px;
    font-weight: 500;
    line-height: 16px; /* 133.333% */
}

#invoiceFile {
    display: none;
}

.color-diffrence {
    cursor: pointer;
    color: var(--Colors-Text-Text-Brand, #FF795C);
    text-overflow: ellipsis;
    font-size: 18px;
    font-weight: 500;
    line-height: 24px;
}

.drag {
    overflow: hidden;
    color: var(--Colors-Text-Text-Secondary, #737195);
    text-overflow: ellipsis;
    font-size: 18px;
    font-weight: 500;
    line-height: 24px; /* 133.333% */
}

.temp {
    height: 56px;
    width:70%;
    align-content: space-evenly;
}

.submit-form {
    display: flex;
    padding: var(--Spaces-Space-Meduim, 16px) var(--Spaces-Space-SemiLarge, 24px);
    justify-content: center;
    align-items: center;
    gap: var(--Spaces-Space-XSmall, 8px);
    background: var(--Colors-Surface-Surface-Brand, #FF795C);
    color: var(--Colors-Text-Text-White, #FFF);
    text-align: center;
    font-size: 16px;
    font-style: normal;
    font-weight: 500;
    line-height: 24px; /* 150% */
}

.custom-select-wrapper {
    position: relative;
    display: inline-block;
}

select {
    height: 64px !important;
}

.custom-arrow {
    position: absolute;
    top: 63%;
    right: 12px;
    transform: translateY(-50%);
    pointer-events: none;
}

.our-office-wrapper {
    margin-top: 70px;
    margin-bottom: 40px;
    display: flex;
    justify-content: center;
}

    .our-office-wrapper > div {
        width: 1261px;
        padding: var(--Spaces-Space-2XLarge, 48px);
        gap: var(--Spaces-Space-Large, 32px);
        border-radius: var(--Corner-Radius-Semi-Rounded, 8px);
        background: var(--Colors-Surface-Surface-White, #FFF);
        /* All components */
        box-shadow: 0px 3px 6px 0px rgba(0, 0, 0, 0.10);
    }

    .our-office-wrapper .title {
        color: var(--Colors-Text-Text-Primary, #000);
        font-size: 32px;
        font-style: normal;
        font-weight: 700;
        font-family: 'anekdevanagari-bold';
        line-height: 48px; /* 150% */
        margin-bottom: 16px;
    }

.outlet-item {
    display: flex;
    flex-direction: column;
    padding: 24px 0px;
    border-bottom: 1px solid #DFDEE7;
}

.map-details {
    height: calc(73vh - (34px + 15px));
    overflow: hidden;
    overflow-y: auto;
    padding-right: 16px;
}

.country-drp {
    padding-right: 32px;
}

.outlet-name-opend {
    display: flex;
    justify-content: space-between;
}

    .outlet-name-opend .name {
        color: var(--Colors-Text-Text-Primary, #000);
        font-size: 22px;
        font-style: normal;
        font-weight: 500;
        line-height: 32px; /* 145.455% */
    }

    .outlet-name-opend .open {
        display: flex;
        padding: var(--Spaces-Space-2Xsmall, 4px) var(--Spaces-Space-XSmall, 8px);
        justify-content: center;
        align-items: center;
        gap: var(--Spaces-Space-XSmall, 8px);
        border-radius: var(--Corner-Radius-Minimal, 4px);
        background: var(--Colors-Status-Status-Delivered, #07C29D);
        color: white;
    }

    .outlet-name-opend .close {
        display: flex;
        padding: var(--Spaces-Space-2Xsmall, 4px) var(--Spaces-Space-XSmall, 8px);
        justify-content: center;
        align-items: center;
        gap: var(--Spaces-Space-XSmall, 8px);
        border-radius: var(--Corner-Radius-Minimal, 4px);
        background: var(--Colors-Status-Status-Delivered, #E12626);
        color: white;
    }

.outlet-address {
    color: var(--Colors-Text-Text-Secondary, #737195);
    font-size: 16px;
    font-style: normal;
    font-weight: 500;
    line-height: 24px; /* 150% */
}
.outlet-actions {
    display: flex;
}

.outlet-actions > button{
    margin-right: 8px;
}

.mb-8 {
    margin-bottom: 8px;
}

.mb-12 {
    margin-bottom: 12px;
}
/*...............................Modal............................*/

.modal-close-wrapper {
    width: 100%;
    text-align: right;
}

.modal-add-phone {
    display: flex;
    width: 322px;
    margin: auto;
}

    .modal-add-phone .lbl {
        color: var(--Colors-Text-Text-Secondary, #737195);
        font-family: 'anekdevanagari-bold';
        font-size: 16px;
        font-style: normal;
        font-weight: 700;
        width: 100px;
        line-height: 24px; /* 150% */
    }

    .modal-add-phone .val {
        color: var(--Colors-Text-Text-Secondary, #737195);
        font-family: "anekdevanagari-regular";
        font-size: 16px;
        font-style: normal;
        font-weight: 400;
        line-height: 24px; /* 150% */
        max-width: 235px;
    }

    .modal-outlet-content {
        display: flex;
        flex-direction: column;
    }

    .modal-outlet-content .title {
        color: var(--Colors-Text-Text-Primary, #000);
        text-align: center;
        font-size: 22px;
        font-style: normal;
        font-weight: 500;
        line-height: 32px; /* 145.455% */
    }

.modal-outlet-actions {
    display: flex;
    justify-content: center;
    gap: var(--Spaces-Space-XSmall, 8px);
}

.modal-outlet-actions button {
    min-width: 165px;
}

.modal-day-view .day {
    color: var(--Colors-Text-Text-Secondary, #737195);
    font-family: 'anekdevanagari-bold'; 
    width: 100px;
    font-size: 16px;
    font-style: normal;
    font-weight: 700;
    line-height: 24px; /* 150% */
}
    .modal-day-view .day.close {
        font-weight: 500;
        font-family: 'anekdevanagari-regular';
    }
    .modal-day-view .time {
        color: var(--Colors-Text-Text-Secondary, #737195);
        font-size: 16px;
        font-style: normal;
        font-weight: 500;
        line-height: 24px; /* 150% */
    }
.modal-day {
    display: flex;
}

.modal-day-view {
    display: flex;
    align-items: center;
    flex-direction: column;
}


.row > .col-md-5{
    margin-top:32px;
}
.button-org {
    border-radius: 0px;
}
.button-org:hover {
    background-image: linear-gradient(to right, #bb5ac4, #FF795C);
    box-shadow: 0px 4px 20px 0px rgba(255, 121, 92, 0.75);
    transition: all .4s ease ;
    -webkit-transition: all .3s ease ;
}
.button-white {
    border-radius: 0px;
}
.button-white:hover {
    background-color: #FF795C;
    border: #FF795C;
    color: white;
}

.button-org {
     &:focus, &:active
{
    background: var(--Colors-Surface-Surface-Brand, #FF795C);
    border: 1px solid var(--Colors-Borders-Border-Primary, #FF795C);
    color: #fff;
}
}

.button-white {
    &:focus, &:active

{
    color: #28255C;
    background-color: #fff;
    border: 1px solid var(--Colors-Borders-Border-Primary, #28255C);
}

}

@media(max-width:767px) {
    .outlet-actions{
        display:flex;
        justify-content:space-between;
    }
    .row > .col-md-5 {
        margin-top: 16px;
    }
    .display-map {
        height: auto;
        margin-top: 32px;
    }
    .our-office-section  {
        width: 100% !important;
        padding:16px !important;
    }
    #googleMap, #googleMap-lockers {
        width: 100%;
        height: 298px !important;
        flex-shrink: 0;
    }
    .country-drp{
        padding-right:0px;
        width:100%;
    }
    .button-org {
        display: flex;
        padding: var(--Spaces-Space-XSmall, 8px) var(--Spaces-Space-Meduim, 8px);
        justify-content: center;
        align-items: center;
        gap: var(--Spaces-Space-XSmall, 3px);
        background: var(--Colors-Surface-Surface-Brand, #FF795C);
        border: 1px solid var(--Colors-Borders-Border-Primary, #FF795C);
        color: #fff;
        border-radius:0px;
    }
    .button-white {
        display: flex;
        padding: var(--Spaces-Space-XSmall, 8px) var(--Spaces-Space-Meduim, 8px);
        justify-content: center;
        align-items: center;
        gap: var(--Spaces-Space-XSmall, 3px);
        border: 1px solid var(--Colors-Borders-Border-Primary, #28255C);
        color: #28255C;
        background-color: #fff;
        border-radius: 0px;
    }
    .map-details{
        height:fit-content;
    }
    .contact-us-form{
        margin:0rem 1rem;
        padding:16px;
    }
    .our-office-wrapper{
        margin:0rem 1rem;
    }
    .map-details{
        margin-top:32px;
    }
}
#-error, #txtCountry-error {
    display: none !important;
}
.file-uploaded {
    border: 1px solid var(--Colors-Borders-Border-Primary, #28255C) !important;
}
.discard-file {
    width: 24px;
    height: 24px;
    flex-shrink: 0;
}
.error-fileUpload {
    color: #ff7959;
    font-size: 12px;
    padding-top: 1px;
}
body[lang="ar"] .custom-spacing {
    padding-right: 30px !important; /* Increase right padding */
}

body[lang="ar"] .select2-with-icon {
    position: relative;
}

body[lang="ar"] .select2-with-icon::after {
    position: absolute;
    top: 50%;
    right: 10px; /* Keep on right side */
    transform: translateY(-50%);
    pointer-events: none;
}
body[lang="ar"] .country-drp {
    padding-left: 32px;
    padding-right: 0px;
}

body[lang="ar"] .map-details {
    padding-left: 16px;
    padding-right: 0px;
}

.outlet-actions .button-org > span, .outlet-actions .button-white > span {
    height: 20px;
}