/***Common***/
* {
    font-family: "Montserrat";
}

body {
    font-family: "Montserrat";
}

@font-face {
    font-family: "Montserrat";
    font-style: italic;
    font-weight: 100;
    font-display: swap;
    /* src: url('../fonts/JTUQjIg1_i6t8kCHKm459WxRyS7m.woff2") }}*/
    /* format("woff2"); */
    /* src: url('../fonts/JTUQjIg1_i6t8kCHKm459WxRyS7m.woff2')
        format("woff2"); */
    src: url("../fonts/JTUQjIg1_i6t8kCHKm459WxRyS7m.woff2") format("woff2");
    unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA,
        U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+2074, U+20AC, U+2122,
        U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

@font-face {
    font-family: "Montserrat";
    font-style: italic;
    font-weight: 200;
    font-display: swap;
    src: url("../fonts/JTUQjIg1_i6t8kCHKm459WxRyS7m.woff2") format("woff2");
    unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA,
        U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+2074, U+20AC, U+2122,
        U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

@font-face {
    font-family: "Montserrat";
    font-style: italic;
    font-weight: 300;
    font-display: swap;
    src: url("../fonts/JTUQjIg1_i6t8kCHKm459WxRyS7m.woff2") format("woff2");
    unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA,
        U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+2074, U+20AC, U+2122,
        U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

@font-face {
    font-family: "Montserrat";
    font-style: italic;
    font-weight: 400;
    font-display: swap;
    src: url("../fonts/JTUQjIg1_i6t8kCHKm459WxRyS7m.woff2") format("woff2");
    unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA,
        U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+2074, U+20AC, U+2122,
        U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

@font-face {
    font-family: "Montserrat";
    font-style: italic;
    font-weight: 500;
    font-display: swap;
    src: url("../fonts/JTUQjIg1_i6t8kCHKm459WxRyS7m.woff2") format("woff2");
    unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA,
        U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+2074, U+20AC, U+2122,
        U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

@font-face {
    font-family: "Montserrat";
    font-style: italic;
    font-weight: 600;
    font-display: swap;
    src: url("../fonts/JTUQjIg1_i6t8kCHKm459WxRyS7m.woff2") format("woff2");
    unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA,
        U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+2074, U+20AC, U+2122,
        U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

@font-face {
    font-family: "Montserrat";
    font-style: italic;
    font-weight: 700;
    font-display: swap;
    src: url("../fonts/JTUQjIg1_i6t8kCHKm459WxRyS7m.woff2") format("woff2");
    unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA,
        U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+2074, U+20AC, U+2122,
        U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

@font-face {
    font-family: "Montserrat";
    font-style: italic;
    font-weight: 800;
    font-display: swap;
    src: url("../fonts/JTUQjIg1_i6t8kCHKm459WxRyS7m.woff2") format("woff2");
    unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA,
        U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+2074, U+20AC, U+2122,
        U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

@font-face {
    font-family: "Montserrat";
    font-style: italic;
    font-weight: 900;
    font-display: swap;
    src: url("../fonts/JTUQjIg1_i6t8kCHKm459WxRyS7m.woff2") format("woff2");
    unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA,
        U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+2074, U+20AC, U+2122,
        U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

@font-face {
    font-family: "Montserrat";
    font-style: normal;
    font-weight: 100;
    font-display: swap;
    src: url("../fonts/JTUSjIg1_i6t8kCHKm459Wlhyw.woff2") format("woff2");
    unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA,
        U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+2074, U+20AC, U+2122,
        U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

@font-face {
    font-family: "Montserrat";
    font-style: normal;
    font-weight: 200;
    font-display: swap;
    src: url("../fonts/JTUSjIg1_i6t8kCHKm459Wlhyw.woff2") format("woff2");
    unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA,
        U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+2074, U+20AC, U+2122,
        U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

@font-face {
    font-family: "Montserrat";
    font-style: normal;
    font-weight: 300;
    font-display: swap;
    src: url("../fonts/JTUSjIg1_i6t8kCHKm459Wlhyw.woff2") format("woff2");
    unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA,
        U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+2074, U+20AC, U+2122,
        U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

@font-face {
    font-family: "Montserrat";
    font-style: normal;
    font-weight: 400;
    font-display: swap;
    src: url("../fonts/JTUSjIg1_i6t8kCHKm459Wlhyw.woff2") format("woff2");
    unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA,
        U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+2074, U+20AC, U+2122,
        U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

@font-face {
    font-family: "Montserrat";
    font-style: normal;
    font-weight: 500;
    font-display: swap;
    src: url("../fonts/JTUSjIg1_i6t8kCHKm459Wlhyw.woff2") format("woff2");
    unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA,
        U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+2074, U+20AC, U+2122,
        U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

@font-face {
    font-family: "Montserrat";
    font-style: normal;
    font-weight: 600;
    font-display: swap;
    src: url("../fonts/JTUSjIg1_i6t8kCHKm459Wlhyw.woff2") format("woff2");
    unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA,
        U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+2074, U+20AC, U+2122,
        U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

@font-face {
    font-family: "Montserrat";
    font-style: normal;
    font-weight: 700;
    font-display: swap;
    src: url("../fonts/JTUSjIg1_i6t8kCHKm459Wlhyw.woff2") format("woff2");
    unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA,
        U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+2074, U+20AC, U+2122,
        U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

@font-face {
    font-family: "Montserrat";
    font-style: normal;
    font-weight: 800;
    font-display: swap;
    src: url("../fonts/JTUSjIg1_i6t8kCHKm459Wlhyw.woff2") format("woff2");
    unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA,
        U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+2074, U+20AC, U+2122,
        U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

@font-face {
    font-family: "Montserrat";
    font-style: normal;
    font-weight: 900;
    font-display: swap;
    src: url("../fonts/JTUSjIg1_i6t8kCHKm459Wlhyw.woff2") format("woff2");
    unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA,
        U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+2074, U+20AC, U+2122,
        U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

.theme-scrollbar-horizontal {
    overflow-x: auto;
    overflow-y: hidden;
    padding-bottom: 0;
}

.theme-scrollbar-horizontal::-webkit-scrollbar {
    height: 6px;
}

.theme-scrollbar-horizontal::-webkit-scrollbar-track {
    border-radius: 3px;
    -webkit-box-shadow: none;
}

.theme-scrollbar-horizontal::-webkit-scrollbar-thumb {
    border-radius: 3px;
    background-color: #eeeeee;
}

.theme-scrollbar-horizontal::-webkit-scrollbar:vertical {
    display: none;
}

.bg-navy {
    background-color: #5b67c7 !important;
}

.bg-aqua {
    background-color: #5eaebc !important;
}

.bg-purple {
    background-color: #b45fa3 !important;
}

.bg-green-sea {
    background-color: #62b686 !important;
}

.bg-cherry-red {
    background-color: #bb5f5f !important;
}

.bg-gold {
    background-color: #bb965f !important;
}

.bg-gray {
    background-color: #eeeeee !important;
}

.slide-card .card {
    flex: 0 0 auto;
}

.form-group {
    position: relative;
    margin-bottom: 24px;
}

.form-group label.error {
    bottom: -20px;
    left: 0;
    font-size: 11px;
}

.sticky-table-header tr th {
    position: sticky;
    top: 0;
    z-index: 9;
}

.user-name-latter {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    height: 100%;
    border-radius: 50%;
    font-weight: 700;
    font-size: 1.5rem;
    text-transform: uppercase;
}

.avatar {
    flex-shrink: 0;
}

.avatar-xxs {
    width: 1.2rem;
    height: 1.2rem;
}

.avatar-sm {
    width: 2rem;
    height: 2rem;
}

.avatar-md {
    width: 3rem;
    height: 3rem;
}

.avatar-lg {
    width: 4rem;
    height: 4rem;
}

.avatar-xxl {
    width: 6rem;
    height: 6rem;
}

.latter-a {
    background-color: #fad3d7;
    color: #e52335;
}

.latter-b {
    background-color: #d1eaf0;
    color: #1a95b6;
}

.latter-c {
    background-color: #f4d2d8;
    color: #c81f3c;
}

.latter-d {
    background-color: #fff7df;
    color: #fdd960;
}

.latter-e {
    background-color: #def3e4;
    color: #5cc17a;
}

.latter-f {
    background-color: #e6d1d2;
    color: #83171d;
}

.latter-g {
    background-color: #f9ecd3;
    color: #e39f23;
}

.latter-h {
    background-color: #dcdded;
    color: #5253a5;
}

.latter-i {
    background-color: #cedae1;
    color: #084469;
}

.latter-j {
    background-color: #d0eee1;
    color: #15a96b;
}

.latter-k {
    background-color: #dbf1db;
    color: #49b94a;
}

.latter-l {
    background-color: #ede6f1;
    color: #a581bb;
}

.latter-m {
    background-color: #f2ddec;
    color: #bc54a1;
}

.latter-n {
    background-color: #d4d4e3;
    color: #262a73;
}

.latter-o {
    background-color: #f5e4d4;
    color: #cf7926;
}

.latter-p {
    background-color: #f6ecee;
    color: #d4a1ab;
}

.latter-q {
    background-color: #e2e1df;
    color: #6f6961;
}

.latter-r {
    background-color: #d7f2f4;
    color: #35c0c6;
}

.latter-s {
    background-color: #fee8e2;
    color: #f98b6e;
}

.latter-t {
    background-color: #f6f0e9;
    color: #d1b38f;
}

.latter-u {
    background-color: #d5d5e6;
    color: #2c2f80;
}

.latter-v {
    background-color: #e2dcec;
    color: #6f4f9e;
}

.latter-w {
    background-color: #e9ddee;
    color: #9155aa;
}

.latter-x {
    background-color: #f9f8dc;
    color: #e0de52;
}

.latter-y {
    background-color: #dbf6e9;
    color: #4ad290;
}

.latter-z {
    background-color: #dcdfd4;
    color: #4e6128;
}

.btn.btn-icon {
    width: calc(2.2546875rem + 4px);
    height: calc(2.2546875rem + 4px);
}

.btn.btn-bg-white:hover {
    background-color: #eeeeee;
}

.btn-transparent {
    background-color: transparent !important;
    color: #727272 !important;
}

.btn-transparent:hover {
    background-color: #3673d7 !important;
    color: #fff !important;
}

.tag-list {
    display: flex;
    gap: 0.5rem;
    flex-wrap: wrap;
}

.tag {
    display: flex;
    align-items: center;
    background-color: #deeafd;
    color: #3673d7;
    padding: 4px 8px;
    border-radius: 4px;
    font-size: 12px;
    line-height: 16px;
    font-weight: 600;
    width: fit-content;
}

.tag.tag-warning {
    background-color: #fff5ec !important;
    color: #ff9f43 !important;
}

.tag.tag-info {
    background-color: #dffcff;
    color: #39dbea;
}

.tag.tag-danger {
    background-color: #f1d5d5;
    color: #dc4646;
}

.tag.tag-dark {
    background-color: #cacaca;
    color: #303030;
}

.tag-success {
    background-color: #dff7e9 !important;
    color: #00ab41 !important;
}

.tag.tag-travelling {
    background-color: #ffeadd;
    color: #ff6b08;
}

.tag.tag-stationery {
    background-color: #f6f6d1;
    color: #7f7f00;
}

.tag.tag-food {
    background-color: #eaeaff;
    color: #4d4dff;
}

.tag.tag-resigned {
    /* background-color: #ffd8d8; */
    /* color: #ff0000; */
}

.tag-sm {
    padding: 0.125rem 0.5rem;
    font-size: 9px;
}

.tag.tag-xs {
    width: 16px;
    height: 16px;
    padding: 0;
    text-align: center;
    font-size: 9px;
}

.tag-rounded>div b:last-child {
    margin-bottom: 0;
}

.tag.tag-gray {
    background-color: #eeeeee;
    color: #636e72;
}

.tag-icon {
    border-right: 1px solid;
}

.tag-icon svg {
    width: 16px;
    height: 16px;
    display: block;
}

.tag.tag-gray {
    background-color: #eeeeee;
    color: #636e72;
}

.tag .tag-icon {
    border-color: #3673d780;
}

.tag-gray .tag-icon {
    border-color: #7c7c7c80;
}

.tag-rounded-wrapper {
    margin-bottom: 0.5rem;
}

.tag-rounded-wrapper:last-child {
    margin-bottom: 0;
}

.tag-rounded-wrapper {
    display: flex;
    gap: 0.5rem;
    flex-wrap: wrap;
}

.tag-rounded-wrapper button {
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box !important;
    -webkit-line-clamp: 2;
    line-clamp: 2;
    -webkit-box-orient: vertical;
}

.tag-rounded {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    background-color: #fff;
    border-radius: 2rem;
}

.tag-rounded.tag-rounded-gray {
    background-color: #f2f2f2;
}

.tag-rounded>div {
    padding: 4px 12px 4px 0;
    color: #202020;
    font-weight: 500;
    font-size: 13px;
    line-height: 13px;
    /* display: -webkit-box; */
    /* -webkit-line-clamp: 1; */
    /* -webkit-box-orient: vertical; */
    /* overflow: hidden; */
}

.tag-rounded-gray img {
    border: 1px solid #f5f5f5;
}

.tag-rounded-white img {
    border: 1px solid #ffffff;
}

.tag-rounded>div b {
    display: block;
    font-weight: 600;
    line-height: 1;
    margin-bottom: 3px;
}

.theme-tag {
    color: #fff;
    display: flex;
    align-items: center;
    border-radius: 6px;
    width: fit-content;
    justify-content: center;
    text-align: center;
    min-width: 24px;
    line-height: 24px;
}

.theme-tag i {
    padding: 2px;
    border-radius: 6px;
    border: 1px solid;
    font-size: 16px;
    width: 24px;
    height: 24px;
    text-align: center;
}

.theme-tag .theme-tag-icon {
    line-height: 22px;
    min-width: 24px;
    text-align: center;
    font-weight: 800;
    border-radius: 6px;
    border: 1px solid;
}

.theme-tag svg {
    padding: 2px;
    border-radius: 6px;
    width: 24px;
    height: 24px;
}

.theme-date-list {
    display: flex;
    gap: 0.5rem;
    align-items: center;
}

.report-theme-date-list {
    display: flex;
    gap: -0.5rem;
    align-items: center;
}

.theme-tag span {
    font-size: 13px;
    padding: 0 6px;
    font-weight: 600;
}

.theme-date {
    background-color: #f2f2f2;
    display: inline-block;
    border-radius: 0.25rem;
    color: #7c7c7c;
    min-width: 50px;
}

.report-theme-date {
    background-color: #fff;
    display: inline-block;
    border-radius: 0.25rem;
    color: #474747;
    min-width: 50px;
}

.request_date_sections {
    padding: 7px 7px;
    box-shadow: 2px 2px 15px lightgray;
    border-radius: 5px;
}

.theme-date.theme-white-date {
    background-color: #ffffff;
    color: #202020;
}

.theme-primary-date {
    background-color: #deeafd;
    color: #3673d7;
}

.theme-date.theme-primary-date .theme-date-footer {
    border-top: 1px solid rgb(54 115 215 / 50%);
}

.theme-date-content {
    padding: 3px 4px;
    text-align: center;
}

.report-theme-date-content {
    padding: 3px 4px;
    text-align: center;
}

.theme-date-content small {
    display: block;
    text-transform: uppercase;
    font-weight: 600;
    font-size: 9px;
    line-height: 12px;
    margin-bottom: 0px;
}

.report-theme-date-content small {
    display: block;
    text-transform: uppercase;
    font-weight: 600;
    font-size: 9px;
    line-height: 12px;
    margin-bottom: 0px;
}

.theme-date-content span {
    font-size: 16px;
    line-height: 19px;
    font-weight: 700;
    display: block;
}

.report-theme-date-content span {
    font-size: 16px;
    line-height: 19px;
    font-weight: 700;
    display: block;
}

.theme-date-footer {
    display: block;
    font-weight: 600;
    font-size: 11px;
    line-height: 11px;
    border-top: 1px solid rgb(124 124 124 / 50%);
    padding: 3px 4px;
    text-align: center;
}

.report-theme-date-footer {
    display: block;
    font-weight: 600;
    font-size: 11px;
    line-height: 11px;
    border-top: 1px solid rgb(124 124 124 / 50%);
    padding: 3px 4px;
    text-align: center;
}

.theme-date-footer.theme-date-footer-time {
    font-size: 10px;
}
.report-theme-date-footer.report-theme-date-footer-time {
    font-size: 10px;
}

.theme-date.theme-success-date {
    background-color: #e6f2eb;
    color: #027f3a;
}

.theme-date.theme-success-date .theme-date-footer {
    border-top: 1px solid rgb(2 127 58 / 50%);
}

.theme-date.theme-danger-date {
    background-color: #ffe4e4;
    color: #cd0606;
    border: 0.5px solid #ffc4c4;
}

.theme-date.theme-danger-date .theme-date-footer {
    border-top: 1px solid rgb(205 6 6 / 50%);
    color: #cd0606;
}

.theme-date-content.theme-danger-date span {
    color: #cd0606;
}

.bg-whisper .report-dashborad-item.dashboard-item > span {
    background-color: #dfdce8;
}

.table tr th {
    background-color: #e4f1fe;
    padding: 8px 16px !important;
}

.table tr th:first-child {
    /* border-radius: 6px 0 0 0; */
}

.table tr th:last-child {
    /* border-radius: 0 6px 0 0; */
}

.table tr td {
    padding: 8px 16px !important;
}

.table tbody tr {
    border-bottom: 1px solid #eff2f5;
}

.sticky-table-header tr th {
    position: -webkit-sticky;
    position: sticky;
    top: 0;
    z-index: 9;
}

.sticky-table-header tr:nth-child(2) th {
    top: 35px;
}

.dropdown.multiple-dropdown .dropdown-menu {
    min-width: 400px;
    background-color: rgb(255 255 255 / 80%);
    -webkit-backdrop-filter: blur(5px);
    backdrop-filter: blur(5px);
}

.dropdown-item {
    font-weight: 500;
    color: #555555;
    font-size: 14px;
    border-radius: 4px;
    padding: 4px 8px;
}

.dropdown-menu {
    box-shadow: 0 0.25rem 1rem rgba(165, 163, 174, 0.45);
}

.dropdown-item:hover {
    background-color: #deeafd;
    color: #3673d7;
}

.rounded-top {
    border-top-left-radius: 0.375rem !important;
    border-top-right-radius: 0.375rem !important;
}

.rounded-bottom {
    border-bottom-right-radius: 0.375rem !important;
    border-bottom-left-radius: 0.375rem !important;
}

.rounded-top-left-0 {
    border-top-left-radius: 0 !important;
}

.rounded-top-right-0 {
    border-top-right-radius: 0 !important;
}

.rounded-bottom-left-0 {
    border-bottom-left-radius: 0 !important;
}

.rounded-bottom-right-0 {
    border-bottom-right-radius: 0 !important;
}

.rounded-top-left-1 {
    border-top-left-radius: 0.375rem !important;
}

.rounded-top-right-1 {
    border-top-right-radius: 0.375rem !important;
}

.rounded-bottom-left-1 {
    border-bottom-left-radius: 0.375rem !important;
}

.rounded-bottom-right-1 {
    border-bottom-right-radius: 0.375rem !important;
}

.form-label {
    font-size: 13px;
    margin-bottom: 2px;
    color: #555555;
}

.badge.badge-sm {
    padding: 3px 6px;
    font-size: 10px;
    line-height: 11px;
}

.badge-present {
    color: #ffffff;
    background-color: #00b894;
}

.badge-sick {
    color: #ffffff;
    background-color: #e84392;
}

.badge-casual {
    color: #ffffff;
    background-color: #6d5ce8;
}

.badge-earned {
    color: #ffffff;
    background-color: #00cec9;
}

.badge-sat-off {
    color: #ffffff;
    background-color: #e27055;
}

.badge-loyalty {
    color: #ffffff;
    background-color: #fdca6e;
}

.badge-holiday {
    color: #ffffff;
    background-color: #3573d6;
}

.badge-week-off {
    color: #ffffff;
    background-color: #2c3436;
}

.badge-comp-off {
    color: #ffffff;
    background-color: #357486;
}

.badge-absent {
    color: #ffffff;
    background-color: #d63030;
}

.badge-loss-of-pay {
    color: #ffffff;
    background-color: #ff7674;
}

.badge-no-data {
    color: #555555;
    background-color: #dee6e9;
}

.theme-tag-sick {
    background-color: #ffe2f0;
}

.theme-tag-sick i,
.theme-tag-sick svg,
.theme-tag-sick .theme-tag-icon {
    background-color: #e84392;
    border-color: #f0b5d1;
    color: #ffe2f0;
}

.theme-tag-sick span {
    color: #e84392;
}

.theme-tag-casual {
    background-color: #f1efff;
}

.theme-tag-casual i,
.theme-tag-casual svg,
.theme-tag-casual .theme-tag-icon {
    background-color: #6d5ce8;
    border-color: #d9d5f5;
    color: #f1efff;
}

.theme-tag-casual span {
    color: #6d5ce8;
}

.theme-tag-earned {
    background-color: #dcfbfb;
}

.theme-tag-earned i,
.theme-tag-earned svg,
.theme-tag-earned .theme-tag-icon {
    background-color: #00cec9;
    border-color: #b7f7f7;
    color: #dcfbfb;
}

.theme-tag-earned span {
    color: #00cec9;
}

.theme-tag-sat-off {
    background-color: #ffeae5;
}

.theme-tag-sat-off i,
.theme-tag-sat-off svg,
.theme-tag-sat-off .theme-tag-icon {
    background-color: #e27055;
    border-color: #fdd4ca;
    color: #ffeae5;
}

.theme-tag-sat-off span {
    color: #e27055;
}

.theme-tag-loyalty {
    background-color: #fff7e8;
}

.theme-tag-loyalty i,
.theme-tag-loyalty svg,
.theme-tag-loyalty .theme-tag-icon {
    background-color: #fdca6e;
    border-color: #fff0d4;
    color: #fff7e8;
}

.theme-tag-loyalty span {
    color: #fdca6e;
}

.theme-tag-comp-off {
    background-color: #dcf6fd;
}

.theme-tag-comp-off i,
.theme-tag-comp-off svg,
.theme-tag-comp-off .theme-tag-icon {
    background-color: #357486;
    border-color: #c3eefa;
    color: #dcf6fd;
}

.theme-tag-comp-off span {
    color: #357486;
}

.theme-tag-loss-of-pay {
    background-color: #ffeceb;
}

.theme-tag-loss-of-pay i,
.theme-tag-loss-of-pay svg,
.theme-tag-loss-of-pay .theme-tag-icon {
    background-color: #ff7674;
    border-color: #ffcecb;
    color: #ffeceb;
}

.theme-tag-loss-of-pay span {
    color: #ff7674;
}

.splide__pagination {
    position: static;
    display: flex;
    transform: none;
    width: initial;
    margin-top: 12px;
    gap: 6px;
}

.splide__pagination__page {
    position: relative;
    background-color: transparent;
    border: 1px solid #3673d7;
    width: 12px;
    height: 12px;
    margin: 0;
    opacity: 1;
}

.splide__pagination__page.is-active {
    transform: none;
    background: transparent;
    opacity: 1;
}

.splide__pagination__page:before {
    content: "";
    position: absolute;
    width: 8px;
    height: 8px;
    left: 0;
    right: 0;
    margin: 0 auto;
    top: 50%;
    border-radius: 100%;
    background-color: #3673d7;
    transform: translateY(-50%);
    transition: all 0.3s linear;
    opacity: 0;
}

.splide__pagination__page.is-active:before {
    opacity: 1;
}

.drawer-header {
    background-color: #f5f5f5 !important;
}

.drawer-close {
    cursor: pointer;
    border: 0;
    background-color: transparent;
    padding: 0;
}

.form-control {
    font-size: 14px !important;
    line-height: 22px !important;
    padding: 6px 12px !important;
}

.search-with-icon .form-control {
    padding-left: 36px !important;
}

.form-select {
    font-size: 14px !important;
    line-height: 22px !important;
    padding: 6px 12px !important;
}

.btn {
    font-size: 14px !important;
    line-height: 24px !important;
    padding: 6px 12px !important;
    /* border: 1px solid !important; */
}

.btn.btn-outline {
    padding: 5px 12px !important;
}

.btn.btn-icon {
    width: 36px !important;
    height: 36px !important;
    padding: 0 !important;
}

.btn.btn-outline.btn-outline-secondary,
.btn.btn-outline.btn-outline-secondary:hover {
    color: #555555 !important;
}

.input-with-btn .btn {
    position: absolute;
    top: 50%;
    right: 0;
    border-radius: 0 6px 6px 0;
    transform: translateY(-50%);
    -webkit-transform: translateY(-50%);
    -moz-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    -o-transform: translateY(-50%);
}

.input-with-btn .form-control {
    padding-right: 48px !important;
}

.select2-container--bootstrap5 .select2-selection--single.form-select-solid .select2-selection__placeholder {
    color: #b8b8b8;
}

.menu.export-file caption {
    padding-top: 0;
    padding-bottom: 0;
}

.export-file {
    width: initial !important;
}

.export-file .button-default {
    display: block;
}

.export-file .button-default {
    font-weight: 500;
    color: #555555;
    font-size: 14px;
    line-height: 21px;
    border-radius: 4px;
    padding: 4px 8px;
    background-color: transparent;
    border: 0;
    font-family: "Montserrat";
}

.export-file .button-default:hover {
    background-color: #deeafd;
    color: #3673d7;
}

/***End Common ***/

/***Login***/
.login-bg {
    position: absolute;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.login-logo {
    max-width: 100px;
    margin: 0 auto 24px;
    display: block;
}

.login-form-wrapper {
    position: relative;
    z-index: 9;
}

.login-form-wrapper form {
    background-color: #fff;
    padding: 24px;
    border-radius: 6px;
    width: 100%;
    min-width: 380px;
}

.login-wrapper {
    display: flex;
    height: 100vh;
    align-items: center;
    justify-content: center;
}

.login-wrapper:before {
    content: "";
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    background-color: #1e53aa;
    z-index: 1;
    opacity: 0.2;
}

/***End Login***/

/***Attendance Reports***/
.attendance-reports-table {
    height: calc(100vh - 210px);
    overflow-y: auto;
}

/***End Attendance Reports***/

/***Dashboard***/
.dashboard-item {
    border: 1px solid;
    border-radius: 4px;
    color: #fff;
    text-align: center;
}

.dashboard-item h2 {
    font-size: 36px;
    line-height: 40px;
    margin-bottom: 0;
    font-weight: 700;
    padding: 12px;
}

.dashboard-item span {
    text-transform: uppercase;
    font-weight: 300;
    display: block;
    padding: 2px 6px;
    color: #202020;
}

.bg-navy .dashboard-item {
    background-color: #5763c2;
    border-color: #545fb8;
}

.bg-navy .dashboard-item span {
    background-color: #545fb8;
}

.bg-aqua .dashboard-item {
    background-color: #57abba;
    border-color: #4ca3b3;
}

.bg-aqua .dashboard-item span {
    background-color: #4ca3b3;
}

.bg-purple .dashboard-item {
    background-color: #b05a9f;
    border-color: #ac549b;
}

.bg-purple .dashboard-item span {
    background-color: #ac549b;
}

.bg-green-sea .dashboard-item {
    background-color: #5eb282;
    border-color: #51ac78;
}

.bg-green-sea .dashboard-item span {
    background-color: #51ac78;
}

/*.birthday-card {
    background-image: url(../media/bg/birthday.svg);
    background-size: 200px;
    background-repeat: no-repeat;
    background-position: top right;
}*/
.birthday-card:before {
    content: "";
    position: absolute;
    top: 0;
    right: 0;
    width: 120px;
    height: 67px;
    z-index: 1;
    background-image: url(../media/bg/birthday.svg);
    background-size: 110px;
    background-repeat: no-repeat;
    background-position: top right;
}

/*.anniversary-card {
    background-image: url(../media/bg/anniversary.svg);
    background-size: 340px;
    background-position: 90% 10px;
    background-repeat: no-repeat;
}*/
.anniversary-card:before {
    content: "";
    position: absolute;
    top: 0;
    right: 0;
    width: 120px;
    height: 67px;
    z-index: 1;
    background-image: url(../media/bg/anniversary.svg);
    background-size: 110px;
    background-repeat: no-repeat;
    background-position: top right;
}

.birthday-card .card {
    background-color: rgb(212 227 226 / 90%);
    border: 1px solid rgb(205 221 220 / 90%);
}

.anniversary-card .card {
    background-color: rgb(235 225 248 / 90%);
    border: 1px solid rgb(228 217 242 / 90%);
}

.bg-pearl-bush {
    background-color: #ede7e1 !important;
}

.bg-pearl-bush .dashboard-item {
    background-color: #eae1d9;
    border-color: #ded3ca;
}

.bg-pearl-bush .dashboard-item > span,
.bg-pearl-bush .dashboard-item > a > span {
    background-color: #ded3ca;
}

.bg-cruise {
    background-color: #bae4e5 !important;
}

.bg-cruise .dashboard-item {
    background-color: #afdfe0;
    border-color: #a3d9da;
}

.bg-cruise .dashboard-item span {
    background-color: #a3d9da;
}

.bg-athens-gray {
    background-color: #efeff0 !important;
}

.bg-athens-gray .dashboard-item {
    background-color: #e9e9eb;
    border-color: #e1e1e5;
}

.bg-athens-gray .dashboard-item span {
    background-color: #e1e1e5;
}

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

.bg-catskill-white .dashboard-item {
    background-color: #ebf1f3;
    border-color: #dfe9ed;
}

.bg-catskill-white .dashboard-item span {
    background-color: #dfe9ed;
}

.bg-plain-and-simple {
    background-color: #eaf2d7 !important;
}

.bg-plain-and-simple .dashboard-item {
    background-color: #e4edcf;
    border-color: #dde7c7;
}

.bg-plain-and-simple .dashboard-item span {
    background-color: #dde7c7;
}

.bg-sweetly {
    background-color: #fbe7ef !important;
}

.bg-sweetly .dashboard-item {
    background-color: #f7e2ea;
    border-color: #f2d9e3;
}

.bg-sweetly .dashboard-item span {
    background-color: #f2d9e3;
}

.bg-sauvignon {
    background-color: #f6efe9 !important;
}

.bg-sauvignon .dashboard-item {
    background-color: #f2eae3;
    border-color: #e8e0d8;
}

.bg-sauvignon .dashboard-item span {
    background-color: #e8e0d8;
}

.bg-lavender-grey {
    background-color: #f6efe9 !important;
}

.bg-lavender-grey .dashboard-item {
    background-color: #f3ebe5;
    border-color: #ebe2dc;
}

.bg-lavender-grey .dashboard-item span {
    background-color: #ebe2dc;
}

.bg-whisper {
    background-color: #eeecf3 !important;
}

.bg-whisper .dashboard-item {
    background-color: #e8e6ef;
    border-color: #dfdce8;
}

.bg-whisper .dashboard-item > span,
.bg-whisper .dashboard-item > a > span {
    background-color: #dfdce8;
}

.bg-hint-of-red {
    background-color: #f4efef !important;
}

.attendance-report-slider{
    border: 1px solid #dfdce8;
    border-radius: 6px;
}

.request_card.request-report-slider {
    border: 1px solid #ded3ca;
    border-radius: 6px;
}

.leave-report-slider {
    border: 1px solid #d4e3f2;
    border-radius: 6px;
}

.bg-hint-of-red .dashboard-item {
    background-color: #f2ebeb;
    border-color: #ebe1e1;
}

.bg-hint-of-red .dashboard-item span {
    background-color: #ebe1e1;
}

.bg-geyser {
    background-color: #dae7e6 !important;
}

.bg-geyser .dashboard-item {
    background-color: #d4e3e2;
    border-color: #cddddc;
}

.bg-geyser .dashboard-item span {
    background-color: #cddddc;
}

.bg-iron {
    background-color: #dadfe1 !important;
}

.bg-iron .dashboard-item {
    background-color: #d4dadd;
    border-color: #cfd6da;
}

.bg-iron .dashboard-item span {
    background-color: #cfd6da;
}

.bg-mystic {
    background-color: #e8ecf1 !important;
}

.bg-mystic .dashboard-item {
    background-color: #e2e7ed;
    border-color: #dbe1e8;
}

.bg-mystic .dashboard-item span {
    background-color: #e8ecf1;
}

.bg-gin-fizz {
    background-color: #fff9de !important;
}

.bg-gin-fizz .dashboard-item {
    background-color: #faf4d9;
    border-color: #f0eacf;
}

.bg-gin-fizz .dashboard-item span {
    background-color: #f0eacf;
}

.bg-alice-blue {
    background-color: #e4f1fe !important;
}

.bg-alice-blue .dashboard-item {
    background-color: #dceaf8;
    border-color: #d4e3f2;
}

.bg-alice-blue .dashboard-item > span,
.bg-alice-blue .dashboard-item > a > span {
    background-color: #d4e3f2;
}

.bg-riptide {
    background-color: #86e2d5 !important;
}

.bg-riptide .dashboard-item {
    background-color: #81ddd0;
    border-color: #7ad3c7;
}

.bg-riptide .dashboard-item span {
    background-color: #7ad3c7;
}

.bg-humming-bird {
    background-color: #c5eff7 !important;
}

.bg-humming-bird .dashboard-item {
    background-color: #c0ebf3;
    border-color: #b7e2ea;
}

.bg-humming-bird .dashboard-item span {
    background-color: #b7e2ea;
}

.bg-magnolia {
    background-color: #f1e7fe !important;
}

.bg-magnolia .dashboard-item {
    background-color: #ebe1f8;
    border-color: #e4d9f2;
}

.bg-magnolia .dashboard-item span {
    background-color: #e4d9f2;
}

.bg-cape-honey {
    background-color: #fde3a7 !important;
}

.bg-cape-honey .dashboard-item {
    background-color: #f7dda1;
    border-color: #efd498;
}

.bg-cape-honey .dashboard-item span {
    background-color: #efd498;
}

.bg-magic-mint {
    background-color: #b7f4d8 !important;
}

.bg-magic-mint .dashboard-item {
    background-color: #aeedd0;
    border-color: #a5e7c8;
}

.bg-magic-mint .dashboard-item span {
    background-color: #a5e7c8;
}

/***End Dashboard***/

.probation_employee {
    background-color: #dff7e9 !important;
    color: #00ab41 !important;
}

#append_resignation_letter {
    display: flex;
    align-items: end;
    justify-content: end;
    height: 1px;
    margin-bottom: 3px;
}

#append_exit_interview_pdf {
    display: flex;
    align-items: end;
    justify-content: end;
    height: 1px;
    margin-bottom: 3px;

}

.loader {
    border: 4px solid #f3f3f3;
    border-radius: 50%;
    border-top: 4px solid #3498db;
    width: 16px;
    height: 16px;
    animation: spin 1s linear infinite;
    position: absolute;
    top: 50%;
    right: 10px;
    /* Adjust this according to your dropdown layout */
    margin-top: -10px;
    display: none;
    /* Initially hide the loader */
}

@keyframes spin {
    0% {
        transform: rotate(0deg);
    }

    100% {
        transform: rotate(360deg);
    }
}

.fakeGPScheckout {
    border: 1px solid red !important;
}

.fakeGPScheckin {
    border: 1px solid #ffc700 !important;
}

.reset_organization_name_append {
    margin-right: 25px !important;
    font-weight: 600 !important;
    cursor: unset;
    pointer-events: none
}

.reset_organization_name_append:hover {
    background-color: #deeafd;
    color: #3673d7;
}

.loginrole-detail .select2-selection.select2-selection--single {
    border: 0;
    padding: 0 !important;
}

.note-details {
    margin: 18px 0 0;
    background-color: #ffff;
    padding: 5px 8px;
    border-radius: 5px;
}

.theme-tag.report-theme-tag.theme-tag-attendance-in {
    background-color: white;
    color: #6d5ce8;
}

.report-theme-tag.theme-tag-attendance-in small {
    background-color: #7567d9;
    border-radius: 4px;
    width: 22px;
    height: 22px;
    font-size: 17px;
    font-weight: 600;
    line-height: 24px;
    color: white;
}

.theme-tag.report-theme-tag.theme-tag-attendance-out {
    background-color: white;
    color: #ff7674;
}

.report-theme-tag.theme-tag-attendance-out small {
    background-color: #ff7674;
    border-radius: 4px;
    width: 22px;
    height: 22px;
    font-size: 14px;
    font-weight: 600;
    line-height: 22px;
    color: white;
}
input#map_address {
    margin-right: 17px !important;
}
.theme-tag-fullday{
    background-color: #00cec9;
    border-color: #b7f7f7;
    color: #dcfbfb;
}

.theme-tag-halfday{
    background-color: #357486;
    border-color: #c3eefa;
    color: #dcf6fd;
}
.theme-tag-absentday{
    background-color: #ff7674;
    border-color: #ffcecb;
    color: #ffeceb;
}
.theme-tag-holiday{
    background-color: #0b83d9;
    border-color: #d9d5f5;
    color: #f1efff;
}


.theme-tag-leave{
    background-color: #fdca6e;
    border-color: #fff0d4;
    color: #fff7e8;
}

.theme-tag-total-present-day{
    background-color: #e84392;
    border-color: #f0b5d1;
    color: #ffe2f0;
}
.theme-tag-total-day{
    background-color: #e88843;
    border-color: #ecb769;
    color: #f0cd99;
}
.theme-tag-sunday{
    background-color: #10100f;
    border-color: #575654;
    color: #e1ded8;
}
.view-log .btn svg {
    width: 20px !important;
    height: 20px !important;
    color: #323232;
    transition: all 0.3s linear;
    margin-bottom: 5px !important;
}
a.btn-view-leave-log.btn.btn-sm {
    color: #52d1d5 !important;
}