/********************/
/** Helper classes **/
/********************/


/***************/
/*** PADDING ***/
/***************/
.p-0 {
    padding: 0 !important;
}
.p-4 {
    padding: 4px !important;
}
.p-8 {
    padding: 8px !important;
}
.p-16 {
    padding: 16px !important;
}
.p-20 {
    padding: 20px !important;
}
.p-24 {
    padding: 24px !important;
}
.p-25 {
    padding: 25px !important;
}
.p-36 {
    padding: 36px !important;
}
.p-48 {
    padding: 48px !important;
}
.p-l-0 {
    padding-left: 0 !important;
}
.p-l-5 {
    padding-left: 5px !important;
}
.p-l-8 {
    padding-left: 8px !important;
}
.p-l-10 {
    padding-left: 10px !important;
}
.p-l-12 {
    padding-left: 12px !important;
}
.p-l-20 {
    padding-left: 20px !important;
}
.p-l-24 {
    padding-left: 24px !important;
}
.p-l-28 {
    padding-left: 28px !important;
}
.p-t-0 {
    padding-top: 0 !important;
}
.p-t-3 {
    padding-top: 3px !important;
}
.p-t-5 {
    padding-top: 5px !important;
}
.p-t-10 {
    padding-top: 10px !important;
}
.p-t-15 {
    padding-top: 15px !important;
}
.p-t-16 {
    padding-top: 16px !important;
}
.p-t-20 {
    padding-top: 20px !important;
}
.p-r-0 {
    padding-right: 0 !important;
}
.p-r-5 {
    padding-right: 5px !important;
}
.p-r-8 {
    padding-right: 8px !important;
}
.p-r-10 {
    padding-right: 10px !important;
}
.p-r-20 {
    padding-right: 20px !important;
}
.p-r-24 {
    padding-right: 24px !important;
}
.p-r-30 {
    padding-right: 30px !important;
}
.p-b-0 {
    padding-bottom: 0 !important;
}
.p-b-5 {
    padding-bottom: 5px !important;
}
.p-b-8 {
    padding-bottom: 8px !important;
}
.p-b-10 {
    padding-bottom: 10px !important;
}
.p-b-15 {
    padding-bottom: 15px !important;
}
.p-b-20 {
    padding-bottom: 20px !important;
}
.p-b-40 {
    padding-bottom: 40px !important;
}

.p-tb-19 {
    padding-top: 19px !important;
    padding-bottom: 19px !important;
}
.p-lr-12 {
    padding-left: 12px !important;
    padding-right: 12px !important;
}

/**************/
/*** MARGIN ***/
/**************/
.m-0 {
    margin: 0 !important;
}
.m-5 {
    margin: 5px !important;
}
.m-10 {
    margin: 10px !important;
}
.m-20 {
    margin: 20px !important;
}
.m-24 {
    margin: 24px !important;
}
.m-30 {
    margin: 30px !important;
}

.m-r-auto {
    margin-right: auto;
}

.m-r-0 {
    margin-right: 0 !important;
}
.m-r-3 {
    margin-right: 3px !important;
}
.m-r-5 {
    margin-right: 5px !important;
}
.m-r-6 {
    margin-right: 6px !important;
}
.m-r-8 {
    margin-right: 8px !important;
}
.m-r-10 {
    margin-right: 10px !important;
}
.m-r-12 {
    margin-right: 12px !important;
}
.m-r-14 {
    margin-right: 14px !important;
}
.m-r-15 {
    margin-right: 15px !important;
}
.m-r-16 {
    margin-right: 16px !important;
}
.m-r-20 {
    margin-right: 20px !important;
}
.m-r-30 {
    margin-right: 30px !important;
}
.m-r-40 {
    margin-right: 40px !important;
}

.m-l-auto {
    margin-left: auto !important;
}

.m-l-0 {
    margin-left: 0 !important;
}
.m-l-4 {
    margin-left: 4px !important;
}
.m-l-5 {
    margin-left: 5px !important;
}
.m-l-10 {
    margin-left: 10px !important;
}

.m-l-15 {
    margin-left: 15px !important;
}
.m-l-16 {
    margin-left: 16px !important;
}
.m-l-20 {
    margin-left: 20px !important;
}
.m-l-30 {
    margin-left: 30px !important;
}

.m-l-40 {
    margin-left: 40px !important;
}

.m-t-0 {
    margin-top: 0 !important;
}

.m-t-4 {
    margin-top: 4px !important;
}

.m-t-5 {
    margin-top: 5px !important;
}
.m-t-8 {
    margin-top: 8px !important;
}

.m-t-10 {
    margin-top: 10px !important;
}

.m-t-12 {
    margin-top: 12px !important;
}

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

.m-t-15 {
    margin-top: 15px !important;
}
.m-t-16 {
    margin-top: 16px !important;
}

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

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

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

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

