//==================  Custom utilities ==================

// fonts.

$font-sizes: 10, 12, 14, 16, 18, 20, 24, 56;

@each $font-size in $font-sizes {
    .f-#{$font-size} {
        font-size: #{$font-size}px !important;
    }
}

// font weight.

$font-weights: 300, 400, 500, 600, 700, 800, 900;

@each $font-weight in $font-weights {
    .fw-#{$font-weight} {
        font-weight: #{$font-weight} !important;
    }
}

// colors.

.color-danger {
    color: #ff4e4e !important;
}
.bg-brown-light {
    background-color: #f5f5f5 !important;
}

.color-success {
    color: #089752 !important;
}

.color-warning {
    color: #ef932a !important;
}

.color-info {
    color: #1a60ec !important;
}

.color-primary {
    color: $color-primary !important;
}

.color-secondary {
    color: $color-secondary !important;
}

.color-dark {
    color: #04041c !important;
}

.color-gray-300 {
    color: #b1b1b1 !important;
}

.color-gray-400 {
    color: #6a6a6a !important;
}

.color-white {
    color: #fff !important;
}

.color-light-blue {
    color: #9095cc !important;
}

.color-dark-light {
    color: #15152e !important;
}

.color-dark-blue {
    color: #0e0d4c !important;
}

.color-light-white {
    color: #f5f5fb !important;
}

// margin & padding.

.mb-11 {
    margin-bottom: 11px !important;
}

.mb-5px {
    margin-bottom: 5px !important;
}

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

.pb-10 {
    padding-bottom: 10px !important;
}

.pb-16 {
    padding-bottom: 16px !important;
}

.pb-24 {
    padding-bottom: 24px !important;
}

.mb-6 {
    margin-bottom: 6px !important;
}

.pb-28 {
    padding-bottom: 28px !important;
}

.pb-30 {
    padding-bottom: 30px !important;
}

.pb-50 {
    padding-bottom: 50px !important;
}

.pb-56 {
    padding-bottom: 56px !important;
}
.mt-70 {
    margin-top: 70px !important;
}

.mr-1 {
    margin-right: 1px !important;
}

.mb-4 {
    margin-bottom: 4px !important;
}

.mt-20 {
    margin-top: 20px !important;
}

.mr-8 {
    margin-right: 8px !important;
}

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

.mb-9 {
    margin-bottom: 9px !important;
}

.ml-10 {
    margin-left: 10px !important;
}

.mr-10 {
    margin-right: 10px !important;
}

.pt-10 {
    padding-top: 10px !important;
}

.mt-11 {
    margin-top: 11px !important;
}

.mr-11 {
    margin-right: 11px !important;
}

.mr-12 {
    margin-right: 12px !important;
}

.mx-12 {
    margin: 0 12px !important;
}

.mr-13 {
    margin-right: 13px !important;
}

.mr-14 {
    margin-right: 14px !important;
}

.mb-14 {
    margin-bottom: 14px !important;
}

.mt-14 {
    margin-top: 14px !important;
}

.mt-16 {
    margin-top: 16px !important;
}

.mt-18 {
    margin-top: 18px !important;
}

.p-15 {
    padding: 15px !important;
}

.mt-15 {
    margin-top: 15px !important;
}

.pt-16 {
    padding-top: 16px !important;
}

.pt-18 {
    padding-top: 18px !important;
}

.pt-19 {
    padding-top: 19px !important;
}

.pt-20 {
    padding-top: 20px !important;
}
.ml-23 {
    margin-left: 23px !important;
}

.pb-30 {
    padding-bottom: 30px !important;
}

.mt-30 {
    margin-top: 30px !important;
}
.mt-60 {
    margin-top: 60px !important;
}

.mr-40 {
    margin-right: 40px !important;
}

.pt-50 {
    padding-top: 50px !important;
}

.mt-50 {
    margin-top: 50px !important;
}

.pt-60 {
    padding-top: 60px !important;
}

.p-70 {
    padding: 70px !important;
}

.pl-74 {
    padding-left: 74px !important;
}

.pt-80 {
    padding-top: 80px !important;
}

.pt-100 {
    padding-top: 100px !important;
}

.mt-80 {
    margin-top: 80px !important;
}

.pt-140 {
    padding-top: 140px !important;
}

.mr-16 {
    margin-right: 16px !important;
}

.mb-16 {
    margin-bottom: 16px !important;
}

.mt-18 {
    margin-top: 18px !important;
}

.mb-18 {
    margin-bottom: 18px !important;
}

.mr-19 {
    margin-right: 19px !important;
}

.mb-20 {
    margin-bottom: 20px !important;
}

.mb-22 {
    margin-bottom: 22px !important;
}

.ml-20 {
    margin-left: 20px !important;
}

.mr-20 {
    margin-right: 20px !important;
}

.mt-20 {
    margin-top: 20px !important;
}

.p-20 {
    padding: 20px !important;
}

.mt-24 {
    margin-top: 24px !important;
}

.mt-240 {
    margin-top: 240px !important;
}
.mb-24 {
    margin-bottom: 23px !important;
}

.p-24 {
    padding: 24px !important;
}
.mr-24 {
    margin-right: 24px !important;
}
.ml-24 {
    margin-left: 24px !important;
}
*[dir="rtl"] .ml-24 {
    margin-right: 24px !important;
}
.mr-28 {
    margin-right: 28px !important;
}

.ml-28 {
    margin-left: 28px !important;
}

.mt-28 {
    margin-top: 28px !important;
}

.mb-30 {
    margin-bottom: 30px !important;
}

