@import './_variables.css';

/* width */
#workingset-table-scrolling-container::-webkit-scrollbar {
    /* width: 8px; */
    /* height: 8px; */
}

/* Track */
#workingset-table-scrolling-container::-webkit-scrollbar-track {
    /* background-color: white !important; */
}

/* Handle */
#workingset-table-scrolling-container::-webkit-scrollbar-thumb {
    /* background: var(--Logistic-Suit-Secondary) !important; */
    /* border-radius: 10px; */
}

    /* Handle on hover */
    #workingset-table-scrolling-container::-webkit-scrollbar-thumb:hover {
        /* background: var(--Logistic-Suit-Secondary) !important; */
    }

/*#workingset-table-scrolling-container::-webkit-scrollbar-thumb:vertical {
        border-radius: 0px !important;
        background-color: rgb(193 193 193 / 0%) !important;
        border: 4px solid rgb(136 85 85 / 0%) !important;
        opacity: 0;*/ /* Make it invisible by default */
/*transition: opacity 0.3s;*/ /* Smooth transition */
/*}*/


/* Show thumb when hovering over the scrollbar track */
/*#workingset-table-scrolling-container.track-hover::-webkit-scrollbar-thumb:vertical {
    opacity: 1;*/ /* Make the thumb visible */
/*border-radius: 0px !important;
    background-color: rgb(193, 193, 193) !important;
    border: 4px solid rgb(237, 237, 237) !important;
}*/

#workingset-table-scrolling-container:hover {
}

#workingset-table-scrolling-container {
    width: 100%;
    height: auto;
    overflow: auto;
    flex-grow: 1;
    display: flex;
    flex-direction: column;
    /*    scrollbar-width: thin;*/
}

.ExpandedWorkingSetRowComponentcontainer {
    display: flex;
    flex-direction: column;
    height: 100%;
    position: relative;
    flex-grow: 1;
    position: sticky;
    inset-inline-start: 0px;
    width: fit-content;
    min-width: 100%;
    padding-block: 2px;
}

.working-set-info-container {
    position: fixed;
    top: 225px;
    z-index: 5000;
    width: 700px;
    box-shadow: 0px 3px 6px #00000029;
    /*    height: 65vh;*/
    /*    max-height: 80%;*/
    max-height: 62%;
    inset-inline-start: 60px;
    border-radius: 20px;
/*    overflow-y: auto;
    overflow-x: auto;*/
}

.trip-info-container {
    position: absolute;
    top: 30px;
    z-index: 500000000;
    width: 96%;
    box-shadow: 0px 3px 6px #00000029;
    height: fit-content;
    /*    max-height: 62%;*/
    inset-inline-start: 14px;
    overflow-y: auto;
    overflow-x: auto;
    border-radius: 20px;
}


.truck-options-container {
    display: flex;
    margin-inline-start: 50px;
}

    .truck-options-container .truck-options-icons {
        display: flex;
        margin-inline-end: 20px;
    }

        .truck-options-container .truck-options-icons img {
            margin-inline-end: 10px;
        }

.iconAction {
    cursor: pointer
}

.blueToBlackIcon {
    filter: invert(8) saturate(0.5) grayscale(4) brightness(0.2);
}

.workingSetWrapper .norma_dropdown .dropdown-menu {
    top: 22px !important;
    transform: none !important;
    inset-inline-end: 0 !important;
    width: auto;
    inset-inline-start: initial !important;
}

    .workingSetWrapper .norma_dropdown .dropdown-menu#collapsedDropDown {
        top: -5px !important;
        transform: none !important;
        inset-inline-end: 0 !important;
        width: auto;
        inset-inline-start: initial !important;
        position: relative !important;
        width: 196px;
        height: 200px;
        background-color: transparent !important;
        box-shadow: unset !important;
    }

        .workingSetWrapper .norma_dropdown .dropdown-menu#collapsedDropDown .dropdown-menu-container {
            box-shadow: rgba(0, 0, 0, 0.16) 0px 1px 3px;
            background-color: #fff !important;
            border-radius: 5px;
        }
/* handle working set checked style */
.norma--checkbox.wsCheckbox input[type=checkbox] {
    height: 13px;
    width: 13px;
    border: 2px solid var( --norma-secondary--3);
}

.norma--checkbox.wsCheckbox {
    display: flex;
    align-items: center;
    justify-content: center
}

.ws-header-checkbox {
    padding-inline-start: 14px;
    width: 31px;
}

.norma--checkbox.wsCheckbox input[type=checkbox]:checked {
    background-color: var(--norma-primary--1);
}
/*.workingSetChecked.collapsed-working-set-blue-color .norma--checkbox.wsCheckbox input[type=checkbox] {
    border: 2px solid #2B5194;
    background: #ffffff30;
}*/
/* handel resizing */
/*.working-set-row-header {
    width:calc(100% - 8px) 
}
.trip-container-header, .tripDriverPopupContainer {
    width: calc(100% - 0px) 
}
.compact-view .trip-container-header {
    width: calc(100% - 0px) 
}
.workingSet-stop-header-row {
    width: calc(100% - 0px) 
}*/

.workingSet-stop-info-icon {
    width: 22px !important;
    cursor: pointer;
}

    .workingSet-stop-info-icon img:hover {
        filter: invert(88%) sepia(15%) saturate(1226%) hue-rotate(87deg) brightness(90%) contrast(85%);
    }