.m-t-40 {
    margin-top: 40px !important;
}

.m-b-0 {
    margin-bottom: 0 !important;
}
.m-b-2 {
    margin-bottom: 2px !important;
}
.m-b-4 {
    margin-bottom: 4px !important;
}

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

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

.m-b-10 {
    margin-bottom: 10px !important;
}

.m-b-12 {
    margin-bottom: 12px !important;
}

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

.m-b-15 {
    margin-bottom: 15px !important;
}

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

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

.m-b-24 {
    margin-bottom: 24px !important;
}
.m-b-25 {
    margin-bottom: 25px !important;
}

.m-b-30 {
    margin-bottom: 30px !important;
}
.m-b-35 {
    margin-bottom: 35px !important;
}
.m-b-36 {
    margin-bottom: 36px !important;
}
.m-b-40 {
    margin-bottom: 40px !important;
}
.m-b-48 {
    margin-bottom: 48px !important;
}

/**************/
/*** BORDER ***/
/**************/
.border-0 {
    border: none !important;
}
.border-t-l-8 {
    border-top-left-radius: 8px !important;
}
.border-b-l-8 {
    border-bottom-left-radius: 8px !important;
}
.border-t-r-16 {
    border-top-right-radius: 16px !important;
}
.border-t-l-16 {
    border-top-left-radius: 16px !important;
}
.border-b-r-16 {
    border-bottom-right-radius: 16px !important;
}
.border-b-l-16 {
    border-bottom-left-radius: 16px !important;
}

.border-primary {
    border: 1px solid var(--app-color-primary) !important;
}

/*************/
/*** FLOAT ***/
/*************/
.float-left {
    float: left !important;
}
.float-right {
    float: right !important;
}
.float-none {
    float: none !important;
}

/**************/
/*** CURSOR ***/
/**************/
.cursor-grabbing {
    cursor: grabbing !important;
}

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

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

.no-click {
    pointer-events: none;
}

/*************/
/*** WIDTH ***/
/*************/
.w-auto {
    width: auto !important;
}

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

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

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

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

.w-30px {
    width: 30px !important;
}
.w-50px {
    width: 50px !important;
}
.w-180px {
    width: 180px !important;
}

.mw-auto {
    min-width: auto !important;
}

.mw-25 {
    min-width: 25% !important;
}

.mw-50 {
    min-width: 50% !important;
}

.mw-75 {
    min-width: 75% !important;
}
.mw-100px {
    min-width: 100px !important;
}
.mw-200px {
    min-width: 200px !important;
}

/**************/
/*** HEIGHT ***/
/**************/

.h-auto {
    height: auto !important;
}
.h-16px {
    height: 16px !important;
}
.h-25 {
    height: 25% !important;
}

.h-50 {
    height: 50% !important;
}

.h-75 {
    height: 75% !important;
}

.h-100 {
    height: 100% !important;
}

.mh-auto {
    min-height: auto !important;
}

.mh-48 {
    min-height: 48px !important;
}

/***************/
/*** DISPLAY ***/
/***************/
.d-inline {
    display: inline !important;
}

.d-inline-block {
    display: inline-block !important;
}

.d-block {
    display: block !important;
}

.d-grid {
    display: grid !important;
}

.d-table {
    display: table !important;
}

.d-table-row {
    display: table-row !important;
}

.d-table-cell {
    display: table-cell !important;
}

.d-flex {
    display: flex !important;
}
.d-inline-flex {
    display: inline-flex !important;
}

.d-none {
    display: none !important;
}

.flex-row {
    flex-direction: row !important;
}
.flex-column {
    flex-direction: column !important;
}

@media (max-width: 767px) {
    .flex-row {
        flex-direction: column !important;
    }
    .flex-sm-column {
        flex-direction: column !important;
    }
}

/*****************/
/*** FONT-SIZE ***/
/*****************/
.font-12 {
    font-size: 12px !important;
}

.font-13 {
    font-size: 13px !important;
}

.font-14 {
    font-size: 14px !important;
}

.font-15 {
    font-size: 15px !important;
}

.font-16 {
    font-size: 16px !important;
}

.font-17 {
    font-size: 17px !important;
}
.font-18 {
    font-size: 18px !important;
}
.font-20 {
    font-size: 20px !important;
}

.font-32 {
    font-size: 32px !important;
}
.font-36 {
    font-size: 36px !important;
}

/*****************/
/*** FONT-WEIGHT ***/
/*****************/
.font-weight-300 {
    font-weight: 300 !important;
}
.font-weight-400 {
    font-weight: 400 !important;
}
.font-weight-500 {
    font-weight: 500 !important;
}
.font-weight-600 {
    font-weight: 600 !important;
}
.font-weight-700 {
    font-weight: 700 !important;
}