.mb-70 {
    margin-bottom: 70px !important;
}
.mr-30 {
    margin-right: 30px !important;
}

.ml-30 {
    margin-left: 30px !important;
}

.mt-32 {
    margin-top: 32px !important;
}

.ptlr-38 {
    padding: 38px 38px 0 !important;
}

.mt-30 {
    margin-top: 30px !important;
}

.mt-32 {
    margin-top: 32px !important;
}

.mr-34 {
    margin-right: 34px !important;
}

.mt-35 {
    margin-top: 35px !important;
}

.mt-37 {
    margin-top: 37px !important;
}

.mb-42 {
    margin-bottom: 42px !important;
}

.mb-60 {
    margin-bottom: 60px !important;
}

.ml-47 {
    margin-left: 47px !important;
}

.mb-47 {
    margin-bottom: 47px !important;
}

.pt-250 {
    padding-top: 250px !important;
}

.pt-200 {
    padding-top: 200px !important;
}

.ml-55 {
    margin-left: 55px !important;
}
.p-30-50 {
    padding: 30px 50px !important;
}

.mr-101 {
    margin-right: 101px !important;
}

.ml-120 {
    margin-left: 120px !important;
}
.mr-80 {
    margin-right: 80px !important;
}

*[dir="rtl"] {
    .mr-1 {
        margin-right: 0 !important;
        margin-left: 1px;
    }

    .ms-4 {
        margin-left: 0 !important;
        margin-right: 1.5rem !important;
    }
    .mr-8 {
        margin-right: 0 !important;
        margin-left: 8px;
    }

    .mr-10 {
        margin-right: 0 !important;
        margin-left: 10px;
    }

    .ml-20 {
        margin-left: 0 !important;
        margin-right: 20px;
    }

    .mr-11 {
        margin-right: 0 !important;
        margin-left: 11px;
    }

    .mr-12 {
        margin-right: 0 !important;
        margin-left: 12px;
    }

    .mr-13 {
        margin-right: 0 !important;
        margin-left: 13px;
    }

    .pr-16 {
        padding-right: 16px !important;
        padding-left: 0px !important;
    }

    .mr-16 {
        margin-right: 0 !important;
        margin-left: 16px;
    }

    .mr-19 {
        margin-right: 0 !important;
        margin-left: 19px;
    }

    .mr-20 {
        margin-right: 0 !important;
        margin-left: 20px;
    }

    .ml-23 {
        margin-left: 0 !important;
        margin-right: 23px;
    }
    .mr-24 {
        margin-right: 0 !important;
        margin-left: 24px;
    }

    .mr-28 {
        margin-right: 0 !important;
        margin-left: 28px;
    }

    .mr-30 {
        margin-right: 0 !important;
        margin-left: 30px;
    }
    .ml-30 {
        margin-left: 0px;
        margin-right: 30px !important;
    }

    .mr-34 {
        margin-right: 0 !important;
        margin-left: 34px;
    }

    .mr-40 {
        margin-right: 0 !important;
        margin-left: 40px;
    }

    .ml-55 {
        margin-left: 0 !important;
        margin-right: 55px !important;
    }

    .mr-101 {
        margin-right: 0 !important;
        margin-left: 101px;
    }

    .ml-47 {
        margin-left: 0 !important;
        margin-right: 47px;
    }
    .mr-80 {
        margin-right: 0 !important;
        margin-left: 80px;
    }
}

// RTL overrides for antd modal
.ant-modal-wrap-rtl {
    .mr-16 {
        margin-right: 0 !important;
        margin-left: 16px;
    }
}

// custom.

.flex-1 {
    flex: 1 !important;
}

.text-center {
    text-align: center !important;
}

.cursor-pointer {
    cursor: pointer !important;
}

.unset {
    all: unset !important;
}

.icon-13 {
    width: 13px !important;
    height: 13px !important;
}

// w/h.

.w-50 {
    width: 50% !important;
}

.w-60 {
    width: 60% !important;
}

.w-30 {
    width: 30% !important;
}

.w-70 {
    width: 70% !important;
}
.w-150 {
    width: 150px !important;
}
.w-740 {
    width: 740px !important;
}

.mw-600 {
    min-width: 600px !important;
}

.w-800 {
    width: 800px !important;
}

.w-lg-75{

}

//align-items
.item-center {
    align-items: center;
}

.h-28 {
    height: 28px !important;
}

.w-28 {
    width: 28px !important;
}

.h-154 {
    height: 154px !important;
}

.w-154 {
    width: 154px !important;
}

.w-255 {
    width: 255px !important;
}

.h-345 {
    height: 450px !important;
}

// borders
.border-bottom-1 {
    border-bottom: 1px solid #dbdbdb;
}
.pt-126 {
    padding-top: 126px !important;
}

.ptlr-142 {
    padding-left: 142px !important;
    padding-right: 142px !important;
    padding-top: 195px !important;
}

//custom width
.w-394 {
    width: 394px !important;
}
.w-410 {
    width: 410px !important;
}
.w-35 {
    width: 35% !important;
}

.h-568 {
    height: 568px !important;
}

*[dir="rtl"] .text-start {
    text-align: right !important;
}
.border-color {
    border: 1px solid #f1f1f1 !important;
}

@media (max-width: 470px) {
    .flex-wrap-xsm {
        flex-wrap: wrap !important;
    }
    .align-items-xsm-start {
        align-items: flex-start !important;
    }
    .p-xsm-0 {
        padding: 0 !important;
    }
    .m-xsm-0 {
        margin: 0 !important;
    }
}