.collapsed-working-set-blue-color .norma--checkbox.wsCheckbox input[type=checkbox] {
    margin-inline-end: 3px;
    border: 2px solid var(--norma-secondary--2);
    background: #2b384f;
}

    .collapsed-working-set-blue-color .norma--checkbox.wsCheckbox input[type=checkbox]:before {
        border: solid #2b384f;
        border-width: 0 2px 2px 0;
    }

.workingSetSaveButton {
    /*    padding-inline-start: 6px !important;
    padding-inline-end: 6px !important;*/

    border-radius: 5px !important;
    display: flex !important;
    justify-content: center !important;
    align-items: center !important;
    border: none !important;
    height: 24px !important;
    width: 24px !important;
    padding: var(--norma--padding-xs) var(--norma--padding-xs) !important;
    line-height: 14px !important;
    font-size: var(--norma--font-xxs) !important;
    outline: none !important;
}

.workingSetSaveButton-loading {
    color: #30C86D !important;
    border: 1px solid #30C86D !important;
    background: #fff !important;
    border-radius: 25px;
    cursor: not-allowed !important;
}

    .workingSetSaveButton-loading img {
        width: 12px;
        height: 12px;
    }
/*.vehicleIcon.cursor_pointer:hover img {
    transform: scale(1.1);
}*/
.recalculate-date-time-style {
    height: 2.5px;
    background-color: #FCF44C;
    width: 100% !important;
}

.today-date-parent-style .recalculate-date-time-style {
    height: 3px !important;
    position: absolute;
    background-color: #FCF44C;
    border-bottom-left-radius: 4px;
    border-bottom-right-radius: 4px;
    width: 96% !important;
    bottom: 1.5px !important;
}





.norma-result-container {
    border: 1px solid rgba(189, 217, 249, 1);
    border-radius: 2px;
}

.cutoff-view-plan-btn {
    text-decoration: underline;
    color: dodgerblue;
    text-underline-offset: 4px;
    cursor: pointer;
}

.norma-result-cards-container .card {
    border: 1px solid rgba(43, 81, 148, 0.75);
    background: rgba(198, 222, 250, 0.65);
    border-radius: 5px;
    /*  width: 155px;*/
    height: 35px;
}

    .norma-result-cards-container .card .card-title {
        font-size: 12px;
        font-weight: 300;
        line-height: 14.52px;
        color: rgba(43, 81, 148, 1);
    }

    .norma-result-cards-container .card .card-describtion {
        color: rgba(0, 0, 0, 1);
        font-size: 12px;
        font-weight: 400;
        line-height: 14.52px;
    }

.norma-result-modal-container {
    /* inset-inline-end: 33% !important; */
    width: 50vw !important;
    min-width: 650px !important;
    min-height: unset !important;
    height: auto;
    background-color: white;
    border: none;
    box-shadow: 0px 3px 6px #00000029;
    border-radius: 5px;
}

    .norma-result-modal-container.norma-cutoff-config-modal {
        width: 75vw !important;
        min-width: 750px !important;
    }

.norma-autoPlanning-modal-date {
    font-size: 10px;
    font-weight: 300;
    line-height: 11.72px;
    color: rgba(12, 27, 53, 1);
}

    .norma-autoPlanning-modal-date span {
        font-size: 10px;
        font-weight: 600;
        line-height: 11.72px;
        color: rgba(12, 27, 53, 1);
    }

.norma-result-container a {
    text-decoration: underline;
}

.norma-result-container .error-number-describtion {
    padding-inline-start: 2.5rem;
    padding-inline-end: 0;
}

.wsPanelKpisWrapWrap {
    position: absolute;
    bottom: -14px;
    width: 100%;
    height: 60px;
    background: white !important;
    height: fit-content;
}

.cutoff-errors-container {
    height: 345px !important;
    max-height: 345px !important;
}

.cutoff-confirm-btn.btn.disabled, .cutoff-confirm-btn.btn:disabled {
    opacity: .65;
    background: #ccc !important;
    border-color: #ccc !important;
}

.wsPanelKpisWrap {
    position: absolute;
    bottom: 20px;
    width: 80%;
    margin: auto;
    inset-inline-start: 7.4%;
    inset-inline-end: 7.4%;
    z-index: 10000000;
    background: rgb(201 223 250);
    backdrop-filter: blur(30px);
    box-shadow: 2px 2px 4px 0px #00000040;
    /*padding: 8px 12px;*/
    border-radius: var(--norma--border-raduis-sm);
    height: 34px;
}

.wsKpiContainer {
    display: flex;
    gap: 0;
    max-width: 100%;
    width: 100%;
    align-items: center;
    min-width: 100%;
}

.wsKpi {
    flex-basis: 24%;
    min-width: 16.67%;
}

.wsKpis-content {
    /*background: rgba(159, 212, 254, 1);*/
    padding-inline: 10px;
    padding-block: 4px;
    margin: 5px;
    border-radius: 6px;
}

.wsPanelKpisWrap .singleWSKpi {
    gap: 5px;
}

    .wsPanelKpisWrap .singleWSKpi .singleWSKpi-count {
        color: var(--norma__neutral--dark);
        display: block;
        /* min-width: 40px; */
        width: auto;
        max-width: 40%;
    }

    .wsPanelKpisWrap .singleWSKpi .singleWSKpi-title {
        color: var(--norma-secondary--2);
    }