.color-picker:not(.no-show){
    display: flex;
}
.ScMan-ShiftsBar {
    background-color: white;
}

div.schedule-template-btn {
    padding-top: 50px;
    padding-bottom: 80px;
    background-color: white;
    color: #0099da;
    font-size: 2em;
    vertical-align: middle;
    text-align: center;
    border-radius: 20px;
    border: 5px solid #0099da;
    display: grid;
    height: 200px;
}

    div.schedule-template-btn:hover {
        cursor: pointer;
        background-color: #0099da;
        color: white;
    }

div.schedule-template-btn-mini {
    background-color: white;
    color: #0099da;
    border-radius: 10px;
    border: 5px solid #0099da;
    padding-top: 3px;
    padding-bottom: 3px;
    cursor: pointer;
}

table.schedule-table {
    width: 100%;
}

    table.schedule-table thead tr th {
        background-color: #e0e0e0;
        text-align: center;
    }

    table.schedule-table.week-list thead tr th:not(:first-child) {
        width: 200px;
    }

    table.schedule-table.week-list tbody tr th.sticky-th {
        min-width: 230px;
        width: 230px;
    }

    table.schedule-table.day-list thead tr th:first-child {
        min-width: 250px;
    }

    table.schedule-table.day-list thead tr th:not(:first-child), table.schedule-table.day-list tbody tr td:not(:first-child) {
        width: 60px;
    }

    table.schedule-table thead {
        border-bottom: 1px solid #0099da;
    }

    table.schedule-table tbody tr td {
        padding: 5px;
    }

        table.schedule-table tbody tr td.schedule-hour {
            padding-left: 0px;
            padding-right: 0px;
        }


i.schedule-i-setting {
    color: #0099da;
}

i.selected-setting {
    color: #CF5300;
}


.schedule-parent {
    position: relative;
}

.schedule-hover-options {
    position: absolute;
    top: -5px;
    left: -5px;
    z-index: 99999;
}

    .schedule-hover-options a.schedule-hover-option,
    .schedule-hover-options a.schedule-hover-option,
    .schedule-hover-options a.schedule-hover-option {
        display: none;
        font-size: 3em;
    }

table.schedule-table thead tr th.show-options .schedule-hover-options a.schedule-hover-option:not(.has-copy-visible),
table.schedule-table thead tr th:hover .schedule-hover-options a.schedule-hover-option:not(.has-copy-visible),
div.month-list-day:hover div.schedule-hover-options a.schedule-hover-option:not(.has-copy-visible),
table.schedule-table thead tr th.show-options.has-copy .schedule-hover-options a.schedule-hover-option.has-copy-visible,
table.schedule-table thead tr th.has-copy:hover .schedule-hover-options a.schedule-hover-option.has-copy-visible {
    display: inline-block;
}



div.schedule-options, div.schedule-hover-options {
    text-align: center;
}

    div.schedule-options a:not(.close-options), div.schedule-hover-options a {
        font-size: 3em;
        margin: 5px;
        color: #0099da;
    }

table.schedule-table tbody tr td:hover .schedule-hover-options a.schedule-hover-option:not(.no-show):not(.has-copy-visible) {
    display: inline-block;
}

table.schedule-table tbody tr td:hover {
    cursor: pointer;
}

table.schedule-table tbody tr td div.scheduleDiv:not(:first-child), div.month-list-day div.scheduleDiv:not(:first-child) {
    margin-top: 5px;
}

.schedule-detail-view {
    background-color: rgba(95, 158, 160,0.8);
    position: relative;
}

.schedule-parent .mini-schedule:not(:first-child) {
    margin-top: 5px;
}

.schedule-parent .schedule-detail:not(:first-child) {
    margin-top: 5px;
}



div.scheduleDiv {
    padding: 10px;
    color: white;
    font-weight: bold;
}

div.scheduleDiv1 {
    background: burlywood;
}

div.assignmentDiv .btn-group {
    width: 100%;
    background: none;
    border-radius: 1px;
    text-align: center;
    border-radius: 2px;
    padding: 0px;
    margin: 0px;
    height: auto;
    min-width: 20px !important;
}

div.assignmentDiv {
    overflow: hidden;
    flex: 1;
    flex-wrap: nowrap;
}

    div.assignmentDiv .btn-group button.multiselect {
        width: 100%;
        background-color: transparent;
        color: inherit;
        border: none;
        box-shadow: none;
        -moz-box-shadow: none;
        -webkit-box-shadow: none;
        padding: 0px;
        min-height: 0px;
        margin: 0px;
        background-image: none;
    }
        div.assignmentDiv .btn-group button.multiselect .multiselect-selected-text {
            font-weight: 600;
            font-size: 0.9em;
            color: inherit;
            max-width: 100%;
            display: block;
            text-overflow: ellipsis;
            overflow: hidden;
            filter: brightness(60%);
        }

    div.assignmentDiv .btn-group .dropdown-menu li label {
        text-align: left;
    }

    div.assignmentDiv .btn-group .caret {
        display: none;
    }

div.shiftDiv {
    text-align: center;
    font-size: 0.8em;
}

a.scheduleSettings {
    position: absolute;
    top: 3px;
    left: 4px;
}


a.scheduleFlag {
    float: left;
}

.schedule-stripes {
    opacity: 0.8;
    background: repeating-linear-gradient( 125deg, rgba(0, 0, 0, 0.2), rgba(0, 0, 0, 0.2) 10px, rgba(0, 0, 0, 0.4) 10px, rgba(0, 0, 0, 0.4) 20px );

}

    div.scheduleDivStripes:hover {
        opacity: 1;
        cursor: pointer;
    }

div.scheduleName {
    font-weight: bold;
    color: #0099da;
}

a.btn.schedule-btn {
    border-color: #0099da;
    margin-left: 10px;
    color: #0099da;
}

a.schedule-btn i {
    border-color: #0099da;
    color: #0099da;
}

    a.btn.schedule-btn span.btn-label {
        background: white;
    }

a.btn.schedule-btn-save-publish, a.btn.schedule-btn-save-publish span.btn-label {
    color: white;
    font-weight: bold;
    background-color: #468847;
    border-color: #468847;
}

a.schedule-btn-save-publish i {
    color: white;
}

a.btn.schedule-btn-save-delete, a.schedule-btn-save-delete i {
    color: rgb(169, 3, 41);
    border-color: rgb(169, 3, 41);
}

div.scheduleDiv:hover {
    cursor: move;
}

div.scheduleDiv.locked:hover {
    cursor: not-allowed;
}

.schedule-day-drop, .shift-drop {
    opacity: 0.2 !important;
    background-color: rgb(124,252,0) !important;
}


.schedule-hour.schedule-day-drop {
    opacity: 1;
}

div.minute-60 {
    position: relative;
}



table {
    -webkit-touch-callout: none; /* iOS Safari */
    -webkit-user-select: none; /* Safari */
    -khtml-user-select: none; /* Konqueror HTML */
    -moz-user-select: none; /* Old versions of Firefox */
    -ms-user-select: none; /* Internet Explorer/Edge */
    user-select: none; /* Non-prefixed version, currently
                                  supported by Chrome, Opera and Firefox */
}

    table.schedule-table thead th {
        position: -webkit-sticky; /* for Safari */
        position: sticky;
        top: 0;
    }

    table.schedule-table tfoot th {
        position: -webkit-sticky; /* for Safari */
        position: sticky;
        bottom: 0px;
        background-color: rgba(224, 224, 224, 0.5);
        color: #0099da;
        text-align: center;
        z-index: 996;
    }

    table.schedule-table tbody th {
        position: -webkit-sticky; /* for Safari */
        position: sticky;
        left: 0;
    }

    table.schedule-table thead th:first-child {
        left: 0;
        z-index: 999;
    }

    table.schedule-table thead tr th, table.schedule-table tbody tr th, table.schedule-table tbody tr th.sticky-th {
        z-index: 998;
        background-color: rgba(224, 224, 224,0.5);
    }

    table.schedule-table.scrolling thead tr th, table.schedule-table.scrolling tbody tr th, table.schedule-table.scrolling tbody tr th.sticky-th {
        opacity: 0.7;
    }

    table.schedule-table thead tr th:hover, table.schedule-table tbody tr th:hover, table.schedule-table tbody tr th.sticky-th:hover {
        opacity: 1;
    }

    table.schedule-table table {
        border-collapse: collapse;
    }

div.overfow-list-div {
    width: 100%;
    max-height: 750px;
    overflow: auto;
}

div.overfow-list-div-organized {
    display: flex;
    width: 100%;
    max-height: 750px;
}

div.schedule-list-selection {
    display: block;
}

div.schedule-list-option {
    float: left;
    padding: 8px;
    margin-right: 5px;
    border: 1px solid rgba(224, 224, 224,0.5);
    opacity: 0.8;
    width: 100px;
    font-weight: bold;
}

    div.schedule-list-option.long {
        width: 160px;
    }

    div.schedule-list-option:hover, div.schedule-list-option.selected {
        opacity: 1;
        background-color: rgba(224, 224, 224, 0.5);
        cursor: pointer;
    }

div.week-list-row {
    display: flex;
    flex-direction: row;
}

div.week-list-header {
    width: 14%;
    flex-grow: 1;
    text-align: center;
    font-weight: bold;
    border: 1px solid rgb(221, 221, 221);
    height: 30px;
    font-size: 1.2em;
    vertical-align: middle;
    background-color: rgba(224, 224, 224, 0.5);
    padding-top: 5px;
}

div.month-list-day {
    width: 14%;
    flex-grow: 1;
    text-align: center;
    border: 1px solid rgba(224, 224, 224, 0.5);
    min-height: 100px;
    padding: 10px;
    padding-bottom: 20px;
    position: relative;
}

span.day-label {
    float: right;
    padding-right: 5px;
    font-weight: bold;
    font-size: 1.2em;
    color: rgb(0, 153, 218);
}

div.month-list-day.not-current span.day-label {
    color: black;
}

div.month-list-day.not-current > div {
    opacity: 0.2;
}


.schedule-time-holder {
    width: 100%;
    text-align: center;
    padding: 1px;
}


.schedule-detail-big .toggle i.pgSwitch::after {
    color: red;
}

.schedule-detail-big .toggle input:checked + i::after {
    color: green;
}

.panel .panel-heading-schedule-link:not(:first-child) {
    margin-top: 10px;
}

.panel-heading-schedule-link:hover {
    cursor: pointer;
}

.has-copy-visible:not(.has-copy-visible-close) {
    display: none;
}

.has-copy .copy-options:hover .has-copy-visible,
.has-copy .copy-options-visible .has-copy-visible,
.schedule-day:hover .hover-visible:not(.addDaysOffDet),
.schedule-hour:hover .hover-visible:not(.addDaysOffDet),
.month-list-day:hover .hover-visible:not(.addDaysOffDet) {
    display: inline-block;
}

.month-list-day:hover .hover-visible.addDaysDet {
    display: none;
}

.has-timeoff-selection .schedule-day:hover .hover-visible:not(.addDaysOffDet),
.has-timeoff-selection .schedule-hour:hover .hover-visible:not(.addDaysOffDet) {
    display: none;
}

.schedule-day-tr:hover .mini-schedule {
    z-index: 99;
}

.timeoff-match .schedule-day:hover .addDaysOffDet,
.timeoff-match .schedule-hour:hover .addDaysOffDet
.timeoff-match .schedule-hour:hover .addDaysOffDet,
.month-list-day.timeoff-match:hover .addDaysOffDet {
    display: inline-block;
}

.schedule-details {
    min-height: 20px;
    display: inline-block;
    width: 100%;
}

    .schedule-details a.mini-schedule-option {
       margin-top: 5px;
    }


.schedule-day.has-copy:hover .mini-schedule-empty .has-copy-visible,
.schedule-hour.has-copy:hover .mini-schedule-empty .has-copy-visible,
.schedule-detail-view.has-copy:hover .has-copy-visible {
    display: inline-block;
}

.schedule-day.has-copy:hover .mini-schedule-empty .mini-schedule-det,
.schedule-hour.has-copy:hover .mini-schedule-empty .mini-schedule-det,
.schedule-detail-view.has-copy:hover .mini-schedule-det {
    display: none;
}

.smart-form .toggle i.pgSwitch-mini::after {
    font-size: 0.7em;
    top: 0px;
}

.smart-form .toggle i.pgSwitch-mini::before {
    font-size: 0.3em;
    top: 2px;
    width: 8px;
    height: 8px;
}

.smart-form .toggle input:checked + i.pgSwitch-mini::before {
    right: 40px; 
}

.schedule-shift-details {
    margin-top: 7px;
}

.schedule-inline-btn:not(.no-show) {
    display: inline-block;
}

.schedule-inline-btn {
    background-color: transparent;
    color:white;
    border: none;
    width: 50px;
}

.schedule-inline-btn:hover,.schedule-inline-select:hover{
    cursor: pointer;
}

.schedule-inline-btn:focus,.schedule-inline-btn:hover,.schedule-inline-select:hover{
    background-color: white;
    color: black;
}

.schedule-inline-text:not(.no-show) {
    display: inline-block;
}

.schedule-inline-mini-btn {
    width: 20px;
}

.schedule-inline-select {
    width: 100%;
    background-color: transparent;
    border: none;
    display: inline-block;
    -webkit-appearance: none;
    -moz-appearance: none;
    -ms-appearance: none;
    -o-appearance: none;
    appearance: none;
}

.schedule-inline-select option{
    color: black;
}

.schedule-inline-select-wrapper {
    position: relative;
}
.schedule-inline-select-wrapper:after {
    font-family: FontAwesome;
    content: '\f107';
    font-size: 2em;
    position: absolute;
    top: 8px;
    right: 2px;
    color: #434B67;
    pointer-events: none;
}




div.minute-60 .mini-schedule {
    padding-bottom: 10px;
}


div.minute-60 .mini-schedule .scheduleDiv {
    height: 100%;
}

.schedule-hover-options .mini-schedule-empty.text-center {
    text-align: left !important;
}

.table-striped > tbody > tr > td.open-shift-td, th.open-shift-th {
    background-color: rgba(124,252,0,0.3) !important;
}

td.open-shift-td div.open-scheduleDay{
    min-height: 40px;
}

.helper-bubble-left:after {
    content: '';
    position: absolute;
    right: 0;
    top: 50%;
    width: 0;
    height: 0;
    border: 38px solid transparent;
    border-left-color: #00aabb;
    border-right: 0;
    margin-top: -38px;
    margin-right: -38px;
}

.helper-bubble-right:after {
    content: '';
    position: absolute;
    left: 0;
    top: 50%;
    width: 0;
    height: 0;
    border: 38px solid transparent;
    border-right-color: #00aabb;
    border-left: 0;
    margin-top: -38px;
    margin-left: -38px;
}

.helper-bubble-top:after {
    content: '';
    position: absolute;
    bottom: 0;
    left: 50%;
    width: 0;
    height: 0;
    border: 38px solid transparent;
    border-top-color: #00aabb;
    border-bottom: 0;
    margin-left: -38px;
    margin-bottom: -38px;
}

.helper-bubble-bottom:after {
    content: '';
    position: absolute;
    top: 0;
    left: 50%;
    width: 0;
    height: 0;
    border: 38px solid transparent;
    border-bottom-color: #00aabb;
    border-top: 0;
    margin-left: -38px;
    margin-top: -38px;
}

div.staffing-mini {
    border-radius: 13px;
    width: 26px;
    height: 26px;
    text-align: center;
    background-color: indianred;
    color: white;
    font-weight: bold;
    position: absolute;
    top: -10px;
    right: -10px;
    padding-top: 3px;
    font-size: 1em;
    cursor: pointer;
}

div.staffing-large {
    border-radius: 15px;
    width: 30px;
    height: 30px;
    text-align: center;
    background-color: indianred;
    color: white;
    font-weight: bold;
    position: relative;
    float: left;
    padding-top: 3px;
    font-size: 1.2em;
    cursor: pointer;
}

div.staffing-detail {
    position: absolute;
    top: 0px;
    width: 120px;
    right: 20px;
    background-color: indianred;
    padding: 8px;
    border-radius: 10px;
    z-index: 998;
}

    div.staffing-detail a:hover {
        color: white !important;
    }

div.staffing-detail-large {
    position: absolute;
    width: 120px;
    left: 50px;
    background-color: indianred;
    padding: 8px;
    border-radius: 10px;
    z-index: 99;
}

table.has-requirements tr.no-drop-match td.ui-droppable {
    background: rgba(205,92,92,0.1);
}


table.has-requirements tr.drop-match td.ui-droppable {
    background: rgba(124,252,0,0.1);
}

table.has-requirements tr.no-drop-match .schedule-day.has-copy:hover .mini-schedule-empty .has-copy-visible {
    display: none;
}

.no-drop-icon a.no-drop-icon-a {
    display: inline-block;
}

.has-requirements .drop-icon a.drop-icon-a {
    display: inline-block;
}


a.select-schedule-det {
    font-size: 3em;
    z-index: 999999;
    opacity: 0.4;
    position: absolute;
    top: 10px;
    right: 5px;
}

a.select-schedule-det.selected {
    opacity: 1;
}

    a.select-schedule-det.selected:before {
        color: green
    }

div.resize-helper-e,div.resize-helper-w {
    display: none;
    position: absolute;
    background-color: white;
    color: rgb(0, 153, 218);
    width: 60px;
    height: auto;
    font-size: 0.8em;
    text-align: center;
    top: 0px;
}

