/********Basket Page Form Design start**** to be used on multiple pages***********/
/*****Validations start********/
.input-wrapper .validation {
    position: absolute;
    right: 1px;
    height: 42px;
    width: 25px;
    color: white;
    font-size: 20px;
    display: flex;
    bottom: 0px;
    border-top-right-radius: var(--small-border-radius);
    border-bottom-right-radius: var(--small-border-radius);
    justify-content: center;
    align-items: center;
    overflow: hidden;
}

.input-wrapper.active .validation {
    display: flex;
}

.validation.success {
    display: flex;
    background: var(--green-color);
}

.validation.error {
    background: maroon;
    display: flex;
}

.basket-main-body .form-group .input-wrapper.error input,
.basket-main-body .form-group .input-wrapper.error select {
    border-color: var(--validation-error-color);
}

    .basket-main-body .form-group .input-wrapper.error input:focus,
    .basket-main-body .form-group .input-wrapper.error select:focus {
        border-color: var(--validation-error-color);
        border-width: 3px;
    }

.basket-main-body .form-group .input-wrapper.success input,
.basket-main-body .form-group .input-wrapper.success select {
    border-color: var(--validation-success-color);
}

    .basket-main-body .form-group .input-wrapper.success input:focus,
    .basket-main-body .form-group .input-wrapper.success select:focus {
        border-color: var(--validation-success-color);
        border-width: 3px;
    }

.basket-main-body .form-group.boxed .clear-input {
    right: 25px;
}
/*****Validations End********/
.basket-main-body .form-group {
    width: 70%;
}

    .basket-main-body .form-group .input-wrapper {
    }

        .basket-main-body .form-group .input-wrapper input, .basket-main-body .form-group .input-wrapper select {
            font-size: 13px;
            border: 1px solid #d1d1d1;
            border-radius: var(--small-border-radius);
        }

            .basket-main-body .form-group .input-wrapper input:focus, .basket-main-body .form-group .input-wrapper select:focus {
                border-color: var(--primary-color);
            }

        .basket-main-body .form-group .input-wrapper textarea:focus {
            border: 1px solid var(--primary-color);
        }

.basket-main-body .basket-required {
    color: red !important;
}

.basket-main-body .prod-side-nav .sidebar-title {
    padding: 15px;
}

.basket-main-body .form-group .input-wrapper label {
    font-size: 14px;
    font-weight: 600;
}

    .basket-main-body .form-group .input-wrapper label span {
        color: red;
        font-weight: 600;
        margin-left: 5px;
    }

.basket-main-body .form-group p {
    margin-bottom: 0px;
    margin-top: 10px;
}

.basket-main-body .form-group .input-wrapper .form-check {
    margin-top: 5px;
}

.basket-main-body .card-form-box .form-group {
    width: 100%;
}

/********Basket Page Form Design End***************/