/* ==== Inter font family Start ==== */

@font-face {
    font-family: 'Inter 18pt black';
    src: url('fonts/Inter18pt-Black.ttf') format('truetype');
    font-weight: 900;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Inter 18pt ex-light';
    src: url('fonts/Inter18pt-ExtraLight.ttf') format('truetype');
    font-weight: 200;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Inter 18pt bold';
    src: url('fonts/Inter18pt-Bold.ttf') format('truetype');
    font-weight: bold;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Inter 18pt italic';
    src: url('fonts/Inter18pt-Italic.ttf') format('truetype');
    font-weight: normal;
    font-style: italic;
    font-display: swap;
}

@font-face {
    font-family: 'Inter 18pt ex-bold';
    src: url('fonts/Inter18pt-ExtraBold.ttf') format('truetype');
    font-weight: bold;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Inter 18pt light';
    src: url('fonts/Inter18pt-Light.ttf') format('truetype');
    font-weight: 300;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Inter 18pt regular';
    src: url('fonts/Inter18pt-Regular.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Inter 18pt medium';
    src: url('fonts/Inter18pt-Medium.ttf') format('truetype');
    font-weight: 500;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Inter 18pt sm-bold';
    src: url('fonts/Inter18pt-SemiBold.ttf') format('truetype');
    font-weight: 600;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Inter 18pt thin';
    src: url('fonts/Inter18pt-Thin.ttf') format('truetype');
    font-weight: 100;
    font-style: normal;
    font-display: swap;
}

/* ==== Inter font family End ==== */


img {
    max-width: 100%;
}

input.text,
input[type="text"],
input[type="button"],
input[type="submit"],
input[type="email"],
input[type="tel"],
textarea,
.input-checkbox {
    outline: 0;
}

h1,
h2,
h3,
h4,
h5,
h6,
p {
    margin: 0px;
}

input:focus {
    outline: 0;
}

textarea:focus {
    outline: 0;
}

button:focus {
    outline: 0;
}

a {
    cursor: pointer;
    text-decoration: none;
    transition: all 0.5s ease;
}

    a:focus,
    a:hover {
        text-decoration: none;
        outline: 0;
    }

.TC {
    text-align: center;
}

.TL {
    text-align: left;
}

.TR {
    text-align: right;
}

.margin_auto {
    margin: auto;
    float: none;
}

.padding {
    padding: 0;
}

.al {
    width: 100%;
    height: 100%;
    display: table;
}

.alm {
    width: 100%;
    height: 100%;
    display: table-cell;
    vertical-align: middle;
}

abbr[title] {
    border-bottom: none !important;
    cursor: inherit !important;
    text-decoration: none !important;
}

body {
    font-family: 'Inter 18pt regular';
    background-color: #fff;
}

.container {
    max-width: 1230px;
    margin: 0 auto;
    width: 100%;
}

/* ==== login page start ==== */

.login-page-main {
    width: 100%;
    height: 100vh;
    position: relative;
}

.login-page-background-image-main {
    width: 100%;
    height: 100%;
}

    .login-page-background-image-main img {
        width: 100%;
        height: 100%;
        object-fit: cover;
        object-position: top center;
    }

.login-page-popup-box-main {
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0px;
    left: 0px;
    right: 0px;
    bottom: 0px;
    margin: auto;
    display: flex;
    align-items: center;
    justify-content: center;
}

.login-pagepopup-box-inside-main {
    width: 90%;
    max-width: 580px;
    border-radius: 16px;
    background-color: white;
    padding: 40px 32px;
    animation: popupZoom 0.3s ease-out forwards;
}

@keyframes popupZoom {

    0% {
        opacity: 0;
        transform: scale(0.8);
    }

    100% {
        opacity: 1;
        transform: scale(1);
    }
}

.wagzo-login-logo {
    width: fit-content;
    margin: auto;
    margin-bottom: 16px;
}

.wagzo-login-head-and-pera-mn {
    width: 100%;
    margin-bottom: 32px;
}

    .wagzo-login-head-and-pera-mn h3 {
        font-size: 32px;
        color: black;
        text-align: center;
        margin-bottom: 10px;
        font-family: 'Inter 18pt medium';
    }

    .wagzo-login-head-and-pera-mn p {
        text-align: center;
        font-size: 16px;
        color: #999999;
        line-height: normal;
    }

.wagzo-login-itp-and-lbl-mn {
    width: 100%;
    margin: auto;
    margin-bottom: 24px;
}

    .wagzo-login-itp-and-lbl-mn label {
        font-family: 'Inter 18pt medium';
        font-size: 16px;
        margin-bottom: 10px;
        width: 100%;
    }

    .wagzo-login-itp-and-lbl-mn input {
        width: 100%;
        padding: 17px 16px;
        border: 1px solid #999999;
        border-radius: 10px;
        font-size: 16px;
        line-height: normal;
    }

        .wagzo-login-itp-and-lbl-mn input::placeholder {
            color: #999999;
        }

.wagzo-send-otp-button-main {
    width: 100%;
    margin: auto;
}

    .wagzo-send-otp-button-main a, button {
        width: 100%;
        display: flex;
        align-items: center;
        justify-content: center;
        color: white;
        font-size: 16px;
        font-family: 'Inter 18pt bold';
        border-radius: 6px;
        border: 1px solid #00A650;
        background-color: #00A650;
        padding: 13px 16px;
        line-height: normal;
    }

        .wagzo-send-otp-button-main a:hover, button:hover {
            background-color: transparent;
            color: #00A650;
        }

.wagzo-or-text-and-sprtr-main {
    width: 100%;
    margin: 32px 0px;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.sprtr-line-one {
    background-color: #999999;
    height: 2px;
    width: 43%;
}

.sprtr-line-text {
    color: #999999;
    font-size: 24px;
    font-family: 'Inter 18pt medium';
}

.wagzo-login-option-main {
    width: 100%;
    display: flex;
    justify-content: space-between;
}

    .wagzo-login-option-main button {
        display: flex;
        align-items: center;
        justify-content: center;
        width: 31%;
        background-color: white;
        border: 1px solid #999999;
        border-radius: 50px;
        padding: 15px;
    }

        .wagzo-login-option-main button:hover {
            background-color: #00a65036;
        }

/* ==== login page end ==== */

/* ==== OTP verify code page start ==== */

.wagzo-otp-verify-pera-and-change-phone-nmbr {
    width: 100%;
    margin-bottom: 40px;
}

    .wagzo-otp-verify-pera-and-change-phone-nmbr p {
        text-align: center;
        font-size: 16px;
        color: #999999;
        line-height: normal;
        margin-bottom: 10px;
    }

    .wagzo-otp-verify-pera-and-change-phone-nmbr a {
        color: black;
        font-size: 16px;
        text-decoration: underline;
        display: flex;
        align-items: center;
        justify-content: center;
        gap: 10px;
    }

.wagzo-otp-enter-input-main {
    width: 100%;
    display: flex;
    justify-content: center;
    gap: 10px;
    margin-bottom: 16px;
}

    .wagzo-otp-enter-input-main input {
        width: 48px;
        min-width: 48px;
        height: 48px;
        border: 1px solid #999999;
        border-radius: 6px;
        text-align: center;
        font-size: 24px;
        font-family: 'Inter 18pt medium';
        color: #00A650;
    }

        .wagzo-otp-enter-input-main input::placeholder {
            color: #999999;
        }

.wagzo-otp-dont-received-pera {
    width: 100%;
    margin-bottom: 16px;
}

    .wagzo-otp-dont-received-pera p {
        font-size: 16px;
        color: #999999;
        font-family: 'Inter 18pt medium';
        text-align: center;
    }

.wagzo-otp-resend-and-timer-main {
    width: 100%;
    margin-bottom: 32px;
}

    .wagzo-otp-resend-and-timer-main p {
        color: #00A650;
        font-size: 16px;
        font-family: 'Inter 18pt medium';
        text-align: center;
    }

    .wagzo-otp-resend-and-timer-main #resend-btn {
        font-family: 'Inter 18pt medium';
    }

/* ==== OTP verify code page end ==== */

/* ==== Select User page start ==== */

.select-your-role-section-main {
    width: 100%;
    margin: auto;
    display: flex;
    flex-direction: column;
    gap: 16px;
    margin-bottom: 32px;
}

.service-provider-section-main {
    width: 100%;
    position: relative;
    box-shadow: 0px 2px 8px 0px transparent;
    border-radius: 12px;
}

.service-provider-image-main {
    width: 100%;
}

    .service-provider-image-main img {
        width: 100%;
        border-radius: 10px;
    }

.services-provider-section-main-inside {
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0px;
    left: 0px;
    right: 0px;
    bottom: 0px;
    padding: 20px;
    margin: auto;
    border-radius: 10px;
}

.services-provider-icon-mn {
    width: fit-content;
    margin-bottom: 8px;
}

.services-provider-text-box-one {
    width: 100%;
}

    .services-provider-text-box-one h5 {
        color: #FDFBF7;
        font-size: 20px;
        font-family: 'Inter 18pt sm-bold';
        margin-bottom: 8px;
    }

    .services-provider-text-box-one p {
        color: #FDFBF7;
        font-size: 16px;
        font-family: 'Inter 18pt medium';
        line-height: normal;
        min-height: 38px;
        display: flex;
        align-items: center;
    }

.select-your-role-section-main .form-check {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
}

.select-your-role-section-main .form-check-input {
    margin-top: 0px;
    width: 20px;
    min-width: 20px;
    height: 20px;
    box-shadow: unset !important;
    border: 3px solid #00A650;
}

    .select-your-role-section-main .form-check-input:checked[type=radio] {
        background-image: url(../images/radio-check.png);
        background-color: transparent;
        border-color: transparent;
        border: unset;
    }

.service-provider-section-main.active {
    box-shadow: 0px 2px 8px 0px #00a650;
}

/* ==== Select User page end ==== */

/* ==== select account type page start ==== */

.select-account-type-page-main {
    width: 100%;
    margin: auto;
}

.select-acount-typre-page-header-main {
    width: 100%;
    margin: auto;
    background-color: #00A650;
    padding: 80px 0px;
    margin-bottom: 40px;
}

.select-account-type-logo-main {
    width: fit-content;
    margin: auto;
    margin-bottom: 16px;
}

.select-account-type-text-box-one {
    margin-bottom: 10px;
}

    .select-account-type-text-box-one h4 {
        color: #FDFBF7;
        font-size: 32px;
        font-family: 'Inter 18pt medium';
        text-align: center;
    }

.select-account-type-text-box-two {
    margin-bottom: 16px;
}

    .select-account-type-text-box-two p {
        color: #FDCF13;
        font-family: 'Inter 18pt medium';
        font-size: 18px;
        text-align: center;
    }

.select-account-type-text-box-three p {
    color: #FDFBF7;
    font-family: 'Inter 18pt medium';
    font-size: 18px;
    text-align: center;
}

.select-user-type-section-second-main {
    width: 90%;
    max-width: 666px;
    margin: auto;
}

.select-user-page-inside-main {
    width: 100%;
    margin: auto;
    display: flex;
    flex-direction: column;
    gap: 16px;
    margin-bottom: 32px;
}

.select-user-type-select-box-one-main {
    width: 100%;
    padding: 20px;
    background-color: #EBF5EB;
    border-radius: 12px;
    border: 1px solid transparent;
    box-shadow: 0px 1px 10px rgba(0, 0, 0, 0.14);
    position: relative;
    cursor: pointer;
    transition: 0.3s ease;
}

    .select-user-type-select-box-one-main.active {
        border-color: #00A650;
    }

.select-user-type-select-box-inside-one {
    width: 80px;
    height: 80px;
    border-radius: 100px;
    background-color: #FFFFFF;
    display: flex;
    align-items: center;
    justify-content: center;
    margin: auto;
    margin-bottom: 20px;
}

.select-user-type-select-box-inside-two {
    margin-bottom: 10px;
}

    .select-user-type-select-box-inside-two h6 {
        color: #00A650;
        font-size: 18px;
        font-family: 'Inter 18pt sm-bold';
        text-align: center;
    }

.select-user-type-select-box-inside-three p {
    color: #999999;
    font-size: 18px;
    font-family: 'Inter 18pt medium';
    text-align: center;
}

.select-user-type-button-main {
    width: 100%;
    display: flex;
    justify-content: space-between;
    margin-bottom: 40px;
}

    .select-user-type-button-main a {
        display: flex;
        align-items: center;
        justify-content: center;
        width: 49%;
        font-size: 16px;
        font-family: 'Inter 18pt bold';
        border-radius: 6px;
        padding: 12px;
        border: 2px solid transparent;
    }

        .select-user-type-button-main a.previous {
            border-color: #00A650;
            color: #00A650;
        }

            .select-user-type-button-main a.previous:hover {
                background-color: #EBF5EB;
            }

        .select-user-type-button-main a.next:hover {
            background-color: #EBF5EB;
            color: #00A650;
            border-color: #00A650;
        }

        .select-user-type-button-main a.next {
            background-color: #999999;
            color: white;
            border-color: #999999;
            pointer-events: none;
        }

            .select-user-type-button-main a.next.active {
                background-color: #00A650;
                border-color: #00A650;
                pointer-events: unset;
            }

                .select-user-type-button-main a.next.active:hover {
                    background-color: #EBF5EB;
                    border-color: #00A650;
                }

.select-user-type-select-box-one-main input[type="radio"]:checked + .checkbox-mark {
    opacity: 1;
}

.select-user-type-select-box-one-main.active .checkbox-mark {
    opacity: 1;
}

.select-user-type-select-box-one-main input[type="radio"]:checked ~ .select-user-type-select-box-one-main {
    border-color: #00A650;
}

.select-user-type-select-box-one-main input[type="radio"]:checked ~ * {
    border-color: #00A650;
}

.select-user-type-select-box-one-main input[type="radio"]:checked {
    outline: none;
}

.select-user-type-select-box-one-main .checkbox-mark {
    position: absolute;
    top: 14px;
    right: 14px;
    width: 24px;
    height: 24px;
    border-radius: 6px;
    background: transparent;
    display: flex;
    align-items: center;
    justify-content: center;
    color: white;
    font-weight: bold;
    font-size: 14px;
    opacity: 0;
    transition: 0.3s;
}

    .select-user-type-select-box-one-main .checkbox-mark::before {
        content: "";
        background-image: url(../images/check-box-image-true.png);
        width: 100%;
        height: 100%;
    }

/* ==== select account type page end ==== */

/* ==== Profile setup individual page start ==== */

.profile-setup-page-main {
    width: 90%;
    max-width: 1040px;
    margin: auto;
}

.profile-image-profile-stp-update-main {
    width: 100px;
    height: 100px;
    border-radius: 100px;
    margin: auto;
    margin-bottom: 16px;
    position: relative;
}

    .profile-image-profile-stp-update-main img {
        width: 100%;
        height: 100%;
        border-radius: 100px;
    }

.profile-uploder-main {
    position: absolute;
    cursor: pointer;
    bottom: 0px;
    right: 0px;
    width: 30px;
    height: 30px;
}

    .profile-uploder-main img {
        width: 100%;
        height: 100%;
        border-radius: 50px;
    }

.profile-details-box-one-main {
    width: 100%;
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
    margin-bottom: 16px;
}

.profile-details-inside-main {
    width: 24%;
    position: relative;
}

    .profile-details-inside-main label {
        width: 100%;
        margin-bottom: 8px;
        color: black;
        font-size: 16px;
        font-family: 'Inter 18pt medium';
    }

        .profile-details-inside-main label span {
            color: #EB5757;
        }

    .profile-details-inside-main input {
        width: 100%;
        border: 1px solid #999999;
        border-radius: 6px;
        font-size: 14px;
        font-family: 'Inter 18pt medium';
        padding: 14px 10px;
        line-height: normal;
    }

    .profile-details-inside-main textarea {
        width: 100%;
        border: 1px solid #999999;
        border-radius: 6px;
        font-size: 14px;
        font-family: 'Inter 18pt medium';
        padding: 14px 10px;
        line-height: normal;
        height: 90px;
    }

    .profile-details-inside-main input::placeholder {
        color: #999999;
    }

    .profile-details-inside-main .phone-input-wrapper {
        width: 100%;
        display: flex;
        border: 1px solid #999999;
        border-radius: 6px;
        align-items: center;
        background: white;
    }

    .profile-details-inside-main .country-select {
        display: flex;
        align-items: center;
        gap: 5px;
        padding: 0 10px;
        cursor: pointer;
        position: relative;
        min-width: 75px;
        height: 45px;
        border-right: 1px solid #999999;
        font-size: 14px;
    }

        .profile-details-inside-main .country-select .arrow {
            font-size: 10px;
        }

    .profile-details-inside-main .country-list {
        position: absolute;
        top: 52px;
        left: 0;
        width: 160px;
        background: white;
        border: 1px solid #999999;
        border-radius: 6px;
        list-style: none;
        display: none;
        padding: 5px 0;
        z-index: 999999;
    }

        .profile-details-inside-main .country-list li {
            padding: 8px 12px;
            cursor: pointer;
            font-size: 14px;
        }

            .profile-details-inside-main .country-list li:hover {
                background: #f2f2f2;
            }

    .profile-details-inside-main .phone-input {
        flex: 1;
        padding: 14px 10px;
        border: none;
        outline: none;
        font-size: 14px;
    }

.select-date-main {
    width: 100%;
    position: relative;
}

    .select-date-main img {
        position: absolute;
        right: 10px;
        top: 0px;
        bottom: 0px;
        margin: auto;
        cursor: pointer;
    }

.select-date-main {
    position: relative;
    cursor: pointer;
}

    .select-date-main input {
        border: none;
        outline: none;
        width: 100%;
        border: 1px solid #999999;
        border-radius: 6px;
        font-size: 14px;
        padding: 14px 10px;
    }

.profile-details-inside-main .date-picker {
    width: fit-content;
    border: 1px solid #ccc;
    background: white;
    border-radius: 10px;
    padding: 12px;
    margin-top: 5px;
    display: none;
    position: absolute;
    z-index: 1000;
    right: 0px;
}

    .profile-details-inside-main .date-picker .header {
        display: flex;
        justify-content: space-between;
        align-items: center;
        margin-bottom: 10px;
        font-weight: bold;
    }

    .profile-details-inside-main .date-picker button {
        cursor: pointer;
        border: none;
        background: #00A650;
        padding: 5px;
        border-radius: 5px;
        width: 34px;
        color: white;
    }

.profile-details-inside-main #days {
    display: grid;
    grid-template-columns: repeat(7, 1fr);
    gap: 6px;
}

    .profile-details-inside-main #days div {
        padding: 6px;
        border-radius: 5px;
        cursor: pointer;
        text-align: center;
        width: 31px;
        height: 31px;
        line-height: normal;
    }

        .profile-details-inside-main #days div:hover {
            background: #00A650;
            color: white;
        }

.profile-details-inside-main .selected {
    background: #007bff !important;
    color: white !important;
}

.profile-details-box-two-main {
    width: 100%;
    margin-bottom: 16px;
}

    .profile-details-box-two-main .profile-details-inside-main {
        width: 100%;
    }

.profile-map-section-main {
    width: 100%;
    margin: auto;
    height: 140px;
    margin-bottom: 16px;
}

    .profile-map-section-main #map {
        width: 100%;
        height: 100%;
        border-radius: 6px;
        z-index: 8;
    }

    .profile-map-section-main .leaflet-control-attribution.leaflet-control {
        display: none;
    }

.upload-emirates-id-main {
    border: 2px dashed #cfcfcf;
    padding: 18px;
    border-radius: 12px;
    text-align: center;
    cursor: pointer;
    width: 100%;
    max-width: 100%;
    transition: 0.2s;
}

    .upload-emirates-id-main:hover {
        border-color: #22c55e;
        background: #f6fffa;
    }

    .upload-emirates-id-main .upload-icon {
        width: 24px;
        height: 24px;
        margin-bottom: 8px;
        opacity: 0.7;
    }

    .upload-emirates-id-main p {
        font-size: 12px;
        color: #999999;
        margin: 0;
    }

.upload-tearms-of-use-main {
    width: 100%;
    margin-bottom: 32px;
}

    .upload-tearms-of-use-main .form-check .form-check-input {
        width: 18px;
        height: 18px;
        border-radius: 0px;
        box-shadow: unset !important;
        border-color: #00A650;
    }

    .upload-tearms-of-use-main .form-check-input:checked {
        background-color: transparent;
        border-color: #00A650;
    }

        .upload-tearms-of-use-main .form-check-input:checked[type=checkbox] {
            background-image: url(../images/true-check-box.png);
            background-size: 10px 7px;
            background-position: center center;
        }

    .upload-tearms-of-use-main .form-check-label {
        font-size: 14px;
        color: #999999;
        font-family: 'Inter 18pt medium';
    }

        .upload-tearms-of-use-main .form-check-label a {
            color: #00A650;
            font-family: 'Inter 18pt sm-bold';
            text-decoration: underline;
        }

.profile-setup-page-main .select-user-type-button-main a.next {
    pointer-events: unset;
    color: white;
    background-color: #00A650;
    border-color: #00A650;
}

    .profile-setup-page-main .select-user-type-button-main a.next:hover {
        background-color: #EBF5EB;
        color: #00A650;
    }

.profile-details-box-three-main {
    display: flex;
    justify-content: space-between;
    gap: 16px;
    flex-wrap: wrap;
    margin-bottom: 16px;
}

    .profile-details-box-three-main .profile-details-inside-main {
        width: 32%;
    }

.profile-setup-company-page-box-one {
    width: 100%;
    display: flex;
    justify-content: space-between;
    gap: 16px;
    flex-wrap: wrap;
    margin-bottom: 16px;
}

    .profile-setup-company-page-box-one .profile-details-inside-main {
        width: 49%;
    }

/* ==== Profile setup individual page end ==== */

/* ==== Profile setup step page start ==== */
.wagzo-profile-stepu-pgres-main {
    width: 100%;
    padding: 0px 20px;
    max-width: 1240px;
    margin: auto;
    text-align: center;
    font-family: sans-serif;
}

/* 🌟 NEW FLEX CSS */
.wagzo-progress-flex {
    display: flex;
    justify-content: space-between;
    align-items: center;
}


/* ---------- PROGRESS BAR ---------- */
.wagzo-profile-stepu-pgres-main .progress-container {
    position: relative;
    width: 90%;
    display: flex;
    justify-content: space-between;
    align-items: center;
    height: 6px;
    background: #999999;
    border-radius: 10px;
}

.wagzo-profile-stepu-pgres-main .progress-bar {
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    margin: auto;
    height: 10px;
    background: #00C16E;
    width: 0%;
    z-index: 1;
    transition: .3s ease;
    border-radius: 10px;
}

.wagzo-profile-stepu-pgres-main .step {
    width: 38px;
    height: 38px;
    border-radius: 50%;
    border: 2px solid #ccc;
    display: flex;
    justify-content: center;
    align-items: center;
    background: #fff;
    color: #444;
    cursor: pointer;
    font-weight: bold;
    transition: .3s;
}

    .wagzo-profile-stepu-pgres-main .step.active {
        border-color: #00C16E;
        background: #00C16E;
        color: #fff;
    }


/* ---------- STEP CONTENT ---------- */
.wagzo-profile-stepu-pgres-main .step-content {
    margin-top: 30px;
}

.wagzo-profile-stepu-pgres-main .step-box {
    display: none;
}

    .wagzo-profile-stepu-pgres-main .step-box.active {
        display: block;
    }

/* ---------- BUTTONS ---------- */
.wagzo-profile-stepu-pgres-main .btn-group {
    width: 100%;
    max-width: 666px;
    margin: auto;
    margin-top: 30px;
    margin-bottom: 30px;
    display: flex;
    justify-content: space-between;
}

.wagzo-profile-stepu-pgres-main button {
    padding: 12px 12px;
    border-radius: 8px;
    border: none;
    font-size: 16px;
    cursor: pointer;
    width: 80px;
    min-width: 80px;
}

.wagzo-profile-stepu-pgres-main #prevBtn {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 49%;
    font-size: 16px;
    font-family: 'Inter 18pt bold';
    border-radius: 6px;
    padding: 12px;
    border: 2px solid transparent;
    border-color: #00A650;
    color: #00A650;
}
.btn-cancel {
    display: unset;
    width: 49%;
    font-size: 16px;
    font-family: 'Inter 18pt bold';
    border-radius: 6px;
    padding: 12px;
    border: 2px solid transparent;
    border-color: #00A650;
    color: #00A650;
}
.btn-save {
    display: unset;
    width: 49%;
    font-size: 16px;
    font-family: 'Inter 18pt bold';
    border-radius: 6px;
    padding: 12px;
    border: 2px solid transparent;
    color: white;
    background-color: #00A650;
    border-color: #00A650;
}


.wagzo-profile-stepu-pgres-main #nextBtn {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 49%;
    font-size: 16px;
    font-family: 'Inter 18pt bold';
    border-radius: 6px;
    padding: 12px;
    border: 2px solid transparent;
    color: white;
    background-color: #00A650;
    border-color: #00A650;
}

    /* .wagzo-profile-stepu-pgres-main #nextBtn */

    .wagzo-profile-stepu-pgres-main #nextBtn:hover,
    .wagzo-profile-stepu-pgres-main #prevBtn:hover {
        background-color: #EBF5EB;
        color: #00A650;
    }
#nextBtn:hover,
.btn-cancel:hover {
    background-color: #EBF5EB;
    color: #00A650;
}



.wagzo-progress-flex #stepTitle {
    min-width: 85px;
    font-size: 20px;
    color: #00C16E;
    font-family: 'Inter 18pt medium';
}