.bg-white {
    background-color: #ffffff !important;
}

.bg-none {
    background: none !important;
}

/*****************/
/*** FONT-STYLE ***/
/*****************/
.font-style-italic {
    font-style: italic !important;
}
/************/
/*** FLEX ***/
/************/
.flex-direction-col {
    flex-direction: column;
}

.flex-horizontal-center {
    justify-content: center;
}

.flex-vertical-center {
    align-items: center;
}
@media (min-width: 768px) {
    .flex-md-vertical-center {
        align-items: center;
    }
}
.flex-vertical-top {
    align-items: start !important;
}
.align-self-end {
    align-self: end;
}

.flex-content-between {
    justify-content: space-between;
}

.flex-content-evenly {
    justify-content: space-evenly;
}

.flex-content-end {
    justify-content: flex-end;
}

.flex-wrap {
    flex-wrap: wrap;
}

.flex-gap-4 {
    gap: 4px;
}
.flex-gap-6 {
    gap: 6px;
}
.flex-gap-8 {
    gap: 8px;
}
.flex-gap-12 {
    gap: 12px;
}
.flex-gap-16 {
    gap: 16px;
}
.flex-gap-24 {
    gap: 24px;
}
.flex-gap-28 {
    gap: 28px;
}
.flex-gap-36 {
    gap: 36px;
}
.flex-gap-40 {
    gap: 40px;
}
.flex-1 {
    flex: 1;
}
.flex-1-1-0 {
    flex: 1 1 0;
}

.col-320 {
    width: 320px;
}
@media (max-width: 767px) {
    .col-320 {
        width: 100%;
    }
}

.col-350 {
    width: 350px;
}
@media (max-width: 767px) {
    .col-350 {
        width: 100%;
    }
}

.col-385 {
    width: 385px;
}
@media (max-width: 900px) {
    .col-385 {
        width: 100%;
    }
}

.col-470 {
    width: 470px;
}
@media (max-width: 900px) {
    .col-470 {
        width: 100%;
    }
}

/******************/
/*** text-align ***/
/******************/

.text-start {
    text-align: left !important;
}

.text-end {
    text-align: right !important;
}

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

/****************/
/*** OVERFLOW ***/
/****************/

.overflow-ellipsis {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.overflow-visible {
    overflow: visible !important;
}

.overflow-hidden {
    overflow: hidden !important;
}

.overflow-wrap-break-word {
    overflow-wrap: break-word;
}

.white-space-normal {
    white-space: normal;
}

.white-space-nowrap {
    white-space: nowrap;
}

.text-break {
    word-break: break-word;
}
.normal-break {
    word-break: normal !important;
}
.all-break {
    word-break: break-all;
}

/***************/
/*** SELECT2 ***/
/***************/
select.select-w-85 + span.select2-container {
    min-width: 85px !important;
    width: 85px !important;
}

select.select-w-150 + span.select2-container {
    min-width: 150px !important;
    width: 150px !important;
}
.select-w-200,
select.select-w-200 + span.select2-container {
    min-width: 200px !important;
    width: 200px !important;
}
.select-w-300,
select.select-w-300 + span.select2-container {
    min-width: 300px !important;
    width: 300px !important;
}
select.select-w-400 + span.select2-container {
    min-width: 400px !important;
    width: 400px !important;
}

select.select-w-100-percent + span.select2-container {
    min-width: 100% !important;
    width: 100% !important;
}

/***************/
/*** TOOTTIP ***/
/***************/
.tooltip-w-max-content + .tooltip.in {
    width: max-content;
}


/*********************/
/******* FONT ********/
/*********************/
.color-danger {
    color: var(--app-color-danger);
}
.color-grey-medium {
    color: var(--app-color-grey-medium) !important;
}

/*********************/
/*** MISCELLANEOUS ***/
/*********************/

.p-relative {
    position: relative !important;
}

.table-layout-fixed {
    table-layout: fixed;
}

.table-layout-fixed td {
    overflow-wrap: break-word;
}

.number-position {
    text-align: right;
}
.number-position span {
    margin-left: auto;
}

.img-fluid {
    max-width: 100%;
    height: auto;
}

.border-bottom-none {
    border-bottom: none !important;
}
.border-right-none {
    border-right: none !important;
}

textarea.resizable {
    resize: both;
}

.rounded-0 {
    border-radius: 0!important;
}
.rounded-8 {
    border-radius: 8px!important;
}
.rounded-12 {
    border-radius: 12px!important;
}

.lh-normal {
    line-height: normal;
}
.lh-24 {
    line-height: 24px;
}
.lh-32 {
    line-height: 32px;
}

.text-decoration-none {
    text-decoration: none !important;
}

.hidden-text {
    color: transparent;
    text-shadow: 0 0 5px rgba(0,0,0,0.5);
}