div .mini-schedule.resize-start-e div.resize-helper-e, div .mini-schedule .scheduleDivDrag div.resize-helper-e {
    display: inline-block;
    right: -60px;
}

div .mini-schedule.resize-start-w div.resize-helper-w, div .mini-schedule .scheduleDivDrag div.resize-helper-w {
    display: inline-block;
    left: -60px;
}

button.multiselect.disabled:hover {
    cursor: not-allowed;
}

.schedule-inline-btn:disabled:hover, .schedule-inline-select:disabled:hover {
    cursor: not-allowed;
}

.schedule-inline-btn:disabled:focus, .schedule-inline-btn:disabled:hover, .schedule-inline-select:disabled:hover {
    background-color: transparent;
    color: white;
}

a.btn.schedule-btn:not(.schedule-btn-save-publish).dirty, a.btn.schedule-btn:not(.schedule-btn-save-publish).dirty i {
    color: rgb(207, 83, 0);
    border-color: rgb(207, 83, 0);
}

table.dataTable tbody tr.selected-assigned-template td {
    background-color: rgba(0, 153, 218,0.5) !important;
}

table.dataTable tbody tr.deleted-assigned-template td {
    opacity: 0.5 !important;
}


tr.no-timeoff-match.has-timeoff-selection td {
    background: rgba(205,92,92,0.1) !important;
}


tr.timeoff-match.has-timeoff-selection td, .month-list-day.has-timeoff-selection {
    background: rgba(124,252,0,0.1) !important;
}

div.div-shift-published {
    width: 0px;
    height: 0px;
    position: absolute;
    bottom: 0px;
    right: 0px; 
    border-bottom: 20px solid red;
    border-left: 20px solid transparent;
}

div.div-shift-published:hover {
    cursor: pointer;
}

div.div-shift-requested {
    cursor: pointer;
    position: absolute;
    height: auto;
    background-color: indianred;
    width: 100%;
    bottom: -14px;
    left: 0px;
    padding: 4px;
    opacity: 0.8;
    border-radius: 5px;
    z-index: 99;
}

div.div-shift-requested-Approved {
    background-color: #659265;
}

div.div-shift-requested-Denied {
    background-color: red;
}

td.open-shift-request-date, td.swap-shift-request-date, .table-striped > tbody > tr:nth-child(2n+1) > td.open-shift-request-date {
    background-color: rgba(124, 252, 0, 0.3) !important;
}


a.select-open-reques-det {
    font-size: 3em;
    z-index: 9999;
    opacity: 0.4;
    position: absolute;
    top: 0px;
    right: 5px;
}

    a.select-open-reques-det.selected {
        opacity: 1;
    }

        a.select-open-reques-det.selected:before {
            color: green
        }

.shift-swap-tabs ul li a {
    opacity: 0.5;
}

.shift-swap-tabs ul li.ui-tabs-active a {
    opacity: 1;
}

.swap-summary {
    justify-content: space-between;
    height: auto;
    border: 2px solid #ddd;
    border-radius: 5px;
    box-shadow: 0 15px 15px -5px rgba(0, 0, 0, 0.2);
    display: flex;
    flex-direction: column;
}

div.swap-short-hours {
    background-color: rgb(87, 159, 251);
    color: white;
    display: initial;
    padding: 15px;
    border-radius: 12px;
    cursor: pointer;
}

tr.tr-schedule-group {
    background-color: rgba(224, 224, 224, 0.5);
    text-align: center;
    color: #0099da;
    font-weight: bold;
    font-size: 1.5em;
}

div.schedule-parent-empty-after div.mini-schedule a.pasteDaysDet {
    position: absolute;
    bottom: -5px;
    left: 0px;
    margin-right: 0px;
    z-index: 99999;
}

div.schedule-parent-empty-after div.mini-schedule a.addDaysDet {
    position: absolute;
    bottom: -5px;
    right: -10px;
    margin-right: 0px;
    z-index: 998;
}

div.add-employees {
    width: 500px;
}

tr.schedule-day-tr.hasTimeOff th.sticky-th, tr.schedule-day-tr.hasTimeOff td.schedule-hour {
    background-color: transparent !important;
}
.mini-schedule.auto-assigned-selected .auto-selected-icon-a {
    display: block !important;
}
div.eeOrganized.ui-draggable-dragging {
    width: 200px !important;
    border: 1px solid rgb(221, 221, 221);
    background: white;
    z-index: 999999;
}

    div.eeOrganized.ui-draggable-dragging .no-show-drag {
        display: none !important;
    }

div.schedule-parent.schedule-parent-not-empty:empty{
    display: none;
}

.public-schedule .scheduleDiv.schedule-detail-view {
    padding: 0px !important;
}

.public-schedule .scheduleDayRow {
    padding: 0px !important;
}

.public-schedule .schedule-parent {
    padding: 0px !important;
}

.public-schedule .employee-image {
   display: none !important;
}


.public-schedule .schedule-employee-image-row {
    display: none !important;
}

.public-schedule .scheduleName.employee-name {
    text-align: center !important;
}

.public-schedule .print-100 {
    width: 100% !important;
}

.public-schedule table.schedule-table tbody tr td {
    padding: 0px;
}

.public-schedule .assignmentDiv.schedule-detail-name .btn-group {
    margin: 0px;
    padding: 0px;
}

.public-schedule div.assignmentDiv .btn-group button.multiselect {
    margin: 0px;
    padding: 0px;
    max-width: 100%;
}

.public-schedule .sticky-th {
    padding: 0px !important;
}

.public-schedule div.staffing-mini {
    top: 0px;
    right: 0px;
}

.SchedulesFrame {
    flex-direction: column;
    align-items: center;
    overflow: hidden;
    border-radius: 8px;
    border: 1px solid #D2D5DA;
    z-index: 12;
}

    .SchedulesFrame > header {
        display: flex;
        padding: 16px 24px;
        justify-content: space-between;
        align-items: center;
        align-self: stretch;
        border-radius: 8px 8px 0px 0px;
        border-bottom: 1px solid #EEE;
        background: #FFF;
    }

        .SchedulesFrame > header > .HText > span:first-of-type {
            color: #000;
            text-align: center;
            font-family: Inter;
            font-size: 18px;
            font-style: normal;
            font-weight: 600;
            line-height: 28px;
        }

        .SchedulesFrame > header > .HText > span:last-of-type {
            color: #000;
            font-family: Inter;
            font-size: 14px;
            font-style: normal;
            font-weight: 400;
            line-height: 28px;
        }

        .SchedulesFrame > header > .HRight {
            display: flex;
            align-items: center;
            gap: 8px;
        }

            .SchedulesFrame > header > .HRight > span {
                color: #000;
                font-family: Inter;
                font-size: 16px;
                font-style: normal;
                font-weight: 500;
                line-height: normal;
            }

            .SchedulesFrame > header > .HRight > button {
                display: flex;
                width: 36px;
                height: 20px;
                justify-content: flex-end;
                align-items: center;
                border-radius: 12px;
                border: none;
                background: #0078BC;
                cursor: pointer;
                padding: 0;
            }

                .SchedulesFrame > header > .HRight > button > img {
                    width: 22px;
                    flex-shrink: 0;
                    fill: #FFF;
                    filter: drop-shadow(0px 1px 2px rgba(16, 24, 40, 0.06)) drop-shadow(0px 1px 3px rgba(16, 24, 40, 0.10));
                }

                .SchedulesFrame > header > .HRight > button.notWorkOn {
                    justify-content: flex-start !important;
                    background: #E5E5E5 !important;
                }

    .SchedulesFrame > .SchedulesBody {
        display: flex;
        align-items: flex-start;
        gap: 16px;
        max-height: 100%;
        align-self: stretch;
        background: #FFF;
        overflow: hidden;
    }

        .SchedulesFrame > .SchedulesBody > .Shifts {
            display: flex;
            padding: 16px 16px 16px 24px;
            flex-direction: column;
            align-items: flex-start;
            gap: 24px;
            align-self: stretch;
            border-radius: 8px 0px 0px 8px;
            border-right: 1px solid #E3E3E3;
            background: #F9FAFD;
            gap: 12px;
            overflow-y: scroll;
            overflow-x: hidden;
            width: 300px;
        }


            .SchedulesFrame > .SchedulesBody > .Shifts > header {
                display: flex;
                justify-content: space-between;
                align-items: center;
                align-self: stretch;
            }

                .SchedulesFrame > .SchedulesBody > .Shifts > header > span {
                    color: #000;
                    font-family: Inter;
                    font-size: 14px;
                    font-style: normal;
                    font-weight: 500;
                    line-height: normal;
                }

                .SchedulesFrame > .SchedulesBody > .Shifts > header > img {
                    display: flex;
                    padding: 4px;
                    align-items: center;
                    gap: 8px;
                    border-radius: 99px;
                    background: #0078BC;
                    cursor: pointer;
                }

            .SchedulesFrame > .SchedulesBody > .Shifts > .ShiftSegment {
                display: flex;
                padding: 16px 12px;
                flex-direction: column;
                align-items: flex-start;
                gap: 8px;
                border-radius: 8px;
                width: 100%;
                cursor: pointer;
            }


                /* Active state */
                .SchedulesFrame > .SchedulesBody > .Shifts > .ShiftSegment.active {
                    background: #E1EEFD;
                }

                /* Non-active state */
                .SchedulesFrame > .SchedulesBody > .Shifts > .ShiftSegment.inactive {
                    background: #FAFAFA;
                }

                    /* Hover effect on non-active segments */
                    .SchedulesFrame > .SchedulesBody > .Shifts > .ShiftSegment.inactive:hover {
                        background: #F1F7FE;
                    }


                .SchedulesFrame > .SchedulesBody > .Shifts > .ShiftSegment > .Flex {
                    display: flex;
                    padding: 1px 10px;
                    height: 25px;
                    justify-content: center;
                    align-items: center;
                    gap: 10px;
                    border-radius: 4px;
                    background: #F4EBFF;
                }

                .SchedulesFrame > .SchedulesBody > .Shifts > .ShiftSegment > .Potential {
                    display: flex;
                    padding: 1px 10px;
                    height: 25px;
                    justify-content: center;
                    align-items: center;
                    gap: 10px;
                    border-radius: 4px;
                    background: #FEF7DF;
                }

                .SchedulesFrame > .SchedulesBody > .Shifts > .ShiftSegment > .Flex > span {
                    color: #734CA4;
                    font-family: Inter;
                    font-size: 12px;
                    font-style: normal;
                    font-weight: 500;
                    line-height: normal;
                }

                .SchedulesFrame > .SchedulesBody > .Shifts > .ShiftSegment > .Potential > span {
                    color: #BA9514;
                    font-family: Inter;
                    font-size: 12px;
                    font-style: normal;
                    font-weight: 500;
                    line-height: normal;
                }

                .SchedulesFrame > .SchedulesBody > .Shifts > .ShiftSegment > span:first-of-type {
                    color: #000;
                    font-family: Inter;
                    font-size: 16px;
                    font-style: normal;
                    font-weight: 500;
                    line-height: 16px;
                    text-transform: capitalize;
                }

                .SchedulesFrame > .SchedulesBody > .Shifts > .ShiftSegment > span:last-of-type {
                    color: #5F5F5F;
                    font-family: Inter;
                    font-size: 14px;
                    font-style: normal;
                    font-weight: 500;
                    line-height: 16px;
                    text-transform: capitalize;
                }

        .SchedulesFrame > .SchedulesBody > .SchedulesMain {
            display: flex;
            padding: 16px 24px 16px 0px;
            flex-direction: column;
            align-items: flex-start;
            gap: 16px;
            overflow-y: scroll;
            overflow-x: hidden;
            max-height: calc(100% - 24px);
        }

           

        /* Firefox */
        .SchedulesFrame > .SchedulesBody > .SchedulesMain {
            scrollbar-width: thin; /* Makes the scrollbar thinner */
            scrollbar-color: #B8C0CC transparent; /* Thumb color and track color */
        }

            .SchedulesFrame > .SchedulesBody > .SchedulesMain > header {
                display: flex;
                justify-content: space-between;
                align-items: center;
                align-self: stretch;
            }

                .SchedulesFrame > .SchedulesBody > .SchedulesMain > header > span {
                    color: #000;
                    font-family: Inter;
                    font-size: 18px;
                    font-style: normal;
                    font-weight: 500;
                    line-height: normal;
                }

                .SchedulesFrame > .SchedulesBody > .SchedulesMain > header > .HRight {
                    display: flex;
                    align-items: center;
                    gap: 8px;
                }

                    .SchedulesFrame > .SchedulesBody > .SchedulesMain > header > .HRight > button.duplicate {
                        display: flex;
                        padding: 8px 12px;
                        justify-content: center;
                        align-items: center;
                        gap: 8px;
                        align-self: stretch;
                        border: none;
                        border-radius: 4px;
                        background: #F1F7FE;
                        cursor: pointer;
                    }

                        .SchedulesFrame > .SchedulesBody > .SchedulesMain > header > .HRight > button.duplicate > span {
                            color: #0078BC;
                            font-family: Inter;
                            font-size: 14px;
                            font-style: normal;
                            font-weight: 500;
                            line-height: normal;
                        }

                    .SchedulesFrame > .SchedulesBody > .SchedulesMain > header > .HRight > button.delete {
                        display: flex;
                        padding: 6px 10px;
                        justify-content: center;
                        align-items: center;
                        gap: 6px;
                        align-self: stretch;
                        border: none;
                        border-radius: 4px;
                        background: #FEF3F2;
                        cursor: pointer;
                    }

            .SchedulesFrame > .SchedulesBody > .SchedulesMain .ShiftDetails {
                display: flex;
                padding: 12px;
                flex-direction: column;
                align-items: flex-start;
                gap: 10px;
                align-self: stretch;
                border-radius: 4px;
                background: #F9FAFD;
            }

                .SchedulesFrame > .SchedulesBody > .SchedulesMain .ShiftDetails > header {
                    display: flex;
                    justify-content: space-between;
                    width: 100%;
                }

                    .SchedulesFrame > .SchedulesBody > .SchedulesMain .ShiftDetails > header > span {
                        color: #000;
                        font-family: Inter;
                        font-size: 16px;
                        font-style: normal;
                        font-weight: 500;
                        line-height: normal;
                    }

.SchedulesMain .ShiftDetails > header > .AddEvent {
    display: flex;
    padding: 4px 2px;
    align-items: center;
    gap: 8px;
    border-radius: 4px;
    cursor: pointer;
}

    .SchedulesMain .ShiftDetails > header > .AddEvent:hover {
        border-radius: 4px;
        background: #F1F7FE;
    }

    .SchedulesMain .ShiftDetails > header > .AddEvent > span {
        color: #0078BC;
        font-family: Inter;
        font-size: 14px;
        font-style: normal;
        font-weight: 400;
        line-height: 18px;
    }

/* 
*/



.SchedulesMain .ShiftDetails > .SDBody > .Row2 > .RowSide > .RSegment > .ClockBox > .ClockButtons,
.SchedulesMain .ShiftDetails > .SDBody > .Row2 > .SingleSide > .ClockBox > .ClockButtons {
    display: flex;
    height: 35px;
    padding: 8px;
    justify-content: space-between;
    align-items: center;
    border-radius: 4px;
}

.SchedulesMain .ShiftDetails > .SDBody > .Row2 > .RowSide > .RSegment > .ClockBox > .ClockButtons,
.SchedulesMain .ShiftDetails > .SDBody > .Row2 > .SingleSide > .ClockBox > .ClockButtons {
    display: flex;
    justify-content: flex-end;
    align-items: center;
    gap: 10px;
    border-right: 0;
}

    .SchedulesMain .ShiftDetails > .SDBody > .Row2 > .RowSide > .RSegment > .ClockBox > .ClockButtons > button,
    .SchedulesMain .ShiftDetails > .SDBody > .Row2 > .SingleSide > .ClockBox > .ClockButtons > button {
        display: flex;
        padding: 2px 4px;
        justify-content: center;
        align-items: center;
        cursor: pointer;
        box-sizing: border-box;
        border-radius: 4px;
        border: none;
        background: none;
        width: 24px;
    }

        .SchedulesMain .ShiftDetails > .SDBody > .Row2 > .RowSide > .RSegment > .ClockBox > .ClockButtons > button:nth-of-type(2) > span,
        .SchedulesMain .ShiftDetails > .SDBody > .Row2 > .SingleSide > .ClockBox > .ClockButtons > button:nth-of-type(2) > span {
            display: inline-flex;
        }

        .SchedulesMain .ShiftDetails > .SDBody > .Row2 > .RowSide > .RSegment > .ClockBox > .ClockButtons > button:hover,
        .SchedulesMain .ShiftDetails > .SDBody > .Row2 > .SingleSide > .ClockBox > .ClockButtons > button:hover {
            background: #E1EEFD;
        }


        .SchedulesMain .ShiftDetails > .SDBody > .Row2 > .RowSide > .RSegment > .ClockBox > .ClockButtons > button > span,
        .SchedulesMain .ShiftDetails > .SDBody > .Row2 > .SingleSide > .ClockBox > .ClockButtons > button > span {
            color: #0078BC;
            font-family: Inter;
            font-size: 14px;
            font-style: normal;
            font-weight: 400;
            line-height: normal;
        }

/* 
*/