.step-one-box-one-main {
    width: 100%;
    margin: auto;
}

    .step-one-box-one-main .profile-details-inside-main {
        width: 100%;
    }

        .step-one-box-one-main .profile-details-inside-main label {
            text-align: left;
        }

    .step-one-box-one-main .select-user-page-inside-main {
        flex-direction: row;
        justify-content: space-between;
        gap: 8px;
        flex-wrap: wrap;
        margin-bottom: 10px;
    }

        .step-one-box-one-main .select-user-page-inside-main .select-user-type-select-box-one-main {
            padding: 16px;
            width: 32.90%;
            width: 32.88%;
            box-shadow: unset;
        }

    .step-one-box-one-main .select-user-type-select-box-inside-one {
        width: 50px;
        height: 50px;
        background-color: transparent;
        border: 1px solid #00A650;
        margin-bottom: 8px;
    }

    .step-one-box-one-main .select-user-type-select-box-inside-two h6 {
        font-size: 16px;
    }

.note-profile-step-main p {
    color: #EB5757;
    font-size: 14px;
    font-family: 'Inter 18pt medium';
    text-align: left;
}

.step-two-box-two-main {
    width: 100%;
    margin: auto;
}

.step-two-box-one-input-and-select-main {
    width: 100%;
    margin: auto;
    display: flex;
    justify-content: space-between;
    align-items: end;
    gap: 16px;
    flex-wrap: wrap;
    margin-bottom: 16px;
}

    .step-two-box-one-input-and-select-main .profile-details-inside-main {
        width: 49%;
    }

        .step-two-box-one-input-and-select-main .profile-details-inside-main label {
            text-align: left;
        }




.multi-select-container {
    position: relative;
    width: 100%;
}

/* Selected area */
.multi-select-display {
    min-height: 40px;
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    cursor: pointer;
    background: #fff;
    position: relative;
    width: 100%;
    border: 1px solid #999999;
    border-radius: 6px;
    font-size: 14px;
    font-family: 'Inter 18pt medium';
    padding: 14px 10px;
    line-height: normal;
}

    /* Dropdown arrow */
    .multi-select-display::after {
        content: "\f107";
        font-family: "Font Awesome 6 Free";
        font-weight: 900;
        position: absolute;
        right: 10px;
        font-size: 16px;
        color: #555;
        transition: transform 0.3s ease;
    }

/* Rotate arrow when open */
.multi-select-container.active .multi-select-display::after {
    transform: rotate(180deg);
}

/* Selected tags */
.multi-select-tag {
    background: #4caf50;
    color: white;
    padding: 4px 8px;
    border-radius: 4px;
    margin: 3px;
    display: flex;
    align-items: center;
    font-size: 13px;
}

    .multi-select-tag span {
        margin-left: 6px;
        cursor: pointer;
        font-weight: bold;
        color: #EB5757;
    }

/* Dropdown */
.multi-select-options {
    position: absolute;
    background: white;
    border: 1px solid #999999;
    width: 100%;
    max-height: 200px;
    overflow-y: auto;
    border-radius: 6px;
    margin-top: 5px;
    display: none;
    z-index: 10;
}

    .multi-select-options label {
        display: flex;
        align-items: center;
        padding: 8px;
        cursor: pointer;
        border-bottom: 1px solid #999999;
        font-family: 'Inter 18pt medium';
        font-size: 14px;
    }

        .multi-select-options label:hover {
            background: #f3f3f3;
        }

    .multi-select-options input {
        margin-right: 10px;
        width: 15px;
        height: 15px;
        padding: 0px;
        margin-top: 0px;
        border-color: #00A650;
        border-radius: 2px !important;
        box-shadow: unset !important;
    }

    .multi-select-options .form-check-input:focus {
        border-color: #00A650;
    }

    .multi-select-options .form-check-input:checked {
        border-color: #00A650;
        background-color: transparent;
    }

        .multi-select-options .form-check-input:checked[type=checkbox] {
            background-image: url(../images/true-check-box.png);
            background-size: 10px 7px;
            background-position: center center;
        }

.single-select-container {
    position: relative;
    width: 100%;
}

.single-select-display {
    width: 100%;
    border: 1px solid #999999;
    border-radius: 6px;
    font-size: 14px;
    font-family: 'Inter 18pt medium';
    padding: 14px 10px;
    line-height: normal;
    display: flex;
    align-items: center;
    cursor: pointer;
    background: #fff;
    position: relative;
}

    /* Dropdown arrow */
    .single-select-display::after {
        content: "\f107";
        font-family: "Font Awesome 6 Free";
        font-weight: 900;
        position: absolute;
        right: 10px;
        font-size: 16px;
        color: #555;
        transition: 0.3s;
    }

/* Rotate arrow when active */
.single-select-container.active .single-select-display::after {
    transform: rotate(180deg);
}

.single-select-options {
    position: absolute;
    background: white;
    border: 1px solid #aaa;
    width: 100%;
    max-height: 200px;
    overflow-y: auto;
    border-radius: 6px;
    margin-top: 5px;
    display: none;
    z-index: 10;
}

    .single-select-options label {
        display: block;
        padding: 8px;
        cursor: pointer;
        border-bottom: 1px solid #eee;
        font-family: 'Inter 18pt medium';
        font-size: 14px;
    }

        .single-select-options label:hover {
            background: #f3f3f3;
        }

.step-two-box-insdie-one {
    width: 100%;
    display: flex;
    justify-content: space-between;
    gap: 16px;
    margin-bottom: 16px;
    flex-wrap: wrap;
}

    .step-two-box-insdie-one .profile-details-inside-main {
        width: 49%;
    }

        .step-two-box-insdie-one .profile-details-inside-main label {
            text-align: left;
        }

        .step-two-box-insdie-one .profile-details-inside-main .upload-emirates-id-main {
            padding: 38px 18px;
        }

.step-three-box-one-main {
    width: 100%;
    margin: auto;
}

.custom-banking-and-packages-tab-pnl-main-button {
    width: 100%;
    display: flex;
    justify-content: space-between;
    margin-bottom: 20px;
}

    .custom-banking-and-packages-tab-pnl-main-button button {
        border: 1px solid #00A650;
        color: #00A650;
        font-size: 16px;
        font-family: 'Inter 18pt sm-bold';
        text-align: center;
        padding: 14px;
        line-height: normal;
        width: 50%;
        background-color: transparent;
    }

        .custom-banking-and-packages-tab-pnl-main-button button:nth-child(1) {
            border-top-right-radius: 0px;
            border-bottom-right-radius: 0px;
            border-right: unset;
        }

        .custom-banking-and-packages-tab-pnl-main-button button:nth-child(2) {
            border-top-left-radius: 0px;
            border-bottom-left-radius: 0px;
        }

        .custom-banking-and-packages-tab-pnl-main-button button.active {
            background-color: #00A650;
            color: white;
        }

.tb-one-main-step-three-box-one .profile-setup-company-page-box-one .profile-details-inside-main label {
    text-align: left;
}

.tb-one-main-step-three-box-one .profile-setup-company-page-box-one {
    align-items: end;
}

.tab-two-main-step-three-box-two {
    width: 100%;
    margin: auto;
}

    .tab-two-main-step-three-box-two .profile-details-inside-main {
        width: 100%;
    }

        .tab-two-main-step-three-box-two .profile-details-inside-main label {
            text-align: left;
        }

.packages-section-add-new-packages-main {
    width: fit-content;
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 16px;
    margin-left: auto;
    margin-bottom: 16px;
    flex-wrap: wrap;
}

    .packages-section-add-new-packages-main h5 {
        color: #00A650;
        font-size: 18px;
        font-family: 'Inter 18pt sm-bold';
        width: fit-content;
    }

    .packages-section-add-new-packages-main a {
        color: #EB5757;
        font-size: 14px;
        width: fit-content;
        display: flex;
        align-items: center;
        gap: 10px;
        font-family: 'Inter 18pt sm-bold';
    }

.tab-two-main-step-three-box-two .profile-setup-company-page-box-one .profile-details-inside-main {
    width: 49%;
}

.tab-two-main-step-three-box-two .profile-details-inside-main {
    margin-bottom: 16px;
}

.add-new-packahe-details-section-with-add-button-main {
    width: 100%;
}

.add-new-packahe-details-section-with-add-button-main-input-container {
    display: flex;
    align-items: center;
    border: 1px solid #999999;
    border-radius: 6px;
    padding: 16px;
    overflow: hidden;
    gap: 10px;
}

.add-new-packahe-details-section-with-add-button-main-input {
    flex-grow: 1;
    padding: 10px 15px;
    border: none;
    font-size: 16px;
    outline: none;
}

    .add-new-packahe-details-section-with-add-button-main-input::placeholder {
        color: #999;
    }

.add-new-packahe-details-section-with-add-button-main-add-button {
    background-color: #00A650;
    color: white;
    padding: 10px 20px;
    width:20%;
    border: none;
    cursor: pointer;
    font-size: 16px;
    font-weight: bold;
    transition: background-color 0.2s;
    border-radius: 0 4px 4px 0;
}

    .add-new-packahe-details-section-with-add-button-main-add-button:hover {
        background-color: #1e7e34;
    }

.add-new-packahe-details-section-with-add-button-main-package-item {
    display: flex;
    justify-content: space-between;
    align-items: center;
    background-color: #f8f9fa;
    padding: 8px 14px;
    margin-top: 8px;
    border: 1px solid #999999;
    border-radius: 4px;
    font-size: 15px;
    color: #333;
}

.add-new-packahe-details-section-with-add-button-main-package-text {
    flex-grow: unset;
}

.add-new-packahe-details-section-with-add-button-main-remove-button {
    background: none;
    border: none;
    color: #dc3545;
    font-weight: bold;
    font-size: 18px;
    cursor: pointer;
    margin-left: 10px;
    padding: 0 5px;
    line-height: 1;
    background-color: #00A650;
    width: 40px !important;
    min-width: 40px !important;
}

    .add-new-packahe-details-section-with-add-button-main-remove-button:hover {
        color: #c82333;
    }

/* ==== Profile setup step page end ==== */

/* ==== Profile Sent For verification Popup start ==== */

.profile-sent-for-verification {
    width: 100%;
    height: 100%;
    position: fixed;
    background-color: #01010185;
    top: 0px;
    left: 0px;
    right: 0px;
    backdrop-filter: blur(2px);
    bottom: 0px;
    margin: auto;
    z-index: 9;
    display: none;
}

    .profile-sent-for-verification.active {
        display: block;
    }

.profile-sent-for-verification-inside-main {
    position: absolute;
    top: 0px;
    left: 0px;
    right: 0px;
    bottom: 0px;
    margin: auto;
    width: 90%;
    max-width: 580px;
    padding: 40px 32px;
    height: fit-content;
    background-color: white;
    border-radius: 12px;
    animation: zoomIn 0.3s ease forwards;
}

.add-package-inside-main {
    position: absolute;
    top: 0px;
    left: 0px;
    right: 0px;
    bottom: 0px;
    margin: auto;
    width: 90%;
    padding: 40px 32px;
    height: fit-content;
    background-color: white;
    border-radius: 12px;
    animation: zoomIn 0.3s ease forwards;
}

@keyframes zoomIn {

    0% {
        transform: scale(0.6);
        opacity: 0;
    }

    100% {
        transform: scale(1);
        opacity: 1;
    }
}

.profile-sent-for-varification-popup-logo {
    width: fit-content;
    margin: auto;
    margin-bottom: 30px;
}

.profile-sent-for-varification-complete-icon-main {
    width: 160px;
    height: 160px;
    background-color: #EBF5EB;
    margin: auto;
    margin-bottom: 30px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 100px;
}

.profile-sent-for-varification-tital-one {
    margin-bottom: 22px;
}

    .profile-sent-for-varification-tital-one h5 {
        color: #00A650;
        font-size: 24px;
        font-family: 'Inter 18pt sm-bold';
        text-align: center;
    }

.profile-sent-for-varification-tital-two {
    margin-bottom: 30px;
}

    .profile-sent-for-varification-tital-two p {
        color: black;
        text-align: center;
        font-size: 18px;
    }

/* ==== Profile Sent For verification Popup end ==== */

/* ==== Profile under review start ==== */

.profile-under-review-popup-main {
    width: 100%;
    height: 100%;
    position: fixed;
    background-color: #01010185;
    top: 0px;
    left: 0px;
    right: 0px;
    backdrop-filter: blur(2px);
    bottom: 0px;
    margin: auto;
    z-index: 9;
    display: none;
}

    .profile-under-review-popup-main.active {
        display: block;
    }

.porfile-under-review-need-help-main {
    margin-bottom: 8px;
}

    .porfile-under-review-need-help-main a {
        color: black;
        font-size: 16px;
        font-family: 'Inter 18pt sm-bold';
        display: flex;
        align-items: center;
        justify-content: center;
        text-decoration: underline;
    }

.profile-under-review-pera-box-one {
    width: 100%;
    margin-bottom: 14px;
}

    .profile-under-review-pera-box-one p {
        width: 100%;
        color: #999999;
        font-size: 14px;
        text-align: center;
        font-family: 'Inter 18pt medium';
        line-height: normal;
    }

.profile-under-review-contact-sprt-btn {
    width: 240px;
    margin: auto;
}

    .profile-under-review-contact-sprt-btn a {
        display: flex;
        align-items: center;
        justify-content: center;
        gap: 6px;
        width: 100%;
        color: white;
        background-color: #00A650;
        border-radius: 50px;
        font-family: 'Inter 18pt medium';
        font-size: 16px;
        padding: 10px;
    }

        .profile-under-review-contact-sprt-btn a:hover {
            background-color: #01783a;
        }

/* ==== Profile under review end ==== */

/* ==== Profile Request Approved popup start ==== */

.profile-request-approved-popup-main {
    width: 100%;
    height: 100%;
    position: fixed;
    background-color: #01010185;
    top: 0px;
    left: 0px;
    right: 0px;
    backdrop-filter: blur(2px);
    bottom: 0px;
    margin: auto;
    z-index: 9;
    display: none;
}

    .profile-request-approved-popup-main.active {
        display: block;
    }

/* ==== Profile Request Approved popup end ==== */

/* ==== Profile Request Rejected popup start ==== */

.profile-request-rejected-popup-main.active {
    display: block;
}

.profile-request-rejected-popup-main {
    width: 100%;
    height: 100%;
    position: fixed;
    background-color: #01010185;
    top: 0px;
    left: 0px;
    right: 0px;
    backdrop-filter: blur(2px);
    bottom: 0px;
    margin: auto;
    z-index: 9;
    display: none;
}

    .profile-request-rejected-popup-main .profile-sent-for-varification-complete-icon-main {
        background-color: #fde9e9;
    }

    .profile-request-rejected-popup-main .profile-sent-for-varification-tital-one h5 {
        color: #EC2323;
    }

    .profile-request-rejected-popup-main .wagzo-send-otp-button-main {
        margin-top: 20px;
    }

    .profile-request-rejected-popup-main .profile-sent-for-varification-tital-one {
        margin-bottom: 16px;
    }

    .profile-request-rejected-popup-main .profile-sent-for-varification-tital-two {
        margin-bottom: 10px;
    }

.pet-sitting-step-three-tital-main {
    width: 100%;
    margin: auto;
    margin-bottom: 16px;
}

    .pet-sitting-step-three-tital-main h6 {
        color: #00A650;
        font-size: 18px;
        font-family: 'Inter 18pt sm-bold';
        text-align: left;
        line-height: 32px;
    }

.pet-sitting-register-page-input-full-wd .profile-details-inside-main {
    width: 100%;
}

.additional-info-pet-walking-step-three-main {
    width: 100%;
}

    .additional-info-pet-walking-step-three-main .profile-details-inside-main {
        width: 100%;
    }

.addition-info-pet-walking-rgstr-individual-stepthree-box-one-main {
    width: 100%;
}

.addition-info-pet-walking-rgstr-individual-stepthree-box-one-main {
    width: 100%;
    margin: auto;
    padding: 10px;
    border: 1px solid #999999;
    border-radius: 6px;
}

    .addition-info-pet-walking-rgstr-individual-stepthree-box-one-main .service-input-row {
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 10px;
        margin-bottom: 15px;
    }

    .addition-info-pet-walking-rgstr-individual-stepthree-box-one-main label {
        font-size: 14px;
        color: #333;
        font-weight: bold;
        margin-bottom: 5px;
        display: block;
    }

    .addition-info-pet-walking-rgstr-individual-stepthree-box-one-main .input-container {
        position: relative;
        width: 100%;
    }

    .addition-info-pet-walking-rgstr-individual-stepthree-box-one-main input[type="text"],
    .addition-info-pet-walking-rgstr-individual-stepthree-box-one-main input[type="number"],
    .addition-info-pet-walking-rgstr-individual-stepthree-box-one-main .read-only-input {
        width: 100%;
        border: 1px solid #999999;
        border-radius: 6px;
        font-size: 14px;
        font-family: 'Inter 18pt medium';
        padding: 14px 10px;
        line-height: normal;
        text-align: left;
    }

    .addition-info-pet-walking-rgstr-individual-stepthree-box-one-main .price-input-container,
    .addition-info-pet-walking-rgstr-individual-stepthree-box-one-main .price-display-container {
        width: fit-content;
        display: flex;
        align-items: center;
        justify-content: space-between;
        flex-direction: column;
    }

    .addition-info-pet-walking-rgstr-individual-stepthree-box-one-main .read-only-input {
        width: 100%;
        border: 1px solid #999999;
        border-radius: 6px;
        font-size: 14px;
        font-family: 'Inter 18pt medium';
        padding: 14px 10px;
        line-height: normal;
        text-align: left;
    }

    .addition-info-pet-walking-rgstr-individual-stepthree-box-one-main .price-display-container input[type="number"] {
        width: 90px;
        border: 1px solid #999999;
        border-radius: 6px;
        font-size: 14px;
        font-family: 'Inter 18pt medium';
        padding: 14px 10px;
        line-height: normal;
    }

    .addition-info-pet-walking-rgstr-individual-stepthree-box-one-main .delete-btn {
        width: fit-content;
        background-color: transparent;
        padding: 0px;
        min-width: fit-content;
        margin-top: 21px;
    }

    .addition-info-pet-walking-rgstr-individual-stepthree-box-one-main .add-new-row {
        margin-top: 25px;
        margin-bottom: 0;
    }

    .addition-info-pet-walking-rgstr-individual-stepthree-box-one-main .price-input-container {
        position: relative;
    }

    .addition-info-pet-walking-rgstr-individual-stepthree-box-one-main .currency-symbol {
        position: absolute;
        left: 10px;
        top: 50%;
        transform: translateY(-50%);
        color: #333;
        font-size: 14px;
    }

    .addition-info-pet-walking-rgstr-individual-stepthree-box-one-main #new-service-price {
        width: 90px;
        border: 1px solid #999999;
        border-radius: 6px;
        font-size: 14px;
        font-family: 'Inter 18pt medium';
        padding: 14px 10px 14px 22px;
        line-height: normal;
    }

    .addition-info-pet-walking-rgstr-individual-stepthree-box-one-main .add-btn {
        width: fit-content;
        height: fit-content;
        background-color: transparent;
        padding: 0px;
        min-width: fit-content;
        display: flex;
        justify-content: center;
        align-items: center;
    }

    .addition-info-pet-walking-rgstr-individual-stepthree-box-one-main .service-label-group {
        flex-grow: 1;
        order: -2;
    }

    .addition-info-pet-walking-rgstr-individual-stepthree-box-one-main .price-label-group {
        width: fit-content;
        flex-shrink: unset;
        order: unset;
    }

    .addition-info-pet-walking-rgstr-individual-stepthree-box-one-main .service-item-row label {
        display: block;
    }

    .addition-info-pet-walking-rgstr-individual-stepthree-box-one-main .add-new-row .service-label-group,
    .addition-info-pet-walking-rgstr-individual-stepthree-box-one-main .add-new-row .price-label-group {
        display: none;
    }

    .addition-info-pet-walking-rgstr-individual-stepthree-box-one-main .add-new-row .input-container {
        flex-grow: 1;
    }

    .addition-info-pet-walking-rgstr-individual-stepthree-box-one-main .add-new-row .price-input-container {
        width: fit-content;
    }

/* ==== Profile Request Rejected popup end ==== */

/* ==== mobile grooming popup start ==== */

.mobile-grooming-popup-main {
    width: 100%;
    height: 100%;
    position: fixed;
    background-color: #01010185;
    top: 0px;
    left: 0px;
    right: 0px;
    backdrop-filter: blur(2px);
    bottom: 0px;
    margin: auto;
    z-index: 9;
    display: none;
}

    .mobile-grooming-popup-main.active {
        display: block;
    }

.mobile-grooming-popup-inside-main {
    position: absolute;
    top: 0px;
    left: 0px;
    right: 0px;
    bottom: 0px;
    margin: auto;
    width: 90%;
    max-width: 648px;
    padding: 40px;
    height: fit-content;
    background-color: white;
    border-radius: 12px;
    animation: zoomIn 0.3s ease forwards;
}

.mobile-grooming-popup-tital-main {
    margin-bottom: 20px;
}

    .mobile-grooming-popup-tital-main h6 {
        color: #EB5757;
        text-align: center;
        font-size: 24px;
        font-family: 'Inter 18pt sm-bold';
    }

.mobile-grooming-alert-note-pera-main {
    margin-bottom: 30px;
}

    .mobile-grooming-alert-note-pera-main p {
        font-size: 18px;
        color: #999999;
        text-align: center;
        font-family: 'Inter 18pt medium';
    }

.mobile-grooming-popup-close-button-main {
    width: fit-content;
    margin: auto;
}

    .mobile-grooming-popup-close-button-main a {
        display: flex;
        align-items: center;
        justify-content: center;
        width: 93px;
        color: #EB5757;
        border: 1px solid #EB5757;
        border-radius: 12px;
        font-size: 16px;
        font-family: 'Inter 18pt sm-bold';
        line-height: normal;
        padding: 13px;
    }

        .mobile-grooming-popup-close-button-main a:hover {
            background-color: #EB5757;
            color: white;
        }

.grooming-registration-page-box-one {
    width: 100%;
    margin-bottom: 16px;
}

    .grooming-registration-page-box-one .profile-details-inside-main {
        width: 100%;
    }

        .grooming-registration-page-box-one .profile-details-inside-main label {
            text-align: left;
        }

/* ==== mobile grooming popup end ==== */

/* ==== Product Supplier Dashboard Page Start ==== */

/* ==== header and sidebar start ==== */

.wagzo-all-page-main {
    width: 100%;
    margin: auto;
    display: flex;
    justify-content: space-between;
    background-color: white;
}

.wagzo-sidebar-main {
    width: 270px;
    height: 100vh;
    background-color: #00A650;
    position: relative;
    transition: 0.3s;
    position: sticky;
    top: 0px;
    z-index: 9;
}

.wagzo-logo-for-sidebar {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: 0.3s;
    padding: 16px;
    border-bottom: 1px solid white;
}

.wagzo-sidemenu-main {
    width: 100%;
    padding: 16px;
    height: calc(100% - 136px);
    overflow-y: auto;
    scrollbar-width: thin;
    scrollbar-color: white #00A650;
    transition: 0.3s;
}

    .wagzo-sidemenu-main ul {
        padding: 0px;
        margin: 0px;
    }

        .wagzo-sidemenu-main ul li {
            list-style: none;
            margin-bottom: 10px;
        }

            .wagzo-sidemenu-main ul li a {
                width: 100%;
                display: flex;
                align-items: center;
                gap: 13px;
                color: white;
                font-size: 14px;
                font-family: 'Inter 18pt medium';
                padding: 8px 12px;
                border-radius: 8px;
                transition: 0.3s;
            }

.wagzo-navmenu-icon {
    width: 24px;
    height: 24px;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: 0.3s;
}

.wagzo-sidemenu-main ul li a:hover,
.wagzo-sidemenu-main ul li a.active {
    background-color: white;
    color: #00A650;
}

    .wagzo-sidemenu-main ul li a:hover .order-count-main {
        background-color: #00A650;
        color: white;
    }

    .wagzo-sidemenu-main ul li a:hover img,
    .wagzo-sidemenu-main ul li a.active img {
        filter: brightness(0) saturate(100%) invert(53%) sepia(84%) saturate(3342%) hue-rotate(118deg) brightness(87%) contrast(101%);
    }

.wagzo-sidemenu-main ul li a i.fa-angle-down {
    margin-left: auto;
    line-height: normal;
    font-size: 16px;
}

.wagzo-sidemenu-dropdown-main {
    position: relative;
}

.wagzo-sidebar-dropdown-menu-list-main {
    display: none;
}

.wagzo-sidemenu-dropdown-main.active .wagzo-sidebar-dropdown-menu-list-main {
    display: block;
}

.wagzo-sidemenu-dropdown-main i {
    transition: 0.3s;
}

.wagzo-sidemenu-dropdown-main.active i {
    transform: rotate(180deg);
}

/* == Sidebar Collapse start == */

.wagzo-collapse-button-main {
    position: absolute;
    width: 34px;
    height: 34px;
    background-color: #00A650;
    color: white;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 8px;
    right: -14px;
    top: 54px;
    z-index: 1;
    box-shadow: 0px 0px 10px -4px #ffffff;
    transition: 0.3s;
}

.colaps-view-logo {
    display: block;
}

.desktop-view-logo {
    display: none;
}

.wagzo-sidemenu-main ul li a span.navmenu-name {
    display: none;
}

.wagzo-sidemenu-main ul li a i.fa-angle-down {
    display: none;
}

.wagzo-sidebar-main {
    width: 70px;
}

.wagzo-collapse-button-main {
    position: absolute;
    width: 30px;
    height: 30px;
}

ul li a {
    width: 38px !important;
    height: 38px;
    justify-content: center;
}

.wagzo-navmenu-icon {
    width: 24px;
    min-width: 24px;
    height: 24px;
}

.wagzo-sidemenu-main {
    padding: 16px 16px 16px 12px;
}




