#locations_card { background-color: rgba(255, 255, 255, 0.8) !important; }
.card-header { padding: .5rem 1rem; }
.nav-tabs .nav-item.show .nav-link, .nav-tabs .nav-link.active {color: #495057;background-color: transparent;border-bottom: 3px solid #009688;}
.nav-tabs { border-bottom: 1px solid #c1cbcc; }
a { color: #009688; }
.alert-warning { background-color: #fff3cd73; border-color: #fff3cd73; }
.clock_out_div { display: block; }
.clock_out_div_update { display: block; }
.pignose-calendar .pignose-calendar-top {padding: 15px 0;}
.pignose-calendar .pignose-calendar-top .pignose-calendar-top-date {padding: 5px 0;}
.pignose-calendar .pignose-calendar-top .pignose-calendar-top-month {margin-bottom: .1em;font-size: 100%;}
.pignose-calendar .pignose-calendar-top .pignose-calendar-top-year {font-size: 94%;}
.pignose-calendar .pignose-calendar-header {margin-top: .3em;}
.pignose-calendar .pignose-calendar-unit {height: 3em;}
.pignose-calendar .pignose-calendar-unit a {line-height: 1.8em;}
.pignose-calendar .pignose-calendar-body {padding: 4px 12px;}
.dataTables_wrapper.dt-bootstrap4 .form-control {background-color: #fbfbfbb8;}
#availability-tab .nav-link { padding: 2px .8rem; }
.btn-dark {color: #e5e8f3f2 !important;background-color: #343a40d6;}
.mr--2 { margin-right: -2px!important; }
.mr--3 { margin-right: -3px!important; }
.mr--4 { margin-right: -4px!important; }
.modal{z-index: 1060 !important;}
.select2-container--open {z-index: 1060 !important;}

/* Custom Modal CSS */
/* font-family: 'Roboto', sans-serif; font-family: 'Roboto Slab', serif; */
.popup {font-size: 14px; top: 0;left: 0;width: 100%;height: 100%;z-index: 1050;display: none;position: fixed;text-align: center;background: rgba(0, 0, 0, 0.75); overflow-y: scroll;}
.popup:before {content: '';display: inline-block;height: 100%;margin-right: -4px;vertical-align: middle;}
.popup-inner {display: inline-block;text-align: left;position: relative;margin: 24px 0;max-width: 700px;width: 90%;padding: 18px;box-shadow: 0px 2px 6px rgba(0, 0, 0, 1);border-radius: 3px;background: #fff;}
.popup-close {width: 26px;height: 26px;padding-top: 4px;display: inline-block;position: absolute;top: 18px;right: 18px;-webkit-transform: translate(50%, -50%);transform: translate(50%, -50%);border-radius: 100%;background: transparent;border: solid 2px #808080;}
.popup-close:after,
.popup-close:before {content: "";position: absolute;top: 10px;left: 6px;height: 2px;width: 11px;border-radius: 30px;background: #808080;-webkit-transform: rotate(45deg);transform: rotate(45deg);}
.popup-close:after {-webkit-transform: rotate(-45deg);transform: rotate(-45deg);}
.popup-close:hover {-webkit-transform: translate(50%, -50%) rotate(180deg);transform: translate(50%, -50%) rotate(180deg);background: #f00;text-decoration: none;border-color: #f00;}
.popup-close:hover:after,
.popup-close:hover:before {background: #fff;}
.popup-header{font-size: 15px; font-weight: bold; border-bottom: 1px solid #9a9ea175; margin-bottom: 10px;}
.popup-footer{position: relative; padding: 6px 0; margin-top: 7px; border-top: 1px solid #ced4da;}

.form-group {margin-bottom: 0.6rem;}
.custom-card-deck .card{
    flex: inherit !important;
}
.fn-size-70{
    font-size: 70% !important;
}

.ms-options-wrap > button:focus, .ms-options-wrap > button {color: #636363;}
.w3-wrapper{
    color: #ffffff;
    text-decoration: none;
    font-size: 15px;
    position: relative;
    padding: 11px 7px 15px 7px;
    display: block;
    border-bottom: 3px solid transparent;
    transition: all 0.3s;
    box-sizing: border-box;
    height: 54px;
    width:20px;


}
.notify-icon{
    width: 20px;
    height: 25px;
    display: block;
    position: relative;
    background-position: center center;
    animation:ring 1.6s linear infinite;
}
.w3-count{
    position: absolute;
    padding: 2px 3px;
    background: #FF4F38;
    color: #fff;
    border-radius: 30px;
    top: 7px;
    right: 0px;
    min-width: 12px;
    font-size: 11px;
    z-index: 200;
    text-align: center;
    animation: w3-alert-red 1.6s infinite;
}
@keyframes w3-alert-red {
    0% {
        -webkit-box-shadow: 0 0 0 0 rgba(254, 57, 5, 0.7);
        -moz-box-shadow: 0 0 0 0 rgba(254, 57, 5, 0.7);
        box-shadow: 0 0 0 0 rgba(254, 57, 5, 0.7)
    }
    100% {
        -webkit-box-shadow: 0 0 0 15px rgba(254, 57, 5, 0);
        -moz-box-shadow: 0 0 0 15px rgba(254, 57, 5, 0);
        box-shadow: 0 0 0 15px rgba(254, 57, 5, 0)
    }
}

@keyframes ring
{
    0% { transform: rotate(0deg) }
    5% { transform: rotate(0deg) }
    15% { transform: rotate(0deg) }
    25% { transform: rotate(20deg) }
    35% { transform: rotate(-15deg) }
    45% { transform: rotate(10deg) }
    55% { transform: rotate(-5deg) }
    60% { transform: rotate(0deg) }
    100% { transform: rotate(0deg) }
}

/* Top bar location select to change location */
#topBarLocationChange {
    color: #c0c4cc;font-size: 20px;font-weight: 400;border: none!important;
    background-color: transparent!important;
    -moz-appearance:none; /* Firefox */
    -webkit-appearance:none; /* Safari and Chrome */
    appearance:none;
}


/* CSS Custom Changes */
.btn {border-radius: 4px;}
a { border-radius: 4px; }
.form-control:focus { color: #495057; background-color: #fff; border-color: #9a9a9a; box-shadow: 0 0 0 0.04rem rgba(114, 117, 119, 0.25); }
.form-control { border-radius: 6px; }
.select2-container--default .select2-selection--single {border-radius: 6px;}
.inner-header .ms-options-wrap {border-radius: 6px;}
.ms-options-wrap > button:focus, .ms-options-wrap > button {border-radius: 6px;}
.shift-box {border-radius: 6px;}
.conflict-container{border-radius: 6px;}
.card-p, .card-p, .card-body, .card-p-body {border-radius: 6px;}
.card-p-header, .card-header {border-radius: 6px;}


.table .thead-lb th {
    color: #ffffff;
    background-color: #62778d;
    border-color: #dee2e6;
    font-weight: 400;
    font-size: 13px;
}

.cursor-pointer{cursor: pointer;}








/***********************************************/

.mw-60 { min-width: 60px; }
.mw-70 { min-width: 70px; }
.mw-80 { min-width: 80px; }
.mw-188 { min-width: 188px; }
.mw-170 { min-width: 170px; }
.mw-150 { min-width: 150px; }
.mw-130 { min-width: 130px; }
.mw-120 { min-width: 120px; }
.mw-127 { min-width: 127px; }
.swal2-textarea {height: 99px!important;}


/* Custom chat css */
/* ===================================
    Variables
====================================== */
:root {
    --bg-page: #ffffff;
    --bg-page-darker: #f7f7f7;
    --bg-page-darkest: #b3b3b3;
    --colour-primary: #3996fb;
    --colour-primary-lightest: #009688;
    --colour-white: #fff;
    --colour-primary-darker: #1a7ee6;
    --colour-third: #419d78;
    --colour-third-lighter: #7bc9aa;
    --colour-third-lightest: #e6f7f0;
    --colour-text: #696969;
    --colour-text-lighter: #9b9b9b;
    --colour-text-darker: #626262;
    --colour-text-darkest: #363636;
    --border-color: #e8e7e7;
    --form-radius: 13px;
    --search-form-bg-colour: #f2f2f2;
    --send-form-bg-colour: #f2f2f2;
    --send-btn-box-shadow-colour: #7bbafd;
    --chat-bubble-me: #f2f2f2;
    --chat-bubble-you: var(--colour-primary);
}

.dark-mode {
    --bg-page: #1a1a1a;
    --bg-page-darker: #363636;
    --bg-page-darkest: #818181;
    --colour-primary: #1a71d0;
    --colour-primary-lightest: #202c3a;
    --colour-primary-darker: #449ffd;
    --colour-third: #41c590;
    --colour-third-lighter: #56d6a3;
    --colour-third-lightest: #272f2c;
    --colour-text: #c7c7c7;
    --colour-text-lighter: #868686;
    --colour-text-darker: #626262;
    --colour-text-darkest: #eaeaea;
    --border-color: #4c4c4c;
    --search-form-bg-colour: #363636;
    --send-form-bg-colour: #363636;
    --send-btn-box-shadow-colour: #44515f;
    --chat-bubble-me: #363636;
    --chat-bubble-you: var(--colour-primary);
}

/* ===================================
    Base
====================================== */
*,
*::before,
*::after {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

html {
    scroll-behavior: smooth;
}

.messages-page {
    height: calc(100vh - 100px);
}

.messages-page__header {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.messages-page__title {
    color: var(--colour-text-darker);
    font-weight: bold;
    font-size: 19px;
}

@media screen and (max-width: 1199px) {
    .messages-page__title {
        font-size: 1.5rem;
    }
}

.messages-page__dark-mode-toogler {
    width: 2.3rem;
    height: 2.3rem;
    padding: 0.35rem;
    border-radius: 50%;
    border: 1px solid var(--border-color);
    cursor: pointer;
    display: flex;
    justify-content: center;
    align-items: center;
}

.messages-page__dark-mode-toogler:hover {
    background-color: var(--colour-primary);
    border-color: var(--colour-primary);
}

.messages-page__dark-mode-toogler:hover path {
    fill: var(--bg-page-darker);
}

.messages-page__list {
    overflow-y: auto;
}

.messages-page__list-scroll {
    height: 100%;
    overflow: hidden;
    position: relative;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}

.custom-form {
    color: var(--colour-text-darkest);
    padding: 1rem;
    border-radius: 24px;
}

.custom-form__search-wrapper, .custom-form__send-wrapper {
    width: 100%;
    height: 100%;
    position: relative;
}

.custom-form__search-wrapper input::-moz-placeholder, .custom-form__send-wrapper input::-moz-placeholder {
    color: var(--colour-text-lighter);
    font-size: 0.9rem;
}

.custom-form__search-wrapper input:-ms-input-placeholder, .custom-form__send-wrapper input:-ms-input-placeholder {
    color: var(--colour-text-lighter);
    font-size: 0.9rem;
}

.custom-form__search-wrapper input::placeholder, .custom-form__send-wrapper input::placeholder {
    color: var(--colour-text-lighter);
    font-size: 0.9rem;
}

.custom-form__search-wrapper input:focus, .custom-form__send-wrapper input:focus {
    outline: none;
    box-shadow: none;
}

.custom-form__search-wrapper input {
    padding-right: 3rem;
    background-color: var(--search-form-bg-colour);
    border: 1px solid var(--bg-page);
}

.custom-form__search-wrapper input:-moz-placeholder-shown {
    background-color: var(--search-form-bg-colour);
    border: 1px solid var(--bg-page);
}

.custom-form__search-wrapper input:-ms-input-placeholder {
    background-color: var(--search-form-bg-colour);
    border: 1px solid var(--bg-page);
}

.custom-form__search-wrapper input:placeholder-shown {
    background-color: var(--search-form-bg-colour);
    border: 1px solid var(--bg-page);
}

.custom-form__search-wrapper input:focus {
    background-color: var(--bg-page);
    border-color: var(--border-color);
    color: var(--colour-text);
}

.custom-form__send-wrapper input {
    padding-right: 12px;
    padding-left: 12px;
    background-color: var(--send-form-bg-colour);
    border: none;
}

.custom-form__send-wrapper input:focus {
    background-color: var(--send-form-bg-colour);
    border-color: transparent;
    color: var(--colour-text);
}

.custom-form__search-submit {
    position: absolute;
    top: 0;
    right: 0;
    height: 100%;
    width: 2.8rem;
    cursor: pointer;
    background-color: transparent;
    border: none;
    outline: none;
    display: flex;
    justify-content: center;
    align-items: center;
}

.custom-form__search-submit:focus {
    outline: none;
    border: none;
}

.custom-form__send-submit {
    position: absolute;
    top: 50%;
    right: 3px;
    transform: translateY(-50%);
    height: 2.3rem;
    width: 2.3rem;
    display: flex;
    justify-content: center;
    align-items: center;
    background-color: var(--colour-primary);
    border-radius: 50%;
    box-shadow: 0 3px 3px var(--send-btn-box-shadow-colour);
    border: none;
    outline: none;
    text-align: center;
    font-size: 1.2rem;
    padding-top: 0.3rem;
    color: white;
    padding-right: 0.1rem;
}

.custom-form__send-submit:focus {
    outline: none;
    border: none;
}

.custom-form__send-submit:hover {
    background-color: var(--colour-primary-darker);
}

.custom-form__send-img {
    position: absolute;
    top: 50%;
    left: 0.5rem;
    transform: translateY(-50%);
    width: 2.3rem;
    cursor: pointer;
    display: flex;
    justify-content: center;
    align-items: center;
}

.custom-form__send-emoji {
    position: absolute;
    top: 50%;
    right: 3.2rem;
    transform: translateY(-50%);
    width: 2.3rem;
    cursor: pointer;
    display: flex;
    justify-content: center;
    align-items: center;
}

.messaging-member {
    margin-top: 1px;
    border-radius: 6px;
    background-color: #548580;
}

.messaging-member:hover {
    background-color: #009688;
}

.messaging-member--new .messaging-member__message {
    color: var(--colour-text-darker);
    font-weight: bold;
}

.messaging-member--online .user-status {
    background-color: var(--colour-third-lighter);
}

.messaging-member--active {
    background-color: var(--colour-primary-lightest);
}

.messaging-member--active:hover {
    background-color: #548580;
}

@media screen and (max-width: 767px) {
    .messaging-member--active {
        background-color: var(--colour-primary-lightest);
    }

    .messaging-member--active:hover {
        background-color: var(--bg-page-darker);
    }
}

.messaging-member__wrapper {
    display: flex;
    cursor: pointer;
    padding: 8px 8px;
    border-radius: 10px;
}

.messaging-member__avatar {
    position: relative;
    width: 40px;
    height: 40px;
}

.messaging-member__avatar img {
    border-radius: 50%;
    width: 100%;
    height: 100%;
}

.messaging-member__name {
    font-weight: bold;
    font-size: 0.9rem;
    color: #dae0e0;
    margin-top: 10px;
    margin-left: 14px;
}

.messaging-member__message {
    grid-area: message;
    white-space: nowrap;
    word-break: break-word;
    text-overflow: ellipsis;
    overflow: hidden;
    font-size: 0.9rem;
}

.chat {
    height: 100%;
    width: 100%;
}

.chat__container {
    height: 100%;
    width: 100%;
}

.chat__wrapper {
    background-color: var(--bg-page);
    height: 100%;
    width: 100%;
    border-left: 1px solid var(--border-color);
    border-right: 1px solid var(--border-color);
    overflow: hidden;
    position: relative;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}

@media screen and (max-width: 767px) {
    .chat__wrapper {
        border-left: none;
        border-right: none;
    }
}

.chat__messaging {
    width: 100%;
    border-bottom: 1px solid var(--border-color);
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.chat__previous {
    width: 8%;
    min-width: 2rem;
    height: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    font-size: 1.7rem;
    cursor: pointer;
    color: var(--colour-primary);
}

.chat__notification {
    width: 4%;
    min-width: 1.5rem;
}

.chat__notification span {
    display: none;
    width: 1.4rem;
    height: 1.4rem;
    text-align: center;
    border-radius: 50%;
    font-weight: bold;
    color: white;
    background-color: var(--colour-primary);
    font-size: 0.9rem;
}

.chat__notification--new span {
    display: block;
}

.chat__infos {
    flex-grow: 1;
}

.chat__actions {
    font-size: 5px;
    height: 2rem;
    min-width: 2rem;
    color: var(--colour-primary);
    display: flex;
    justify-content: center;
    align-items: center;
    cursor: pointer;
}

.chat__actions ul {
    list-style: none;
    display: flex;
}

.chat__actions li {
    width: 2.6rem;
    height: 2.6rem;
    padding: 0.35rem;
    display: flex;
    justify-content: center;
    align-items: center;
    border-radius: 50%;
    background-color: var(--bg-page);
}

.chat__actions li + li {
    margin-left: 0.3rem;
}

.chat__actions li:hover {
    background-color: var(--colour-primary-lightest);
}

.chat__content {
    flex-grow: 1;
    overflow-y: auto;
}

.chat__list-messages {
    list-style: none;
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
}

.chat__list-messages li {
    margin-bottom: 0.7rem;
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    align-items: flex-start;
}

.chat__list-messages li .chat__bubble {
    margin-bottom: 0.2rem;
}

.chat__bubble {
    position: relative;
    color: var(--colour-text-darkest);
    padding: 0.5rem 1rem;
    border-radius: 22px;
    background-color: var(--bg-page);
    max-width: 30rem;
    font-size: 0.9rem;
    overflow: hidden;
    overflow-wrap: break-word;
    word-break: break-word;
}

.chat__bubble--you {
    margin-right: 2rem;
    color: white;
    background-color: var(--chat-bubble-you);
}

.chat__bubble--me {
    margin-left: 2rem;
    background-color: var(--chat-bubble-me);
    align-self: flex-end;
}

.chat__time {
    font-size: 0.8rem;
    color: var(--colour-text-lighter);
    align-self: center;
    padding-bottom: 0.2rem;
}

.chat__send-container {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.chat-member__wrapper {
    width: 100%;
    height: 100%;
    display: flex;
    justify-content: flex-start;
    align-items: center;
}

.chat-member__avatar {
    position: relative;
    width: 3.5rem;
}

.chat-member__avatar img {
    border-radius: 50%;
    width: 100%;
    padding: 4px;
    border: 1px solid #c4c6c7;
}

@media screen and (max-width: 767px) {
    .chat-member__avatar {
        width: 2.5rem;
    }
}

.chat-member__name {
    font-weight: bold;
    color: var(--colour-text-darker);
    /*margin-top: auto;*/
    white-space: nowrap;
    word-break: break-all;
    text-overflow: ellipsis;
    overflow: hidden;
    font-size: 1rem;
}

@media screen and (max-width: 1199px) {
    .chat-member__name {
        font-size: 0.9rem;
    }
}

.chat-member__details {
    margin-left: 0.8rem;
    display: flex;
    justify-content: center;
    flex-direction: column;
}

@media screen and (max-width: 767px) {
    .chat-member__details {
        margin-left: 1rem;
    }
}

.chat-member__age {
    font-size: 0.9rem;
    color: var(--colour-text-lighter);
    position: relative;
}

.chat-member__age::after {
    content: " . ";
    font-size: 0px;
    position: absolute;
    top: 50%;
    right: -4px;
    width: 3px;
    height: 3px;
    background-color: var(--colour-text-lighter);
    border-radius: 50%;
}

.chat-member__status {
    color: var(--colour-text-lighter);
    font-size: 0.8rem;
}

.chat__profile {
    width: 100%;
    height: 100%;
    max-width: 20rem;
}

.chat--mobile {
    position: fixed;
    top: 0;
    left: 0;
    z-index: 10001;
    transform: translateY(100%);
    display: none;
    transition: transform 0.3s ease-in-out 0.1s;
}

.chat--mobile .chat__wrapper {
    border-radius: 0;
}

.chat--mobile.chat--show {
    display: block;
    transform: translateY(0%);
    border-radius: 0;
}

.user-profile {
    width: 100%;
    height: 100%;
    position: relative;
    overflow: hidden;
    overflow-y: auto;
}

.user-profile__wrapper {
    position: relative;
    height: 100%;
    width: 100%;
    padding-top: 5rem;
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
}

.user-profile__close {
    position: absolute;
    top: 1rem;
    left: 1.5rem;
    width: 2rem;
    height: 2rem;
    color: var(--colour-primary);
    font-size: 1.375rem;
    cursor: pointer;
    z-index: 10003;
}

.user-profile__avatar {
    display: flex;
    justify-content: center;
    align-items: center;
}

.user-profile__avatar img {
    width: 9rem;
    border-radius: 50%;
    border: 1px solid #b9b9b9;
    padding: 4px;
}

.user-profile__name {
    font-weight: bold;
    margin-top: 0.7rem;
    color: var(--colour-text-darker);
    word-wrap: break-word;
    font-size: 1.15rem;
}

@media screen and (max-width: 767px) {
    .user-profile__name {
        font-size: 1.1rem;
    }
}

.user-profile__phone {
    color: var(--colour-text-darker);
    font-size: 0.9rem;
}

.user-profile__details {
    display: flex;
    flex-direction: column;
    justify-content: center;
    text-align: center;
}

.user-profile__location {
    color: var(--colour-text-lighter);
    font-size: 0.9rem;
}

.user-profile__description {
    text-align: center;
}

.user-profile__description p {
    margin-top: 1.3rem;
    word-wrap: break-word;
    overflow: hidden;
    text-overflow: ellipsis;
    font-size: 0.9rem;
}

.user-profile__label {
    font-size: 0.9rem;
    font-weight: bold;
}

.user-profile__tags {
    list-style: none;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
}

.user-profile__tags li {
    padding: 0.3rem 1rem;
    border-radius: 1rem;
    margin-right: 0.3rem;
    margin-bottom: 0.3rem;
    font-size: 0.9rem;
}

.text-light-gray {
    color: lightgray;
}

.user-profile__tags a:hover {
    text-decoration: none;
}

.user-profile__tags--primary li {
    background-color: var(--colour-primary-lightest);
    color: var(--colour-primary-darker);
}

.user-profile__tags--primary a:hover {
    color: var(--colour-primary-darker);
}

.user-profile__tags--secondary li {
    background-color: var(--colour-third-lightest);
    color: var(--colour-third);
}

.user-profile__tags--secondary a:hover {
    color: var(--colour-third);
}

.user-profile--large {
    display: none;
    position: fixed;
    top: 0;
    right: 0;
    z-index: 10002;
    transform: translateX(100%);
    transition: transform 0.3s ease-in-out 0.1s;
    background-color: var(--bg-page);
    box-shadow: -3px 0 3px rgba(0, 0, 0, 0.06);
}

.user-profile--large.user-profile--show {
    display: block;
    transform: translateX(0%);
    border-radius: 0;
}

.user-status {
    position: absolute;
    right: 0;
    bottom: 0;
    width: 1rem;
    height: 1rem;
    background-color: var(--colour-text-lighter);
    border: 3px solid white;
    border-radius: 50%;
}

.user-status--online {
    background-color: var(--colour-third);
}

.svg-icon {
    width: 70%;
}

.svg-icon path,
.svg-icon circle {
    fill: var(--colour-primary);
}

.svg-icon--send {
    width: 60%;
    margin-top: -7px;
}

.svg-icon--send path,
.svg-icon--send circle {
    fill: white;
}

.svg-icon--search {
    width: 40%;
    font-size: 16px;
    color: #b0b7b7;
}

.svg-icon--search path,
.svg-icon--search circle {
    fill: var(--bg-page-darkest);
}

.svg-icon--send-img {
    width: 55%;
}

.svg-icon--send-img path,
.svg-icon--send-img circle {
    fill: var(--bg-page-darkest);
}

.svg-icon--send-emoji {
    width: 60%;
}

.svg-icon--send-emoji path,
.svg-icon--send-emoji circle {
    fill: var(--bg-page-darkest);
}

.svg-icon--previous {
    width: 55%;
}

.svg-icon--dark-mode {
    width: 80%;
}

.svg-icon--dark-mode path,
.svg-icon--dark-mode circle {
    fill: var(--colour-primary);
}


.support_chat_content.chat__wrapper{
    width: 54%;
    margin: auto;
}

.select-all-approval-checkbox{

}

.swal2-header .swal2-icon {width: 3.3em;height: 3.3em;}
.swal2-icon .swal2-icon-content {font-size: 43px!important;}
.swal2-header .swal2-title {font-size: 23px;}
.swal2-actions button {font-size: 14px !important;}
.swal2-header .swal2-icon {margin: 12px auto 14px;}
.swal2-content {font-size: 15px!important;}

.alert-link-bold {font-weight: bold;text-decoration: underline!important;color: hotpink;}
.leave-heading{color: #a33232;font-size: 14px;font-weight: bold; margin-bottom: 20px;}
.leave-content{color: #504b4b;font-size: 14px; margin-top: 12px;margin-bottom: 20px;}

.card .card-body .readonly {
    background-color: #a1a3a342 !important;
}


.form-control-sm + .ms-options-wrap > button{
    font-size: 14px!important;
    padding: 4px 8px!important;
}
.form-control-sm + .ms-options-wrap > .ms-options{
    font-size: 14px!important;
}

.form-control-xs {
    height: calc(1.5em + 0.5rem + 2px);
    padding: 0.25rem 0.5rem;
    font-size: 12px;
    line-height: 1.5;
    border-radius: 0.2rem;
}

.cus-card-header{
    color: white;
    background-color: #41517e;
    border-radius: 6px;
}

.h-5x{height: 5px!important;}
.h-6x{height: 6px!important;}
.card-menu-list{display: flex; }
.card-menu-item{text-align: center; padding: 4px; margin-right: 14px;}
.card-menu-link{color: #717078; font-size: 14px;}
.card-menu-link:hover{color: #8f96a8;}
.card-header-top-menu .card-menu-item .card-menu-link.active{color: #c0c4d1;}
.task-container {padding: 0;}
.task-left{padding: 8px;width: 240px;border-radius: 4px;margin-right: 6px;min-height: calc(95vh - 131px); background-color: #ffffff;}
.task-content{padding: 8px;flex: 1;min-height: calc(95vh - 55px);}
.task-right{padding: 8px;width: 200px;}
.task-list-header {width: 100%; padding: 10px;border-radius: 8px;margin-bottom: 10px; background-color: #ffffff;font-size: 15px; font-weight: bold;}
.task-card {width: 100%; padding: 10px;border-radius: 8px;margin-bottom: 10px; background-color: #ffffff;}
.task-card-heading {font-size: 14px; font-weight: 600;}
.task-hti {color: #919399;padding-right: 34px;}
.task-card-content {font-size: 13px; font-weight: normal;}
.deadline-date {color: #b4c1c0;margin-top: 12px;font-size: 11px; font-weight: normal;}
.task-comment-icon {margin-top: 7px;font-size: 14px; font-weight: normal;}
.btn-add-sub-task{font-size: 11px; font-weight: bold;text-align: right;}
.sub-task-heading{font-size: 13px; font-weight: 600;color: #919399;}
.sub-task-description{font-size: 12px;margin-top: 5px;margin-left: 9px;}
.heading-tasks-search{font-size: 14px;color: #919399;margin-top: 10px;}

.chb-xs{font-size: 11px;display: inline-block;vertical-align: top;margin-top: 10px;}
.chb-xs > input[type=checkbox]{transform: scale(0.8);}
.form-group-sm label {font-size: 11px!important;}
.form-control {line-height: 2;}
.tasks-top-search {border-radius: 20px!important;}

.custom-chb input[type='radio']:after {
    width: 17px;
    height: 17px;
    border-radius: 15px;
    top: -2px;
    left: -1px;
    position: relative;
    background-color: #d1d3d1;
    content: '';
    display: inline-block;
    visibility: visible;
    border: 2px solid white;
}

.custom-chb input[type='radio']:checked:after {
    width: 17px;
    height: 17px;
    border-radius: 15px;
    top: -2px;
    left: -1px;
    position: relative;
    background-color: #39c1a8;
    content: '';
    display: inline-block;
    visibility: visible;
    border: 2px solid white;
}

.br-6x{border-radius: 6px;}
.br-4x{border-radius: 4px;}

/* task comment css */
.task-comment-section{margin-top: 12px; border-radius: 8px;}
.task-comment-list{width: 100%;max-height: 257px; overflow-y: auto;border-radius: 8px;padding: 12px 6px;background-color: #bfbfbf36;}
.task-comment-item{display: flex;}
.task-com-text-container{flex: 1; margin-left: 10px;}
.task-com-user{width: 43px;height: 43px;padding: 6px;
    border-radius: 22px;border: 1px solid #91939947;}
.task-com-user img{width: 100%;}
.task-com-username{font-size: 13px;color: #919399;}
.task-com-text{font-size: 13px;color: #505454;margin-top: 5px;margin-bottom: 10px;}
.add-new-comment{border-radius: 27px;line-height: 1.5;}
.task-comment-new{position: relative;}
.task-comment-nf{font-size: 12px;padding-left: 10px;}
.btn-task-delete{margin-right: 9px;font-size: 12px;color: #b1b1b1;}

.line-h-1x5{line-height: 1.5!important;}


.tooltip-inner{
    background-color: #33b2ff!important;
    font-size: 13px !important;
}

.bs-tooltip-auto[x-placement^=top] .arrow::before, .bs-tooltip-top .arrow::before {
    top: 0;
    border-width: 0.4rem 0.4rem 0;
    border-top-color: #33b2ff !important;
}

.bs-tooltip-auto[x-placement^=bottom] .arrow::before, .bs-tooltip-bottom .arrow::before {
    bottom: 0;
    border-width: 0 0.4rem 0.4rem;
    border-bottom-color: #33b2ff !important;
}


.mt--0{margin-top: 0!important;}
.mt--1x{margin-top: -1px!important;}
.mt--2x{margin-top: -2px!important;}
.log-data-ch-icon{color: #dc3545;font-size: 11px; padding: 2px 5px;}

.task-lists-scroll {
    max-height: calc(100vh - 112px); overflow-x: hidden;overflow-y: auto;
}

.rotate {
    transition: all 1.5s;
}

.rotate-90 {
    -webkit-transform: rotate(90deg);
    transform: rotate(90deg);
}
.rotate-180 {
    -webkit-transform: rotate(180deg);
    transform: rotate(180deg);
}


.task-list-head {
    margin: 8px 0;
    padding: 10px;
    font-size: 13px;
    font-weight: bold;
    border-radius: 6px;
    background-color: #dbdbdb;
}
.task-list {
    margin: 8px 0;
    padding: 10px;
    font-size: 13px;
    border-radius: 6px;
    background-color: #ffffff;
}

.task-list-head, .task-list{
    text-align: left;
}

.flex-item-1{width: 4%;padding: 0 6px;}
.flex-item-2{width: 24%;padding: 0 6px;}
.flex-item-3{width: 32%;padding: 0 6px;}
.flex-item-4{width: 11%;padding: 0 12px;}
.flex-item-5{width: 11%;padding: 0 6px;}
.flex-item-6{width: 11%;padding: 0 6px;}
.flex-item-7{width: 7%;padding: 0 4px;}

.task-status-box{ border-radius: 6px;
    padding: 4px 10px;}

.task-status-primary {
    color: #ffffff;
    font-size: 12px;
    background-color: #5783b3!important;
}
.task-status-todo {
    color: #ffffff;
    font-size: 12px;
    background-color: #bfa112!important;
}
.task-status-overdue {
    color: #ffffff;
    font-size: 12px;
    background-color: #b55d65!important;
}

.task-status-completed {
    color: #ffffff;
    font-size: 12px;
    background-color: #53b784!important;
}
.text-underline{text-decoration: underline;}
.text-light{
    color: #919399!important
}

.res-msg-page-md{width: 70%;margin: 10px auto}

[contenteditable]:focus {
    outline: 1px solid #dee2e6;
    border-radius: 6px;
}


input[type="checkbox"]:disabled + label::before{
    background: #1a6f25;
}
input[type="checkbox"]:disabled + label:hover::before{
    background: #921b1b;
    border: 1px solid #d4d4d5;
}
.mb-6x{margin-bottom: 6px!important;}
.mb-5x{margin-bottom: 5px!important;}