.SchedulesFrame > .SchedulesBody > .SchedulesMain .ShiftDetails > .SDBody {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 8px;
    align-self: stretch;
}

    .SchedulesFrame > .SchedulesBody > .SchedulesMain .ShiftDetails > .SDBody > .Row1 {
        display: flex;
        align-items: center;
        gap: 8px;
        align-self: stretch;
    }

        .SchedulesFrame > .SchedulesBody > .SchedulesMain .ShiftDetails > .SDBody > .Row1 > span {
            color: #000;
            font-family: Inter;
            font-size: 14px;
            font-style: normal;
            font-weight: 400;
            line-height: 16px;
        }

.SchedulesFrame .EmptyFullCB {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
}

    .SchedulesFrame .EmptyFullCB > .EmptyCB {
        display: flex;
        width: 14px;
        height: 14px;
        justify-content: center;
        align-items: center;
        flex-shrink: 0;
        border-radius: 4px;
        border: 1px solid #000;
        cursor: pointer;
    }

    .SchedulesFrame .EmptyFullCB > .FullCB {
        display: none;
        width: 14px;
        height: 14px;
        justify-content: center;
        align-items: center;
        flex-shrink: 0;
        border-radius: 4px;
        border: 1px solid #0078BC;
        background: #0078BC;
        cursor: pointer;
    }

.SchedulesBody > .SchedulesMain .ShiftDetails > .SDBody > .Row2 {
    display: flex;
    align-items: flex-start;
    gap: 16px;
    align-self: stretch;
}

.SchedulesBody > .SchedulesMain .ShiftDetails > .SDBody .RowSide {
    display: flex;
    align-items: flex-end;
    gap: 8px;
    flex: 1 0 0;
}

.SchedulesBody > .SchedulesMain .ShiftDetails > .SDBody .SingleSide {
    display: flex;
    align-items: center;
    gap: 8px;
    flex: 1 0 0;
    max-width: 100%;

}

.SchedulesBody > .SchedulesMain .ShiftDetails > .SDBody > .Row2 > .RowSide > .RSegment {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: flex-end;
    gap: 8px;
    flex: 1;
}

.SchedulesBody > .SchedulesMain .ShiftDetails > .SDBody > .Row2 > .RowSide > .FlexStart {
    align-items: flex-start !important;
}

.SchedulesBody > .SchedulesMain .ShiftDetails > .SDBody > .Row2 > .RowSide > .RSegment > span {
    align-self: flex-start;
    color: #5F5F5F;
    font-family: Inter;
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    line-height: 16px;
}

.SchedulesBody > .SchedulesMain .ShiftDetails > .SDBody > .Row2 .ClockBox {
    display: flex;
    /* padding: 8px; */
    align-items: flex-start;
    justify-content: space-between;
    gap: 8px;
    align-self: stretch;
    border-radius: 4px;
    /* border: 1px solid #E3E3E3; */
    background: #FFF;
    border: 1px solid #D2D5DA;
}




.ShiftDetails > .SDBody > .Row2 .ClockBox > input:not([type='checkbox']) {
    width: 100%;
    height: 100%;
    border: none;
}

    .ShiftDetails > .SDBody > .Row2 .ClockBox > input::placeholder {
        color: #C8C8C8;
        font-family: Inter;
        font-size: 14px;
        font-style: normal;
        font-weight: 400;
        line-height: normal;
    }

    .ShiftDetails > .SDBody > .Row2 .ClockBox > input:focus::placeholder {
        opacity: 0;
    }

    .ShiftDetails > .SDBody > .Row2 .ClockBox > input:focus {
        outline: none;
    }

.ShiftDetails > .SDBody > .Row2 > .RowSide > .RSegment > .SelectBox,
.ShiftDetails > .SDBody > .Row2 > .SingleSide > .SelectBox {
    display: flex;
    /* padding: 8px; */
    justify-content: space-between;
    align-items: flex-start;
    gap: 8px;
    flex: 1 0 0;
    align-self: stretch;
    border-radius: 4px;
    /* border: 1px solid #E3E3E3; */
    background: #FFF;
}


    .ShiftDetails > .SDBody > .Row2 > .RowSide > .RSegment > .SelectBox > .newStyle,
    .ShiftDetails > .SDBody > .Row2 > .SingleSide > .SelectBox > .newStyle {
        height: 35px;
        padding: 8px !important;
        padding-top: 4px !important;
    }


    .ShiftDetails > .SDBody > .Row2 > .RowSide > .RSegment > .SelectBox > span,
    .ShiftDetails > .SDBody > .Row2 > .SingleSide > .SelectBox > span,
    .ShiftLaborDescription {
        color: #C8C8C8; /* #000 (black) for actual selection*/
        font-family: Inter;
        font-size: 14px;
        font-style: normal;
        font-weight: 400;
        line-height: normal;
        white-space: nowrap;
    }



.SchedulesBody > .SchedulesMain .ShiftDetails > .SDBody > .Row2 > .SingleSide > span {
    color: #5F5F5F;
    font-family: Inter;
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    line-height: 16px;
}

.SchedulesBody > .SchedulesMain .ShiftDetails > .SDBody > .Row2 > img {
    cursor: pointer;
    margin-left: auto;
}

.SchedulesBody > .SchedulesMain .ShiftDetails > .SDBody > .Row2 > header {
    color: #000;
    font-family: Inter;
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    line-height: normal;
}

.SchedulesBody > .SchedulesMain .ShiftDetails > .SDBody > .Row2 .EmptyFullCB > span {
    color: #515151;
    font-family: Inter;
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    line-height: normal;
}

.SchedulesFrame > footer {
    display: flex;
    padding: 16px 24px;
    justify-content: flex-end;
    align-items: center;
    gap: 8px;
    align-self: stretch;
    border-radius: 0px 0px 8px 8px;
    border-top: 1px solid rgba(238, 238, 238, 0.93);
    background: #FFF;
}

    .SchedulesFrame > footer > button {
        display: flex;
        padding: 8px 20px;
        flex-direction: column;
        align-items: flex-start;
        gap: 8px;
        border-radius: 4px;
        border: 1px solid #E5E5E5;
        background: #FFF;
        cursor: pointer;
    }

        .SchedulesFrame > footer > button > span {
            color: #0078BC;
            font-family: Inter;
            font-size: 14px;
            font-style: normal;
            font-weight: 600;
            line-height: normal;
        }


.schedule-day-det.schedule-popup{
    border: none !important;
}

.ClockBox.Locked {
    background: rgba(210, 213, 218,0.4) !important;
}


.PG-ScheduleManagement {
    display: flex;
    position: relative;
    flex-direction: column;
    width: 100%;
    max-width: 100%;
    height: 100%;
    max-height: 100%;
    background: #FFF;
    gap: 0px;
}

    .PG-ScheduleManagement > header {
        display: flex;
        align-items: center;
        width: 100%;
    }

        .ScMan-Buttons {
            display: flex;
            gap: 8px;
            height: 100%;
            min-height: 40px;
            max-height: 40px;
            flex: 1;
            justify-content: end;
        }

.ScMan-Buttons > .ScMan-Template,
.ScMan-NewSave {
    display: flex;
    min-height: 100%;
    height: 100%;
}

.ScMan-Buttons .ScMan-TempSel {
    display: flex;
    align-items: center;
    height: 100%;
    border-radius: 4px 0px 0px 4px;
    border: 1px solid #E5E5E5;
    padding: 0px 12px;
    gap: 8px;
    background: #FFF;
    cursor: pointer;
}

.ScMan-Buttons .ScMan-TempEdit {
    display: flex;
    height: 100%;
    align-items: center;
    padding: 0px 12px;
    border-radius: 0px 4px 4px 0px;
    border-top: 1px solid #E5E5E5;
    border-right: 1px solid #E5E5E5;
    border-bottom: 1px solid #E5E5E5;
    background: #FFF;
    cursor: pointer;
}

.ScMan-TempSel .ScMan-TempImg {
    display: flex;
    padding: 6px;
    align-items: center;
    border-radius: 4px;
    background: #E0F5F1;
}

.ScMan-TempImg img {
    width: 16px;
    height: 16px;
    flex-shrink: 0;
}

.ScMan-UndoButton {
    display: flex;
    height: 100%;
    padding: 0px 12px;
    justify-content: center;
    align-items: center;
    gap: 8px;
    border-radius: 4px;
    border: 1px solid #E5E5E5;
    background: #FFF;
    cursor: pointer;
}

    .ScMan-UndoButton span{
        white-space: nowrap;
    }

    .NewSave-Save {
        display: flex;
        align-items: center;
        height: 100%;
        border-radius: 4px 4px 4px 4px;
        padding: 0px 12px;
        gap: 8px;
        background: #0078BC;
        cursor: pointer;
    }

.NewSave-Chev {
    display: flex;
    height: 100%;
    align-items: center;
    padding: 0px 12px;
    border-radius: 0px 4px 4px 0px;
    border-left: 1px solid #FFF;
    background: #0078BC;
    cursor: pointer;
    margin-left: -2px;
}

.ScMan-SearchFiltersActions {
    display: flex;
    min-height: 40px;
    width: 100%;
    justify-content: space-between;
    align-items: center;
    margin-top: 5px;
    margin-bottom: 5px;
}

    .ScMan-SearchFiltersActions .ScMan-SearchFilters,
    .ScMan-SearchFiltersActions .ScMan-Actions {
        display: flex;
        align-items: flex-start;
        gap: 8px;
        align-self: stretch;
        flex-wrap: wrap;
    }

    .ScMan-SearchFiltersActions .ScMan-Search {
        display: flex;
        align-self: stretch;
        align-items: center;
        border-radius: 4px;
        border: 1px solid #E5E5E5;
        background: #FFF;
    }

.ScMan-Search1 {
    display: flex;
    min-height: 40px;
    max-height: 40px;
    align-self: stretch;
    align-items: center;
    border-radius: 4px;
    border: 1px solid #E5E5E5;
    background: #FFF;
}

    .ScMan-SearchFiltersActions .ScMan-SearchFilters > .ScMan-Search input,
    .ScMan-Search1 input {
        outline: none;
        border: none;
        flex-grow: 1;
    }

.ScMan-SearchFilters > .ScMan-Search .ScMan-ShiftFilter,
.ScMan-SearchFilters > .ScMan-Search .ScMan-WeekView {
    display: flex;
    padding: 0 12px;
    gap: 8px;
    align-items: center;
}

.ScMan-Hline {
    min-width: 1px;
    max-width: 1px;
    min-height: 100%;
    max-height: 100%;
    background: #E5E5E5;
}

.ScMan-SearchFilters > .ScMan-Search .ScMan-EditShiftFilter {
    display: flex;
    align-self: stretch;
    padding: 0 12px;
    align-items: center;
    justify-content: center;
    background: #F6F6F6;
    border-top-right-radius: 4px;
    border-bottom-right-radius: 4px;
}

    .ScMan-SearchFilters > .ScMan-Search .ScMan-EditShiftFilter img {
        width: 16px;
        height: 16px;
    }

.ScMan-ActionButton {
    display: flex;
    max-height: 40px;
    min-height: 40px;
    padding: 0 10px;
    justify-content: center;
    align-items: center;
    border-radius: 4px;
    border: 1px solid #E5E5E5;
    cursor: pointer;
}

    .ScMan-ActionButton img {
        width: 20px;
        height: 20px;
        filter: brightness(0) saturate(100%) invert(35%) sepia(8%) saturate(0%) hue-rotate(267deg) brightness(96%) contrast(84%);
    }