.wagzo-sidemenu-dropdown-main.active .wagzo-sidebar-dropdown-menu-list-main {
    position: fixed;
    left: 80px;
    background-color: #fff;
    border-radius: 8px;
    box-shadow: 0px 0px 6px -4px black;
    overflow: hidden;
}

    .wagzo-sidemenu-dropdown-main.active .wagzo-sidebar-dropdown-menu-list-main li {
        margin-bottom: 0px;
    }

        .wagzo-sidemenu-dropdown-main.active .wagzo-sidebar-dropdown-menu-list-main li a {
            width: 100% !important;
            justify-content: unset;
        }

.wagzo-sidemenu-dropdown-main .wagzo-sidebar-dropdown-menu-list-main {
    background-color: #fff;
    border-radius: 8px;
    box-shadow: 0px 0px 6px -4px black;
    overflow: hidden;
    display: none;
}

    .wagzo-sidemenu-dropdown-main .wagzo-sidebar-dropdown-menu-list-main.open,
    .wagzo-sidemenu-dropdown-main .wagzo-sidebar-dropdown-menu-list-main.open-floating {
        display: block;
    }

.wagzo-sidebar-dropdown-menu-list-main.open-floating li {
    margin-bottom: 0px;
}

    .wagzo-sidebar-dropdown-menu-list-main.open-floating li a {
        width: 100% !important;
        justify-content: unset;
        color: #00A650;
    }

        .wagzo-sidebar-dropdown-menu-list-main.open-floating li a img {
            filter: brightness(0) saturate(100%) invert(38%) sepia(92%) saturate(4681%) hue-rotate(139deg) brightness(105%) contrast(101%);
        }

.wagzo-sidebar-main.active {
    width: 260px;
    min-width: 260px;

    .wagzo-sidemenu-main {
        height: calc(100% - 218px);
    }

    .wagzo-logo-for-sidebar {
        padding: 24px 0px;
    }

    .wagzo-collapse-button-main {
        transform: rotate(180deg);
    }

    .desktop-view-logo {
        display: block;
    }

    .colaps-view-logo {
        display: none;
    }

    .wagzo-sidemenu-main ul li a span.navmenu-name {
        display: block;
    }

    .wagzo-sidemenu-main ul li a i.fa-angle-down {
        display: block;
    }

    ul li a {
        width: 100% !important;
        height: auto;
        justify-content: unset;
    }

    .wagzo-sidemenu-dropdown-main.active .wagzo-sidebar-dropdown-menu-list-main {
        display: block;
    }

    .wagzo-collapse-button-main {
        width: 32px;
        height: 32px;
    }

    .wagzo-sidebar-dropdown-menu-list-main {
        position: unset !important;
        margin-top: 8px;
        background: transparent;
        box-shadow: unset;
    }

    .order-count-main {
        display: block;
    }

    .wagzo-pfl-sidebr-txt {
        display: flex;
    }

    .wagzo-profile-section-main-for-sidebar .wagzo-sidemenu-main ul li a {
        background-color: white;
        padding: 12px;
    }

    .wagzo-profile-section-main-for-sidebar .wagzo-navmenu-icon {
        background-color: #00A650;
    }

    .wagzo-profile-section-main-for-sidebar .wagzo-sidemenu-main ul li a img {
        filter: brightness(0) saturate(100%) invert(100%) sepia(0%) saturate(1%) hue-rotate(106deg) brightness(100%) contrast(102%);
    }

    .pfl-smnu-dpdn-mn a img {
        filter: unset !important;
    }
}

/* ==== profile section main for sidebar start ==== */

.wagzo-profile-section-main-for-sidebar {
    width: 100%;
    padding: 0px 0px;
    border-top: 1px solid white;
}

    .wagzo-profile-section-main-for-sidebar .wagzo-sidemenu-main {
        width: 100%;
        padding: 16px;
        height: fit-content;
        overflow: unset;
    }

        .wagzo-profile-section-main-for-sidebar .wagzo-sidemenu-main ul li a {
            background-color: transparent;
            color: black;
            font-size: 16px;
            padding: 0px;
        }

            .wagzo-profile-section-main-for-sidebar .wagzo-sidemenu-main ul li a:hover img {
                filter: brightness(0) saturate(100%) invert(53%) sepia(84%) saturate(3342%) hue-rotate(118deg) brightness(87%) contrast(101%);
            }

            .wagzo-profile-section-main-for-sidebar .wagzo-sidemenu-main ul li a .navmenu-name-sec {
                color: #999999;
                font-size: 12px;
            }

.wagzo-pfl-sidebr-txt {
    display: flex;
    flex-direction: column;
    display: none;
}

.wagzo-profile-section-main-for-sidebar .wagzo-navmenu-icon {
    width: 40px;
    height: 40px;
    background-color: white;
    border-radius: 50px;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: 0.0s;
}

.wagzo-profile-section-main-for-sidebar .wagzo-sidemenu-main ul li a img {
    filter: brightness(0) saturate(100%) invert(53%) sepia(84%) saturate(3342%) hue-rotate(118deg) brightness(87%) contrast(101%);
}

.wagzo-sidemenu-pfl-mn {
    position: relative;
    margin-bottom: 0px !important;
}

.pfl-smnu-dpdn-mn {
    position: absolute;
    right: -230px;
    bottom: 0px;
    display: none;
    box-shadow: 0px 0px 2px #00000078;
    border-radius: 8px;
}

    .pfl-smnu-dpdn-mn li {
        margin-bottom: 0px !important;
        border-bottom: 1px solid #999999;
        background-color: white;
        display: flex;
        align-items: center;
        gap: 10px;
        padding-right: 16px;
        padding-left: 16px;
    }

        .pfl-smnu-dpdn-mn li a {
            border-radius: 0px !important;
            padding: 10px 0px !important;
            width: 100% !important;
            justify-content: unset;
        }

            .pfl-smnu-dpdn-mn li a span {
                font-size: 18px;
                color: black;
                font-family: 'Inter 18pt sm-bold';
            }

    .pfl-smnu-dpdn-mn a img {
        filter: brightness(0) saturate(100%) !important;
    }

    .pfl-smnu-dpdn-mn li:nth-child(1) {
        border-top-left-radius: 8px;
        border-top-right-radius: 8px;
    }

    .pfl-smnu-dpdn-mn li:nth-last-child(1) {
        border-bottom: unset;
        border-bottom-left-radius: 8px;
        border-bottom-right-radius: 8px;
    }

    .pfl-smnu-dpdn-mn a .lgout {
        color: #EB5757;
        font-size: 16px;
        font-family: 'Inter 18pt medium';
    }

    .pfl-smnu-dpdn-mn a img.logout-pf-img {
        filter: brightness(0) saturate(100%) invert(44%) sepia(75%) saturate(2213%) hue-rotate(332deg) brightness(107%) contrast(85%) !important;
    }

.droppdwn-lang-mn {
    width: fit-content;
    position: relative;
}

.dpdn-for-lang-sd {
    width: fit-content;
    display: flex;
    align-items: center;
    gap: 8px;
    cursor: pointer;
}

.acunt-stng-langs-profl {
    position: absolute;
    right: -192px;
    top: 0px;
    background-color: white;
    width: 165px;
    border: 1px solid #999999;
    border-radius: 8px;
    display: none;
}

    .acunt-stng-langs-profl .form-check {
        padding: 8px 16px 8px 40px;
        border-bottom: 1px solid #999999;
        display: flex;
        align-items: center;
        gap: 10px;
        margin-bottom: 0px;
    }

        .acunt-stng-langs-profl .form-check:nth-last-child(1) {
            border-bottom: unset;
        }

        .acunt-stng-langs-profl .form-check .form-check-label {
            font-size: 14px;
            color: black;
        }

    .acunt-stng-langs-profl .form-check-input {
        margin-top: 0px;
        box-shadow: unset !important;
        border: 3px solid #00A650;
    }

        .acunt-stng-langs-profl .form-check-input:checked[type=radio] {
            background-image: url(../images/radio-check.png);
            background-color: transparent;
            border-color: transparent;
            border: unset;
        }

.dpdn-for-lang-sd i {
    transition: transform 0.3s ease;
}

.dpdn-for-lang-sd .rotate-arrow {
    transform: rotate(-90deg);
}


/* ==== profile section main for sidebar end ==== */

.order-count-main {
    margin-left: auto;
    background-color: white;
    color: #00A650;
    font-size: 14px;
    border-radius: 8px;
    padding: 4px;
    width: 28px;
    text-align: center;
    display: none;
}

/* == Sidebar Collapse end == */

/* == header start == */

.wagzo-page-header-and-main-contant {
    width: calc(100% - 70px);
}

header {
    width: 100%;
    background-color: #FDFCFB;
    border-bottom: 1px solid #999;
    position: sticky;
    top: 0px;
    z-index: 6;
}

.header-main {
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: end;
    padding: 22px 60px;
}

.header-notification-bell-icon-inside-main {
    width: fit-content;
    position: relative;
}

    .header-notification-bell-icon-inside-main a {
        display: flex;
        align-items: center;
        justify-content: center;
        width: 36px;
        height: 36px;
        border-radius: 6px;
    }

        .header-notification-bell-icon-inside-main a:hover,
        .header-notification-bell-icon-inside-main.active a {
            background-color: #00a65030;
        }

    .header-notification-bell-icon-inside-main span.noti-red-dot-mn {
        position: absolute;
        width: 6px;
        height: 6px;
        border-radius: 50px;
        background-color: #EF4444;
        top: 9px;
        right: 9px;
    }

.wagzo-my-account-profile-main {
    width: fit-content;
    display: flex;
    align-items: center;
    gap: 12px;
}

.wagzo-user-profile-image-main {
    width: 48px;
    min-width: 48px;
    height: 48px;
    border-radius: 100px;
    background-color: #fcf4ce;
    display: flex;
    align-items: center;
    justify-content: center;
}

.wagzo-my-account-profile-user-name {
    width: fit-content;
}

    .wagzo-my-account-profile-user-name a {
        display: flex;
        flex-direction: column;
        gap: 2px;
    }

        .wagzo-my-account-profile-user-name a .my-acc-ttl {
            color: #9A9EA6;
            font-size: 12px;
        }

        .wagzo-my-account-profile-user-name a .my-profile-acc-name {
            font-size: 16px;
            color: #101010;
            font-family: 'Inter 18pt bold';
            display: flex;
            align-items: center;
            gap: 4px;
        }

.header-noti-bell-and-profile-section-main {
    width: fit-content;
    position: relative;
    display: flex;
    align-items: center;
    gap: 20px;
}

.header-notification-dropdown-list-screen {
    position: absolute;
    width: 40%;
    min-width: 600px;
    background-color: white;
    border-radius: 12px;
    right: 0px;
    top: 68px;
    box-shadow: 0px 0px 10px #00000018;
    display: none;
}

.wagzo-header-noti-msg-box-one {
    width: 100%;
    margin: auto;
    padding: 10px 16px;
    border-bottom: 1px solid #999999;
}

    .wagzo-header-noti-msg-box-one h6 {
        font-size: 18px;
        color: black;
        font-family: 'Inter 18pt sm-bold';
    }

.wagzo-header-noti-msg-box-two {
    width: 100%;
    padding: 16px;
}

.wagzo-header-noti-msg-box-scrol-mn-inside {
    width: 100%;
    height: 462px;
    overflow-y: auto;
    scrollbar-width: thin;
    padding-right: 8px;
    scrollbar-color: #00A650 white;
}

.wagzo-header-noti-msg-box-three {
    width: 100%;
    margin-bottom: 10px;
}

    .wagzo-header-noti-msg-box-three a {
        width: 100%;
        display: flex;
        align-items: end;
        justify-content: space-between;
        gap: 16px;
        padding: 10px 16px;
        background: transparent;
        border-radius: 6px;
    }

    .wagzo-header-noti-msg-box-three.new-msg a,
    .wagzo-header-noti-msg-box-three:hover a {
        background-color: #EBF5EB;
    }

.wagzo-massage-pera-section {
    width: 81%;
}

    .wagzo-massage-pera-section h5 {
        color: black;
        font-size: 16px;
        line-height: 24px;
        font-family: 'Inter 18pt medium';
        margin-bottom: 8px;
    }

    .wagzo-massage-pera-section p {
        color: #999999;
        font-size: 16px;
        line-height: 24px;
        font-family: 'Inter 18pt medium';
    }

.wagzo-massage-time-and-dot-section {
    width: fit-content;
    display: flex;
    flex-direction: column;
    align-items: end;
    gap: 24px;
}

    .wagzo-massage-time-and-dot-section span.green-dots-msg {
        display: flex;
        align-items: center;
        justify-content: center;
        width: 8px;
        height: 8px;
        background-color: #00A650;
        border-radius: 50px;
    }

    .wagzo-massage-time-and-dot-section p {
        color: #999999;
        font-size: 14px;
        line-height: 24px;
        font-family: 'Inter 18pt medium';
    }

.wagzo-notification-profile-page-view-btn-hdr {
    width: 100%;
    margin: auto;
    padding: 16px;
    border-top: 1px solid #999999;
}

    .wagzo-notification-profile-page-view-btn-hdr a {
        width: fit-content;
        margin: auto;
        display: flex;
        align-items: center;
        justify-content: center;
        font-size: 18px;
        color: #00A650;
        font-family: 'Inter 18pt sm-bold';
    }

/* == header end == */

/* ==== header and sidebar end ==== */

/* ==== product-supplier-dashboard Page start ==== */

.wagzo-main-section {
    width: 100%;
    padding: 32px;
}

.wagzo-all-page-commun-heading-and-pera-main {
    width: 100%;
    margin: auto;
    margin-bottom: 32px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    flex-wrap: wrap;
}

    .wagzo-all-page-commun-heading-and-pera-main h3 {
        font-size: 24px;
        color: black;
        margin-bottom: 8px;
        font-family: 'Inter 18pt sm-bold';
    }

    .wagzo-all-page-commun-heading-and-pera-main p {
        font-size: 16px;
        color: #999999;
        font-family: 'Inter 18pt medium';
        line-height: 24px;
    }

.wants-you-promote-box-one-main {
    width: 100%;
    margin: auto;
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 14px;
    flex-wrap: wrap;
    padding: 5px 20px;
    background-color: #00A650;
    border-radius: 6px;
    margin-bottom: 32px;
}

.wants-you-promote-image-box {
    width: fit-content;
}

.want-you-promote-text-box h2 {
    color: #FDFBF7;
    font-size: 24px;
    font-family: 'Inter 18pt sm-bold';
    text-align: center;
}

.wants-you-promote-button-box {
    width: fit-content;
}

    .wants-you-promote-button-box a {
        color: #00A650;
        font-size: 16px;
        font-family: 'Inter 18pt bold';
        background-color: #fff;
        border: 1px solid #fff;
        border-radius: 6px;
        padding: 12px;
        display: flex;
        align-items: center;
        justify-content: center;
    }

        .wants-you-promote-button-box a:hover {
            color: white;
            font-size: 16px;
            font-family: 'Inter 18pt bold';
            background-color: transparent;
            border: 1px solid #fff;
        }

.mobile-scren-toggle-btn {
    display: none;
}

.product-supplier-all-status-box-one {
    width: 100%;
    margin: auto;
    display: flex;
    justify-content: space-between;
    gap: 10px;
    flex-wrap: wrap;
    margin-bottom: 32px;
}

.product-supplier-all-status-box-main-one {
    width: 24%;
    padding: 25px;
    display: flex;
    justify-content: space-between;
    border-radius: 12px;
}

.product-supplier-details-text p {
    line-height: 24px;
    color: black;
    font-size: 16px;
    margin-bottom: 8px;
    font-family: 'Inter 18pt medium';
}

.product-supplier-details-text h5 {
    font-size: 24px;
    line-height: 24px;
    color: black;
    font-family: 'Inter 18pt sm-bold';
}

.product-supplier-all-status-icon {
    width: 48px;
    height: 48px;
    border-radius: 14px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.product-supplier-all-status-box-main-one.yellow {
    background: linear-gradient(180deg, rgb(255 247 237 / 45%) 0%, rgba(255, 217, 166, 1) 100%);
}

    .product-supplier-all-status-box-main-one.yellow .product-supplier-all-status-icon {
        background-color: #FFCB85;
    }

.product-supplier-all-status-box-main-one.pink {
    background: linear-gradient(180deg, rgb(255 231 231 / 45%) 0%, rgba(255, 166, 166, 1) 100%);
}

    .product-supplier-all-status-box-main-one.pink .product-supplier-all-status-icon {
        background-color: #FF7777;
    }

.product-supplier-all-status-box-main-one.purple {
    background: linear-gradient(180deg, rgb(250 245 255 / 45%) 0%, rgba(208, 166, 255, 1) 100%);
}

    .product-supplier-all-status-box-main-one.purple .product-supplier-all-status-icon {
        background-color: #CDA0FF;
    }

.product-supplier-all-status-box-main-one.green {
    background: linear-gradient(180deg, rgb(240 253 244 / 45%) 0%, rgba(166, 255, 196, 1) 100%);
}

    .product-supplier-all-status-box-main-one.green .product-supplier-all-status-icon {
        background-color: #6CFF9E;
    }

.product-supplier-all-status-box-main-one.lgt-blur {
    background: linear-gradient(180deg, rgb(228 241 255 / 45%) 0%, rgba(116, 186, 255, 1) 100%);
}

    .product-supplier-all-status-box-main-one.lgt-blur .product-supplier-all-status-icon {
        background-color: #48A4FF;
    }

.top-product-this-week-box-main {
    width: 100%;
    margin: auto;
    padding: 24px;
    border-radius: 12px;
    box-shadow: 0px 0px 12px rgb(0 0 0 / 18%);
}

.top-product-heading-and-pera-box {
    width: 100%;
    margin: auto;
    margin-bottom: 16px;
}

    .top-product-heading-and-pera-box h4 {
        color: #00A650;
        font-size: 24px;
        margin-bottom: 10px;
        font-family: 'Inter 18pt sm-bold';
        line-height: 32px;
    }

    .top-product-heading-and-pera-box p {
        font-size: 16px;
        color: #999999;
        font-family: 'Inter 18pt medium';
        line-height: 24px;
    }

.top-product-list-box-section-main {
    width: 100%;
    margin: auto;
}

.top-product-list-box-inside-main-seciton {
    width: 100%;
    padding: 24px 16px;
    border-radius: 12px;
    background-color: #F9FAFB;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    flex-wrap: wrap;
    margin-bottom: 16px;
}

.top-product-items-name-and-unit {
    width: fit-content;
}

    .top-product-items-name-and-unit h3 {
        font-size: 18px;
        color: black;
        line-height: 24px;
        margin-bottom: 8px;
        font-family: 'Inter 18pt medium';
    }

    .top-product-items-name-and-unit p {
        font-size: 16px;
        line-height: 24px;
        font-family: 'Inter 18pt medium';
        color: #999999;
    }

.top-product-price-box {
    width: fit-content;
}

    .top-product-price-box p {
        color: #00A650;
        font-size: 18px;
        font-family: 'Inter 18pt sm-bold';
    }

/* ==== product-supplier-dashboard Page end ==== */

/* ==== New Order Request popup start ==== */

.new-order-request-popup-main {
    width: 100%;
    height: 100%;
    position: fixed;
    background-color: #01010185;
    top: 0px;
    left: 0px;
    right: 0px;
    backdrop-filter: blur(2px);
    bottom: 0px;
    margin: auto;
    z-index: 9;
    display: none;
}

.new-order-reqest-popup-inside-main {
    position: absolute;
    top: 0px;
    left: 0px;
    right: 0px;
    bottom: 0px;
    margin: auto;
    width: 90%;
    max-width: 640px;
    padding: 24px;
    height: fit-content;
    background-color: white;
    border-radius: 12px;
    animation: zoomIn 0.3s ease forwards;
}

@keyframes zoomIn {

    0% {
        transform: scale(0.6);
        opacity: 0;
    }

    100% {
        transform: scale(1);
        opacity: 1;
    }
}

.new-reqest-order-popup-head {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    flex-wrap: wrap;
    margin-bottom: 24px;
}

.new-reqst-order-id-nmbr-popup {
    width: fit-content;
    display: flex;
    align-items: center;
    gap: 24px;
}

    .new-reqst-order-id-nmbr-popup h4 {
        color: black;
        font-size: 24px;
        line-height: 24px;
        font-family: 'Inter 18pt sm-bold';
    }

.requested-yellow-status {
    width: 120px;
    background-color: #FFEF9F;
    border-radius: 50px;
    font-size: 12px;
    color: #B09200;
    padding: 6px;
    text-align: center;
    line-height: normal;
    display: flex;
    align-items: center;
    justify-content: center;
}

.new-req-order-popup-close-btn {
    width: fit-content;
    height: fit-content;
    cursor: pointer;
}

.new-req-timer-section-main {
    width: fit-content;
    margin: auto;
    margin-bottom: 24px;
    display: flex;
    align-items: center;
    gap: 6px;
}

    .new-req-timer-section-main p {
        font-size: 20px;
        color: #00A650;
        font-family: 'Inter 18pt sm-bold';
    }

.order-details-and-customer-details-popup-section-main {
    width: 100%;
}

.order-details-and-customer-details-popup-box-inside-main {
    width: 100%;
    height: 500px;
    overflow: auto;
    padding-right: 10px;
    scrollbar-width: thin;
    scrollbar-color: #00A650 white;
}

.order-details-popup-section-heading {
    width: 100%;
    margin-bottom: 16px;
    padding: 10px;
    border-radius: 8px;
    background-color: #00A650;
}

    .order-details-popup-section-heading p {
        color: white;
        font-size: 18px;
        font-family: 'Inter 18pt medium';
        line-height: normal;
    }

.order-full-details-popup-box-one-main {
    width: 100%;
    padding-bottom: 16px;
    margin-bottom: 16px;
    display: flex;
    flex-direction: column;
    gap: 10px;
    border-bottom: 1px solid #999999;
}

.order-full-details-popup-box-two {
    width: 100%;
    padding: 10px 16px;
    background-color: #EBF5EB;
    border-radius: 12px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    flex-wrap: wrap;
}

.order-details-full-image-box-popup {
    width: fit-content;
}

.order-details-full-popup-img-and-name-box {
    width: fit-content;
    display: flex;
    align-items: center;
    gap: 16px;
    flex-wrap: wrap;
}

.order-details-popup-text-cnctnt-main {
    width: fit-content;
}

    .order-details-popup-text-cnctnt-main h5 {
        color: black;
        font-size: 18px;
        margin-bottom: 8px;
        font-family: 'Inter 18pt medium';
        line-height: 24px;
    }

    .order-details-popup-text-cnctnt-main p {
        font-size: 16px;
        color: #999999;
        line-height: 24px;
        font-family: 'Inter 18pt medium';
    }

.order-full-details-price-box-popup {
    width: 100%;
    display: flex;
    flex-direction: column;
    gap: 10px;
    padding-bottom: 16px;
    margin-bottom: 16px;
    border-bottom: 1px solid #999999;
}

.order-full-details-sub-total-and-price-box-main {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 14px;
    flex-wrap: wrap;
}

    .order-full-details-sub-total-and-price-box-main .sub-total-popup {
        font-family: 'Inter 18pt medium';
        font-size: 16px;
        color: #999999;
    }

    .order-full-details-sub-total-and-price-box-main .sub-total-price-popup {
        font-family: 'Inter 18pt medium';
        font-size: 16px;
        color: #00A650;
    }

.order-full-details-total-main-box {
    width: 100%;
    margin-bottom: 16px;
}

    .order-full-details-total-main-box .order-full-details-sub-total-and-price-box-main .sub-total-popup {
        font-size: 18px;
        color: black;
        font-family: 'Inter 18pt sm-bold';
    }

    .order-full-details-total-main-box .order-full-details-sub-total-and-price-box-main .sub-total-price-popup {
        font-size: 18px;
        color: #00A650;
        font-family: 'Inter 18pt sm-bold';
    }

.order-details-name-and-contact-details-main {
    width: 100%;
    margin: auto;
    padding-bottom: 16px;
    margin-bottom: 16px;
    border-bottom: 1px solid #999999;
}

.order-details-name-and-contact-details-inside-box {
    width: 100%;
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 16px;
    flex-wrap: wrap;
}

.order-details-name-and-contact-details-box-first {
    width: 48%;
}

    .order-details-name-and-contact-details-box-first p {
        margin-bottom: 8px;
        font-size: 16px;
        font-family: 'Inter 18pt medium';
        color: #999999;
    }

    .order-details-name-and-contact-details-box-first h6 {
        color: black;
        font-size: 18px;
        font-family: 'Inter 18pt sm-bold';
    }

.order-details-popup-button-box-main {
    width: 100%;
    display: flex;
    justify-content: space-between;
    padding-top: 16px;
}

    .order-details-popup-button-box-main a {
        font-size: 16px;
        font-family: 'Inter 18pt sm-bold';
        width: 49%;
        border-radius: 6px;
        padding: 13px;
        display: flex;
        align-items: center;
        justify-content: center;
        line-height: normal;
    }

        .order-details-popup-button-box-main a.decline {
            color: #EB5757;
            border: 1px solid #EB5757;
        }

            .order-details-popup-button-box-main a.decline:hover {
                background-color: #EB5757;
                color: white;
            }

        .order-details-popup-button-box-main a.accept {
            border: 1px solid #00A650;
            color: white;
            background-color: #00A650;
        }

            .order-details-popup-button-box-main a.accept:hover {
                color: #00A650;
                background-color: transparent;
            }

/* ==== New Order Request popup end ==== */

/* === Reject Order popup start ==== */

.reject-order-popup-main {
    width: 100%;
    height: 100%;
    position: fixed;
    background-color: #01010185;
    top: 0px;
    left: 0px;
    right: 0px;
    backdrop-filter: blur(2px);
    bottom: 0px;
    margin: auto;
    z-index: 9;
    display: none;
}

    .reject-order-popup-main.active {
        display: block;
    }

.reject-order-popup-inside-main {
    position: absolute;
    top: 0px;
    left: 0px;
    right: 0px;
    bottom: 0px;
    margin: auto;
    width: 90%;
    max-width: 640px;
    padding: 24px;
    height: fit-content;
    background-color: white;
    border-radius: 12px;
    animation: zoomIn 0.3s ease forwards;
}

.reject-order-popup-heading-and-close-button-box-main {
    width: 100%;
    display: flex;
    justify-content: space-between;
    gap: 10px;
    flex-wrap: wrap;
    margin-bottom: 30px;
}

.reject-order-popup-heading-and-pera {
    width: fit-content;
}

    .reject-order-popup-heading-and-pera h5 {
        font-size: 24px;
        color: black;
        margin-bottom: 10px;
        font-family: 'Inter 18pt sm-bold';
        line-height: 24px;
    }

    .reject-order-popup-heading-and-pera p {
        font-size: 16px;
        font-family: 'Inter 18pt medium';
        color: #999999;
    }

.reject-popup-close-button-icon {
    width: fit-content;
    height: fit-content;
}

.reject-order-popup-textaria-box {
    width: 100%;
    margin-bottom: 30px;
}

    .reject-order-popup-textaria-box label {
        width: 100%;
        margin-bottom: 10px;
        color: black;
        font-size: 16px;
        font-family: 'Inter 18pt sm-bold';
    }

        .reject-order-popup-textaria-box label span {
            color: #EB5757;
        }

    .reject-order-popup-textaria-box textarea {
        width: 100%;
        border: 1px solid #999999;
        border-radius: 6px;
        resize: none;
        color: black;
        padding: 14px 10px;
        font-family: 'Inter 18pt medium';
        font-size: 16px;
        height: 114px;
    }

        .reject-order-popup-textaria-box textarea::placeholder {
            color: #999999;
        }

.reject-order-popup-button-cancel-and-reject-order {
    width: 100%;
    display: flex;
    justify-content: end;
    gap: 10px;
}

    .reject-order-popup-button-cancel-and-reject-order a {
        font-family: 'Inter 18pt sm-bold';
        font-size: 16px;
        padding: 14px 24px;
        border-radius: 12px;
        width: fit-content;
        display: flex;
        align-items: center;
        justify-content: center;
        background-color: transparent;
    }

        .reject-order-popup-button-cancel-and-reject-order a.cancel {
            border: 1px solid #00A650;
            color: #00A650;
        }

            .reject-order-popup-button-cancel-and-reject-order a.cancel:hover {
                background-color: #00A650;
                color: white;
            }

        .reject-order-popup-button-cancel-and-reject-order a.reject-order {
            border: 1px solid #EB5757;
            color: white;
            background-color: #EB5757;
        }

            .reject-order-popup-button-cancel-and-reject-order a.reject-order:hover {
                background-color: transparent;
                color: #EB5757;
            }

/* === Reject Order popup end ==== */

/* ==== Order rejected successfully popup start ==== */

.order-rejected-successfully-popup-main {
    width: 100%;
    height: 100%;
    position: fixed;
    background-color: #01010185;
    top: 0px;
    left: 0px;
    right: 0px;
    backdrop-filter: blur(2px);
    bottom: 0px;
    margin: auto;
    z-index: 9;
    display: none;
}

    .order-rejected-successfully-popup-main.active {
        display: block;
    }

.order-rejected-successfully-popup-inside-main {
    position: absolute;
    top: 0px;
    left: 0px;
    right: 0px;
    bottom: 0px;
    margin: auto;
    width: 90%;
    max-width: 580px;
    padding: 24px;
    height: fit-content;
    background-color: white;
    border-radius: 12px;
    animation: zoomIn 0.3s ease forwards;
}

.order-rejected-popup-close-button {
    width: fit-content;
    height: fit-content;
    margin-left: auto;
    margin-bottom: 24px;
}

.order-rejected-cross-icon-box {
    width: 160px;
    height: 160px;
    margin: auto;
    margin-bottom: 24px;
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: #EBF5EB;
    border-radius: 100px;
}

.order-rejected-popup-pera-box p {
    text-align: center;
    font-size: 18px;
}

/* ==== Order rejected successfully popup end ==== */

/* ==== orders all orders page start ==== */

.all-orders-management-section-main {
    width: 100%;
    margin: auto;
}


.all-page-commun-tab-pnl-main {
    width: 100%;
}

    .all-page-commun-tab-pnl-main .all-page-commun-tab-header {
        display: flex;
        gap: 15px;
        flex-wrap: nowrap;
        background-color: #F0F2F4;
        border-radius: 12px;
        padding: 6px;
        overflow: auto;
        scrollbar-width: none;
    }

    .all-page-commun-tab-pnl-main .tab-btn {
        padding: 8px 16px;
        background: transparent;
        border: none;
        border-radius: 12px;
        cursor: pointer;
        color: #888;
        white-space: nowrap;
        font-size: 16px;
        font-family: 'Inter 18pt medium';
        transition: 0.3s;
        line-height: normal;
    }

        .all-page-commun-tab-pnl-main .tab-btn.active {
            background: #19a463;
            color: #fff;
        }

    .all-page-commun-tab-pnl-main .all-page-commun-tab-content {
        margin-top: 32px;
    }

    .all-page-commun-tab-pnl-main .tab-pane {
        display: none;
        background: #fff;
        border-radius: 10px;
    }

        .all-page-commun-tab-pnl-main .tab-pane.active {
            display: block;
        }


/* ==== orders all orders page end ==== */

/* ==== data table start ==== */

.all-page-cmn-data-tbl-mn table {
    width: 100% !important;
    font-size: 14px;
}

    .all-page-cmn-data-tbl-mn table thead {
        background: #f4f6fb;
    }

    .all-page-cmn-data-tbl-mn table th,
    .all-page-cmn-data-tbl-mn table td {
        padding: 14px 18px;
    }

    .all-page-cmn-data-tbl-mn table th {
        font-family: 'Inter 18pt bold';
        padding: 13px 10px !important;
        background-color: #fff;
        border-bottom: 1px solid #F0F0F0 !important;
    }

    .all-page-cmn-data-tbl-mn table td {
        border-top: 1px solid #F0F0F0 !important;
    }

    .all-page-cmn-data-tbl-mn table tbody tr:hover {
        background: #fafafa;
    }

    .all-page-cmn-data-tbl-mn table.dataTable.no-footer {
        border: 1px solid #DEE2E6;
    }

    .all-page-cmn-data-tbl-mn table.dataTable.display > tbody > tr.odd > * {
        box-shadow: unset !important;
        background-color: #F7F6FE;
    }

/* STATUS BADGES */
.status {
    padding: 6px 14px;
    border-radius: 30px;
    display: flex;
    align-items: center;
    justify-content: center;
}

    .status.yellow {
        width: 120px;
        color: #B09200;
        background-color: #FFEF9F;
        font-size: 12px;
        font-family: 'Inter 18pt medium';
        text-align: center;
        line-height: normal;
    }

    .status.gray {
        width: 120px;
        color: #757575;
        background-color: #C3C3C3;
        font-size: 12px;
        font-family: 'Inter 18pt medium';
        text-align: center;
        line-height: normal;
    }

    .status.perple {
        width: 120px;
        padding: 6px;
        color: #2752AA;
        background-color: #BAD1FF;
        font-size: 12px;
        font-family: 'Inter 18pt medium';
        text-align: center;
        line-height: normal;
    }

    .status.pink {
        width: 120px;
        padding: 6px;
        color: #910EDC;
        background-color: #F2DAFF;
        font-size: 12px;
        font-family: 'Inter 18pt medium';
        text-align: center;
        line-height: normal;
    }

    .status.orange {
        width: 120px;
        padding: 6px;
        color: #FF9500;
        background-color: #FFF1C4;
        font-size: 12px;
        font-family: 'Inter 18pt medium';
        text-align: center;
        line-height: normal;
    }

    .status.dark-yellow {
        width: 120px;
        padding: 6px;
        color: #C49E08;
        background-color: #FDFF9F;
        font-size: 12px;
        font-family: 'Inter 18pt medium';
        text-align: center;
        line-height: normal;
    }

    .status.green {
        width: 120px;
        padding: 6px;
        color: #09B644;
        background-color: #bfffd4;
        font-size: 12px;
        font-family: 'Inter 18pt medium';
        text-align: center;
        line-height: normal;
    }

    .status.red {
        width: 120px;
        padding: 6px;
        color: #FF2A2A;
        background-color: #ffdada;
        font-size: 12px;
        font-family: 'Inter 18pt medium';
        text-align: center;
        line-height: normal;
    }

.view-icon {
    font-size: 20px;
    cursor: pointer;
}

/* PAGINATION UI */

.dataTables_wrapper .dataTables_paginate {
    padding-top: 0px !important;
    margin-top: 0px !important;
}

    .dataTables_wrapper .dataTables_paginate .paginate_button {
        padding: 9px 14px !important;
        border-radius: 8px !important;
        border: 1px solid #cfcfcf !important;
        background: #fff !important;
        cursor: pointer;
        margin-left: 0px !important;
        font-size: 14px;
    }

        .dataTables_wrapper .dataTables_paginate .paginate_button.previous {
            border-top-left-radius: 12px !important;
            border-bottom-left-radius: 12px !important;
        }

        .dataTables_wrapper .dataTables_paginate .paginate_button.next {
            border-top-right-radius: 12px !important;
            border-bottom-right-radius: 12px !important;
        }

    .dataTables_wrapper .dataTables_paginate .paginate_button {
        border-radius: 0px !important;
    }

        .dataTables_wrapper .dataTables_paginate .paginate_button.current {
            background: #00A650 !important;
            color: #fff !important;
        }

        .dataTables_wrapper .dataTables_paginate .paginate_button:hover {
            background: #00A650 !important;
            color: #fff !important;
        }

/* BOTTOM SECTION - FLEX */
.table-bottom-main {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding-top: 32px;
    gap: 14px;
    flex-wrap: wrap;
}

.dataTables_info {
    font-size: 16px;
    color: #999999 !important;
    font-family: 'Inter 18pt medium';
    padding: 0px !important;
}

.table-action-box {
    display: flex;
    align-items: center;
    gap: 14px;
}

    .table-action-box a {
        display: flex;
        align-items: center;
        justify-content: center;
        width: fit-content;
        height: fit-content;
    }

/* ==== data table end ==== */

/* ==== Orders Details Requested start ==== */

.wagzo-inside-page-back-commun-main {
    width: 100%;
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 14px;
    flex-wrap: wrap;
    margin-bottom: 20px;
}

    .wagzo-inside-page-back-commun-main a {
        display: flex;
        align-items: center;
        gap: 10px;
        font-size: 20px;
        color: black;
        font-family: 'Inter 18pt medium';
    }

        .wagzo-inside-page-back-commun-main a i {
            color: #00A650;
            font-size: 24px;
        }

.order-details-page-main-box {
    width: 100%;
    padding: 20px;
    border-radius: 12px;
    box-shadow: 0px 0px 18px #00000018;
}

.order-details-order-id-and-order-status-box-one {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    flex-wrap: wrap;
    margin-bottom: 24px;
}

.order-details-order-id-box-one {
    width: fit-content;
}

    .order-details-order-id-box-one h4 {
        font-size: 24px;
        color: black;
        font-family: 'Inter 18pt sm-bold';
    }

.order-id-details-status-box {
    width: fit-content;
    display: flex;
    align-items: center;
    gap: 10px;
}

.status-order-id-details-box-main {
    display: flex;
    align-items: center;
    justify-content: center;
    width: fit-content;
    font-size: 20px;
    color: black;
    font-family: 'Inter 18pt medium';
}

.order-items-and-customer-details-main {
    width: 100%;
    display: flex;
    justify-content: space-between;
    gap: 20px;
    flex-wrap: wrap;
}

.ordered-items-box-details-box-two-main {
    width: 60%;
    height: fit-content;
    border-radius: 12px;
    padding: 20px;
    box-shadow: 0px 0px 18px #00000018;
    margin-bottom: 20px;
}

.ordered-items-details-tital-box {
    width: 100%;
    margin-bottom: 16px;
}

    .ordered-items-details-tital-box h4 {
        color: #00A650;
        font-size: 24px;
        font-family: 'Inter 18pt sm-bold';
    }

.ordered-items-list-and-total-box-main {
    width: 100%;
    margin: auto;
}

.order-items-details-customer-details-main-box {
    width: 38%;
    height: fit-content;
}

.order-items-details-customer-details-box-two-inside-main,
.order-items-details-customer-order-timeline-main {
    width: 100%;
    border-radius: 12px;
    padding: 20px;
    box-shadow: 0px 0px 18px #00000018;
    margin-bottom: 20px;
}

.order-items-details-customer-details-main-box .order-details-name-and-contact-details-inside-box .order-details-name-and-contact-details-box-first {
    width: 100%;
}

    .order-items-details-customer-details-main-box .order-details-name-and-contact-details-inside-box .order-details-name-and-contact-details-box-first:nth-child(1) {
        padding-bottom: 16px;
        border-bottom: 1px solid #999999;
    }

.ordered-items-box-details-box-two-main .order-full-details-popup-box-two {
    background-color: #F9FAFB;
}

.order-items-order-timeline-dots-and-timeline-status-main {
    width: 100%;
    display: flex;
    flex-direction: column;
    gap: 16px;
}

.order-items-order-dots-and-time-line-and-status-box-one-inside-main {
    width: 100%;
    display: flex;
    gap: 10px;
    flex-wrap: wrap;
}

.order-details-status-icon-progress-icn-main {
    width: 32px;
    min-width: 32px;
    height: 32px;
    background-color: #FDCF13;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50px;
}

.order-status-timeline-text-main-box-one {
    width: fit-content;
}

    .order-status-timeline-text-main-box-one h5 {
        font-size: 18px;
        margin-bottom: 4px;
        font-family: 'Inter 18pt medium';
    }

    .order-status-timeline-text-main-box-one p {
        font-size: 14px;
        color: #999999;
        font-family: 'Inter 18pt medium';
        line-height: normal;
    }

.order-details-action-box-main {
    width: 60%;
    border-radius: 12px;
    padding: 20px;
    box-shadow: 0px 0px 18px #00000018;
}

.order-items-action-pera-box-main {
    width: 100%;
    margin-bottom: 16px;
}

    .order-items-action-pera-box-main p {
        color: #999999;
        font-size: 16px;
        list-style: 24px;
        font-family: 'Inter 18pt medium';
    }

.order-details-action-box-main .order-details-popup-button-box-main {
    padding-top: 0px;
}

    .order-details-action-box-main .order-details-popup-button-box-main a {
        border-radius: 12px;
        align-items: center;
        gap: 10px;
        transition: 0.0s;
    }

        .order-details-action-box-main .order-details-popup-button-box-main a.decline {
            background-color: #EB5757;
            color: white;
        }

            .order-details-action-box-main .order-details-popup-button-box-main a.decline:hover {
                background-color: transparent;
                color: #EB5757;
            }

                .order-details-action-box-main .order-details-popup-button-box-main a.decline:hover img {
                    filter: brightness(0) saturate(100%) invert(47%) sepia(80%) saturate(2243%) hue-rotate(329deg) brightness(95%) contrast(95%);
                }

        .order-details-action-box-main .order-details-popup-button-box-main a.accept:hover img {
            filter: brightness(0) saturate(100%) invert(39%) sepia(58%) saturate(4541%) hue-rotate(133deg) brightness(99%) contrast(101%);
        }

.order-details-update-status-button-main {
    width: 100%;
}

    .order-details-update-status-button-main a {
        font-size: 16px;
        font-family: 'Inter 18pt sm-bold';
        width: 100%;
        border-radius: 12px;
        padding: 13px;
        display: flex;
        align-items: center;
        justify-content: center;
        line-height: normal;
        border: 1px solid #00A650;
        color: white;
        background-color: #00A650;
        gap: 10px;
        transition: 0.0s;
    }

        .order-details-update-status-button-main a:hover {
            color: #00A650;
            background-color: transparent;
        }

        .order-details-update-status-button-main a:hover {
            filter: brightness(0) saturate(100%) invert(39%) sepia(58%) saturate(4541%) hue-rotate(133deg) brightness(99%) contrast(101%);
        }

.order-details-status-icon-progress-icn-main.delivered-green {
    background-color: #00A650;
}

.order-details-status-icon-progress-icn-main.rejected-red {
    background-color: #EB5757;
}

.request-rejection-reason-box-main {
    width: 100%;
    margin: auto;
    padding: 16px;
    border-radius: 12px;
    border: 1px solid #EB5757;
    background-color: #FFDADA;
}

    .request-rejection-reason-box-main h5 {
        font-size: 16px;
        color: black;
        font-family: 'Inter 18pt medium';
        line-height: normal;
        margin-bottom: 8px;
    }

    .request-rejection-reason-box-main p {
        font-size: 14px;
        color: #999999;
        font-family: 'Inter 18pt medium';
        line-height: normal;
    }

.wagzo-product-catelog-heading-sec-box-one {
    width: fit-content;
}

.wagzo-product-catelog-page-add-new-product-btn-box {
    width: fit-content;
}

    .wagzo-product-catelog-page-add-new-product-btn-box a {
        width: fit-content;
        display: flex;
        align-items: center;
        justify-content: center;
        font-size: 16px;
        color: white;
        background-color: #00A650;
        gap: 6px;
        border-radius: 6px;
        border: 1px solid #00A650;
        padding: 13px 16px;
        line-height: normal;
        font-family: 'Inter 18pt regular';
    }

        .wagzo-product-catelog-page-add-new-product-btn-box a:hover {
            color: #00A650;
            background-color: transparent;
        }

.all-product-page-catalog-tab-section-main .all-page-commun-tab-header {
    width: fit-content;
}

.all-product-catalog-box-section-one {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: start;
    gap: 20px;
    flex-wrap: wrap;
}

.all-product-card-box-one-catalog {
    width: 33%;
    width: calc(33% - 10px);
    padding: 24px 16px;
    border-radius: 12px;
    box-shadow: 0px 0px 18px #00000018;
}

.product-catelogtital-and-available-box {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    flex-wrap: wrap;
    margin-bottom: 10px;
}

    .product-catelogtital-and-available-box h5 {
        color: black;
        font-size: 18px;
        font-family: 'Inter 18pt sm-bold';
        line-height: 24px;
        width: 68%;
    }

    .product-catelogtital-and-available-box .available-btn {
        display: flex;
        align-items: center;
        justify-content: center;
        width: fit-content;
        font-size: 14px;
        line-height: 16px;
        color: #00A650;
        background-color: #EBF5EB;
        border: 1px solid #00A650;
        border-radius: 8px;
        padding: 3px 9px;
    }

    .product-catelogtital-and-available-box .unavailable-btn {
        display: flex;
        align-items: center;
        justify-content: center;
        width: fit-content;
        font-size: 14px;
        line-height: 16px;
        color: #999999;
        background-color: #E9E9E9;
        border: 1px solid #E9E9E9;
        border-radius: 8px;
        padding: 3px 9px;
    }

.product-catalog-sub-tital-box {
    margin-bottom: 32px;
}

    .product-catalog-sub-tital-box p {
        color: #999999;
        font-size: 14px;
        line-height: 24px;
        font-family: 'Inter 18pt medium';
    }

.product-catalog-price-box-section {
    margin-bottom: 32px;
}

    .product-catalog-price-box-section h6 {
        font-size: 24px;
        color: #00A650;
        font-family: 'Inter 18pt sm-bold';
    }

.product-catalog-card-edit-and-delete-box-main {
    width: 100%;
    display: flex;
    justify-content: space-between;
    gap: 10px;
}

.pdct-ctlg-edit-card-btn {
    width: 100%;
}

    .pdct-ctlg-edit-card-btn a {
        display: flex;
        align-items: center;
        justify-content: center;
        gap: 5px;
        color: black;
        font-size: 16px;
        font-family: 'Inter 18pt sm-bold';
        padding: 13px 16px;
        border-radius: 12px;
        border: 1px solid #999999;
        line-height: normal;
        transition: 0.0s;
    }

        .pdct-ctlg-edit-card-btn a:hover {
            background-color: #00A650;
            border-color: #00A650;
            color: white;
        }

            .pdct-ctlg-edit-card-btn a:hover img {
                filter: brightness(0) saturate(100%) invert(100%) sepia(4%) saturate(5%) hue-rotate(233deg) brightness(103%) contrast(100%);
            }

.pdct-ctlgdlt-card-btn-main {
    width: 48px;
    min-width: 48px;
    height: 48px;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    border-radius: 12px;
    border: 1px solid #999999;
    transition: 0.0s;
}

    .pdct-ctlgdlt-card-btn-main:hover {
        background-color: #EB5757;
        border-color: #EB5757;
    }

        .pdct-ctlgdlt-card-btn-main:hover img {
            filter: brightness(0) saturate(100%) invert(100%) sepia(4%) saturate(5%) hue-rotate(233deg) brightness(103%) contrast(100%);
        }

/* ==== Orders Details Requested end ==== */

/* ==== Delete product popup start ==== */

.delete-product-popup-main {
    width: 100%;
    height: 100%;
    position: fixed;
    background-color: #01010185;
    top: 0px;
    left: 0px;
    right: 0px;
    backdrop-filter: blur(2px);
    bottom: 0px;
    margin: auto;
    z-index: 9;
    display: none;
}

    .delete-product-popup-main.active {
        display: block;
    }

.delete-product-popup-inside-main {
    position: absolute;
    top: 0px;
    left: 0px;
    right: 0px;
    bottom: 0px;
    margin: auto;
    width: 90%;
    max-width: 640px;
    padding: 24px;
    height: fit-content;
    background-color: white;
    border-radius: 12px;
    animation: zoomIn 0.3s ease forwards;
}

.delet-catalog-popup-button-main-box {
    width: 100%;
    display: flex;
    justify-content: end;
    gap: 10px;
}

    .delet-catalog-popup-button-main-box a {
        display: flex;
        align-items: center;
        justify-content: center;
        font-size: 16px;
        font-family: 'Inter 18pt sm-bold';
        border-radius: 12px;
        padding: 13px 24px;
        line-height: normal;
    }

        .delet-catalog-popup-button-main-box a.cancel {
            border: 1px solid #999999;
            color: #999999;
        }

            .delet-catalog-popup-button-main-box a.cancel:hover {
                background-color: #999999;
                color: white;
            }

        .delet-catalog-popup-button-main-box a.delete {
            background-color: #EB5757;
            border: 1px solid #EB5757;
            color: white;
        }

            .delet-catalog-popup-button-main-box a.delete:hover {
                color: #EB5757;
                background-color: transparent;
            }

/* ==== Delete product popup end ==== */

/* ==== add new product start ==== */

.add-new-product-page-box-main {
    width: 100%;
    margin: auto;
}

.general-information-details-add-main {
    width: 100%;
    margin: auto;
}

    .general-information-details-add-main .step-two-box-one-input-and-select-main .profile-details-inside-main {
        width: 48%;
    }

    .general-information-details-add-main .step-two-box-one-input-and-select-main {
        margin-bottom: 24px;
    }

.description-genral-information-page-box {
    width: 100%;
    margin-bottom: 24px;
}

    .description-genral-information-page-box .profile-details-inside-main {
        width: 100%;
    }

        .description-genral-information-page-box .profile-details-inside-main textarea {
            width: 100%;
            border: 1px solid #999999;
            border-radius: 6px;
            font-size: 14px;
            font-family: 'Inter 18pt medium';
            padding: 14px 10px;
            line-height: normal;
            resize: none;
            height: 114px;
        }

            .description-genral-information-page-box .profile-details-inside-main textarea::placeholder {
                color: #999999;
            }

.other-information-genral-information-main {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
    flex-wrap: wrap;
}

.other-information-genral-information-main {
    width: 100%;
    margin-bottom: 24px;
}

    .other-information-genral-information-main .ordered-items-details-tital-box {
        width: fit-content;
        margin-bottom: 0px;
    }

.order-add-new-product-main-other-info-box {
    width: 100%;
    display: flex;
    justify-content: space-between;
    align-items: end;
    gap: 16px;
    margin-bottom: 24px;
}

    .order-add-new-product-main-other-info-box .profile-details-inside-main {
        width: 100%;
    }

.order-add-info-genrl-info-delete-box-main {
    width: fit-content;
}

    .order-add-info-genrl-info-delete-box-main button {
        width: 48px;
        min-width: 48px;
        height: 48px;
        border-radius: 12px;
        display: flex;
        align-items: center;
        justify-content: center;
        border: 1px solid #EB5757;
        background-color: #EB5757;
    }

.order-add-new-product-main-other-info-box-description-box-main .description-genral-information-page-box {
    margin-bottom: 0px;
}

.order-add-new-product-main-other-info-box-description-box-main {
    width: calc(100% - 64px);
}

    .order-add-new-product-main-other-info-box-description-box-main .profile-details-inside-main {
        width: 100%;
    }

.add-new-product-delivery-option-box-one {
    width: 100%;
    display: flex;
    flex-direction: column;
    gap: 16px;
}

.add-new-product-delivery-option-inside-box-one {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    flex-wrap: wrap;
    background-color: #EBF5EB;
    border-radius: 12px;
    padding: 24px 16px;
}

    .add-new-product-delivery-option-inside-box-one h6 {
        color: black;
        font-size: 20px;
        font-family: 'Inter 18pt medium';
        line-height: normal;
    }

.delivery-option-toggle-switch {
    position: relative;
    width: 40px;
    height: 24px;
}

    .delivery-option-toggle-switch input {
        display: none;
    }

.delivery-option-toggle-slider {
    position: absolute;
    cursor: pointer;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: #d8e1d9;
    border-radius: 24px;
    transition: 0.3s;
}

    .delivery-option-toggle-slider::before {
        content: "";
        position: absolute;
        width: 18px;
        height: 18px;
        left: 3px;
        top: 3px;
        background: white;
        border-radius: 50%;
        transition: 0.3s;
    }

.delivery-option-toggle-switch input:checked + .delivery-option-toggle-slider {
    background-color: #34C759;
}

    .delivery-option-toggle-switch input:checked + .delivery-option-toggle-slider::before {
        transform: translateX(16px);
    }

.add-new-product-order-status-and-time-line-box {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    flex-wrap: wrap;
    border-radius: 12px;
    background-color: #EBF5EB;
    padding: 24px 16px;
}

.add-new-product-status-and-time-line-availability-box-two {
    width: calc(100% - 150px);
}

    .add-new-product-status-and-time-line-availability-box-two h5 {
        font-size: 18px;
        color: #00A650;
        line-height: 24px;
        margin-bottom: 8px;
        font-family: 'Inter 18pt medium';
    }

    .add-new-product-status-and-time-line-availability-box-two p {
        font-size: 16px;
        color: #999999;
        font-family: 'Inter 18pt medium';
        line-height: 24px;
    }

.status-avaibility-main {
    display: flex;
    align-items: center;
    gap: 6px;
}

/* TEXT STYLING */
.status-avaibility-text {
    font-size: 14px;
    font-family: 'Inter 18pt sm-bold';
    color: #3EB900;
    /* active */
    transition: 0.3s;
}

/* MAIN WRAPPER */
.status-avaibility-toggle-switch {
    position: relative;
    width: 40px;
    height: 24px;
}

    /* HIDE CHECKBOX */
    .status-avaibility-toggle-switch input {
        display: none;
    }

/* TOGGLE DESIGN */
.status-avaibility-toggle-slider {
    position: absolute;
    cursor: pointer;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: #d8e1d9;
    /* inactive color */
    border-radius: 24px;
    transition: 0.3s;
}

    /* INSIDE CIRCLE */
    .status-avaibility-toggle-slider::before {
        content: "";
        position: absolute;
        width: 18px;
        height: 18px;
        left: 3px;
        top: 3px;
        background: white;
        border-radius: 50%;
        transition: 0.3s;
    }

/* ACTIVE STATE */
.status-avaibility-toggle-switch input:checked + .status-avaibility-toggle-slider {
    background-color: #34C759;
}

    .status-avaibility-toggle-switch input:checked + .status-avaibility-toggle-slider::before {
        transform: translateX(16px);
    }

.add-new-product-create-and-cancel-button-main {
    width: 100%;
    margin: auto;
    display: flex;
    flex-direction: column;
    gap: 16px;
}

    .add-new-product-create-and-cancel-button-main button {
        width: 100%;
        border-radius: 12px;
        font-size: 16px;
        font-family: 'Inter 18pt sm-bold';
        padding: 13px 10px;
        line-height: normal;
    }

        .add-new-product-create-and-cancel-button-main button.create-product {
            border: 1px solid #00A650;
            background-color: #00A650;
            color: white;
        }

            .add-new-product-create-and-cancel-button-main button.create-product:hover {
                color: #00A650;
                background-color: transparent;
            }

        .add-new-product-create-and-cancel-button-main button.cancel-product {
            border: 1px solid #00A650;
            color: #00A650;
            background-color: transparent;
        }

            .add-new-product-create-and-cancel-button-main button.cancel-product:hover {
                background-color: #00a6501f;
                color: #00A650;
            }

.product-variations-add-new-product-page-box-one {
    width: fit-content;
}

.product-variations-add-new-product-page-box-one {
    width: 60%;
    height: fit-content;
}

    .product-variations-add-new-product-page-box-one .ordered-items-box-details-box-two-main {
        width: 100%;
    }

.product-variations-and-dpdn-main {
    width: 100%;
    display: flex;
    gap: 16px;
    align-items: end;
    justify-content: space-between;
    background-color: #EBF5EB;
    border-radius: 12px;
    padding: 16px;
}

.product-variation-delete-box {
    width: fit-content;
}

    .product-variation-delete-box button {
        width: 48px;
        min-width: 48px;
        height: 48px;
        display: flex;
        align-items: center;
        justify-content: center;
        background-color: white;
        border-radius: 12px;
        border: 1px solid #999999;
    }

        .product-variation-delete-box button:hover {
            background-color: #EB5757;
            border-color: #EB5757;
        }

            .product-variation-delete-box button:hover img {
                filter: brightness(0) saturate(100%) invert(99%) sepia(1%) saturate(0%) hue-rotate(15deg) brightness(118%) contrast(100%);
            }

.product-variations-and-dpdn-main .step-two-box-one-input-and-select-main {
    margin-bottom: 0px;
}

.product-media-upload-box-main {
    width: 100%;
    padding: 16px;
    border-radius: 12px;
    background-color: #EBF5EB;
}





.product-media-upload-box-main-container {
    display: flex;
    align-items: center;
    gap: 16px;
    flex-wrap: wrap;
}

.product-media-upload-box-main-card {
    width: 140px;
    height: 140px;
    border-radius: 12px;
    border: 2px solid #00A650;
    position: relative;
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 16px;
    overflow: hidden;
}

    .product-media-upload-box-main-card.upload {
        border: 2px dashed #00A650;
        cursor: pointer;
    }


        .product-media-upload-box-main-card.upload label {
            display: flex;
            align-items: center;
            flex-direction: column;
            gap: 8px;
            cursor: pointer;
        }

        .product-media-upload-box-main-card.upload span {
            font-size: 16px;
            font-family: 'Inter 18pt medium';
            color: black;
        }

.product-media-upload-box-main-img {
    width: auto;
    height: auto;
    object-fit: cover;
}

.product-media-upload-box-main-remove {
    position: absolute;
    top: 6px;
    right: 6px;
    width: 22px;
    height: 22px;
    font-size: 13px;
    background: transparent;
    border: unset;
    padding: 0px;
    cursor: pointer;
    display: flex;
    justify-content: center;
    align-items: center;
}

/* ==== add new product end ==== */

/* ==== Edit Products page start ==== */

.edit-product-for-food-and-treats-show-variables-box {
    background-color: #EBF5EB;
    border-radius: 12px;
    padding: 16px;
}

    .edit-product-for-food-and-treats-show-variables-box .product-variations-and-dpdn-main {
        background-color: transparent;
        border-radius: 0px;
        padding: 0px;
        margin-bottom: 10px;
    }

.edit-product-for-food-and-treats-section-select-and-dpdn-main {
    width: 100%;
    display: flex;
    justify-content: space-between;
}

/* ==== Edit Products page end ==== */

/* ==== inventory page start ==== */


.expotr-tbl-contant-btn a {
    background-color: transparent;
    color: #00A650;
    transition: 0.0s;
}

    .expotr-tbl-contant-btn a:hover {
        background-color: #00A650;
        color: white;
    }

        .expotr-tbl-contant-btn a:hover img {
            filter: brightness(0) saturate(100%) invert(100%) sepia(3%) saturate(1%) hue-rotate(139deg) brightness(105%) contrast(101%);
        }

.expotr-tbl-contant-btn button {
    background-color: transparent;
    color: #00A650;
    transition: 0.0s;
}

    .expotr-tbl-contant-btn button:hover {
        background-color: #00A650;
        color: white;
    }

        .expotr-tbl-contant-btn button:hover img {
            filter: brightness(0) saturate(100%) invert(100%) sepia(3%) saturate(1%) hue-rotate(139deg) brightness(105%) contrast(101%);
        }

.inventory-add-stock-popup {
    width: 100%;
    height: 100%;
    position: fixed;
    background-color: #01010185;
    top: 0px;
    left: 0px;
    right: 0px;
    backdrop-filter: blur(2px);
    bottom: 0px;
    margin: auto;
    z-index: 9;
    display: none;
}

    .inventory-add-stock-popup.active {
        display: block;
    }

.adjustment-type-button-main {
    width: 100%;
    display: flex;
    justify-content: space-between;
    gap: 10px;
    flex-wrap: wrap;
}

    .adjustment-type-button-main button {
        width: 49%;
        font-size: 16px;
        font-family: 'Inter 18pt sm-bold';
        padding: 13px;
        line-height: normal;
        border-radius: 12px;
        background-color: transparent;
    }

        .adjustment-type-button-main button.add-stock {
            border: 1px solid #00A650;
            background-color: #00A650;
            color: white;
            transition: 0.3s;
        }

            .adjustment-type-button-main button.add-stock:hover {
                background-color: transparent;
                color: #00A650;
            }

        .adjustment-type-button-main button.remove-stock {
            border: 1px solid #999999;
            color: black;
        }

            .adjustment-type-button-main button.remove-stock:hover {
                background-color: #eb575718;
                color: #EB5757;
                border-color: #EB5757;
            }

.inventory-add-stock-popup .reject-order-popup-button-cancel-and-reject-order a.reject-order {
    background-color: #00A650;
    color: white;
    border-color: #00A650;
}

    .inventory-add-stock-popup .reject-order-popup-button-cancel-and-reject-order a.reject-order:hover {
        background-color: #00a6501a;
        color: #00A650;
    }

.inventory-add-stock-popup .reject-order-popup-textaria-box input,
.inventory-remove-stock-popup .reject-order-popup-textaria-box input {
    width: 100%;
    border: 1px solid #999999;
    border-radius: 6px;
    font-size: 14px;
    font-family: 'Inter 18pt medium';
    padding: 14px 10px;
    line-height: normal;
}

.inventory-remove-stock-popup {
    width: 100%;
    height: 100%;
    position: fixed;
    background-color: #01010185;
    top: 0px;
    left: 0px;
    right: 0px;
    backdrop-filter: blur(2px);
    bottom: 0px;
    margin: auto;
    z-index: 9;
    display: none;
}

    .inventory-remove-stock-popup.active {
        display: block;
    }

    .inventory-remove-stock-popup .adjustment-type-button-main button.add-stock {
        border: 1px solid #999999;
        color: black;
        background-color: transparent;
    }

        .inventory-remove-stock-popup .adjustment-type-button-main button.add-stock:hover {
            background-color: #00A650;
            color: white;
            border-color: #00A650;
        }

    .inventory-remove-stock-popup .adjustment-type-button-main button.remove-stock {
        border: 1px solid #EB5757;
        color: white;
        background-color: #EB5757;
    }

        .inventory-remove-stock-popup .adjustment-type-button-main button.remove-stock:hover {
            background-color: #eb575718;
            color: #EB5757;
        }

/* ==== inventory page end ==== */

/* ==== report page start ==== */

.day-ddpdn-main-hdr {
    display: flex;
    gap: 16px;
}

    .day-ddpdn-main-hdr .single-select {
        width: 160px;
    }

.report-page-box-one .top-product-list-box-inside-main-seciton {
    background-color: #EBF5EB;
}

.report-page-box-one .wagzo-all-page-commun-heading-and-pera-main .wagzo-product-catelog-heading-sec-box-one .ordered-items-details-tital-box {
    margin-bottom: 8px;
}

.report-page-order-by-status-box-one {
    width: 100%;
    display: flex;
    flex-direction: column;
    gap: 20px;
}

    .report-page-order-by-status-box-one .progress-row-top {
        display: flex;
        justify-content: space-between;
        margin-bottom: 8px;
    }

    .report-page-order-by-status-box-one .progress-title {
        font-size: 16px;
        color: #000;
        font-family: 'Inter 18pt sm-bold';
    }

    .report-page-order-by-status-box-one .progress-value {
        font-size: 16px;
        color: #999999;
    }

    .report-page-order-by-status-box-one .progress-bar {
        width: 100%;
        height: 8px;
        background-color: #EBF5EB;
        border-radius: 15px;
        overflow: hidden;
    }

    .report-page-order-by-status-box-one .progress-fill {
        height: 100%;
        border-radius: 15px;
    }

    .report-page-order-by-status-box-one .completed {
        background-color: #00A650;
    }

    .report-page-order-by-status-box-one .processing {
        background-color: #910EDC;
    }

    .report-page-order-by-status-box-one .new-orders {
        background-color: #FF6B00;
    }

    .report-page-order-by-status-box-one .rejected {
        background-color: #EB5757;
    }

/* ==== report page end ==== */

/* ==== messages page start ==== */

.massages-inbox-sent-and-trash-dropdown-main {
    width: 100%;
    position: relative;
}

    .massages-inbox-sent-and-trash-dropdown-main .dropdown-box {
        width: 136px;
        position: relative;
        margin-left: auto;
        margin-bottom: 32px;
    }

    .massages-inbox-sent-and-trash-dropdown-main .custom-dropdown-selected {
        border: 1px solid #16A34A;
        padding: 8px 12px;
        display: flex;
        justify-content: space-between;
        cursor: pointer;
        border-radius: 6px;
        background: #fff;
        color: #16A34A;
        user-select: none;
    }

    .massages-inbox-sent-and-trash-dropdown-main .arrow {
        transition: 0.3s ease;
    }

    .massages-inbox-sent-and-trash-dropdown-main .custom-dropdown-selected.active .arrow {
        transform: rotate(180deg);
    }

    .massages-inbox-sent-and-trash-dropdown-main .custom-dropdown-options {
        display: none;
        position: absolute;
        top: 45px;
        width: 100%;
        border: 1px solid #16A34A;
        background: #fff;
        border-radius: 6px;
        overflow: hidden;
        z-index: 50;
    }

        .massages-inbox-sent-and-trash-dropdown-main .custom-dropdown-options .option {
            padding: 10px 12px;
            cursor: pointer;
            color: #16A34A;
            border-bottom: 1px solid #ddd;
        }

            .massages-inbox-sent-and-trash-dropdown-main .custom-dropdown-options .option:last-child {
                border-bottom: none;
            }

            .massages-inbox-sent-and-trash-dropdown-main .custom-dropdown-options .option:hover {
                background: #f1f1f1;
            }

    .massages-inbox-sent-and-trash-dropdown-main .tabs-main .tab-panel {
        display: none;
    }

        .massages-inbox-sent-and-trash-dropdown-main .tabs-main .tab-panel.active {
            display: block;
        }

/* == inbox tab start == */

.messages-inbox-tab-box-main {
    width: 100%;
}

    .messages-inbox-tab-box-main .msg-top-bar {
        display: flex;
        align-items: center;
        gap: 16px;
        margin-bottom: 24px;
        flex-wrap: wrap;
    }

        .messages-inbox-tab-box-main .msg-top-bar .select-all-box {
            color: black;
            font-size: 16px;
            font-family: 'Inter 18pt medium';
        }

    .messages-inbox-tab-box-main .select-all-box input {
        margin-right: 8px;
    }

    .messages-inbox-tab-box-main .delete-all-btn {
        background: transparent;
        border: none;
        cursor: pointer;
        font-size: 16px;
        color: black;
        font-family: 'Inter 18pt medium';
    }

        .messages-inbox-tab-box-main .delete-all-btn span.all-dlt-icn-box-one {
            background: #EB5757;
            width: 24px;
            height: 24px;
            border: none;
            padding: 0px;
            cursor: pointer;
            border-radius: 2px;
            display: flex;
            align-items: center;
            justify-content: center;
        }

        .messages-inbox-tab-box-main .delete-all-btn .main-all-delete-btn-boximg-and-text {
            display: flex;
            align-items: center;
            gap: 10px;
        }

    .messages-inbox-tab-box-main .message-row {
        display: flex;
        justify-content: space-between;
        gap: 10px;
        flex-wrap: wrap;
        background-color: white;
        padding: 15px;
        align-items: center;
        border-top: 1px solid #999999;
    }

        .messages-inbox-tab-box-main .message-row:nth-child(1) {
            border: unset;
        }

        .messages-inbox-tab-box-main .message-row:hover {
            background-color: #EBF5EB;
        }

.msges-box-two-insd-mn {
    display: flex;
    gap: 12px;
    width: 84%;
}

.messages-inbox-tab-box-main .msg-content-box {
    text-decoration: none;
    color: #000;
}

    .messages-inbox-tab-box-main .msg-content-box h4 {
        margin: 0;
        font-size: 16px;
        font-family: 'Inter 18pt medium';
        margin-bottom: 8px;
    }

    .messages-inbox-tab-box-main .msg-content-box p {
        color: black;
        font-size: 14px;
    }

.messages-inbox-tab-box-main .msg-date {
    text-align: right;
    font-size: 16px;
    color: black;
}

.messages-inbox-tab-box-main .delete-btn {
    background: #EB5757;
    width: 24px;
    height: 24px;
    border: none;
    padding: 0px;
    cursor: pointer;
    border-radius: 2px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.messages-inbox-tab-box-main .pagination-box {
    display: flex;
    justify-content: flex-end;
}

    .messages-inbox-tab-box-main .pagination-box button,
    .messages-inbox-tab-box-main .pagination-box span {
        padding: 6px 12px;
        border-radius: 12px;
        border: 1px solid #999999;
        cursor: pointer;
        background-color: transparent;
    }

    .messages-inbox-tab-box-main .pagination-box .prev {
        border-top-right-radius: 0px;
        border-bottom-right-radius: 0px;
        border-right: unset;
        color: #999999;
    }

    .messages-inbox-tab-box-main .pagination-box .next {
        border-top-left-radius: 0px;
        border-bottom-left-radius: 0px;
        border-left: unset;
        color: #999999;
    }

    .messages-inbox-tab-box-main .pagination-box .page-number {
        border-radius: 0px;
    }

.messages-inbox-tab-box-main .page-number.active {
    background: #16A34A;
    color: white;
}

.msg-box-three-time-and-delete-main {
    width: fit-content;
    display: flex;
    flex-direction: column;
    align-items: end;
    gap: 6px;
}

.messages-inbox-tab-box-main input.form-check-input {
    width: 24px;
    height: 24px;
    margin-top: 0px;
    border-radius: 3px;
    box-shadow: unset !important;
    border: 1px solid #00A650;
}

.messages-inbox-tab-box-main .form-check-input:checked {
    background-color: transparent;
    border-color: #00A650;
}

    .messages-inbox-tab-box-main .form-check-input:checked[type=checkbox] {
        background-image: url(../images/true-check-box.png);
        background-size: 11px 9px;
        background-position: center center;
    }

.msges-ftr-box-main {
    width: 100%;
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 14px;
    margin-top: 32px;
}

    .msges-ftr-box-main p {
        font-size: 16px;
        color: #999999;
        font-family: 'Inter 18pt medium';
    }

/* == inbox tab end == */

/* ==== messages page end ==== */

/* ==== messages view inbox page start ==== */

.message-view-inbox-box-one {
    width: 100%;
    padding: 15px;
    border-top: 1px solid #999999;
    border-bottom: 1px solid #999999;
    display: flex;
    justify-content: space-between;
    gap: 12px;
    flex-wrap: wrap;
}

.messages-view-inbox-box-one-from-and-to {
    width: fit-content;
    display: flex;
    flex-direction: column;
    gap: 8px;
}

    .messages-view-inbox-box-one-from-and-to p {
        color: black;
        font-size: 16px;
        font-family: 'Inter 18pt medium';
        line-height: normal;
    }

.messages-view-inbox-box-one-time-and-date p {
    color: black;
    font-size: 14px;
}

.messages-view-inbox-msg-text-main {
    padding: 15px;
    border-bottom: 1px solid #999999;
    margin-bottom: 20px;
}

    .messages-view-inbox-msg-text-main p {
        margin-bottom: 20px;
        color: black;
        font-size: 14px;
    }

        .messages-view-inbox-msg-text-main p:nth-last-child(1) {
            margin-bottom: 0px;
        }

.messages-reply-btn-box-one {
    width: fit-content;
    margin-left: auto;
    margin-bottom: 20px;
}

    .messages-reply-btn-box-one button {
        display: flex;
        align-items: center;
        justify-content: center;
        line-height: normal;
        gap: 8px;
        color: #00A650;
        font-size: 16px;
        font-family: 'Inter 18pt sm-bold';
        padding: 13px 39px;
        background-color: transparent;
        border: 1px solid #00A650;
        border-radius: 6px;
    }

        .messages-reply-btn-box-one button:hover {
            color: white;
            background-color: #00A650;
        }

            .messages-reply-btn-box-one button:hover img {
                filter: brightness(0) saturate(100%) invert(100%) sepia(100%) saturate(0%) hue-rotate(47deg) brightness(102%) contrast(102%);
            }

/* == HTML Editor start == */

.messages-view-inbox-send-msg-box {
    padding: 16px;
    border-radius: 12px;
    background-color: #EBF5EB;
    margin-bottom: 20px;
}

    .messages-view-inbox-send-msg-box .toolbar {
        background: transparent;
        padding: 0;
        display: flex;
        flex-wrap: wrap;
        margin-bottom: 20px;
    }

        .messages-view-inbox-send-msg-box .toolbar select {
            border: 1px solid #16A34A;
            background: white;
            padding: 4px 10px;
            border: 1px solid #999999;
            cursor: pointer;
            font-size: 15px;
        }

        .messages-view-inbox-send-msg-box .toolbar button {
            width: 32px;
            min-width: 32px;
            height: 32px;
            background-color: white;
            border: 1px solid #999999;
        }

            .messages-view-inbox-send-msg-box .toolbar button:nth-child(1) {
                border-right: unset;
            }

            .messages-view-inbox-send-msg-box .toolbar button:nth-child(3) {
                border-left: unset;
                border-right: unset;
            }

            .messages-view-inbox-send-msg-box .toolbar button:nth-child(4) {
                border-right: unset;
            }

            .messages-view-inbox-send-msg-box .toolbar button:hover,
            .messages-view-inbox-send-msg-box .toolbar select:hover {
                background: #DDF3DE;
            }

    .messages-view-inbox-send-msg-box .editor {
        min-height: 85px;
        padding: 10px;
        font-size: 16px;
        background: white;
        outline: none;
        border-radius: 4px;
    }

/* == HTML Editor end == */

.messages-page-msg-send-and-cancle-button-main {
    width: fit-content;
    display: flex;
    gap: 10px;
}

    .messages-page-msg-send-and-cancle-button-main button {
        width: fit-content;
        font-size: 16px;
        display: flex;
        align-items: center;
        justify-content: center;
        font-family: 'Inter 18pt sm-bold';
        border-radius: 6px;
        padding: 13px 36px;
        background-color: transparent;
    }

        .messages-page-msg-send-and-cancle-button-main button.send {
            border: 1px solid #00A650;
            color: white;
            background-color: #00A650;
        }

        .messages-page-msg-send-and-cancle-button-main button.cancel {
            border: 1px solid #00A650;
            color: #00A650;
        }

.messages-compose-page-box-main .messages-view-inbox-send-msg-box {
    padding: 20px 16px;
}

    .messages-compose-page-box-main .messages-view-inbox-send-msg-box .editor {
        height: 400px;
    }

.messages-compose-page-box-main .profile-details-inside-main {
    width: 100%;
    margin-bottom: 16px;
}

.empty-trash-tab-main .delete-all-btn#deleteAllBtn {
    display: inline-block !important;
    padding: 0px;
}

/* ==== messages view inbox page end ==== */

/* ==== Profile Page start ==== */

.profile-page-profile-box-one {
    width: 100%;
    margin: auto;
    padding: 20px;
    border-radius: 12px;
    box-shadow: 0px 0px 12px rgb(0 0 0 / 18%);
    display: flex;
    justify-content: space-between;
    gap: 24px;
    flex-wrap: wrap;
    margin-bottom: 32px;
}

.profile-image-box-one {
    width: 120px;
    min-width: 120px;
    height: 120px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 500px;
    background-color: #EBF5EB;
}

.profile-image-and-contant-text-box-main {
    display: flex;
    gap: 24px;
    flex-wrap: wrap;
}

.profile-contant-text-box-one {
    width: fit-content;
}

    .profile-contant-text-box-one h4 {
        font-size: 24px;
        color: black;
        font-family: 'Inter 18pt sm-bold';
        margin-bottom: 16px;
    }

    .profile-contant-text-box-one p {
        color: #999999;
        font-size: 18px;
        margin-bottom: 16px;
        font-family: 'Inter 18pt medium';
    }

.profile-mail-and-contact-nmbr-box {
    width: fit-content;
    display: flex;
    align-items: center;
    gap: 24px;
    flex-wrap: wrap;
}

    .profile-mail-and-contact-nmbr-box p {
        color: #999999;
        font-size: 16px;
        display: flex;
        align-items: center;
        gap: 8px;
        font-family: 'Inter 18pt medium';
        line-height: normal;
        margin-bottom: 0px;
    }

.profile-verified-box .verified-btn {
    display: flex;
    gap: 6px;
    align-items: center;
    border-radius: 6px;
    background-color: #EBF5EB;
    color: #00A650;
    font-family: 'Inter 18pt sm-bold';
    padding: 13px 16px;
    line-height: normal;
    border: 1px solid #EBF5EB;
    font-size: 16px;
}

.profile-verified-box h5 {
    color: black;
    font-size: 18px;
    font-family: 'Inter 18pt sm-bold';
}

.profile-verified-box {
    display: flex;
    flex-direction: column;
    gap: 14px;
    justify-content: space-between;
}

.profile-page-company-details-and-other-info-box {
    width: 100%;
    margin: auto;
    padding: 20px;
    border-radius: 12px;
    box-shadow: 0px 0px 12px rgb(0 0 0 / 18%);
    margin-bottom: 32px;
}

.view-profile-page-section .profile-details-inside-main input {
    background-color: #EFEFEF;
    border-color: #EFEFEF;
}

.profile-page-trade-license-pdf-view-box {
    display: flex;
    align-items: center;
    gap: 10px;
}

    .profile-page-trade-license-pdf-view-box a {
        display: flex;
        align-items: center;
        justify-content: center;
        width: fit-content;
        height: fit-content;
        color: #007AFF;
        text-decoration: underline;
        font-size: 16px;
        font-family: 'Inter 18pt medium';
        line-height: normal;
    }

.delete-account-button-for-profile-page {
    width: fit-content;
    margin-left: auto;
}

    .delete-account-button-for-profile-page button {
        display: flex;
        align-items: center;
        justify-content: center;
        border-radius: 6px;
        background-color: #EB5757;
        color: white;
        font-family: 'Inter 18pt sm-bold';
        padding: 13px 16px;
        line-height: normal;
        border: 1px solid #EB5757;
        font-size: 16px;
    }

        .delete-account-button-for-profile-page button:hover {
            background-color: transparent;
            color: #EB5757;
        }

.wagzo-edit-profile-page-button-save-and-cancel-box {
    width: fit-content;
    display: flex;
    gap: 10px;
    flex-wrap: wrap;
}

    .wagzo-edit-profile-page-button-save-and-cancel-box button {
        width: fit-content;
        display: flex;
        align-items: center;
        justify-content: center;
        border-radius: 12px;
        font-size: 16px;
        font-family: 'Inter 18pt medium';
        line-height: normal;
        padding: 13px 24px;
    }

        .wagzo-edit-profile-page-button-save-and-cancel-box button.cancel-edit-profile {
            background-color: transparent;
            border: 1px solid #00A650;
            color: #00A650;
        }

            .wagzo-edit-profile-page-button-save-and-cancel-box button.cancel-edit-profile:hover {
                background-color: #00a6501f;
            }

        .wagzo-edit-profile-page-button-save-and-cancel-box button.save-changes-edit-profile {
            background-color: #00A650;
            border: 1px solid #00A650;
            color: white;
        }

            .wagzo-edit-profile-page-button-save-and-cancel-box button.save-changes-edit-profile:hover {
                background-color: #00a6501f;
                color: #00A650;
            }

.edit-profile-pdf-box-edit-main {
    width: fit-content;
    display: flex;
    align-items: center;
    gap: 10px
}

.edit-profile-main-box-pdf-dlt {
    width: 100%;
    display: flex;
    justify-content: space-between;
    gap: 10px;
    flex-wrap: wrap;
}

    .edit-profile-main-box-pdf-dlt button {
        background-color: transparent;
        padding: 0px;
        border: unset;
    }

/* ==== Profile Page end ==== */

/* ==== Web Portal Deshboard Page Start ==== */

.web-portal-dashboard .product-supplier-all-status-box-main-one {
    background-color: #EBF5EB;
}

    .web-portal-dashboard .product-supplier-all-status-box-main-one .product-supplier-all-status-icon {
        background-color: #00A650;
    }

/* ==== New Booking Request popup start ==== */

.new-booking-request-popup-main {
    width: 100%;
    height: 100%;
    position: fixed;
    background-color: #01010185;
    top: 0px;
    left: 0px;
    right: 0px;
    backdrop-filter: blur(2px);
    bottom: 0px;
    margin: auto;
    z-index: 9;
    display: none;
}

.new-booking-request-pageinside-main {
    position: absolute;
    top: 0px;
    left: 0px;
    right: 0px;
    bottom: 0px;
    margin: auto;
    width: 90%;
    max-width: 640px;
    padding: 24px;
    height: fit-content;
    background-color: white;
    border-radius: 12px;
    animation: zoomIn 0.3s ease forwards;
}

.new-booking-request-popup-main .new-reqest-order-popup-head .new-reqst-order-id-nmbr-popup {
    width: fit-content;
    margin-bottom: 0px;
}

.new-booking-request-popup-main .new-reqst-order-id-nmbr-popup {
    width: 100%;
    gap: 14px;
    justify-content: space-between;
    margin-bottom: 24px;
}

.new-booking-popup-request-owner-and-animal-contact {
    width: 100%;
    display: flex;
    justify-content: space-between;
    gap: 14px;
    flex-wrap: wrap;
    padding-bottom: 10px;
    margin-bottom: 16px;
    border-bottom: 1px solid #999999;
}

.new-booking-req-animal-and-owner-box-one {
    width: 48%;
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 12px;
    flex-wrap: wrap;
}

.new-booking-over-owner-and-animal-box-two-animal {
    width: fit-content;
    display: flex;
    align-items: center;
    gap: 10px;
}

.new-booking-req-sender-profile-image {
    width: 56px;
    min-width: 56px;
    height: 56px;
}

    .new-booking-req-sender-profile-image img {
        width: 100%;
        height: 100%;
        border-radius: 100px;
    }

.new-booking-user-name-popup {
    width: fit-content;
}

    .new-booking-user-name-popup h5 {
        font-size: 18px;
        color: black;
        font-family: 'Inter 18pt sm-bold';
        margin-bottom: 6px;
    }

    .new-booking-user-name-popup p {
        font-family: 'Inter 18pt medium';
        font-size: 16px;
        color: #999999;
    }

.new-booking-user-message-box-three {
    width: fit-content;
}

    .new-booking-user-message-box-three button {
        width: 40px;
        min-width: 40px;
        height: 40px;
        background-color: #00A650;
        border-radius: 6px;
        border: 1px solid #00A650;
        display: flex;
        align-items: center;
        justify-content: center;
        padding: 0px;
    }

        .new-booking-user-message-box-three button:hover {
            background-color: #999999;
            border-color: #999999;
        }

.new-booking-time-and-duration-popup-box-one {
    width: 100%;
    display: flex;
    justify-content: space-between;
    gap: 14px;
    flex-wrap: wrap;
    padding: 10px;
    border-radius: 6px;
    background-color: #EBF5EB;
    margin-bottom: 16px;
}

.new-booking-time-and-duration-box-inside-one {
    width: 48%;
    display: flex;
    align-items: center;
    gap: 12px;
}

.new-booking-date-and-time-and-duration-show {
    width: fit-content;
}

    .new-booking-date-and-time-and-duration-show p {
        margin-bottom: 6px;
        font-family: 'Inter 18pt medium';
        font-size: 16px;
        color: #999999;
        line-height: normal;
    }

    .new-booking-date-and-time-and-duration-show h6 {
        font-family: 'Inter 18pt medium';
        font-size: 14px;
        color: black;
    }

.new-booking-user-location-details-popup-box {
    width: fit-content;
    display: flex;
    align-items: center;
    gap: 12px;
    margin-bottom: 16px;
}

    .new-booking-user-location-details-popup-box p {
        font-family: 'Inter 18pt medium';
        font-size: 16px;
        color: black;
    }

.new-user-booking-earning-box-main {
    width: 330px;
    padding: 10px;
    background-color: #00A650;
    border: 1px solid #00A650;
    display: flex;
    flex-direction: column;
    gap: 10px;
    align-items: center;
    justify-content: center;
    border-radius: 6px;
    margin: auto;
}

    .new-user-booking-earning-box-main p {
        color: white;
        font-size: 16px;
        font-family: 'Inter 18pt medium';
    }

    .new-user-booking-earning-box-main h5 {
        font-size: 24px;
        color: white;
        font-family: 'Inter 18pt bold';
    }

.new-booking-req-repso-box {
    width: 100%;
}

/* ==== New Booking Request popup end ==== */

/* ==== Web Portal Deshboard Page end ==== */


/* ==== web portal dashboard view page start ====  */

.wagzo-web-portal-dashboard-view-page-box-one {
    width: 100%;
    margin: auto;
    height: fit-content;
    border-radius: 12px;
    padding: 20px;
    box-shadow: 0px 0px 18px #00000018;
    margin-bottom: 32px;
    display: flex;
    justify-content: space-between;
    gap: 14px;
    flex-wrap: wrap;
}

.wagzo-web-portal-dashboard-view-page-box-two {
    width: 46%;
    display: flex;
    flex-direction: column;
    gap: 16px;
}

.wagzo-web-portal-dashboard-view-page-box-three {
    display: flex;
    gap: 12px;
    align-items: center;
    justify-content: space-between;
    width: 100%;
}

    .wagzo-web-portal-dashboard-view-page-box-three h4 {
        font-size: 24px;
        color: black;
        font-family: 'Inter 18pt sm-bold';
    }

.wagzo-web-portal-dashboard-view-page-box-two p {
    font-size: 18px;
    color: #999999;
    font-family: 'Inter 18pt sm-bold';
}

.wagzo-web-portal-dashboard-view-page-box-four {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    flex-wrap: wrap;
}

    .wagzo-web-portal-dashboard-view-page-box-four button {
        color: white;
        line-height: normal;
        font-family: 'Inter 18pt medium';
        font-size: 16px;
        background-color: #00A650;
        border-radius: 6px;
        border: 1px solid #00A650;
        padding: 10px 24px;
    }

        .wagzo-web-portal-dashboard-view-page-box-four button:hover {
            background-color: transparent;
            color: #00A650;
        }

.wagzo-web-prtl-db-view-page-user-and-anml-dtls-box-one-main {
    width: 100%;
    margin: auto;
    height: fit-content;
    border-radius: 12px;
    padding: 20px;
    box-shadow: 0px 0px 18px #00000018;
    margin-bottom: 32px;
    display: flex;
    justify-content: space-between;
    gap: 14px;
    flex-wrap: wrap;
}

.wagzo-web-prtl-db-view-page-user-and-anml-dtls-box-two {
    width: 56%;
}

    .wagzo-web-prtl-db-view-page-user-and-anml-dtls-box-two .profile-image-and-contant-text-box-main .profile-image-box-one,
    .wagzo-web-prtl-db-view-page-user-and-anml-dtls-box-three .profile-image-and-contant-text-box-main .profile-image-box-one {
        width: 100px;
        min-width: 100px;
        height: 100px;
    }

        .wagzo-web-prtl-db-view-page-user-and-anml-dtls-box-two .profile-image-and-contant-text-box-main .profile-image-box-one img,
        .wagzo-web-prtl-db-view-page-user-and-anml-dtls-box-three .profile-image-and-contant-text-box-main .profile-image-box-one img {
            width: 100%;
            height: 100%;
            border-radius: 100%;
        }

    .wagzo-web-prtl-db-view-page-user-and-anml-dtls-box-two .profile-image-and-contant-text-box-main .profile-contant-text-box-one,
    .wagzo-web-prtl-db-view-page-user-and-anml-dtls-box-three .profile-image-and-contant-text-box-main .profile-contant-text-box-one {
        display: flex;
        flex-direction: column;
        gap: 16px;
    }

        .wagzo-web-prtl-db-view-page-user-and-anml-dtls-box-two .profile-image-and-contant-text-box-main .profile-contant-text-box-one h4,
        .wagzo-web-prtl-db-view-page-user-and-anml-dtls-box-three .profile-image-and-contant-text-box-main .profile-contant-text-box-one h4 {
            margin-bottom: 0px;
        }

.wagzo-web-prtl-db-view-page-user-and-anml-dtls-box-three {
    width: 40%;
    height: fit-content;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    flex-wrap: wrap;
}

.wagzo-web-prtl-view-db-srvces-and-all-dtls-box-one {
    width: 100%;
    display: flex;
    justify-content: space-between;
    gap: 32px;
    flex-wrap: wrap;
    margin-bottom: 32px;
}

.wagzo-web-prtl-view-db-srvces-and-all-dtls-box-two {
    width: calc(50% - 16px);
    display: flex;
    flex-direction: column;
    gap: 32px;
}

.wagzo-pt-detls-box-three {
    width: 100%;
    padding: 20px;
    border-radius: 12px;
    box-shadow: 0px 0px 18px #00000018;
}

.wagzo-pt-dtls-tital-main {
    width: 100%;
}

    .wagzo-pt-dtls-tital-main h6 {
        color: black;
        font-size: 20px;
        line-height: 36px;
        font-family: 'Inter 18pt sm-bold';
        margin-bottom: 24px;
    }

.web-prtl-pt-dtls-inside-box-four {
    width: 100%;
    border: 1px solid #999999;
    padding: 20px;
    border-radius: 12px;
    display: flex;
    flex-direction: column;
    gap: 24px;
}

.web-prtl-pt-dtls-inside-box-five {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    flex-wrap: wrap;
}

    .web-prtl-pt-dtls-inside-box-five p {
        font-size: 18px;
        color: black;
        font-family: 'Inter 18pt medium';
        line-height: normal;
    }

        .web-prtl-pt-dtls-inside-box-five p span {
            color: #00A650;
        }

            .web-prtl-pt-dtls-inside-box-five p span.gray-text {
                font-size: 16px;
                color: #999999;
            }

.wagzo-portal-addition-info-box-one {
    width: 100%;
}

.wagzo-portal-addition-info-box-two {
    width: 100%;
    display: flex;
    align-items: center;
    gap: 16px;
    padding: 20px;
    border: 1px solid #007AFF;
    background-color: #E7F3FF;
    border-radius: 12px;
}

    .wagzo-portal-addition-info-box-two p {
        color: #007AFF;
        font-size: 16px;
        font-family: 'Inter 18pt medium';
        line-height: normal;
    }

/* ==== web portal dashboard view page end ====  */

/* ==== web portal dashboard request view page start ====  */

.db-req-view-page-accept-and-reject-button-box-main {
    width: fit-content;
    display: flex;
    gap: 16px;
}

.wagzo-web-portal-dashboard-view-page-box-four .db-req-view-page-accept-and-reject-button-box-main button {
    display: flex;
    gap: 5px;
    align-items: center;
    justify-content: center;
    padding: 10px 24px;
    font-size: 16px;
    font-family: 'Inter 18pt medium';
    line-height: normal;
    border-radius: 6px;
    background-color: transparent;
}

    .wagzo-web-portal-dashboard-view-page-box-four .db-req-view-page-accept-and-reject-button-box-main button.accept {
        border: 1px solid #00A650;
        color: #00A650;
    }

        .wagzo-web-portal-dashboard-view-page-box-four .db-req-view-page-accept-and-reject-button-box-main button.accept:hover {
            background-color: #00a65021;
        }

    .wagzo-web-portal-dashboard-view-page-box-four .db-req-view-page-accept-and-reject-button-box-main button.decline {
        border: 1px solid #EB5757;
        color: #EB5757;
    }

        .wagzo-web-portal-dashboard-view-page-box-four .db-req-view-page-accept-and-reject-button-box-main button.decline:hover {
            background-color: #eb575721;
        }

.db-approved-btn-box button.accept {
    background-color: #00A650;
    color: white !important;
}

    .db-approved-btn-box button.accept:hover {
        color: #00A650 !important;
    }

.reject-web-prtl-rejection-reason-box-mn {
    width: 100%;
}

    .reject-web-prtl-rejection-reason-box-mn .wagzo-pt-dtls-tital-main h6 {
        line-height: normal;
        margin-bottom: 16px;
    }

    .reject-web-prtl-rejection-reason-box-mn .wagzo-portal-addition-info-box-two {
        border-color: #EB5757;
        background-color: #ffe0e0;
    }

        .reject-web-prtl-rejection-reason-box-mn .wagzo-portal-addition-info-box-two p {
            color: #EB5757;
        }

/* ==== web portal dashboard request view page end ====  */

/* ==== web portal dashboard services page start ====  */

.web-portal-db-services-box-one {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    flex-wrap: wrap;
    margin-bottom: 30px;
}

.web-portal-db-services-box-two {
    width: fit-content;
    display: flex;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
}

.web-portal-db-services-box-three {
    width: 48px;
    min-width: 48px;
    height: 48px;
    border-radius: 50px;
    border: 1px solid #00A650;
    background-color: #EBF5EB;
    display: flex;
    align-items: center;
    justify-content: center;
}

.web-portal-db-services-box-two h5 {
    list-style: 24px;
    color: black;
    font-size: 18px;
    font-family: 'Inter 18pt sm-bold';
}

.web-portal-db-services-box-four {
    border: 1px solid #00A650;
    border-radius: 6px;
    background-color: #EBF5EB;
    padding: 4px 9px;
}

    .web-portal-db-services-box-four p {
        color: #00A650;
        font-size: 14px;
        font-family: 'Inter 18pt medium';
        line-height: 16px;
    }

    .web-portal-db-services-box-four.under-review {
        border-color: #FDCF13;
        background-color: #fffbe8;
    }

        .web-portal-db-services-box-four.under-review p {
            color: #FDCF13;
        }

    .web-portal-db-services-box-four.draft {
        background-color: #EEEEEE;
        border-color: #999999;
    }

.service-is-draft {
    border-color: #999999;
}

.service-is-under-review {
    color: #FDCF13;
}

.web-portal-db-services-box-four.draft p {
    color: #999999;
}

.under-review-edit-disabled .pdct-ctlg-edit-card-btn a {
    background-color: #EEEEEE;
    border-color: #EEEEEE;
    color: #999999;
    pointer-events: none;
}

    .under-review-edit-disabled .pdct-ctlg-edit-card-btn a img {
        filter: brightness(0) saturate(100%) invert(61%) sepia(0%) saturate(0%) hue-rotate(340deg) brightness(100%) contrast(94%);
    }

.wagzo-portal-dashboard-add-new-services-box-one {
    width: 100%;
}

    .wagzo-portal-dashboard-add-new-services-box-one .wagzo-profile-stepu-pgres-main {
        width: 100%;
        padding: 0px;
        max-width: 100%;
    }

    .wagzo-portal-dashboard-add-new-services-box-one .step-one-box-one-main .select-user-page-inside-main .select-user-type-select-box-one-main {
        width: 32.86%;
    }

    .wagzo-portal-dashboard-add-new-services-box-one .select-user-type-select-box-one-main .web-portal-db-services-box-four {
        position: absolute;
        top: 16px;
        right: 16px;
    }

/* ==== web portal dashboard services page end ====  */

/* ==== web portal schedule page start ==== */

.web-portal-schedule-page-main {
    width: 100%;
    margin: auto;
}

.web-portal-schdule-manage-your-availability-tital {
    width: 100%;
    margin-bottom: 20px;
}

    .web-portal-schdule-manage-your-availability-tital h6 {
        color: black;
        font-size: 18px;
        line-height: normal;
        font-family: 'Inter 18pt medium';
    }

.web-portal-schedule-page-main .single-select-display {
    padding: 14px 10px 14px 36px;
}

    .web-portal-schedule-page-main .single-select-display::before {
        position: absolute;
        content: "";
        background-image: url(../images/new-req-timer-popup-icon.png);
        background-repeat: no-repeat;
        background-size: 18px 18px;
        width: 18px;
        height: 18px;
        left: 10px;
    }

/* == time picker start == */

.web-portal-schedule-page-main .time-picker {
    position: relative;
    width: 100%;
    cursor: pointer;
}

.web-portal-schedule-page-main .time-picker-dropdown {
    position: absolute;
    top: 50px;
    left: 0;
    width: 100%;
    background: #ffffff;
    border: 1px solid #999999;
    border-radius: 6px;
    padding: 12px;
    z-index: 9999;
}

.web-portal-schedule-page-main .picker-box {
    display: flex;
    justify-content: space-between;
}

.web-portal-schedule-page-main .picker-column {
    width: 33%;
    max-height: 140px;
    overflow-y: auto;
    text-align: center;
    font-size: 16px;
    border-right: 1px solid #eee;
    scrollbar-width: thin;
    scrollbar-color: #00A650 white;
}

    .web-portal-schedule-page-main .picker-column div {
        padding: 8px 0;
        border-radius: 6px;
        cursor: pointer;
    }

        .web-portal-schedule-page-main .picker-column div:hover,
        .web-portal-schedule-page-main .picker-column div.active {
            background: #00A650;
            color: #fff;
        }

.web-portal-schedule-page-main .apply-time {
    width: 100%;
    margin-top: 12px;
    padding: 10px;
    border: none;
    background: #00A650;
    color: #fff;
    border-radius: 6px;
    cursor: pointer;
}

/* == time picker end == */

/* == date picker start == */

.wb-db-schdual-date-slct-box-main .datepicker {
    width: 324px;
    background: #fff;
    border-radius: 8px;
    padding: 15px;
    box-shadow: 0px 2px 14px #00000024;
}

.wb-db-schdual-date-slct-box-main .datepicker-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.wb-db-schdual-date-slct-box-main .month-select,
.wb-db-schdual-date-slct-box-main .year-select {
    border: none;
    font-size: 14px;
    font-family: 'Inter 18pt sm-bold';
    background: transparent;
    outline: none;
    font-weight: 600;
}

.wb-db-schdual-date-slct-box-main .nav-btns {
    display: flex;
    gap: 10px;
}

    .wb-db-schdual-date-slct-box-main .nav-btns span {
        cursor: pointer;
        font-size: 16px;
        padding: 3px;
        color: #A5A5A5;
    }

.wb-db-schdual-date-slct-box-main .day-names,
.wb-db-schdual-date-slct-box-main .days {
    display: flex;
    text-align: center;
    margin-top: 12px;
    flex-wrap: wrap;
    justify-content: space-between;
}

    .wb-db-schdual-date-slct-box-main .day-names div {
        font-weight: 600;
        font-size: 14px;
        opacity: 0.6;
    }

    .wb-db-schdual-date-slct-box-main .days div {
        padding: 0px 0px;
        font-size: 12px;
        cursor: pointer;
        border-radius: 50%;
        width: 34px;
        min-width: 34px;
        height: 34px;
        display: flex;
        align-items: center;
        justify-content: center;
        font-family: 'Inter 18pt medium';
    }

        .wb-db-schdual-date-slct-box-main .days div:hover {
            background-color: #00a65033;
        }

        /* Today */
        .wb-db-schdual-date-slct-box-main .days div.today {
            background: #E2E2E2;
            font-weight: 600;
        }

        /* ★ Unavailable Date Style */
        .wb-db-schdual-date-slct-box-main .days div.unavailable {
            background: #f8dbdb;
            color: #d40000;
        }

        /* Selected date */
        .wb-db-schdual-date-slct-box-main .days div.selected {
            background: #00A650 !important;
            color: #fff;
        }

/* Legend */
.wb-db-schdual-date-slct-box-main .legend {
    margin-top: 15px;
    display: flex;
    justify-content: space-around;
    font-size: 12px;
    font-family: 'Inter 18pt medium';
    align-items: center;
}

    .wb-db-schdual-date-slct-box-main .legend span {
        display: flex;
        align-items: center;
        gap: 6px;
    }

.wb-db-schdual-date-slct-box-main .today-box,
.wb-db-schdual-date-slct-box-main .unavailable-box {
    width: 16px;
    height: 16px;
    border-radius: 4px;
}

.wb-db-schdual-date-slct-box-main .today-box {
    background: #E2E2E2;
}

.wb-db-schdual-date-slct-box-main .unavailable-box {
    background: #f8dbdb;
}

/* == date picker end == */

.wb-prtl-schdule-note-box-main {
    width: 100%;
    display: flex;
    align-items: center;
    gap: 5px;
    padding: 10px;
    background-color: #E7F3FF;
    border: 1px solid #007AFF;
    border-radius: 6px;
}

    .wb-prtl-schdule-note-box-main p {
        color: black;
        font-size: 14px;
        line-height: normal;
        font-family: 'Inter 18pt regular';
    }

/* ==== web portal schedule page end ==== */

/* ==== reviews page start ==== */

.web-portal-review-page-box-main {
    width: 100%;
    margin: auto;
}

.web-portal-review-box-main-one {
    width: 100%;
    margin: auto;
    display: flex;
    flex-direction: column;
    gap: 16px;
}

.web-portal-review-box-inside-main {
    width: 100%;
    display: flex;
    gap: 12px;
    justify-content: space-between;
    flex-wrap: wrap;
    margin-bottom: 10px;
}

.web-portal-box-review-image-and-name-box {
    width: fit-content;
    display: flex;
    gap: 8px;
    align-items: center;
}

.web-portal-review-page-review-box-main {
    width: 100%;
    padding: 10px;
    border-radius: 6px;
    box-shadow: 0px 1px 10px #00000018;
}

.wb-db-prtl-review-img-box {
    width: 55px;
    min-width: 55px;
    height: 55px;
    border-radius: 100px;
}

    .wb-db-prtl-review-img-box img {
        width: 100%;
        height: 100%;
    }

.wb-prtl-review-text-and-star-box {
    width: fit-content;
}

    .wb-prtl-review-text-and-star-box h6 {
        color: black;
        font-size: 18px;
        font-family: 'Inter 18pt sm-bold';
        margin-bottom: 6px;
    }

.wb-prtl-star-review-box {
    width: fit-content;
    display: flex;
    align-items: center;
    gap: 2px;
}

    .wb-prtl-star-review-box i {
        color: #FFCB11;
        font-size: 18px;
    }

.review-wb-prtl-db-date {
    width: fit-content;
}

    .review-wb-prtl-db-date p {
        font-size: 16px;
        font-family: 'Inter 18pt medium';
        color: #282C31;
    }

.wb-prtl-review-pera-box-main {
    width: 100%;
}

    .wb-prtl-review-pera-box-main p {
        color: #999999;
        font-size: 16px;
        font-family: 'Inter 18pt medium';
        line-height: normal;
    }

/* ==== reviews page end ==== */

/* ==== web portal dashboard Profile page start ==== */

.web-portal-dashboard-profile-page-main-box {
    width: 100%;
}

    .web-portal-dashboard-profile-page-main-box .profile-image-box-one img {
        width: 100%;
        height: 100%;
        object-fit: cover;
    }

    .web-portal-dashboard-profile-page-main-box .profile-image-and-contant-text-box-main {
        align-items: center;
    }

    .web-portal-dashboard-profile-page-main-box .ordered-items-details-tital-box {
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 14px;
        flex-wrap: wrap;
    }

.my-profile-view-db-pg-box-one,
.my-profile-view-db-pg-box-two {
    width: 100%;
    display: none;
}

    .my-profile-view-db-pg-box-one.active,
    .my-profile-view-db-pg-box-two.active {
        width: 100%;
        display: block;
    }

.availability-updated-successfully-popup {
    width: 100%;
    height: 100%;
    position: fixed;
    background-color: #01010185;
    top: 0px;
    left: 0px;
    right: 0px;
    backdrop-filter: blur(2px);
    bottom: 0px;
    margin: auto;
    z-index: 9;
    display: none;
}

    .availability-updated-successfully-popup.active {
        display: block;
    }

.custom-booking-details-updated-successfully {
    width: 100%;
    height: 100%;
    position: fixed;
    background-color: #01010185;
    top: 0px;
    left: 0px;
    right: 0px;
    backdrop-filter: blur(2px);
    bottom: 0px;
    margin: auto;
    z-index: 9;
    display: none;
}

    .custom-booking-details-updated-successfully.active {
        display: block;
    }

.web-portal-dashboard-profile-page-main-box .step-one-box-one-main .select-user-page-inside-main {
    justify-content: start;
}

    .web-portal-dashboard-profile-page-main-box .step-one-box-one-main .select-user-page-inside-main .select-user-type-select-box-one-main {
        width: calc(10% - -12px);
        padding: 10px;
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
    }

        .web-portal-dashboard-profile-page-main-box .step-one-box-one-main .select-user-page-inside-main .select-user-type-select-box-one-main .checkbox-mark {
            top: 10px;
            right: 10px;
            width: 18px;
            height: 18px;
        }

            .web-portal-dashboard-profile-page-main-box .step-one-box-one-main .select-user-page-inside-main .select-user-type-select-box-one-main .checkbox-mark::before {
                content: "";
                background-image: url(../images/check-box-image-true.png);
                width: 100%;
                height: 100%;
                background-size: 18px 18px;
                background-repeat: no-repeat;
            }

.web-portal-dashboard-profile-page-main-box .select-user-type-select-box-inside-one {
    margin: unset;
    margin-bottom: 8px;
}

.web-portal-dashboard-profile-page-main-box .step-one-box-one-main .select-user-type-select-box-inside-two h6 {
    font-size: 14px;
    font-family: 'Inter 18pt medium';
}

.web-portal-dashboard-profile-page-main-box .all-page-commun-tab-header {
    width: fit-content;
}

.pet-boarding-profile-tab-cstm-bkng-and-pkgs-box {
    width: 100%;
    margin: auto;
    padding: 20px;
    border-radius: 12px;
    box-shadow: 0px 0px 12px rgb(0 0 0 / 18%);
    margin-bottom: 32px;
}

    .pet-boarding-profile-tab-cstm-bkng-and-pkgs-box .ordered-items-details-tital-box h4 a {
        color: #00A650;
        display: flex;
        align-items: center;
        gap: 10px;
    }

.web-portal-dashboard-profile-page-main-box .step-three-box-one-main .custom-banking-and-packages-tab-pnl-main-button button:nth-child(1) {
    border-top-left-radius: 6px;
    border-bottom-left-radius: 6px;
}

.web-portal-dashboard-profile-page-main-box .step-three-box-one-main .custom-banking-and-packages-tab-pnl-main-button button:nth-child(2) {
    border-top-right-radius: 6px;
    border-bottom-right-radius: 6px;
}

.pet-booking-packages-tab-one-box-profile-page {
    width: 100%;
    margin: auto;
}

    .pet-booking-packages-tab-one-box-profile-page .wagzo-product-catelog-page-add-new-product-btn-box {
        margin-left: auto;
        margin-bottom: 32px;
    }

.pet-boarding-review-edit-delete-box-main {
    width: 100%;
    display: flex;
    gap: 24px;
}

.pet-boarding-review-edit-box-inside-main {
    width: 32%;
    box-shadow: 0px 0px 4px #00000021;
    padding: 16px;
    border-radius: 6px;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}

.pbrebim-box-one {
    width: 100%;
    display: flex;
    justify-content: space-between;
    gap: 10px;
    margin-bottom: 20px;
}

.pbrebim-box-two {
    width: fit-content;
    display: flex;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
}

.pbrebim-box-img-three {
    width: 40px;
    min-width: 40px;
    height: 40px;
    border: 1px solid #00A650;
    border-radius: 6px;
    background-color: #00a65016;
    display: flex;
    align-items: center;
    justify-content: center;
}

.pbrebim-box-text-four {
    width: fit-content;
}

    .pbrebim-box-text-four h6 {
        color: black;
        font-size: 16px;
        font-family: 'Inter 18pt sm-bold';
        margin-bottom: 5px;
        line-height: normal;
    }

    .pbrebim-box-text-four p {
        color: #999999;
        font-size: 12px;
        font-family: 'Inter 18pt medium';
        line-height: normal;
    }

.pbrebim-box-five {
    width: fit-content;
}

    .pbrebim-box-five p {
        font-size: 16px;
        font-family: 'Inter 18pt sm-bold';
        color: #00A650;
    }

.pbrebim-box-six {
    width: fit-content;
    display: flex;
    flex-direction: column;
    gap: 8px;
    margin-bottom: 20px;
}

    .pbrebim-box-six p {
        display: flex;
        align-items: center;
        gap: 6px;
        line-height: normal;
        font-size: 14px;
        color: black;
        font-family: 'Inter 18pt medium';
    }

.pbrebim-box-seven {
    width: 100%;
    padding-top: 10px;
    border-top: 1px solid #999999;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
    flex-wrap: wrap;
}

.packages-show-fs-box-one,
.packages-show-fs-box-two {
    display: none;
    width: 100%;
}

    .packages-show-fs-box-one.active,
    .packages-show-fs-box-two.active {
        display: block;
    }

.profile-page-pricing-for-package-booking-details-box-out-side-one {
    width: 100%;
    margin: auto;
}

    .profile-page-pricing-for-package-booking-details-box-out-side-one .add-new-packahe-details-section-with-add-button-main-add-button {
        padding: 12px 12px;
        border-radius: 8px;
        border: none;
        font-size: 16px;
        cursor: pointer;
        width: 80px;
        min-width: 80px;
    }

    .profile-page-pricing-for-package-booking-details-box-out-side-one .add-new-packahe-details-section-with-add-button-main-remove-button {
        width: 40px !important;
        min-width: 40px !important;
        height: 40px;
        border-radius: 8px;
    }

    .profile-page-pricing-for-package-booking-details-box-out-side-one .add-new-packahe-details-section-with-add-button-main-package-item {
        margin-bottom: 8px;
        margin-top: 0px;
    }

    .profile-page-pricing-for-package-booking-details-box-out-side-one .profile-details-inside-main textarea {
        width: 100%;
        border: 1px solid #999999;
        border-radius: 6px;
        font-size: 14px;
        font-family: 'Inter 18pt medium';
        padding: 14px 10px;
        line-height: normal;
        height: 75px;
        resize: none;
    }

        .profile-page-pricing-for-package-booking-details-box-out-side-one .profile-details-inside-main textarea::placeholder {
            color: #999999;
        }

.package-setting-box-toggle-one {
    width: 100%;
    padding: 16px;
    border-radius: 6px;
    border: 1px solid #999999;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
    flex-wrap: wrap;
}

.pkgs-stng-tgl-bx-mn {
    width: fit-content;
}

    .pkgs-stng-tgl-bx-mn h6 {
        list-style: 22px;
        color: black;
        font-size: 16px;
        font-family: 'Inter 18pt medium';
        margin-bottom: 10px;
    }

    .pkgs-stng-tgl-bx-mn p {
        color: #999999;
        font-size: 14px;
        font-family: 'Inter 18pt medium';
        line-height: normal;
    }

.profile-page-pricing-for-package-booking-details-box-out-side-one .profile-details-inside-main label.delivery-option-toggle-slider {
    margin-bottom: 0px;
}

.tab-two-main-step-three-box-two .packages-description-and-package-price-list .profile-details-inside-main {
    margin-bottom: 0px;
}

.view-onlycstm-bkng.active {
    display: none;
}

.packages-details-updated-successfully-popup {
    width: 100%;
    height: 100%;
    position: fixed;
    background-color: #01010185;
    top: 0px;
    left: 0px;
    right: 0px;
    backdrop-filter: blur(2px);
    bottom: 0px;
    margin: auto;
    z-index: 9;
    display: none;
}

    .packages-details-updated-successfully-popup.active {
        display: block;
    }

.web-portal-dbrd-create-packages-box-main {
    width: 100%;
}

    .web-portal-dbrd-create-packages-box-main .profile-page-pricing-for-package-booking-details-box-out-side-one {
        display: block;
    }

/* ==== web portal dashboard Profile page end ==== */

/* ==== web portal settting terms and conditions page start ==== */

.web-portal-settting-terms-and-conditions-page-box {
    width: 100%;
    margin: auto;
}

    .web-portal-settting-terms-and-conditions-page-box .all-page-commun-tab-header {
        width: fit-content;
    }

.tearms-and-condition-page-box-main-one {
    width: 100%;
    padding: 20px;
    border-radius: 12px;
    box-shadow: 0px 0px 12px rgb(0 0 0 / 18%);
}

.terms-and-conditions-page-heading-box {
    width: fit-content;
    margin-bottom: 10px;
}

    .terms-and-conditions-page-heading-box h3 {
        font-size: 20px;
        color: black;
        font-family: 'Inter 18pt sm-bold';
    }

.tearms-and-cndtion-box-inside-pera-and-tital-main {
    width: 100%;
}

    .tearms-and-cndtion-box-inside-pera-and-tital-main h5 {
        font-size: 14px;
        font-family: 'Inter 18pt sm-bold';
        color: black;
        line-height: normal;
        margin-bottom: 10px;
    }

    .tearms-and-cndtion-box-inside-pera-and-tital-main p {
        font-size: 12px;
        color: #999999;
        font-family: 'Inter 18pt medium';
    }

.stng-pg-tears-and-condi-page-main-box {
    width: 100%;
    display: flex;
    flex-direction: column;
    gap: 10px;
}

/* ==== web portal settting terms and conditions page end ==== */

/* ==== ADMIN PORTAL DASHBOARD Page start ==== */

.admin-portal-dashboard-box-main {
    width: 100%;
    display: flex;
    gap: 20px;
    flex-wrap: wrap;
}

    .admin-portal-dashboard-box-main .top-product-this-week-box-main {
        width: calc(50% - 10px);
        padding: 20px;
    }

.admin-portal-db-top-prfoming-srvice-box {
    width: fit-content;
    display: flex;
    align-items: center;
    gap: 16px;
    flex-wrap: wrap;
}

.admn-prtl-db-tp-prfmng-srvs-box-two {
    width: 50px;
    min-width: 50px;
    height: 50px;
    border-radius: 100px;
    background-color: #EBF5EB;
    display: flex;
    align-items: center;
    justify-content: center;
}

    .admn-prtl-db-tp-prfmng-srvs-box-two h4 {
        line-height: 24px;
        color: black;
        font-size: 24px;
        font-family: 'Inter 18pt sm-bold';
    }

/* ==== ADMIN PORTAL DASHBOARD Page end ==== */

/* ==== user management Page start ==== */

.admin-prtl-usr-mngmnt {
    width: 100%;
    justify-content: flex-start;
}

    .admin-prtl-usr-mngmnt .product-supplier-all-status-box-main-one {
        width: calc(33% - 3px);
    }

.admin-portal-db-usr-mngmnt-pt-ownr-dpdn-main {
    width: 146px;
    margin-left: auto;
    margin-bottom: 32px;
}

    .admin-portal-db-usr-mngmnt-pt-ownr-dpdn-main .profile-details-inside-main {
        width: 100%;
    }

.all-pet-owner-usr-mngmnt-pg-tital {
    width: fit-content;
    margin-bottom: 10px;
}

    .all-pet-owner-usr-mngmnt-pg-tital h4 {
        line-height: 36px;
        font-size: 20px;
        color: black;
        font-family: 'Inter 18pt sm-bold';
    }

.tbl-img-box {
    width: 30px;
    min-width: 30px;
    height: 30px;
}

    .tbl-img-box img {
        width: 100%;
        height: 100%;
        border-radius: 100px;
    }

.admin-portal-profile-active-view-box-one .wagzo-web-prtl-db-view-page-user-and-anml-dtls-box-two {
    width: 100%;
}

.admin-portal-profile-active-view-box-one {
    position: relative;
}

    .admin-portal-profile-active-view-box-one .profile-contant-text-box-one h4 {
        display: flex;
        align-items: center;
        gap: 12px;
    }

.usr-mngmnt-active-view-page-button-box-one {
    width: fit-content;
    display: flex;
    gap: 16px;
    position: absolute;
    top: 20px;
    right: 20px;
}

    .usr-mngmnt-active-view-page-button-box-one button {
        display: flex;
        gap: 5px;
        align-items: center;
        border-radius: 6px;
        border: 1px solid #EB5757;
        color: #EB5757;
        padding: 10px 24px;
        font-size: 16px;
        font-family: 'Inter 18pt medium';
        background-color: transparent;
        line-height: normal;
    }

        .usr-mngmnt-active-view-page-button-box-one button.active-btn {
            color: #00A650;
            border-color: #00A650;
        }

            .usr-mngmnt-active-view-page-button-box-one button.active-btn:hover {
                background-color: #00A650;
            }

        .usr-mngmnt-active-view-page-button-box-one button:hover {
            color: white;
            background-color: #EB5757;
        }

            .usr-mngmnt-active-view-page-button-box-one button:hover img {
                filter: brightness(0) saturate(100%) invert(100%) sepia(84%) saturate(7%) hue-rotate(201deg) brightness(102%) contrast(99%);
            }

.admin-prtl-db-prfl-dtls-pg-active-main {
    width: 100%;
    margin: auto;
    height: fit-content;
    border-radius: 12px;
    padding: 20px;
    box-shadow: 0px 0px 18px #00000018;
}

.admin-portal-porsonal-info-box-main {
    width: 100%;
}

.admin-portal-porsonal-info-box-two-main {
    display: flex;
    gap: 24px;
    flex-wrap: wrap;
}

    .admin-portal-porsonal-info-box-two-main .order-details-name-and-contact-details-box-first {
        width: calc(50% - 12px);
    }

.admin-prtl-db-prfl-dtls-pg-active-main .all-page-cmn-data-tbl-mn .dataTables_wrapper {
    overflow: auto;
}

.pdf-tbl-url-mn a {
    display: flex;
    align-items: center;
    justify-content: center;
    width: fit-content;
    height: fit-content;
    color: #007AFF;
    font-size: 14px;
}

.services-profile-usr-mngmnt-review-and-indi-box-main {
    width: fit-content;
    display: flex;
    align-items: center;
    gap: 16px;
}

    .services-profile-usr-mngmnt-review-and-indi-box-main p {
        font-size: 16px;
        font-family: 'Inter 18pt medium';
        color: black;
        display: flex;
        align-items: center;
        gap: 4px;
        margin-bottom: 0px;
    }

        .services-profile-usr-mngmnt-review-and-indi-box-main p i {
            color: #FFCB11;
        }

        .services-profile-usr-mngmnt-review-and-indi-box-main p span {
            color: #999999;
        }

.user-mngmnt-user-review-sec-box-main {
    width: 100%;
    padding: 20px;
    border: 1px solid #999999;
    border-radius: 12px;
    display: flex;
    gap: 14px;
    flex-wrap: wrap;
    justify-content: space-between;
}

.user-mng-mnt-review-name-star-and-pera-box-one {
    display: flex;
    flex-direction: column;
    gap: 10px;
}

    .user-mng-mnt-review-name-star-and-pera-box-one h5 {
        font-size: 18px;
        color: black;
        line-height: normal;
        font-family: 'Inter 18pt medium';
    }

    .user-mng-mnt-review-name-star-and-pera-box-one p i {
        color: #FFCB11;
        font-size: 18px;
    }

    .user-mng-mnt-review-name-star-and-pera-box-one p {
        font-family: 'Inter 18pt medium';
        font-size: 16px;
        color: #999999;
        display: flex;
        align-items: center;
        gap: 4px;
    }

.user-mng-mnt-review-name-star-and-pera-box-two {
    width: fit-content;
}

    .user-mng-mnt-review-name-star-and-pera-box-two p {
        font-size: 16px;
        color: #999999;
    }

.usr-mngmnt-review-approved-page-box-main {
    width: 100%;
    display: flex;
    flex-direction: column;
    gap: 16px;
}

.user-mng-mnt-review-name-star-and-pera-box-two button {
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: transparent;
    color: #00A650;
    border: 1px solid #00A650;
    border-radius: 12px;
    font-size: 16px;
    font-family: 'Inter 18pt sm-bold';
    padding: 13px 24px;
    line-height: normal;
}

    .user-mng-mnt-review-name-star-and-pera-box-two button:hover {
        background-color: #00A650;
        color: white;
    }

.admin-prtl-db-prfl-dtls-pg-active-main .profile-details-inside-main {
    width: 100%;
}

.admin-prtl-db-prfl-dtls-pg-active-main .wagzo-edit-profile-page-button-save-and-cancel-box {
    margin-left: auto;
    margin-top: 20px;
}

.tb-btn-bottom-side {
    width: fit-content;
    margin: auto;
    margin-top: 20px;
}

    .tb-btn-bottom-side button {
        width: fit-content;
        display: flex;
        align-items: center;
        justify-content: center;
        border-radius: 12px;
        font-size: 16px;
        font-family: 'Inter 18pt medium';
        line-height: normal;
        padding: 13px 24px;
    }

        .tb-btn-bottom-side button.prev-btn {
            background-color: transparent;
            border: 1px solid #00A650;
            color: #00A650;
        }

            .tb-btn-bottom-side button.prev-btn:hover {
                background-color: #00a65021;
            }

        .tb-btn-bottom-side button.next-btn,
        .tb-btn-bottom-side button.approve-btn {
            background-color: #00A650;
            border: 1px solid #00A650;
            color: white;
        }

            .tb-btn-bottom-side button.next-btn:hover,
            .tb-btn-bottom-side button.approve-btn:hover {
                background-color: transparent;
                color: #00A650;
            }

        .tb-btn-bottom-side button.reject-btn {
            background-color: transparent;
            border: 1px solid #EB5757;
            color: #EB5757;
        }

            .tb-btn-bottom-side button.reject-btn:hover {
                background-color: #EB5757;
                color: white;
            }

.admn-pfl-tb-usr-mngmnt-view-main {
    width: 100%;
}

    .admn-pfl-tb-usr-mngmnt-view-main .profile-details-inside-main input {
        background-color: #EEEEEE;
        border-color: #EEEEEE;
    }

    .admn-pfl-tb-usr-mngmnt-view-main .upload-emirates-id-main .upload-icon {
        width: 50px;
        height: 48px;
    }

    .admn-pfl-tb-usr-mngmnt-view-main .upload-emirates-id-main {
        padding: 20px !important;
    }

.upload-emirates-id-image-data-view {
    display: flex;
    gap: 10px;
    flex-wrap: wrap;
}

    .upload-emirates-id-image-data-view img {
        width: 80px;
        height: 80px;
        object-fit: cover;
    }

.all-page-commun-tab-content .insidetb-pnl-mn {
    display: none;
}

    .all-page-commun-tab-content .insidetb-pnl-mn.active {
        display: block;
    }

.all-page-commun-tab-header .insidetb-btn-mn.active {
    background: #1959d1;
    color: #fff;
}

.all-page-commun-tab-header .insidetb-btn-mn {
    padding: 8px 16px;
    background: transparent;
    border: none;
    border-radius: 12px;
    cursor: pointer;
    color: #888;
    white-space: nowrap;
    font-size: 16px;
    font-family: 'Inter 18pt medium';
    transition: 0.3s;
    line-height: normal;
}

    .all-page-commun-tab-header .insidetb-btn-mn.active {
        background: #19a463;
        color: #fff;
    }

.admin-profile-view-page-tb-hdr .all-page-commun-tab-header {
    width: fit-content;
}

.admin-profile-view-page-tb-hdr .insd-tb-pnl-sec {
    width: fit-content;
    margin: auto;
}

.full-width-for-pkng-price {
    width: 100% !important;
}

.profile-details-inside-main.full-width-for-pkng-price .packages-details-box-view-show-only {
    width: 100%;
    background-color: #EEEEEE;
    border-color: #EEEEEE;
    border-radius: 6px;
    font-size: 14px;
    font-family: 'Inter 18pt medium';
    padding: 14px 10px;
    line-height: normal;
    display: flex;
    flex-direction: column;
    gap: 8px;
}

    .profile-details-inside-main.full-width-for-pkng-price .packages-details-box-view-show-only p {
        color: black;
        font-size: 14px;
        font-family: 'Inter 18pt medium';
        line-height: normal;
    }

.admin-portal-usr-mmngmnt-pfl-dtls-rjct-rsn-box-main {
    width: 100%;
    margin-bottom: 32px;
}

    .admin-portal-usr-mmngmnt-pfl-dtls-rjct-rsn-box-main label {
        width: 100%;
        font-size: 16px;
        color: black;
        font-family: 'Inter 18pt medium';
        margin-bottom: 12px;
        line-height: 24px;
    }

.admin-portal-usr-mmngmnt-pfl-dtls-rjct-rsn-box-two {
    width: 100%;
    border-radius: 12px;
    background-color: #ffcccc;
    padding: 12px 24px;
}

    .admin-portal-usr-mmngmnt-pfl-dtls-rjct-rsn-box-two p {
        color: #ed7070;
        font-size: 14px;
        font-family: 'Inter 18pt medium';
    }

.no-data-found-text-box h2 {
    font-size: 24px;
    color: black;
    font-family: 'Inter 18pt sm-bold';
}

.admin-portal-order-and-booking-status-and-export-btn-box {
    width: fit-content;
    margin-left: auto;
    margin-bottom: 32px;
    display: flex;
    gap: 24px;
}

    .admin-portal-order-and-booking-status-and-export-btn-box .admin-portal-db-usr-mngmnt-pt-ownr-dpdn-main {
        margin-bottom: 0px;
    }

.admn-prtl-ordr-and-bkng-tb-pnl {
    width: fit-content;
}

/* ==== user management Page end ==== */

/* ==== view service popup start ====  */

.view-service-active-popup,
.view-service-requested-popup,
.view-service-approved-popup,
.view-service-delivered-popup,
.view-service-cancelled-popup,
.view-service-rejected-popup,
.view-product-requested-popup,
.view-product-processing-popup,
.view-product-ready-to-pick-popup,
.view-product-in-transit-popup,
.view-product-delivered-popup,
.view-product-rejected-popup,
.view-product-cancelled-popup,
.view-product-approved-popup {
    width: 100%;
    height: 100%;
    position: fixed;
    background-color: #01010185;
    top: 0px;
    left: 0px;
    right: 0px;
    backdrop-filter: blur(2px);
    bottom: 0px;
    margin: auto;
    z-index: 9;
    display: none;
}

    .view-service-active-popup.active,
    .view-service-requested-popup.active,
    .view-service-approved-popup.active,
    .view-service-delivered-popup.active,
    .view-service-cancelled-popup.active,
    .view-service-rejected-popup.active,
    .view-product-requested-popup.active,
    .view-product-processing-popup.active,
    .view-product-ready-to-pick-popup.active,
    .view-product-in-transit-popup.active,
    .view-product-delivered-popup.active,
    .view-product-rejected-popup.active,
    .view-product-cancelled-popup.active,
    .view-product-approved-popup.active {
        display: block;
    }

    .view-service-active-popup .reject-order-popup-button-cancel-and-reject-order,
    .view-service-requested-popup .reject-order-popup-button-cancel-and-reject-order,
    .view-service-approved-popup .reject-order-popup-button-cancel-and-reject-order,
    .view-service-delivered-popup .reject-order-popup-button-cancel-and-reject-order,
    .view-service-cancelled-popup .reject-order-popup-button-cancel-and-reject-order,
    .view-service-rejected-popup .reject-order-popup-button-cancel-and-reject-order,
    .view-product-req-popup .reject-order-popup-button-cancel-and-reject-order {
        justify-content: center;
    }

        .view-service-active-popup .reject-order-popup-button-cancel-and-reject-order a,
        .view-service-requested-popup .reject-order-popup-button-cancel-and-reject-order a,
        .view-service-approved-popup .reject-order-popup-button-cancel-and-reject-order a,
        .view-service-delivered-popup .reject-order-popup-button-cancel-and-reject-order a,
        .view-service-cancelled-popup .reject-order-popup-button-cancel-and-reject-order a,
        .view-service-rejected-popup .reject-order-popup-button-cancel-and-reject-order a,
        .view-product-req-popup .reject-order-popup-button-cancel-and-reject-order a {
            line-height: normal;
            padding: 13px 24px;
            width: 160px;
        }

            .view-service-active-popup .reject-order-popup-button-cancel-and-reject-order a.save,
            .view-service-requested-popup .reject-order-popup-button-cancel-and-reject-order a.save,
            .view-service-approved-popup .reject-order-popup-button-cancel-and-reject-order a.save,
            .view-service-delivered-popup .reject-order-popup-button-cancel-and-reject-order a.save,
            .view-service-cancelled-popup .reject-order-popup-button-cancel-and-reject-order a.save,
            .view-service-rejected-popup .reject-order-popup-button-cancel-and-reject-order a.save,
            .view-product-req-popup .reject-order-popup-button-cancel-and-reject-order a.save {
                border: 1px solid #00A650;
                background-color: #00A650;
                color: white;
            }

                .view-service-active-popup .reject-order-popup-button-cancel-and-reject-order a.save:hover,
                .view-service-requested-popup .reject-order-popup-button-cancel-and-reject-order a.save:hover,
                .view-service-approved-popup .reject-order-popup-button-cancel-and-reject-order a.save:hover,
                .view-service-delivered-popup .reject-order-popup-button-cancel-and-reject-order a.save:hover,
                .view-service-cancelled-popup .reject-order-popup-button-cancel-and-reject-order a.save:hover,
                .view-service-rejected-popup .reject-order-popup-button-cancel-and-reject-order a.save:hover,
                .view-product-req-popup .reject-order-popup-button-cancel-and-reject-order a.save:hover {
                    background-color: #00a6502b;
                    color: #00A650;
                }

    .view-service-active-popup .admin-portal-porsonal-info-box-two-main,
    .view-service-requested-popup .admin-portal-porsonal-info-box-two-main,
    .view-service-approved-popup .admin-portal-porsonal-info-box-two-main,
    .view-service-delivered-popup .admin-portal-porsonal-info-box-two-main,
    .view-service-cancelled-popup .admin-portal-porsonal-info-box-two-main,
    .view-service-rejected-popup .admin-portal-porsonal-info-box-two-main,
    .view-product-req-popup .admin-portal-porsonal-info-box-two-main {
        gap: 16px;
        margin-bottom: 20px;
    }

    .view-service-active-popup .profile-details-inside-main,
    .view-service-requested-popup .profile-details-inside-main,
    .view-service-approved-popup .profile-details-inside-main,
    .view-service-delivered-popup .profile-details-inside-main,
    .view-service-cancelled-popup .profile-details-inside-main,
    .view-service-rejected-popup .profile-details-inside-main,
    .view-product-req-popup .profile-details-inside-main {
        width: 100%;
        margin-bottom: 20px;
    }

    .view-service-active-popup .reject-order-popup-heading-and-pera h5,
    .view-service-requested-popup .reject-order-popup-heading-and-pera h5,
    .view-service-approved-popup .reject-order-popup-heading-and-pera h5,
    .view-service-delivered-popup .reject-order-popup-heading-and-pera h5,
    .view-service-cancelled-popup .reject-order-popup-heading-and-pera h5,
    .view-service-rejected-popup .reject-order-popup-heading-and-pera h5,
    .view-product-req-popup .reject-order-popup-heading-and-pera h5 {
        margin-bottom: 0px;
    }

    .view-service-active-popup .reject-order-popup-heading-and-pera,
    .view-service-requested-popup .reject-order-popup-heading-and-pera,
    .view-service-approved-popup .reject-order-popup-heading-and-pera,
    .view-service-delivered-popup .reject-order-popup-heading-and-pera,
    .view-service-cancelled-popup .reject-order-popup-heading-and-pera,
    .view-service-rejected-popup .reject-order-popup-heading-and-pera,
    .view-product-req-popup .reject-order-popup-heading-and-pera {
        margin-bottom: 20px;
    }

    .view-service-active-popup .reject-order-popup-heading-and-close-button-box-main,
    .view-service-requested-popup .reject-order-popup-heading-and-close-button-box-main,
    .view-service-approved-popup .reject-order-popup-heading-and-close-button-box-main,
    .view-service-delivered-popup .reject-order-popup-heading-and-close-button-box-main,
    .view-service-cancelled-popup .reject-order-popup-heading-and-close-button-box-main,
    .view-service-rejected-popup .reject-order-popup-heading-and-close-button-box-main,
    .view-product-req-popup .reject-order-popup-heading-and-close-button-box-main {
        margin-bottom: 0px;
    }

.view-product-req-popup .reject-order-popup-heading-and-pera {
    margin-bottom: 10px
}

.view-product-req-popup .admin-portal-porsonal-info-box-two-main {
    gap: 10px;
}

.all-page-cmn-data-tbl-mn .dataTables_wrapper {
    overflow: auto;
}

/* ==== view service popup end ====  */

/* ==== payment and payout page start ==== */

.payment-and-payout-date-select-ted-box-main {
    width: fit-content;
    display: flex;
    align-items: center;
    gap: 24px;
    flex-wrap: wrap;
}

.pymnt-payout-dt-slct-icn {
    width: fit-content;
    height: fit-content;
}

.payment-and-payout-date-select-ted-box-main .admin-portal-db-usr-mngmnt-pt-ownr-dpdn-main {
    display: flex;
    align-items: center;
    gap: 10px;
    width: fit-content;
    margin-bottom: 0px;
}

    .payment-and-payout-date-select-ted-box-main .admin-portal-db-usr-mngmnt-pt-ownr-dpdn-main .profile-details-inside-main {
        width: 245px;
    }

.payment-and-payout-page-chek-radio-show-btn {
    width: fit-content;
    margin-left: auto;
    margin-bottom: 32px;
    display: none;
}

    .payment-and-payout-page-chek-radio-show-btn button {
        font-size: 16px;
        font-family: 'Inter 18pt sm-bold';
        background-color: #00A650;
        border: 1px solid #00A650;
        border-radius: 6px;
        padding: 13px 24px;
        line-height: normal;
        color: white;
    }

        .payment-and-payout-page-chek-radio-show-btn button:hover {
            color: #00A650;
            background-color: transparent;
        }

.payment-and-payout-pg-check-box .form-check-input {
    width: 18px;
    height: 18px;
    border-radius: 0px;
    box-shadow: unset !important;
    border-color: #00A650;
}

    .payment-and-payout-pg-check-box.form-check-input:checked {
        background-color: transparent;
        border-color: #00A650;
    }

        .payment-and-payout-pg-check-box.form-check-input:checked[type=checkbox] {
            background-image: url(../images/true-check-box.png);
            background-size: 10px 7px;
            background-position: center center;
        }

.payment-and-payout-pg-check-box.form-check-input {
    width: 18px;
    height: 18px;
    border-radius: 0px;
    box-shadow: unset !important;
    border-color: #00A650;
}

.payment-and-payout-date-select-ted-box-main .admin-portal-db-usr-mngmnt-pt-ownr-dpdn-main {
    margin-left: unset;
}

.refnd-hstory-pg-box-one .product-supplier-all-status-box-main-one {
    width: calc(50% - 5px);
}

.admin-portal-promotions-tab-and-btn-row {
    width: 100%;
    display: flex;
    justify-content: space-between;
    gap: 14px;
    flex-wrap: wrap;
}

/* ==== payment and payout page end ==== */

.admin-prtl-promotions-banner-upload-box-main {
    width: 100%;
}

    .admin-prtl-promotions-banner-upload-box-main .banners-section {
        margin-bottom: 40px;
    }

    .admin-prtl-promotions-banner-upload-box-main .upload-section {
        margin-top: 30px;
    }

    .admin-prtl-promotions-banner-upload-box-main .section-heading {
        font-size: 20px;
        font-weight: 600;
        color: #1F2937;
        margin: 0 0 20px 0;
        padding: 0;
    }

    /* Empty State Styles */
    .admin-prtl-promotions-banner-upload-box-main .empty-state {
        text-align: center;
        padding: 60px 20px;
    }

    .admin-prtl-promotions-banner-upload-box-main .empty-state-title {
        font-size: 18px;
        font-family: 'Inter 18pt sm-bold';
        color: black;
        margin: 0 0 8px 0;
    }

    .admin-prtl-promotions-banner-upload-box-main .empty-state-text {
        font-size: 14px;
        color: #999999;
        font-family: 'Inter 18pt medium';
        margin: 0;
    }

    /* Uploaded Banners Container */
    .admin-prtl-promotions-banner-upload-box-main .uploaded-banners-container {
        display: flex;
        gap: 20px;
        flex-wrap: wrap;
    }

    .admin-prtl-promotions-banner-upload-box-main .banner-item {
        position: relative;
        width: calc(33% - 10px);
        height: 180px;
        border-radius: 12px;
        overflow: hidden;
        box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
        transition: opacity 0.3s ease, transform 0.3s ease;
    }

        .admin-prtl-promotions-banner-upload-box-main .banner-item img {
            width: 100%;
            height: 100%;
            object-fit: cover;
            display: block;
        }

    .admin-prtl-promotions-banner-upload-box-main .banner-delete-btn {
        position: absolute;
        top: 12px;
        right: 12px;
        width: 36px;
        height: 36px;
        padding: 9px 10px;
        background: rgba(255, 255, 255, 0.95);
        border: none;
        border-radius: 8px;
        cursor: pointer;
        display: flex;
        align-items: center;
        justify-content: center;
        transition: all 0.3s ease;
        box-shadow: 0 2px 6px rgba(0, 0, 0, 0.15);
    }

        .admin-prtl-promotions-banner-upload-box-main .banner-delete-btn:hover {
            background: #fee;
            transform: scale(1.05);
        }

        .admin-prtl-promotions-banner-upload-box-main .banner-delete-btn svg {
            width: 20px;
            height: 20px;
        }

    /* Upload Area Styles */
    .admin-prtl-promotions-banner-upload-box-main .banner-upload-area {
        width: 100%;
        min-height: 140px;
        border: 2px dashed #10B981;
        border-radius: 16px;
        display: flex;
        align-items: center;
        justify-content: center;
        cursor: pointer;
        transition: all 0.3s ease;
    }

        .admin-prtl-promotions-banner-upload-box-main .banner-upload-area:hover {
            background: #F3F4F6;
            border-color: #059669;
        }

        .admin-prtl-promotions-banner-upload-box-main .banner-upload-area.drag-over {
            background: #ECFDF5;
            border-color: #059669;
        }

    .admin-prtl-promotions-banner-upload-box-main .upload-content {
        text-align: center;
        padding: 20px;
    }

    .admin-prtl-promotions-banner-upload-box-main .upload-icon {
        margin: 0px auto 0px;
        width: 48px;
        height: 48px;
    }

    .admin-prtl-promotions-banner-upload-box-main .upload-text {
        font-size: 18px;
        font-family: 'Inter 18pt sm-bold';
        color: black;
        margin: 0 0 8px 0;
    }

    .admin-prtl-promotions-banner-upload-box-main .upload-support-text {
        font-size: 14px;
        color: #999999;
        font-family: 'Inter 18pt medium';
        margin: 0;
    }

    .admin-prtl-promotions-banner-upload-box-main .banner-delete-btn img {
        width: auto;
        height: auto;
    }

.admin-portal-promotions-tab-and-btn-row .wagzo-product-catelog-page-add-new-product-btn-box.active {
    display: none;
}

.admin-portal-msg-search-box-and-dropdown-main {
    width: 100%;
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 14px;
    flex-wrap: wrap;
    margin-bottom: 32px;
}

.msg-search-box-one {
    width: 420px;
    position: relative;
    height: fit-content;
}

    .msg-search-box-one input {
        width: 100%;
        padding: 15px 16px 15px 36px;
        font-size: 14px;
        color: black;
        border: 1px solid #999999;
        border-radius: 12px;
        line-height: normal;
    }

        .msg-search-box-one input::placeholder {
            color: #999999;
        }

    .msg-search-box-one i {
        position: absolute;
        top: 0px;
        left: 13px;
        bottom: 0px;
        margin: auto;
        color: #999999;
        height: fit-content;
    }

.admin-portal-msg-search-box-and-dropdown-main .dropdown-box {
    margin-left: unset;
    margin-bottom: 0px;
}

.admin-portal-privacy-and-tearms-editor {
    width: 100%;
    padding: 24px 16px;
    box-shadow: 0px 0px 18px #00000018;
    border-radius: 12px;
}

    .admin-portal-privacy-and-tearms-editor .wagzo-all-page-commun-heading-and-pera-main h3 {
        margin-bottom: 0px;
    }

.admin-portal-add-admin-page-box-one {
    width: 100%;
    margin: auto;
}

    .admin-portal-add-admin-page-box-one .step-two-box-one-input-and-select-main {
        justify-content: flex-start;
    }

        .admin-portal-add-admin-page-box-one .step-two-box-one-input-and-select-main .profile-details-inside-main {
            width: calc(33% - 8px);
        }

.profile-details-inside-main.password-box {
    position: relative;
}

.wagzo-login-itp-and-lbl-mn.password-box {
    position: relative;
}

    .wagzo-login-itp-and-lbl-mn.password-box .toggle-icon {
        position: absolute;
        right: 10px;
        bottom: 14px;
        width: 20px;
        height: 20px;
        cursor: pointer;
    }

.profile-details-inside-main.password-box .toggle-icon {
    position: absolute;
    right: 10px;
    bottom: 14px;
    width: 20px;
    height: 20px;
    cursor: pointer;
}

.admin-prtl-add-admin-menu-name-box-tbl table thead tr th:nth-child(1),
.admin-prtl-add-admin-menu-name-box-tbl table tbody tr td:nth-child(1) {
    border-right: 1px solid #F0F0F0;
}

.admin-prtl-add-admin-menu-name-box-tbl .menu-name-inside-admn {
    padding: 8px 10px 8px 40px;
}

/* .admin-prtl-add-admin-menu-name-box-tbl .table-bottom-main {
    display: none;
} */

.admin-portal-add-admin-save-and-next-btn-box {
    width: fit-content;
    display: flex;
    gap: 10px;
    margin-left: auto;
    margin-top: 20px;
}

    .admin-portal-add-admin-save-and-next-btn-box button {
        font-family: 'Inter 18pt sm-bold';
        font-size: 16px;
        padding: 13px 24px;
        border-radius: 12px;
        width: fit-content;
        display: flex;
        align-items: center;
        justify-content: center;
        background-color: transparent;
        line-height: normal;
    }

        .admin-portal-add-admin-save-and-next-btn-box button.save-next-btn {
            border: 1px solid #00A650;
            background-color: #00A650;
            color: white;
        }

        .admin-portal-add-admin-save-and-next-btn-box button.cancel-btn {
            border: 1px solid #00A650;
            color: #00A650;
        }

.upload-recent-work-upload-single-section-box {
    width: 100%;
}

    .upload-recent-work-upload-single-section-box .profile-details-inside-main {
        width: 100%;
    }

        .upload-recent-work-upload-single-section-box .profile-details-inside-main label {
            text-align: left;
        }

        .upload-recent-work-upload-single-section-box .profile-details-inside-main .upload-emirates-id-main {
            padding: 38px 18px;
        }

.add-new-packages-indivdal-box-main .tab-two-main-step-three-box-two .profile-setup-company-page-box-one .profile-details-inside-main {
    width: 100%;
}

.add-new-packages-indivdal-box-main .tab-two-main-step-three-box-two .profile-setup-company-page-box-one {
    margin-bottom: 0px;
    gap: 0px;
}

.no-package-found-page-box-one p {
    color: #999999;
    font-size: 20px;
    font-family: 'Inter 18pt sm-bold';
    text-align: center;
    line-height: 30px;
}

.added-packages-view-tbl-main-box {
    width: 100%;
    overflow-x: auto;
}

    .added-packages-view-tbl-main-box .table-responsive {
        width: 100%;
        overflow-x: auto;
        border: 1px solid black;
        border-bottom: unset;
    }

    .added-packages-view-tbl-main-box .packages-table {
        width: 100%;
        border-collapse: collapse;
        min-width: 600px;
    }

        .added-packages-view-tbl-main-box .packages-table thead th {
            text-align: left;
            font-weight: 600;
            padding: 12px 12px;
            border-bottom: 1px solid black;
            border-right: 1px solid black;
        }

        .added-packages-view-tbl-main-box .packages-table tbody td {
            padding: 9px 12px;
            border-bottom: 1px solid black;
            font-size: 15px;
            text-align: left;
            border-right: 1px solid black;
        }

            .added-packages-view-tbl-main-box .packages-table tbody td:nth-last-child(1),
            .added-packages-view-tbl-main-box .packages-table thead th:nth-last-child(1) {
                border-right: unset;
            }

        .added-packages-view-tbl-main-box .packages-table tbody tr:hover {
            background: #fafafa;
        }

    .added-packages-view-tbl-main-box .action-cell {
        width: 80px;
    }

.delete-packages-popup-box-main {
    width: 100%;
    height: 100%;
    position: fixed;
    background-color: #01010185;
    top: 0px;
    left: 0px;
    right: 0px;
    backdrop-filter: blur(2px);
    bottom: 0px;
    margin: auto;
    z-index: 9;
    display: none;
}

    .delete-packages-popup-box-main.active {
        display: block;
    }

.delete-packages-popup-box-insdie-main {
    position: absolute;
    top: 0px;
    left: 0px;
    right: 0px;
    bottom: 0px;
    margin: auto;
    width: 90%;
    max-width: 640px;
    padding: 24px;
    height: fit-content;
    background-color: white;
    border-radius: 12px;
    animation: zoomIn 0.3s ease forwards;
}

.dlt-pkgs-alrt-popup-icn {
    width: fit-content;
    height: fit-content;
    margin: auto;
    margin-bottom: 32px;
}

.dlt-ppup-text-box-one-main {
    margin-bottom: 32px;
}

    .dlt-ppup-text-box-one-main h3 {
        font-size: 24px;
        color: black;
        font-family: 'Inter 18pt sm-bold';
        text-align: center;
    }

.pet-texi-rgstatin {
    width: 100%;
    justify-content: space-between;
}

.profile-details-dlt-box {
    width: fit-content;
    height: fit-content;
    margin-bottom: 15px;
}

    .profile-details-dlt-box a {
        display: flex;
        align-items: center;
        justify-content: center;
        width: fit-content;
        height: fit-content;
    }

.pt-txi-rgstion-itp-and-dlt {
    align-items: end;
}

    .pt-txi-rgstion-itp-and-dlt .profile-details-inside-main {
        width: 47% !important;
        margin-bottom: 0px;
    }

.reschedule-request-popup-box {
    width: 100%;
    height: 100%;
    position: fixed;
    background-color: #01010185;
    top: 0px;
    left: 0px;
    right: 0px;
    backdrop-filter: blur(2px);
    bottom: 0px;
    margin: auto;
    z-index: 9;
    display: none;
}

    .reschedule-request-popup-box .new-booking-req-repso-box .new-reqst-order-id-nmbr-popup {
        width: 100%;
        justify-content: space-between;
        margin-bottom: 14px;
    }

    .reschedule-request-popup-box .new-req-timer-section-main h5 {
        color: black;
        font-size: 20px;
        font-family: 'Inter 18pt sm-bold';
        text-align: center;
    }

.admin-porta-dashboard-suppr-admin-password-securty-box-one {
    width: 100%;
}

    .admin-porta-dashboard-suppr-admin-password-securty-box-one .step-two-box-one-input-and-select-main {
        justify-content: flex-start;
    }

        .admin-porta-dashboard-suppr-admin-password-securty-box-one .step-two-box-one-input-and-select-main .profile-details-inside-main {
            width: calc(33% - 7px);
        }

    .admin-porta-dashboard-suppr-admin-password-securty-box-one .wagzo-product-catelog-page-add-new-product-btn-box {
        margin-left: auto;
        margin-top: 24px;
    }

.profile-edit-btn-pfl-edit-pg-btn.active {
    display: none;
}

.profile-edit-btn-pfl-edit-pg-btn {
    width: fit-content;
}

.web-portal-edit-profile-add-box-one {
    margin: unset;
}

.profile-btn-cancel-and-save-btn-main-box-one {
    width: fit-content;
    display: flex;
    gap: 10px;
}

    .profile-btn-cancel-and-save-btn-main-box-one a {
        width: fit-content;
        display: flex;
        align-items: center;
        justify-content: center;
        border-radius: 12px;
        font-size: 16px;
        font-family: 'Inter 18pt medium';
        line-height: normal;
        padding: 13px 24px;
    }

        .profile-btn-cancel-and-save-btn-main-box-one a.cancel {
            background-color: transparent;
            border: 1px solid #00A650;
            color: #00A650;
        }

            .profile-btn-cancel-and-save-btn-main-box-one a.cancel:hover {
                background-color: #00a65012;
                color: #00A650;
            }

        .profile-btn-cancel-and-save-btn-main-box-one a.save-changes {
            background-color: #00A650;
            border: 1px solid #00A650;
            color: white;
        }

            .profile-btn-cancel-and-save-btn-main-box-one a.save-changes:hover {
                background-color: transparent;
                color: #00A650;
            }

.all-pages-url-pg-box {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    flex-wrap: wrap;
    padding: 0px 20px;
}

.allpgcmn-mn .profile-details-inside-main .single-select-options label a {
    color: black;
}

.allpgcmn-mn .step-two-box-one-input-and-select-main {
    margin-bottom: 32px;
}

.heading-for-page-flow-demo {
    margin-bottom: 24px;
    padding-bottom: 18px;
    border-bottom: 1px solid #00A650;
}

    .heading-for-page-flow-demo h2 {
        color: #00A650;
        font-size: 28px;
        font-family: 'Inter 18pt medium';
        text-align: left;
        padding: 0px 20px;
    }

.demo-page-all-pages-main {
    border: 1px solid #00A650;
    padding: 18px 0px 0px 0px;
    border-radius: 20px;
}

.wagzo-otp-resend-and-timer-main.frgt-pswrd p a {
    color: #00A650;
    font-size: 16px;
    font-family: 'Inter 18pt medium';
    text-align: center;
    text-decoration: underline;
}

.wagzo-otp-resend-and-timer-main.frgt-pswrd {
    margin-top: 18px;
    margin-bottom: 0px;
}

/* ==== loader start ==== */

.loader-wrap {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 16px;
    position: fixed;
    background: #ffffffab;
    width: 100%;
    height: 100%;
    z-index: 99999;
    top: 0;
    left: 0;
}

    .loader-wrap .circle {
        width: 160px;
        height: 160px;
        border-radius: 50%;
        display: grid;
        place-items: center;
        position: relative;
        overflow: hidden;
    }

.circle img {
    width: 86%;
    height: 86%;
    object-fit: cover;
    border-radius: 50%;
    animation: spin 2s linear infinite;
    filter: brightness(0) saturate(100%) invert(37%) sepia(84%) saturate(2008%) hue-rotate(128deg) brightness(94%) contrast(102%);
}

@keyframes spin {
    0% {
        transform: rotate(0deg);
    }

    100% {
        transform: rotate(360deg);
    }
}

/* .loader-wrap .circle video {
    width: 103%;
    height: 100%;
} */

/* ==== loader end ==== */

/* ==== logout popup start ==== */

.logout-popup-box-main {
    width: 100%;
    height: 100%;
    position: fixed;
    background-color: #01010185;
    top: 0px;
    left: 0px;
    right: 0px;
    backdrop-filter: blur(2px);
    bottom: 0px;
    margin: auto;
    z-index: 9;
    display: none;
}

    .logout-popup-box-main.active {
        display: block;
    }

.logout-popup-inside-box-one-main {
    position: absolute;
    top: 0px;
    left: 0px;
    right: 0px;
    bottom: 0px;
    margin: auto;
    width: 90%;
    max-width: 440px;
    padding: 24px;
    height: fit-content;
    background-color: white;
    border-radius: 12px;
    animation: zoomIn 0.3s ease forwards;
}

.logout-popup-inside-contant-main p {
    font-size: 16px;
    color: #999999;
    font-family: 'Inter 18pt medium';
    line-height: 24px;
    text-align: center;
}

.logout-popup-inside-contant-main {
    text-align: center;
}

    .logout-popup-inside-contant-main img {
        margin: auto;
        margin-bottom: 20px;
    }

.logout-popup-inside-box-one-main .delet-catalog-popup-button-main-box {
    justify-content: center;
    margin-top: 20px;
}

    .logout-popup-inside-box-one-main .delet-catalog-popup-button-main-box a {
        width: 116px;
    }

/* ==== logout popup end ==== */

.d-none {
    display: none;
}

.d-flex {
    display: flex;
}

/* ==== Table pagination start ==== */

.dataTables_wrapper .dataTables_paginate {
    margin-top: 20px !important;
}

.dataTables_wrapper .dataTables_info {
    margin-top: 20px !important;
}

/* ==== Table pagination end ==== */

/* ==== Delete upload popup start ==== */

.delete-upload-popup-main {
    width: 100%;
    height: 100%;
    position: fixed;
    background-color: #01010185;
    top: 0px;
    left: 0px;
    right: 0px;
    backdrop-filter: blur(2px);
    bottom: 0px;
    margin: auto;
    z-index: 9;
    display: none;
}

    .delete-upload-popup-main.active {
        display: block;
    }

.delete-upload-popup-inside-main {
    position: absolute;
    top: 0px;
    left: 0px;
    right: 0px;
    bottom: 0px;
    margin: auto;
    width: 90%;
    max-width: 640px;
    padding: 24px;
    height: fit-content;
    background-color: white;
    border-radius: 12px;
    animation: zoomIn 0.3s ease forwards;
}

.delet-upload-popup-button-main-box {
    width: 100%;
    display: flex;
    justify-content: end;
    gap: 10px;
}

    .delet-upload-popup-button-main-box a {
        display: flex;
        align-items: center;
        justify-content: center;
        font-size: 16px;
        font-family: 'Inter 18pt sm-bold';
        border-radius: 12px;
        padding: 13px 24px;
        line-height: normal;
    }

        .delet-upload-popup-button-main-box a.cancel {
            border: 1px solid #999999;
            color: #999999;
        }

            .delet-upload-popup-button-main-box a.cancel:hover {
                background-color: #999999;
                color: white;
            }

        .delet-upload-popup-button-main-box a.delete {
            background-color: #EB5757;
            border: 1px solid #EB5757;
            color: white;
        }

            .delet-upload-popup-button-main-box a.delete:hover {
                color: #EB5757;
                background-color: transparent;
            }

/* ==== Delete upload popup end ==== */

.wagzo-sidemenu-dropdown-main .wagzo-sidebar-dropdown-menu-list-main.open, .wagzo-sidemenu-dropdown-main .wagzo-sidebar-dropdown-menu-list-main.open-floating {
    display: block;
}
.wb-db-schdual-date-slct-box-main .day-names,
.wb-db-schdual-date-slct-box-main .days {
    display: flex;
    text-align: center;
    margin-top: 12px;
    flex-wrap: wrap;
    justify-content: unset;
    gap: 9px;
}

    .wb-db-schdual-date-slct-box-main .day-names div {
        font-weight: 600;
        font-size: 14px;
        opacity: 0.6;
        width: 34px;
    }