.ScMan-ActionIcon {
    display: flex;
    max-height: 40px;
    min-height: 40px;
    padding: 0 10px;
    justify-content: center;
    align-items: center;
    border-radius: 4px;
    border: 1px solid #E5E5E5;
}

    .ScMan-ActionButton.ActionGradient,
    .ScMan-ActionIcon.ActionGradient {
        background: linear-gradient(222deg, #DBC3F9 7.53%, #0078BC 60.79%);
    }

        .ScMan-ActionButton.ActionGradient img,
        .ScMan-ActionIcon.ActionGradient img {
            filter: brightness(0) invert(1);
        }

.ScMan-ActionButton:not(.ActionClicked).ActionHover:hover {
    background: #F1F7FE;
    border: 1px solid #81C2F8;
}

.ScMan-ActionButton.ActionClicked {
    background: #0078BC;
    border: none !important;
}

.ScMan-ActionButton.ActionNotClicked .ActionClickedImg {
    display: none;
}

.ScMan-ActionButton.ActionClicked .ActionImg {
    display: none;
}

.ScMan-ActionButton > span {
    color: #5F5F5F;
}

.ScMan-ActionButton.ActionHover:hover > span {
    color: #0078BC !important;
}

.ScMan-MainGrid {
    display: flex;
    flex-direction: column;
    position: relative;
    max-height: 100%;
    max-width: 100%;
    width: 100%;
    overflow: auto;
    flex: 1;
}

    .ScMan-MainGrid > header {
        display: flex;
        position: sticky;
        top: 0;
        background-color: white;
        z-index: 4;
    }

footer.ScMan-MainGrid-Footer {
    display: flex;
    bottom: 0;
    background-color: white;
    z-index: 4;
    margin-bottom: 5px;
}

.ScMan-HSegment {
    display: flex;
    flex: 1;
    padding: 10px 10px 0px 10px;
    justify-content: space-between;
    align-items: center;
    border-right: 1px solid #E5E5E5;
    border-bottom: 1px solid #E5E5E5;
    border-top: 1px solid #E5E5E5;
    background: #F9FAFD;
}

header .ScMan-HSegment:first-child{
    border-top-left-radius: 8px;
}

header .ScMan-HSegment:last-child {
    border-top-right-radius: 8px;
}

.ScMan-MainGrid-Footer .ScMan-FSegment {
    border-bottom: 1px solid #E5E5E5;
}

.ScMan-MainGrid-Footer .ScMan-FSegment:first-child {
    border-bottom-left-radius: 8px;
}

.ScMan-MainGrid-Footer .ScMan-FSegment:last-child {
    border-bottom-right-radius: 8px;
}


.ScMan-RSegment, .ScMan-HSegment, .ScMan-FSegment {
    position: relative;
}

    .ScMan-RSegment, .ScMan-HSegment, .ScMan-FSegment {
        min-width: 150px !important;
        max-width: calc(100% / 7);
    }

.list-type-DayList .ScMan-RSegment, .ScMan-HSegment, .ScMan-FSegment {
    max-width: 100%;
}



.list-type-MonthList .ScMan-RSegment, .list-type-MonthList .ScMan-HSegment, .list-type-MonthList .ScMan-FSegment {
    min-width: 50px !important;
}

.list-type-DayList .ScMan-RSegment, .list-type-DayList .ScMan-HSegment, .list-type-DayList .ScMan-FSegment {
    min-width: 50px !important;
}

.ScMan-HSegment-EmployeeName, .StickyEmployee, .ScMan-FSegment-EE,
.list-type-MonthList .ScMan-HSegment-EmployeeName, .list-type-MonthList .StickyEmployee, .list-type-MonthList .ScMan-FSegment-EE,
.list-type-DayList .ScMan-HSegment-EmployeeName, .list-type-DayList .StickyEmployee, .list-type-DayList .ScMan-FSegment-EE {
    width: 160px !important;
    min-width: 160px !important;
    max-width: 160px !important;
    border-left: 1px solid #E5E5E5;
}

.list-type-MonthList .SCM-ShiftButtonsEdit {
    flex-direction: column;
}

.ScMan-HSegment1 {
    display: flex;
    max-width: 64px;
    min-width: 64px;
    padding: 10px 10px 0px 10px;
    justify-content: center;
    align-items: center;
    border-right: 1px solid #E5E5E5;
    border-bottom: 1px solid #E5E5E5;
    background: #F9FAFD;
}

.ScMan-HSegment31 {
    display: flex;
    min-width: calc((100% - 64px) / 31);
    max-width: calc((100% - 64px) / 31);
    padding-top: 10px;
    justify-content: space-between;
    align-items: center;
    border-right: 1px solid #E5E5E5;
    border-bottom: 1px solid #E5E5E5;
    background: #F9FAFD;
}

.ScMan-HSegment30 {
    display: flex;
    min-width: calc((100% - 64px) / 30);
    max-width: calc((100% - 64px) / 30);
    padding: 10px 14px 1px 14px;
    justify-content: space-between;
    align-items: center;
    border-right: 1px solid #E5E5E5;
    border-bottom: 1px solid #E5E5E5;
    background: #F9FAFD;
}

.ScMan-HSegment27 {
    display: flex;
    min-width: calc((100% - 64px) / 27);
    max-width: calc((100% - 64px) / 27);
    padding: 10px 14px 1px 14px;
    justify-content: space-between;
    align-items: center;
    border-right: 1px solid #E5E5E5;
    border-bottom: 1px solid #E5E5E5;
    background: #F9FAFD;
}

.ScMan-HSegment28 {
    display: flex;
    min-width: calc((100% - 64px) / 28);
    max-width: calc((100% - 64px) / 28);
    padding: 10px 14px 1px 14px;
    justify-content: space-between;
    align-items: center;
    border-right: 1px solid #E5E5E5;
    border-bottom: 1px solid #E5E5E5;
    background: #F9FAFD;
}

.ScMan-FSegment {
    display: flex;
    flex: 1;
    padding: 6px 4px;
    justify-content: center;
    align-items: center;
    border-right: 1px solid #E5E5E5;
    border-top: 1px solid #E5E5E5;
    background: #F9FAFD;
}

    .ScMan-FSegment > span {
        color: #313131;
    }

.SM-NoRBorder {
    border-right: none !important;
}

.ScMan-HSegment > span {
    color: #5F5F5F;
    white-space: nowrap;
}

.ScMan-MainGrid .ScMan-EmpRow {
    display: flex;
    position: relative;
    align-self: stretch;
}

    .ScMan-MainGrid .ScMan-EmpRow .ScMan-RSegment {
        display: flex;
        flex-direction: column;
        flex: 1;
        gap: 4px;
        padding: 4px;
        align-items: center;
        border-right: 1px solid #E5E5E5;
        border-bottom: 1px solid #E5E5E5;
        background: #FFF;
        min-height: 60px;
    }

.ScMan-MainGrid.list-type-DayList .ScMan-EmpRow .ScMan-RSegment {
    align-items: baseline;
}

.ScMan-EmpRow.ScMan-OpenShifts .ScMan-RSegment, .ScMan-EmpRow.Swap-EE .ScMan-RSegment {
    background: #F1F7FE !important;
}

.ScMan-RSegment.StickyEmployee {
    position: sticky;
    left: 0;
    z-index: 3;
}

.list-type-DayList .ScMan-RSegment.StickyEmployee {
    z-index: 5;
}

.list-type-DayList > header {
    z-index: 6;
}

.ScMan-RSegment > .SCM-EmployeeSeg {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    align-self: stretch;
    gap: 4px;
    padding: 4px 2px;
}

.ScMan-RSegment .SCM-EmployeeRow {
    display: flex;
    align-items: center;
    gap: 6px;
    align-self: stretch;
}

.SCM-ShiftEmployeeRow {
    display: flex;
    align-items: center;
    gap: 6px;
    max-width: 100%;
}

.SCM-EmployeeRow span, .SCM-ShiftEmployeeRow span {
    text-overflow: ellipsis;
    overflow: hidden;
    white-space: nowrap;
}

.ScMan-BlueImg {
    filter: brightness(0) saturate(100%) invert(30%) sepia(1) hue-rotate(190deg) saturate(800%) brightness(90%);
}

.ScMan-RSegment .ScMan-ShiftsBar,
.ScMan-RSegment1 .ScMan-ShiftsBar {
    display: flex;
    padding: 2px 4px;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    gap: 2px;
    align-self: stretch;
    width: 100%;
    cursor: pointer;
    position: relative;
}


.ScMan-ShiftsBar > .ScMan-Shifts {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 2px;
    align-self: stretch;
    padding-bottom: 0px;
    min-height: 24px;
}


.ScMan-OpenShifts .ScMan-Shifts {
    min-height: 43.5px;
}

.ScMan-OpenShifts .ScMan-ShiftsBar {
    padding-top: 0px !important;
}

.ScMan-ShiftsBar:hover > .ScMan-Shifts:not(.ScMan-Shifts-Always) {
    display: none;
}

.hide-action-buttons .ScMan-ShiftsBar:hover > .ScMan-Shifts {
    display: flex;
}

.ScMan-ShiftsBar > .ScMan-ShiftsMonth {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 6px;
    align-self: stretch;
    max-width: 100%;
    overflow: hidden;
}

.ScMan-ShiftsBar > .ScMan-ShiftsMonth2 {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 4px;
    align-self: stretch;
    max-width: 100%;
    overflow: hidden;
}

.ScMan-ShiftsMonth1 {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    max-width: 100%;
    overflow: hidden;
}

.ScMan-ShiftsMonth span {
    white-space: nowrap;
    max-width: 100%;
    overflow: hidden;
    text-overflow: ellipsis;
}

.ScMan-ShiftsBar > .ScMan-ShiftsInfo,
.ScMan-ShiftsBar > .ScMan-ShiftsEdit,
.ScMan-ShiftsBar > .ScMan-ShiftsEmployee {
    display: flex;
    align-items: center;
    gap: 4px;
}

.ScMan-ShiftsBar > .ScMan-ShiftsEdit {
    gap: 0px;
}

.ScMan-ShiftsBar > .ScMan-ShiftsEdit div{
    gap: 4px;
}

.ScMan-ShiftsBar > .ScMan-ShiftsInfo {
    max-width: 100%;
    justify-content: center;
}

.ScMan-ShiftsBar > .ScMan-ShiftsEdit, .ScMan-ShiftsBar .SCM-ShiftButtonsEdit {
    display: none;
    justify-content: center;
}

    .ScMan-ShiftsBar > .ScMan-ShiftsEdit, .ScMan-ShiftsBar .SCM-ShiftButtonsEdit .SCM-ShiftButtonEdit {
        cursor: pointer
    }

.ScMan-ShiftsBar:hover > .ScMan-ShiftsEdit, .ScMan-ShiftsBar:hover .SCM-ShiftButtonsEdit {
    display: flex;
}

.hide-action-buttons .ScMan-ShiftsBar:hover > .ScMan-ShiftsEdit, .hide-action-buttons .ScMan-ShiftsBar:hover .SCM-ShiftButtonsEdit {
    display: none;
}

.ScMan-ShiftsInfo > .ScMan-SInfoTextBox {
    display: flex;
    padding: 4px 6px;
    align-items: center;
    gap: 10px;
    border-radius: 2px;
    width: 100%;
    max-width: 300px;
}

.ScMan-ShMoEdit {
    display: flex;
    align-items: center;
}

    .ScMan-ShMoEdit > span {
        color: #0078BC;
    }

.ScMan-ShiftsBar > .ScMan-ShiftsEdit .ScMan-ShiftsEdit-View span {
    color: #0078BC;
}

.ScMan-ShiftsBar {
    border-radius: 7px;
}

    .ScMan-ShiftsBar:not(.ScMan-ShiftsBar-NoBorder) {
        border-left: 3px solid rgb(95, 158, 160);
    }


.ScMan-ShiftsBar.SCM-DottedBorder {
    border-radius: 7px;
    border-left: 3px dashed rgb(95, 158, 160);
}

.ScMan-ShiftsBar.SCM-DottedBorderGray {
    border-radius: 7px;
    border-left: 3px dashed #C8C8C8;
}

.ScMan-ShiftsBar.SCM-FullBorderGray {
    border-radius: 7px 4px 4px 7px;
    border-left: 3px solid #C8C8C8;
    border-top: 1px solid #F0F0F0;
    border-right: 1px solid #F0F0F0;
    border-bottom: 1px solid #F0F0F0;
}

        .ScMan-ShiftsBar.SCM-DottedBorderGray .ScMan-SInfoTextBox > span,
        .ScMan-ShiftsBar.SCM-FullBorderGray .ScMan-SInfoTextBox > span {
            color: #818181;
        }

.ScMan-ShiftsBar.SCM-DottedBorderEmerald {
    border-radius: 7px;
    border-left: 3px dashed #07856C;
}

.ScMan-ShiftsBar.SCM-FullBorderEmerald {
    border-radius: 7px 4px 4px 7px;
    border-left: 3px solid #07856C;
    border-top: 1px solid #CCE7E2;
    border-right: 1px solid #CCE7E2;
    border-bottom: 1px solid #CCE7E2;
}

    .ScMan-ShiftsBar.SCM-DottedBorderEmerald .ScMan-SInfoTextBox,
    .ScMan-ShiftsBar.SCM-FullBorderEmerald .ScMan-SInfoTextBox {
        background: #D9F3EE;
    }

        .ScMan-ShiftsBar.SCM-DottedBorderEmerald .ScMan-SInfoTextBox > span,
        .ScMan-ShiftsBar.SCM-FullBorderEmerald .ScMan-SInfoTextBox > span {
            color: #07856C;
            font-weight: 500;
        }

.ScMan-ShiftsBar.SCM-DottedBorderPurple {
    border-radius: 7px;
    border-left: 3px dashed #8C58CB;
}

.ScMan-ShiftsBar.SCM-FullBorderPurple {
    border-radius: 7px 4px 4px 7px;
    border-left: 3px solid #8C58CB;
    border-top: 1px solid #F2ECF9;
    border-right: 1px solid #F2ECF9;
    border-bottom: 1px solid #F2ECF9;
}

    .ScMan-ShiftsBar.SCM-DottedBorderPurple .ScMan-SInfoTextBox,
    .ScMan-ShiftsBar.SCM-FullBorderPurple .ScMan-SInfoTextBox {
        background: #F4EBFF;
    }

        .ScMan-ShiftsBar.SCM-DottedBorderPurple .ScMan-SInfoTextBox > span,
        .ScMan-ShiftsBar.SCM-FullBorderPurple .ScMan-SInfoTextBox > span {
            color: #8C58CB;
            font-weight: 500;
        }

.ScMan-ShiftsBar.SCM-DottedBorderOrange {
    border-radius: 7px;
    border-left: 3px dashed #EB7C10;
}

.ScMan-ShiftsBar.SCM-FullBorderOrange {
    border-radius: 7px 4px 4px 7px;
    border-left: 3px solid #EB7C10;
    border-top: 1px solid #FCE5CF;
    border-right: 1px solid #FCE5CF;
    border-bottom: 1px solid #FCE5CF;
}

    .ScMan-ShiftsBar.SCM-DottedBorderOrange .ScMan-SInfoTextBox,
    .ScMan-ShiftsBar.SCM-FullBorderOrange .ScMan-SInfoTextBox {
        background: #FFFAEC;
    }

        .ScMan-ShiftsBar.SCM-DottedBorderOrange .ScMan-SInfoTextBox > span,
        .ScMan-ShiftsBar.SCM-FullBorderOrange .ScMan-SInfoTextBox > span {
            color: #EB7C10;
            font-weight: 500;
        }

.ScMan-ShiftsBar.SCM-DottedBorderGreen {
    border-radius: 7px;
    border-left: 3px dashed #53825C;
}

.ScMan-ShiftsBar {
    border-radius: 7px 4px 4px 7px;
    border-top: 1px solid #E0EBE2;
    border-right: 1px solid #E0EBE2;
    border-left: 1px solid #E0EBE2;
    border-bottom: 1px solid #E0EBE2;
}

    .ScMan-ShiftsBar.SCM-DottedBorderGreen .ScMan-SInfoTextBox,
    .ScMan-ShiftsBar.SCM-FullBorderGreen .ScMan-SInfoTextBox {
        background: #E9F1EB;
    }

        .ScMan-ShiftsBar.SCM-DottedBorderGreen .ScMan-SInfoTextBox > span,
        .ScMan-ShiftsBar.SCM-FullBorderGreen .ScMan-SInfoTextBox > span {
            color: #53825C;
            font-weight: 500;
        }

.ScMan-EmpRow.ScMan-OpenShifts .ScMan-ShiftsBar {
    background: #E1EEFD !important;
}

.ScMan-EmpRow.ScMan-ClosedShifts [class*="SCM-DottedBorder"],
.ScMan-ShiftsBar.SCM-EditMove {
    background: #F6F6F6 !important;
}

.ScMan-AddShiftPlus {
    display: flex;
    align-self: stretch;
    flex-grow: 1;
    align-items: center;
    justify-content: center;
    cursor: pointer;
}

.ScMan-AddShiftPlusSingle {
    display: flex;
    align-self: stretch;
    flex-grow: 1;
    align-items: center;
    justify-content: center;
    cursor: pointer;
}

.SCM-DisabledForSelect {
    position: relative;
    display: flex;
    justify-content: center;
    align-items: center;
    align-self: stretch;
}

    .SCM-DisabledForSelect > div {
        opacity: 0.5;
    }

.SCM-ShiftButtonsEdit {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 5px;
}

.SCM-ShiftButtonEdit {
    display: flex;
    min-width: 24px;
    max-width: 24px;
    min-height: 24px;
    max-height: 24px;
    padding: 3px;
    justify-content: center;
    align-items: center;
    flex-shrink: 0;
    border-radius: 2px;
    background: #BCDDFB;
}


.SCM-ShiftButtonsEdit2 {
    display: flex;
    min-width: 24px;
    max-width: 24px;
    min-height: 24px;
    max-height: 24px;
    padding: 3px;
    justify-content: center;
    align-items: center;
    border-radius: 2px;
    background: #0078BC;
    cursor: pointer;
}

.SCM-ShiftButtonsEdit3 {
    display: flex;
    min-width: 24px;
    max-width: 24px;
    min-height: 24px;
    max-height: 24px;
    padding: 3px;
    justify-content: center;
    align-items: center;
    border-radius: 2px;
    background: #BCDDFB;
    cursor: pointer;
}

.SCM-ShiftButtonEdit.SCM-ShiftFirstButton {
    background: #0078BC !important;
}

    .SCM-ShiftButtonEdit.SCM-ShiftFirstButton > img {
        flex-shrink: 0;
        cursor: pointer;
        height: 14px;
        width: 14px;
        filter: brightness(0) saturate(100%) invert(1);
    }

.SCM-ShiftButtonEdit:not(.SCM-ShiftButtonEdit-Delete):not(.SCM-ShiftFirstButton) > img:not(.SCM-ShiftButtonEdit.SCM-ShiftFirstButton) {
    filter: brightness(0) saturate(100%) invert(30%) sepia(1) hue-rotate(190deg) saturate(800%) brightness(90%);
}

.SCM-PendingSwap {
    color: #EB7C10;
}

.SCM-ApprovedSwap {
    color: #3E941C;
}

.SCM-StrippedRed {
    background: repeating-linear-gradient( 120deg, rgba(200, 200, 200, 0.4), rgba(200, 200, 200, 0.4) 2px, transparent 2px, transparent 20px ), #FCEFEE !important;
    /* Adjust last transparent for line spacing, 2px and second transparent for line width */
    border-radius: 4px;
    justify-content: space-between !important;
    align-items: flex-start;
}

.SCM-StrippedYellow {
    background: repeating-linear-gradient( 120deg, rgba(200, 200, 200, 0.4), rgba(200, 200, 200, 0.4) 2px, transparent 2px, transparent 20px ), #FDF2E7 !important;
    /* Adjust last transparent for line spacing, 2px and second transparent for line width */
    border-radius: 4px;
    justify-content: space-between !important;
    align-items: flex-start;
}

.SCM-StrippedOrange {
    background: repeating-linear-gradient( 120deg, rgba(200, 200, 200, 0.4), rgba(200, 200, 200, 0.4) 2px, transparent 2px, transparent 20px ), #FFF4D3 !important;
    /* Adjust last transparent for line spacing, 2px and second transparent for line width */
    border-radius: 4px;
    justify-content: space-between !important;
    align-items: flex-start;
}

.SCM-StrippedGray {
    background: repeating-linear-gradient( 120deg, rgba(200, 200, 200, 0.4), rgba(200, 200, 200, 0.4) 2px, transparent 2px, transparent 20px ), #F6F6F6 !important;
    /* Adjust last transparent for line spacing, 2px and second transparent for line width*/
    border-radius: 4px;
    justify-content: space-between !important;
    align-items: flex-start;
}

.SCM-ApprovedVacation {
    background: #F0FCE9 !important;
}

.SCM-StrippedRejected {
    color: #D92D20;
}

.SCM-StrippedPending {
    color: #EB7C10;
}

.SCM-ApprovedSpan {
    color: #3E941C;
}

.SCM-DoneLock {
    background: #F0FCE9;
}

.SCM-SingleBlock {
    flex-grow: 0 !important;
    min-height: fit-content !important;
}

.SCM-PreferWork {
    margin-top: auto;
    margin-bottom: auto;
    border-radius: 4px;
    background: #DEF7D0 !important;
    padding: 2px 4px !important;
}

.SCM-PreferWorkSpan {
    color: #3E941C;
}

.SCM-DontPreferWork {
    margin-top: auto;
    margin-bottom: auto;
    border-radius: 4px;
    background: #FFF4D3 !important;
    padding: 4px 6px !important;
}

.SCM-DontPreferWorkSpan {
    color: #CC5B02;
}

.SCM-TimeOffSettings {
    display: flex;
    justify-content: center;
    align-items: center;
    border-radius: 4px;
    min-width: 120px;
    background: #FDF7E7 !important;
}

.SCM-TimeOffButton {
    display: flex;
    min-width: 40px;
    max-width: 40px;
    min-height: 40px;
    max-height: 40px;
    padding: 6px 8px;
    justify-content: center;
    align-items: center;
    border-radius: 3px 0px 0px 3px;
    background: #E1EEFD;
}

.SCM-TimeOffInfo {
    display: flex;
    padding: 8px;
    align-items: center;
    justify-content: center;
    gap: 8px;
}

.SM-EditMoveBorder {
    border-radius: 4px;
}

.SCM-PreferenceESpan {
    color: #0078BC;
}

.SCM-PlusPreference {
    display: flex;
    padding: 4px 2px;
    align-items: center;
    gap: 8px;
}

.ScMan-AbsoluteEmpSelect {
    display: flex;
    min-width: 164px;
    max-width: 164px;
    padding: 12px 10px;
    flex-direction: column;
    align-items: flex-start;
    gap: 4px;
    border-radius: 4px;
    border: 1px solid #81C2F8;
    background: #F1F7FE;
    box-shadow: 0px 8px 12px 0px rgba(0, 0, 0, 0.08);
}

.ScMan-AbsoluteEmp {
    display: flex;
    align-items: center;
    gap: 4px;
}

.SCM-CoffeBar {
    border-radius: 4px;
    border: 1px solid #E5E5E5;
    gap: 1px !important;
    margin-top: auto;
    margin-bottom: auto;
    padding: 0 !important;
}

.ScMan-CoffeeButtons {
    display: flex;
    border-top: 1px solid #E5E5E5;
    align-items: center;
    align-self: stretch;
    width: 100%;
}

.ScMan-CoffeeButton {
    display: flex;
    flex: 1;
    padding: 6px 8px;
    justify-content: center;
    align-items: center;
    cursor: pointer;
}

.SM-CoffeeBlue {
    background: #E1EEFD;
}

.SM-CoffeeRed {
    background: #FBEDED;
}

.SM-AbsoluteEmpFile {
    display: flex;
    padding: 6px;
    align-items: center;
    position: absolute;
    right: 8px;
    bottom: 8px;
    border-radius: 4px;
    border: 0.5px solid #81C2F8;
    background: #E1EEFD;
    box-shadow: 0px 8px 12px 0px rgba(0, 0, 0, 0.08);
}

.SM-CopyRelative {
    position: relative;
}

.SM-CopyTop {
    border-top: 1px solid #0078BC !important;
    pointer-events: none !important;
}

.SM-CopyDown {
    border-bottom: 1px solid #0078BC !important;
    pointer-events: none !important;
}

.SM-CopyLeft {
    border-left: 1px solid #0078BC !important;
    pointer-events: none !important;
}

.SM-CopyRight {
    border-right: 1px solid #0078BC !important;
    pointer-events: none !important;
}

.SM-CopyButtonAbsolute {
    display: flex;
    padding: 6px;
    justify-content: center;
    align-items: center;
    position: absolute;
    left: 4.285px;
    bottom: 4px;
    border-radius: 4px;
    background: #0078BC;
    pointer-events: auto !important;
}

.ScMan-PreferEditButtons {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 4px;
    align-self: stretch;
}

.ScMan-PreferEditButton {
    display: flex;
    min-width: 36px;
    max-width: 36px;
    min-height: 30px;
    max-height: 30px;
    padding: 3px;
    justify-content: center;
    align-items: center;
    border-radius: 2px;
    background: #E1EEFD;
}

    .ScMan-PreferEditButton img {
        height: 14px;
        width: 14px;
    }

.SM-EmployeeSelect {
    opacity: 0.7;
}

    .SM-EmployeeSelect:hover {
        opacity: 1;
        background: #F1F7FE !important;
    }

.ScMan-AddHuman {
    border: 1px solid #0078BC !important;
    position: relative;
}

.SM-AddHumanImg {
    display: flex;
    padding: 6px;
    align-items: center;
    position: absolute;
    left: 4px;
    bottom: 4px;
    border-radius: 4px;
    background: #0078BC;
    z-index: 3;
}

    .SM-AddHumanImg > img {
        flex-shrink: 0;
        cursor: pointer;
        height: 14px;
        width: 14px;
        filter: brightness(0) saturate(100%) invert(1);
    }

.ScMan-CatGrid {
    display: flex;
    flex: 1;
    flex-direction: column;
}

.ScMan-CatGrid1 {
    display: flex;
    width: 100%;
}

.ScMan-CategoryBar {
    display: flex;
    min-width: 100%;
    max-width: 100%;
    max-height: fit-content;
    padding: 10px 10px 12px 10px;
    align-items: center;
    gap: 8px;
    border-right: 1px solid #E5E5E5;
    border-bottom: 1px solid #E5E5E5;
    background: #F6F6F6;
    cursor: pointer;
}

    .ScMan-CategoryBar.SM-CatBarCollapsed > img {
        transform: rotate(180deg);
    }

    .ScMan-CategoryBar > span {
        color: #5F5F5F;
    }

.SM-EmployeeFixHeight {
    min-height: 86px !important;
    max-height: 86px !important;
    min-width: 100% !important;
    max-width: 100% !important;
}

.ScMan-EmployeesCol {
    display: flex;
    flex-direction: column;
    flex: 1;
}

.SM-RSegmentMEmp {
    min-width: 64px !important;
    max-width: 64px !important;
    padding: 12px 10px !important;
}

.SM-RSegment31 {
    min-width: calc((100% - 64px) / 31) !important;
    max-width: calc((100% - 64px) / 31) !important;
    padding: 2px !important;
    justify-content: center !important;
}

.SM-RSegment30 {
    min-width: calc((100% - 64px) / 30) !important;
    max-width: calc((100% - 64px) / 30) !important;
    padding: 2px !important;
    justify-content: center !important;
}

.SM-RSegment28 {
    min-width: calc((100% - 64px) / 28) !important;
    max-width: calc((100% - 64px) / 28) !important;
    padding: 2px !important;
    justify-content: center !important;
}

.SM-RSegment27 {
    min-width: calc((100% - 64px) / 27) !important;
    max-width: calc((100% - 64px) / 27) !important;
    padding: 2px !important;
    justify-content: center !important;
}

.SCM-BarSmallPadding {
    padding: 2px 2px 2px 3px !important;
}

footer > .SCM-FSegFirst {
    min-width: 64px !important;
    max-width: 64px !important;
    padding: 8px 0 !important;
    flex-direction: column !important;
}

footer > .SCM-FSeg31 {
    min-width: calc((100% - 64px) / 31) !important;
    max-width: calc((100% - 64px) / 31) !important;
    padding: 2px !important;
    justify-content: center !important;
    flex-direction: column !important;
}

footer > .SCM-FSeg30 {
    min-width: calc((100% - 64px) / 30) !important;
    max-width: calc((100% - 64px) / 30) !important;
    padding: 2px !important;
    justify-content: center !important;
    flex-direction: column !important;
}

footer > .SCM-FSeg28 {
    min-width: calc((100% - 64px) / 28) !important;
    max-width: calc((100% - 64px) / 28) !important;
    padding: 2px !important;
    justify-content: center !important;
    flex-direction: column !important;
}

footer > .SCM-FSeg27 {
    min-width: calc((100% - 64px) / 27) !important;
    max-width: calc((100% - 64px) / 27) !important;
    padding: 2px !important;
    justify-content: center !important;
    flex-direction: column !important;
}

.ScMan-FooterInfo {
    display: flex;
    margin-right: auto;
    align-items: center;
    gap: 8px;
}

.SCM-FInfoSegment {
    display: flex;
    padding: 8px 12px;
    align-items: center;
    gap: 8px;
    border-radius: 4px;
    border: 1px solid #EAEAEA;
    background: #FFF;
    min-height: 40px;
    max-height: 40px;
}

.SCM-FInfoSegCircle {
    width: 16px;
    height: 16px;
    border-radius: 50%;
}

.SCM-FInfoSegCircle2 {
    width: 16px;
    height: 16px;
    border-radius: 50%;
}

.SCM-FCircleFullGreen {
    border: 2px solid #3E941C;
}

.SCM-FCircleDottedBlue {
    border: 2px dashed #0078BC;
}

.SCM-FCircleGradientYellowBG {
    background: repeating-linear-gradient( 120deg, rgba(200, 200, 200, 0.7), rgba(200, 200, 200, 0.4) 2px, transparent 2px, transparent 5px ), #FFF4D3 !important;
}


.ScMan-DirectReports {
    display: flex;
    flex-direction: column;
    min-width: 100%;
    max-width: 100%;
    max-height: 100%;
    gap: 5px;
    overflow: hidden;
    background: #FFF;
}

    .ScMan-DirectReports > header {
        display: flex;
        justify-content: space-between;
        align-items: center;
        width: 100%;
    }

.ScMan-DRheaderLSide {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 16px;
}

.ScMan-DRheaderRSide {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
}

    .ScMan-DRheaderRSide > select,
    .ScMan-DRheaderRSide > button {
        min-height: 40px;
        max-height: 40px;
    }

    .ScMan-DRheaderRSide > button {
        gap: 8px !important;
    }

        .ScMan-DRheaderRSide > button > img {
            height: 18px;
            width: 18px;
        }

.ScMan-DirRBody {
    display: flex;
    min-width: 100%;
    max-width: 100%;
    max-height: 100%;
    overflow: hidden;
    border-top: 1px solid #EBEDEF;
    background: #FFF;
}

.ScMan-DRBLside {
    display: flex;
    min-width: 50%;
    max-width: 50%;
    padding: 24px;
    flex-direction: column;
    gap: 24px;
    border-right: 1px solid #EBEDEF;
    max-height: 100%;
    overflow: auto;
}

.ScMan-DRBRside {
    display: flex;
    min-width: 50%;
    max-width: 50%;
    padding: 24px;
    flex-direction: column;
    gap: 16px;
    max-height: 100%;
    overflow: auto;
    background: #F9FAFD;
}

.ScMan-DRBLside > header {
    display: flex;
    flex-direction: column;
    gap: 8px;
    align-self: stretch;
}

.ScMan-DRBLeftHeader {
    display: flex;
    flex-direction: column;
    gap: 12px;
    align-self: stretch;
}

.ScMan-DRBLeftHeader2 {
    display: flex;
    flex-direction: column;
    gap: 8px;
    align-self: stretch;
}

.ScMan-DRBLdisplayOptions {
    display: flex;
    width: 100%;
    flex-direction: column;
    gap: 8px;
}

    .ScMan-DRBLdisplayOptions > header {
        display: flex;
        justify-content: space-between;
        align-items: center;
        align-self: stretch;
    }


.ScMan-DRBDOgrid {
    display: flex;
    flex-direction: column;
    align-self: stretch;
    border-radius: 4px;
    border: 1px solid #E5E5E5;
}

    .ScMan-DRBDOgrid > header {
        display: flex;
        min-height: 42px;
        max-height: 42px;
        align-self: stretch;
        border-bottom: 1px solid #E3E3E3;
        background: #F9FAFD;
    }

    .ScMan-DRBDOgrid > .ScMan-DRBDOrow {
        display: flex;
        min-height: 56px;
        max-height: 56px;
        align-self: stretch;
        border-bottom: 1px solid #E3E3E3;
    }

    .ScMan-DRBDOgrid .ScMan-DRBDOrowBot {
        display: flex;
        min-height: 56px;
        max-height: 56px;
        align-self: stretch;
    }

    .ScMan-DRBDOgrid .ScMan-DRBDOcol1 {
        display: flex;
        min-width: 124px;
        max-width: 124px;
        padding: 8px 12px;
        align-items: center;
        border-right: 1px solid #E3E3E3;
    }

    .ScMan-DRBDOgrid .ScMan-DRBDOcol2 {
        display: flex;
        min-width: 109px;
        max-width: 109px;
        padding: 8px 12px;
        align-items: center;
        justify-content: center;
        border-right: 1px solid #E3E3E3;
    }

    .ScMan-DRBDOgrid .ScMan-DRBDOcol3 {
        display: flex;
        flex: 1;
        padding: 8px 12px;
        justify-content: space-between;
        align-items: center;
    }

.ScMan-DRBDOcolDisabled {
    opacity: 0.5;
    pointer-events: none;
}

.ScMan-DRBDOcol3 >img{
    cursor: pointer;
}
.ScMan-DRBDOcol3 > .ScMan-DRBDbubbleGroup {
    display: flex;
    align-items: center;
    gap: 8px;
}

.ScMan-DRBDbubbleGroup > .ScMan-DRBDbubble {
    display: flex;
    padding: 6px 10px;
    align-items: center;
    gap: 8px;
    border-radius: 99px;
    background: #E1EEFD;
    flex: 1 0 0;
}

.ScMan-DRBDbubbleEl > span {
    flex: 1 0 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.ScMan-DRBDbubble > span {
    flex: 1 0 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.ScMan-DRBminiShifts {
    display: flex;
    padding: 16px;
    align-items: center;
    gap: 40px;
    align-self: stretch;
    border-radius: 8px;
    border: 1px solid #EBEDEF;
    background: #FFF;
    box-shadow: 0px 8px 16px 0px rgba(0, 0, 0, 0.06);
}

.ScMan-miniShiftSegment {
    display: flex;
    flex-direction: column;
    min-height: 100%;
    gap: 8px;
}

    .ScMan-miniShiftSegment .ScMan-ShiftsBar {
        display: flex;
        padding: 4px 6px;
        flex-direction: column;
        align-items: center;
        gap: 4px;
    }

.ScMan-miniInnerLayer {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 5px;
    min-width: 141px;
    max-width: 141px;
}

    .ScMan-miniInnerLayer > header {
        display: flex;
        height: 24px;
    }

    .ScMan-miniInnerLayer .ScMan-miniInfo {
        display: flex;
        flex-direction: column;
        align-items: center;
        gap: 1px;
    }

    .ScMan-miniInnerLayer .ScMan-miniSelect {
        display: flex;
        flex-direction: column;
        min-width: 100%;
        max-width: 100%;
        gap: 3px;
    }

.ScMan-miniInfo span {
    text-align: center;
}

.ScMan-ConfShiftDefault {
    display: flex;
    padding: 16px;
    flex-direction: column;
    gap: 16px;
    flex: 1 0 0;
    align-self: stretch;
    border-radius: 8px;
    border: 1px solid #EBEDEF;
    background: #FFF;
    box-shadow: 0px 8px 16px 0px rgba(0, 0, 0, 0.06);
}

.ScMan-ShiftDefaultSeg {
    display: flex;
    padding: 12px;
    flex-direction: column;
    gap: 16px;
    align-self: stretch;
    border-radius: 4px;
    background: #F9FAFD;
}

.ScMan-ShiftDefaultInner {
    display: flex;
    flex-direction: column;
    width: 100%;
    gap: 12px;
    padding: 12px;
    border-radius: 4px;
    background: #F9FAFD;
}

    .ScMan-ShiftDefaultInner > header {
        display: flex;
        justify-content: space-between;
        align-items: center;
        align-self: stretch;
    }

    .ScMan-ShiftDefaultInner .SCM-ShiftDefaultChkBox {
        display: flex;
        align-items: center;
        gap: 7px;
    }

.ScMan-ShiftDefaultRow {
    display: flex;
    gap: 16px;
    align-self: stretch;
}

.ScMan-ShiftDefInSegCol {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 8px;
    flex: 1 0 0;
    max-width: calc((100% - 16px) / 2);
}

.ScMan-ShiftDefInSegCol2 {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 8px;
    flex: 1 0 0;
}

.ScMan-ShiftDefInSegRow {
    display: flex;
    gap: 8px;
    align-self: stretch;
    width: 100%;
    align-items: center;
}

    .ScMan-ShiftDefInSegRow .form-control {
        min-height: 40px;
        max-height: 40px;
    }

    .ScMan-ShiftDefInSegRow .SCM-Half-form-control {
        max-width: calc((100% - 8px) /2);
    }

.ScMan-SDCHourSelect {
    display: flex;
    flex-grow: 1;
    max-width: calc((100% - 8px) / 2);
    height: 40px;
    padding: 11px 14px;
    align-items: center;
    gap: 8px;
    border-radius: 4px;
    border: 1px solid #D2D5DA;
    background: #FFF;
}

.ScMan-SDCHourSelect2 {
    display: flex;
    flex-grow: 1;
    height: 40px;
    padding: 11px 14px;
    align-items: center;
    gap: 8px;
    border-radius: 4px;
    border: 1px solid #D2D5DA;
    background: #FFF;
}

.ScMan-ShiftDefInSegRow input {
    height: 100%;
    width: 100%;
    outline: none;
    border: none;
}
/*PopUps*/
.ScMan-AddEmployeesPU {
    display: flex;
    position: absolute;
    min-width: 430px;
    max-width: 430px;
    flex-direction: column;
    align-items: flex-start;
    border-radius: 8px;
    background: #FFF;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    z-index: 99999;
    box-shadow: 0px 20px 24px -4px rgba(16, 24, 40, 0.08), 0px 8px 8px -4px rgba(16, 24, 40, 0.03);
}

    .ScMan-AddEmployeesPU > header {
        display: flex;
        padding: 12px 24px;
        align-items: center;
        gap: 14px;
        align-self: stretch;
    }

    .ScMan-AddEmployeesPU > .ScMan-PopAESegment {
        display: flex;
        padding: 24px;
        flex-direction: column;
        align-items: flex-start;
        gap: 16px;
        align-self: stretch;
        border-top: 1px solid rgba(238, 238, 238, 0.93);
        border-bottom: 1px solid rgba(238, 238, 238, 0.93);
    }

    .ScMan-AddEmployeesPU > footer {
        display: flex;
        padding: 16px 24px;
        justify-content: space-between;
        align-items: center;
        align-self: stretch;
        border-radius: 0 0 8px 8px;
    }

.SCM-SelectEmployeesPAE {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 8px;
    align-self: stretch;
}

.SCM-TheEmployeesPAE {
    display: flex;
    align-items: center;
    align-content: center;
    gap: 8px;
    align-self: stretch;
    flex-wrap: wrap;
}

    .SCM-TheEmployeesPAE > .SCM-PAEBubble {
        display: flex;
        height: 32px;
        padding: 4px 8px;
        align-items: center;
        gap: 10px;
        border-radius: 99px;
        background: #E1EEFD;
    }

.ScMan-NumberOfShifts {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    border-radius: 8px;
    background: #FFF;
    z-index: 99999;
    box-shadow: 0px 20px 24px -4px rgba(16, 24, 40, 0.08), 0px 8px 8px -4px rgba(16, 24, 40, 0.03);
}

.SCM-NoS-Segment {
    display: flex;
    padding: 8px;
    flex-direction: column;
    align-items: flex-start;
    gap: 8px;
    align-self: stretch;
}

.SCM-AddRemoveNoS {
    display: flex;
    min-height: 40px;
    max-height: 40px;
    padding: 0px 1px;
    justify-content: space-between;
    align-items: center;
    align-self: stretch;
    border-radius: 4px;
    border: 1px solid #E5E5E5;
    background: #FFF;
}

.ScMan-NumberOfShifts > footer {
    display: flex;
    padding: 12px 24px;
    align-items: center;
    gap: 8px;
    border-top: 1px solid #E5E5E5;
    background: #F9FAFD;
    border-radius: 0 0 8px 8px;
}

.ScMan-NotifyEmployees {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    border-radius: 8px;
    background: #FFF;
    z-index: 99999;
    box-shadow: 0px 20px 24px -4px rgba(16, 24, 40, 0.08), 0px 8px 8px -4px rgba(16, 24, 40, 0.03);
}

    .ScMan-NotifyEmployees > header {
        display: flex;
        padding: 12px 24px;
        align-items: center;
        gap: 12px;
        align-self: stretch;
    }

        .ScMan-NotifyEmployees > header > .ScMan-DefaultSettings {
            display: flex;
            align-items: center;
            margin-left: auto;
        }

.ScMan-DefaultSettings > .form-control {
    border-radius: 4px 0px 0px 4px !important;
    min-width: 216px !important;
    min-height: 40px !important;
}

.ScMan-DefaultSettings > .ScMan-DefSetDelete {
    display: flex;
    min-width: 40px;
    max-width: 40px;
    min-height: 40px;
    max-height: 40px;
    padding: 0px 12px;
    justify-content: center;
    align-items: center;
    border-radius: 0px 4px 4px 0px;
    border-top: 1px solid #E5E5E5;
    border-right: 1px solid #E5E5E5;
    border-bottom: 1px solid #E5E5E5;
    background: #FFF;
    cursor: pointer;
}

header > .ScMan-NotEmIcon {
    display: flex;
    padding: 8px;
    justify-content: center;
    align-items: center;
    gap: 10px;
    border-radius: 28px;
    background: #F1F7FE;
}

.ScMan-NotifyEmployees > .ScMan-NotEmBody {
    display: flex;
    max-height: 334px;
    padding: 24px;
    flex-direction: column;
    align-items: flex-start;
    gap: 16px;
    align-self: stretch;
    overflow: auto;
    border-top: 1px solid rgba(238, 238, 238, 0.93);
    border-bottom: 1px solid rgba(238, 238, 238, 0.93);
}

.ScMan-NotEmInfoBox {
    display: flex;
    padding: 12px;
    align-items: flex-start;
    gap: 8px;
    align-self: stretch;
    border-radius: 4px;
    background: #F1F7FE;
}

.ScMan-Line {
    min-height: 1px;
    max-height: 1px;
    min-width: 100%;
    max-width: 100%;
    background: #E6E6E7;
}

.ScMan-NotEmRow {
    display: flex;
    align-items: flex-start;
    gap: 16px;
    align-self: stretch;
    align-items: center;
}

.ScMan-NotEmRow2 {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 12px;
    align-self: stretch;
}

.ScMan-NotEmRow3 {
    display: flex;
    align-items: flex-start;
    gap: 8px;
    align-self: stretch;
}

.ScMan-NotEmRow4 {
    display: flex;
    align-items: flex-start;
    gap: 12px;
    align-self: stretch;
}

.ScMan-NotEmRecurrentDate {
    display: flex;
    min-height: 40px;
    max-height: 40px;
    padding: 10px 12px;
    justify-content: flex-end;
    align-items: center;
    gap: 8px;
    border-radius: 4px;
    background: #F6F6F6;
}

    .ScMan-NotEmRecurrentDate img {
        width: 20px;
        height: 20px;
        filter: grayscale(1) brightness(0.3725);
        opacity: 80%;
    }

.ScMan-NotEmRow > .ScMan-NotEmSelect {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: flex-start;
    max-width: calc((100% - 8px) / 2);
    gap: 8px;
    flex: 1 0 0;
}

.ScMan-NotEmRow > .ScMan-NotEmSelect2 {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: flex-start;
    gap: 8px;
    flex: 1 0 0;
}

.ScMan-NotEmSelect > span, .ScMan-NotEmSelect-Color > span {
    color: #5F5F5F;
}


.ScMan-NotEmChkB {
    display: flex;
    align-items: center;
    gap: 12px;
    max-width: calc((100% - 8px) / 2);
    flex: 1 0 0;
}

.ScMan-NotEmChkB1 {
    display: flex;
    align-items: center;
    gap: 12px;
    flex: 1 0 0;
}

.ScMan-NotEmSelect > input,
.ScMan-NotEmSelect > select,
.ScMan-NotEmSelect2 > select,
.ScMan-NotEmSelect2 > input {
    min-height: 40px;
    max-height: 40px;
}

.ScMan-NotEmSelect2 > textarea {
    min-height: 80px;
    max-height: 80px;
}

.ScMan-NotifyEmployees > footer {
    display: flex;
    padding: 16px 24px;
    justify-content: space-between;
    align-items: center;
    align-self: stretch;
    border-radius: 0 0 8px 8px;
}

    .ScMan-NotifyEmployees > footer > .ScMan-footerButtonGroup {
        display: flex;
        align-items: flex-start;
        gap: 12px;
    }

.ScMan-ToggleButtonOff {
    display: flex;
    width: 36px;
    height: 20px;
    padding: 2px 2px 2px 0;
    align-items: center;
    border-radius: 12px;
    background: #E3E3E3;
    cursor: pointer;
}

.ScMan-ToggleButtonOn {
    display: flex;
    width: 36px;
    height: 20px;
    padding: 2px 0 2px 2px;
    justify-content: flex-end;
    align-items: center;
    border-radius: 12px;
    background: #0078BC;
    cursor: pointer;
}

/*View Assigned Schedules */
.ScMan-ViewASchedule {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    border-radius: 8px;
    background: #FFF;
    z-index: 99999;
    box-shadow: 0px 20px 24px -4px rgba(16, 24, 40, 0.08), 0px 8px 8px -4px rgba(16, 24, 40, 0.03);
    overflow: hidden;
}

    .ScMan-ViewASchedule > header {
        display: flex;
        padding: 16px 24px;
        gap: 12px;
        align-items: center;
        align-self: stretch;
        border-radius: 8px 8px 0px 0px;
        border-bottom: 1px solid #EEE;
        background: #FFF;
    }

.SCM-VASheaderSeg {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 4px;
}

.SCM-VASBody {
    display: flex;
    gap: 16px;
    max-height: 100%;
    width: 100%;
    overflow: hidden;
}

.SCM-VASBody .SCM-VASbodyLS {
    display: flex;
    min-width: 240px;
    max-width: 240px;
    padding: 4px 8px;
    flex-direction: column;
    gap: 8px;
    border-radius: 8px 0px 0px 8px;
    border-right: 1px solid #E5E5E5;
    max-height: 100%;
    overflow: hidden;
}
.SCM-VASBody .SCM-VASbodyLS-Items {
    display: flex;
    flex-direction: column;
    overflow: auto;
    gap: 8px;
}

.SCM-VASBody .SCM-VASbodyRS {
    display: flex;
    padding: 16px 24px 16px 0px;
    flex-direction: column;
    gap: 16px;
    flex: 1 0 0;
    max-height: 100%;
    align-self: stretch;
    overflow: auto;
}

.SCM-VASSchBar {
    display: flex;
    padding: 12px;
    flex-direction: column;
    gap: 8px;
    border-radius: 8px;
    cursor: pointer;
}

    .SCM-VASSchBar > span {
        white-space: nowrap;
        max-width: 100%;
        overflow: hidden;
        text-overflow: ellipsis;
    }

.SCM-VASInfoSchBar {
    display: flex;
    height: 25px;
    padding: 1px 10px;
    justify-content: center;
    align-items: center;
    gap: 10px;
    border-radius: 4px;
}

.SCM-VASSchBar.SCM-VASActive {
    background: #F1F7FE;
}

    .SCM-VASSchBar.SCM-VASActive:hover {
        background: #E1EEFD;
    }

.SCM-VASSchBar.SCM-VASActiveSel {
    border: 1px solid #81C2F8;
    background: #E1EEFD;
}

.SCM-VASActive1 {
    border: 1px solid white;
    background: white !important;
}

.SCM-VASSchBar.SCM-VASActiveSel1 {
    border: 1px solid #81C2F8;
    background-color: #F1F7FE !important;
}

.SCM-VASSchBar.SCM-VASActive > .SCM-VASInfoSchBar {
    background: #F4EBFF;
}

    .SCM-VASSchBar.SCM-VASActive > .SCM-VASInfoSchBar > span {
        color: #734CA4;
    }

.SCM-VASSchBar.SCM-VASNotActive {
    background: #F6F6F6;
}

    .SCM-VASSchBar.SCM-VASNotActive:hover {
        background: #EBEBEB;
    }

.SCM-VASSchBar.SCM-VASNotActiveSel {
    border: 1px solid #C8C8C8;
    background: #EBEBEB;
}

.SCM-VASSchBar.SCM-VASNotActive > .SCM-VASInfoSchBar {
    background: #C8C8C8;
}

    .SCM-VASSchBar.SCM-VASNotActive > .SCM-VASInfoSchBar > span {
        color: #5F5F5F;
    }

.SCM-VASInfoSchBar.SCM-VASEmployeeSchedule {
    background: #FEF7DF !important;
}

    .SCM-VASInfoSchBar.SCM-VASEmployeeSchedule > span {
        color: #BA9514 !important;
    }

.ScMan-VASsearchFilter {
    display: flex;
    gap: 8px;
    max-width: 100%;
    flex-direction: column;
}

.ScMan-VASFilter {
    display: flex;
    min-width: 40px;
    max-width: 40px;
    min-height: 40px;
    max-height: 40px;
    padding: 4px;
    max-height: 40px;
    justify-content: center;
    align-items: center;
    cursor: pointer;
    border-radius: 4px;
    border: 1px solid #E5E5E5;
    background: #FFF;
}

    .ScMan-VASFilter:hover {
        background: #81C2F8;
        border: 1px solid #81C2F8;
    }

    .ScMan-VASFilter.Selected {
        background: #0078BC;
        border: 1px solid #81C2F8;
    }

.SCM-VASSearch {
    display: flex;
    max-width: 100%;
    padding: 0 8px;
    gap: 8px;
    border-radius: 4px;
    border: 1px solid #E5E5E5;
    background: #FFF;
    align-items: center;
    min-height: 40px;
    max-height: 40px;
}

    .SCM-VASSearch > input {
        border: none;
        outline: none;
        width: 100%;
    }

.SCM-VASbodyRS > header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    align-self: stretch;
}

.SCM-VASRSheaderText {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: flex-start;
    gap: 4px;
}

.SCM-VASRSheaderTrash {
    display: flex;
    width: 40px;
    height: 40px;
    padding: 6px 10px;
    justify-content: center;
    align-items: center;
    cursor: pointer;
    border-radius: 4px;
    background: #FEF3F2;
}

.SCM-VASRSheaderButtons {
    display: flex;
    gap: 8px;
}

.SCM-VASRSheaderButton {
    display: flex;
    min-height: 40px;
    max-height: 40px;
    padding: 10px;
    justify-content: center;
    align-items: center;
    border-radius: 4px;
    border: 1px solid #E5E5E5;
    cursor: pointer;
    background: #FFF;
}

    .SCM-VASRSheaderButton > img {
        height: 20px;
        width: 20px;
        filter: grayscale(1) brightness(0.3725);
        opacity: 80%;
    }

.SCM-VASRSheaderTrash > img {
    height: 18px;
    width: 18px;
}

.SCM-VASRSdisclamer {
    display: flex;
    padding: 12px;
    align-items: flex-start;
    gap: 8px;
    align-self: stretch;
    background: #FFFAEC;
}

.SCM-VASRSdate {
    display: flex;
    padding: 16px;
    align-items: flex-start;
    gap: 16px;
    align-self: stretch;
    border-radius: 4px;
    background: #F1F7FE;
}

.SCM-VASRSdateSeg {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: flex-start;
    gap: 8px;
    flex: 1 0 0;
    max-width: calc((100% - 16px) / 2);
}

    .SCM-VASRSdateSeg > input {
        min-height: 40px;
        max-height: 40px;
    }

.ScMan-VASRSdatesInfo {
    display: flex;
    gap: 8px;
    align-self: stretch;
    max-width: 100%;
}


.ScMan-VASRSdateInfo {
    display: flex;
    height: 40px;
    padding: 10px 12px;
    align-items: center;
    gap: 8px;
    flex: 1 0 0;
    max-width: calc((100% - 8px) / 2);
    border-radius: 4px;
    background: #FAFAFA;
}

    .ScMan-VASRSdateInfo img {
        width: 16px;
        height: 16px;
        filter: grayscale(1) brightness(0.3725);
        opacity: 80%;
    }

.SCM-VASRSshifts {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 8px;
    align-self: stretch;
}

.SCM-VASRSshiftRow {
    display: flex;
    align-items: flex-start;
    gap: 8px;
    align-self: stretch;
    flex-wrap: wrap;
}

.SCM-VASRSshiftRow2 {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 12px;
    align-self: stretch;
}

.SCM-VASRSshiftRow3 {
    display: flex;
    align-items: center;
    gap: 7px;
    align-self: stretch;
}

.SCM-VASRSshiftRow2 span {
    color: #5F5F5F;
}

.SCM-VASRSshiftSeg {
    display: flex;
    padding: 8px;
    justify-content: center;
    gap: 8px;
    flex: 1 0 0;
    max-width: calc((100% - 16px) / 3);
    border-radius: 4px;
    background: #F1F7FE;
}

.SCM-VASRSshiftSeg2 {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 4px;
}

.SCM-VASRSshiftSeg3 {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: flex-start;
    gap: 4px;
}

.SCM-VASRSshiftBubble {
    display: flex;
    padding: 4px 6px;
    align-items: center;
    gap: 10px;
    border-radius: 2px;
}

    .SCM-VASRSshiftBubble.SCM-VASRSEmerald {
        background: #D9F3EE;
    }

        .SCM-VASRSshiftBubble.SCM-VASRSEmerald > span {
            color: #07856C;
        }

    .SCM-VASRSshiftBubble.SCM-VASRSOrange {
        background: #FFFAEC;
    }

        .SCM-VASRSshiftBubble.SCM-VASRSOrange > span {
            color: #EB7C10;
        }

    .SCM-VASRSshiftBubble.SCM-VASRSPurple {
        background: #F4EBFF;
    }

        .SCM-VASRSshiftBubble.SCM-VASRSPurple > span {
            color: #8C58CB;
        }

.ScMan-ViewASchedule > footer {
    display: flex;
    padding: 16px 24px;
    justify-content: space-between;
    align-items: center;
    align-self: stretch;
    border-radius: 0px 0px 8px 8px;
    border-top: 1px solid rgba(238, 238, 238, 0.93);
    background: #FFF;
}
/*View Assigned Schedules End */



    .ScMan-LocPBody > header {
        display: flex;
        justify-content: space-between;
        align-items: center;
        align-self: stretch;
    }

.ScMan-LocPBheaderR {
    display: flex;
    align-items: center;
    gap: 8px;
    padding-right: 16px;
}

.ScMan-LocPgrid {
    display: flex;
    max-height: 100%;
    flex-direction: column;
    align-self: stretch;
    overflow: auto;
}

    .ScMan-LocPgrid > header {
        display: flex;
        padding: 12px 16px 12px 16px;
        justify-content: space-between;
        align-self: stretch;
        border-radius: 4px 4px 0px 0px;
        border: 1px solid #E5E5E5;
        background: #F9FAFD;
    }

.ScMan-LocGridRowR {
    display: flex;
    align-items: center;
    gap: 64px;
}

.ScMan-LocGridRowL {
    display: flex;
    align-items: center;
    gap: 8px;
}

.ScMan-LocGridRow {
    display: flex;
    padding: 12px 16px;
    align-items: center;
    gap: 48px;
    align-self: stretch;
    border-right: 1px solid #E5E5E5;
    border-bottom: 1px solid #E5E5E5;
    border-left: 1px solid #E5E5E5;
    background: #FFF;
}

.ScMan-LocFooterSel {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-right: auto;
}


/*Color Configuration*/
.ScMan-ColorConfigPop {
    display: flex;
    position: absolute;
    min-width: 800px;
    max-width: 800px;
    max-height: 784px;
    flex-direction: column;
    align-items: flex-start;
    border-radius: 8px;
    background: #FFF;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    z-index: 99999;
    box-shadow: 0px 20px 24px -4px rgba(16, 24, 40, 0.08), 0px 8px 8px -4px rgba(16, 24, 40, 0.03);
    overflow: hidden;
}

    .ScMan-ColorConfigPop > header {
        display: flex;
        padding: 12px 24px;
        align-items: center;
        gap: 12px;
        align-self: stretch;
    }

.ScMan-ColorCbody {
    display: flex;
    padding: 24px;
    flex-direction: column;
    gap: 16px;
    align-self: stretch;
    border-top: 1px solid rgba(238, 238, 238, 0.93);
    border-bottom: 1px solid rgba(238, 238, 238, 0.93);
    max-height: 100%;
    overflow: hidden;
}

    .ScMan-ColorCbody > header {
        display: flex;
        flex-direction: column;
        gap: 8px;
    }

        .ScMan-ColorCbody > header > select {
            max-height: 40px;
            min-height: 40px;
        }

.ScMan-ColorCbody2 {
    display: flex;
    flex-direction: column;
    max-height: 100%;
    overflow: hidden;
    gap: 12px;
    align-self: stretch;
}

    .ScMan-ColorCbody2 > header {
        display: flex;
        justify-content: space-between;
        align-items: center;
        align-self: stretch;
    }

.ScMan-ColorConfRanButton {
    display: flex;
    padding: 8px 12px;
    align-items: center;
    gap: 7px;
    border-radius: 6px;
    background: #F3F6FF;
    cursor: pointer;
}

.ScMan-ColorCgrid {
    display: flex;
    flex-direction: column;
    max-height: 100%;
    overflow: auto;
    align-self: stretch;
    border-radius: 4px;
}

    .ScMan-ColorCgrid > header {
        display: flex;
        align-self: stretch;
        background: #F9FAFD;
        border: 1px solid #E5E5E5;
    }

.ScMan-ColorCGRowR {
    display: flex;
    min-width: 342px;
    max-width: 342px;
    min-height: 40px;
    max-height: 40px;
    padding: 12px 8px;
    align-items: center;
}

.ScMan-ColorCGRowL {
    display: flex;
    min-height: 40px;
    max-height: 40px;
    padding: 12px 30px 12px 14px;
    align-items: center;
    gap: 8px;
    flex: 1 0 0;
}

.ScMan-ColorCGRow {
    display: flex;
    align-items: center;
    align-self: stretch;
    border-bottom: 1px solid #E5E5E5;
    border-left: 1px solid #E5E5E5;
    border-right: 1px solid #E5E5E5;
    background: #FFF;
}

.ScMan-ColorConfColorBox {
    display: flex;
    min-height: 24px;
    max-height: 24px;
    min-width: 40px;
    max-width: 40px;
    border-radius: 4px;
    background: #DB80FF;
    cursor: pointer;
}
/*Color configuration end*/

/*Assign Unassign*/
.ScMan-AssignAsOf {
    display: flex;
    position: absolute;
    min-width: 600px;
    max-width: 600px;
    flex-direction: column;
    align-items: flex-start;
    border-radius: 8px;
    background: #FFF;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    z-index: 99999;
    box-shadow: 0px 20px 24px -4px rgba(16, 24, 40, 0.08), 0px 8px 8px -4px rgba(16, 24, 40, 0.03);
}

    .ScMan-AssignAsOf > header {
        display: flex;
        padding: 12px 24px;
        align-items: center;
        align-self: stretch;
        border-bottom: 1px solid rgba(238, 238, 238, 0.93);
    }

.ScMan-AAObody {
    display: flex;
    flex-direction: column;
    padding: 12px 24px;
    align-items: center;
    gap: 14px;
    align-self: stretch;
}

.ScMan-AAObRow {
    display: flex;
    align-items: center;
    gap: 8px;
    align-self: stretch;
    flex-wrap: wrap;
}

.ScMan-AAObRow2 {
    display: flex;
    flex-direction: column;
    gap: 8px;
    align-self: stretch;
}

.ScMan-AAObubble {
    display: flex;
    gap: 6px;
    padding: 4px 8px;
    align-self: stretch;
    border-radius: 99px;
    background: #E1EEFD;
    max-width: calc((100% - 36px) / 5) !important;
    min-width: calc((100% - 36px) / 5) !important;
    min-height: 30px;
    max-height: 30px;
    overflow: hidden;
}


    .ScMan-AAObubble img {
        border-radius: 10px !important;
    }

    .ScMan-AAObubble span {
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
        flex: 1;
    }
/*Assign unassign end*/

/*Auto Assign Shifts */
.ScMan-AutoAssignP {
    display: flex;
    flex-direction: column;
    border-radius: 8px;
    background: #FFF;
    z-index: 99999;
    overflow: hidden;
}

    .ScMan-AutoAssignP > header {
        display: flex;
        padding: 16px 24px;
        align-items: center;
        gap: 22px;
        align-self: stretch;
    }

.ScMan-AAPheaderL {
    display: flex;
    align-items: center;
    gap: 12px;
}

.ScMan-AAPheaderR {
    display: flex;
    align-items: center;
    flex: 1;
}

.ScMan-AutoAssignP > footer {
    display: flex;
    padding: 16px 24px;
    justify-content: space-between;
    align-items: center;
    align-self: stretch;
    border-radius: 0px 0px 8px 8px;
    background: #FFF;
}

    .ScMan-AutoAssignP > footer > .ScMan-AAPfButtons {
        display: flex;
        gap: 12px;
    }

.ScMan-AAPheaderLspan {
    display: flex;
    max-width: 422px;
    flex-direction: column;
    justify-content: center;
    gap: 4px;
}

.ScMan-AAPTrash {
    display: flex;
    min-width: 30px;
    max-width: 30px;
    min-height: 30px;
    max-height: 30px;
    padding: 0px 12px;
    justify-content: center;
    align-items: center;
    cursor: pointer;
    border-radius: 0px 4px 4px 0px;
    border-top: 1px solid #E5E5E5;
    border-right: 1px solid #E5E5E5;
    border-bottom: 1px solid #E5E5E5;
    background: #FFF;
}

.ScMan-AAPBody {
    display: flex;
    padding: 8px;
    flex-direction: column;
    gap: 16px;
    align-self: stretch;
    border-top: 1px solid rgba(238, 238, 238, 0.93);
    border-bottom: 1px solid rgba(238, 238, 238, 0.93);
    max-height: 100%;
    overflow: auto;
}


.ScMan-AAPSelShifts {
    display: flex;
    align-self: stretch;
    padding: 10px;
    flex-direction: column;
    gap: 8px;
    border-radius: 4px;
    background: #F1F7FE;
    max-height: 340px;
}

    .ScMan-AAPSelShifts > header,
    .ScMan-AAPSelShifts > footer{
        display: flex;
        align-items: center;
        justify-content: space-between;
        align-self: stretch;
    }

.ScMan-AAPSelShiftsHL {
    display: flex;
    align-items: center;
    gap: 7px;
    flex: 1 0 0;
}

.ScMan-AAPSelShiftsHR {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 8px;
    cursor: pointer;
}

.ScMan-AAPSelShiftBody {
    display: flex;
    flex-direction: column;
    gap: 4px;
    align-self: stretch;
    max-height: 100%;
    overflow: auto;
    margin-top: 4px;
}

.ScMan-AAPSelShiftBody2 {
    display: flex;
    gap: 16px;
    align-self: stretch;
}

.ScMan-AAPSelShiftRow2 {
    display: flex;
    flex-direction: column;
    gap: 8px;
    flex: 1 0 0;
}

.ScMan-AAPSelShiftRow {
    display: flex;
    align-items: flex-start;
    gap: 8px;
    align-self: stretch;
    max-width: 100%;
    width: 100%;
    margin-top: 4px;
    overflow: hidden;
    overflow-y: hidden;
    overflow-y: auto;
    flex-wrap: wrap;
    max-height: 300px !important;
}

.ScMan-AAPSelShiftRSeg {
    display: flex;
    position: relative;
    padding: 8px 12px !important;
    flex-direction: column;
    align-items: center;
    gap: 2px !important;
    flex: 1 0 0;
    max-width: calc((100% - 36px) / 5) !important;
    min-width: calc((100% - 36px) / 5) !important;
    background: #D9E9FC !important;
}

.ScMan-AAPSelShiftRSegX {
    display: flex;
    padding: 4px;
    align-items: center;
    position: absolute;
    right: -4.4px;
    top: -4px;
    border-radius: 99px;
    background: #FFF;
    box-shadow: 0px 8px 12px 0px rgba(0, 0, 0, 0.08);
    cursor: pointer;
    z-index: 4;
    overflow: visible;
}

.ScMan-AAPBody3 {
    display: flex;
    padding: 0px;
    flex-direction: row;
    gap: 0px;
    align-self: stretch;
    flex-wrap: wrap;
    max-width: 100%;
}

.ScMan-AAPBody3-Item {
    display: flex;
    flex-direction: column;
    width: 50%;
    padding: 10px;
}

.ScMan-AAPBody3.ScMan-AAPBody3sel {
    border-radius: 4px;
    background: #F1F7FE;
}

    .ScMan-AAPBody3 header {
        display: flex;
        align-items: center;
        gap: 7px;
        align-self: stretch;
    }

/*Auto Assign Shifts end*/

/*Shift Swap pop*/
.ScMan-ShiftSwap {
    display: flex;
    position: absolute;
    flex-direction: column;
    border-radius: 8px;
    background: #FFF;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    z-index: 99999;
    box-shadow: 0px 20px 24px -4px rgba(16, 24, 40, 0.08), 0px 8px 8px -4px rgba(16, 24, 40, 0.03);
}

    .ScMan-ShiftSwap > header {
        display: flex;
        padding: 12px 24px;
        justify-content: space-between;
        align-items: center;
        align-self: stretch;
    }

    .ScMan-ShiftSwap > footer {
        display: flex;
        padding: 16px 24px;
        justify-content: space-between;
        align-items: center;
        align-self: stretch;
    }

        .ScMan-ShiftSwap > footer button {
            max-height: 44px;
            min-height: 44px;
            display: flex !important;
            justify-content: center;
            align-items: center;
        }

.ScMan-SSBtnGroup {
    display: flex;
    gap: 12px;
}

.ScMan-SSheaderL {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 12px;
}

.ScMan-SSinfoBubble {
    display: flex;
    padding: 4px 8px;
    justify-content: center;
    align-items: center;
    border-radius: 4px;
}

.ScMan-SSinfoOrange {
    background: #FFF4D3;
}

    .ScMan-SSinfoOrange > span {
        color: #A1460B;
    }

.ScMan-SSButton {
    display: flex;
    width: 40px;
    height: 40px;
    justify-content: center;
    align-items: center;
    cursor: pointer;
    border-radius: 4px;
    border: 1px solid #E1EEFD;
    background: #F1F7FE;
}

.ScMan-SSBody {
    display: flex;
    padding: 16px 24px;
    flex-direction: column;
    gap: 16px;
    border-top: 1px solid rgba(238, 238, 238, 0.93);
    border-bottom: 1px solid rgba(238, 238, 238, 0.93);
}

.ScMan-SSRow1 {
    display: flex;
    align-items: center;
    gap: 24px;
}

.ScMan-SSCard {
    display: flex;
    flex: 1;
    flex-direction: column;
    padding: 12px;
    align-items: flex-start;
    gap: 12px;
    border-radius: 8px;
    background: #F1F7FE;
}

    .ScMan-SSCard > header {
        display: flex;
        align-items: center;
        gap: 8px;
    }

.ScMan-SSCardBody {
    display: flex;
    flex-direction: column;
    gap: 8px;
    align-self: stretch;
}

.ScMan-SSCardRow {
    display: flex;
    padding: 10px 12px;
    align-items: center;
    gap: 8px;
    align-self: stretch;
    border-radius: 4px;
    background: #FFF;
}

.ScMan-SSCardLine {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 8px;
    align-self: stretch;
}

.ScMan-SSCardSwap {
    display: flex;
    min-width: 28px;
    max-width: 28px;
    min-height: 26px;
    max-height: 26px;
    align-items: center;
    justify-content: center;
    margin-top: auto;
    margin-bottom: auto;
    border-radius: 4px;
    background: #0078BC;
}

.ScMan-Hline1 {
    min-width: 1px;
    max-width: 1px;
    height: 100%;
    background: #E6E6E7;
}

.ScMan-SSDifference {
    display: flex;
    min-height: 40px;
    max-height: 40px;
    padding: 10px 12px;
    justify-content: center;
    align-items: center;
    gap: 8px;
    align-self: stretch;
    border-radius: 4px;
    background: #F6F6F6;
}

.ScMan-SSComments {
    display: flex;
    flex-direction: column;
    justify-content: center;
    gap: 8px;
    align-self: stretch;
}

.ScMan-EmpRow .ScMan-ShiftsBar.shift-dragging {
    background: white !important;
}

.ScMan-SInfoTextBox-Labor .pods-btn-group, .ScMan-SInfoTextBox-Labor .pods-btn-group .multiselect {
    flex: 1;
    overflow: hidden;
}

    .ScMan-SInfoTextBox-Labor .pods-btn-group .multiselect {
        flex: 1;
        overflow: hidden;
    }


.ScMan-SInfoTextBox-Labor button.multiselect.dropdown-toggle {
    background: none !important;
}

.ScMan-SInfoTextBox-Labor span.multiselect-selected-text {
    width: 100%;
    overflow: hidden;
    display: block;
    text-align: left;
    font-size: 0.9em;
}

.ScMan-SInfoTextBox-Labor button.multiselect {
    padding: 0px;
    border: none;
}

.ScMan-SInfoTextBox-Labor .caret {
    display: none;
}

.ScMan-SInfoTextBox-Labor .pods-btn-group {
    background: none;
    border-radius: 0px;
    padding: 0px;
    margin: 0px;
    height: auto;
}

.ScMan-ShiftsBar.no-filter-match{
    opacity: 0.4;
}


.ScMan-ShiftsBar.no-filter-match:hover{
    opacity: 1;
}

.SCM-ShiftButtonsEdit .dropdown-menu{
    padding: 0px !important;
}

    .SCM-ShiftButtonsEdit .dropdown-menu .MoreMenu {
        padding: 4px !important;
        gap: 4px !important;
    }

    .SCM-ShiftButtonsEdit .dropdown-menu .MoreMenu .MMRow {
        padding: 6px !important;
    }


.ScMan-MainGrid.organizeBy{
    overflow: hidden !important;
}


    .ScMan-MainGrid.organizeBy .StickyEmployee {
        border-right: none !important;
    }


    .ScMan-MainGrid.organizeBy .ScMan-HSegment-EmployeeName, .ScMan-MainGrid.organizeBy .ScMan-FSegment-EE {
        width: 161px !important;
        min-width: 161px !important;
        max-width: 161px !important;
    }



.SCM-ShiftFloatButton {
    position: sticky;
    bottom: 4px;
    left: 0px;
    opacity: 1;
    z-index: 9;
    display: none;
    cursor: pointer;
    margin-top: -34px;
    align-self: baseline;
}

    .SCM-ShiftFloatButton .SCM-ShiftButtonEdit {
        min-width: 30px !important;
        min-height: 30px !important;
        max-width: 30px !important;
        max-height: 30px !important;
        border-radius: 4px;
    }

.ScMan-RSegment:hover .SCM-ShiftFloatButton {
    display: flex;
}

.list-type-MonthList .SCM-ShiftFloatButton {
    margin-top: -5px;
    gap: 1px;
    flex-direction: column;
    align-items: center;
    width: 100%;
}

.list-type-MonthList .ScMan-CoffeeButtons .ScMan-CoffeeButton:not(.SM-CoffeeRed) {
    display: none !important;
}

.list-type-MonthList .ScMan-ShiftsInfo {
    flex-direction: column;
}

.ScMan-ShiftsBar.No-Work {
    background: repeating-linear-gradient( 120deg, rgba(200, 200, 200, 0.4), rgba(200, 200, 200, 0.4) 2px, transparent 2px, transparent 20px ), #F6F6F6 !important;
}


.ScMan-ShiftsInfo .multiselect-container.dropdown-menu input.multiselect-search {
    height: 30px !important;
    margin: 4px !important;
}

.ScMan-ShiftsInfo .multiselect-container.dropdown-menu li a {
    padding: 0px !important;
    padding-left: 8px !important;
    padding-right: 8px !important;
}

.home-icon-labor{
    color: inherit !important;
}

.dropdown-menu li a.home-icon-labor, .ScMan-ShiftsInfo .multiselect-container.dropdown-menu li a.home-icon-labor {
    width: auto !important;
    display: flex;
    align-self: center;
    padding: 0px !important;
    padding-left: 0px !important;
    padding-right: 4px !important;
}

.Scm-bulk-actons-text {
    color: #5F5F5F;
    font-size: 1.1em;
}

.shift-ee-select-div {
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0px;
    left: 0px;
    z-index: 10;
    cursor: pointer;
}

.selectionMode .ScMan-ShiftsBar:not(.SelectedShift){
    opacity: 0.5 !important;
}

.selectionMode .ScMan-ShiftsBar:not(.SelectedShift):hover {
    opacity: 1 !important;
}

.selectAssignEmployees .ScMan-OpenShifts .ScMan-ShiftsBar:not(.SelectedShift) {
    opacity: 0.5 !important;
}

.ScMan-AAPBody input[type="checkbox"]{
    cursor: pointer;
}

.SelectBox .pods-btn-group {
    height: 30px !important;
    width: 100% !important;
}

.ShiftDetailsLabor .RowSide {
    width: 50% !important;
}

.ShiftDetailsLabor .SelectBox {
    width: 100% !important;
}

.selectEmployees .ScMan-EmpRow:not(.SelectedEE), .assignEmployees .ScMan-EmpRow:not(.AssignedEE) {
    opacity: 0.5;
}

    .selectEmployees .ScMan-EmpRow:not(.SelectedEE):hover, .assignEmployees .ScMan-EmpRow:not(.AssignedEE):hover {
        opacity: 0.7;
    }

.assignEmployees .ScMan-ShiftsBar:not(.AssignedShift) {
    opacity: 0.5 !important;
}

    .assignEmployees .ScMan-ShiftsBar:not(.AssignedShift):hover {
        opacity: 0.7 !important;
    }

.selectAssignEmployees .ScMan-EmpRow:not(.SelectedEE) .ScMan-EmpRow-ScheduleDay, .selectAssignEmployees .ScMan-EmpRow.SelectedEE .ScMan-EmpRow-ScheduleDay:not(.SelectedDay) {
    opacity: 0.5;
}


    .selectAssignEmployees .ScMan-EmpRow:not(.SelectedEE) .ScMan-EmpRow-ScheduleDay.SelectedDay:hover {
        opacity: 0.7;
    }

.selectAssignEmployees .ScMan-EmpRow.ScMan-OpenShifts .ScMan-EmpRow-ScheduleDay.SelectedDay, .selectAssignEmployees .ScMan-EmpRow.ScMan-OpenShifts .ScMan-EmpRow-ScheduleDay.SelectedDay:hover {
    opacity: 1;
}

.selectEmployees .ScMan-BlueImg {
    display: none !important;
}

.Sc-AA-RuleName {
    display: flex;
    gap: 4px;
}
.Sc-AA-RuleName span{
   flex: 1;
   font-weight: 600;
}

    .Sc-AA-RuleName img {
        min-height: 15px;
        max-height: 15px;
        min-width: 15px;
        max-width: 15px;
        margin-top: 2px;
        cursor: pointer;
    }


.ScMan-AAPBody3-Item-Rule {
    background: #F1F7FE !important;
    border-radius: 4px;
    padding: 10px;
    flex: 1;
}

.AdditionalRules .ScMan-AAPBody3-Item{
    width: 100% !important;
}

.ScMan-AAPBody3-Item-Rule img{
    cursor: pointer;
}

.NewSave-Save.dirty, .NewSave-Chev.dirty {
    background: rgba(183,47,37,0.7) !important;
}


.Sc-Schedule-Info {
    display: flex;
    gap: 8px;
    align-self: stretch;
    max-width: 100%;
}


.Sc-Schedule-Info-Date {
    display: flex;
    height: 40px;
    padding: 10px 12px;
    align-items: center;
    gap: 8px;
    flex: 1 0 0;
    border-radius: 4px;
    background: #FAFAFA;
}


.timeOffMode .ScMan-EmpRow:not(.TimeOffEE) .ScMan-RSegment {
    background-color: #F6F6F6 !important;
}

.open-shift-request-summary .schedule-popup-header,
.shift-drop-post-request .schedule-popup-header,
.shift-drop-post-summary .schedule-popup-header,
.shift-swap-post-request .schedule-popup-header,
.shift-swap-post-summary .schedule-popup-header,
.shift-swap-summary .schedule-popup-header,
.availability-request-summary .schedule-popup-header,
.availability .schedule-popup-header,
.publish-schedule .schedule-popup-header,
.add-employees .schedule-popup-header,
.notify-schedule .schedule-popup-header {
    display: none !important;
}


.list-type-DayList .ScMan-ShiftsBar {
    position: absolute;
    z-index: 3;
    min-width: 20px !important;
    max-height: 55px !important;
    display: flex;
    justify-content: center !important;
    gap: 8px;
    padding: 5px;
    flex-wrap: wrap;
    min-height: 35px !important;
    flex-direction: row !important;
    align-content: center !important;
}

.list-type-DayList .ScMan-ShiftsBar:not(.shift-dragging) {
    top: 5px !important;
}


    .list-type-DayList .ScMan-ShiftsBar:hover {
        z-index: 4;
        max-height: 600px !important;
        min-width: 300px !important;
    }

.list-type-DayList .ScMan-Shifts {
    align-self: center;
    flex-direction: row !important;
    gap: 8px;
}

.ScMan-miniShiftSegment {
    align-self: baseline;
}

    .ScMan-miniShiftSegment.ScMan-miniShiftSegment-Default .ScMan-ShiftsBar:hover > .ScMan-ShiftsEdit, .ScMan-miniShiftSegment.ScMan-miniShiftSegment-Default .ScMan-ShiftsBar:hover .SCM-ShiftButtonsEdit {
        display: none;
    }

    .ScMan-miniShiftSegment.ScMan-miniShiftSegment-Hover .ScMan-ShiftsBar > .ScMan-ShiftsEdit, .ScMan-miniShiftSegment.ScMan-miniShiftSegment-Hover .ScMan-ShiftsBar .SCM-ShiftButtonsEdit {
        display: flex;
    }


    .ScMan-miniShiftSegment.ScMan-miniShiftSegment-Default .ScMan-ShiftsBar:hover > .ScMan-Shifts, .ScMan-miniShiftSegment.ScMan-miniShiftSegment-Default .ScMan-ShiftsBar:hover .ScMan-Shifts {
        display: flex;
    }

    .ScMan-miniShiftSegment.ScMan-miniShiftSegment-Hover .ScMan-ShiftsBar > .ScMan-Shifts, .ScMan-miniShiftSegment.ScMan-miniShiftSegment-Hover .ScMan-ShiftsBar .ScMan-Shifts {
        display: none;
    }

    .ScMan-MainGrid:not(.availabilityMode) .ScMan-ShiftsBar.ScMan-ShiftsBarAvailibility:hover > .SCM-ShiftButtonsEdit{
        display: none !important;
    }

    .ScMan-MainGrid:not(.availabilityMode) .ScMan-ShiftsBar.ScMan-ShiftsBarAvailibility > .ScMan-Shifts{
        display: flex !important;
    }

.SCM-StrippedOnly {
    background: repeating-linear-gradient( 120deg, rgba(200, 200, 200, 0.4), rgba(200, 200, 200, 0.4) 2px, transparent 2px, transparent 20px ), #FFF4D3 !important;
}

.SCM-AvailibilityText {
    max-width: 100% !important;
    text-overflow: ellipsis;
    overflow: hidden;
    align-self: center;
}


.list-type-DayList .ScMan-AddShiftPlusSingle{
    display: none !important;
}

.list-type-DayList .ScMan-RSegment:hover .ScMan-AddShiftPlusSingle {
    display: flex !important;
}

.ShowDurringDragOnly{
    display: none;
}

.ScMan-EmpRow .ScMan-ShiftsBar.shift-dragging .SCM-ShiftButtonEdit:not(.ShowDurringDrag) {
    opacity: 0;
}

.ScMan-EmpRow .ScMan-ShiftsBar.shift-dragging .SCM-ShiftButtonEdit.ShowDurringDragOnly {
    display: flex;
}


.list-type-DayList .SCM-ShiftFloatButton {
    z-index: 3;
}

.ScMan-SearchFiltersActions{
    display: flex;
}

.schedule-print > header, .schedule-print .ScMan-SearchFiltersActions, .schedule-print .PG-FooterNew, .schedule-print .ScMan-MainGrid-Footer, .schedule-print .ScMan-HSegment img,
.schedule-print .SCM-EmployeeRow .ScMan-BlueImg, .schedule-print .ScMan-ShiftsInfo > img,
.schedule-print .ScMan-AddShiftPlusSingle > img, .schedule-print .ScMan-CategoryBar > img,
.schedule-print .employeeTotals,
.schedule-print .organizeBy .ScMan-HSegment-EmployeeName, .schedule-print .organizeBy .StickyEmployee {
    display: none !important;
}

.ScMan-DateTimeOffCard-main {
    display: flex;
    gap: 12px;
    flex: 1;
    border-radius: 4px;
    border: 1px solid #E4E7EC;
    border-left: 4px solid #FFE4A5;
    padding: 12px 16px;
}

.ScMan-DateTimeOffCard-addR {
    display: flex;
    justify-content: space-between;
    padding: 6px 0;
    border: 1px solid #E5E5E5;
    border-radius: 4px;
    flex: 1;
}

.ScMan-DateTimeOffCard-minus {
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0 16px;
    cursor: pointer;
    border-right: 1px solid #E5E5E5;
}

.ScMan-DateTimeOffCard-plus {
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0 16px;
    cursor: pointer;
    border-left: 1px solid #E5E5E5;
}

.ScMan-DateTimeOffCard-addR img {
    flex-shrink: 0;
    height: 12px;
    width: 12px;
    filter: brightness(0) saturate(100%) invert(20%) sepia(68%) saturate(5024%) hue-rotate(188deg) brightness(101%) contrast(101%);
}

.ScMan-DateTimeOffCard-Trash {
    display: flex;
    height: 40px;
    width: 40px;
    justify-content: center;
    align-items: center;
    border-radius: 4px;
    background: #FBEDED;
    cursor: pointer;
}

.ScMan-DateTimeOffCard-Trash img {
    flex-shrink: 0;
    height: 12px;
    width: 12px;
}

.ScMan-DateTimeOffCard-HeaderBubble {
    display: flex;
    padding: 8px 12px;
    align-items: center;
    border-radius: 4px;
    background: #F1F7FE;
    margin-left: auto;
}

.ScMan-DateTimeOffCard-RadioBubble {
    display: flex;
    padding: 12px;
    flex-direction: column;
    gap: 12px;
    border-radius: 4px;
    background: #F1F7FE;
}

.ScMan-RequestCard {
    display: flex;
    gap: 8px;
    align-self: stretch;
    justify-content: space-between;
    border-radius: 4px;
    border: 1px solid #E4E7EC;
    padding: 8px 12px;
}

.ScMan-RequestCard-purple {
    border-left: 4px solid #BA98E5;
}

.ScMan-RequestCard-yellow {
    border-left: 4px solid #FFE4A5;
}

.ScMan-RequestCard-green {
    border-left: 4px solid #75D447;
}

.ScMan-RequestCard-bubble {
    display: flex;
    padding: 2px 8px;
    justify-content: center;
    align-items: center;
    max-height: fit-content;
}

.ScMan-RequestCard-greenB {
    border-radius: 4px;
    background: #F0FCE9;
}

.ScMan-RequestCard-greenB span {
    font-weight: 500;
    font-size: 12px;
    color: #164C21;
}

.ScMan-RequestCard-orangeB {
    border-radius: 4px;
    background: #FFF4D3;
}

.ScMan-RequestCard-orangeB span {
    font-weight: 500;
    font-size: 12px;
    color: #A1460B;
}

.ScMan-RequestCard-redB {
    border-radius: 4px;
    background: #FFECEB;
}

    .ScMan-RequestCard-redB span {
        font-weight: 500;
        font-size: 12px;
        color: #B42318;
    }

.ScMan-RequestCard-grayB {
    border-radius: 4px;
    background: rgba(163, 165, 162, 0.11);
}

.ScMan-RequestCard-grayeB span {
    font-weight: 500;
    font-size: 12px;
    color: #5F5F5F;
}


.ScMan-ShiftsBar-absoluteApprove {
    position: absolute;
    z-index: 12;
    right: -8px;
    top: -8px;
    width: 18px;
    height: 18px;
    flex-shrink: 0;
    filter: brightness(0) saturate(100%) invert(28%) sepia(100%) saturate(4124%) hue-rotate(186deg) brightness(95%) contrast(101%);
}

.pg-green-success-msg .ScMan-SuccessCloseLine {
    position: absolute;
    width: 100%;
    z-index: 3;
    height: 3px;
    border-radius: 10px;
    background: #3E941C;
    bottom: 0;
    left: 0;
    filter: blur(1px);
    animation: SuccessCloseLine-fade 12s infinite;
}

@keyframes SuccessCloseLine-fade {
    0% {
        width: 100%;
    }
    100% {
        width: 0;
    }
}

.ScMan-DoubleRowSegment {
    display: flex;
    padding: 12px;
    align-items: center;
    gap: 41px;
    min-width: calc(50% - 6px);
    max-width: calc(50% - 6px);
    max-height: fit-content;
    border-radius: 4px;
    border: 1px solid #E4E7EC;
    justify-content: space-between;
}

.ScMan-DoubleRowSegment.ScMan-DoubleRowYellow {
    border-left: 4px solid #FFE4A5 !important;
}

.ScMan-DoubleRowSegment.ScMan-DoubleRowBlue {
    border-left: 4px solid #3FA4F1 !important;
}

.ScMan-DoubleRowSegment.ScMan-DoubleRowPurple {
    border-left: 4px solid #BA98E5 !important;
}

.ScMan-DoubleRowSegment.No-WorkRed {
    background: repeating-linear-gradient( 120deg, rgba(200, 200, 200, 0.4), rgba(200, 200, 200, 0.4) 2px, transparent 2px, transparent 20px ), #FBEDED !important;
}

.No-WorkRedSpan {
    color: #D92D20;
    font-weight: 600;
}

.ScMan-DoubleRowSegment.No-WorkGreen {
    background: repeating-linear-gradient( 120deg, rgba(200, 200, 200, 0.4), rgba(200, 200, 200, 0.4) 2px, transparent 2px, transparent 20px ), #F0FCE9 !important;
}

.No-WorkGreenSpan {
    color: #3E941C;
    font-weight: 600;
}

.ScMan-DoubleRowSegment.No-WorkYellow {
    background: repeating-linear-gradient( 120deg, rgba(200, 200, 200, 0.4), rgba(200, 200, 200, 0.4) 2px, transparent 2px, transparent 20px ), #FFFAEC !important;
}

.No-WorkYellowSpan {
    color: #EB7C10;
    font-weight: 600;
}

.ScMan-DoubleRowSegment.No-Work {
    background: repeating-linear-gradient( 120deg, rgba(200, 200, 200, 0.4), rgba(200, 200, 200, 0.4) 2px, transparent 2px, transparent 20px ), #FFF !important;
}

.ScMan-DoubleRowSegment.ScMan-DoubleRowBlueBack {
    background: #F1F7FE;
}

.ScMan-DoubleRowDoubleTime {
    display: flex;
    padding: 2px 6px;
    justify-content: center;
    align-items: center;
    gap: 4px;
    border-radius: 2px;
    background: #FFFAEC;
}

.ScMan-DoubleRowDoubleTime img {
    flex-shrink: 0;
    width: 12px;
    height: 12px;
    filter: brightness(0) saturate(100%) invert(43%) sepia(77%) saturate(1838%) hue-rotate(8deg) brightness(108%) contrast(87%);
}

.ScMan-DoubleRowDoubleTime span {
    color: #EB7C10;
    font-size: 12px;
    font-weight: 600;
}

.ScMan-DoubleRowMore {
    display: flex;
    position: relative;
    width: 40px;
    height: 40px;
    padding: 8px;
    justify-content: center;
    align-items: center;
    border-radius: 4px;
    background: #E1EEFD;
    cursor: pointer;
}

.ScMan-DoubleRowMore img {
    filter: brightness(0) saturate(100%) invert(25%) sepia(65%) saturate(2340%) hue-rotate(181deg) brightness(105%) contrast(101%);
    flex-shrink: 0;
    width: 16px;
    height: 16px;
}

.ScMan-DoubleRowTrash {
    display: flex;
    position: relative;
    width: 40px;
    height: 40px;
    padding: 8px;
    justify-content: center;
    align-items: center;
    border-radius: 4px;
    background: #FBEDED;
    cursor: pointer;
}

.ScMan-DoubleRowTrash img {
    flex-shrink: 0;
    width: 16px;
    height: 16px;
}

.ScMan-DoubleRowMoreInfo {
    display: flex;
    position: absolute;
    width: 16px;
    height: 16px;
    padding: 4px;
    justify-content: center;
    align-items: center;
    z-index: 3;
    top: -4px;
    right: -4px;
    border-radius: 20px;
    border: 1px solid #F2DD9D;
    background: #FFF4D3;
}

.ScMan-DoubleRowMoreInfo span {
    font-size: 12px;
    font-weight: 500;
    color: #CF6B0B;
}

.ScMan-ShiftDropInfo {
    display: flex;
    padding: 4px 8px;
    align-items: center;
    border-radius: 4px;
    border-left: 3px solid #D1BDEA;
    background: #FAF9FB;
}


.ScMan-ShiftLogShift {
    display: flex;
    padding: 12px;
    flex-direction: column;
    gap: 12px;
    align-self: stretch;
    border-radius: 4px;
    border: 1px solid #EBEBEB;
    background: #FFF;
    cursor: pointer;
}

.ScMan-ShiftLogActive {
    border-radius: 8px !important;
    border: 1px solid #0078BC !important;
    background: #F1F7FE !important;
    box-shadow: 0px 0px 0px 3px #E1EEFD;
    cursor: default !important;
}

.ScMan-AssignOpenGreen {
    display: flex;
    padding: 4px;
    align-items: center;
    gap: 8px;
    border-radius: 40px;
    background: rgba(62, 148, 28, 0.10);
}

.ScMan-AssignOpenGreen img {
    flex-shrink: 0;
    width: 16px;
    height: 16px;
    filter: brightness(0) saturate(100%) invert(45%) sepia(81%) saturate(482%) hue-rotate(58deg) brightness(88%) contrast(89%);
}

.ScMan-AssignOpenRed {
    display: flex;
    padding: 4px;
    align-items: center;
    gap: 8px;
    border-radius: 40px;
    background: rgba(217, 45, 32, 0.10);
}

.ScMan-AssignOpenRed img {
    flex-shrink: 0;
    width: 16px;
    height: 16px;
    filter: brightness(0) saturate(100%) invert(14%) sepia(45%) saturate(6958%) hue-rotate(356deg) brightness(125%) contrast(83%);
}

.ScMan-AssignOpenSegment {
    display: flex;
    padding-bottom: 12px;
    justify-content: space-between;
    align-items: center;
    align-self: stretch;
    border-bottom: 1px solid rgba(218, 218, 218, 0.40);
}

.ScMan-AssignOpenBlueInfo {
    display: flex;
    padding: 4px 8px;
    justify-content: center;
    align-items: center;
    border-radius: 4px;
    background: #F1F7FE;
}

.ScMan-AssignOpenBlueInfo span {
    color: #0078BC;
}