.dataTables_wrapper .dataTables_scroll div.dataTables_scrollBody::-webkit-scrollbar-thumb {
    background: #bbbbbb;
    cursor: pointer;
    border-radius: 25px !important;
    font-weight: 400;
    line-height: normal;
    vertical-align: middle;
}

.dataTables_wrapper .dataTables_scroll div.dataTables_scrollBody::-webkit-scrollbar {
    background: #fff;
}

#tblBill_wrapper .dataTables_scrollBody table tbody tr td, #tblBill_wrapper .dataTables_scrollHead table thead tr th {
    min-width: 242px;
}

.dataTables_wrapper .dataTables_paginate .paginate_button.current,
.image-card {
    box-shadow: 0 10px 30px 0 rgb(24 28 33 / 5%) !important;
}

dataTable {
    margin-bottom: 24px;
}

.dataTable thead th {
    background: #fff;
    padding: 10px 8px;
}

    .dataTable thead th:first-child {
        border-radius: 4px 0 0 4px;
    }

    .dataTable thead th:last-child {
        border-radius: 0 4px 4px 0;
    }

.dataTables_wrapper .dataTables_paginate .paginate_button {
    padding: 4px 9px;
    cursor: pointer;
}

.dataTables_wrapper .add-row-btn {
    background: #e47e46;
}

.dataTable thead,
.dataTable tbody {
    text-transform: capitalize;
}

.dataTables_wrapper {
    position: relative;
}

    .dataTables_wrapper .alphabet-container {
        position: absolute;
        right: 0;
    }

        .dataTables_wrapper .alphabet-container .alphabet ul {
            display: flex;
            flex-direction: column;
        }


@media screen and (max-width: 575.9999999px) {
    .dark-mode .header-nav > li > a > span {
        display: none;
    }

    .dark-mode .header-nav-options.h-menu .dropdown > a:after {
        display: none;
    }

    .headerbar-right .header-nav-options {
        float: none;
    }

    .dark-mode #header .header-nav .header-nav-brand img {
        max-height: 70px;
    }

    .flex-header .headerbar-right .header-nav.header-nav-profile {
        display: none;
    }

    .page-header-menu-title {
        margin-left: 0;
    }

    .headerbar-right .header-nav-options {
        margin-left: 0;
    }

    .header-fixed #header .headerbar {
        height: 88px;
    }

    .top-menu-fixed.dark-mode .base-container {
        padding-top: 88px;
    }

    .section-title-flex {
        flex-direction: column;
    }

        .section-title-flex h3 {
            margin-bottom: 8px;
        }

    .page_footer .footer-contact {
        flex-direction: column;
    }

    .dataTables_wrapper .dataTables_length {
        justify-content: space-between;
    }

        .dataTables_wrapper .dataTables_length label {
            display: none;
        }

    .dataTables_buttons {
        flex-direction: row;
        margin-top: 5px;
    }

    .dataTables__top {
        position: relative;
    }

    .dataTables_wrapper .dataTables_buttons .dataTables_buttons_action_group {
        position: absolute;
        top: 0;
        right: 0;
    }

    .dataTables_wrapper .dataTables_length .actions__item {
        position: relative;
        top: 6px;
    }

    .dataTables_buttons > .input-group:not(:last-child) {
        margin-top: 0;
    }

    .dataTables_wrapper .add-row-btn .add-btn-text {
        display: none;
    }

    .project-list-item {
        flex-direction: column;
        position: relative;
    }

        .project-list-item .tools {
            position: absolute;
            right: 5px;
            top: 5px;
        }

    .overview-items {
        overflow-x: auto;
        overflow-y: hidden;
    }

    .overview-items,
    .overview-item {
        flex-wrap: nowrap;
    }

    .overview-item {
        margin-right: 10px;
    }

        .overview-item > * {
            white-space: nowrap;
        }

    .overview-section .input-group {
        margin-top: 10px;
    }

    .overview-search {
        width: 100%;
    }

    .jobs-button {
        position: static;
        width: 100%;
    }

    .header-nav > li.topbar-search {
        display: none;
    }
}

table.dataTable tbody tr td.child ul li {
    width: 33.3%;
    display: flex;
    flex-direction: column;
    padding-top: 0px !important;
    border: 0px !important;
    margin-bottom: 11px;
}

table.dataTable tbody tr td.child {
    width: 100%;
}

    table.dataTable tbody tr td.child ul {
        display: flex !important;
        width: 100%;
        flex-direction: row;
        flex-wrap: wrap;
    }

@media only screen and (min-width:320px) and (max-width:1023px) {
    table.dataTable tbody tr td.child ul li {
        width: 50% !important;
    }

    .chargesContainer .charges > * {
        min-width: 200px;
        padding-right: 11px;
    }

    .formula-btn-space {
        min-width: auto !important;
    }
}

.dataTables__bottom .paging_simple_numbers {
    font-family: 'Plus Jakarta Sans';
    font-style: normal;
    font-weight: 400;
    font-size: 16px;
    line-height: 19px;
    color: #596166;
    margin-top: 0px
}

.dataTables__bottom {
    background: #EFF0F2;
    border-radius: 5px 5px 0px 0px;
    padding: 12px 10px;
    display: flex;
    justify-content: space-between;
}

    .dataTables__bottom .dataTables_info {
        display: flex;
        align-items: center;
        font-family: 'Plus Jakarta Sans';
        font-style: normal;
        font-weight: 400;
        font-size: 16px;
        line-height: 19px;
        color: #596166;
        margin-top: 0px;
    }

#tblClientRequest_wrapper .dataTables_paginate, #tblClientRequestall_wrapper .dataTables_paginate, #tblprofitandloss_wrapper .dataTables_paginate {
    margin-top: 0px !important;
}

.dataTables_wrapper .dataTables_paginate .paginate_button.current {
    background: #00529D !important;
    border-radius: 4px !important;
    padding: 5px 10px !important;
}

.dataTables_wrapper .dataTables_paginate .paginate_button {
    background: transparent;
}

@media only screen and (min-width:320px) and (max-width:767px) {
    .dataTables__bottom {
        flex-direction: column;
    }

        .dataTables__bottom .dataTables_info {
            justify-content: center;
            margin-bottom: 18px;
        }
}
/*datatable head section*/
.dataTables_wrapper .dataTables__top {
    margin-bottom: 0px !important;
}

table.dataTable > tbody > tr.child span.dtr-title {
    margin-bottom: 5px !important;
}

.dataTables_buttons .input-group {
    width: 100% !important;
    background: #FFFFFF;
    border-radius: 5px;
}

.dataTables_buttons input[type="text"] {
    font-family: 'Plus Jakarta Sans';
    font-style: normal;
    font-weight: 400;
    font-size: 16px;
    line-height: 19px;
    color: #7F7E82;
}


.dataTables_buttons .cma_top_icon i {
    background: #FFFFFF;
    border: 1px solid #EFEFEF;
    box-shadow: 0px 1px 4px rgba(0, 0, 0, 0.05);
    border-radius: 5px;
    padding: 4px 15px;
}

.dataTables_buttons .cma_top_icon {
    width: auto;
    height: auto;
}

.dataTables_buttons .cma_add_button {
    background: #04927B !important;
    border-radius: 5px !important;
    font-family: 'Plus Jakarta Sans' !important;
    font-style: normal !important;
    font-weight: 700 !important;
    font-size: 16px !important;
    line-height: 19px !important;
    height: 41px;
}

.dataTables_wrapper .dataTables_length select {
    background: #FFFFFF;
    border: 1px solid #EFEFEF !important;
    border-radius: 5px !important;
    margin: 0px;
    height: 38px;
    font-family: 'Plus Jakarta Sans';
    font-style: normal;
    font-weight: 400;
    font-size: 16px;
    line-height: 19px;
    color: #7F7E82;
}

.dataTables_wrapper .dataTables_paginate {
    margin-top: 0px !important;
}

table.dataTable.dtr-inline.collapsed > tbody > tr > td.dtr-control:before, table.dataTable.dtr-inline.collapsed > tbody > tr > th.dtr-control:before {
    border: 1px solid #E0E0E0;
    border-radius: 5px;
    color: #808080;
}

table.dataTable.dtr-inline.collapsed > tbody > tr.parent > td.dtr-control:before, table.dataTable.dtr-inline.collapsed > tbody > tr.parent > th.dtr-control:before {
    background: transparent;
    border: 2px solid #05A087;
    color: #05A087;
    font-weight: 800;
}


.dataTable thead th {
    color: #686D8F !important
}

.dataTable thead {
    border-bottom: 1px solid #00529D !important;
}

.dataTables_buttons.actions {
    margin-top: 0px;
    margin-left: 3px;
}

    .dataTables_buttons.actions .input-group-addon {
        border-color: #efefef;
    }

    .dataTables_buttons.actions .dropdown ul.ColVis_collection {
        overflow-x: hidden;
        box-shadow: rgba(0, 0, 0, 0.02) 0px 1px 3px 0px, rgba(27, 31, 35, 0.15) 0px 0px 0px 1px;
        margin-top: 10px;
    }

table.dataTable.mail-wrap tbody tr.odd td {
    background: #fff !important;
}

mail-wrap .dataTables_buttons.actions .input-group.prefix {
    background: #F4F6F8;
    border: 1px solid #F2F2F2;
    border-radius: 5px;
    font-family: 'Plus Jakarta Sans';
    font-style: normal;
    font-weight: 400;
    font-size: 16px;
    line-height: 19px;
    color: #7F7E82;
}

.mail-wrap .dataTables_buttons.actions .input-group.prefix input, .mail-wrap .dataTables_buttons.actions .input-group.prefix span {
    background: #F4F6F8;
}

.dataTables_wrapper .add-row-btn {
    color: #fff !important;
}

.invoice_left .dataTables_wrapper {
    height: 100%;
}


.chat-body-left table.dataTable tbody tr.even td {
    background: #fff !important;
    padding-top: 15px;
    padding-bottom: 15px;
}


.chat-body-left table#tblChatSummary tbody tr.selected .user_profile {
    background: rgb(100 111 212 / 10%);
    color: #2E3680;
}

.chat-body-left table.dataTable tbody tr td {
    border-bottom: 1px solid rgb(126 142 141 / 10%);
}

.chat-body-left table.dataTable tbody tr.blues td .user_profile {
    background: rgb(100 111 212 / 10%);
    color: #2E3680;
}

.chat-body-left table#tblChatSummary tbody tr.selected > td {
    background: #F0F1F9;
    border: 1px solid #F4F5F8;
    border-radius: 0px;
}

.chat-body-left table.dataTable tbody tr.dark-blue td .user_profile {
    background: rgb(49 64 77 / 10%);
    color: #25435C;
}

.chat-body-left table.dataTable tbody tr.orange td .user_profile {
    background: rgb(221 135 56 / 10%);
    color: #A66427;
}

#tblMail_wrapper table.dataTable.mail-wrap tbody tr td {
    background: transparent !important;
}

#tblMail_wrapper table.dataTable.mail-wrap tbody tr.trbg td {
    background: #dadada !important;
}

.dataTable thead th {
    background: white;
}

.dataTables_wrapper .dataTables__top::after {
    height: 0px;
}

.dataTable thead {
    color: #ff8100;
    font-size: 14px;
    border-bottom: 2px solid;
    text-transform: none !important;
}

.dataTable tbody {
    text-transform: none !important;
}

.dataTables_wrapper .dataTables__top {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    padding-bottom: 0px;
    position: relative;
    margin-bottom: 0px;
}

.dataTable thead th {
    background: transparent;
}

.dataTables_wrapper .dataTables_paginate {
    margin-top: 150px;
}


.dataTables_wrapper table thead tr th {
    background: #E9E9EE !important;
    border-radius: 0px !important;
    color: #2B2E32 !important;
    font-family: Roboto;
    font-size: 15px;
    font-style: normal;
    font-weight: 500;
    line-height: normal;
    letter-spacing: 0.3px;
}

.dataTables_wrapper table tbody tr td {
    overflow: hidden;
    color: #545555 !important;
    text-overflow: ellipsis;
    font-family: Roboto;
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: normal;
    vertical-align: middle;
    /* min-width: 283px; */
    /* max-width: 40px; */
}

.dataTables_wrapper table tbody tr:nth-child(2n) td {
    background: #FAF8F8;
}

.dataTables_wrapper .dataTables__bottom {
    background: transparent !important;
}

    .dataTables_wrapper .dataTables__bottom .dataTables_info {
        color: #596166 !important;
        font-family: Roboto;
        font-size: 15px;
        font-style: normal;
        font-weight: 400;
        line-height: normal;
    }

    .dataTables_wrapper .dataTables__bottom .paging_simple_numbers a {
        color: #191C25;
        font-family: Roboto;
        font-size: 15px;
        font-style: normal;
        font-weight: 400;
        line-height: normal;
    }

.dataTables_wrapper .input-group.prefix .form-control {
    border-color: transparent !important;
}

.dataTables_wrapper .input-group.prefix .input-group-addon {
    border-width: 0px !important;
}

.dataTables_wrapper .dataTables_buttons .input-group {
    border-radius: 5px;
    border: 1px solid #D5D5D6 !important;
    background: #FFF !important;
}

.dataTables_wrapper .dataTables_buttons .cma_top_icon i {
    padding: 4px 10px !important;
}

.dataTables_wrapper .dataTables_buttons .cma_top_icon:nth-child(3) i {
    color: #1F3D83 !important;
}

.dataTables_wrapper .dataTables_buttons .cma_top_icon:nth-child(2) i {
    color: #ED9006 !important;
}

table-responsive .dataTables_wrapper table thead {
    background: #E9E9EE !important;
}

.table-responsive .table-responsive-lg table tbody tr:nth-child(2n) {
    background: #f1f1f1 !important;
}

table tr td > a {
    color: #1F3D83 !important;
}

.dataTables_wrapper table tbody tr td.active {
    background: transparent !important;
    color: #00713D !important;
    font-weight: 500;
}

.dataTables_wrapper table tbody tr td.inactive {
    background: transparent;
    color: #8B0000 !important;
    font-weight: 500;
}

.table.dataTable > tbody > tr > td.dt-center {
    filter: drop-shadow(-2px 0px 13px rgba(0, 0, 0, 0.15));
    background: #FFF;
    box-shadow: 0px 0px 9px 0px rgba(0, 0, 0, 0.07);
}

.dataTables_buttons .cma_add_button {
    border-radius: 5px;
    background: #00713D;
    box-shadow: 0px 2px 4px 0px rgba(0, 0, 0, 0.25);
    display: flex;
    flex-direction: row-reverse;
}

    .dataTables_buttons .cma_add_button span {
        font-size: 20px !important;
        margin-left: 0px !important;
        margin-right: 4px;
        font-weight: 600;
    }

.dataTables_wrapper .add-row-btn {
    padding-left: 8px;
}

table.dataTable.dtr-inline.collapsed > tbody > tr > td.dtr-control:before, table.dataTable.dtr-inline.collapsed > tbody > tr > th.dtr-control:before {
    border-radius: 4px;
    border: 1px solid #D2D2DA;
    background: #FFF;
    box-shadow: 0px 0px 4px 0px rgba(0, 0, 0, 0.14);
}

.dataTables_wrapper .dataTables__top .input-group.prefix {
    border-radius: 5px;
    border: 1px solid #D5D5D6;
    background: #FFF;
    width: 300px;
    max-width: 100%;
}


/*datatable final top section*/
.dataTables_wrapper .dataTables__top {
    display: block;
    float: left;
    width: 100%;
    justify-content: inherit !important;
}

    .dataTables_wrapper .dataTables__top .input-group.prefix {
        display: inline-table;
        float: left;
    }

.dataTables_wrapper .dataTables_length {
    display: inline-table;
    vertical-align: middle;
    margin-top: 3px;
    margin-right: 10px;
}

.dataTables_wrapper .dataTables__top .actions {
    float: right;
}

@media only screen and (min-width:1981px) {
    .col-sm-3 {
        width: 20%;
    }
}

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

    100% {
        transform: translateX(10px);
    }
}


.dataTables__bottom .dataTables_paginate {
    font-family: 'Plus Jakarta Sans';
    font-style: normal;
    font-weight: 400;
    font-size: 16px;
    line-height: 19px;
    color: #596166;
    margin-top: 0px;
}

    .dataTables__bottom .dataTables_paginate input, .dataTables__bottom .dataTables_paginate select {
        border: 1px solid #00529D !important;
        border-radius: 4px !important;
        padding: 5px 10px !important;
        color: #00529D;
    }

    .dataTables__bottom .dataTables_paginate span {
        padding-right: 4px;
        font-size: 15px;
    }

.dataTables_scrollBody table tbody tr td:first-child, .dataTables_scrollHead table thead tr th:first-child {
    box-shadow: inset -3px 2px 3px #dddd;
}

.dataTables_scrollBody table tbody tr td:last-child, .dataTables_scrollHead table thead tr th:last-child {
    /*    width: 120px !important;*/
    /*    min-width: 190px !important;*/
    box-shadow: inset 1px 1px 6px #dddd;
}

.dataTables_wrapper .dataTables_scroll {
    border-bottom: 1px solid #f4f1f1;
}

.table-responsive .dataTables_wrapper .dataTables_scrollBody table thead th::after {
    display: none;
}

.dtfc-fixed-right a {
    padding-left: 5px;
}

.dataTables_scrollHead table thead {
    border: 0px !important;
}

.table-responsive .dataTables_wrapper table thead {
    border-bottom: 0px !important;
}

.dataTables_wrapper .dataTables_scroll div.dataTables_scrollBody::-webkit-scrollbar {
    height: 6px;
    cursor: pointer;
    border-radius: 25px !important;
}

@media only screen and (min-width:320px) and (max-width:767px) {
    .dataTables_scrollBody table tbody tr td:first-child, .dataTables_scrollHead table thead tr th:first-child {
        width: 100% !important;
        box-shadow: inset -1px 2px 3px #dddd;
    }

    .dataTables_scrollBody table tbody tr td:last-child, .dataTables_scrollHead table thead tr th:last-child {
        width: 75px !important;
        min-width: 75px !important;
        box-shadow: inset 1px 2px 3px #dddd;
    }

    .dtfc-fixed-right a {
        padding-left: 5px !important;
    }
}

.input-group.prefix {
    position: relative;
}

.dataTables_wrapper .input-group.prefix .input-group-addon {
    position: absolute;
    left: 8px;
    top: 9px;
    z-index: 99;
    padding: 0;
    pointer-events: none;
}

.dataTables_wrapper .input-group.prefix .form-control {
    padding-left: 32px;
    border: 1px solid #D5D5D6 !important;
    width: 40px;
    border-radius: 5px !important;
    transition: .9s all;
}

input.form-control.dt-global-search {
    width: 40px;
}

.dataTables_wrapper .dataTables__top .input-group.prefix {
    border: unset;
    transition: .9s all;
}

.dataTables_wrapper .input-group.prefix .form-control:focus, .dataTables_wrapper .input-group.prefix .form-control:not(:placeholder-shown) {
    width: 190px;
}


.dataTables__top {
    display: flex;
}

.dataTables__top {
    display: flex !important;
    align-items: center;
}

.dataTables_wrapper .dataTables__top .input-group.prefix {
    order: 1;
    width: 40px;
    margin-top: 2px;
}

.card-lst {
    order: 2;
    overflow: auto;
    flex-wrap: nowrap;
    justify-content: unset;
}

    .card-lst::-webkit-scrollbar {
        height: 3px;
    }

.dataTables_wrapper .dataTables__top .actions {
    order: 3;
    margin-left: auto;
}
/*QA Feedback*/
.dataTables_scrollBody table tbody tr td, .dataTables_scrollHead table thead tr th {
    min-width: 230px;
    /*   width: 190px !important;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap !important;
    display: table-cell;*/
}

#tblIdentifier_wrapper .dataTables_scrollHead table thead tr th:first-child, #tblIdentifier_wrapper .dataTables_scrollBody table tbody tr td:first-child {
    min-width: 200px !important;
}

.dataTables_wrapper table tbody tr td {
    font-size: 14px !important;
}


.dataTables_wrapper .dataTables_length label select {
    height: 40px;
}

div#lookups_wrapper .table.dataTable > tbody > tr > td {
    overflow: unset;
}

.cma_primary_button:hover {
    color: #FFFFFF !important;
    background-color: #232F34 !important;
    border-color: #232F34 !important;
}


.dataTables_wrapper .dropdown-menu-right {
    right: 43px;
}



.dataTables_wrapper .table.dataTable > tbody > tr > td {
    overflow: unset !important;
}

.card-lst .list.list_status.all {
    background: rgb(111 183 123 / 34%);
}

.card-lst {
    display: flex;
    flex-wrap: wrap;
    margin: 0px 0px 8px 0px;
    justify-content: center;
    width: 100%;
    margin-top: 10px;
}

    .card-lst .col-sm-2 {
        width: 225px;
        max-width: 100%;
        min-width: 200px;
    }

    .card-lst .list {
        display: flex;
        padding: 8px 14px;
        border-radius: 5px;
        justify-content: space-between;
        align-items: center;
    }

        .card-lst .list span {
            color: #2B2E32;
            font-family: Roboto;
            font-size: 16px;
            font-style: normal;
            font-weight: 500;
            line-height: normal;
            position: relative;
            margin-left: 22px;
        }

        .card-lst .list label {
            color: #2B2E32 !important;
            font-family: Roboto;
            font-size: 18px;
            font-style: normal;
            font-weight: 500;
            line-height: normal;
            border-radius: 50px;
            background: #FFF;
            margin: 0;
            width: 25px;
            height: 25px;
            line-height: 25px;
            text-align: center;
        }



        .card-lst .list i {
            width: 16px;
            height: 16px;
            justify-content: center;
            align-items: center;
            flex-shrink: 0;
            color: #929395 !important;
            margin-left: 6px;
        }

        .card-lst .list span::before {
            content: "";
            width: 14px;
            height: 14px;
            background: #f00;
            position: absolute;
            left: -20px;
            top: 2px;
            border-radius: 2px;
        }

        .card-lst .list.grey {
            background: rgba(59, 0, 112, 0.15);
        }

            .card-lst .list.grey span::before {
                background: #3B0070;
            }

        .card-lst .list.green {
            background: rgba(0, 113, 61, 0.15);
        }

            .card-lst .list.green span::before {
                background: #00713D;
            }

        .card-lst .list.orange {
            background: rgba(255, 152, 0, 0.20);
        }

            .card-lst .list.orange span::before {
                background: #FF9800;
            }

        .card-lst .list.yellow {
            background: rgba(235, 183, 0, 0.18);
        }

            .card-lst .list.yellow span::before {
                background: #EBB700;
            }

        .card-lst .list.red {
            background: rgba(242, 63, 49, 0.15);
        }

            .card-lst .list.red span::before {
                background: #F23F31;
            }

.card-lst {
    order: 2;
    overflow: auto;
    flex-wrap: nowrap;
    justify-content: unset;
}

    .card-lst::-webkit-scrollbar {
        height: 3px;
    }

    .card-lst .list.approved {
        background: rgb(47 181 35 / 20%);
    }



        .card-lst .list.approved span::before {
            background: #00713D;
        }


    .card-lst .list.readyforreview {
        background: #2384b54d;
    }



        .card-lst .list.readyforreview span::before {
            background: #2384B5;
        }


    .card-lst .list.rework {
        background: #b5a42354;
    }



        .card-lst .list.rework span::before {
            background: #B5A423;
        }




    .card-lst .list.revised {
        background: rgba(235, 183, 0, 0.18);
    }



        .card-lst .list.revised span::before {
            background: #EBB700;
        }

    .card-lst .list.onhold {
        background: rgba(242, 63, 49, 0.15);
    }



        .card-lst .list.onhold span::before {
            background: #F23F31;
        }


    .card-lst .list:hover, .card-lst .list.active {
        box-shadow: 2px 2px 5px rgb(58 52 52 / 50%);
        margin: 2px;
    }


    .card-lst .list.rejected {
        background: rgb(181 35 37 / 20%);
    }

        .card-lst .list.rejected span::before {
            background: rgba(181, 35, 37, 1);
        }



    .card-lst .list.draft {
        background: rgba(242, 63, 49, 0.15);
    }

        .card-lst .list.draft span::before {
            background: #ff8100;
        }

    .card-lst .list.list_status.all {
        background: rgb(111 183 123 / 34%);
    }



    .card-lst .list.all span::before {
        background: #B57423;
    }


    .card-lst .list {
        width: 100%;
        padding-left: 10px !important;
        padding-right: 10px !important;
    }

p.tlt-txt {
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
    width: 80px;
    margin-bottom: 0px;
    font-size: 15px;
}

span.select2 .select2-selection span {
    font-weight: 400 !important;
    color: #4A4A4A !important;
    font-size: 14px !important;
}

.select2-container--default .select2-selection--single {
    height: 37px !important;
}

    .select2-container--default .select2-selection--single .select2-selection__rendered {
        line-height: 36px !important;
    }

    .select2-container--default .select2-selection--single .select2-selection__arrow {
        height: 32px !important;
    }

.select2-container {
    width: 100% !important;
}

/*Custom Color Style theme */
#menubar {
    background: #0A164C !important;
}

.page-header-box {
    background: #ffffff !important;
}

    .page-header-box > h1 {
        color: rgba(38, 46, 47, 1) !important
    }

ul.header-nav.header-nav-profile > li > a {
    color: #0A164C !important;
    padding-inline:0 !important;
}

.nano.has-scrollbar .gui-controls li:first-child {
    background: #0A164C !important;
    border-right: 1px solid #EBF1F6;
}

.gui-controls > li > a.active i {
    background: transparent !important;
    color: #fff !important;
}

.gui-controls > li > a.active > .title {
    color: #00DEFF !important;
}

.gui-controls > li > a.active{
    border-top: 0px solid #04927B !important;
    border-bottom: 0px solid #04927B !important;
}
.gui-controls > li > a.active, .gui-controls > li > a.cma_active {
    border-radius: 8px;
    background: #C98A51;
}
.mainSideMenu .menu-dropdown ul li a::before {
    color: #00DEFF;
}

.gui-controls li > a:hover .title {
    color: #F2994A !important;
}
.gui-controls li > a:hover i {
    color: #F2994A !important;
}
.gui-controls li.open > a:hover .title {
    color: #fff !important;
}

    /*.dataTables_scrollBody table tbody tr td:first-child, .dataTables_scrollHead table thead tr th:first-child {
    box-shadow: none !important;
}*/
    .dataTables_buttons .cma_add_button {
    background: #0A164C !important;
}

.dataTables_wrapper .dataTables_buttons .cma_top_icon:nth-child(2) i {
    color: #0A164C !important;
}

.dataTables_scrollBody table tbody tr td:first-child, .dataTables_scrollHead table thead tr th:first-child {
    box-shadow: none;
}

.card-head header {
    color: rgba(32, 32, 32, 1) !important;
}

/*li:first-child {
    border-bottom: 0px solid #344955 !important;
}*/

.logo-item > img {
    height: 42px;
    /* width: 41px;*/
    width: 100%;
    max-width: 180px;
    padding: 0px 10px;
}

.cma_cancel_button {
    background-color: rgba(10, 22, 76, 1) !important;
    border-color: rgba(10, 22, 76, 1) !important;
    color: #fcf9f9 !important;
    border: none !important;
}

    .cma_cancel_button:hover {
        background-color: rgba(10, 22, 76, 1) !important;
        border-color: rgba(10, 22, 76, 1) !important;
        color: #fcf9f9 !important;
        border: none !important;
    }

button#btnSubmit, button#btnSubmitReview {
    background: rgba(0, 147, 230, 1) !important;
    border-color: rgba(0, 147, 230, 1) !important;
    color: #fcf9f9 !important;
}

.gui-controls > li:first-child {
    border-bottom: 0px solid #344955 !important;
}

.nano.has-scrollbar .gui-controls li:first-child {
    border-right: 0px solid #EBF1F6 !important;
}

.ColVis_collection .colvis_switch:checked:before {
    background: #2196f3 !important;
}

.cma_primary_button {
    background: rgba(0, 147, 230, 1) !important;
}

.dataTables_wrapper .dataTables_paginate .paginate_button.current {
    background: rgba(181, 116, 35, 1) !important;
    border-radius: 4px !important;
    padding: 5px 10px !important;
}

.table.dataTable > tbody > tr > td.dt-center a:hover {
    color: rgba(0, 147, 230, 1) !important;
}

.nav-tabs > li.active > a {
    border: none;
    border-bottom: 2px solid #B57423;
    color: rgb(255 255 255) !important;
    background-color: #B57423;
    cursor: default;
    opacity: 1;
    border-radius: 3px;
    padding: 6px 30px;
    line-height: 25px;
}

.card-head {
    background: #fff !important;
    color: rgba(34, 34, 34, 1);
}

.automatonShowFilter {
    background-color: rgba(10, 22, 76, 1) !important;
    color: #ffff !important;
    padding: 8px 3px !important;
    border-radius: 4px;
    height: 40px;
}

.automatonShowFilter {
    margin-top: 0px;
    margin-right: 10px;
}

.cma_primary_button {
    border: 1px solid rgba(0, 147, 230, 1) !important;
    color: #fff !important;
}

    .cma_primary_button:hover {
        color: #FFFFFF !important;
        background-color: rgba(0, 147, 230, 1) !important;
        border-color: rgba(0, 147, 230, 1) !important;
    }

.button-common, button.btn-add-services, button.btnaddonservices, button.btn-add-charges, button.btn-add-shipcontacts, .btnSubmit, button.btn-add-contacts, button.btn-add-details, button.btn-add-ctmspec, button#btnSubmitDraft, button.btn-add-locations, button.btn-add-pricelist {
    background: #fff !important;
    border-radius: 5px !important;
    font-family: 'Plus Jakarta Sans' !important;
    font-style: normal !important;
    font-weight: 700 !important;
    font-size: 15px !important;
    line-height: 26px !important;
    height: 38px;
    color: rgb(255 255 255) !important;
    border: rgba(10, 22, 76, 1) !important;
    margin-top: 10px;
    background-color: rgba(181, 116, 35, 0.04) !important;
    margin-top: 10px;
    border: 0.75px solid rgba(181, 116, 35, 0.8) !important;
    background: rgba(181, 116, 35, 0.04);
    color: background: rgba(181, 116, 35, 1);
    color: rgba(181, 116, 35, 1) !important;
}

    .button-common:hover, button.btn-add-services:hover, button.btnaddonservices:hover, button.btn-add-charges:hover, button.btn-add-shipcontacts:hover, .btnSubmit:hover, button.btn-add-contacts:hover, button.btn-add-details:hover, button.btn-add-ctmspec:hover, button.btn-add-locations:hover, button.btn-add-pricelist:hover {
        background: #fff !important;
        border-radius: 5px !important;
        font-family: 'Plus Jakarta Sans' !important;
        font-style: normal !important;
        font-weight: 700 !important;
        font-size: 15px !important;
        line-height: 27px !important;
        height: 38px;
        color: rgb(255 255 255) !important;
        border: rgba(10, 22, 76, 1) !important;
        margin-top: 10px;
        background-color: rgba(10, 22, 76, 1) !important;
        margin-top: 10px;
    }

#btnCloseFilter {
    border: 1px solid #DBDBDB;
    width: 102px;
    height: 41px;
    color: #222222;
    background: #fff !important;
    border-radius: 5px !important;
    text-transform: capitalize;
    font-weight: 700 !important;
    margin-right: 10px;
}

button#btnFilter {
    border: 0px solid #DBDBDB;
    width: 102px;
    height: 41px;
    color: #ffffff;
    background: #B57423 !important;
    border-radius: 5px !important;
    text-transform: capitalize;
    font-weight: 700 !important;
}

.card-head header {
    display: inline-block;
    padding: 11px 1px;
    vertical-align: middle;
    line-height: 17px;
    font-size: 20px;
}

.card-body {
    padding: 4px;
    position: relative;
}

.table-responsive-lg table thead {
    background: rgba(0, 147, 230, 1);
    border-bottom: 1px solid rgba(0, 147, 230, 1);
    border-radius: 5px 5px 0px 0px;
    color: #ffffff !important;
    background: rgb(223 243 255);
}

.mainSideMenu .menu-dropdown ul li a {
    font-family: 'Plus Jakarta Sans';
    font-style: normal;
    font-weight: 400;
    font-size: 12px;
    line-height: 16px;
    color: #FFFFFF;
    position: relative;
}

.gui-controls li .title {
    font-size: 12px;
}

button.button-common, button.button-common:hover {
    color: rgba(0, 147, 230, 1) !important;
}

.tab-card .nav-tabs > li.active > a, .tab-card .nav-tabs > li.active > a:focus, .tab-card .nav-tabs > li.active > a:hover {
    background: #2196f3;
    border-radius: 10px 10px 0 0;
    color: #ffffff;
}

.tab-card .nav-tabs::after {
    content: "";
    position: absolute;
    height: 3px;
    background: #b57423;
    border-radius: 5px;
    z-index: 1;
    left: 0;
    width: 100%;
    top: 47px;
}

.div_filter {
    max-height: 400px;
    overflow-x: auto;
    width: 45% !important;
    position: absolute;
    top: 53px;
    left: 0px;
    background: #fcfeff !important;
    z-index: 1000;
    display: flex;
    padding: 10px;
    border: 1px solid #c8cbe6;
    box-shadow: rgb(38 57 77) 0px 20px 30px -10px !important;
}

.tab-card .nav-tabs > li.active > a, .tab-card .nav-tabs > li.active > a:focus, .tab-card .nav-tabs > li.active > a:hover {
    background: #c98a51 !important;
    border-radius: 3px 3px 0 0;
    color: #ffffff;
    /* margin-top: 10px; */
}

.detele-common-icon button span {
    color: #DB3712 !important;
    font-size: 22px;
}

.gui-controls > li > a > i {
    color: #b8b5b5 !important;
}

.nano .gui-controls li a span {
    color: #475569 !important;
}

.header-nav-profile .dropdown.open .profile-info {
    color: #313534 !important;
}

body .swal2-confirm, body .swal2-confirm:hover {
    background: rgba(10, 22, 76, 1) !important;
    border-radius: 9px !important;
    border: none !important;
}

body .swal2-cancel, body .swal2-cancel:hover {
    background-color: rgba(0, 147, 230, 1) !important;
    border-color: rgba(0, 147, 230, 1) !important;
    color: white;
    border-radius: 9px !important;
    float: left;
    border: none !important;
}

.swal2-icon.swal2-warning {
    border-color: #203374 !important;
    color: #0093e6 !important;
}

.card-head {
    position: relative;
    line-height: 53px;
    min-height: 71px;
    vertical-align: middle;
    border-radius: 2px 2px 0 0;
    /*box-shadow: 3px 0px 10px 0px rgba(0, 0, 0, 0.1);*/
}

.input-group .input-group-addon {
    border-radius: 0 6px 7px 0;
}

.has-success .form-control {
    border-bottom-color: rgba(2, 153, 238, 1) !important;
    border-top-color: rgba(2, 153, 238, 1) !important;
    border-left-color: rgba(2, 153, 238, 1) !important;
}

.has-success .input-group-addon {
    border-bottom-color: rgba(2, 153, 238, 1) !important;
    border-top-color: rgba(2, 153, 238, 1) !important;
    border-right-color: rgba(2, 153, 238, 1) !important;
}

.card-head.nav-tabs > li > a, .card-head > .nav-tabs > li > a {
    line-height: 37px;
    padding-top: 0;
    padding-bottom: 0;
}

.card-head.nav-tabs > li > a, .card-head > .nav-tabs > li > a {
    line-height: 37px;
    padding-top: 0;
    padding-bottom: 0;
    color: rgba(123, 123, 123, 1);
}

.card-head.nav-tabs, .card-head > .nav-tabs {
    border-radius: 5px;
    padding-top: 4px;
}

.nav-tabs {
    border-bottom: 0px solid #dddddd !important;
}


    .nav-tabs > li {
        float: left;
        margin-bottom: -1px;
        padding: 7px;
    }

.card-lst .list:hover, .card-lst .list.active {
    box-shadow: none !important;
    margin: 0px !important;
}

.dataTables_buttons .cma_top_icon i {
    background: #FFFFFF;
    border: 1px solid #EFEFEF;
    box-shadow: 0px 1px 4px rgba(0, 0, 0, 0.05);
    border-radius: 5px;
    padding: 4px 15px;
    color: red;
    color: #0A164C !important;
}

.dataTables_wrapper table thead tr th {
    background: #d4efff !important;
    border-radius: 0px !important;
    color: #2B2E32 !important;
    font-family: Roboto;
    font-size: 14px;
    font-style: normal;
    font-weight: 500;
    line-height: normal;
    letter-spacing: 0.3px;
}

.trbg > td {
    background-color: #ffffff !important;
    border: 1px solid #80c8ff;
}

.dataTables_wrapper table tbody tr:nth-child(2n) td {
    /*background: #ffffff !important;*/
}

.table.dataTable > tbody > tr > td.dt-center {
    filter: none !important;
    background: #FFF;
    box-shadow: 0px 0px 9px 0px rgba(0, 0, 0, 0.07) !important;
}

table.dataTable tbody tr {
    background-color: transparent;
    border: 1px solid rgba(244, 244, 244, 1);
}

.cma_primary_button:hover, .cma_primary_button:focus {
    background: rgba(0, 147, 230, 1) !important;
    font-family: 'Plus Jakarta Sans';
    font-size: 15px !important;
    border: 1px solid rgba(0, 147, 230, 1) !important;
    color: #fff !important;
}

.dataTables_wrapper .dataTables__bottom {
    background: rgba(248, 250, 255, 1) !important;
    margin-top: 15px !important;
}

.dataTables_scrollBody table tbody tr td:last-child, .dataTables_scrollHead table thead tr th:last-child {
    box-shadow: none !important
}

.dataTables_wrapper .dataTables__top .input-group.prefix {
    border: unset;
    transition: none !important;
}

.dataTables_wrapper .input-group.prefix .form-control {
    padding-left: 32px;
    border: 1px solid #D5D5D6 !important;
    width: 190px;
    border-radius: 5px !important;
    transition: none;
}

button.button-common, button.button-common:hover {
    color: rgba(181, 116, 35, 1) !important;
}

.dependentContainerBorder {
    padding: 0px 20px !important;
}

.card-head header {
    display: inline-block;
    padding: 11px 1px;
    vertical-align: middle;
    line-height: 7px;
    font-size: 18px;
}

.explosiveinfoContainer:nth-child(even) {
    background-color: #f2f2f2; /* Light grey background color */
}

.dataTables_wrapper table thead tr th {
    background: rgba(255, 247, 241, 1) !important;
}

.nav-tabs > li > a {
    margin-right: 2px;
    line-height: 1.846153846;
    border: none;
    border-bottom: 2px solid transparent;
    border-radius: none;
    opacity: 0.55;
    font-weight: 500;
    text-transform: capitalize;
}

.card-head > .nav-tabs > li > a, .nav-tabs > li.active > a, .nav-tabs > li.active > a:hover, .nav-tabs > li.active > a:focus {
    font-size: 16px;
    padding-left: 10px;
    padding-right: 10px;
}

.card-lst .list.list_status.all {
    background: #b574234f;
}

.card-head {
    position: relative;
    vertical-align: middle;
    border-radius: 2px 2px 0 0;
    /* box-shadow: 3px 0px 10px 0px rgba(0, 0, 0, 0.1); */
    border: none;
    padding: 0 0 5px 10px;
    border-bottom: 1px solid #e6dfd5;
    min-height: auto !important;
    line-height: normal !important;
}

    .card-head:before {
        content: "";
        position: absolute;
        width: 5px;
        height: 26px;
        display: block;
        background: #C98A51;
        border-radius: 3.40282e38px;
        left: 0;
    }

.table-responsive-lg table thead {
    background: rgba(0, 147, 230, 1);
    border-bottom: 0px solid rgba(0, 147, 230, 1);
    border-radius: 5px 5px 0px 0px;
    color: #ffffff !important;
    background: #d4efff57 !important;
}

.table-responsive-lg table tbody tr:nth-child(2n) {
    background: none;
    border: solid 1px rgba(244, 244, 244, 1) !important;
}

/*#base {
    background-color: rgba(247, 247, 247, 1) !important;
}*/

.main-content {
    /* background-color: #f0f1f8 !important;*/
    background-color: #faf7f2 !important;
}

body [class*=" md-"], [class^=md-] {
    font-size: 1.2em;
    margin-top: -0.2em;
    margin-bottom: -0.2em;
    color: #000;
}

#base {
    flex: 1;
    display: flex;
    flex-direction: column;
}

#content {
    flex: 1;
    padding-bottom: 48px;
}

footer {
    background-color: #f8f9fa;
    position: fixed;
    left: var(--sideMenuWidth);
    right: 0;
    bottom: 0;
    z-index: 99;
}

    footer .card {
        padding: 0px 8px;
        margin: 0 !important;
        font-size: 15px;
        font-weight: 400;
        line-height: 24px;
        text-align: left;
        text-underline-position: from-font;
        text-decoration-skip-ink: none;
        color: #595A64;
        width: 100%;
    }

.automatonShowFilter {
    background-color: #0093E6 !important;
    color: #ffff !important;
    padding: 10px 6px !important;
    border-radius: 4px;
    height: 40px;
    width: 40px;
}

.menubar-hoverable.header-fixed #base {
    padding-top: 80px !important;
    background: #faf7f2 !important;
}
    /*    .menubar-hoverable.header-fixed #base .row.daily_shift {
        padding-top: 83px !important;
    }*/

    .menubar-hoverable.header-fixed #base .row.daily_shift:has(#map-tab-content) {
        padding-top: 0px !important;
    }

.active .target-icon {
    filter: grayscale(0) brightness(2);
    transition: filter 0.3s ease;
}

.profileicon img {
    width: 35px;
    height: 35px;
    border-radius: 40px;
    cursor: pointer;
}

.page-header-box {
    padding: 14px clamp(12px,1.5vw,30px) !important;
}

.mainSideMenu {
    display: flex;
    flex-direction: column;
    height: 98vh;
    margin-bottom: 0 !important;
}

.profileicon {
    margin-top: auto;
}

    .profileicon .menu-dropdown ul li a::before {
        display: none !important
    }

    .profileicon .menu-dropdown ul li a {
        display: flex !important;
        /* flex-wrap: nowrap; */
        align-content: center !important;
        flex-direction: row !important;
        justify-content: start !important;
        padding: 10px 0px !important;
    }

        .profileicon .menu-dropdown ul li a i {
            padding-right: 10px;
        }

.card-lst .list {
    display: flex;
    padding: 7px 14px;
    border-radius: 5px;
    justify-content: space-between;
    align-items: center;
}

.maker_checker_card {
    background: #ffffff !important;
    padding: 10px !important;
    box-shadow: 0px 10px 20px 5px #0000000A;
    border: solid 1px #DDE1EF;
}

.dataTables_wrapper table thead tr th.dt-center {
    background: #f0faff !important;
}
/*DashBoard style */

.arrow_value {
    display: flex;
    align-items: center;
    gap: 30px;
}

.target-container {
    display: flex;
    gap: 10px;
}

.card-section {
    background: #fff;
    border-radius: 8px;
    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
    padding: 15px !important;
    min-width: 350px;
    flex: 1;
}

    .card-section.material-targets {
        /*        background: linear-gradient(224.38deg, rgba(0, 147, 230, 0.15) 0%, rgba(0, 147, 230, 0) 24.3%);*/
        border: 0.72px solid;
        border-image: linear-gradient(224.38deg, rgba(0, 147, 230, 0.95) 0%, rgba(0, 147, 230, 0) 46.3%);
        border-image-slice: 1;
        overflow-x: hidden;
        height: 315px;
    }

    .card-section.explosive-targets {
        border: 0.72px solid;
        border-image: linear-gradient(224.38deg, rgba(230, 0, 0, 0.95) 0%, rgba(230, 0, 0, 0) 46.3%);
        border-image-slice: 1;
        overflow-x: hidden;
        height: 315px;
        background: linear-gradient(224.38deg, rgb(228 10 10 / 20%) 0%, rgba(0, 147, 230, 0) 22.3%);
    }



    .card-section.fuel-targets {
        border: 0.72px solid;
        border-image-source: linear-gradient(224.12deg, #28BF68 0%, rgba(40, 191, 104, 0) 47.1%);
        border-image-slice: 1;
        overflow-x: hidden;
        height: 315px;
        background: linear-gradient(224.38deg, rgb(40 191 104 / 20%) 0%, rgba(0, 147, 230, 0) 22.3%);
    }

    .card-section.fuel-consumption-targets {
        border: 0.72px solid;
        border-image-source: linear-gradient(224.12deg, #2364B5 0%, rgba(35, 100, 181, 0) 47.1%);
        border-image-slice: 1;
        overflow-x: hidden;
        height: 315px;
        background: linear-gradient(224.38deg, rgb(35 100 181 / 20%) 0%, rgba(35, 100, 181, 0) 22.3%);
    }
/*rgba(35, 100, 181, 1)*/
.section-title {
    font-size: 18px;
    margin-top: 6px;
    margin-bottom: 15px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    font-size: 16px;
    font-weight: 700;
    color: #000000 !important;
}



/* Target Cards */
.target-card {
    display: flex;
    align-items: center;
    justify-content: space-between;
    border-radius: 0px;
    padding: 2px 13px;
    margin-bottom: 6px;
    border: solid 1px transparent;
    cursor: pointer
}

    .target-card.active {
        box-shadow: 0px 4px 6px 0px hsla(0, 0%, 0%, 0.2);
        border: 1px solid hsla(202, 100%, 45%, 1);
    }

        .target-card.active .arrow {
            color: hsla(202, 100%, 45%, 1);
        }

    .target-card:nth-child(odd) {
        background: rgb(233 233 233 / 48%);
    }



/* Specific Item Icons */


/* Text Details */
.details {
    flex-grow: 1;
    margin-left: 10px;
}

.name {
    font-size: 14px;
    font-weight: bold;
    margin: 0px !important;
    color: #222222 !important;
    font-size: 16px;
    font-weight: 500;
}

.quantity {
    font-size: 12px;
    color: #7B7B7B;
    margin: 0px !important;
}

/* Arrow */
.dash_arrow {
    font-size: 18px;
    color: #7B7B7B;
}


.tab_nav {
    border-bottom: 1px solid rgba(231, 234, 239, 1) !important;
    opacity: 1 !important;
}

    .tab_nav .active {
        border-bottom: solid 2px rgba(0, 147, 230, 1);
        color: rgba(0, 147, 230, 1);
        opacity: 1 !important;
    }

    .tab_nav .nav-item {
        padding: 0px !important;
    }

.nav-tabs.tab_nav > li > a:hover {
    border-bottom: solid 2px rgba(0, 147, 230, 1)
}

.tab_nav + .tab-content .tab-pane {
    margin-top: 15px !important;
}

.Performance_card .card-head {
    align-items: start !important;
    line-height: 20px !important
}

.Performance_card label {
    line-height: 0px !important
}

.Performance_card .form-group {
    margin: 0px 10px;
}

input[type="date"]::-webkit-calendar-picker-indicator {
    filter: invert(37%) sepia(78%) saturate(643%) hue-rotate(190deg) brightness(92%) contrast(95%);
    cursor: pointer;
    color: #04927b;
}

input[type="date"] {
    color: rgba(123, 123, 123, 1) !important;
    font-size: 12px;
}

/**/
.performance-card {
    text-align: center;
    border: 0px solid #eee;
    border-radius: 10px;
    padding: 0px;
    width: 180px;
}



    .performance-card img {
        width: 32px;
        height: 37px;
        margin-bottom: 10px;
    }

    .performance-card .value {
        font-size: 14px;
        font-weight: 500;
    }

/* Nav Tabs Styling */
.performance-tab .nav-tabs .nav-link {
    padding: 7px 0px !important;
    /*background-color: rgba(252, 252, 252, 1);*/
    border: 0px solid #F4F4F4;
    border-bottom: 1px solid #f4f4f4;
    box-shadow: 0px 0px 5px 0px #00000008;
    border-top: 0px;
    border-radius: 0px 0px 0px 0px;
    margin: 0 !important;
}

    .performance-tab .nav-tabs .nav-link.active {
        color: #007bff;
        font-weight: bold;
        background-color: transparent !important;
    }

.performance-tab .nav-item {
    background-color: rgba(252, 252, 252, 1) !important;
    border: solid 1px #F4F4F4 !important;
    border-radius: 10px 10px 10px 10px !important;
    border-bottom: solid 0px !important;
    border-top: solid 3px #fff !important;
}

    .performance-tab .nav-item.active {
        background-color: rgba(252, 252, 252, 1) !important;
        border: solid 1px #F4F4F4 !important;
        border-radius: 10px 10px 0px 0px !important;
        border-bottom: solid 0px !important;
    }

.performance-tab .nav-tabs .nav-link {
    background-color: #FCFCFC !important;
    /*  background-color: transparent !important;*/
    border: 0px solid rgba(244, 244, 244, 1);
    opacity: 1;
    height: 100%;
}

.performance-tab .tab_nav .nav-item {
    padding: 0px 0px !important;
}

.performance-tab .nav-tabs.tab_nav > li > a:hover {
    border-bottom: 1px solid #f4f4f4;
}
/* Balance Bar Styling */
.trucking-balance {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 20px;
}

.trucking-item {
    text-align: center;
}

.circle {
    width: 40px;
    height: 40px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 14px;
    font-weight: bold;
    color: white;
}

    .circle.blue {
        background-color: #007bff; /* Blue */
    }

    .circle.navy {
        background-color: #1b1b6e; /* Navy */
    }

.label {
    margin-top: 8px;
    font-size: 12px;
    color: #666; /* Gray */
}

.balance-bar::before {
    content: '';
    width: 80px;
    height: 2px;
    background-color: #888;
    display: block;
    margin-bottom: -5px;
}

.triangle {
    width: 0;
    height: 0;
    border-left: 10px solid transparent;
    border-right: 10px solid transparent;
    border-top: 15px solid #888;
}

/* Overall Target Styling */
.overall-target {
    text-align: center;
}

    .overall-target .label {
        margin-top: 10px;
        font-size: 14px;
        color: #666;
    }
/**/


.balance {
    text-align: center;
}

    .balance .weights {
        display: flex;
        align-items: center;
        justify-content: space-between;
    }

        .balance .weights .weight {
            display: flex;
            flex-direction: column;
            align-items: center;
        }

            .balance .weights .weight span:first-child {
                font-size: 20px;
                font-weight: bold;
                margin-bottom: 5px;
                color: white;
                background-color: #007bff; /* Blue for Under Trucking */
                border-radius: 50%;
                width: 35px;
                height: 35px;
                display: flex;
                justify-content: center;
                align-items: center;
            }

            .balance .weights .weight:last-child span:first-child {
                background-color: #1a1a5e; /* Dark Blue for Over Trucking */
            }

    .balance .bar {
        display: flex;
        justify-content: center;
        align-items: center;
        margin-top: 10px;
    }

        .balance .bar .line {
            width: 120px;
            height: 2px;
            background-color: gray;
            position: relative;
        }

        .balance .bar .triangle {
            width: 0;
            height: 0;
            border-left: 10px solid transparent;
            border-right: 10px solid transparent;
            border-top: 15px solid gray;
            position: absolute;
            bottom: -7px;
            left: 50%;
            transform: translateX(-50%);
        }

.overall {
    text-align: center;
}

    .overall .circle {
        width: 80px;
        height: 80px;
        background: conic-gradient(green 0% 40%, #e5e5e5 40% 100%);
        border-radius: 50%;
        display: flex;
        justify-content: center;
        align-items: center;
        margin: 0 auto;
    }

        .overall .circle span {
            font-size: 18px;
            font-weight: bold;
        }

    .overall span.text {
        display: block;
        margin-top: 10px;
        font-size: 14px;
        color: #555;
    }

.percontainer {
    display: flex;
    align-items: center;
    gap: 50px;
    background-color: white;
    padding: 20px;
    border-radius: 10px;
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
}

.tcontent.active {
    display: block;
}

.tcontent {
    display: none;
}

.map_card {
    box-shadow: 0px 2px 6px 1px rgba(0, 0, 0, 0.29);
    border: 1px solid rgba(239, 240, 240, 1)
}



.map_card {
    background: #fff;
    padding: 20px;
    margin: 15px 0;
    border-radius: 10px;
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.1);
}

    .map_card .info {
        flex: 1;
    }

        .map_card .info h3 {
            margin: 0;
            font-size: 18px;
            font-weight: bold;
            color: #333;
        }

        .map_card .info p {
            margin: 5px 0;
            color: #666;
            font-size: 14px;
        }

    .map_card .status {
        display: flex;
        align-items: center;
        gap: 10px;
    }

        .map_card .status img {
            width: 24px;
            height: 24px;
        }

        .map_card .status span {
            font-size: 14px;
            font-weight: bold;
            color: #333;
        }

    .map_card .sub-info {
        display: flex;
        align-items: center;
        gap: 20px;
        margin-top: 10px;
    }

        .map_card .sub-info div {
            text-align: center;
        }

        .map_card .sub-info img {
            width: 20px;
            height: 20px;
            display: block;
            margin: 0 auto 5px;
        }

        .map_card .sub-info span {
            font-size: 12px;
            color: #666;
        }

.status-indicator {
    width: 10px;
    height: 10px;
    border-radius: 50%;
    margin-left: 5px;
}

    .status-indicator.running {
        background-color: #52c41a;
    }

    .status-indicator.breakdown {
        background-color: #ff4d4f;
    }

.search-container {
    display: flex;
    align-items: center;
    width: 100%;
}

.search_icon {
    position: absolute;
    right: 70px;
    opacity: 0.4;
}


.d-flex {
    display: flex;
}

.align-items-center {
    align-items: center;
}

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

.header {
    display: flex;
    justify-content: space-between;
    margin-bottom: 16px;
}

.icon img {
    width: 32px;
    height: 32px;
    border-radius: 50%;
    border: 2px solid #ddd;
    margin-right: 12px;
}

.vehicle-details {
    flex-grow: 1;
}

.vehicle-number {
    font-weight: bold;
    font-size: 16px;
}

.status {
    font-size: 14px;
    display: flex;
    align-items: center;
    margin-top: 4px;
    color: rgba(135, 138, 153, 1);
    font-size: 12px;
    font-weight: 400;
}

.status-dot {
    width: 10px;
    height: 10px;
    background-color: green;
    border-radius: 50%;
    margin-left: 6px;
}

.last-update {
    font-size: 12px;
    color: #888;
}



/*.details {
    list-style: none;
    padding: 0;
    margin: 0;
    display: flex;
    justify-content: space-around;
    align-items: center;
}*/

.detail-item {
    font-size: 10px;
    font-weight: 400;
    line-height: 12.6px;
    text-align: center;
    text-underline-position: from-font;
    text-decoration-skip-ink: none;
    display: flex;
    align-items: center;
    flex-direction: column;
}

    .detail-item img {
        width: 24px;
        height: 24px;
        margin-bottom: 4px;
    }

.vehicle-info {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.time_data {
    display: flex;
    gap: 10px;
    align-items: center;
}

.map_side_card {
    margin-top: 10px;
    padding: 0px 10px;
    box-shadow: none;
    border-top: solid 0px rgba(221, 225, 239, 1);
    border-bottom: solid 1px rgba(221, 225, 239, 1);
    text-align: center;
    margin-bottom: 10px;
}

.dot {
    display: block;
    padding: 4px 4px;
    background-color: rgba(135, 138, 153, 1);
    border-radius: 20px;
}

.speed-info {
    display: flex;
    align-items: center;
    gap: 5px;
}

.error_message {
    color: rgba(246, 45, 81, 1);
    padding: 6px 10px;
    text-align: center;
    background-color: rgba(255, 233, 233, 0.9);
    font-size: 10px;
    font-weight: 500;
    text-align: center;
    border: 1px solid rgba(255, 196, 196, 1)
}

.map_side_card.active {
    background-color: rgb(0 147 230 / 20%);
}

.svg-icon {
    filter: invert(34%) sepia(89%) saturate(739%) hue-rotate(200deg) brightness(94%) contrast(93%);
}
/*.icon-container {
    display: inline-block;
    background: rgba(242, 87, 103, 0.2);*/ /* Semi-transparent background */
/*border: 2px solid rgba(242, 87, 103, 1);*/ /* Solid border with specified color */
/*border-radius: 8px;*/ /* Optional: Rounded corners */
/*padding: 10px;*/ /* Space inside the container */
/*}*/

.vehicle-container {
    font-family: Arial, sans-serif;
}

.balance-target-container {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-top: 0px;
}

.balance-container {
    text-align: center;
    position: relative;
}

.line {
    width: 200px;
    height: 4px;
    background-color: gray;
    position: relative;
    margin-bottom: 20px;
    margin: 0 auto;
    top: 49px;
    border-radius: 10px;
}





.circle {
    width: 40px;
    height: 40px;
    background-color: #007bff;
    border-radius: 50%;
    display: flex;
    justify-content: center;
    align-items: center;
    color: white;
    font-weight: bold;
    position: absolute;
    top: -46px;
}

    .circle.right {
        background-color: #0d1b2a;
        right: 0;
    }

    .circle.left {
        left: 0;
    }

.text-left,
.text-right {
    font-size: 14px;
    color: gray;
    position: absolute;
    top: 50px;
}

.text-left {
    left: -13px;
}

.text-right {
    right: -20px;
}

.target-container1 {
    display: flex;
    flex-direction: column;
    align-items: center;
}

.circle-progress {
    position: relative;
    width: 70px;
    height: 70px;
}

    .circle-progress svg {
        transform: rotate(-90deg);
    }

.progress-background {
    stroke-width: 3;
}

.progress {
    stroke-width: 3;
    stroke-dasharray: 40, 100; /* Percentage progress */
}

.progress-text {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    font-size: 16px;
    font-weight: bold;
    color: #28a745;
}

.target-label {
    font-size: 14px;
    margin-top: 8px;
    color: gray;
    text-align: center;
}

@media (max-width: 1250px) and (min-width: 768px) {
    .target-container {
        overflow: scroll;
    }
}

@media (max-width: 768px) {
    .target-container {
        overflow: scroll;
        display: flex;
        flex-direction: column;
    }
}

.progress-card {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    width: 150px;
    height: 150px;
    border: 1px solid #f0f0f0;
    border-radius: 8px;
    box-shadow: 0px 2px 5px rgba(0, 0, 0, 0.1);
    padding: 10px;
    font-family: Arial, sans-serif;
}

.chart-container1 {
    position: relative;
    width: 100px;
    height: 100px;
}

.chart-text {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    font-size: 16px;
    font-weight: bold;
    color: #28a745;
}

.label {
    margin-top: 10px;
    font-size: 14px;
    color: #666;
}

.arrow-icon {
    margin-top: 46px;
}

li.profileicon .menu-dropdown {
    bottom: 20px !important;
    top: unset;
}

.nav .open > a, .nav .open > a:hover, .nav .open > a:focus {
    background-color: #e5e6e6;
    border-color: #0aa89e;
    border: none;
    background: transparent !important;
    border: solid 0px #0093e6 !important;
}

.dropleft {
    left: -100px !important;
}

.filter-item option {
    color: #000;
}

.page-header-box > h1 {
    color: rgba(38, 46, 47, 1) !important;
    display: inline-table;
    align-items: center;
}


#rejecticon_header {
    display: none !important;
}

#reworkicon_header {
    display: none !important;
}

.status-approved {
    color: #17C05B !important;
    font-weight: bold;
}

.status-rework {
    color: #a9a915;
    font-weight: bold;
}

.status-rejected {
    color: #F24B44 !important;
    font-weight: bold;
}

.status-ready-for-review {
    color: #DF8B06 !important;
    font-weight: bold;
}

.status-unknown {
    color: gray;
    font-weight: bold;
}

.cls_process {
    color: #B57423;
    font-weight: 600;
    font-size: 17px;
}

.cls_material {
    color: #B57423;
    font-weight: 600;
    font-size: 17px;
}

.cls_sector {
    color: #B57423;
    font-weight: 600;
    font-size: 17px;
}

.cls_pit {
    color: #B57423;
    font-weight: 600;
    font-size: 17px;
}

.cls_materialtype {
    color: #B57423;
    font-weight: 600;
    font-size: 17px;
}

.cls_plannumber {
    color: #B57423;
    font-weight: 600;
    font-size: 17px;
}

.card-padding {
    padding: 0px 10px;
}

.page-header-box .btn-icon-toggle .fa, .btn-icon-toggle .md, .btn-icon-toggle .glyphicon {
    margin: 0;
    color: #0093e6;
    font-size: 16px;
    font-weight: 600;
}

.arrow_button {
    border-bottom: 2px solid rgba(0, 147, 230, 1);
    color: rgb(255 255 255) !important;
    background-color: rgba(0, 147, 230, 1);
    border: none;
    border-radius: 3px;
}

    .arrow_button:hover {
        border-bottom: 2px solid rgba(0, 147, 230, 1) !important;
        color: rgb(255 255 255) !important;
        background-color: rgba(0, 147, 230, 1) !important;
        border: none !important;
        border-radius: 3px !important;
    }

.card-head.nav-tabs, .card-head > .nav-tabs {
    padding: 0 0px !important;
}

.status_bg {
    background-color: #d4efff57 !important;
    /* border: solid 1px #eee; */
    padding: 3px 14px;
}

.form-group span.select2 .selection .select2-selection .select2-selection__rendered {
    line-height: 25px;
}

.table.dataTable > tbody > tr > td.dt-center {
    display: flex;
    align-items: center;
}

.profileicon {
    position: fixed !important;
    bottom: 0
}

.filter-button button:hover {
    background-color: #002766 !important;
    color: #fff;
    border: none;
    border-radius: 5px;
    padding: 10px 20px;
    cursor: pointer;
}

.border-bottom-0 {
    border-bottom: solid 0px !important;
}

.perform_nav.nav.nav-tabs {
    display: flex;
    align-items: center;
    /* margin-left: 16px !important; */
    border: none;
    padding-left: 0px !important;
    box-shadow: unset !important;
}

.list-map-tabs {
    margin-left: auto; /* Push the list-map-tabs to the end */
    display: flex;
    align-items: center; /* Align vertically with other tabs */
}

.margin-left {
    margin-left: auto;
}

/*.perform_nav.nav-tabs > li.active > a {
    padding: 0px 16px !important;
}
*/
.performance-tab .nav-item.active {
    background-color: #ffff !important;
    border-top: 3px solid #0093E6 !important;
    border-radius: 4px 4px 0px 0px !important;
}

.nav.nav-tabs .active .target-icon {
    filter: grayscale(0) brightness(3) !important;
    transition: filter 0.3s ease !important;
}

.nav.nav-tabs .target-icon {
    filter: none !important;
    transition: none !important;
}

.printablerow {
    padding-top: 0px !important;
}


.profile_role {
    font-size: 10px !important;
}

.username {
    margin: 0px;
    padding-bottom: 0px;
}

.btn-flat:hover, .btn-icon-toggle:hover, .btn-flat:focus, .btn-icon-toggle:focus, .open .dropdown-toggle.btn-flat, .open .dropdown-toggle.btn-icon-toggle {
    background-color: transparent;
    border-color: transparent;
    -webkit-box-shadow: none;
    box-shadow: none;
    color: inherit;
}

.performance-tab .nav-item .title {
    color: #7B7B7B !important;
    line-height: 2 !important;
    font-size: 14px;
    font-weight: 500;
}

.performance-tab .nav-item.active .title {
    color: #0093E6 !important;
}

.performance-tab .nav-item .value {
    color: #7B7B7B !important;
}

.performance-tab .nav-item.active .value {
    color: #0093E6 !important;
}

.activeicon {
    filter: grayscale(100%);
    transition: filter 0.1s ease;
}

.nav-item.active .activeicon {
    filter: invert(32%) sepia(92%) saturate(2653%) hue-rotate(191deg) brightness(98%) contrast(90%);
}

.vertical-tabs .tab {
    background-color: #fff;
    color: #007bff;
    box-shadow: 0 2px 5px rgba(0, 123, 255, 0.2);
    margin: 0;
    gap: 13px;
    margin-right: 15px;
}

.text-white {
    color: white !important;
}

.box .form-group {
    margin: 0px !important;
}

.card-head > .nav-tabs > li > a, .nav-tabs > li.active > a {
    padding: 0px 16px !important;
}

.performance-tab .nav-tabs > li.active > a, .performance-tab .nav-tabs > li.active > a:hover {
    padding: 7px 0px !important;
}

.card-head > .nav-tabs > li > a, .nav-tabs > li.active > a {
    padding: 0px 10px !important;
}

.performance-tab .nav-tabs > li.active > a, .performance-tab .nav-tabs > li.active > a:hover {
    padding: 7px 0px !important;
}

.perform_nav.nav-tabs > li.active > a {
    border: none;
    border-bottom: 2px solid rgba(0, 147, 230, 1);
    color: rgb(255 255 255) !important;
    background-color: rgba(0, 147, 230, 1);
}

.perform_nav.nav-tabs > li.active > a {
    border: none;
    border-bottom: 2px solid rgba(0, 147, 230, 1);
    color: rgb(255 255 255) !important;
    background-color: rgba(0, 147, 230, 1);
}

.Aibtn {
    background-color: #0093E6 !important;
    color: #ffff !important;
    padding: 10px 6px !important;
    border-radius: 4px;
    border: none;
}

    .Aibtn:hover {
        background-color: #0093E6 !important;
        color: #ffff !important;
        padding: 10px 6px !important;
        border-radius: 4px;
        border: none;
    }

.text-end {
    text-align: end;
}

.filter-bar input {
    background-color: transparent;
    border: none;
    color: #fff;
    padding: 0;
    height: 13px;
}

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

@media (min-width: 320px) and (max-width: 1023px) {
    .card-head.nav-tabs, .card-head > .nav-tabs {
        white-space: nowrap !important;
        overflow-y: hidden !important;
        overflow-x: scroll !important;
    }

    .card-section {
        min-width: 319px !important;
    }

    .nav.nav-tabs.nav-overall {
        white-space: nowrap;
        overflow-x: scroll;
        overflow-y: hidden;
    }

    .target-container {
        flex-direction: column !important;
    }

    .toggle-button.arrow_button {
        display: none;
    }
}

.nano .gui-controls li:first-child {
    background: #0A164C !important;
}

.target-container ::-webkit-scrollbar {
    width: 3px;
}

.target-container ::-webkit-scrollbar-button {
    background: #fff
}

.target-container ::-webkit-scrollbar-track-piece {
    background: #fff
}

.target-container ::-webkit-scrollbar-thumb {
    background: #888
}

.filter-item select {
    height: 28px !important;
}

.nano.has-scrollbar .gui-controls li.has-dropdown.profileicon {
    background-color: #0a164c !important;
    z-index: 999;
}

body .help-block-orange {
    background: #0093e6 !important;
    margin-bottom: 10px;
}

.filter-item span {
    margin-bottom: 5px !important;
    color: rgba(255, 255, 255, 1);
    font-size: 12px !important;
    font-weight: 200 !important;
}

.filter-item select {
    background-color: transparent !important;
    color: #fff !important;
    font-size: 12px !important;
    font-weight: 700 !important;
}


.filter-bar .select2-container .select2-selection--single .select2-selection__rendered {
    display: block;
    padding-left: 0px !important;
    padding-right: 20px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.filter-item .select2-container--default .select2-selection--single {
    height: 9px !important;
}

    .filter-item .select2-container--default .select2-selection--single .select2-selection__rendered {
        line-height: 15px !important;
    }

    .filter-item .select2-container--default .select2-selection--single .select2-selection__arrow {
        height: 15px !important;
    }

.filter-item .select2-container .select2-selection--single .select2-selection__rendered {
    padding-left: 0px !important;
    font-size: 10px !important;
    font-weight: 700 !important;
}

.filter-button button {
    padding: 5px 15px !important;
}

.daily_shift .nav > li > a > img {
    width: 18px;
    height: 21px;
}

.row.printablerow {
    margin-top: 0px;
}

.maker_checker_card {
    margin-top: 0px;
}


.filter_card.card {
    margin: 0px auto;
    background-color: #007bff;
    border-radius: 8px;
    box-shadow: none;
    margin-bottom: 0px !important;
}

.filter_card .card-body {
    padding: 12px !important;
}

.filter-bar {
    display: flex;
    justify-content: end;
    align-items: center;
    gap: 15px;
    width: 100%;
}

.filter-item {
    display: flex;
    flex-direction: row;
    align-items: center;
    color: #fff;
    border-right: 1px solid rgb(96 91 91 / 22%) /* Vertical line */;
    margin: 0px 7px;
}

    .filter-item:last-child {
        border-right: none;
    }

    .filter-item span {
        font-size: 12px;
        font-weight: 600;
        line-height: 15.12px;
        color: rgba(255, 255, 255, 1);
    }

    .filter-item select {
        padding: 0px 0px;
        border-radius: 5px;
        border: none;
        font-size: 14px;
        background-color: transparent;
    }

.filter-button button {
    background-color: #002766;
    color: #fff;
    border: none;
    border-radius: 5px;
    padding: 10px 20px;
    cursor: pointer;
}

    .filter-button button:hover {
        background-color: #003a99;
    }

.box {
    display: flex;
    flex-direction: column;
    justify-content: start;
    align-items: flex-start;
    padding: 0px 7px;
}

.vertical-tabs {
    display: flex;
    flex-direction: row;
    background-color: #f8f9fa;
    border-radius: 25px;
    padding: 0px;
    box-shadow: 0px 0px 3px 0px rgba(0, 0, 0, 0.1) inset;
    align-items: center;
    padding: 10px 10px;
}


    .vertical-tabs .tab {
        display: flex;
        align-items: center;
        justify-content: center;
        padding: 0px 14px;
        font-size: 14px;
        border-radius: 25px;
        cursor: pointer;
        transition: all 0.3s ease;
        margin-bottom: 10px;
        height: 32px;
    }

        .vertical-tabs .tab.active {
            background-color: #fff;
            color: #007bff;
            border: 1px solid #007bff !important;
            box-shadow: 0 2px 5px rgba(0, 123, 255, 0.2);
            margin: 0;
            gap: 13px;
            margin-right: 15px;
        }

        .vertical-tabs .tab.inactive {
            color: #6c757d;
            border: none;
            background-color: transparent;
            margin: 0;
            gap: 13px;
            margin-right: 15px;
        }

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


.daily_shift .card-head {
    line-height: 36px !important;
}

.target-card.selected {
    border: 2px solid #007bff;
    background-color: #f0f8ff;
    box-shadow: 0 0 5px rgba(0, 123, 255, 0.5);
}

.rejecticon_header {
    display: none;
}

.review_title {
    display: none;
}

/*section.main-content {
    padding: 0px 0px;
}
*/
.performance-tab .nav-tabs > li.active > a, .performance-tab .nav-tabs > li.active > a:hover, .nav-tabs > li.active > a:focus {
    border: none;
    border-bottom: 0px solid rgba(0, 147, 230, 1) !important;
    color: #fff !important;
    cursor: default;
    opacity: 1;
    border-radius: 0px;
    line-height: 41px !important;
}

.performance-tab {
    padding: 10px;
}

.nav-tabs > li > a {
    margin-right: 2px;
    line-height: 1.846153846;
    border: none;
    border-bottom: 2px solid transparent;
    border-radius: 0px;
    opacity: 0.55;
    font-weight: 500;
    text-transform: capitalize;
    padding: 0px 29px;
    line-height: 41px !important;
}

.filter_section {
    padding: 10px;
    background-color: #F8F8F8;
    border: 1px solid #DDE1EF;
    border-right: solid 0px;
    border-left: solid 0px;
}

.performance-tab .nav-tabs > li.active > a, .performance-tab .nav-tabs > li.active > a:hover, .nav-tabs > li.active > a:focus {
    border: none;
    border-bottom: 0px solid rgba(0, 147, 230, 1) !important;
    color: #fff !important;
    cursor: default;
    opacity: 1;
    border-radius: 0px;
}

.row.daily_shift {
    margin: 0px !important;
}

.filter-bar .form-group.form-group--float-above {
    line-height: 1 !important;
}

.row {
    margin: 0;
}

@-moz-document url-prefix() {
    .nano > .nano-content {
        /* Hide scrollbar */
        scrollbar-width: none; /* Firefox */
        -ms-overflow-style: none; /* Internet Explorer/Edge */
    }

    .nano .gui-controls li:first-child {
        border-right: 0px solid #EBF1F6 !important;
    }

    .filter-item option {
        background-color: #fff !important;
        padding: 0px !important;
        margin: 0px !important;
    }
}


/*login page*/
.card.login-card {
    box-shadow: unset;
    border: 0;
    max-width: 100%;
    margin-top: 0px;
    padding-top: 0px;
}

.login-section {
    margin: 0 auto;
    max-width: 520px;
}

.col.col-login {
    width: 500px;
    max-width: 100%;
}

.card-head.text-right img {
    background: transparent !important;
    margin-bottom: 50px;
}

.card-head img {
    background: transparent;
    float: right;
}

.login-card h3 {
    color: #141414;
    font-weight: 700;
    font-family: 'Plus Jakarta Sans';
    font-size: 30px;
    padding-bottom: 0px !important;
    margin-bottom: 18px !important;
}

.login-card p {
    color: #141414;
    font-size: 14px;
    font-family: 'Plus Jakarta Sans';
    padding-left: 4px;
    padding-bottom: 0px;
    margin-bottom: 15px;
}

.login form .form-group {
    font-family: 'Plus Jakarta Sans';
    font-size: 16px;
    font-weight: 400;
}

    .login form .form-group input {
        border: 1px solid #ccc;
        background: #FBFBFB;
        height: 45px;
        color: #141414 !important;
    }

    .login form .form-group label {
        padding-bottom: 13px;
    }

    .login form .form-group .input-group {
        height: auto;
    }

.forgot-pwd, .forgot-pwd:hover, .forgot-pwd:focus {
    background: transparent !important;
    float: right;
    height: auto !important;
    padding: 0px;
    color: #141414 !important;
    font-weight: 500 !important;
    margin-top: 0px;
    text-decoration: underline;
    margin-top: -2px;
    border: solid 0px !important;
}

.login-sub button[type="submit"] {
    background: #B57423 !important;
    border: 0px !important;
    height: 50px;
    border-radius: 8px !important;
    font-family: 'Plus Jakarta Sans';
    font-weight: 500;
}


.login-sub {
    border-radius: 7px;
    background: #B57423 !important;
    margin-bottom: 0px;
    margin-top: 31px !important;
}

.reg_text p {
    color: #141414 !important;
    font-weight: 400;
    margin-top: 25px;
}

    .reg_text p a {
        color: #141414 !important;
        font-weight: 700 !important;
    }

.download-app {
    display: block;
    margin-top: 30px;
}

.download-txt {
    font-weight: 500;
    font-size: 14px !important;
    color: #141414 !important;
    font-family: 'Plus Jakarta Sans';
    text-align: center;
    padding-bottom: 10px;
    position: relative;
}

.download-mg {
    display: flex;
    justify-content: center;
    margin-top: 17px;
}

    .download-mg a {
        padding: 0px 6px;
    }

.login-card .card-head {
    min-height: auto;
    margin-bottom: 55px;
}



.carousel-inner {
    height: 98vh;
    border-radius: 42px !important;
}

.carousel-caption {
    position: absolute;
    bottom: 60px;
    z-index: 1;
    text-align: left;
}

    .carousel-caption h5 {
        font-family: 'Plus Jakarta Sans';
        color: #fff;
        font-size: 28px;
        font-weight: 700;
    }

    .carousel-caption p {
        font-size: 16px;
        font-weight: 400;
        font-family: 'Plus Jakarta Sans';
    }

.carousel-item::after {
    content: "";
    position: absolute;
    width: 100%;
    height: 100%;
    background: rgba(0,0,0,0.5);
    top: 0px;
    left: 0px;
    border-radius: 15px;
}

.carousel-item {
    position: relative;
}

.carousel-item {
    height: 100vh;
}

.has-success .form-control {
    border-color: #b57423 !important;
}

.download-txt::before, .download-txt::after {
    position: absolute;
    content: "";
    width: 40px;
    border-bottom: 1px solid #cacaca;
}

.download-txt::before {
    left: 75px;
    top: 12px;
}

.download-txt::after {
    right: 75px;
    top: 12px;
}

.login form .form-group span {
    background: #FBFBFB;
    line-height: 35px;
    border-left: 0px !important;
}

.carousel-indicators {
    z-index: 99;
    bottom: 20px;
}

.carousel-control-next, .carousel-control-prev {
    z-index: 9;
}

.row.login_section {
    padding: 5px 5px;
}

.carousel-indicators button:hover {
    background: #fff !important;
}

.login .alert {
    top: 0px !important;
}

.login .form-group.has-error .help-block {
    display: block;
    width: 100%;
    font-family: 'Plus Jakarta Sans';
}

.forgot-arrow a {
    background: transparent !important;
    border: solid 1px #b57423 !important;
    line-height: 20px !important;
    padding: 7px 12px;
}

    .forgot-arrow a:hover {
        background: transparent !important;
        border: solid 1px #b57423 !important;
        line-height: 20px !important;
        padding: 7px 12px;
    }


@media only screen and (min-width:320px) and (max-width:991px) {
    .bg-banner {
        display: none;
    }
}

/*login page*/
/*assignment page*/
@media only screen and (min-width:320px) and (max-width:895px) {
    .assignment-container {
        display: flex !important;
        flex-direction: column;
        justify-content: center;
        align-items: center;
    }

    .perform_nav.nav-tabs > li > a {
        display: block;
        margin: 0 auto;
        width: max-content !important;
    }
}

.assignment-container {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(430px, 1fr));
    gap: 23px;
    /*    margin: 10px;*/
    font-family: "Plus Jakarta Sans" !important;
}

    .assignment-container .request-card-list {
        /* max-width: 430px;*/
        width: 100%;
        /*        box-shadow: 0px 10px 20px 5px #0000000A;*/
        border: 1px solid #DDE1EF;
        background-color: #fff;
        /* max-width: 430px;*/
        /* padding-bottom: 14px; */
        /* height: 100%; */
        /* background: #E9F3F1 !important; */
    }

.assign_top_section {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 6px 10px;
}

    .assign_top_section > div {
        display: flex;
        flex-direction: column;
    }

.assign-middle-section {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    background: #EFF0F1;
    padding: 10px 20px;
}

.assign-lst ul {
    display: flex;
    margin: 0;
    padding: 0px;
    width: 100%;
    flex-direction: column;
    border: 0px solid #dcdfe2;
    border-radius: 5px;
}

    .assign-lst ul li {
        display: flex;
        justify-content: space-between;
    }

        .assign-lst ul li > div {
            display: flex;
            flex-direction: column;
        }

    .assign-lst ul li {
        display: flex;
        width: 100%;
        flex-direction: row;
        padding: 8px 10px;
        border-left: 3px solid transparent;
        align-items: center;
    }

.assign_top_section .tlt-num label {
    font-size: 14px;
    color: #7B7B7B;
    margin-bottom: 1px;
    padding-bottom: 0px;
    width: 98px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.assign_top_section .tlt-num span {
    color: #B57423;
    font-size: 18px;
}

.assign_top_section .large-scale label {
    font-size: 14px;
    color: #7B7B7B;
    margin-bottom: 1px;
    padding-bottom: 0px;
}

.assign_top_section .large-scale span {
    font-size: 15px;
    color: #434343;
}

.assign_top_section .breakdown span, .assign_top_section .underpref span {
    font-weight: 500;
    font-size: 11px;
    color: #7B7B7B;
}

.assign_top_section .breakdown, .assign_top_section .underpref {
    justify-content: center;
    display: flex;
    align-items: center;
    flex-direction: column;
}

    .assign_top_section .breakdown label, .assign_top_section .underpref label {
        padding: 0px;
        margin: 0px;
    }

.assign-middle-section div {
    color: #434343;
    font-weight: 700;
    font-size: 14px;
    display: flex;
    align-items: center;
}

.header_textsection {
    margin-top: 6px;
    padding: 0px 15px;
}

.assign-bottom-section {
    padding: 2px 20px;
    margin-bottom: 0px;
}

    .assign-bottom-section h5 {
        color: #7B7B7B;
        font-size: 14px;
        font-weight: 500;
    }

.assign-lst ul li:nth-child(2n) {
    background: #EAEAEA;
}

.assign-lst ul li .btm-lst label {
    margin-bottom: 0px;
    color: #434343;
    font-weight: 500;
    font-size: 13px;
    line-height: 12px;
}

.assign-lst ul li .btm-lst span {
    font-weight: 500;
    color: #7B7B7B;
    font-size: 11px;
}

.assign-lst {
    min-height: 0;
    overflow: auto;
    /* min-height: 95px; */
    /* margin-top: 10px; */
}

    .assign-lst ul li.active {
        background: #B52B230D;
        border-left: 3px solid #B52B23;
    }

    .assign-lst ul li .btm-lst label svg {
        margin-right: 8px;
    }

.assign-middle-section div span {
    margin-right: 3px;
    position: relative;
    top: 3px;
}

.assign-middle-section div svg {
    margin-left: 7px;
    position: relative;
    top: 1px;
}

.assign-middle-section div span svg {
    margin-left: 0px;
}

.tools .btn-icon-toggle i {
    transform: rotate(180deg);
    color: #838185;
    font-size: 22px;
}

.assign_top_section .breakdown label, .assign_top_section .underpref label {
    line-height: 12px;
}

    .assign_top_section .breakdown label svg, .assign_top_section .underpref label svg {
        width: 18px;
        height: 18px;
    }
/*assignment page*/
/*brown theme*/
html, body.brown-theme {
    font-family: "Plus Jakarta Sans", sans-serif !important;
}

.brown-theme div#menubar {
    background: #fff !important;
    border: 1px solid #e6dfd5;
    /*    padding-inline: 6px;*/
}

.brown-theme .nano.has-scrollbar .gui-controls li:first-child {
    background: transparent !important;
}

.brown-theme .nano.has-scrollbar .gui-controls li.has-dropdown.profileicon {
    background: #faf7f2 !important;
    left: 0;
    border-top: 1px solid #e6dfd5;
}

.brown-theme .filter_card.card {
    background: #fff !important;
    border-bottom: 1px solid #e6dfd5;
    border-radius: unset !IMPORTANT;
    min-height:65px;
}

.brown-theme span.text-white {
    color: #312B1B !important;
    font-weight: 600;
}

.brown-theme .filter-bar label {
    color: #7A431D !important;
    font-weight: 600;
}

.brown-theme .filter-item span.selection span, .brown-theme .filter-item span {
    color: #372C2E !important;
    font-size: clamp(10px, 1vw, 12px) !important;
}

.brown-theme .filter-item .box input[type="text"] {
    color: #372C2E !important;
    font-weight: 600;
    font-size: 13px;
}


.brown-theme .nano .gui-controls li a span {
    font-size: 13px;
}

.brown-theme table thead {
    background: rgba(255, 247, 241, 1) !important;
}

.brown-theme .dataTables_wrapper .dataTables__bottom {
    background: #fff7f0 !important;
}

.brown-theme .dataTables__bottom .dataTables_paginate span {
    color: #B57423 !important;
}

.brown-theme .dataTables_wrapper .dataTables_paginate .paginate_button.disabled, .brown-theme .dataTables_wrapper .dataTables_paginate .paginate_button.disabled:hover, .dataTables_wrapper .dataTables_paginate .paginate_button.disabled:active {
    color: #4F5356;
}

.brown-theme .dataTables__bottom .dataTables_paginate input, .brown-theme .dataTables__bottom .dataTables_paginate select {
    border: 1px solid #B57423 !important;
    color: #B57423 !important;
}

.brown-theme .dataTables_wrapper .dataTables__bottom .dataTables_info {
    color: #606060 !important;
    font-weight: 600;
}

.brown-theme .performance-tab .nav-item .title {
    color: #7B7B7B !important;
    font-family: "Plus Jakarta Sans", sans-serif;
    font-weight: 600;
}



.brown-theme .performance-tab .nav-item .value {
    font-weight: 700 !important;
    font-family: "Plus Jakarta Sans", sans-serif !important;
    font-size: 18px;
}

.brown-theme .performance-tab .nav-tabs > li.active > a, .brown-theme .performance-tab .nav-tabs > li.active > a:hover, .brown-theme .nav-tabs > li.active > a:focus {
    border-bottom: 0px solid rgb(181 116 35) !important;
}

.brown-theme .performance-tab .nav-item.active {
    border-top: 3px solid #b57423 !important;
}

    .brown-theme .performance-tab .nav-item.active .title {
        color: #b47323 !important;
    }

    .brown-theme .performance-tab .nav-item.active .value {
        color: #b37223 !important;
    }

.brown-theme .vertical-tabs {
    background: #E7E5E4;
}

    .brown-theme .vertical-tabs .tab.inactive {
        border-color: #b57423 !important;
    }

.brown-theme .box {
    padding: 0px 8px !important;
}



.brown-theme .vertical-tabs .tab {
    box-shadow: unset;
}

.brown-theme .perform_nav.nav-tabs > li.active > a {
    color: #fff !important;
    border-color: #b37323;
    background: #b37323;
}

.brown-theme .perform_nav.nav-tabs > li a {
    background: #e7e5e4;
    color: #585858 !important;
    font-weight: 500;
    border-color: #e7e5e4;
}


.brown-theme .dataTables_wrapper .table.dataTable > tbody > tr > td {
    color: #222 !important;
    font-weight: 400 !important;
}
/*browm theme*/
/*map section*/
#map-tab-content ul.nav-tabs li {
    padding-bottom: 0px;
}



    #map-tab-content ul.nav-tabs li a.active {
        color: #B57423 !important;
        border-bottom: 1px solid #B57423 !important;
        opacity: 1;
        font-weight: 600;
    }

/*#map-tab-content .automatonShowFilter {*/
/*    border: 1px solid #e8e8e8 !important;
    background: #fff !important;
    color: #E85D00 !important;
    box-shadow: 0px 1px 4px 0px #0000000D;
    position: relative;
    left: 8px;
}
*/

/* Prevent long Map Polygon values from overflowing */
.pmappolygon_craftmyapp_viewcontainer span,
.mappolygon_craftmyapp_viewcontainer span,
.mappolygen_craftmyapp_viewcontainer span,
.dmappolygon_craftmyapp_viewcontainer span {
    display: block;
    width: 100%;
    max-width: 100%;
    white-space: normal;
    overflow-wrap: anywhere;
    word-break: break-word;
}


.vehicle-container {
    font-family: 'Plus Jakarta Sans' !important;
}

    .vehicle-container .icon img {
        border: 0px !important;
    }

.vehicle-info span.vehicle-number {
    font-family: 'Plus Jakarta Sans';
    font-weight: 600;
    color: #1F1F1F;
    margin-bottom: 0px;
    padding-bottom: 0px;
    line-height: 0;
}

.vehicle-details span.status {
    color: #878A99;
    margin-top: 1px;
}

.last-update {
    color: #878A99;
    font-size: 12px;
    margin-top: 0px;
    padding-top: 0px;
    line-height: 0;
}

.speed-info {
    color: #878A99;
    font-size: 11px;
    margin-top: 0px;
    padding-top: 0px;
}



span.error_message {
    width: 100% !important;
    display: flex;
    justify-content: center;
    margin-bottom: 10px;
    padding: 4px;
    color: #B52B23;
    font-weight: 500;
    font-size: 10px;
}

    span.error_message img {
        margin-right: 4px;
    }

li.detail-item span {
    font-family: 'Plus Jakarta Sans';
    font-weight: 400;
    color: #1F1F1F;
}

li.detail-item span {
    font-family: 'Plus Jakarta Sans';
    font-weight: 400;
    color: #1F1F1F;
}

li.detail-item {
}

ul.fuel-overall {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    margin: 0;
    padding: 0;
    font-family: 'Plus Jakarta Sans';
    border-top: 1px solid #f2f2f2;
    padding-top: 6px;
}

    ul.fuel-overall li {
        list-style-type: none;
        display: flex;
    }

        ul.fuel-overall li .fuel-lst {
            display: flex;
            flex-direction: column;
            margin-left: 5px;
            justify-content: flex-start;
        }

            ul.fuel-overall li .fuel-lst label {
                color: #7B7B7B;
                font-size: 12px;
                margin-bottom: 0;
                text-align: left;
            }

        ul.fuel-overall li svg {
            position: relative;
            top: 4px;
        }

        ul.fuel-overall li .fuel-lst span {
            color: #434343;
            text-align: left;
            font-size: 12px;
        }

.tyre-detail ul {
    display: flex;
    justify-content: space-between;
    margin-bottom: 0px;
    margin-left: 0px !important;
    padding-left: 0px;
}

    .tyre-detail ul li {
        list-style: none;
    }

.tyre-detail {
    background: #F3F3F3;
    border: 1px solid #EEF1F3;
    padding: 6px 10px;
    border-radius: 6px;
    margin-top: 10px;
}

.tyre-tlt {
    text-align: left;
    color: #7B7B7B;
    font-size: 12px;
    font-weight: 500;
    font-family: 'Plus Jakarta Sans';
    margin-bottom: 1px;
}

    .tyre-tlt svg {
        margin-right: 5px;
        position: relative;
        top: 2px;
    }

.tyre-detail ul li label {
    font-size: 12px;
    font-weight: 600;
    color: #999B9D;
    margin-right: 3px;
}

.tyre-detail ul li span {
    color: #434343;
    font-size: 12px;
    font-weight: 600;
}

.map_side_card.active {
    background: #EDE8DC !important;
}
/*map section*/
.perform_nav.nav-tabs > li.active > a {
    color: #fff !important;
    border-color: #8ec6ff !important;
    background: #fff !important;
    border-bottom: 40px solid #007bff !important;
    border-left: 12px solid transparent !important;
    border-right: 12px solid transparent !important;
    display: block;
    line-height: 39px !important;
    align-items: center !important;
    height: 37px;
    border-top-left-radius: 25px !important;
    border-top-right-radius: 25px !important;
    justify-content: center !important;
    font-size: 14px;
}

.perform_nav.nav-tabs > li > a {
    color: #222 !important;
    border-color: #8ec6ff !important;
    background: #fff !important;
    border-bottom: 40px solid #e7e5e4 !important;
    border-left: 12px solid transparent !important;
    border-right: 12px solid transparent !important;
    display: block;
    line-height: 39px !important;
    align-items: center !important;
    height: 37px;
    border-top-left-radius: 25px !important;
    border-top-right-radius: 25px !important;
    justify-content: center !important;
    font-size: 14px;
}

.perform_nav.nav-tabs > li.active > a img {
    position: relative;
    top: 9px;
}

.perform_nav.nav-tabs > li a img {
    position: relative;
    top: 9px;
}

.brown-theme .perform_nav.nav-tabs > li.active > a {
    color: #fff !important;
    border-color: #B57423 !important;
    background: #fff;
    border-bottom: 40px solid #B57423 !important;
    border-left: 18px solid transparent !important;
    border-right: 18px solid transparent !important;
    display: block;
    line-height: 39px !important;
    align-items: center;
    height: 37px;
    border-top-left-radius: 25px !important;
    border-top-right-radius: 25px;
    justify-content: center;
    font-size: clamp(10px,1vw,11px);
    /*    box-shadow: 0px 20px 10px -15px #a09f9f;*/
    font-weight: 700;
}

.brown-theme .perform_nav.nav-tabs > li a {
    color: #585858 !important;
    border-color: #e7e5e4 !important;
    background: #fff;
    border-bottom: 40px solid #f7f0e5 !important;
    border-left: 18px solid transparent !important;
    border-right: 18px solid transparent !important;
    display: block;
    line-height: 39px !important;
    align-items: center;
    height: 37px;
    border-top-left-radius: 25px !important;
    border-top-right-radius: 25px;
    justify-content: center;
    font-size: clamp(10px, 1vw, 11px);
    /*    box-shadow: 0px 20px 10px -15px #a09f9f;*/
    font-weight: 700;
}

    .brown-theme .perform_nav.nav-tabs > li a img {
        position: relative;
        top: 9px;
    }

.brown-theme .perform_nav.nav-tabs > li.active > a img {
    position: relative;
    top: 9px;
}

.perform_nav li {
    padding: 7px 0px !important;
}

.brown-theme .vertical-tabs {
    background: #E7E5E4;
    box-shadow: 0px 2px 3px 0px #0000001A inset;
    padding: 4px 8px;
}

.blue-theme .vertical-tabs {
    background: #0a164c;
    box-shadow: 0px 2px 3px 0px #0000001A inset;
    padding: 4px 8px;
}

    .blue-theme .vertical-tabs .tab.active svg path {
        stroke: #007bff !important;
    }

    .blue-theme .vertical-tabs .tab svg path {
        stroke: #ffffff !important;
    }

.blue-theme #map-tab-content ul.nav-tabs li a.active {
    color: #C37336 !important;
    border-bottom: 1px solid #C37336 !important;
    opacity: 1;
    font-weight: 600;
}

.blue-theme #map-tab-content .automatonShowFilter {
    color: #007bff !important;
}

.vertical-tabs .tab {
    margin-right: 0px !important;
}

.brown-theme .vertical-tabs .tab.inactive.active {
    border-color: #b57423 !important;
    background: #fff;
}

    .brown-theme .vertical-tabs .tab.inactive.active svg path {
        stroke: #b57423 !important;
    }

.brown-theme .vertical-tabs .tab.inactive svg path {
    stroke: #9c9da0;
}

.brown-theme .nav.nav-tabs.nav-overall > li.active > a, .brown-theme .nav.nav-tabs.nav-overall > li.active > a:hover, .brown-theme .nav.nav-tabs.nav-overall > li.active > a:focus {
    color: #fff !important;
    border-color: #B57423 !important;
    background: #fff;
    border-bottom: 40px solid #B57423 !important;
    border-left: 18px solid transparent !important;
    border-right: 18px solid transparent !important;
    display: block;
    line-height: 39px !important;
    align-items: center;
    height: 37px;
    border-top-left-radius: 25px !important;
    border-top-right-radius: 25px;
    justify-content: center;
    font-size: 14px;
    background-color: transparent !important;
    margin-left: 0px;
}

.brown-theme .gui-controls > li > a.active i, {
    color: #fff !important;
}

.brown-theme .gui-controls > li > a.active > .title {
    color: #fff !important;
}

/*.brown-theme .gui-controls > li:hover > a i, .brown-theme .gui-controls > li:hover > a > .title {
    color: #C98A51 !important;
}*/

.brown-theme .gui-controls > li:hover > a.active i, .brown-theme .gui-controls > li:hover > a.active > .title {
    color: #fff !important;
}

.tools .dropdown-menu li a img {
    margin-right: 10px;
    margin-top: -5px;
}

a.logo-item {
    margin-top: 10px;
    justify-content:center;
}

.blue-theme .assign_top_section .tlt-num span {
    color: #007bff;
}

.blue-theme .assign-lst ul li.active {
    background: #1059e90d;
    border-left: 3px solid #007bff;
}

.vertical-tabs.theme-tab .tab {
    margin-left: 5px !important;
}

.brown-theme #isAutoAllocation.cma_primary_button:hover {
    background: #ffffff !important;
    color: #000 !important;
    border: 0px solid #ECECEC !important;
    padding: 0px 9px;
    border-radius: 8px;
    font-size: 14px;
    color: #333 !important;
    gap: 4px;
    background-color: #fff;
}

.brown-theme #isAutoAllocation.cma_primary_button {
    background: #ffffff !important;
    color: #000 !important;
    border: 0px solid #ECECEC !important;
    padding: 0px 9px;
    border-radius: 8px;
    font-size: 15px !important;
    color: #333 !important;
    gap: 4px;
    background-color: #fff;
}

.isAutoAllocation_craftmyapp_container {
    background: #ffffff !important;
    color: #000 !important;
    border: 1px solid #ECECEC !important;
    padding: 9px 9px;
    border-radius: 8px;
    font-size: 14px;
    color: #333 !important;
    gap: 4px;
    background-color: #fff;
    align-items: center;
}

.brown-theme .filter-button button {
    background: #b57423;
}

.brown-theme button.btn.btn-secondary.cma_cancel_button.waves-effect {
    background: #fff !important;
    border: 1px solid #b57423 !important;
    color: #b57423 !important;
    margin-left: 6px;
    height: 38px;
}
section.main-content form {
    padding: 10px;
}
body:has(#cma_printableArea) button.btn.btn-secondary.cma_cancel_button.waves-effect {
    margin-left: 13px;
}
.main-content form .col-sm-12.col-xs-12.p-2 {
    padding-left: 12px !important;
    padding-right: 12px !important;
}

    .brown-theme .mainSideMenu .menu-dropdown {
        background: #fff !important;
    }

    .brown-theme .mainSideMenu .menu-dropdown ul li a::before {
        color: #b57423 !important;
        content:"" !important;
    }

/*.brown-theme .automatonShowFilter {
    background: #c98a51 !important;
}*/

.brown-theme .dataTables_buttons .cma_top_icon i {
    color: #000000 !important;
    border: 1px solid #B57423 !important;
    border: 0.75px solid rgba(181, 116, 35, 0.8);
    background: rgba(181, 116, 35, 0.04);
}

.brown-theme .dataTables_wrapper .dataTables_buttons .cma_top_icon:nth-child(2) i {
    color: #62748e !important;
}

.brown-theme .dataTables_buttons .cma_top_icon i {
    border: 1px solid #B57423 !important;
    color: #62748e !important
}

.brown-theme .dataTables_wrapper table thead tr th.dt-center {
    background: rgba(255, 247, 241, 1) !important;
}

.brown-theme .dataTables_buttons .cma_add_button {
    /*    border: 0.75px solid rgba(181, 116, 35, 0.8);
    border: 0.75px solid rgba(181, 116, 35, 0.8);
    color: rgba(181, 116, 35, 1) !important;
    box-shadow: none;*/
    background: rgba(181, 116, 35, 1) !important;
}
/*.brown-theme .cma_add_button .material-icons {
    color: rgba(34, 34, 34, 1);
}*/
.brown-theme .page-header-box .btn-icon-toggle .fa, .brown-theme .btn-icon-toggle .md, .brown-theme .btn-icon-toggle .glyphicon {
    color: #b57423;
}

.brown-theme .arrow_button {
    background: #b57423 !important;
}

.brown-theme .filter-bar .filter-item span img {
    filter: invert(20%) sepia(98%) saturate(2653%) hue-rotate(191deg) brightness(98%) contrast(9%);
}

.brown-theme .filter-item span img {
    filter: invert(20%) sepia(98%) saturate(2653%) hue-rotate(191deg) brightness(98%) contrast(9%);
}


/*popup*/
.equip-rgt {
    display: flex;
}

.equipment-container {
    display: flex;
    flex-direction: column;
    margin: 20px;
    width: 97%;
    border: 1px solid #DDE1EF;
    background: #fff;
    padding: 20px;
    box-shadow: 0px 10px 20px 5px #0000000A;
    border-radius: 5px;
}

.equip-head {
    display: flex;
    justify-content: space-between;
    border-bottom: 1px solid #F4F4F4;
    padding-bottom: 10px;
}

.equip-lft {
    color: #222222;
    font-weight: 700;
    font-size: 18px;
}

.equip-rgt a {
    display: flex;
}

.equip-rgt .upload-popup-btn {
    background: #B57423;
    padding: 5px 8px;
    border-radius: 5px;
    color: #fff;
    display: flex;
    cursor: pointer;
    text-decoration: none;
}

    .equip-rgt .upload-popup-btn svg {
        margin-right: 4px;
        margin-top: 1px;
    }

a.bulk-upload.upload-popup-btn.automatonShowFilter {
    margin-right: 0;
    /*width: 120px !important;*/
    text-align: center;
    font-weight: 700 !important;
    color: #FFFFFF !important;
    font-size: 14px;
    height: 37px;
    line-height: 18px;
    background-image: none !important;
}

a.filter-popup-btn {
    background: #fff;
    padding: 5px 8px;
    border-radius: 5px;
    color: #B57423;
    border: 1px solid #B57423CC;
    margin-left: 9px;
    display: flex;
    cursor: pointer;
    text-decoration: none;
}

    a.filter-popup-btn svg {
        margin-right: 5px;
        margin-top: 1px;
    }

.equip-bottom {
    display: flex;
    justify-content: center;
    padding: 30px 0px;
}

.result-icon {
    width: 290px;
    margin: 0 auto;
    text-align: center;
    display: flex;
    flex-direction: column;
}

    .result-icon h3 {
        color: #272E38;
        text-align: center;
        font-weight: 700;
        width: 100%;
        float: left;
        margin-bottom: 14px;
    }

    .result-icon span {
        color: #717171;
        font-weight: 400;
        float: left;
        width: 100%;
        text-align: center;
        margin-bottom: 10px;
    }

.filter-popup {
    width: 500px !important;
    box-shadow: 0px 3px 8px 1px #00000026 !important;
    border: 1px solid #DCDCDC;
    background: #fff !important;
    border-radius: 5px;
    float: right !important;
    right: 46px !important;
    left: unset;
    top: 86px;
}

.title-f {
    color: #222222 !important;
    font-weight: 700;
    font-size: 18px;
    padding-bottom: 10px;
    padding-top: 10px;
}



.filter-popup .form-group label {
    color: #7B7B7B !important;
    font-weight: 500 !important;
    font-family: Plus Jakarta Sans !important;
    font-size: 14px !important;
    padding-bottom: 7px !important;
}

.filter-popup .form-group select {
    border: 1px solid #e7e7e7;
    color: #333333;
    font-size: 14px;
    font-weight: 500 !important;
    height: 40px;
}

.filter-popup .form-group {
    margin-bottom: 12px !important;
}

.can-sub {
    float: right;
    text-align: right;
}

button.cancel-btn {
    border: 1px solid #DBDBDB;
    width: 102px;
    height: 41px;
    color: #222222;
    background: #fff !important;
    border-radius: 5px !important;
    text-transform: capitalize;
    font-weight: 700 !important;
    margin-right: 10px;
}

button.submit-btn {
    border: 1px solid #DBDBDB;
    width: 102px;
    height: 41px;
    color: #ffffff;
    background: #B57423 !important;
    border-radius: 5px !important;
    text-transform: capitalize;
    font-weight: 700 !important;
}

/*drag and drop*/
.drag-drop {
    border: 2px dashed #C8C8C8;
    display: flex;
    justify-content: center;
    align-items: center;
    text-align: center;
    transition: background-color 0.3s;
    cursor: pointer;
    width: 330px;
    margin: 0 auto;
    flex-direction: column;
    padding: 20px;
    border-radius: 5px;
    margin-bottom: 20px;
    margin-top: 20px;
}

.automatonShowFilter.filter-popup-btn {
    margin-right: 0px !important;
    width: 75px !important;
    text-align: center;
    font-weight: 700 !important;
    color: #B57423 !important;
    font-size: 14px;
    height: 37px;
    line-height: 18px;
    background: #fff !important;
}

.drag-drop .upload-area.dragover {
    background-color: #e6f7ff;
}

.drag-drop input[type="file"] {
    display: none;
}

.drag-drop .file-list {
    margin-top: 20px;
}

.drag-drop .error {
    color: red;
    margin-top: 10px;
}

.drag-drop span, .drag-drop button {
    display: inline-block;
    margin: 10px 0;
}

.drag-drop button {
    padding: 10px 20px;
    cursor: pointer;
}

.upload-area p {
    padding-bottom: 0px !important;
    margin-bottom: 0px !important;
    color: #222222 !important;
    font-weight: 500 !important;
    font-size: 14px;
}

.drag-drop span, .drag-drop button {
    margin: 0;
    color: #222222;
    font-size: 14px;
}

    .drag-drop button, .drag-drop button:hover {
        background: #B57423 !important;
        width: 85px;
        height: 36px;
        border-radius: 5px !important;
        color: #fff;
        border: 0;
        font-size: 14px;
        font-weight: 600 !important;
        line-height: 19px;
        margin-bottom: 10px;
    }

span.support-file {
    color: #7B7B7B !important;
    font-weight: 500;
    font-size: 12px;
}

.title-f {
    border-bottom: 1px solid #eef1f2;
    margin-bottom: 13px;
}

.upload-icon {
    margin-bottom: 10px;
}

.upload-popup {
    width: 500px !important;
    box-shadow: 0px 3px 8px 1px #00000026 !important;
    border: 1px solid #DCDCDC;
    background: #fff !important;
    border-radius: 5px;
    float: right !important;
    right: 46px !important;
    left: unset;
    top: 86px;
    max-width: 100% !important;
}

.blue-theme .automatonShowFilter.filter-popup-btn {
    border-color: #0093e6;
}

    .blue-theme .automatonShowFilter.filter-popup-btn span {
        color: #0093e6 !important;
    }

@media only screen and (min-width:320px) and (max-width:400px) {
    .equip-head {
        flex-direction: column !important;
    }
}

@media only screen and (min-width:320px) and (max-width:768px) {
    .row.div_filter.upload-popup {
        width: 93% !important;
        right: unset !important;
        left: 25px !important;
        top: 120px !important
    }

    .row.div_filter.filter-popup {
        width: 93% !important;
        right: unset !important;
        left: 25px !important;
        top: 120px !important
    }

    .row.div_filter.upload-popup .col-sm-12 {
        width: 100% !important;
    }

    .row.div_filter.filter-popup .col-sm-12, .row.div_filter.filter-popup .col-sm-6 {
        width: 100% !important;
    }
}

.target-container {
    margin-bottom: 2px;
}

.performance-tab .nav-item {
    border-top: 2px solid #f9f9f9 !important;
}

.brown-theme .performance-tab .nav-tabs > li .performance-card span svg path {
    fill: #968c84;
}

.brown-theme .performance-tab .nav-tabs > li.active .performance-card span svg path {
    fill: #b37223;
}

.blue-theme .performance-tab .nav-tabs > li .performance-card span svg path {
    fill: #968c84;
}

.blue-theme .performance-tab .nav-tabs > li.active .performance-card span svg path {
    fill: #007bff;
}

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

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

.dataTables_wrapper .dataTables__bottom .dataTables_info {
    font-size: 14px !important;
}
/*nav-tab-normal*/
.nav-tabs.nav-tab-normal > li.active > a, .nav-tabs.nav-tab-normal > li.active > a:hover, .nav-tabs.nav-tab-normal > li.active > a:focus {
    background: transparent !important;
    border: 0px !important;
    line-height: 0px !important;
}

ul.nav-tabs.nav-tab-normal li a.active {
    color: #B57423 !important;
    border-bottom: 1px solid #B57423 !important;
    opacity: 1;
    font-weight: 600;
}

ul.nav-tabs.nav-tab-normal li {
    padding-bottom: 23px;
    padding-left: 0px;
    padding-right: 0px;
}

    ul.nav-tabs.nav-tab-normal li a {
        color: #212529 !important;
        font-size: 15px;
        font-weight: 400;
        padding: 0px 16px !important;
        line-height: 0px !important;
        display: block;
        border-bottom: 0px !important;
    }

        ul.nav-tabs.nav-tab-normal li a.active {
            color: #B57423 !important;
            border-bottom: 1px solid #B57423 !important;
            opacity: 1;
            font-weight: 600;
        }

ul.nav.nav-tabs.nav-tab-normal {
    display: block;
    width: 100% !important;
    float: left;
    margin-bottom: 19px !important;
    border-bottom: 1px solid #E7EAEF !important;
    margin: 0px 10px;
    border-radius: 0px !important;
}

ul.nav-tabs.nav-tab-normal li:hover a, ul.nav-tabs.nav-tab-normal li a:hover {
    border-color: unset !important;
    background: transparent !important;
    border: unset !important;
}

ul.nav-tabs.nav-tab-normal li.active a {
    color: #B57423 !important;
    opacity: 1;
    font-weight: 600;
}

ul.nav-tabs.nav-tab-normal li.active {
    border-bottom: 1px solid #B57423 !important;
}

.tab-content.nav-tab-content .tab-pane {
    padding: 10px !important;
}


.has-success .input-group-addon {
    border-color: #b57423 !important;
}

.brown-theme .nav-tabs.nav-deviation > li.active > a, .brown-theme .nav-tabs.nav-deviation > li.active > a:hover, .brown-theme .nav-tabs.nav-deviation > li.active > a:focus {
    border-bottom: 0px !important;
    background-color: #ffff !important;
}

.blue-theme .nav-tabs.nav-deviation > li.active > a, .blue-theme .nav-tabs.nav-deviation > li.active > a:hover, .blue-theme .nav-tabs.nav-deviation > li.active > a:focus {
    border-bottom: 0px !important;
}

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

    .sample-table table thead tr th {
        padding: 10px 20px;
        color: #222222;
        font-size: 15px;
        font-weight: 600;
    }

    .sample-table table tbody tr td {
        padding: 10px 20px;
        color: #222222;
        font-size: 14px;
    }

        .sample-table table tbody tr td span {
            width: 100%;
            display: block;
            text-align: center;
        }

        .sample-table table tbody tr td img {
            margin-right: 12px;
            width: 26px;
            height: 26px;
        }

    .sample-table table tbody tr:nth-child(2n) td {
        background: #FAF8F8;
    }

.sample-table {
    margin-bottom: 26px;
    margin-top: 20px;
}

td.normal {
    color: #2364B5 !important;
    font-weight: 600;
}

td.fat {
    color: #B57423 !important;
    font-weight: 600;
}

td.over-work {
    color: #B52B23 !important;
    font-weight: 600;
}

img.arrow {
    width: auto !important;
    height: auto !important;
}

.staff-pop {
    width: 260px;
    box-shadow: 0px 10px 20px 0px #0000000A;
    border: 1px solid #DDE1EF;
    padding: 20px;
    border-radius: 5px;
    background: #fff;
}

.blood-group {
    display: flex;
    justify-content: space-between;
}

    .blood-group span, .emergency-call span {
        width: auto !important;
        text-align: left !important;
        display: flex !important;
        align-items: center;
        font-size: 13px;
        font-weight: 700;
        color: #141414;
        padding-bottom: 7px;
    }

        .blood-group span svg, .emergency-call span svg {
            margin-right: 10px;
        }

    .blood-group label {
        font-size: 12px;
        color: #141414;
        font-weight: 500 !important;
    }

.contact-lst {
    margin-left: 27px;
}

.over-lst {
    color: #7a7777;
    font-weight: 500;
    font-size: 13px;
}

.contact-number {
    color: #141414;
    font-weight: 500;
    font-size: 13px;
}

.staff-pop {
    position: absolute;
    top: 0px;
    z-index: 9;
    right: -30px;
    opacity: 0;
}

.staff-pop-main:hover .staff-pop {
    opacity: 1;
}

td.staff-pop-main {
    position: relative;
}

.target-card.selected .dash_arrow {
    color: #b57423 !important;
}

.brown-theme .target-card.selected {
    border: 2px solid #b57423;
    background-color: #F4F5F9;
    box-shadow: 0px 4px 6px 0px #00000033;
}

    .brown-theme .target-card.selected .dash_arrow {
        color: #b57423;
    }

.brown-theme .card-section.material-targets {
    border: 0.72px solid;
    border-image: linear-gradient(224.38deg, rgb(190, 132, 61) 0%, rgba(240, 199, 185, 0) 46.3%);
    border-image-slice: 1;
    background: linear-gradient(224.38deg, rgb(255, 232, 203) 0%, rgba(0, 147, 230, 0) 24.3%);
}


/*div#menubar {
    box-shadow: 0px 1px 5px 1px #00000033;
}
*/
.blue-theme div#menubar {
    background: #1e1e1e !important;
}

.blue-theme .nano.has-scrollbar .gui-controls li.has-dropdown.profileicon {
    background: #1e1e1e !important;
}

.blue-theme .filter_card.card {
    background: #1e1e1e;
}

.blue-theme .filter-bar .filter-item span img {
    filter: invert(20%) sepia(98%) saturate(2653%) hue-rotate(191deg) brightness(98%) contrast(9%);
}

.blue-theme .nano.has-scrollbar .gui-controls li:first-child {
    background: #1e1e1e !important;
}

div#menubar {
/*    box-shadow: 0px 1px 5px 1px #00000033;*/
}

.blue-theme div#menubar {
    background: #1e1e1e !important;
}

.blue-theme .nano.has-scrollbar .gui-controls li.has-dropdown.profileicon {
    background: #1e1e1e !important;
}

.blue-theme .filter_card.card {
    background: #1e1e1e;
}

.blue-theme .filter-bar .filter-item span img {
    filter: invert(20%) sepia(98%) saturate(2653%) hue-rotate(191deg) brightness(98%) contrast(9%);
}

.blue-theme .nano.has-scrollbar .gui-controls li:first-child {
    background: #1e1e1e !important;
}



.blue-theme #map-tab-content .card-body {
    background: #343434;
}

.blue-theme #map-tab-content ul.nav-tabs li a {
    color: #fff;
}

.blue-theme div#map-tab-content {
    background: #000;
}

.blue-theme .card-head {
    background: #000 !important;
    padding-left: 10px;
    padding-right: 10px;
}

.blue-theme .perform_nav.nav-tabs > li.active > a, .blue-theme .perform_nav.nav-tabs > li a {
    color: #fff !important;
    border-color: #B57423 !important;
    background: #fff;
    border-bottom: 40px solid #B57423 !important;
    border-left: 14px solid transparent !important;
    border-right: 14px solid transparent !important;
    display: block;
    line-height: 39px !important;
    align-items: center;
    height: 37px;
    border-top-left-radius: 25px !important;
    border-top-right-radius: 25px;
    justify-content: center;
    font-size: 14px;
    background-color: transparent !important;
    margin-left: 0px;
}

.blue-theme .perform_nav.nav-tabs > li a {
    color: #585858 !important;
    border-color: #ECECEC !important;
    background: #fff;
    border-bottom: 40px solid #ECECEC !important;
    border-left: 14px solid transparent !important;
    border-right: 14px solid transparent !important;
    display: block;
    line-height: 39px !important;
    align-items: center;
    height: 37px;
    border-top-left-radius: 25px !important;
    border-top-right-radius: 25px;
    justify-content: center;
    font-size: 14px;
    background-color: transparent !important;
}


.blue-theme .filter_section {
    background: #343434;
    border-color: #000;
}

.blue-theme .card.map_side_card {
    background: #343434 !important;
}

.blue-theme .last-update {
    color: #ABABAB;
}

.blue-theme .vehicle-info span.vehicle-number {
    color: #fff;
}

.blue-theme li.detail-item span {
    color: #ababab;
}

.blue-theme ul.fuel-overall li .fuel-lst label {
    color: #fff;
}

ul.fuel-overall li .fuel-lst span {
    color: #ababab;
}

.blue-theme .vehicle-container .icon img {
    filter: invert(20%) sepia(98%) saturate(2653%) hue-rotate(191deg) brightness(98%) contrast(9%);
}

.blue-theme .search-container input {
    background: #000 !important;
    border-color: #646060 !important;
}

.blue-theme .search-container img {
    filter: invert(97%) sepia(100%) saturate(2653%) hue-rotate(195deg) brightness(101%) contrast(45%);
}

body.blue-theme #map-tab-content .automatonShowFilter {
    color: #c37336 !important;
    background: #000000 !important;
    border-color: #646060 !important;
}

.blue-theme footer {
    background: #1e1e1e !important;
}

    .blue-theme footer .card {
        background: #1e1e1e !important;
    }

        .blue-theme footer .card .card-body h4 {
            color: #9b9b9b;
        }

.blue-theme .tyre-detail {
    background: #000000;
    border-color: #646060;
}

    .blue-theme .tyre-detail ul li span {
        color: #fff;
    }



.blue-theme .gui-controls > li > a.active > .title {
    color: #fff !important;
}

.blue-theme .gui-controls > li > a.active i {
    /* color: #c37336 !important;*/
    color: #fff !important;
}

.blue-theme .nano .gui-controls li > a.active:hover, .blue-theme .nano .gui-controls li > a.active:hover .title {
    /*color: #c37336 !important;*/
    color: #fff !important;
}

    .blue-theme .nano .gui-controls li > a.active:hover i, .blue-theme .nano .gui-controls li > a.active:hover i {
        /* color: #c37336 !important;*/
        color: #fff !important;
    }

.blue-theme .gui-controls li > a:hover .title, .blue-theme .gui-controls li > a:hover i {
    /*color: #c37336 !important;*/
    color: #fff !important;
}

.blue-theme .filter-button button {
    background: #393939;
}

body.blue-theme .vertical-tabs {
    background: #393939;
}

    body.blue-theme .vertical-tabs .tab.active {
        color: #c37336 !important;
        border: 1px solid #c37336 !important;
    }

        body.blue-theme .vertical-tabs .tab.active svg path {
            stroke: #c37336 !important;
        }


.blue-theme .tcontent .card .card-body {
    background: #000000;
}

.blue-theme .assignment-container .request-card-list {
    background: #343434;
    border-color: #646060 !important;
}

    .blue-theme .assignment-container .request-card-list .dropdown-menu {
        background: #000;
        border-color: #646060;
    }

        .blue-theme .assignment-container .request-card-list .dropdown-menu li a {
            color: #181818;
        }

        .blue-theme .assignment-container .request-card-list .dropdown-menu li a {
            filter: invert(97%) sepia(100%) saturate(2653%) hue-rotate(195deg) brightness(101%) contrast(45%);
        }

.blue-theme .assign-middle-section {
    background: #000;
}

    .blue-theme .assign-middle-section div {
        color: #fff;
    }

.blue-theme .assign_top_section .large-scale span {
    color: #fff;
}

.blue-theme .assign-lst ul li .btm-lst label {
    color: #acacac;
}

.blue-theme .assign-lst ul li:nth-child(2n) {
    background: #000;
}

body.blue-theme .assign_top_section .tlt-num span {
    color: #c37336 !important;
}

.blue-theme .assign-lst ul {
    border-color: #646060;
}

.blue-theme .assign-bottom-section h5 {
    color: #fff;
}

body.blue-theme .assign-lst ul li.active {
    border-color: #c37336 !important;
}

body.blue-theme .daily_shift .col-sm-12.col-xs-12.p-0 {
    background: #000 !important;
}

body.blue-theme .daily_shift .col-sm-12 .card-body {
    background: #000 !important;
}

.blue-theme div#content {
    background: #000;
}

.blue-theme .mainSideMenu .menu-dropdown {
    background: #343434 !important;
}

    .blue-theme .mainSideMenu .menu-dropdown ul li a::before {
        color: #c37323;
    }

.blue-theme .mainSideMenu .menu-dropdown {
    background: #343434 !important;
}

    .blue-theme .mainSideMenu .menu-dropdown ul li a::before {
        color: #c37323;
    }

.blue-theme table thead {
    background: #343434 !important;
}

    .blue-theme table thead tr th {
        color: #969696 !important;
    }

.blue-theme .dataTables_wrapper .table.dataTable > tbody > tr > td {
    color: #fff !important;
}

.blue-theme .dataTables_wrapper .table.dataTable tbody tr td {
    background: #1e1e1e;
}

.blue-theme .sample-table table tbody tr td {
    color: #fff;
}

.blue-theme .sample-table table tbody tr:nth-child(2n) td {
    background: #212020;
}

.blue-theme ul.nav-tabs.nav-tab-normal li a {
    color: #ffffff !important;
}

.blue-theme ul.nav-tabs.nav-tab-normal li.active a {
    color: #B57424 !important;
}

.blue-theme h3.section-title {
    color: #fff !important;
}

.blue-theme .dataTables_wrapper table thead tr th {
    background: #343434 !important;
}

body.blue-theme table thead {
    background: #343434 !important;
}

.blue-theme ul.nav.nav-tabs.nav-tab-normal {
    border-color: #343434 !important;
}

.blue-theme .dataTables_wrapper .dataTables__bottom {
    background: #343434 !important;
}

.blue-theme .dataTables__bottom .dataTables_paginate input[type="number"] {
    color: #fff !important;
}

.blue-theme .dataTables__bottom .dataTables_paginate input, .blue-theme .dataTables__bottom .dataTables_paginate select {
    background: #000 !important;
    color: #fff;
    border: 1px solid #b36b34 !important;
}

.blue-theme .maker_checker_card {
    background: #1e1e1e !important;
    border-color: #3e3d3d !important;
}



.blue-theme .dataTables_wrapper .input-group.prefix .form-control {
    background: #000;
}

.blue-theme p.tlt-txt {
    color: #fff;
}

.blue-theme i.automatonShowFilter.actions__item.mdi.material-icons {
    background: #c37336 !important;
}

.blue-theme .dataTables_buttons .cma_add_button {
    background: #c37336 !important;
}

.blue-theme .equipment-container {
    background: #343434;
    border-color: #606060;
}

.blue-theme .equip-lft {
    color: #fff;
}

.blue-theme .automatonShowFilter {
    background: #c37336 !important;
}

    .blue-theme .automatonShowFilter.filter-popup-btn {
        border-color: #2a2827 !important;
        background: #565151 !important;
        color: #fff !important;
    }

body.blue-theme .automatonShowFilter.filter-popup-btn span {
    color: #fff !important;
}

.blue-theme .result-icon h3 {
    color: #fff;
}

.blue-theme .result-icon span {
    color: #ccc;
}

.blue-theme .equip-head {
    border-color: #7e7070;
}

.blue-theme a.filter-popup-btn svg path {
    stroke: #fff;
}

.blue-theme .equipment-container {
    background: #343434;
    border-color: #606060;
}

.blue-theme .equip-lft {
    color: #fff;
}

.blue-theme .automatonShowFilter {
    background: #c37336 !important;
}

    .blue-theme .automatonShowFilter.filter-popup-btn {
        border-color: #2a2827 !important;
        background: #565151 !important;
        color: #fff !important;
    }

body.blue-theme .automatonShowFilter.filter-popup-btn span {
    color: #fff !important;
}

.blue-theme .result-icon h3 {
    color: #fff;
}

.blue-theme .result-icon span {
    color: #ccc;
}

.blue-theme .equip-head {
    border-color: #7e7070;
}

.blue-theme a.filter-popup-btn svg path {
    stroke: #fff;
}

.blue-theme .performance-tab .nav-item.active {
    background: #1e1e1e !important;
    border-top: 3px solid #c37336 !important;
}

body.blue-theme .performance-tab .nav-tabs > li.active .performance-card span svg path {
    fill: #c37336;
}

body.blue-theme .performance-tab .nav-item.active .title {
    color: #c37336 !important;
}

.blue-theme .performance-tab .nav-item.active .value {
    color: #c37336 !important;
}

.blue-theme .performance-tab .nav-tabs .nav-link {
    background: #373737 !important;
}

.blue-theme .performance-tab .nav-item {
    background: #373737 !important;
}

.blue-theme .performance-tab .nav-tabs .nav-link.active {
    background: #1e1e1e !important;
}

.blue-theme .performance-tab .nav-item {
    border-top: 2px solid #4c4a4a !important;
}

    .blue-theme .performance-tab .nav-item .title {
        color: #ababab !important;
    }

    .blue-theme .performance-tab .nav-item .value {
        color: #ababab !important;
    }

body.blue-theme .performance-tab .nav-tabs > li .performance-card span svg path {
    fill: #ababab !important;
}

.blue-theme .performance-tab .nav-item {
    border-color: #000000 !important;
}

    .blue-theme .performance-tab .nav-item.active {
        border-color: #000000 !important;
    }

body.blue-theme .performance-tab .nav-item {
    border-top: 2px solid #000 !important;
}

.blue-theme .performance-tab .nav-tabs.tab_nav > li > a:hover {
    border-bottom: 1px solid #000;
}

body.blue-theme .performance-tab .nav-item.active {
    border-top: 3px solid #c37336 !important;
}

body.blue-theme .performance-tab .nav-tabs > li.active .performance-card span svg path {
    fill: #c37336 !important;
}

.blue-theme .dataTables_wrapper .input-group.prefix .form-control {
    border-color: #525252 !important;
}

.blue-theme .dataTables__bottom .dataTables_paginate span {
    color: #ababab;
}

.blue-theme .performance-tab .nav-tabs.tab_nav > li > a:hover {
    border-bottom: 1px solid #000;
}

body.blue-theme .performance-tab .nav-item.active {
    border-top: 3px solid #c37336 !important;
}

body.blue-theme .performance-tab .nav-tabs > li.active .performance-card span svg path {
    fill: #c37336 !important;
}

.blue-theme .dataTables_wrapper .input-group.prefix .form-control {
    border-color: #525252 !important;
}

.blue-theme .dataTables__bottom .dataTables_paginate span {
    color: #ababab;
}

.blue-theme .card-section {
    background: #373737 !important;
    display: block !important;
}

.blue-theme .card-section {
    z-index: 9;
}

.blue-theme .name {
    color: #fff !important;
}

.blue-theme .target-card.selected {
    border: 2px solid #c5783e;
}

.blue-theme .target-card.selected {
    background: #1b1919;
    box-shadow: unset !important;
}

.blue-theme .target-card:nth-child(even) {
    background: #2e2c2c;
}

.blue-theme .staff-pop {
    background: #373737;
    border-color: #646464;
}

.blue-theme .blood-group span, .blue-theme .emergency-call span {
    color: #fff;
}

.blue-theme .over-lst {
    color: #afafaf;
}

.blue-theme .contact-number {
    color: #ababab;
}

.blue-theme .blood-group label {
    color: #ababab;
}

.blue-theme .blood-group span svg path, .blue-theme .emergency-call span svg path {
    stroke: #fff;
}

.blue-theme .tab-pane-sector.tcontent p {
    color: #ababab !important;
}


.blue-theme .tab-pane-sector.tcontent p {
    color: #fff !important;
}

.blue-theme span.text-white {
    color: #fff !important;
    font-weight: 600;
}

.back-common {
    background: transparent;
}

    .back-common i {
        font-size: 20px;
        margin-left: -8px;
        margin-top: 4px;
        color: #b57423;
    }


.blue-theme .tab-pane-sector.tcontent p {
    color: #fff !important;
}

.blue-theme span.text-white {
    color: #fff !important;
    font-weight: 600;
}

.blue-theme .filter-popup {
    background: #2c2b2b !important;
    border: 1px solid #575757 !important;
}

.blue-theme .title-f {
    border-bottom: 1px solid #565151;
}

.blue-theme .title-f {
    color: #fff !important;
}

.blue-theme .filter-popup .form-group .form-control {
    background: #1f1b1b;
    color: #ababab;
    border-color: #e7e7e7 !important;
}

.blue-theme button.cancel-btn {
    background: #393939 !important;
    color: #fff;
    border: 1px solid #5b5757 !important;
}

.blue-theme button.submit-btn {
    border-color: #d4b38a;
}

.blue-theme .upload-popup {
    background: #2c2b2b !important;
    border: 1px solid #575757 !important;
}

.blue-theme .card {
    background: #1e1e1e !important;
    border-color: #3e3d3d !important;
}

.blue-theme .dataTables_wrapper .dataTables__bottom .dataTables_info {
    color: #fff !important;
}

.blue-theme table tr td > a {
    color: #fff !important;
}

.blue-theme table.dataTable tbody tr:nth-child(2n) td {
    background-color: #313030 !important;
}

.blue-theme table.dataTable tbody tr {
    border: 0;
}

.blue-theme .page-header-box {
    background: #000 !important;
}

.blue-theme .back-arrow i {
    color: #b57423 !important;
}

.blue-theme .page-header-box > h1 {
    color: #fff !important;
}

.blue-theme div#base {
    background: #000000 !important;
}

.blue-theme table.dataTable tbody tr {
    border: 0px;
}

    .blue-theme table.dataTable tbody tr:nth-child(2n) td {
        background-color: #313030 !important;
    }

    .blue-theme table.dataTable tbody tr:nth-child(2n-1) td {
        background-color: #000 !important;
    }

.blue-theme table tbody tr {
    background: #000 !important;
    border: none;
}

    .blue-theme table tbody tr td {
        color: #fff !important;
    }

.blue-theme .table-responsive-lg table tbody tr:nth-child(2n) {
    background: #313030 !important;
    border: 0px !important;
}

.blue-theme .card.card-blue .card-head header {
    color: #fff !important;
}

.blue-theme .list_card_section .form-group span {
    color: #fff !important;
}

.blue-theme .form-control[disabled], .blue-theme .form-control[readonly], .blue-theme fieldset[disabled] .form-control {
    border: 1px solid #545050;
    color: #fff !important;
}

.blue-theme .cma_primary_button {
    background: #c37336 !important;
    border-color: #c37336 !important;
}

.blue-theme .cma_cancel_button {
    background: #393939 !important;
}

.blue-theme .arrow_button {
    background: #c37336;
}

.common-cont .card-head header {
    color: #202020;
    font-size: 20px;
    font-family: Plus Jakarta Sans;
    Plus Jakarta font-family: sans-serif;
    font-weight: 700;
}

.common-cont .form-group label {
    color: #7B7B7B;
    font-family: 'Plus Jakarta Sans';
    font-weight: 500;
    font-size: 14px !important;
    line-height: 20px;
}

.common-cont .form-group .form-control, .common-cont .form-group input, .common-cont .form-group input::placeholder {
    color: #333333;
    font-weight: 500;
    font-size: 14px;
}

.common-cont .add-row-btn {
    color: #B57423;
    display: flex;
    align-items: center;
    align-self: center;
    justify-content: center;
    width: 83px;
    height: 37px;
    margin-left: 10px;
}

.brown-theme .common-cont .add-row-btn {
    background: #B574230A !important;
    border: 1px solid #B57423;
}

    .brown-theme .common-cont .add-row-btn span {
        color: #222222 !important;
    }

.common-cont .dataTables_buttons.actions {
    display: flex;
    flex-wrap: wrap;
    flex-direction: row;
}

.common-cont a.bulk-upload {
    display: flex;
    justify-content: center;
    align-items: center;
}

    .common-cont a.bulk-upload span {
        margin-left: 2px;
    }

span.supported-files {
    color: #7b7b7b;
    font-weight: 500;
    font-family: 'Plus Jakarta Sans';
    font-size: 12px;
}

.common-cont a.bulk-upload {
    display: flex;
    justify-content: center;
    align-items: center;
}

    .common-cont a.bulk-upload span {
        margin-left: 2px;
    }

span.supported-files {
    color: #7b7b7b;
    font-weight: 500;
    font-family: 'Plus Jakarta Sans';
    font-size: 12px;
}

.download span {
    margin-left: 7px !important;
}

.common-cont a.bulk-upload {
    display: flex;
    justify-content: center;
    align-items: center;
}

    .common-cont a.bulk-upload span {
        margin-left: 2px;
    }

span.supported-files {
    color: #7b7b7b;
    font-weight: 500;
    font-family: 'Plus Jakarta Sans';
    font-size: 12px;
}

.download span {
    margin-left: 7px !important;
}

a.error-file button > svg {
    position: relative;
    top: 5px;
}

.error-file button:hover span {
    color: #B52B23 !important;
}

a.error-file {
    /* background: #B52B231A;*/
    width: 113px;
    height: 37px;
    border-radius: 5px;
    display: flex;
    justify-content: center;
    align-items: center;
    align-self: center;
    color: #B52B23;
}

    a.error-file button {
        width: 139px;
        background: #f2f2f2 !important;
        /* background: #B52B231A !important; */
        border: 0px;
        color: #B52B23 !important;
        display: flex;
        margin-right: 15px;
    }

    a.error-file span {
        padding: 0px 1px 0px 5px;
    }

        a.error-file span.errorCount {
            max-width: 35px;
            white-space: nowrap;
            overflow: hidden;
            text-overflow: ellipsis;
            display: block;
            min-width: 18px;
        }

    a.error-file .span.errorCount:hover {
        max-width: 35px;
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
        display: block;
        min-width: 18px;
    }

    a.error-file .expand-arrow {
        position: relative;
        top: 2px;
        padding: 0px
    }

a.current-file {
    background: #F2F4F5;
    border-radius: 5px;
    height: 37px;
    padding: 0px 15px;
    display: flex;
    align-items: center;
    align-self: center;
    justify-content: center;
}

    a.current-file span {
        color: #176800;
        font-size: 13px;
        padding-left: 5px;
    }

        a.current-file span.close-b {
            position: relative;
            top: 4px;
            left: 4px;
        }

.button-people {
    display: flex;
    align-items: center;
    justify-content: center;
    align-self: center;
}

    .button-people .form-group {
        margin-bottom: 0px;
    }

        .button-people .form-group a {
            padding: 0px 3px;
        }

.common-btns {
    display: flex;
    justify-content: flex-end;
    background: #f9f9f9;
    padding: 40px;
}

a.cancel-comm-btn, a.cancel-comm-btn:hover {
    border: 1px solid #DBDBDB;
    background: #fff;
    width: 103px;
    height: 41px;
    border-radius: 5px;
    color: #222;
    font-family: 'Plus Jakarta Sans';
    font-weight: 700;
    display: flex;
    justify-content: center;
    align-items: center;
    font-size: 14px;
    margin-right: 10px;
}

a.submit-comm-btn, a.submit-comm-btn:hover {
    border: 1px solid #DBDBDB;
    background: #B57423;
    width: 103px;
    height: 41px;
    border-radius: 5px;
    color: #fff;
    font-family: 'Plus Jakarta Sans';
    font-weight: 700;
    display: flex;
    justify-content: center;
    align-items: center;
    font-size: 14px;
}

.blue-theme .common-btns {
    background: #1e1e1e;
}

.blue-theme .common-cont .form-group .form-control, .blue-theme .common-cont .form-group input, .blue-theme .common-cont .form-group input::placeholder {
    background: #000000;
}


.blue-theme .common-cont .card.card-blue .card-head {
    background: #1e1e1e !important;
}

.blue-theme .common-cont .card {
    margin: 12px !important;
}

.blue-theme .common-cont {
    background: #2c2c2c;
}

    .blue-theme .common-cont .form-group label {
        color: #a19c9c !important;
    }

    .blue-theme .common-cont .form-group .form-control, .blue-theme .common-cont .form-group input, .blue-theme .common-cont .form-group input::placeholder {
        color: #e0dede;
        border-color: #4a4a4a;
    }

.blue-theme .dataTables_buttons .cma_add_button {
    color: #fff;
}

.blue-theme a.submit-comm-btn, .blue-themea.submit-comm-btn:hover {
    border-color: #B57423;
}

.blue-theme a.cancel-comm-btn, .blue-theme a.cancel-comm-btn:hover {
    background: #393939;
    color: #fff;
    border-color: #504444;
}

@media only screen and (min-width:1023px) and (max-width:1179px) {
    .button-people .form-group a {
        padding: 0px !important;
    }

        .button-people .form-group a img {
            width: 20px !important;
        }
}


.expandead-arrow i {
    color: #fff;
    font-size: 15px;
    background: #c37336;
    width: 30px;
    border-radius: 3px;
    height: 30px;
    text-align: center;
    display: flex;
    align-items: center;
    justify-content: center;
}

div#map-tab-content {
    position: relative;
    background: #fff;
    padding: 10px 0px;
    border-radius: 8px;
    height: 100vh;
}

/* Embedded remote-monitoring iframe: the map is the only thing this view shows, so
   force every ancestor up to #map-tab-content to have zero spacing of its own instead
   of chasing each contributor individually (header/back-button/filter row height, card
   padding, Bootstrap row gutters, etc. all vary and are easy to miss one of). */
/* Beats .menubar-hoverable.header-fixed #base:has(form) (and its sibling :has()
   variants further down this file) which otherwise re-add top padding here based on
   unrelated page content (any <form> anywhere in #base) — this selector matches the
   same two theme classes plus the body element itself, so it wins on specificity
   regardless of source order. */
body.daily-plan-remote-embed.menubar-hoverable.header-fixed #base {
    padding-top: 0 !important;
}
body.daily-plan-remote-embed #base,
body.daily-plan-remote-embed #content,
body.daily-plan-remote-embed .main-content,
body.daily-plan-remote-embed .row.daily_shift,
body.daily-plan-remote-embed .row.daily_shift > div,
body.daily-plan-remote-embed .card.p-0,
body.daily-plan-remote-embed .card-body.p-0 {
    padding: 0 !important;
    margin: 0 !important;
}
body.daily-plan-remote-embed div#map-tab-content {
    padding: 0 !important;
    margin: 0 !important;
}
body.daily-plan-remote-embed .row.p-3.vh_93,
body.daily-plan-remote-embed .row.vh_93 {
    margin: 0 !important;
    padding: 0 !important;
}
/* The Loaders/Haulers/Support/Location side panel's card-body has a hardcoded
   height:78vh inline style sized for this page's normal standalone layout; inside
   the embedded iframe that leaves an internal scrollbar on the equipment list.
   Only this embedded case is touched (scoped to daily-plan-remote-embed), so the
   standalone Remote Monitoring page keeps its original 78vh unchanged. */
body.daily-plan-remote-embed .col-lg-3 > .card > .card-body {
    height: 100% !important;
}
body.daily-plan-remote-embed .row.vh_93 > .col-lg-3,
body.daily-plan-remote-embed .row.vh_93 > .col-lg-3 > .card {
    height: 100%;
}

.vh_93{
    height : 93vh;
}

.height_scroll .vh_93 {
    height: 86vh !important;
}

.expandead-arrow {
    position: absolute;
    top: 60%;
    left: 1px;
    z-index: 999;
}

.content-column iframe {
    height: 100vh;
}

.map-scroll {
    height: 65vh;
    overflow-y: scroll;
}

.brown-theme .filter-button button:hover {
    background: #b57423 !important;
}
/*result popup*/

.result-popup .modal-dialog {
    width: 1011px;
    max-width: 100%;
}

    .result-popup .modal-dialog .modal-content {
        width: 100%;
        max-width: 100%;
        border-radius: 6px !important;
        border: solid 0px;
    }

.result-popup .modal-header {
    display: flex;
    justify-content: space-between;
    border: 0;
    padding-bottom: 1px;
}

.result-popup h1.modal-title {
    color: #262E2F;
    font-size: 24px;
    font-weight: 700;
    font-family: 'Plus Jakarta Sans';
    display: flex;
    align-items: center;
}

    .result-popup h1.modal-title span.ico {
        background: #f1e4da;
        width: 35px;
        height: 35px;
        border-radius: 35px;
        line-height: 38px;
        text-align: center;
        margin-right: 10px;
        margin-top: 4px;
        padding-left: 0px;
    }

    .result-popup h1.modal-title span {
        padding-left: 10px;
        font-size: 18px;
        font-weight: 700;
        color: #B52B23;
    }

.result-popup .modal-header button {
    border: 0px !important;
    background: 0px;
    color: #000 !important;
}

.result-popup table thead {
    background: #ffe4cd !important
}

.result-popup table {
    border: 1px solid #f4f4f4;
}

    .result-popup table thead tr th {
        color: #222;
        font-weight: 600;
    }

    .result-popup table tbody tr:nth-child(2n) td {
        background: #FAF8F8;
    }

    .result-popup table tbody tr td {
        border: 0;
    }

.result-popup .pagination-error {
    background: #FFFAF6;
    display: flex;
    justify-content: space-between;
    padding: 10px;
    border-radius: 10px;
}

    .result-popup .pagination-error ul {
        display: flex;
        justify-content: space-between;
        list-style-type: none;
        margin-bottom: 0px;
    }

    .result-popup .pagination-error p {
        margin-bottom: 0px;
        padding-bottom: 0px;
        color: #606060;
        font-size: 14px;
        font-weight: 600;
        text-transform: capitalize;
    }

    .result-popup .pagination-error ul li a {
        color: #4F5356;
        font-size: 14px;
        padding: 0px 13px;
        text-decoration: none;
    }

.content-column iframe {
    height: 100vh;
}

.brown-theme .filter-button button:hover {
    background: #b57423 !important;
}

span.select2-dropdown.select2-dropdown--below {
    margin-top: 5px;
}

.blue-theme .dropdown-menu {
    background: #000 !important;
    border-color: #646060;
}

    .blue-theme .dropdown-menu a {
        color: #a4a0a0 !important;
    }

    .blue-theme .dropdown-menu li label {
        color: #d0cccc !important;
    }

        .blue-theme .dropdown-menu li label span {
            color: #fff !important;
        }

.blue-theme button.ColVis_Button, ul.ColVis_collection li {
    background: #000 !important;
}

.blue-theme .ColVis_collection .colvis_switch:checked:before {
    background: #c37336 !important;
}

.blue-theme .dataTables_buttons .cma_top_icon i {
    background: #c37336 !important;
    border-color: #c37336 !important;
    color: #fff !important
}

.blue-theme .dataTables_wrapper .dataTables_buttons .cma_top_icon:nth-child(2) i {
    color: #fff !important;
}

.blue-theme .card-block .form-group input, .card-block .form-group textarea {
    background: #1f1b1b;
    color: #ababab !important;
    font-size: 14px;
    font-weight: 500 !important;
    border-color: #e7e7e7 !important;
}

.blue-theme .card-block .form-group label {
    color: #fff !important;
    font-weight: 500 !important;
    font-family: Plus Jakarta Sans !important;
    font-size: 14px !important;
    padding-bottom: 0px !important;
}

.blue-theme .cma_save_button, .blue-theme .cma_save_button:hover {
    border: 1px solid #DBDBDB;
    background: #B57423 !important;
    /*    width: 103px;*/
    height: 41px;
    border-radius: 5px;
    color: #fff;
    font-family: 'Plus Jakarta Sans';
    font-weight: 700;
    display: flex;
    justify-content: center;
    align-items: center;
    font-size: 14px;
}

.blue-theme button#btnSubmit, .blue-theme button#btnSubmitReview {
    background: #B57423 !important;
    border-color: #B57423 !important;
    color: #fcf9f9 !important;
}

.brown-theme .ColVis_collection .colvis_switch:checked:before {
    background: #c37336 !important;
}

.brown-theme .dropdown-menu .actions:not(.actions--inverse) .actions__item {
    color: #4F4F4F;
}

.blue-theme .div_filter .form-group span.selection {
    background: #000 !important;
}

.blue-theme .div_filter .form-group span.select2 .selection .select2-selection {
    background: #1f1b1b;
}

.blue-theme .select2-container--default .select2-selection--single .select2-selection__rendered {
    color: #ababab !important;
}


.row.div_filter.filter-popup.filter-popup-left {
    left: 13px;
    top: 50px;
}

.brown-theme .card-block .form-group input, .card-block .form-group textarea {
    background: #fff !important;
    color: black !important;
    font-size: 14px;
    font-weight: 500 !important;
    border-color: #e7e7e7 !important;
}

.brown-theme button.ColVis_Button, ul.ColVis_collection li {
    background: #fff !important;
}

.brown-theme button#btnSubmit, .brown-theme button#btnSubmitReview {
    background: #B57423 !important;
    border-color: #B57423 !important;
    color: #fcf9f9 !important;
    margin-right: 6px;
}

.blue-theme button#btnCloseFilter {
    background: #393939 !important;
    color: #fff;
    border: 1px solid #5b5757 !important;
}

.result-popup .pagination-error ul li.prev a {
    color: #4F5356;
    font-weight: 700;
}

.result-popup .pagination-error ul li.next a {
    color: #B57423 !important;
    font-weight: 700;
}

.result-popup .pagination-error ul li.active a {
    background: #B57423;
    width: 26px;
    padding: 6px 12px;
    border-radius: 5px;
    color: #fff;
    font-weight: 600;
}

.result-popup .pagination-error select {
    width: 60px;
    height: 31px;
    border-radius: 5px;
    margin: 0px 10px;
    border: 1px solid #DCDBDB;
    color: #414141;
    padding: 2px;
}

.result-popup td.red-col {
    color: #B52B23;
    font-weight: 500;
}

.result-popup span.mobile-active, .result-popup span.incorrect-blood {
    background: #FAFA33;
    padding: 5px;
    border-radius: 3px;
    font-weight: 600;
}

.result-popup tr.data_present::after {
    width: 3px;
    height: 17px;
    border-left: 3px solid #B52B23;
    content: "";
    position: absolute;
    left: 0px;
    top: 13px;
}

.result-popup tr.data_present {
    position: relative;
}

.result-popup td.red-col {
    color: #B52B23;
    font-weight: 500;
}

span.mobile-active, span.incorrect-blood {
    background: #FAFA33;
    padding: 5px;
    border-radius: 3px;
    font-weight: 600;
}

.result-popup tr.data_present::after {
    width: 3px;
    height: 17px;
    border-left: 3px solid #B52B23;
    content: "";
    position: absolute;
    left: 0px;
    top: 13px;
}

.result-popup tr.data_present {
    position: relative;
}


.blue-theme .result-popup table tbody tr:nth-child(2n) td {
    background: #313030 !important;
}

.blue-theme span.mobile-active, .blue-theme span.incorrect-blood {
    background: #FAFA33;
    color: #222;
}

.blue-theme .result-popup .modal-dialog .modal-content {
    background: #1e1e1e;
    box-shadow: 0px -1px 5px #646262;
}

.blue-theme .result-popup h1.modal-title {
    color: #fff !important;
}

.blue-theme .result-popup .modal-header button svg path {
    fill: #fff !important;
}

.blue-theme .result-popup table {
    border-color: #494545;
}

.blue-theme .result-popup .pagination-error {
    background: #000;
}

.result-popup .modal-footer {
    border: 0px;
    margin-top: 0px;
    padding-top: 0px;
}

.blue-theme .result-popup .pagination-error ul li a {
    color: #c5c5c5;
}

.blue-theme .result-popup table thead tr th {
    color: #ccc3c3 !important;
}

@media only screen and (min-width:320px) and (max-width:600px) {
    .result-popup .pagination-error {
        padding: 10px 0px;
        display: flex;
        flex-direction: column;
        justify-content: center;
    }

        .result-popup .pagination-error p {
            text-align: center;
        }

        .result-popup .pagination-error ul {
            text-align: center;
            justify-content: center;
            margin-top: 5px;
        }

            .result-popup .pagination-error ul li a {
                padding: 0px;
            }

            .result-popup .pagination-error ul li a {
                padding: 0px 10px;
            }

    .result-popup h1.modal-title {
        font-size: 20px;
    }

        .result-popup h1.modal-title span {
            font-size: 15px;
            padding-left: 5px;
        }
}

.table-responsive-lg table tbody tr:nth-child(2n) {
    background: #FAF8F8 !important;
}

.blue-theme .target-card:nth-child(odd) {
    background: #4d4d4d;
}

.blue-theme button#btnFilter {
    border-color: #d4b38a !important;
}

.blue-theme .card-block .form-group input, .card-block .form-group text {
    background: #1f1b1b !important;
    color: #ababab !important;
    font-size: 14px;
    font-weight: 500 !important;
    border-color: #e7e7e7 !important;
}

.button-common:hover, button.btn-add-services:hover, button.btnaddonservices:hover, button.btn-add-charges:hover, button.btn-add-shipcontacts:hover, .btnSubmit:hover, button.btn-add-contacts:hover, button.btn-add-details:hover, button.btn-add-ctmspec:hover, button.btn-add-locations:hover, button.btn-add-pricelist:hover {
    background: #fff !important;
    border-radius: 5px !important;
    font-family: 'Plus Jakarta Sans' !important;
    font-style: normal !important;
    font-weight: 700 !important;
    font-size: 15px !important;
    line-height: 26px !important;
    height: 38px;
    color: rgb(255 255 255) !important;
    border: rgba(10, 22, 76, 1) !important;
    margin-top: 10px;
    background-color: rgba(181, 116, 35, 0.04) !important;
    margin-top: 10px;
    border: 0.75px solid rgba(181, 116, 35, 0.8) !important;
    background: rgba(181, 116, 35, 0.04);
    color: background: rgba(181, 116, 35, 1);
    color: rgba(181, 116, 35, 1) !important;
}

.blue-theme .form-group span.select2 .selection .select2-selection {
    background: #1f1b1b !important;
    color: #ababab !important;
    font-size: 14px;
    font-weight: 500 !important;
    border-color: #e7e7e7 !important;
}

.blue-theme .form-control {
    background: #1f1b1b !important;
    color: #ababab !important;
    font-size: 14px;
    font-weight: 500 !important;
    border-color: #e7e7e7 !important;
}

.blue-theme .select2-dropdown {
    background: #1f1b1b !important;
    color: #ababab !important;
    font-size: 14px;
    font-weight: 500 !important;
    border-color: #e7e7e7 !important;
}

.blue-theme .xdsoft_datetimepicker .xdsoft_calendar td > div {
    padding-right: 5px;
    background: #1f1b1b !important;
    color: #ababab !important;
    font-size: 14px;
    font-weight: 500 !important;
    background: #1f1b1b !important;
    color: #ffffff !important;
    font-size: 14px;
    font-weight: 500 !important;
    border-color: #e7e7e7 !important;
}

.blue-theme .xdsoft_datetimepicker .xdsoft_timepicker .xdsoft_time_box > div > div {
    background: #f5f5f5;
    border-top: 1px solid #ddd;
    color: #666;
    font-size: 12px;
    text-align: center;
    border-collapse: collapse;
    cursor: pointer;
    border-bottom-width: 0;
    height: 25px;
    line-height: 25px;
    background: #1f1b1b !important;
    color: #ababab !important;
    font-size: 14px;
    font-weight: 500 !important;
    border-color: #e7e7e7 !important;
}

.blue-theme .xdsoft_datetimepicker {
    background: #1f1b1b !important;
    color: #ababab !important;
    font-size: 14px;
    font-weight: 500 !important;
    background: #1f1b1b !important;
    color: #ffffff !important;
    font-size: 14px;
    font-weight: 500 !important;
    border-color: #e7e7e7 !important;
}

    .blue-theme .xdsoft_datetimepicker .xdsoft_calendar td, .blue-theme .xdsoft_datetimepicker .xdsoft_calendar th {
        background: #1f1b1b !important;
        color: #ababab !important;
        font-size: 14px;
        font-weight: 500 !important;
        background: #1f1b1b !important;
        color: #ffffff !important;
        font-size: 14px;
        font-weight: 500 !important;
        border-color: #e7e7e7 !important;
    }

    .blue-theme .xdsoft_datetimepicker * {
        background: #1f1b1b !important;
        color: #ababab !important;
        font-size: 14px;
        font-weight: 500 !important;
        background: #1f1b1b !important;
        color: #ffffff !important;
        font-size: 14px;
        font-weight: 500 !important;
        border-color: #e7e7e7 !important;
    }

    .blue-theme .xdsoft_datetimepicker .xdsoft_label i,
    .blue-theme .xdsoft_datetimepicker .xdsoft_prev,
    .blue-theme .xdsoft_datetimepicker .xdsoft_next,
    .blue-theme .xdsoft_datetimepicker .xdsoft_today_button {
        background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAGQAAAAeCAYAAADaW7vzAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAyJpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuMy1jMDExIDY2LjE0NTY2MSwgMjAxMi8wMi8wNi0xNDo1NjoyNyAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvIiB4bWxuczp4bXBNTT0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL21tLyIgeG1sbnM6c3RSZWY9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9zVHlwZS9SZXNvdXJjZVJlZiMiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIENTNiAoV2luZG93cykiIHhtcE1NOkluc3RhbmNlSUQ9InhtcC5paWQ6Q0NBRjI1NjM0M0UwMTFFNDk4NkFGMzJFQkQzQjEwRUIiIHhtcE1NOkRvY3VtZW50SUQ9InhtcC5kaWQ6Q0NBRjI1NjQ0M0UwMTFFNDk4NkFGMzJFQkQzQjEwRUIiPiA8eG1wTU06RGVyaXZlZEZyb20gc3RSZWY6aW5zdGFuY2VJRD0ieG1wLmlpZDpDQ0FGMjU2MTQzRTAxMUU0OTg2QUYzMkVCRDNCMTBFQiIgc3RSZWY6ZG9jdW1lbnRJRD0ieG1wLmRpZDpDQ0FGMjU2MjQzRTAxMUU0OTg2QUYzMkVCRDNCMTBFQiIvPiA8L3JkZjpEZXNjcmlwdGlvbj4gPC9yZGY6UkRGPiA8L3g6eG1wbWV0YT4gPD94cGFja2V0IGVuZD0iciI/PoNEP54AAAIOSURBVHja7Jq9TsMwEMcxrZD4WpBYeKUCe+kTMCACHZh4BFfHO/AAIHZGFhYkBBsSEqxsLCAgXKhbXYOTxh9pfJVP+qutnZ5s/5Lz2Y5I03QhWji2GIcgAokWgfCxNvcOCCGKqiSqhUp0laHOne05vdEyGMfkdxJDVjgwDlEQgYQBgx+ULJaWSXXS6r/ER5FBVR8VfGftTKcITNs+a1XpcFoExREIDF14AVIFxgQUS+h520cdud6wNkC0UBw6BCO/HoCYwBhD8QCkQ/x1mwDyD4plh4D6DDV0TAGyo4HcawLIBBSLDkHeH0Mg2yVP3l4TQMZQDDsEOl/MgHQqhMNuE0D+oBh0CIr8MAKyazBH9WyBuKxDWgbXfjNf32TZ1KWm/Ap1oSk/R53UtQ5xTh3LUlMmT8gt6g51Q9p+SobxgJQ/qmsfZhWywGFSl0yBjCLJCMgXail3b7+rumdVJ2YRss4cN+r6qAHDkPWjPjdJCF4n9RmAD/V9A/Wp4NQassDjwlB6XBiCxcJQWmZZb8THFilfy/lfrTvLghq2TqTHrRMTKNJ0sIhdo15RT+RpyWwFdY96UZ/LdQKBGjcXpcc1AlSFEfLmouD+1knuxBDUVrvOBmoOC/rEcN7OQxKVeJTCiAdUzUJhA2Oez9QTkp72OTVcxDcXY8iKNkxGAJXmJCOQwOa6dhyXsOa6XwEGAKdeb5ET3rQdAAAAAElFTkSuQmCC) !important;
    }

.errorCommentsDisplay {
    color: red !important;
}

a.all-clear-button button {
    background: #f8eae9 !important;
    width: 113px;
    height: 37px;
    border-radius: 5px;
    display: flex;
    justify-content: center;
    align-items: center;
    align-self: center;
    color: #B52B23;
    border-color: #f8eae9 !important;
    margin: 0px 10px;
}

.allclearicon {
    height: 24px;
    margin-left: 6px;
}

.bulk-uploadinput {
    display: none !important;
}

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

.result-popup #tblStaffWeeklyPlan td:last-child {
    color: #B52B23 !important;
    width: 85px;
    white-space: nowrap;
    overflow: hidden !important;
    text-overflow: ellipsis;
    display: block;
}

.btn-danger:hover, .btn-danger:focus, .open .dropdown-toggle.btn-danger {
    color: #B52B23;
}

.m-o {
    margin: 0px !important;
}

.template-download:hover {
    background-color: #c98a51cc !important
}

.login-section {
    align-self: center;
}

.brown-theme .perform_nav.nav-tabs > li.active > a {
    display: block !important;
}

.perform_nav.nav-tabs > li.active > a {
    display: block !important;
}

.perform_nav.nav-tabs > li > a {
    display: block !important;
}

.nano.has-scrollbar .gui-controls li.has-dropdown.profileicon {
    width: 100% !important;
}



.blue-theme .staffdetailsContainer .row:nth-child(2n) {
    background: #373737;
}

div#tblStaffWeeklyPlan_wrapper.dataTables_wrapper table thead tr th:last-child {
    background: rgba(255, 247, 241, 1) !important;
}

.upload-label a.bulk-upload.upload-popup-btn.automatonShowFilter svg {
    margin-right: 4px;
}

.dataTables_wrapper .dataTables_scrollHeadInner {
    width: 100% !important;
}

    .dataTables_wrapper .dataTables_scrollHeadInner table {
        width: 100% !important;
    }

.dataTables_wrapper .dataTables_scrollBody table {
    width: 100% !important;
}

.page-header-theme {
    position: relative;
}

    .page-header-theme .vertical-tabs.theme-tab {
        position: absolute;
        right: 25px;
        top: 15px;
    }

.table-responsive-lg table tbody#monthlyplaninfoContainerBody td:last-child {
    word-break: break-word;
    white-space: normal;
    max-width: 290px;
    min-height: 84px;
    max-height: 43px;
    overflow-y: auto;
    overflow-x: hidden;
    display: block;
}

.table-responsive-lg table#monthlyplaninfoContainer thead#monthlyplaninfoContainerHead tr th:last-child {
    width: 270px !important;
}

.disp_image {
    width: 30px !important;
    height: 30px !important;
    min-width: 30px !important;
    max-width: 30px !important;
}

.brown-theme .form-control {
    background: #fff !important;
    color: black !important;
    font-size: 14px;
    font-weight: 500 !important;
    border-color: #e7e7e7 !important;
    padding: 6px 6px;
}

.form-group .select2 span {
    border-color: #e7e7e7 !important;
}
/*Common fix */
.modal-backdrop.in {
    opacity: 0 !important;
}

.form-group.form-group--float-above {
    display: flex;
    flex-direction: column;
}

.form-group.has-error .help-block {
    order: 2;
    font-weight: 400 !important;
}

.form-group select {
    order: 1;
}

.list_card_section .form-group .iti.iti--allow-dropdown span {
    font-size: 12px;
    color: #000000 !important;
}

.btn-primary:hover, .btn-primary:focus, .btn-primary.focus, .btn-primary:active, .btn-primary.active, .open > .dropdown-toggle.btn-primary {
    color: #fff;
    background-color: #B57423 !important;
    border-color: #B57423 !important;
}

#verifiedstatus_buttons .btn-primary {
    color: #fff;
    background-color: #B57423 !important;
    border-color: #B57423 !important;
    margin-right: 10px;
    border-radius: 4px !important;
    /* border-top-right-radius: 4px; */
    border: 0;
}

#cboxClose {
    position: absolute;
    bottom: 0;
    right: 0;
    top: 0px !important;
    background: url(./components/jquery-colorbox/images/controls.png) no-repeat -25px 0 !important;
    width: 25px;
    height: 25px;
    text-indent: -9999px;
}
/*Common fix */
.BasicInfo_craftmyapp_container .form-group {
    position: relative;
    margin-bottom: 19px;
    display: flex;
    flex-direction: column;
    /*    margin: 0; */
}

body .swal2-confirm, body .swal2-confirm:hover {
    background: #B57423 !important;
    border-radius: 9px !important;
    border: none !important;
}

body .swal2-cancel, body .swal2-cancel:hover {
    background-color: #fff !important;
    border: solid 1px #B57423 !important;
    color: #b57423 !important;
    border-radius: 9px !important;
    float: left;
}

.swal2-icon.swal2-warning {
    border-color: #b57423 !important;
    color: #000 !important;
}

.forgot-pwd:hover, .forgot-pwd:focus {
    background: transparent !important;
    float: right;
    height: auto !important;
    padding: 0px;
    color: #141414 !important;
    font-weight: 500 !important;
    margin-top: 0px;
    text-decoration: underline;
    margin-top: -2px;
    border: none !important;
}

.percent-symbol {
    border-left: 0px !important;
    border-radius: 0px 4px 4px 0px;
}

#equipmentinfoContainer .col-sm-2.col-xs-12.totalproductivity_craftmyapp_container {
    width: 220px !important;
}

#equipmentinfoContainer .col-sm-1.detele-common-icon {
    width: 15px !important;
}

#btnCloseFilter {
    border: 1px solid #b57423 !important;
    width: 102px;
    height: 41px;
    color: #b57423;
    background: #fff !important;
    border-radius: 5px !important;
    text-transform: capitalize;
    font-weight: 700 !important;
    margin-right: 10px;
    line-height: 10px;
}

    #btnCloseFilter:hover {
        border: 1px solid #b57423;
        width: 102px;
        height: 41px;
        color: #b57423;
        background: #fff !important;
        border-radius: 5px !important;
        text-transform: capitalize;
        font-weight: 700 !important;
        margin-right: 10px;
        line-height: 10px;
    }

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

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


@media (width <= 995px) {
    .row.login_section {
        align-items: center;
        display: flex;
        justify-content: center;
        height: 100vh;
    }
}

.brown-theme .dataTables_wrapper table thead tr th.dt-center {
    width: 100px !important;
    min-width: 123px;
}

.table.dataTable > tbody > tr > td.dt-center {
    display: flex;
    align-items: center;
    width: 100px !important;
    min-width: 123px;
}

.MaterialInfo_craftmyapp_container .form-group.has-error {
    display: flex;
    flex-direction: column;
}
/*.brown-theme .nav-tabs > li > a, .brown-theme .nav-tabs > li > a:hover, .brown-theme .nav-tabs > li > a:focus {
    border-color: transparent !important;
    background-color: transparent !important;
    border-bottom: 40px solid rgba(236, 236, 236, 1) !important;
    border-left: 20px solid transparent !important;
    height: 0px;
    border-right: 20px solid transparent !important;
    color: rgba(88, 88, 88, 1);
    box-shadow: 3px 7px 11px 0px rgba(0, 0, 0, 0.34);
}*/
/*#menubar .has-dropdown.profileicon {
    margin-bottom: 11px;
}*/

.automatonShowFilter {
    background-color: #c98a51 !important;
    color: transparent !important;
    background-image: url('Icon_set/Filter_icon.svg') !important;
    background-size: 21px 87px;
    background-position: center !important;
    background-repeat: no-repeat !important;
}

#explosivedetailContainer .explosivedetail .col-sm-2.col-xs-12 {
    width: 242px;
}

#monthlytargetdetailsContainer .monthlytargetdetails .col-sm-2.col-xs-12 {
    width: 210px;
}

.idealbuffer_craftmyapp_container .form-group {
    display: flex;
    flex-direction: column;
}

.pplanname_craftmyapp_container .form-group {
    display: flex;
    flex-direction: column;
}

.plannedbuffer_craftmyapp_container .form-group {
    display: flex;
    flex-direction: column;
}

.aproductiontarget_craftmyapp_container .form-group {
    display: flex;
    flex-direction: column;
}

.materialname_craftmyapp_container .form-group {
    display: flex;
    flex-direction: column;
}

.density_craftmyapp_container .form-group {
    display: flex;
    flex-direction: column;
}

.productivity_craftmyapp_container .form-group {
    display: flex;
    flex-direction: column;
}

.bucketcapacity_craftmyapp_container .form-group {
    display: flex;
    flex-direction: column;
}

#dumpersmatrixContainer .dumpersmatrix .col-sm-2.col-xs-12 {
    width: 210px;
}

.button-common .fa.fa-plus {
    color: rgba(34, 34, 34, 1) !important
}

#equipmentinfoContainer .equipmentinfo .col-sm-2.col-xs-12 {
    width: 210px;
}

#drillmeterageandexplosiveinfoContainer .drillmeterageandexplosiveinfo .col-sm-2.col-xs-12 {
    width: 240px;
}

#explosivetypeinformationContainer .explosivetypeinformation .col-sm-2.col-xs-12 {
    width: 240px;
}

.detele-common-icon .fa.fa-trash {
    background-color: transparent !important;
    color: transparent !important;
    background-image: url('Icon_set/close.svg') !important;
    background-size: 19px 87px;
    background-position: center !important;
    background-repeat: no-repeat !important;
}

label.upload-label {
    margin: 0px !important;
}

.h-80vh {
    height: 80Vh
}

@media (width <= 1023px) {
    .perform_nav.nav-tabs > li > a {
        display: block;
        margin: 0 auto;
        width: max-content !important;
    }
}

.nav-item .nav-link {
    border-color: transparent !important;
    background-color: #ffffff !important;
    border-bottom: 40px solid #ffffff !important;
    border-left: 20px solid transparent !important;
    border-right: 20px solid transparent !important;
    height: 37px;
    color: #212529 !important;
    /* color: #212529; */
    font-size: 15px;
    font-weight: 400;
}

#monthlytargetbreakupContainer .row.dependheader {
    background-color: rgba(255, 247, 241, 1);
    padding: 10px !important;
    box-shadow: 0px 10px 20px 5px rgba(0, 0, 0, 0.04);
    margin: 10px 0px !important;
}

.dependheader label {
    padding: 0px !important;
    margin: 0px !important;
}

.detele-common-icon .btn-add-drillinfo span {
    color: #B57423 !important;
}

.detele-common-icon .btn-add-drillinfo .fa.fa-plus {
    color: #222 !important;
}

.expand_button i {
    border: solid 1px #B57423;
    padding: 4px 4px;
    border-radius: 4px;
    color: #B57423;
    font-size: 10px
}

.monthlytargetbreakup-labels .col-sm-2 {
    width: 200px;
}

.table-responsive-lg .parent-row.bordered {
    border: solid #B57423 1px;
    border-bottom: solid 0px !important;
}

.table-responsive-lg .child-row.bordered {
    border: solid #B57423 1px !important;
    border-top: solid 0px !important;
}

.assetdetailsContainer .row.dependheader {
    background-color: rgba(255, 247, 241, 1);
    padding: 10px !important;
    box-shadow: 0px 10px 20px 5px rgba(0, 0, 0, 0.04);
    margin: 10px 0px !important;
}

.assetcomponentdetails .col-sm-2 {
    width: 215px;
}

.expand-rows-container .assetcomponentdetails .col-sm-2 {
    width: 215px !important;
}

.expand-rows-container .assetcomponentdetails .col-sm-2 {
    width: 230px !important;
}

#assetdetailsContainer .assetcomponentdetails .col-sm-2 {
    width: 200px !important;
}

.row.assetdetails-labels.dependheader {
    background-color: rgba(255, 247, 241, 1);
    padding: 10px !important;
    box-shadow: 0px 10px 20px 5px rgba(0, 0, 0, 0.04);
    margin: 10px 0px !important;
}

.dependentContainerBorder .btn-remove-row span::before {
    color: #DB3712 !important;
    font-size: 22px;
    background: transparent;
    color: transparent !important;
}

.brown-theme .nav.nav-tabs.nav-overall > li a {
    color: #000 !important;
    border-color: #dbdbdb !important;
    background: #fff;
    border-bottom: 40px solid #f7f0e5 !important;
    border-left: 14px solid transparent !important;
    border-right: 14px solid transparent !important;
    display: block;
    line-height: 39px !important;
    align-items: center;
    height: 37px;
    border-top-left-radius: 25px !important;
    border-top-right-radius: 25px;
    justify-content: center;
    font-size: 14px;
    background-color: transparent !important;
    /*    box-shadow: 0px 20px 10px -15px #a09f9f;*/
    font-weight: 700;
}



.production_details .nav > li > a > img {
    width: 30px;
    height: 21px;
}

.production_details .row.printablerow {
    margin-top: 0px;
}

.production_details .maker_checker_card {
    margin-top: 13px;
}

.production_details .rejecticon_header {
    display: none;
}

production_details .nav.nav-tabs.nav-overall {
    box-shadow: rgba(0, 0, 0, 0.16) 0px 1px 4px;
    display: flex;
    align-items: center;
    margin: 0px 13px;
}

.gap-17 {
    gap: 17px
}

.file_upload_border {
    border-right: solid 1px rgba(227, 230, 234, 1);
    padding-right: 15px;
}

.gap-12 {
    gap: 12px
}

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

/*#monthlytargetbreakupContainer label {
    font-weight: 600;
    color: #222222;
    font-size: 13px;
    padding-bottom: 0px;
}

*/


#monthlytargetbreakupContainer .row.m-t-10.drillinfo.dependentContainerBorder.expanded {
    border: 1px solid #B57423 !important;
    margin: 0px !important;
    padding: 0px 0px !important;
    display: flex;
    margin-bottom: 0px !important;
    border-bottom: 0px solid !important;
    border-top: 0px solid !important;
    display: flex;
    align-items: center;
}

.drillinfo.dependentContainerBorder .col-sm-2 {
    width: 190px;
    margin-left: 7px !important;
}

.expand-rows-container.drillinfo-rows-container.expanded {
    border: 1px solid #B57423 !important;
    border-top: 0px solid !important;
    margin-bottom: 10px;
}

#monthlytargetbreakupContainer .monthlytargetbreakup.hidethelables .form-group label {
    display: none !important;
}


#monthlytargetbreakupContainer .monthlytargetbreakup button i {
    border: 1.5px solid #B57423 !important;
    padding: 2px 5px !important;
    margin: 0px !important;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 3px;
}

#monthlytargetbreakupContainer .row {
    margin: 0 !important;
    padding: 0 !important;
    padding-top: 8px !important;
    padding-bottom: 13px !important;
}

    #monthlytargetbreakupContainer .row.monthlytargetbreakup.dependentContainerBorder.expanded {
        border: 1px solid #B57423 !important;
        margin: 0px !important;
        padding: 0px 0px !important;
        display: flex;
        margin-bottom: 0px !important;
        border-bottom: 0px solid !important;
        padding-top: 13px !important;
    }

#monthlytargetbreakupContainer .form-group {
    margin: 0 !important;
}

.monthlytargetbreakup .col-sm-2 {
    width: 230px;
    padding-bottom: 10px;
}

.monthlytargetbreakup .col-sm-1.detele-common-icon {
    width: 10px;
}

.col-sm-12.expand-rows-container .col-sm-2 {
    width: 180px;
}

#monthlytargetbreakupContainer button.btn-expand-collapse {
    background-color: transparent !important;
    border: none !important;
}

.monthlytargetbreakup .expand-rows-container .row .col-sm-2 {
    width: 190px
}


#monthlytargetbreakupContainer .expand-rows-container .row {
    margin-left: 0px !important;
    margin-top: 0px !important;
    margin-bottom: 0px !important;
    padding-top: 12px !important;
    padding-bottom: 12px !important;
}


#monthlytargetbreakupContainer {
    margin: 10px 0px !important;
    padding: 10px 8px !important;
    margin-top: 0px !important;
    padding-top: 0px !important;
}

.detele-common-icon button span {
    color: #DB3712 !important;
}

.detele-common-icon .add-collapse-btn span {
    font-size: 12px;
}

.add-row-btn.add-review-btn {
    display: inline-block !important; /* Ensures the button remains visible */
    background-color: #e47e46 !important; /* Your desired color */
    color: white !important; /* Text color for better visibility */
    border: none !important; /* Removes any border */
    text-decoration: none !important; /* Prevent underline effects */
    padding: 10px 20px !important; /* Adjust padding for better appearance */
    border-radius: 5px !important; /* Ensures the rounded corners */
    font-size: 14px !important; /* Adjust font size if needed */
    font-weight: bold !important; /* Bold text for emphasis */
    transition: none !important; /* Disable hover transitions */
}

    .add-row-btn.add-review-btn:hover {
        background-color: #e47e46 !important; /* Prevent hover color change */
        color: white !important; /* Prevent text color change */
        cursor: pointer !important; /* Ensure consistent pointer style */
    }


.sector_production_plan .nav > li > a > img {
    width: 30px;
    height: 21px;
}

.sector_production_plan .row.printablerow {
    margin-top: 0px;
}

.sector_production_plan .maker_checker_card {
    margin-top: 13px;
}


.sector_production_plan .filter-dropdown {
    position: relative;
}

    .sector_production_plan .filter-dropdown .dropdown-menu {
        position: absolute;
        top: 100%;
        left: auto;
        right: 0;
        z-index: 1000;
        display: none;
        float: left;
        min-width: 160px;
        padding: 5px 0;
        margin: 2px 0 0;
        font-size: 14px;
        text-align: left;
        list-style: none;
        background-color: #fff;
        border: 1px solid #ccc;
        border-radius: 4px;
        box-shadow: 0 6px 12px rgba(0, 0, 0, 0.175);
    }

        .sector_production_plan .filter-dropdown .dropdown-menu.show {
            display: block;
        }

    .sector_production_plan .filter-dropdown a {
        cursor: pointer;
    }



#assetdetailsContainer label {
    font-weight: 600;
    color: #222222;
    font-size: 13px;
    padding-bottom: 0px;
}


#assetdetailsContainer .assetdetails .form-group label {
    display: none !important;
}

#assetdetailsContainer .assetdetails.showthelables .form-group label {
    display: block !important;
}

#assetdetailsContainer .assetdetails button i {
    border: 1.5px solid #afafaf !important;
    padding: 2px 5px !important;
    margin: 0px !important;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 3px;
}

#assetdetailsContainer .row {
    margin: 0 !important;
    padding: 0 !important;
    padding-top: 6px !important;
    padding-bottom: 6px !important;
    align-items: center;
}

    #assetdetailsContainer .row.assetdetails.dependentContainerBorder.expanded {
        border: 1px solid #afafaf !important;
        margin: 0px !important;
        padding: 0px 0px !important;
        display: flex;
        margin-bottom: 0px !important;
        border-bottom: 0px solid !important;
        padding-top: 13px !important;
        margin-top: 10px !important;
        padding-bottom: 13px !important;
    }

#assetdetailsContainer .form-group {
    margin: 0 !important;
}

.assetdetails .col-sm-2 {
    width: 200px;
}

.col-sm-1.detele-common-icon {
    width: 10px;
}

.col-sm-12.expand-rows-container .col-sm-2 {
    width: 180px;
}

#assetdetailsContainer button.btn-expand-collapse {
    background-color: transparent !important;
    border: none !important;
}

.Add_Asset_Allocation .expand-rows-container .row .col-sm-2 {
    width: 190px
}


#assetdetailsContainer .expand-rows-container .row {
    margin-left: 0px !important;
    margin-top: 0px !important;
    margin-bottom: 0px !important;
    padding-top: 12px !important;
    padding-bottom: 12px !important;
}


#assetdetailsContainer {
    margin: 10px 0px !important;
    padding: 10px 8px !important;
}

.Add_Asset_Allocation .detele-common-icon button span {
    color: #DB3712 !important;
}

.Add_Asset_Allocation .detele-common-icon .add-collapse-btn span {
    font-size: 12px;
}

.delete-common-icon button .fa.fa-trash {
    background-color: transparent !important;
    color: transparent !important;
    background-image: url('Icon_set/close.svg') !important;
    background-size: 19px 87px;
    background-position: center !important;
    background-repeat: no-repeat !important;
}

.delete-common-icon button {
    background-color: transparent !important;
    color: transparent !important;
    background-image: url('Icon_set/close.svg') !important;
    background-size: 19px 87px;
    background-position: center !important;
    background-repeat: no-repeat !important;
    border: none !important;
}

#assetdetailsContainer .assetdetails-labels .col-sm-2 {
    width: 200px !important;
}

.table.dataTable > tbody > tr > td a.dropdown-item {
    width: 30px !important;
}

#assetdetailsContainer .expand-rows-container.assetcomponentdetails-rows-container.expanded {
    border: 1px solid #B57423 !important;
    margin: 0px !important;
    padding: 0px 0px !important;
    display: flex;
    margin-bottom: 0px !important;
    border-top: 0px solid !important;
    padding-bottom: 10px !important;
}

.row.assetcomponentdetails.dependentContainerBorder.expanded {
    border: 1px solid #B57423 !important;
    margin: 0px !important;
    padding: 0px 0px !important;
    display: flex;
    margin-bottom: 0px !important;
    border-top: 0px solid !important;
    border-bottom: 0px solid !important;
    padding-top: 13px !important;
}

#assetdetailsContainer .row.assetdetails.dependentContainerBorder.expanded {
    border: 1px solid #B57423 !important;
    margin: 0px !important;
    padding: 0px 0px !important;
    display: flex;
    margin-bottom: 0px !important;
    border-bottom: 0px solid !important;
    padding-top: 13px !important;
    margin-top: 10px !important;
}

.row.assetcomponentdetails.dependentContainerBorder {
    margin: 0 !important;
    padding: 0 !important;
}

#assetdetailsContainer .row.assetcomponentdetails.dependentContainerBorder {
    margin: 0 !important;
    padding: 0 !important;
    padding-bottom: 6px !important;
}

.table > thead > tr > th, .table > tbody > tr > th, .table > tfoot > tr > th, .table > thead > tr > td, .table > tbody > tr > td, .table > tfoot > tr > td {
    padding: 10px 10px;
    line-height: 1.846153846;
    vertical-align: top;
    border-top: 1px solid rgba(189, 193, 193, 0.2);
}

.spproductiontarget_craftmyapp_container .form-group {
    display: flex;
    flex-direction: column;
}

.mpactual_craftmyapp_container .form-group {
    display: flex;
    flex-direction: column;
}

.mpvariance_craftmyapp_container .form-group {
    display: flex;
    flex-direction: column;
}

.spidealbuffer_craftmyapp_container .form-group {
    display: flex;
    flex-direction: column;
}

.swplanname_craftmyapp_container .form-group {
    display: flex;
    flex-direction: column;
}

.spplannedbuffer_craftmyapp_container .form-group {
    display: flex;
    flex-direction: column;
}

.backlogquantity_craftmyapp_container .form-group {
    display: flex;
    flex-direction: column;
}

#patchtargetbreakupContainer .patchtargetbreakup .col-sm-2 {
    width: 200px !important;
}

.SumoSelect > .CaptionCont {
    height: 37px !important;
    line-height: 1.3 !important;
    border-color: #e7e7e7 !important;
}

    .SumoSelect > .CaptionCont > span.placeholder {
        color: #4A4A4A !important;
    }

.Summary_craftmyapp_container .list_card_section .col-sm-3 {
    width: 285px !important;
}

.targetdetails_craftmyapp_container .card-head header {
    margin-top: 16px !important;
}

#dropdown_container, .gui-controls > li.open > .menu-dropdown {
    margin-top: 0px !important;
}

.nav.nav-tabs li {
    padding-right: 0px;
    padding-left: 0px;
    padding-bottom: 0px;
    padding-bottom: 0px !important;
}

.card-balck.pl-0 {
    padding-left: 0px;
}

.sectoritems .filter-dropdown .material-icons {
    background-color: transparent !important;
    color: transparent !important;
    background-image: url('Icon_set/Filter_black.svg') !important;
    background-size: 21px 87px;
    background-position: center !important;
    background-repeat: no-repeat !important;
}

.production_details .nav.nav-tabs.nav-overall {
    margin-left: 10px
}

.error-file button:hover {
    /*    width: 112px;*/
    background: #f2f2f2 !important;
    /* background: #B52B231A !important; */
    border: 0px;
    color: #B52B23 !important;
}

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

.w-72 {
    width: 72%;
}

.eplanname_craftmyapp_container .form-group {
    display: flex;
    flex-direction: column;
}

li.login_name {
    color: #fff;
    border-bottom: solid 1px !important;
    text-align: justify;
    padding-bottom: 4px;
    margin-bottom: 4px;
}

.profileicon .menu-dropdown ul li a {
    margin-top: 0px !important;
    padding-top: 4px !important;
}

.profileicon .menu-dropdown i {
    font-size: 13px
}

#colorbox, #cboxOverlay, #cboxWrapper {
    z-index: 9999999 !important;
}

.modal-open #base {
    overflow: scroll !important;
}

.blue-theme .list_card_section .form-group .input-group-addon {
    background-color: #000000 !important;
}

.blue-theme .list_card_section .input-file label {
    position: absolute;
    top: 0;
    background-color: #000000 !important;
    border: 1px solid #000000;
    border-radius: 5px 0px 0px 5px;
    padding: 6px 10px;
    left: 0px;
    height: 34px;
}

.blue-theme .list_card_section .input-file {
    border: 1px solid #000000 !important;
    border-radius: 5px;
    position: relative;
    padding: 3px 0px;
}

.blue-theme .button-common .fa.fa-plus {
    color: rgb(255 255 255) !important
}

.blue-theme i.automatonShowFilter.actions__item.mdi.material-icons {
    background-color: #c98a51 !important;
    color: transparent !important;
    background-image: url('Icon_set/Filter_icon.svg') !important;
    background-size: 21px 87px;
    background-position: center !important;
    background-repeat: no-repeat !important;
}

.blue-theme .dataTables_wrapper .dataTables_length select {
    background: #000000;
    border: 1px solid #7F7E82 !important;
    border-radius: 5px !important;
    margin: 0px;
    height: 38px;
    font-family: 'Plus Jakarta Sans';
    font-style: normal;
    font-weight: 400;
    font-size: 16px;
    line-height: 19px;
    color: #7F7E82;
}

.blue-theme .input-group .input-group-addon {
    padding: 4px 14px;
    border-color: #e7e7e7;
    border-width: 1px 1px 1px 0;
    border-style: solid;
    border-radius: 0 5px 5px 0;
    background: #000000;
}

.blue-theme .card-block .form-group input, .blue-theme .card-block .form-group textarea {
    background: #000 !important;
    color: #ffffff !important;
    font-size: 14px;
    font-weight: 500 !important;
    border-color: #e7e7e7 !important;
}

.blue-theme .main-content {
    /* background-color: #f0f1f8 !important;*/
    background-color: #282421 !important;
}

.blue-theme .dataTables_wrapper table thead tr th.dt-center {
    width: 100px !important;
    min-width: 123px;
}

.blue-theme .form-group > label,
.blue-theme .form-group .control-label {
    font-size: 14px;
    color: #fff;
    text-transform: none;
}

/*.blue-theme span {
    color: #fff;
}*/
.blue-theme .dropdown .md.md-more-vert {
    color: #fff !important;
}

.blue-theme .dropdown-menu > li > a:hover, .dropdown-menu > li > a:focus {
    text-decoration: none;
    color: #252727;
    background-color: #252727;
}

.blue-theme .uploaded_files {
    background: #252727;
    border: 1px solid #252727;
    box-shadow: 0px 0px 9px rgba(0, 0, 0, 0.08);
    border-radius: 5px;
    width: 100%;
    max-width: 350px;
    margin: 0 auto;
    position: absolute;
    z-index: 999;
    display: none;
    right: 0px;
    top: 39px;
    color: #fff
}

.blue-theme .btn-default {
    color: #fff;
    color: #fff !important;
    background-color: #000;
    border-color: #000;
}

.blue-theme button.ColVis_Button, .blue-theme ul.ColVis_collection li {
    background: #000 !important;
}

.blue-theme .percent-symbol {
    padding: 6px 10px;
    background-color: #000;
    border-radius: 0px 4px 4px 4px;
    border: solid 1px #000;
}

.blue-theme .nav.nav-tabs.nav-overall > li.active > a, .brown-theme .nav.nav-tabs.nav-overall > li.active > a:hover, .brown-theme .nav.nav-tabs.nav-overall > li.active > a:focus {
    color: #fff !important;
    border-color: #B57423 !important;
    background: #fff;
    border-bottom: 40px solid #B57423 !important;
    border-left: 14px solid transparent !important;
    border-right: 14px solid transparent !important;
    display: block;
    line-height: 39px !important;
    align-items: center;
    height: 37px;
    border-top-left-radius: 25px !important;
    border-top-right-radius: 25px;
    justify-content: center;
    font-size: 14px;
    background-color: transparent !important;
    /*    box-shadow: 0px 20px 10px -15px #a09f9f;*/
    margin-left: 0px;
}

.blue-theme .nav.nav-tabs.nav-overall > li a {
    color: #585858 !important;
    border-color: #ECECEC !important;
    background: #fff;
    border-bottom: 40px solid #ECECEC !important;
    border-left: 14px solid transparent !important;
    border-right: 14px solid transparent !important;
    display: block;
    line-height: 39px !important;
    align-items: center;
    height: 37px;
    border-top-left-radius: 25px !important;
    border-top-right-radius: 25px;
    justify-content: center;
    font-size: 14px;
    background-color: transparent !important;
    /*    box-shadow: 0px 20px 10px -15px #a09f9f;*/
}

.blue-theme .card.card-blue .card-head {
    margin-top: 3px;
}

.status-approved {
    background-color: #cbfbdd;
    color: #17C05B !important;
    padding: 4px 7px;
    font-size: 15px;
    border-radius: 3px 3px;
    font-weight: 500;
    padding-top: 2px;
    margin-left: 5px;
}

.status-rework {
    background-color: #a9a9152e;
    color: #a9a915 !important;
    padding: 4px 7px;
    font-size: 15px;
    border-radius: 3px 3px;
    font-weight: 500;
    padding-top: 2px;
    margin-left: 5px;
    /*
    color: #a9a915;
    font-weight: bold;
    margin-left: 5px;*/
}

.status-rejected {
    background-color: #f24b442e;
    color: #F24B44 !important;
    padding: 4px 7px;
    font-size: 15px;
    border-radius: 3px 3px;
    font-weight: 500;
    padding-top: 2px;
    margin-left: 5px;
    /*
    color: #F24B44 !important;
    font-weight: bold;
    margin-left: 5px;*/
}

.status-ready-for-review {
    background-color: #df8b0626;
    color: #DF8B06 !important;
    padding: 4px 7px;
    font-size: 15px;
    border-radius: 3px 3px;
    font-weight: 500;
    padding-top: 2px;
    margin-left: 5px;
    /*color: #DF8B06 !important;
    font-weight: bold;*/
}

.blue-theme .select2-container--default .select2-selection--multiple .select2-selection__choice {
    background-color: #000;
    border: 1px solid #e7e7e7 !important;
    margin-top: 3px;
}

.commonContainer .row:nth-child(even) {
    background-color: #FAF8F8; /* Light grey background color */
}

.blue-theme .commonContainer .row:nth-child(even) {
    background-color: #000000; /* Light grey background color */
}

.blue-theme .revisions .card-head {
    background: #343434 !important;
    padding-left: 10px;
    padding-right: 10px;
}

.parent-row.bordered td {
    border-top: solid #B57423 1px;
}

.child-row.bordered td:last-child {
    border-bottom: solid #B57423 1px;
    border-top: solid #B57423 0px;
    padding-right: 122px;
    padding-left: 50px;
}

.child-row.bordered tbody td:last-child {
    border-bottom: solid #B57423 0px;
}

.parent-row .expand_button {
    width: 10px;
}
/*.table.table-bordered.table-sm thead tr, td {
    background-color: #ffffff;
}*/

.table.table-bordered.table-sm thead tr {
    border: 1px solid #F4F4F4
}

.table.table-bordered.table-sm thead th {
    border: 1px solid #F4F4F4;
    border: 1px solid #F4F4F4;
    font-weight: 700 !important;
    font-size: 13px;
}

.table.table-bordered.table-sm tbody td {
    border: 1px solid #F4F4F4 !important;
}

.monthlytargetbreakup.monthlytargetbreakup_table .col-sm-2 {
    width: 202px;
    padding-bottom: 10px;
}

.blue-theme #monthlytargetbreakupContainer .row.dependheader {
    background-color: #000 !important;
    color: #fff !important;
    padding: 10px !important;
    box-shadow: 0px 10px 20px 5px rgba(0, 0, 0, 0.04);
    margin: 10px 0px !important;
}

.blue-theme #monthlytargetbreakupContainer .monthlytargetbreakup button i {
    color: #fff;
}

.blue-theme .table.table-bordered.table-sm thead tr, .blue-theme td {
    background-color: #000;
}

#partcomponentdetailsContainer .partcomponentdetails .col-sm-2 {
    width: 275px !important;
}

.list_card_section .form-group .grfileuploadfilebtn {
    padding-left: 10px;
}

#itemdetailsContainer .itemdetails .col-sm-2 {
    width: 275px !important;
}

.form-group select[multiple] + .select2-container .select2-selection--multiple {
    height: 36px;
    min-height: 37px !important;
    max-height: 10px !important;
    overflow-y: auto;
}

.blue-theme input:checked + .slider {
    background-color: rgba(181, 116, 35, 1) !important;
}

.partname_craftmyapp_container .form-group {
    display: flex;
    flex-direction: column;
}

.postalcode_craftmyapp_container .form-group {
    display: flex;
    flex-direction: column;
}

.digitalpaymentid_craftmyapp_container .form-group {
    display: flex;
    flex-direction: column;
}

.bankname_craftmyapp_container .form-group {
    display: flex;
    flex-direction: column;
}

.bankaccountname_craftmyapp_container .form-group {
    display: flex;
    flex-direction: column;
}

.bankaccountnumber_craftmyapp_container .form-group {
    display: flex;
    flex-direction: column;
}

.ifscroutingnumber_craftmyapp_container .form-group {
    display: flex;
    flex-direction: column;
}

#partdetailsContainer .partdetails .col-sm-2 {
    width: 280px !important;
}

.rfid_craftmyapp_container .form-group {
    display: flex;
    flex-direction: column;
}

.scertificationname_craftmyapp_container .form-group {
    display: flex;
    flex-direction: column;
}

.licenseissuedby_craftmyapp_container .form-group {
    display: flex;
    flex-direction: column;
}

.Add_equipment_wrapper
.form-group {
    display: flex;
    flex-direction: column;
}

.dashboard_wrapper .col-sm-12 {
    /*    padding: 0px*/
}

.dashboard_wrapper .card-head {
    background-color: transparent !important;
}

.dashboard_wrapper .perform_nav.nav.nav-tabs {
    margin-left: 0px !important;
}

.dashboard_wrapper .cma_section_band.list_card_section.list_card_tablet
.perform_nav.nav-tabs > li.active > a {
    color: #B57423 !important;
    border-color: #B57423 !important;
    border-bottom: 2px solid #B57423 !important;
    border-left: 0px solid transparent !important;
    border-right: 0px solid transparent !important;
    border-radius: 0px !important;
    border-top-right-radius: 0px;
    line-height: 27px !important;
}

.dashboard_wrapper .cma_section_band.list_card_section.list_card_tablet .perform_nav.nav-tabs > li a {
    background: #7B7B7B;
    color: #7B7B7B !important;
    border-color: #e7e5e4 !important;
    background: #fff;
    border-bottom: 0px solid #e7e5e4 !important;
    border-left: 0px solid transparent !important;
    border-right: 0px solid transparent !important;
    display: block;
    line-height: 39px !important;
    align-items: center;
    height: 37px;
    border-top-left-radius: 0px !important;
    border-top-right-radius: 0px;
    justify-content: center;
    font-size: 14px;
    line-height: 34px !important;
}

.dashboard_wrapper .cma_section_band.list_card_section.list_card_tablet .nav.nav-tabs .active .target-icon {
    filter: sepia(1) saturate(5) hue-rotate(10deg) brightness(0.6) contrast(1.2) !important;
    transition: filter 0.3s ease !important;
}

.perform_nav li:nth-child(1) {
    z-index: 999;
    background-color: transparent !important;
}

.perform_nav li:nth-child(2) {
    margin-left: -12px;
    z-index: 999;
}

.perform_nav li:nth-child(3) {
    margin-left: -12px;
    z-index: 999;
}

.perform_nav li:nth-child(4) {
    margin-left: -12px;
    z-index: 999;
}

.perform_nav li:nth-child(5) {
    margin-left: -12px;
    z-index: 999;
}

.perform_nav li:nth-child(6) {
    margin-left: -12px;
    z-index: 999;
}

.perform_nav li:nth-child(7) {
    margin-left: -12px;
    z-index: 999;
}

.perform_nav li:nth-child(8) {
    margin-right: 22px;
    z-index: 999;
}

/* This tab strip has more than 8 tabs, so tab 8 (Performance) is no longer last -
   keep it overlapping like the rest instead of inheriting the old last-tab trailing margin */
.perform_nav.perform_nav_new li:nth-child(8) {
    margin-left: -12px;
    margin-right: 0;
    z-index: 999;
}

.perform_nav.perform_nav_new li:nth-child(9),
.perform_nav.perform_nav_new li:nth-child(10) {
    margin-left: -12px;
    z-index: 999;
}

.brown-theme .perform_nav.nav-tabs > li a {
    background-color: transparent !important;
}

.brown-theme .perform_nav.nav-tabs > li.active > a {
    background-color: transparent !important;
}

.perform_nav li.active {
    z-index: 1004;
}

.brown-theme .dashboard_wrapper .nav.nav-tabs.nav-b.perform_nav img {
    top: 3px;
}

.swal2-container.swal2-shown {
    z-index: 99999999999 !important;
}

.commonContainer .nav.nav-tabs.tab-nav-right.perform_nav li.active {
    z-index: 999;
}

.brown-theme .nav.nav-tabs.nav-overall.perform_nav {
    background-color: #fff;
    box-shadow: 3px 0px 10px 0px #0000001A;
}

.commonContainer .nav li:nth-child(2) {
    z-index: 9;
}

.card-line {
    box-shadow: rgba(0, 0, 0, 0.02) 0px 1px 3px 0px, rgba(27, 31, 35, 0.15) 0px 0px 0px 1px;
    margin-top: 8px;
    border-radius: 7px;
    padding: 5px 10px;
}

.marginbutton {
    margin-left: 0px 10px;
}

.card-button {
    display: block;
    background-color: transparent;
    border: solid 1px #B57423;
    color: #B57423;
    border-radius: 6px;
}

    .card-button:hover {
        display: block !important;
        background-color: transparent !important;
        border: solid 1px #B57423 !important;
        color: #B57423 !important;
        border-radius: 6px !important;
    }

.daily-plan-tab-card.perform_nav.nav-tabs > li.active > a {
    color: #B57423 !important;
    border-color: #B57423 !important;
    background: #fff;
    border-bottom: 3px solid #B57423 !important;
    border-left: 0px solid transparent !important;
    border-right: 0px solid transparent !important;
    display: block;
    line-height: 39px !important;
    align-items: center;
    height: 37px;
    border-top-left-radius: 0px !important;
    border-top-right-radius: 0px;
    justify-content: center;
    font-size: 14px;
    border-radius: 0px !important;
}

.daily-plan-tab-card.perform_nav.nav-tabs > li a {
    color: #585858 !important;
    border-color: transparent !important;
    background: #fff;
    border-bottom: 3px solid transparent !important;
    border-left: 0px solid transparent !important;
    border-right: 0px solid transparent !important;
    display: block;
    line-height: 39px !important;
    align-items: center;
    height: 37px;
    border-top-left-radius: 0px !important;
    border-top-right-radius: 0px;
    justify-content: center;
    font-size: 14px;
    border-radius: 0px !important;
}

.overall-dashboard {
    width: 294px;
    padding: 0px 30px;
}

.Button-allign {
    margin-inline-start: 251px;
    margin-bottom: -32px;
}

.login button {
    border: none !important;
    background-color: transparent !important;
}

    .login button:hover {
        border: none !important;
        background-color: transparent !important;
    }

.vehicle-container button {
    margin-left: auto;
}

.allocationname_craftmyapp_container .form-group {
    display: flex;
    flex-direction: column;
}

#assetdetailsContainer .row.assetcomponentdetails.dependentContainerBorder.margin-bottom {
    margin-bottom: 6px !important;
}

#cma_printableArea {
    padding-top: 0px !important;
}

.Add_Location_wrapper .form-group {
    display: flex;
    flex-direction: column;
}

.profileicon .login_name h4 {
    color: #202020 !important;
    /* font-family: Plus Jakarta Sans; */
    font-weight: 800;
    font-size: 16px;
    line-height: 100%;
    letter-spacing: 0%;
}

.profileicon .login_name span {
    font-family: Plus Jakarta Sans;
    font-weight: 500;
    font-size: 12px !important;
    line-height: 2;
    color: #7B7B7B !important;
}

.profileicon li a {
    font-family: Plus Jakarta Sans;
    font-weight: 700;
    font-size: 14px;
    line-height: 100%;
    letter-spacing: 0%;
    color: #B57423 !important;
}

.mainSideMenu .profileicon .menu-dropdown {
    background: #fff !important;
}

.gui-controls > li.open.profileicon .menu-dropdown ul li a {
    color: #7B7B7B !important;
}

.profileicon .menu-dropdown .login_name {
    border-bottom: solid 1px #E7EAEF !important;
}

.profileicon .menu-dropdown {
    padding-right: 0px !important;
}

.production_details .nav.nav-tabs.nav-overall li:nth-child(1) {
    z-index: 9999;
    background-color: transparent !important;
}

.production_details .nav.nav-tabs.nav-overall li:nth-child(2) {
    margin-left: -18px;
    z-index: 989;
}

.production_details .nav.nav-tabs.nav-overall li:nth-child(3) {
    margin-left: -18px;
    z-index: 999;
}

.production_details .nav.nav-tabs.nav-overall li:nth-child(4) {
    margin-left: -18px;
    z-index: 999;
}

.production_details .nav.nav-tabs.nav-overall li:nth-child(5) {
    margin-left: -18px;
    z-index: 999;
}

.production_details .nav.nav-tabs.nav-overall li.active {
    z-index: 999 !important;
}

.sectorname_craftmyapp_container .form-group {
    display: flex;
    flex-direction: column;
}

.spdumplocation_craftmyapp_container .form-group span.select2 .selection .select2-selection .select2-selection__rendered {
    line-height: 13px !important;
}

.spdumplocation_craftmyapp_container .select2-container--default .select2-selection--multiple .select2-selection__choice {
    padding: 2px 9px !important;
}

.spdumplocation_craftmyapp_container .select2-container--default .select2-selection--multiple .select2-selection__choice__display {
    padding-left: 12px !important;
    padding-right: 7px !important;
    font-size: 10px !important;
}

.siassetnumber_craftmyapp_container .form-group span.select2 .selection .select2-selection .select2-selection__rendered {
    line-height: 13px !important;
}

.siassetnumber_craftmyapp_container .select2-container--default .select2-selection--multiple .select2-selection__choice {
    padding: 2px 9px !important;
}

.siassetnumber_craftmyapp_container .select2-container--default .select2-selection--multiple .select2-selection__choice__display {
    padding-left: 12px !important;
    padding-right: 7px !important;
    font-size: 10px !important;
}

.table-responsive-lg table tbody tr:nth-child(even) {
    background-color: #FAF8F8 !important;
}

a.help-block-orange {
    background: #b57423 !important;
    margin-bottom: 10px;
    width: 30px
}

body.brown-theme .help-block-orange {
    background: #b57423 !important;
    margin-bottom: 10px;
}

.card.tab-card .card-head {
    margin-bottom: 10px;
    padding: 10px 10px;
}

.blue-theme .has-dropdown.profileicon .menu-dropdown {
    background: #1e1e1e !important;
    color: #fff !important;
    padding: 10px;
    border-radius: 10px;
}

.blue-theme .profileicon .login_name h4 {
    color: #fff !important;
    /* font-family: Plus Jakarta Sans; */
    font-weight: 800;
    font-size: 16px;
    line-height: 100%;
    letter-spacing: 0%;
}

.blue-theme .profileicon .login_name span {
    color: #fff !important;
}

.col-sm-12 .review-common-title {
    margin: 10px 0px !important;
    display: flex;
    gap: 5px;
}

    .col-sm-12 .review-common-title label {
        margin: 0px !important;
        line-height: 1.4;
    }

.review-common-title span {
    line-height: 1.5;
    color: #ffc700;
}

.dashbarddarkmode {
    margin: 0px 10px;
}

.blue-theme .quantity {
    font-size: 12px;
    color: #fff;
    margin: 0px !important;
}

.blue-theme .filter-item {
    border-right: 1px solid rgb(255 255 255 / 80%) /* Vertical line */;
}

.filter-bar .filter-button {
    padding-right: 10px;
    border-right: 1px solid rgb(96 91 91 / 22%) /* Vertical line */;
}

.blue-theme .filter-bar .filter-button {
    padding-right: 10px;
    border-right: 1px solid rgb(255 255 255 / 80%) /* Vertical line */;
}

.filter_card .filter-button {
    padding-right: 10px;
    border-right: 1px solid rgb(96 91 91 / 22%) /* Vertical line */;
}

.blue-theme .filter_card .filter-button {
    padding-right: 10px;
    border-right: 1px solid rgb(255 255 255 / 80%) /* Vertical line */;
}

.header_text {
    font-family: Plus Jakarta Sans;
    font-weight: 600;
    font-size: 16px;
    line-height: 100%;
    color: #B57423
}

#doorPopup input {
    background-color: transparent !important;
    border: none;
}

.brown-theme .page-header-box .btn-icon-toggle .fa, .brown-theme .btn-icon-toggle .md, .brown-theme .btn-icon-toggle .glyphicon {
    color: #838185;
}

.assignment-container .dropdown-menu > li > a {
    padding: 9px 10px;
    cursor: pointer;
}

.assign-lst ul li.active {
    background: #B52B230D;
    border-left: 3px solid #B52B23;
}

.modal-header .close {
    opacity: 1 !important;
}

}

.col-md-36 {
    width: 36%;
}

#mappedList, #unmappedList {
    height: 69vh;
    overflow-y: auto;
}


.data_text {
    color: #7B7B7B;
    margin-left: 17px !important;
    padding: 12px 0px !important;
    gap: 12px !important;
    display: flex !important;
    flex-direction: column !important;
}

.text-black {
    color: #141414 !important;
}

.profile_popup::before {
    content: "";
    position: absolute;
    left: -20px;
    top: 59px;
    width: 0;
    height: 0;
    border-top: 20px solid transparent;
    border-bottom: 20px solid transparent;
    border-right: 20px solid #ffffff;
}

.profile_popup {
    position: absolute;
    left: 50px;
    /*    top: 0;*/
    background: white;
    border-radius: 12px;
    padding: 12px;
    box-shadow: 0 2px 10px rgba(0,0,0,0.2);
    width: 260px;
    z-index: 999;
    min-height: 210px;
    max-height: 210px;
}

#breakdownPopup .modal-content {
    width: 100%;
}

#reassigndoorPopup.modal {
    display: flex !important;
    justify-content: center !important;
    align-items: center !important;
}

#reassignpopupdiv.modal {
    display: flex !important;
    justify-content: center !important;
    align-items: center !important;
}

#breakdownPopup.modal {
    display: flex !important;
    justify-content: center !important;
    align-items: center !important;
}
/*
.deviationtabcard {
    height: 150px;
}*/

#tab-deviation-content .card {
    background-color: #fff !important;
}

#tab-deviation-content .card-body {
    background-color: #fff !important;
}

.Add_Allocation .table.dataTable > tbody > tr > td.dt-center:hover svg circle {
    fill: #03743A;
}

.Add_Allocation .table.dataTable > tbody > tr > td.dt-center:hover svg path {
    fill: #ffffff;
}

.Add_Map_Upload .nav-item .nav-link.active {
    height: 57px;
    border-bottom: solid 3px #B57423 !important;
    border-left: 0px solid transparent !important;
    border-right: 0px solid transparent !important;
    opacity: 1;
    color: #B57423 !important;
    font-family: Plus Jakarta Sans;
    font-weight: 600;
    font-size: 14px;
    margin: 0px 0px
}

#mappedList .list-group-item {
    background-color: #F4F5F9;
    margin: 10px 1px;
    border-radius: 8px;
    border: none;
    text-align: center;
    color: #313534;
    font-weight: 600;
}

.gap-4 {
    gap: 12px;
}

.add_status {
    background-color: #E4F0E8;
    color: #23B52B;
    font-family: Plus Jakarta Sans;
    font-weight: 600;
    font-size: 12px;
    padding: 10px 10px;
    border-radius: 5px;
}

.btnMap {
    background-color: #B57423 !important;
    border: solid #B57423 !important;
    padding: 6px 10px !important;
}

    .btnMap:hover {
        background-color: #B57423 !important;
        border: solid #B57423 !important;
        padding: 6px 10px !important;
    }

    .btnMap i {
        margin: 0 !important;
    }

#unmappedListContainer select#dldump {
    width: 171px;
}

#unmappedListContainer .list-group-item {
    border-top-right-radius: 2px;
    border-top-left-radius: 2px;
    background-color: #F4F5F9;
    margin: 6px 10px;
    border-radius: 8px;
    border: none;
    text-align: center
}

#mapToggleControls .leaflet-bar button#btnPreview, #btnExisting, #btnOverlay {
    background-color: transparent !important;
    color: #7B7B7B;
    font-family: Plus Jakarta Sans;
    font-weight: 500;
    font-style: Medium;
    font-size: 14px;
    padding: 17px 10px;
    border: 0px;
}

#mapToggleControls .leaflet-bar button#btnPreview, #btnExisting, #btnOverlay {
    background-color: transparent !important;
    color: #7B7B7B;
    font-family: Plus Jakarta Sans;
    font-weight: 500;
    font-style: Medium;
    font-size: 14px;
    padding: 17px 10px;
    border: 0px;
}

    #mapToggleControls .leaflet-bar button#btnPreview.active, #btnExisting.active, #btnOverlay.active {
        background-color: transparent !important;
        color: #B57423;
        font-family: Plus Jakarta Sans;
        font-weight: 500;
        font-size: 14px;
        padding: 17px 10px;
        border-bottom: solid #B57423;
        border-radius: 0px !important;
        font-weight: 700;
        z-index: 9999999999;
        position: relative;
    }

    #mapToggleControls .leaflet-bar button#btnPreview.active, #btnExisting.active, #btnOverlay.active {
        background-color: transparent !important;
        color: #B57423;
        font-family: Plus Jakarta Sans;
        font-weight: 500;
        font-size: 14px;
        padding: 17px 10px;
        border-bottom: solid #B57423 !important;
        border-radius: 0px !important;
        font-weight: 700;
        z-index: 9999;
        position: relative;
    }

#mapToggleControls .leaflet-bar button.file_upload_btn {
    background-color: #B57423 !important;
    color: #fff;
    display: flex;
    align-items: center;
    gap: 6px;
    padding: 8px 8px;
    border: none !important;
    border-radius: 4px !important;
}

    #mapToggleControls .leaflet-bar button.file_upload_btn:hover {
        background-color: #B57423 !important;
        color: #fff;
        display: flex;
        align-items: center;
        gap: 6px;
        padding: 8px 8px;
        border: none !important;
        border-radius: 4px !important;
    }

#mapToggleControls .popup-overlay {
    display: none;
    position: absolute;
    bottom: 50px;
    right: 0;
    height: 100%;
    z-index: 99999;
}

#mapToggleControls .popup-content {
    background: white;
    width: 400px;
    margin: 78px auto;
    border-radius: 8px;
    position: relative;
    left: 0;
    right: 0;
    box-shadow: rgba(100, 100, 111, 0.2) 0px 7px 29px 0px;
}

#mapToggleControls .upload-area {
    border: 2px dashed #C8C8C8;
    padding: 20px;
    text-align: center;
    color: #b97d2f;
    margin-top: 20px;
    border-radius: 10px;
}

    #mapToggleControls .upload-area button {
        background-color: #b97d2f !important;
        color: white;
        border: none;
        padding: 8px 16px;
        margin-top: 10px;
        cursor: pointer;
        border-radius: 4px !important;
    }

#mapToggleControls #bulkUploadPopup .location {
    display: flex;
    align-items: start;
    flex-direction: column;
    background-color: #EEF1F3;
    border-radius: 10px;
    padding-top: 11px;
    padding-right: 16px;
    padding-bottom: 11px;
    padding-left: 16px;
}

#mapToggleControls button#closePopup {
    border: none !important;
    padding: 0;
    margin: 0;
}

#mapToggleControls #bulkUploadPopup .location select {
    border: none;
    background-color: transparent !important;
    width: 290px !important;
    color: #434343 !important;
    font-family: Plus Jakarta Sans;
    font-weight: 700 !important;
    font-size: 14px;
    padding: 6px 0px;
}

#mapToggleControls #bulkUploadPopup .upload-area p {
    padding-bottom: 0px !important;
    margin-bottom: 0px !important;
    color: #7B7B7B !important;
    font-weight: 500 !important;
    font-size: 14px;
}

.output-box {
    padding: 20px 16px;
    background-color: #F4F5F9;
    border-radius: 10px;
    gap: 20px;
    display: flex;
    align-content: center;
    flex-direction: column;
}

    .output-box .data {
        font-family: Plus Jakarta Sans;
        font-weight: 700;
        font-style: Bold;
        font-size: 15px;
        color: #434343
    }

    .output-box span {
        font-family: Plus Jakarta Sans;
        font-weight: 500;
        font-size: 14px;
        color: #7B7B7B
    }

#mapToggleControls button.btn-secondary.Cancel_btn {
    border: 1px solid #B57423 !important;
    margin-right: 10px;
}

#mapToggleControls button.cma_primary_button.draw_btn {
    background-color: #B57423 !important
}

.blue-theme #mapToggleControls .popup-content {
    color: #fff !important
}

.blue-theme #mapToggleControls #bulkUploadPopup .location select {
    color: #fff !important
}

.blue-theme .output-box {
    padding: 20px 50px;
    background-color: #000000;
    border-radius: 10px;
    gap: 20px;
    display: flex;
    align-content: center;
    flex-direction: column;
}

#mapToggleControls {
    padding: 2px 10px;
}

.card {
    box-shadow: unset;
    border: 1px solid #e6dfd5;
    border-radius: 10px !important;
}

.h-100 {
    height: 100%
}

.line-under-buttons {
    position: relative;
}

    .line-under-buttons::after {
        content: "";
        position: absolute;
        bottom: 10px;
        left: 0;
        width: 100%;
        height: 2px;
        background-color: #dddddd;
    }

#mainMap button {
    background-color: #ffffff !important;
}

    #mainMap button:hover {
        background-color: #ffffff !important;
    }

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


#bulkUploadPopup.popup-overlay {
    position: absolute;
    z-index: 999;
    right: 0;
    top: -10%;
}

.uploded_data {
    background-color: #F2F4F5;
    padding: 10px 10px;
    display: flex;
    align-items: center;
    gap: 10px;
    margin-bottom: 10px;
}

.successfile {
    line-height: 0;
}

#mapuploadshowFiles {
    color: #176800;
}

.Add_Map_Upload .nav-tabs > li > a {
    margin-right: 2px;
    line-height: 1.846153846;
    border: none;
    border-bottom: 2px solid transparent;
    border-radius: 0px;
    opacity: 0.55;
    font-weight: 500;
    text-transform: capitalize;
    padding: 0px 11px;
    line-height: 48px !important;
}


.feature-name .form-control.feature-name-select {
    display: inline-block;
    width: 190px;
}

.uploadsize {
    width: 75px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    display: block;
}

.revertbutton {
    color: #F25767;
    font-size: 20px;
    margin: 0;
}

#mapToggleControls #openPopupBtn {
    height: 38px;
    display: flex;
    align-items: center;
    gap: 4px;
}

.mine_layout .select2-container--default .select2-selection--single {
    background-color: transparent !important;
    border: none !important;
    width: 278px !important;
    color: #434343 !important;
    font-family: Plus Jakarta Sans;
    font-weight: 700 !important;
    font-size: 14px;
    margin-top: 8px !important;
}

.mine_layout {
    margin-top: 8px !important;
}
/*#locationIconBtn.btn.btn-sm {
    background-color: #ffffff !important;
    border-color: #b57423;
    color: white;
    position: absolute;
    bottom: 8%;
    height: 34px;
    width: 41px;
    z-index: 1000;
    margin-left: 10px;
}*/

/*    #locationIconBtn.btn.btn-sm.moved-to-bottom {
        background-color: #ffffff !important;
        border-color: #b57423;
        color: white;
        position: absolute;
        bottom: 40%;
        right: 870px;
        height: 34px;
        width: 41px;
        z-index: 1000;
    }*/

.map-container {
    position: relative; /* make the map container the reference */
}

.fixed-arrow {
    position: absolute;
    bottom: 20px;
    left: 20px;
    z-index: 9999;
    background: #fff;
    border-radius: 20%;
    padding: 8px;
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.3);
    cursor: pointer;
    border: none
}

button#locationIconBtn.fixed-arrow:hover {
    position: absolute;
    bottom: 20px;
    left: 20px;
    z-index: 9999;
    background: #fff !important;
    border-radius: 20%;
    padding: 8px;
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.3);
    cursor: pointer;
    border: none
}

.Add_Map_Upload.card {
    padding: 0px 10px
}

.Add_Map_Upload .nav-tabs {
    border-bottom: 1px solid #dddddd !important;
}

.Add_Map_Upload .nav-item .nav-link {
    height: 53px;
    border-bottom: solid 0px transparent !important;
    border-left: 0px solid transparent !important;
    border-right: 0px solid transparent !important;
    opacity: 1;
    color: #7B7B7B !important;
    font-family: Plus Jakarta Sans;
    font-weight: 600;
    font-size: 14px;
    margin: 0px 0px
}

.arrow {
    position: absolute;
    top: -15px; /* Adjust as needed */
    left: 90%;
    transform: translateX(-50%);
    width: 0;
    height: 0;
    border-left: 14px solid transparent;
    border-right: 14px solid transparent;
    border-bottom: 16px solid #c1bcbc; /* Arrow color */
}

button.close {
    color: #000 !important;
    opacity: 1
}

.close {
    color: #000000;
    opacity: 1;
}

.BulkUpload_container {
    padding: 20px;
}

.BulkUpload_head {
    border-bottom: solid 1px #f4f4f4;
    padding: 10px 10px;
}

#mainMap {
    height: 620px;
    border: 0px solid #ccc;
    border-radius: 4px;
    position: relative;
    width: 100%;
    margin-top: 10px;
}

#mappedListContainer .feature-label {
    width: 130px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.btn.disabled,
.btn[disabled],
fieldset[disabled] .btn {
    border-color: transparent;
    background: transparent;
    color: #313534;
    opacity: 0.5;
}

@media (max-width: 1100px) {
    .mapupload_craftmyapp_container.mapSection .col-md-3 {
        width: 100% !important;
    }

    .mapupload_craftmyapp_container.mapSection .col-md-9 {
        width: 100% !important;
    }
}

@media (max-width: 480px) {
    .mapupload_craftmyapp_container.mapSection .col-md-9 {
        width: 100% !important;
    }

    .mapupload_craftmyapp_container.mapSection .col-md-9 {
        width: 100% !important;
    }
}

#mapToggleControls .upload-area button:disabled {
    background-color: #b97d2f47 !important;
    color: white;
    border: none;
    padding: 8px 16px;
    margin-top: 10px;
    cursor: not-allowed; /* Change cursor to 'not-allowed' to indicate disabled state */
    border-radius: 4px !important;
}

.list-group-item a.feature-eye {
    line-height: 0
}

.btn.disabled {
    background-color: #d3d3d3; /* Light gray background */
    border-color: #d3d3d3; /* Light gray border */
    color: #a3a3a3; /* Light gray text */
    cursor: not-allowed; /* Shows the not-allowed cursor */
}

.quiz-container {
    max-width: 1000px;
    margin: auto;
    background: #fff;
    border-radius: 8px;
    box-shadow: 0 2px 6px rgba(0,0,0,0.1);
    padding: 20px;
}

.section-header {
    background: #fce8d5;
    padding: 10px;
    border-radius: 6px;
    font-weight: bold;
    margin-bottom: 20px;
}

.question {
    border: 1px solid #eee;
    border-radius: 8px;
    padding: 15px;
    margin-bottom: 15px;
    background: #fff;
}

.upload-btn {
    display: flex;
    align-items: center;
    gap: 6px;
}

    .upload-btn input {
        display: none;
    }

.upload-label {
    cursor: pointer;
    background: #f3f3f3;
    padding: 6px 10px;
    border-radius: 5px;
    border: 1px solid #ddd;
    display: flex;
    align-items: center;
    gap: 5px;
}

.submit-btn {
    background: #b97a2f;
    border: none;
    color: #fff;
    padding: 10px 30px;
    border-radius: 6px;
}

.qa_card.row {
    background-color: #ffffff;
    padding-top: 15px !important;
    padding-bottom: 10px !important;
    box-shadow: rgba(149, 157, 165, 0.2) 0px 8px 24px;
    border-radius: 4px;
    padding: 10px 10px 0px 10px !important;
}

.questions_card .card {
    background-color: #FCFCFC !important;
    box-shadow: none;
    border: none;
    padding: 0;
}

.questions_card .card-head {
    background-color: #fff !important;
    box-shadow: rgba(149, 157, 165, 0.2) 0px 8px 24px;
    padding: 0px 10px;
    border-radius: 4px !important;
}

.questions_card label {
    font-weight: 800;
    padding-bottom: 10px
}

.questions_card textarea {
    height: 50px;
    resize: vertical;
}


.radio-styled:not(ie8) input:checked ~ span:before {
    border-color: #c37336 !important;
}

.radio-styled:not(ie8) input ~ span:after {
    background-color: #b57423 !important;
}

.yesornot_question_style textarea {
    border: none;
    border-bottom-style: none !important;
    background-color: transparent !important;
    padding-top: 0px !important;
    margin: 0px;
}

.brown-theme .card-block yesornot_question_style .form-group input, .card-block .yesornot_question_style .form-group textarea {
    background: transparent !important;
    /*    padding: 0;
    padding-left: 0px;*/
}

.yesornot_question_style .form-group {
    margin: 0px !important;
}

.dependentContainerBorder.yesornot_question_style div:nth-child(n+1) label[for="answer"] {
    display: none !important;
}

.dependentContainerBorder.yesornot_question_style div:nth-child(n+1) label[for="question"] {
    display: none !important;
}

.yesornot_question_style .checkbox-styled:not(ie8) input ~ span:before, .radio-styled:not(ie8) input ~ span:before {
    border-radius: 16px;
    border-color: rgba(0, 0, 0, 0.54);
}

.yesornot_question_style .detele-common-icon {
    display: none
}

.yesornot_question_style.qa_card.row {
    padding: 10px 10px 10px 10px !important;
}

.list-group-item text-muted {
    text-align: center;
}

.yesornot_question_style select, .yesornot_question_style .col-sm-10:nth-of-type(3) input {
    border: none;
    border-bottom-style: none !important;
}

.yesornot_question_style select, .yesornot_question_style .col-sm-10:nth-of-type(2) input {
    border: none;
    border-bottom-style: none !important;
}


.input-group .input-group-addon {
    border-color: #e7e7e7 !important;
}

.permittedcapacity_craftmyapp_container .form-group, .upgradefactor_craftmyapp_container .form-group, .burden_craftmyapp_container .form-group, .spacing_craftmyapp_container .form-group, .depth_craftmyapp_container .form-group {
    display: flex;
    flex-direction: column;
}

.percent-symbol {
    border: solid 1px #e7e7e7 !important;
    color: #b57423;
}

#rejectedsection.row {
    background-color: #fff;
    box-shadow: 0px 10px 20px 5px #0000000A;
    margin: 0px 13px;
    margin-top: 10px;
}

.questions_card .card-head header {
    color: #b57423 !important;
}

.page-header-box h1 {
    font-size: clamp(16px,0.9vw,23px) !important;
}

@media (max-width: 768px) {
    .page-header-box h1 {
        margin-left: 0px !important;
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
        display: block !important;
    }
}

.yesornot_question_style select {
    appearance: none;
    -webkit-appearance: none;
    -moz-appearance: none;
    background-color: white;
    padding: 10px;
    font-size: 16px;
    outline: none;
}

.templatename_craftmyapp_container .form-group {
    display: flex;
    flex-direction: column;
}

.checklistitems_craftmyapp_container .yesornot_question_style input {
    border: none
}

.blue-theme .questions_card .card {
    background-color: #1e1e1e !important;
    box-shadow: none;
    border: none;
    padding: 0;
}

.blue-theme .questions_card .card-head {
    background-color: #1e1e1e !important;
    box-shadow: rgba(149, 157, 165, 0.2) 0px 8px 24px;
    padding: 0px 10px;
    border-radius: 4px !important;
}

.blue-theme .qa_card.row {
    background-color: #1e1e1e;
    padding-top: 15px !important;
    padding-bottom: 10px !important;
    box-shadow: rgba(149, 157, 165, 0.2) 0px 8px 24px;
    border-radius: 4px;
    padding: 10px 10px 0px 10px !important;
}

.blue-theme .qa_card label {
    color: #fff
}

.blue-theme .yesornot_question_style .checkbox-styled:not(ie8) input ~ span:before, .blue-theme .radio-styled:not(ie8) input ~ span:before {
    border-radius: 16px;
    border-color: rgb(255 255 255);
}

.blue-theme .page-header-box h1 {
    color: #fff !important;
}

.Add_Map_Upload .btnEdit {
    line-height: 0px
}

#unmappedListContainer .list-group-item.text-muted {
    color: #313534;
    font-weight: 600;
}

.Add_Map_Upload .btnEdit svg path {
    stroke: #1F3D83;
}

textarea {
    resize: vertical; /* allows only vertical resize */
}

.equipment-details {
    width: 400px;
    /* box-shadow: rgba(100, 100, 111, 0.2) 0px 7px 29px 0px; */
}

    .equipment-details h1 {
        margin: 0;
        color: #c37336;
        padding: 0px 10px;
    }

    .equipment-details .equipment-card {
        margin-bottom: 8px;
        margin-top: 6px;
        padding: 0px 0px;
        border: solid 1px #00000012;
        padding: 8px 0px;
        border-radius: 10px;
    }
    /* Each equipment detail row */
    .equipment-details [class*="_craftmyapp_viewcontainer"] .form-group {
        display: grid;
        grid-template-columns: 1fr 20px 1fr; /* label | colon | value */
        align-items: center;
        padding: 6px 8px;
        border-bottom: 1px solid #eee;
    }

        .equipment-details [class*="_craftmyapp_viewcontainer"] .form-group label {
            font-weight: 600;
            color: #364153;
            text-align: left;
            white-space: nowrap;
        }

        /* Colon (center) */
        .equipment-details [class*="_craftmyapp_viewcontainer"] .form-group .colon {
            text-align: center;
            font-weight: 600;
            color: #f0f1f8;
        }

        /* Value (right side) */
        .equipment-details [class*="_craftmyapp_viewcontainer"] .form-group span[class^="auto_cls_"] {
            text-align: left;
            color: #000000;
            font-weight: 500;
            font-size: 14px;
        }

    .equipment-details [class*="_craftmyapp_viewcontainer"] {
        border-bottom: 1px solid #00000012;
    }
/* Optional: make it responsive for small screens */
@media (max-width: 576px) {
    .equipment-details [class*="_craftmyapp_viewcontainer"] .form-group {
        grid-template-columns: 1fr 20px 1fr;
    }

        .equipment-details [class*="_craftmyapp_viewcontainer"] .form-group span[class^="auto_cls_"] {
            text-align: left;
        }
}

.btn-group .btn.btn-success {
    background-color: #c37336;
    padding: 10px 20px;
    border: none;
    color: #fff;
    width: 100px;
}

.btn-group .btn.btn-danger {
    background-color: transparent;
    padding: 7px 20px;
    border: none;
    color: #c37336;
    border: solid #c37336 2px;
    width: 100px;
}

.btn-group .btn.btn-success:hover {
    background-color: #c37336 !important;
    padding: 10px 20px !important;
    border: none;
    color: #fff !important;
    cursor: pointer;
    width: 100px;
}

.btn-group .btn.btn-danger:hover {
    background-color: transparent !important;
    padding: 7px 20px;
    border: none;
    color: #c37336 !important;
    border: solid #c37336 2px !important;
    cursor: pointer;
    width: 100px;
}


.audit-question-container {
    padding: 10px 10px
}


.form-group label[for="auditQuestion"] {
    font-size: 18px;
    color: #4f4f4f;
    text-transform: none;
}

.audit-question-container {
    background-color: #b5742317;
    padding: 10px 10px !important;
    margin-bottom: 0px !important;
}

.audit-question-container {
    padding: 10px 10px
}

.col-sm-3.col-xs-12 .form-group {
    display: flex;
    flex-direction: column;
}

.questions_card .form-group {
    padding-bottom: 0px;
}

.hazardtype {
    margin-top: 6px !important;
}

    .hazardtype #hazardtype {
        display: flex;
        align-items: center;
        justify-content: space-between;
    }

.status_moreaction {
    flex-direction: row !important;
    align-items: center;
}

.border-0 {
    border: 0px !important;
}

.btm-lst.NodataAvailable {
    text-align: center;
    color: #b57423;
    margin-top: 30px;
    font-weight: bold !important;
    font-size: 16px;
}

.brown-theme .status_moreaction .btn-icon-toggle i {
    color: #b57423 !important;
    background-color: #f3f3f3;
    border-radius: 4px;
    margin-left: 10px;
}

.brown-theme .card .status_moreaction .btn-icon-toggle:hover {
    color: #b57423 !important;
    background-color: #ffffff;
}

#tblEquipmentBreakdown .odd td.dtfc-fixed-right {
    z-index: 1;
}

::-webkit-scrollbar {
    height: 5px;
    width: 4px;
}

::-webkit-scrollbar-thumb {
    background-color: #c0c0c0;
    border-radius: 10px;
}

::-webkit-scrollbar-track {
    background: #f1f1f1;
    border-radius: 10px;
}

::-webkit-scrollbar-thumb:hover {
    background-color: #c0c0c0;
}

#tblStaffWeeklyPlan_wrapper .dataTables_scrollBody {
    height: 50vh
}

label[for="speedbudgetbulkupload"] {
    background-color: #ffffff;
    border: none
}

#tblStaffAttendance_wrapper .automatonShowFilter {
    order: 1
}


header .page-header-box .vertical-tabs.theme-tab .tab {
    margin-left: 0px !important;
}

header .page-header-theme .vertical-tabs.theme-tab {
    padding: 0;
}

.page-header-menu-section .filter-button button {
    width: clamp(60px, 5vw, 90px);
    height: clamp(36px, 3vw, 41px);
}


span.shift-icon {
    background: rgb(55 44 46 / 10%);
    width: 46px;
    display: flex;
    height: 36px;
    border-radius: 36px;
    line-height: 36px;
    align-items: center;
    justify-content: center;
    margin-right: 0px;
}



.shift-main {
    display: flex;
}

.page-header-menu-section .select2-container--default .select2-selection--single .select2-selection__arrow b {
    background: url('images/arrow-down.png') no-repeat;
    border-width: unset;
    border-style: unset;
    background-repeat: repeat;
    position: relative;
    top: 5px;
    right: -100%;
    background-position: right center;
    width: 10px !important;
    height: 10px;
    display: flex;
    left: unset;
}

.brown-theme .page-header-menu-section .filter-item span {
    color: #7A431D !important;
    font-weight: 700 !important;
}

span.Primarytext-Primary {
    color: #7B7B7B !important;
    font-size: 12px;
    font-weight: 500;
}


/**#doorPopup .select2-container--default .select2-selection--single .select2-selection__arrow b {
    background: url(images/arrow-down-p.png);
    background-repeat: no-repeat;
    border-width: unset;
    border-style: unset;
    display: flex;
    height: 16px;
    width: 16px;
    position: absolute;
    bottom:100%;
    right: 0;
    left: unset;
    top:unset;

}
*/
#doorPopup .select2-container--default .select2-selection--single .select2-selection__arrow b {
    -webkit-appearance: none;
    opacity: 0;
}

#doorPopup .header_field .form-control {
    -webkit-appearance: none;
}

#doorPopup .form-group {
    position: relative;
}

    #doorPopup .form-group:after {
        /* background: url(images/arrow-down-p.png) !important;
    -webkit-appearance: none;
    display: flex;
    width: 100%;
    content: "";
    position: absolute;
    right: 10px;
    top: 60%;
    height: 16px;
    width: 16px;*/
    }

    #doorPopup .form-group .select2, #doorPopup .form-group select, .brown-theme #doorPopup .form-group select {
        background: url(images/arrow-down-p.png) !important;
        -webkit-appearance: none;
        background-repeat: no-repeat !important;
        background-position: right center !important;
        border: 0px !important;
    }

    .brown-theme #doorPopup .form-group span, #doorPopup .form-group span {
        width: 102%;
    }

#doorPopup .header_field .form-control svg {
    min-width: 24px;
    height: 24px;
    width: 24px;
}

#doorPopup .header_field .form-group {
    gap: 10px;
}

#doorPopup i.fa.fa-trash-o.text-danger {
    color: #9D9FA0;
}

#doorPopup .header_field .form-control {
    background: #EEF1F3 !important;
}

.assign-bottom-section .assign-lst ul li > div:nth-child(2) {
    min-width: 127px;
    max-width: 127px;
}

.assign-bottom-section .assign-lst ul li > div:nth-child(3) {
    min-width: 60px;
}

#doorPopup .header_field .form-group .select2-selection__rendered {
    padding-left: 0px;
}

.assign-lst ul li .btm-lst label {
    line-height: 17px;
}

    .assign-lst ul li .btm-lst label span {
        color: #2364b5;
        font-weight: 700;
    }

.dataTables_wrapper .table.dataTable > tbody > tr > td span {
    font-weight: normal !important;
}

.table.dataTable > tbody > tr > td.dt-center {
    background: #ffffff !important;
    box-shadow: unset !important;
}

.table.dataTable > tbody > tr:nth-child(even) > td.dt-center {
    background: #faf8f8 !important;
    box-shadow: unset !important;
}

.assignment-container .request-card-list {
    border-radius: 7px;
    background: rgb(255 255 255) !important; /* min-height: 281px; */ /* max-height: 455px; */
}

.dashboard_wrapper .vertical-tabs.theme-tab {
    padding: 0px !important;
}

    .dashboard_wrapper .vertical-tabs.theme-tab .tab {
        margin-left: 0px !important;
    }

.blue-theme span.shift-icon svg path {
    fill: #ee9d37 !important;
}

.blue-theme span.shift-icon {
    background: rgb(57 57 57) !important;
}

.blue-theme .request-card-list .info-card {
    background: #aeaeae !important;
}

.blue-theme .request-card-list .info-card {
    background: #aeaeae;
}

.blue-theme #tab-deviation-content .card {
    background: #1e1e1e !important;
}

.blue-theme #tab-deviation-content .card-body {
    background: #222 !important;
}

.blue-theme .nav-item .nav-link {
    border-bottom-color: #2d2b2b !important;
}

#doorPopup .select2.select2-container {
    z-index: 9;
}

.haulerdetailsub .haulerdetails > div .form-group label {
    opacity: 0;
    display: none;
}

.haulerdetailsub .haulerdetails:first-child > div .form-group label {
    opacity: 1;
    display: block;
    /* font-size: clamp(11px, 1vw, 5px); */
}

#doorPopup .haulerdetails .form-group {
    margin-bottom: 5px !important;
    margin-top: 2px !important;
}

    #doorPopup .haulerdetails .form-group.label-ass {
        margin-bottom: 0px !important;
        margin-top: 0px !important
    }

.haulerdetails_craftmyapp_container .btn-add-haulerdetails {
    margin-top: 0px;
}

.haulerdetailsub .haulerdetails:first-child > div.fx-label {
    /*    position: fixed;*/
    background-color: #FFF7F1;
    /* box-shadow: 2px 3px 4px rgb(155 144 144 / 20%) !important; */
    z-index: 99;
    padding: 0px;
    margin-top: -12px;
    opacity: 1;
    display: block;
    /* align-items: center; */
    /* display: flex; */
    /* justify-content: center; */
    height: 40px;
    width: 100%
}

.haulerdetailsub .haulerdetails > div.fx-label {
    opacity: 0;
    display: none;
}

.blue-theme #doorPopup .modal-content {
    background: #222;
}

#doorPopup .header_field .form-group svg {
    width: 30px;
}

.blue-theme #doorPopup .modal-content .header_field .form-group {
    background: #393939;
}

.blue-theme #doorPopup .modal-content {
    color: #fff;
}



.blue-theme .form-group span.select2 .selection .select2-selection {
    background: #393939 !important;
}

.blue-theme #doorPopup .form-group select.form-control {
    background: #393939 !important;
    border: 0;
}

.blue-theme #doorPopup .modal-title label {
    color: #fff !important;
}

.blue-theme .select2-container--default .select2-selection--single .select2-selection__placeholder {
    color: #a3a3a3 !important;
}

.blue-theme div#doorPopup .modal-header .close {
    color: #fff !important;
}

#doorPopup .header_field .select2-selection {
    border: 0px !important;
}

#doorPopup .header_field input.form-control {
    background: transparent !important;
}

span.ass-loader {
    margin-right: 6px;
    margin-top: 5px;
}



.breakdown_card {
    border-left: 0px solid #B52B23;
}

.breakdown_cardd {
    border-left: 3px solid #B52B23;
    background: #B52B230D;
}

.blue-theme .breakdown_card {
    border-left: 3px solid #c37336;
    background: #000000;
}

.blue-theme .breakdown_cardd {
    border-left: 3px solid #c37336;
    background: #000000;
}

tbody tr:first-child .profile_popup {
    margin-top: 72% !important;
}

    tbody tr:first-child .profile_popup::before {
        content: "";
        position: absolute;
        left: -16px;
        top: 1px;
        width: 0;
        height: 0;
        border-top: 20px solid transparent;
        border-bottom: 20px solid transparent;
        border-right: 20px solid #ffffff;
    }
/* When right is hidden */
.is-right-hidden .message_tab {
    display: none !important;
}

/* Make left take full width when right hidden */
.is-right-hidden .dashbord-message-left {
    width: 100% !important;
    flex: 1 1 100% !important;
}

#btnToggleRight {
    border: none;
    background-color: transparent;
    position: absolute;
    top: 60px;
}

.is-collapsed#btnToggleRight {
    right: -3px;
    top: 60px;
}

.operator-line .chip-right {
    background: #FCF1E9;
    padding: 4px 8px;
    border-radius: 12px;
    color: #262626;
    font-size: 12px;
}
/**/


.assignement-card .assignment-head {
    border-radius: 7px 7px 0px 0px;
    background: #E9F3F1 !important;
    border: 1px solid #98C9BD;
    border-bottom: 0px;
}


.text-name1 {
    color: #B57423 !important;
    background-color: #fff;
    padding: 6px 6px;
    border-radius: 10px;
    margin-right: 10px;
    display: flex;
    align-items: center;
    justify-content: center;
    height: 25px;
    font-size: 18px;
    width: 25px;
}

.text-name {
    background-color: #fff;
    padding: 6px 6px;
    border-radius: 10px;
    margin-right: 10px;
    display: flex;
    align-items: center;
    justify-content: center;
    height: 25px;
    color: #1F8A70;
    font-size: 18px;
    width: 25px;
}
/* stopped */

.label-text-name {
    color: #166250;
    font-family: Plus Jakarta Sans;
    font-weight: 600;
    font-size: 18px;
    line-height: 100%;
    letter-spacing: 0%;
}

.ass-cardbody {
    padding: 10px 19px;
}

assignement-card .dot {
    background: #166250;
}

.sts-text {
    color: #166250;
    font-family: Plus Jakarta Sans;
    font-weight: 800;
    font-size: 16px;
    line-height: 100%;
    letter-spacing: 4%;
    text-align: right;
    text-transform: uppercase;
    gap: 8px;
    margin-right: 10px;
}

.body-head {
    background: #FAFAFA;
    padding: 10px 18px;
    justify-content: space-between;
    display: flex;
    align-items: center;
    margin: 5px 5px;
    border: 1px solid #F3F3F3;
    border-radius: 10px;
}

.gap-2 {
    gap: 5px
}

.percentage_value {
    background: #2396691A;
    padding: 4px 4px;
    border-radius: 4px;
    color: #1F8A70
}

.traget_value {
    color: #434343;
    font-family: Plus Jakarta Sans;
    font-weight: 800;
    font-size: 13px;
    /* width: 100%; */
}

.name_dot {
    background-color: #235FB51A;
    border-radius: 40px;
    color: #235FB5;
    font-family: Plus Jakarta Sans;
    font-weight: 700;
    font-size: 14px;
    line-height: 100%;
    height: 38px;
    width: 38px;
    display: flex;
    align-items: center;
    justify-content: center
}

.name_dot1 {
    background-color: #B523AD1A;
    border-radius: 40px;
    color: #B523AD;
    font-family: Plus Jakarta Sans;
    font-weight: 700;
    font-size: 13px;
    line-height: 100%;
    letter-spacing: 0%;
    height: 38px;
    width: 38px;
    display: flex;
    align-items: center;
    justify-content: center
}

.ass-box {
    border: solid 1px #F4F4F4;
    padding: 11px 12px;
    border-radius: 10px;
    gap: 13px;
}

.body-secound-row {
    border-bottom: solid 1px #F0F0F0;
    padding-bottom: 14px;
    padding-top: 8px;
    margin: 0px 12px;
}

.body-secound-card {
    padding: 0px 23px;
    padding-top: 14px;
    padding-bottom: 14px;
}

.Primary-Secondary-text {
    font-family: Plus Jakarta Sans;
    background-color: #F5F5F5;
    padding: 2px 6px;
    border-radius: 10px;
    font-weight: 600;
    font-size: 12px;
    color: #818181;
    text-decoration: none;
    white-space: nowrap;
}

.body-card {
    border: 1px solid #ECECEC;
    display: flex;
    align-items: start;
    justify-content: space-between;
    /* padding: 4px 10px; */
    background-color: #FBFBFB;
    margin: 4px 0px;
    border-radius: 4px;
}

.speed-cal {
    font-family: Plus Jakarta Sans;
    font-weight: 800;
    font-style: Bold;
    font-size: 12px;
    text-align: center;
    color: rgba(31, 138, 112, 1) !important;
}

.value-text {
    color: #B57423;
}

.drag_drop_border {
    border: dashed 1px #E0E0E0;
    padding: 10px 10px;
    border-radius: 6px;
}

.expanded-metrics-grid {
    border: solid 1px #f4f4f4;
    padding: 10px 10px;
    border-radius: 8px;
}

.allocationsts {
    border: solid 1px #ECECEC;
    padding: 10px 10px;
    color: #1F8A70;
    border-radius: 5px;
    /* display: flex; */
    /* align-items: center; */
}

.compatibility {
    border: solid 1px #ECECEC;
    padding: 10px 10px;
    color: #B57423;
    border-radius: 5px;
    /* display: flex; */
    /* width: 20px; */
}
/**/
.ff-main-card {
    width: 100%;
    max-width: 100%;
    display: grid;
    grid-template-columns: 465px 1px minmax(0, 1fr);
    gap: 18px;
    align-items: start;
    background: #ffffff;
    padding: 16px 16px 18px;
    border: 1px solid #e9e9e9;
    border-radius: 10px;
}

.ff-left-metrics {
    display: grid;
    grid-template-columns: repeat(2, minmax(160px, 1fr));
    column-gap: 22px;
    row-gap: 18px;
    padding-top: 2px;
}

.ff-metric {
    display: flex;
    flex-direction: column;
    min-width: 0;
    gap: 4px;
}

.ff-label-row {
    display: flex;
    align-items: center;
    gap: 6px;
    margin-bottom: 5px;
}

.ff-label {
    font-size: 11px;
    line-height: 1;
    font-weight: 600;
    letter-spacing: 0.02em;
    color: #a4a4a4;
}

.ff-value {
    font-size: 17px;
    line-height: 1.2;
    font-weight: 500;
    color: #3a3a3a;
}

.ff-status {
    font-size: 15px;
    line-height: 1.2;
    font-weight: 600;
    color: #dc314c;
}

.ff-divider {
    width: 1px;
    height: 100%;
    background: #ececec;
    align-self: stretch;
}

.ff-right-section {
    display: flex;
    flex-direction: column;
    gap: 16px;
    min-width: 0;
}

.ff-user-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 14px;
}

.ff-user-card {
    display: flex;
    align-items: flex-start;
    gap: 12px;
    min-height: 70px;
    padding: 18px 26px 14px;
    background: #ffffff;
    border: 1px solid #ffffff;
    border-radius: 10px;
    box-shadow: 0px 10px 19.67px 4.92px #0000000A;
}

.ff-avatar {
    width: 55px;
    height: 46px;
    flex: 0 0 47px;
    border-radius: 50%;
    display: grid;
    place-items: center;
    font-size: 17px;
    font-weight: 700;
}

    .ff-avatar.blue {
        background: #e8eefb;
        color: #3768c7;
    }

    .ff-avatar.pink {
        background: #f5e8fb;
        color: #b42fd3;
    }

.ff-user-info {
    min-width: 0;
}

.ff-user-name {
    font-size: 14px;
    line-height: 1.15;
    font-weight: 600;
    color: #3c3c3c;
    margin-bottom: 4px;
    white-space: nowrap;
}

.ff-user-role {
    font-size: 11px;
    line-height: 1;
    font-weight: 500;
    color: #a6a6a6;
    margin-bottom: 1px;
    letter-spacing: 0.02em;
}

    .ff-user-role select span {
        border: none;
        line-height: 0;
        height: 32px !important;
    }

.ff-phone {
    display: flex;
    align-items: center;
    gap: 6px;
    font-size: 12px;
    line-height: 1;
    color: #6b6b6b;
    margin-top: 10px;
}

.ff-stoppage-card {
    display: flex;
    justify-content: space-between;
    align-items: center;
    min-height: 42px;
    padding: 12px 14px;
    background: #fff;
    border: 0.98px solid;
    border-image-source: linear-gradient(269.31deg, rgba(236, 236, 236, 0) -13.38%, #ECECEC 103.23%);
    border-radius: 10px;
    box-shadow: 0px 10px 19.67px 4.92px #0000000A;
}

.ff-stop-title-wrap {
    display: flex;
    align-items: center;
    gap: 8px;
    min-width: 0;
}

.ff-stop-title {
    font-size: 11.5px;
    line-height: 1;
    font-weight: 600;
    color: #a4a4a4;
    letter-spacing: 0.02em;
    white-space: nowrap;
}

.ff-stop-right {
    display: flex;
    align-items: center;
    gap: 18px;
    flex-shrink: 0;
}

.ff-time,
.ff-events {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    font-size: 13px;
    line-height: 1;
    font-weight: 700;
    color: #464646;
}

.ff-icon {
    width: 13px;
    height: 13px;
    stroke-width: 1.8;
    stroke-linecap: round;
    stroke-linejoin: round;
    flex: 0 0 auto;
}

.ff-icon-muted {
    stroke: #b8b8b8;
}

.ff-icon-phone {
    width: 14px;
    height: 14px;
    stroke: #08a37a;
}

.ff-icon-time {
    width: 13px;
    height: 13px;
    stroke: #f1a436;
}

.ff-icon-events {
    width: 13px;
    height: 13px;
    color: #2d6df6;
    stroke: #2d6df6;
}

@media (max-width: 760px) {
    .ff-main-card {
        grid-template-columns: 1fr;
    }

    .ff-divider {
        display: none;
    }

    .ff-user-grid {
        grid-template-columns: 1fr;
    }

    .ff-stoppage-card {
        flex-direction: column;
        align-items: flex-start;
        gap: 10px;
    }
}

.expanded-metrics-grid .select2-container--default .select2-selection--single {
    border: none !important;
    line-height: 0 !important;
    height: 32px !important;
    width: 500px;
}

.expanded-metrics-grid input {
    border: none !important;
    line-height: 0 !important;
    height: 32px !important;
}

.hauler-drop-grid {
    display: flex;
    align-items: center;
    border: 1px solid #ECECEC;
    border-radius: 8px;
    margin: 12px 12px;
    padding: 20px 20px;
    gap: 10px
}

.heading-text {
    font-family: Plus Jakarta Sans;
    font-weight: 700;
    font-size: 20px;
    color: #372C2E;
    display: flex;
    align-items: center;
    gap: 10px;
    margin-left: 10px;
    margin-bottom: 20px;
    margin-top: 20px;
}

.operator-section {
    display: flex;
    align-items: center;
    /* width: 100%; */
    gap: 10px;
}

.operatorDropZone.ui-droppable {
    display: flex;
    align-items: start;
    gap: 10px;
}

.operator-card.operatorDropZone {
    border-width: 3px !important;
    border-radius: 10px !important;
    border-style: dashed !important;
    padding: 14px 18px;
}

.supervisor-profile-card {
    display: flex;
    align-items: flex-start;
    gap: 12px;
}

.supervisor-avatar {
    width: 42px;
    height: 42px;
    min-width: 42px;
    border-radius: 50%;
    background: #f3dff1;
    color: #b03aa3;
    font-size: 20px;
    font-weight: 700;
    display: flex;
    align-items: center;
    justify-content: center;
    line-height: 1;
    text-transform: uppercase;
}

.supervisor-details {
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    min-width: 0;
}

.supervisor-name {
    font-size: 20px;
    font-weight: 700;
    color: #3d3d3d;
    line-height: 1.2;
    margin-bottom: 3px;
    word-break: break-word;
}

.supervisor-role {
    font-size: 10px;
    font-weight: 600;
    color: #9b9b9b;
    letter-spacing: 0.5px;
    margin-bottom: 12px;
}

.supervisor-phone {
    display: flex;
    align-items: center;
    gap: 8px;
    color: #5c5c5c;
    font-size: 14px;
    font-weight: 500;
}

    .supervisor-phone .material-icons {
        font-size: 18px;
        color: #1f9d8b;
        line-height: 1;
    }

.hauler-expand-header .title {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.hauler-expand-header #closeHaulerExpanded {
    border: none;
    background-color: transparent;
}
/*.haulerExpand-nav {
    position: relative;
    top: 230px;
    justify-content: space-between;
    display: flex;
}*/
.haulerExpand-nav #prevHaulerCard {
    position: absolute;
    top: 151px;
    left: -17px;
    background-color: #ffffff !important;
    border: none !important;
    box-shadow: 3px 1px 4px 0px #0000000D;
    border: 1px solid #ECECEC;
    border-radius: 6px;
    /* height: 38px; */
    padding: 10px 1px;
    display: flex;
    color: #f4f4f4;
    box-shadow: rgba(0, 0, 0, 0.05) 0px 0px 0px 1px, rgb(209, 213, 219) 0px 0px 0px 1px inset;
    height: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.haulerExpand-nav button svg path {
    fill: #818181 !important;
}

.haulerExpand-nav #nextHaulerCard {
    position: absolute;
    top: 151px;
    left: 139vh;
    background-color: #ffffff !important;
    border: none !important;
    box-shadow: 3px 1px 4px 0px #0000000D;
    border: 1px solid #ECECEC;
    border-radius: 6px;
    /* height: 38px; */
    padding: 10px 1px;
    display: flex;
    box-shadow: rgba(0, 0, 0, 0.05) 0px 0px 0px 1px, rgb(209, 213, 219) 0px 0px 0px 1px inset;
    ) 0px 0px 0px 1px inset;
    height: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.blue-theme .dashbord-message-left {
    background-color: #000000;
}

.blue-theme .assignement-card .assignment-head {
    border-radius: 10px 10px 0px 0px;
    background: #1f1b1b !important;
    border: 1px solid #828282;
    border-bottom: 0px;
}

.blue-theme .body-head {
    background: #828282;
    padding: 10px;
    justify-content: space-between;
    display: flex;
    align-items: center;
    margin: 4px 4px;
    border: 1px solid #828282;
    border-radius: 10px;
}

.blue-theme .ass-box {
    border: solid 1px #F4F4F4;
    padding: 6px 5px;
    border-radius: 10px;
    color: #fff;
}

.blue-theme .Primary-Secondary-text {
    font-family: Plus Jakarta Sans;
    background-color: #828282;
    padding: 2px 6px;
    border-radius: 10px;
    font-weight: 600;
    font-size: 12px;
    color: #ffffff;
}

.blue-theme .body-card {
    border: 1px solid #343434;
    display: flex;
    align-items: start;
    justify-content: space-between;
    padding: 4px 10px;
    background-color: #343434;
    margin-top: 4px;
    color: #ffff;
}

    .blue-theme .body-card strong {
        font-family: Plus Jakarta Sans;
        font-weight: 600;
        font-size: 12px;
        color: #ffffff;
    }

.blue-theme .assignement-card .body-secound-card label {
    font-family: Plus Jakarta Sans;
    font-weight: 700;
    font-style: Bold;
    font-size: 12px;
    letter-spacing: 0%;
    text-transform: uppercase;
    color: #ffffff !important;
}

.blue-theme .operator-card {
    background: #000000;
    border: 1px solid #262626;
    border-radius: 10px;
    padding: 14px 16px;
    display: flex;
    flex-direction: column;
    width: 100%;
    min-height: 130px;
    /* color: #ffff; */
}

.blue-theme .drop-zone {
    min-height: 47px;
    padding: 12px;
    border: 2px dashed #878787;
    border-radius: 12px;
    background: #000000;
    width: 100%;
    /* gap: 10px; */
    margin: 10px 10px;
    height: 60px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    color: #fff;
}

.blue-theme .operator-section {
    display: flex;
    align-items: center;
    /* width: 100%; */
    gap: 10px;
    border: 1px solid #444343;
    border-radius: 8px;
    margin: 12px 12px;
    padding: 20px 20px;
}

.blue-theme .heading-text {
    font-family: Plus Jakarta Sans;
    font-weight: 700;
    font-size: 20px;
    color: #ffffff;
    display: flex;
    align-items: center;
    gap: 10px;
    margin-left: 10px;
    margin-bottom: 20px;
    margin-top: 20px;
}

.blue-theme .hauler-drop-grid {
    display: flex;
    align-items: center;
    border: 1px solid #5e5e5e;
    border-radius: 8px;
    margin: 12px 12px;
    padding: 20px 20px;
}

.blue-theme .message_tab {
    border: 0.98px solid #ECECEC !important;
    box-shadow: 0px 10px 19.67px 4.92px #0000000A !important;
    border-radius: 8px !important;
    background-color: #000000;
    padding: 16px 13px !important;
    margin-left: 13px;
    height: 99%;
    margin-top: 4px;
}

.blue-theme .dashboard_wrapper {
    height: 76dvh !important;
    background-color: #000000;
}

.blue-theme .spotter-chip {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 8px 10px;
    border: 1px solid #e9e9e9;
    border-radius: 999px;
    background: #000000;
    cursor: grab;
    user-select: none;
    width: fit-content;
    max-width: 100%;
    color: #fff;
}

.blue-theme .spotter-fullname {
    font-weight: 600;
    color: #ffffff;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    max-width: 360px;
}

.blue-theme .info-box {
    border: 1px solid #4e4e4e;
    padding: 0px 9px;
    border-radius: 8px;
    font-size: 14px;
    color: #333;
    display: flex;
    align-items: center;
    gap: 4px;
    background-color: #000000;
}

.blue-theme .expanded-card {
    background: #000000;
    border-radius: 12px;
    padding: 20px 24px;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.06);
    border: 1px solid #ececec;
}

.blue-theme .ff-main-card {
    width: 100%;
    max-width: 100%;
    display: grid;
    grid-template-columns: 465px 1px minmax(0, 1fr);
    gap: 18px;
    align-items: start;
    background: #000000;
    padding: 16px 16px 18px;
    border: 1px solid #e9e9e9;
    border-radius: 10px;
}

.blue-theme .ff-user-card {
    display: flex;
    align-items: flex-start;
    gap: 12px;
    min-height: 70px;
    padding: 18px 16px 14px;
    background: #000000;
    border: 1px solid #3a3a3a;
    border-radius: 10px;
    box-shadow: 0px 10px 19.67px 4.92px #0000000A;
}

.blue-theme .haulerdetailsub .haulerdetails:first-child > div.fx-label {
    background-color: #505050;
}

.blue-theme .row.haulerdetails:nth-child(odd) {
    background-color: #000000;
}

.blue-theme .table_value {
    font-family: Plus Jakarta Sans;
    font-weight: 600;
    font-style: SemiBold;
    font-size: 14px;
    leading-trim: NONE;
    line-height: 100%;
    letter-spacing: 0%;
    color: #ffffff;
}

.blue-theme expanded-haulers h4 {
    color: #ffffff;
}

.blue-theme .machine-title .value_head {
    color: #ffffff;
}

.blue-theme .ff-stoppage-card {
    background: #383737;
}

.blue-theme #closeExpandedsvg path, .blue-theme #closeHaulerExpanded path {
    fill: white !important;
}

.blue-theme .expanded-card {
    background: #202020 !important;
    border-radius: 12px;
    padding: 20px 24px;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.06);
    border: 1px solid #000000 !important;
}

.blue-theme .expanded-metrics-grid {
    border: solid 1px #626262;
    padding: 10px 10px;
    border-radius: 8px;
}

.blue-theme .ff-main-card {
    border: solid 1px #626262;
}

.Assesment_card .row {
    margin-right: 30px;
}

.geo_text_value {
    font-family: Plus Jakarta Sans;
    font-weight: 600;
    font-style: SemiBold;
    font-size: 14px;
    leading-trim: NONE;
    line-height: 100%;
    letter-spacing: 0%;
    color: #C41E3A
}

.align-items-center {
    align-items: center
}

.lh {
    line-height: 0
}

.body-card .drag_drop_border {
    font-family: Plus Jakarta Sans;
    font-weight: 500;
    /* font-style: Italic; */
    font-size: 11px;
    leading-trim: NONE;
    line-height: 100%;
    letter-spacing: 0%;
    height: 37px;
}

.body-card label {
    min-width: 169px;
    max-width: 199px;
}

.count-badge {
    background: #FCF1E9;
    color: #E37526;
    font-family: Plus Jakarta Sans;
    font-weight: 600;
    font-style: SemiBold;
    font-size: 12px;
    padding: 0px 8px;
    border-radius: 60px;
    margin-left: 10px;
}

.total-text {
    font-family: Plus Jakarta Sans;
    font-weight: 500;
    font-size: 16px;
    color: #7B7B7B;
    margin-top: 10px;
    display: none;
}

.Operators_badge {
    background: #ECECEC;
    color: #818181;
    padding: 10px 13px;
    border-radius: 100px;
    margin-right: 10px;
}

.Operators_name {
    font-family: Plus Jakarta Sans;
    font-weight: 700;
    font-size: 14px;
    color: #262E2F;
    width: 110px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    display: block;
}

.Operators_text {
    background: #F8F1E9;
    font-family: Plus Jakarta Sans;
    font-weight: 600;
    font-size: 12px;
    line-height: 100%;
    letter-spacing: 0%;
    vertical-align: middle;
    color: #434343;
    padding: 10px 10px;
    border-radius: 8px;
    width: 170px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.Operators_card {
    border: 1px solid #EEF1F3;
    padding: 10px 10px;
    border-radius: 10px;
    margin-bottom: 2px;
}

.expand-nav #prevCard {
    position: absolute;
    top: 140px;
    left: -2vh;
    background-color: #fff !important;
    /* border: none; */
    box-shadow: 3px 1px 4px 0px #0000000D;
    font-size: 30px;
    border: 1px solid #ECECEC;
    border-radius: 8px;
    height: 56px;
    display: flex;
    align-items: center;
}

.expand-nav #nextCard {
    position: absolute;
    top: 130px;
    left: 140vh;
    background-color: #fff !important;
    border: none;
    box-shadow: 3px 1px 4px 0px #0000000D !important;
    font-size: 30px;
    border: 1px solid #ECECEC !important;
    border-radius: 6px;
    /* font-size: 40px; */
    height: 60px;
    display: flex;
    align-items: center;
}

.expand-nav {
    position: relative
}

.arrow_btn:hover {
    position: absolute;
    top: 348px;
    right: 414px;
    background-color: #fff !important;
    border: none;
    border: 1px solid #DDE1EF !important;
    border-width: 1px;
    border-top-left-radius: 6px;
    border-bottom-left-radius: 6px;
    /* padding: 10px; */
    align-items: center;
    display: flex;
    padding: 6px 4px;
}

/**/

.daily_shift .dashboard_wrapper {
    display: flex;
    width: 100%;
    align-items: flex-start;
    gap: 27px;
}

    .daily_shift .dashboard_wrapper > div:last-child {
        position: relative;
        margin: 0px;
        /*       margin-right: 53px;*/
        /*       margin-top: 3px;*/
        height: 100%;
    }

.message_tab {
    width: 450px !important;
    min-width: 415px;
    max-width: 430px;
    width: 417px !important;
    border: 1px solid #DDE1EF;
    box-shadow: unset !important;
    padding: 16px 13px;
    position: relative;
    transition: all 0.3s ease;
    overflow: hidden;
}

.dashbord-message-left {
    width: calc(100% - 466px) !important;
    flex: 1 1 auto;
    transition: all 0.3s ease;
}

.arrow_btn {
    position: absolute;
    top: 348px;
    right: 488px;
    background-color: #fff !important;
    border: none;
    border: 1px solid #DDE1EF !important;
    border-width: 1px;
    border-top-left-radius: 6px;
    border-bottom-left-radius: 6px;
    /* padding: 10px; */
    align-items: center;
    display: flex;
    padding: 18px 0px;
    z-index: 1;
}

    .arrow_btn:hover {
        position: absolute;
        top: 348px;
        right: 493px;
        background-color: #fff !important;
        border: none;
        border: 1px solid #DDE1EF !important;
        border-width: 1px;
        border-top-left-radius: 6px;
        border-bottom-left-radius: 6px;
        /* padding: 10px; */
        align-items: center;
        display: flex;
        padding: 16px 0px;
        z-index: 1;
    }

    .arrow_btn svg {
        transition: transform 0.3s ease;
    }

/* collapsed wrapper */
.daily_shift .dashboard_wrapper > div:last-child.panel-collapsed-wrap {
    width: 0px !important;
    min-width: 0px !important;
    max-width: 0px !important;
    flex: 0 0 0px !important;
    overflow: visible;
    margin: 0;
}

/* collapsed panel */
.message_tab.panel-collapsed {
    width: 44px !important;
    min-width: 44px !important;
    max-width: 44px !important;
    padding: 0 !important;
    border: 0 !important;
    box-shadow: none !important;
    background: transparent !important;
    overflow: visible !important;
}

/* expand left section */
.dashbord-message-left.panel-expanded {
    width: calc(100% - 49px) !important;
    max-width: calc(100% - 46px) !important;
    flex: 1 1 auto !important;
}

/* move arrow after collapse */
.message_tab.panel-collapsed .arrow_btn {
    left: -6px;
    top: 348px;
    width: 40px;
}

/* hide panel content except arrow */
.message_tab.panel-collapsed > *:not(.arrow_btn) {
    display: none !important;
}


/* overlay bg */
.assignment_overlay {
    display: none;
}

/* tablet + mobile only */
@media (max-width: 991.98px) {
    .daily_shift .dashboard_wrapper {
        display: block;
        position: relative;
    }

    .dashbord-message-left,
    .dashbord-message-left.panel-expanded {
        width: 100% !important;
        max-width: 100% !important;
        flex: none !important;
    }

    .daily_shift .dashboard_wrapper > div:last-child {
        width: auto !important;
        min-width: 0 !important;
        max-width: none !important;
        position: static !important;
    }

    .message_tab {
        position: fixed !important;
        top: 0;
        right: -100%;
        width: 85vw !important;
        max-width: 420px !important;
        min-width: 280px !important;
        height: 100vh;
        z-index: 99999;
        background: #fff !important;
        transition: right 0.3s ease !important;
        overflow: visible !important;
        padding: 16px 13px !important;
        border: 1px solid #DDE1EF !important;
        box-shadow: rgba(0, 0, 0, 0.18) -8px 0 24px !important;
    }

        .message_tab.mobile-overlay-open {
            right: 0 !important;
        }

    /* in mobile/tablet don't use desktop collapse width */
    .daily_shift .dashboard_wrapper > div:last-child.panel-collapsed-wrap {
        width: auto !important;
        min-width: 0 !important;
        max-width: none !important;
        flex: none !important;
        overflow: visible !important;
    }

    .message_tab.panel-collapsed {
        width: 85vw !important;
        max-width: 420px !important;
        min-width: 280px !important;
        height: 100vh !important;
        right: 0 !important;
        padding: 16px 13px !important;
        border: 1px solid #DDE1EF !important;
        box-shadow: rgba(0, 0, 0, 0.18) -8px 0 24px !important;
        background: #fff !important;
        overflow: visible !important;
    }

        .message_tab.panel-collapsed > *:not(.arrow_btn) {
            display: block !important;
        }

    .arrow_btn {
        position: absolute !important;
        top: 20px !important;
        left: -40px !important;
        right: auto !important;
        z-index: 100000 !important;
    }

    .message_tab.mobile-overlay-open .arrow_btn,
    .message_tab.panel-collapsed .arrow_btn {
        left: -40px !important;
        top: 20px !important;
        width: auto !important;
    }

    .op-card {
        height: calc(100vh - 140px);
        overflow-y: auto;
    }

    .assignment_overlay {
        display: block;
        position: fixed;
        inset: 0;
        background: rgba(0, 0, 0, 0.35);
        z-index: 99998;
        opacity: 0;
        visibility: hidden;
        transition: all 0.3s ease;
    }

        .assignment_overlay.active {
            opacity: 1;
            visibility: visible;
        }
}

.drop-zone {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    height: 130px;
    font-size: 16px;
    gap: 8px;
}

#expandDropzone ul li {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
}

.cls_assignment_lastupdated {
    margin-left: auto;
    margin-right: 43px;
    width: 185px;
}

.daily_shift .card.p-0 {
    background-color: #F8F6F2;
    border: none;
}

.asking_rate {
    font-family: Plus Jakarta Sans;
    font-weight: 800;
    font-style: ExtraBold;
    font-size: 12px;
    leading-trim: NONE;
    line-height: 100%;
    letter-spacing: 0%;
    color: #235FB5
}

.Geofence_Execution {
    color: #C41E3A;
    font-family: Plus Jakarta Sans;
    font-weight: 600;
    font-style: SemiBold;
    font-size: 14px;
    leading-trim: NONE;
    line-height: 100%;
    letter-spacing: 0%;
}

.expanded-header button {
    border: none;
    background-color: transparent
}

.ff-user-name .select2-container--default .select2-selection--single .select2-selection__rendered {
    padding: 0 !important;
}

.stopped.assignement-card .assignment-head .sts-text {
    color: rgba(139, 21, 41, 1)
}

.stopped.assignement-card .assignment-head {
    border-radius: 7px 7px 0px 0px;
    background: #F9E9EB !important;
    border: 1px solid #ff0000;
    border-bottom: 0px;
}

.stopped.assignement-card .dot {
    color: #ff0000;
    background: rgba(139, 21, 41, 1);
    box-shadow: #ff0000 0px 48px 100px
}

.stopped .label-text-name {
    color: rgba(139, 21, 41, 1);
}

    .stopped .label-text-name b {
        color: rgba(82, 13, 24, 1 );
    }

.idle.assignement-card .assignment-head {
    border-radius: 7px 7px 0px 0px;
    background: rgb(248 246 242) !important;
    border: 1px solid #b57423;
    border-bottom: 0px;
}

.idle.assignement-card .dot {
    background: url('Icon_set/Idle.svg') no-repeat center;
    background-size: contain;
    width: 18px;
    height: 18px
}

.stopped.assignement-card .dot {
    background: url('Icon_set/Stopped.svg') no-repeat center;
    background-size: contain;
    width: 18px;
    height: 18px
}

.breakdown.assignement-card .dot {
    background: url('Icon_set/Breakdown.svg') no-repeat center;
    background-size: contain;
    width: 18px;
    height: 18px
}

.reassigned.assignement-card .dot {
    background: url('Icon_set/Running.svg') no-repeat center;
    background-size: contain;
    width: 18px;
    height: 18px
}

.running.assignement-card .dot {
    background: url('Icon_set/Running.svg') no-repeat center;
    background-size: contain;
    width: 18px;
    height: 18px
}

.breakdown.assignement-card .dot {
    background: url('Icon_set/Breakdown.svg') no-repeat center;
    background-size: contain;
    width: 18px;
    height: 18px
}

.idle .label-text-name {
    color: rgb(181 116 35);
}

    .idle .label-text-name b {
        color: rgb(181 116 35);
    }

.idle .sts-text {
    color: rgb(181 116 35);
}

.running.assignement-card .assignment-head {
    background: #E9F3F1 !important;
    border: 1px solid #98C9BD;
    border-bottom: 0px;
}

.running .label-text-name {
    color: rgba(22, 98, 80, 1);
}

    .running .label-text-name b {
        color: rgba(17, 76, 62, 1);
    }

.running .sts-text {
    color: #166250;
}

.breakdown.assignement-card .assignment-head {
    background: rgba(248, 241, 233, 1) !important;
    border: 1px solid rgba(221, 191, 154, 1);
    border-bottom: 0px;
}

.breakdown.assignement-card {
    background: rgb(255 255 255) !important;
}

.breakdown .label-text-name {
    color: rgba(129, 82, 25, 1);
}

.breakdown .sts-text {
    color: rgba(76, 49, 15, 1);
}

.unassigned.assignement-card .assignment-head {
    background: rgba(240, 241, 242, 1) !important;
    border: 1px solid rgba(209, 211, 216, 1);
    border-bottom: 0px;
}

.unassigned.assignement-card .dot {
    color: rgba(129, 82, 25, 1);
    background: rgba(129, 82, 25, 1);
    box-shadow: rgba(129, 82, 25, 1);
}

.unassigned .label-text-name {
    color: rgba(76, 81, 91, 1);
}

.unassigned .sts-text {
    color: rgba(59, 63, 70, 1);
    font-weight: 800
}

.border-style {
    border-radius: 7px;
    border: 1px solid rgba(236, 236, 236, 1);
    border-top-left-radius: 0px !important;
    border-top-right-radius: 0px !important;
    background-color: #fff;
    border-bottom: 0;
    bottom: 5px;
    position: relative;
    /* height: 100%; */
}

.body-secound-row strong {
    font-size: 16px
}

.body-head span {
    color: rgba(169, 169, 169, 1);
}

    .body-head span > span {
        color: rgba(67, 67, 67, 1);
    }

.head-title {
    color: rgba(169, 169, 169, 1) !important;
    text-transform: uppercase;
}

.cls_assignment_productionactualtarget_page {
    color: rgba(3, 116, 58, 1) !important;
    font-weight: 800;
    font-weight: 800;
    font-style: ExtraBold;
    font-size: 16px;
}

.cls_assignment_productiontargetuom_page {
    display: block;
}

.expanded-card {
    padding: 20px 21px !important;
}

.file-section button {
    border: solid 1px #b57423 !important;
}

.Add_S_Allocation .select2-container .select2-selection--single .select2-selection__rendered {
    display: block;
    padding-left: 8px;
    padding-right: 14px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.drag_drop_border {
    height: 60px;
    display: flex;
    align-items: center;
    justify-content: center;
}

#haulerExpandContainer.containerdiv.card {
    border-radius: 80px !important;
}

.hauler-expand-body .operator-card {
    min-height: 121px;
    padding: 14px 31px;
}

#stoppagepopup .modal-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.body-card label {
    width: 260px;
}

#tblautoallocationSuggestion_wrapper .dataTables__top {
    width: 100px;
}

.expanded-card-wrapper {
    position: relative;
}

.notin-live-fuel {
    color: #f54a00;
    background-color: #fff7ed;
    padding: 6px 6px;
    border-radius: 30px;
    display: flex;
    align-items: center;
    width: 28px;
}

.live-fuel {
    color: #4caf50;
    background-color: #4caf502e;
    padding: 6px 6px;
    border-radius: 30px;
    display: flex;
    align-items: center;
    width: 28px;
}

.not-fuel {
    padding: 6px 6px;
    border-radius: 30px;
    display: flex;
    align-items: center;
    width: 28px;
}

.panel-content .card {
    padding: 8px 7px !important;
    margin: 0px 11px;
    box-shadow: none;
    /* border-top: none; */
}

#fleetDetailPanel {
    box-shadow: rgba(149, 157, 165, 0.2) 0px 8px 24px;
}

.croot.cbody .dataTables_wrapper table tbody tr td {
    /* min-width: 283px; */
    /* max-width: 40px; */
}

.issues-container {
    display: grid;
    grid-template-columns: auto auto;
}

.issue-card .fa-power-off {
    font-size: 12px;
}

.blue-theme .main-content .table-container {
    background: #141414 !important;
}

.history-card.detail-card .form-control {
    font-size: 12px !important;
}

.brown-theme .panel-content .nav-item .nav-link {
    border: 0px !important;
    padding: 5px 30px;
    background: #fafafa !important;
}

.panel-content .nav.nav-pills.mb-3.border-bottom.border-secondary.pb-2 {
    border: 1px solid #b57423;
    width: fit-content;
    border-radius: 5px !important;
    overflow: hidden;
    margin-left: 10px;
}

.brown-theme .panel-content .nav-item .nav-link.active {
    background: #b57423 !important;
    color: #fff !important;
}

.panel-content .nav-item {
    margin: 0 !important;
}

.blue-theme .panel-content .nav-item .nav-link {
    border: 0px !important;
    padding: 5px 30px;
    background: #000000 !important;
    border-radius: unset;
    color: #fff !important;
}

    .blue-theme .panel-content .nav-item .nav-link.active {
        background: #555454 !important;
        color: #fff !important;
    }


div#mapModal .modal-backdrop.in {
    opacity: 0.7 !important;
    width: 100% !important;
    height: 100% !important;
}

.gps-coordinates-list .coordinate-item {
    font-size: 14px !important;
}

    .gps-coordinates-list .coordinate-item:last-child {
        font-size: 12px !important;
    }

div#mapModal .modal-footer .btn-secondary:hover {
    color: #000 !important;
    background: #f0f0f0 !important;
    min-height: 30px;
    border: 1px transparent !important;
}

div#mapModal .modal-footer.border-secondary {
    display: flex;
    align-items: center;
    justify-content: end;
    gap: 10px;
}

.modal-footer .btn + .btn {
    margin: 0 !important;
}

    .modal-footer .btn + .btn:hover {
        background: #2196f3 !important;
    }

.blue-theme .history-card.detail-card .form-control {
    color-scheme: dark;
}

.detail-card .card-body .row .stat-box {
    width: 100%;
}

.detail-card .card-body .row {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(100px, 1fr));
    gap: 10px;
    width: 100%;
}

    .detail-card .card-body .row:before, .detail-card .card-body .row:after, .detail-card .card-body:after, .detail-card .card-body:before {
        display: none;
    }

.detail-card .card-body {
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.brown-theme .detail-card .card-body .row .stat-box {
    background: #f3efef;
}

.blue-theme .modal-backdrop {
    background: #545353;
}

.history-card.detail-card .row:before {
    display: none;
}

.blue-theme #mapModal .modal-footer .btn-secondary.btn {
    color: #000;
}

#mapModal {
    z-index: 99999 !important;
}

@media only screen and (min-width:1024px) and (max-width:1570px) {
/*    .brown-theme .perform_nav.perform_nav_new.nav-tabs > li > a {
        border-bottom: 58px solid #e7e5e4 !important;
    }

    .brown-theme .perform_nav.perform_nav_new.nav-tabs > li.active > a {
        border-bottom: 58px solid #b57423 !important;
    }*/
}
    @media only screen and (min-width:1024px) and (max-width:1570px) {

        .filter-item .select2-container .select2-selection--single .select2-selection__rendered {
            font-size: 10px !important;
        }

        .brown-theme .filter-item span img {
            width: 30px;
        }

        .Add_S_Allocation .col-lg-6.col-md-7.col-sm-12.flex {
            max-width: 100% !important;
            width: 100% !important;
        }
    }

    .Add_S_Allocation .col-lg-5.col-md-5.col-sm-12 {
        max-width: 815px !important;
        width: auto;
        overflow: auto;
    }

    .operator-line .select-box {
        min-width: fit-content !important;
    }

    .assignment-container {
        grid-template-columns: repeat(auto-fill, minmax(460px, 1fr));
    }

    .btnsaveHaulers {
        position: absolute;
        width: fit-content;
        top: 20px;
        left: 20px;
    }

    .perform_nav.nav-tabs > li.active > a:focus-visible, .perform_nav.nav-tabs > li > a:focus {
        outline: unset;
    }

    @media only screen and (min-width:1024px) and (max-width:1570px) {
        .ff-user-grid {
            grid-template-columns: repeat(1, minmax(0, 1fr));
        }

        .ff-stoppage-card {
            flex-direction: column;
            gap: 5px;
        }
    }

    #map-tab-content .card .card-body:not(.card-body.card-line) {
        /*    height: 90vh !important;*/
    }

#map-tab-content .map-scroll {
    height: 69vh !important;
    padding-bottom: 40px;
}

    .monitor-toggle-switch {
        width: 86px !important;
        height: 32px !important;
        background: #F4F4F4 !important;
        box-shadow: 0px 2px 3px 0px #0000001A inset !important;
        border: 1px solid #E7E5E4 !important;
    }

    .monitor-toggle-knob {
        width: 42px !important;
        height: 28px !important;
        padding: 0px 14px !important;
        border-radius: 25px !important;
        border: 1px solid #B57423 !important;
    }

    span.monitor-icon-off {
        display: block !important;
        position: absolute !important;
        left: 22px !important;
        z-index: 99 !important;
        top: 7px !important;
    }

    span.monitor-toggle-label {
        width: 0;
    }

    .monitor-toggle-wrap.monitor-on .monitor-toggle-knob {
        left: 42px !important;
    }

    .monitor-toggle-wrap.monitor-on .monitor-icon-on {
        position: absolute !important;
        right: 13px !important;
        z-index: 99 !important;
        top: 16px !important;
    }

    span.monitor-icon-on {
        display: block !important;
        position: absolute !important;
        right: 11px !important;
        z-index: 9 !important;
        top: 8px !important;
    }

    .monitor-toggle-wrap.monitor-on .monitor-toggle-switch {
        background: #F4F4F4;
    }

    .assign-lst ul {
        max-height: 278px;
    }

    .draft-hauler-lst {
        border: 1px solid #ECECEC;
        border-radius: 8px;
        margin: 12px 12px;
        padding: 20px 20px;
    }

    #geofenceModal .modal-dialog.modal-xl {
        width: 900px !important;
    }

    .haulerdetailsub .row.haulerdetails > div {
        font-size: 12px !important;
    }

    .autoallocated {
        position: absolute;
        right: 10%;
    }

    span.autoallocationresult {
        white-space: nowrap;
    }

    #tblautoallocationSuggestion_wrapper .proceed-button.d-flex.align-items-center.gap-3.mb-2 {
        gap: 10px;
    }

    span.monitor-icon-off, .monitor-toggle-wrap.monitor-on .monitor-icon-on {
        top: 8px !important;
    }

    li.hauleroperatorDropZone.ui-droppable span:first-child {
        min-width: 97px;
    }

    #tblautoallocationSuggestion_wrapper .dataTables_scrollBody table tbody tr td:first-child,
    #tblautoallocationSuggestion_wrapper .dataTables_scrollHead table thead tr th:first-child {
        min-width: 50px;
    }

    .assignement-card .body-secound-card label {
        font-size: 12px !important;
        width: fit-content !important;
    }

    .hauler-drop-grid .drop-zone, .draft-hauler-lst .drop-zone {
        min-height: 20px !important;
        height: 60px;
    }
    /*
.dataTables_scrollBody {
    max-height: calc(100vh - 400px);
}*/

    #geofenceModal {
        overflow: hidden;
    }

    .haulerExpand-nav {
        z-index: 99 !important;
    }

        .haulerExpand-nav #nextHaulerCard {
            right: 0;
            width: 23px;
            left: 100% !important;
        }

    .haulerExpand-nav {
        position: absolute !important;
        width: 97%;
    }

        .haulerExpand-nav #prevHaulerCard {
            left: unset !important;
            right: 97% !important;
        }

    .expand-nav #prevCard {
        left: 2% !important;
    }

    .expand-nav {
        width: 100%;
    }

        .expand-nav #nextCard {
            left: unset !IMPORTANT;
            right: 2%;
        }

    @media (max-width: 991.98px) {
        .tools {
            position: absolute;
            right: 11px;
        }

        .dashboard_wrapper .col-sm-12 {
            width: 100%;
            padding-inline: 0;
        }

        .assignment-card-expandview .border-style .body-head span:nth-child(3) {
            margin: 0 !important;
        }

        .dashbord-message-left {
            width: 100% !important;
        }

        .daily_shift .dashboard_wrapper {
            display: flex;
            flex-direction: column-reverse;
            height: 100% !important;
        }

        .dashboard_wrapper .dashbord-message-left {
            width: 100% !important;
            height: 100%;
        }

        .daily_shift .dashboard_wrapper > div:last-child {
            margin: 0px;
        }

        .right-panel-wrap .message_tab {
            position: unset !important;
            width: 100% !important;
            max-width: 100% !IMPORTANT;
        }

        .assignmenthead-card {
            height: auto;
        }

        .daily_shift .dashboard_wrapper > div:last-child {
            position: unset !important;
            height: auto;
            padding: 10px;
            width: 100% !important;
        }

        #tab-sector-content #assignmentcard {
            margin: 0 !important;
            padding-inline: 10px !IMPORTANT;
        }

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

        .card-head.Assesment_card .col-lg-3.col-md-4.col-sm-12 {
            padding: 0 !important;
            width: 100% !important;
            gap: 0;
        }

        .Assesment_card .row {
            flex-direction: column;
            gap: 10px;
        }

        .card-head.Assesment_card .col-lg-8.col-md-4.col-sm-12 {
            width: 100%;
            padding: 0 !IMPORTANT;
        }

        .message_tab .tab-content.bg-light {
            height: 100% !IMPORTANT;
            max-height: 100% !important;
            overflow: unset !IMPORTANT;
        }

        div#Hauler_Suggestion {
            height: 100%;
            overflow: auto;
        }

        #tab-sector-content .card-head.Assesment_card {
            margin: 0 !IMPORTANT;
        }

        .Assesment_card .form-group {
            width: 100%;
        }

        .info-box {
            width: 100% !IMPORTANT;
        }
    }

    .info-container {
        align-items: center;
    }

    @media only screen and (max-width:1025px) {
        span.divider {
            margin-left: 16px;
            display: none;
        }

        .blue-theme span.text-white, span.value-text, .body-card,
        .body-card span, .cls_assignment_productionactualtarget_page,
        .cls_assignment_productiontarget_page, .asking_rate,
        .body-secound-row strong, .text-name1 {
            font-size: 14px;
        }

        .traget_value {
            font-size: 12px;
        }

        .page-header-box h1 {
            font-size: clamp(16px,2vw,20px) !important;
        }

            .page-header-box h1 span {
                font-size: clamp(14px,1vw,17px) !important;
            }
    }

    @media only screen and (max-width:767px) {
        .card-head header {
            font-size: 16px;
        }

        .status-approved, .sts-text {
            font-size: 13px;
        }

        .table-responsive-lg table tbody td, .label-text-name,
        .list_card_section .form-group span, .blue-theme span.text-white {
            font-size: 14px;
        }
    }

    @media only screen and (max-width:599px) {
        .suggestion-title {
            font-size: 13px;
        }

        .suggestion-subtitle {
            font-size: 14px;
        }

        .cls_assignment_productionactualtarget_page {
            font-size: 12px;
        }

        .assignment-container .request-card-list .body-head span {
            flex-direction: column;
        }
    }


    @media only screen and (max-width:425px) {

        .assign-lst ul li {
            display: flex;
            width: 100%;
            gap: 5px;
            padding: 10px;
            flex-direction: column;
            flex-wrap: wrap;
            align-items: start;
            justify-content: start;
            border-left: 3px solid transparent;
        }

        .body-card {
            width: 100%;
        }
    }

    .card-padding.author_bio_toggle_wrapper {
        background: #faf7f2 !important;
    }

    .co-lg-11.col-md-10.col-sm-12 {
        width: 100%;
    }

    .card-section {
        min-width: auto;
        flex: 1;
    }

    .co-lg-1.col-md-2.col-sm-12.text-end {
        position: absolute;
        right: 0;
    }

    .card-head:has(.perform_nav.nav.nav-tabs),
    .card-head:has(.perform_nav.nav.nav-tabs):before,
    .card-head:has(.filter-dropdown):before,
    .card-head:has(.filter-dropdown) {
        border: unset;
        content: unset;
        padding: unset;
    }

    .hidenorecordsfound .col-sm-12.col-xs-12 {
        padding-inline: 0;
    }

    section.main-content {
        padding:0 !important;
    }

        section.main-content:has(.dashboard_wrapper) {
            padding: 0 !important;
        }

    .nano .gui-controls li.profileicon a {
        padding: 10px;
    }

    .card-head.logo-image:before {
        content: unset;
    }

    .card-head.logo-image {
        border: unset;
        padding: 0;
    }

    .blue-theme .gui-controls > li > a.logo-item {
        border-color: #000000;
    }

    .blue-theme .table.dataTable > tbody > tr:nth-child(even) > td.dt-center {
        background: #313030 !important;
    }

    .blue-theme table tr td > a svg path {
        stroke: #fff;
    }
    /**/
    .card:has(.table-responsive) {
        background: transparent;
        border: unset;
        padding:0;
    }

    .dataTables__top {
        background: #fff;
        padding: 10px !important;
    }

    .dataTables_scroll.dtfc-has-right {

        overflow: hidden;
    }
.dataTables_wrapper {
    background: #fff;
    border-radius: 8px;
    border: 1px solid #ccc;
    padding: 10px;
}
#cma_printableArea {
    background: #fff;
    padding: 10px !important;
    border-radius: 8px;
    border: 1px solid #ccc;
    margin: 0px 10px 10px 10px;
}
.brown-theme .card:has(.table-responsive) .dataTables_wrapper .dataTables__bottom {
    background: #fff !important;
    margin-top: 0 !important;
    border-radius: 0 8px;
}

    .col-sm-12.col-xs-12.mt-3.BasicInfo_craftmyapp_container {
        padding: 0 !important;
    }

    .list_card_section.list_card_tablet .card-body:last-child {
        padding-top: 14px;
    }

    .card.card-blue.card-section.cma_section_band.list_card_section.list_card_tablet {
        border: unset;
    }

    .select2-container--default .select2-selection--single, .select2-container--default .select2-selection--single span, .form-control {
        border-radius: 8px;
        font-size: 12px !important;
    }

    .list_card_section .form-group label {
        font-size: 15px !important;
    }

    .list_card_section .form-group span {
        font-size: 15px !important;
    }

    }

/* ─── ADDED TASK TRACKER STYLES FROM LMV ─── */
    #tt-wrapper * {
        box-sizing: border-box;
    }

    #tt-wrapper {
        display: flex;
        flex-direction: column;
        height: calc(100vh - 60px);
        overflow: hidden;
        font-family: 'Poppins', 'Roboto', sans-serif;
        font-size: 13px;
        background: #f0f2f5;
    }




    .tt-stat-chip {
        background: rgba(255,255,255,0.08);
        border: 1px solid rgba(255,255,255,0.12);
        border-radius: 6px;
        padding: 3px 10px;
        text-align: center;
        min-width: 52px;
        cursor: pointer;
        transition: background 0.15s;
    }

        .tt-stat-chip:hover {
            background: rgba(255,255,255,0.16);
        }

        .tt-stat-chip .sc-num {
            font-size: 15px;
            font-weight: 700;
            display: block;
        }

        .tt-stat-chip .sc-lbl {
            font-size: 9px;
            opacity: 0.7;
            text-transform: uppercase;
            letter-spacing: 0.5px;
        }

        .tt-stat-chip.orange .sc-num {
            color: #ffb74d;
        }

        .tt-stat-chip.red .sc-num {
            color: #ef5350;
        }

        .tt-stat-chip.yellow .sc-num {
            color: #fff176;
        }


    #tt-main {
        display: flex;
        flex: 1;
        overflow: hidden;
        font-family: 'Plus Jakarta Sans', 'Poppins', -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
        -webkit-font-smoothing: antialiased;
        -moz-osx-font-smoothing: grayscale;
    }

    /* ── LEFT PANEL — QUEUES ── */
    #tt-left {
        width: 200px;
        min-width: 200px;
        background: #fff;
        border-right: 1px solid #e0e0e0;
        display: flex;
        flex-direction: column;
        overflow: hidden;
        flex-shrink: 0;
        transition: width 0.3s ease;
    }

        #tt-left.collapsed {
            width: 0;
            min-width: 0;
            border: none;
        }

    .tt-left-header {
        background: #fff;
        color: #fff;
        padding: 12px 14px 10px;
        flex-shrink: 0;
    }

        .tt-left-header .qs-title {
            font-size: 10px;
            font-weight: 700;
            letter-spacing: 1px;
            text-transform: uppercase;
            opacity: 0.9;
            margin-bottom: 8px;
            color: #000000ad;
        }

    .tt-queue-search {
        position: relative;
    }

        .tt-queue-search input {
            width: 100%;
            /* background: rgba(255,255,255,0.1);
        border: 1px solid rgba(255,255,255,0.2);*/
            background: rgb(183 128 55);
            border: 1px solid rgb(253 253 253 / 20%);
            border-radius: 16px;
            padding: 5px 10px 5px 28px;
            color: #fff;
            font-size: 11px;
            font-family: inherit;
            outline: none;
        }

            .tt-queue-search input::placeholder {
                color: rgba(255,255,255,0.55);
            }

        .tt-queue-search .qs-icon {
            position: absolute;
            left: 8px;
            top: 50%;
            transform: translateY(-50%);
            font-size: 14px;
            color: rgba(255,255,255,0.6);
            pointer-events: none;
        }

    .tt-left-body {
        flex: 1;
        overflow-y: auto;
        padding: 10px 0 16px;
        background: #f9fafb;
    }

        .tt-left-body::-webkit-scrollbar {
            width: 3px;
        }

        .tt-left-body::-webkit-scrollbar-thumb {
            background: #ccc;
            border-radius: 3px;
        }

    .tt-section-lbl {
        font-size: 9px;
        font-weight: 700;
        letter-spacing: 1px;
        color: #90a4ae;
        text-transform: uppercase;
        padding: 6px 14px 3px;
    }

    /* View items (All Tasks) */
    .tt-view-item {
        display: flex;
        align-items: center;
        gap: 8px;
        padding: 7px 14px;
        margin: 1px 6px;
        border-radius: 7px;
        cursor: pointer;
        font-size: 12px;
        font-weight: 500;
        color: #37474f;
        border-left: 3px solid transparent;
        transition: background 0.12s;
    }

        .tt-view-item:hover {
            background: #f0f4f8;
        }

        .tt-view-item.active {
            background: #fff3e0;
            color: #e65100;
            font-weight: 600;
            border-left-color: #ff9800;
        }

        .tt-view-item .vi-icon {
            width: 24px;
            height: 24px;
            border-radius: 50%;
            background: #fff3e0;
            display: flex;
            align-items: center;
            justify-content: center;
            flex-shrink: 0;
        }

        .tt-view-item .vi-badge {
            margin-left: auto;
            background: #fce4ec;
            color: #c62828;
            border-radius: 10px;
            padding: 1px 7px;
            font-size: 10px;
            font-weight: 700;
            min-width: 20px;
            text-align: center;
        }

        .tt-view-item.active .vi-badge {
            background: #ffe0b2;
            color: #e65100;
        }

    /* Queue items */
    .tt-queue-item {
        display: flex;
        align-items: center;
        gap: 8px;
        padding: 7px 14px;
        margin: 1px 6px;
        border-radius: 7px;
        cursor: pointer;
        font-size: 12px;
        color: #455a64;
        border-left: 3px solid transparent;
        transition: background 0.12s;
        white-space: nowrap;
        overflow: hidden;
    }

        .tt-queue-item:hover {
            background: #f0f4f8;
        }

        .tt-queue-item.active {
            background: #fdf0e3;
            color: #01579b;
            font-weight: 600;
            border-left-color: #bf7d2c;
        }

        .tt-queue-item .q-dot {
            width: 9px;
            height: 9px;
            border-radius: 50%;
            flex-shrink: 0;
        }

        .tt-queue-item .q-name {
            flex: 1;
            overflow: hidden;
            text-overflow: ellipsis;
        }

        .tt-queue-item .q-badge {
            margin-left: auto;
            background: #f5f5f5;
            color: #546e7a;
            border: 1px solid #e0e0e0;
            border-radius: 10px;
            padding: 1px 7px;
            font-size: 10px;
            font-weight: 600;
            min-width: 20px;
            text-align: center;
            flex-shrink: 0;
        }

        .tt-queue-item.active .q-badge {
            background: #fbeabb;
            color: #9b4801;
            border-color: #f9c090;
        }

    /* Skeleton */
    .tt-skeleton-bar {
        height: 11px;
        background: linear-gradient(90deg,#e0e0e0 25%,#f5f5f5 50%,#e0e0e0 75%);
        background-size: 200% 100%;
        animation: tt-shimmer 1.2s infinite;
        border-radius: 6px;
        margin: 6px 14px;
    }

    @@keyframes tt-shimmer {
        0% {
            background-position: 200% 0;
        }

        100% {
            background-position: -200% 0;
        }
    }

    /* ── CENTER PANEL — TABLE ── */
    #tt-center {
        flex: 1;
        display: flex;
        flex-direction: column;
        overflow: hidden;
        background: #fff;
        border-right: 1px solid #e0e0e0;
        min-width: 0;
    }


    #tt-tasktype-header {
        background: #fff;
        color: #333;
        padding: 0 20px;
        flex-shrink: 0;
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 16px;
        min-height: 64px;
        position: relative;
        overflow: hidden;
        border-bottom: 1px solid #f3e6d8;
        transition: background 0.4s ease;
    }

        #tt-tasktype-header::before {
            display: none;
        }

    .tt-th-icon-wrap {
        width: 42px;
        height: 42px;
        background: #fff8f0;
        border: 1px solid #f9c090;
        border-radius: 10px;
        display: flex;
        align-items: center;
        justify-content: center;
        flex-shrink: 0;
        transition: background 0.3s, border-color 0.3s;
    }

        .tt-th-icon-wrap i {
            font-size: 22px;
            color: #bf7d2c;
        }

    .tt-th-text {
        flex: 1;
        min-width: 0;
    }

    .tt-th-name {
        font-size: 15px;
        font-weight: 700;
        letter-spacing: 0.2px;
        color: #000000ad;
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
        line-height: 1.2;
        transition: opacity 0.25s;
    }

    .tt-th-desc {
        font-size: 11px;
        color: rgb(18 13 13 / 85%);
        margin-top: 3px;
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
        transition: opacity 0.25s;
    }

    .tt-th-badge {
        background: #bf7d2c;
        border: 1px solid rgba(255,255,255,0.22);
        border-radius: 20px;
        padding: 4px 14px;
        font-size: 11px;
        font-weight: 700;
        color: rgba(255,255,255,0.9);
        white-space: nowrap;
        flex-shrink: 0;
        display: flex;
        align-items: center;
        gap: 5px;
    }

        .tt-th-badge i {
            font-size: 13px;
        }
    /* Accent bar at bottom of header - color changes per queue */
    #tt-tasktype-header::after {
        content: '';
        position: absolute;
        bottom: 0;
        left: 0;
        right: 0;
        height: 3px;
        background: #bf7d2c;
        transition: background 0.4s ease;
    }
    /* Fade animation on header text swap */
    .tt-th-name.fade-anim, .tt-th-desc.fade-anim {
        animation: tt-header-fade 0.35s ease;
    }

    @@keyframes tt-header-fade {
        0% {
            opacity: 0;
            transform: translateY(4px);
        }

        100% {
            opacity: 1;
            transform: translateY(0);
        }
    }

    /* Toolbar */
    .tt-toolbar {
        display: flex;
        align-items: center;
        gap: 10px;
        padding: 10px 16px;
        border-bottom: 1px solid #e8eaf0;
        flex-shrink: 0;
        background: #fff;
    }

    .tt-toolbar-title {
        font-size: 14px;
        font-weight: 700;
        color: #1a3c5e;
        white-space: nowrap;
    }

    .tt-toolbar-icons {
        display: flex;
        gap: 6px;
        margin-left: auto;
    }

    .tt-icon-btn {
        width: 30px;
        height: 30px;
        border: 1px solid #d0d5dd;
        border-radius: 5px;
        background: #fff;
        cursor: pointer;
        display: flex;
        align-items: center;
        justify-content: center;
        color: #555;
        transition: background 0.12s;
        padding: 0;
    }

        .tt-icon-btn:hover {
            background: #f5f5f5;
        }

    .tt-btn-add {
        background: #1a3c5e;
        color: #fff;
        border: none;
        border-radius: 6px;
        padding: 7px 14px;
        font-size: 12px;
        font-weight: 600;
        font-family: inherit;
        cursor: pointer;
        display: flex;
        align-items: center;
        gap: 5px;
        white-space: nowrap;
    }

        .tt-btn-add:hover {
            background: #142d46;
        }

    /* Status tabs */
    .tt-status-tabs {
        display: flex;
        align-items: center;
        padding: 0 16px;
        border-bottom: 1px solid #e8eaf0;
        background: #fff;
        flex-shrink: 0;
        overflow-x: auto;
    }

    .tt-stab {
        padding: 8px 14px;
        font-size: 12px;
        font-weight: 500;
        color: #888;
        cursor: pointer;
        border-bottom: 2px solid transparent;
        margin-bottom: -1px;
        display: flex;
        align-items: center;
        gap: 5px;
        transition: all 0.15s;
        white-space: nowrap;
        background: none;
        border-top: none;
        border-left: none;
        border-right: none;
        font-family: inherit;
    }

        .tt-stab:hover {
            color: #1a3c5e;
        }

        .tt-stab.active {
            color: #1a3c5e;
            border-bottom-color: #1a3c5e;
            font-weight: 600;
        }

        .tt-stab .sb {
            background: #e0e0e0;
            color: #666;
            border-radius: 10px;
            padding: 1px 7px;
            font-size: 10px;
            font-weight: 700;
            min-width: 18px;
            text-align: center;
        }

        .tt-stab.active .sb {
            background: #1a3c5e;
            color: #fff;
        }

        .tt-stab .sb.blue {
            background: #1565c0;
            color: #fff;
        }

        .tt-stab .sb.orange {
            background: #f57c00;
            color: #fff;
        }


    /* Filter bar */
    .tt-filter-bar {
        display: none !important;
        align-items: center;
        gap: 8px;
        padding: 8px 16px;
        border-bottom: 1px solid #eee;
        flex-shrink: 0;
        background: #fafafa;
        flex-wrap: wrap;
    }

    .tt-search-wrap {
        position: relative;
        flex: 1;
        max-width: 280px;
    }

        .tt-search-wrap input {
            width: 100%;
            border: 1px solid #d0d5dd;
            border-radius: 20px;
            padding: 6px 12px 6px 32px;
            font-size: 12px;
            font-family: inherit;
            color: #333;
            outline: none;
            background: #fff;
        }

            .tt-search-wrap input:focus {
                border-color: #1a3c5e;
            }

        .tt-search-wrap .si {
            position: absolute;
            left: 9px;
            top: 50%;
            transform: translateY(-50%);
            font-size: 15px;
            color: #aaa;
            pointer-events: none;
        }

    .tt-fbar-btn {
        border: 1px solid #d0d5dd;
        background: #fff;
        border-radius: 5px;
        padding: 5px 10px;
        font-size: 11px;
        font-weight: 500;
        color: #555;
        cursor: pointer;
        display: flex;
        align-items: center;
        gap: 4px;
        font-family: inherit;
    }

        .tt-fbar-btn:hover {
            background: #f5f5f5;
        }

    .tt-filter-chip {
        background: #e3f2fd;
        border: 1px solid #90caf9;
        color: #01579b;
        border-radius: 16px;
        padding: 3px 10px;
        font-size: 11px;
        font-weight: 600;
        display: none !important;
        align-items: center;
        gap: 4px;
    }

        .tt-filter-chip.show {
            display: inline-flex !important;
        }

        .tt-filter-chip button {
            background: none;
            border: none;
            color: #01579b;
            cursor: pointer;
            font-size: 15px;
            line-height: 1;
            padding: 0;
            margin-left: 2px;
        }

    /* Table area */
    .tt-table-wrap {
        flex: 1;
        overflow-y: auto;
        overflow-x: auto;
    }

        .tt-table-wrap::-webkit-scrollbar {
            width: 4px;
            height: 4px;
        }

        .tt-table-wrap::-webkit-scrollbar-thumb {
            background: #ccc;
            border-radius: 4px;
        }



    #tt-center table.dataTable tbody tr:hover td {
        background: #fafbfc !important;
    }

    #tt-center table.dataTable tbody tr.selected td {
        background: #fafbfc !important;
        border-left: 3px solid #1a3c5e !important;
    }

    /* Status badges */
    .tt-badge {
        display: inline-block;
        padding: 3px 10px;
        border-radius: 12px;
        font-size: 10px;
        font-weight: 700;
        text-transform: uppercase;
        letter-spacing: 0.5px;
    }

    .tt-badge-open {
        background: #e8f5e9;
        color: #2e7d32;
    }

    .tt-badge-closed {
        background: #fce4ec;
        color: #c62828;
    }

    .tt-badge-pending {
        background: #fff3e0;
        color: #e65100;
    }

    /* Priority badges */
    .tt-priority {
        display: inline-flex;
        align-items: center;
        gap: 4px;
        padding: 3px 9px;
        border-radius: 12px;
        font-size: 10px;
        font-weight: 700;
        text-transform: uppercase;
        letter-spacing: 0.4px;
        white-space: nowrap;
    }

    .tt-priority-critical {
        background: #fde8e8;
        color: #b91c1c;
        border: 1px solid #fca5a5;
    }

    .tt-priority-high {
        background: #fff3e0;
        color: #c2410c;
        border: 1px solid #fdba74;
    }

    .tt-priority-medium {
        background: #fefce8;
        color: #a16207;
        border: 1px solid #fde047;
    }

    .tt-priority-low {
        background: #f0fdf4;
        color: #15803d;
        border: 1px solid #86efac;
    }

    .tt-priority-default {
        background: #f3f4f6;
        color: #6b7280;
        border: 1px solid #d1d5db;
    }

    /* Next action dropdown */
    .tt-na-select {
        border: 1px solid #d0d5dd;
        border-radius: 5px;
        padding: 4px 8px;
        font-size: 11px;
        font-family: inherit;
        color: #bf7d2c;
        background: #fff7f0;
        cursor: pointer;
        outline: none;
        width: 135px;
        font-weight: 600;
    }

        .tt-na-select:focus {
            border-color: #0288d1;
        }

        .tt-na-select option {
            color: #333;
            background: #fff;
            font-weight: 500;
        }

    /* Table footer / pager */
    .tt-table-footer {
        display: flex;
        align-items: center;
        justify-content: space-between;
        padding: 8px 16px;
        border-top: 1px solid #e8eaf0;
        flex-shrink: 0;
        background: #fafafa;
        font-size: 11px;
        color: #888;
    }

    /* ── RIGHT PANEL — ACTION LOG ── */
    #tt-right {
        width: 360px;
        min-width: 320px;
        display: flex;
        flex-direction: column;
        overflow: hidden;
        background: #fff;
        flex-shrink: 0;
        transition: width 0.3s ease;
    }

        #tt-right.collapsed {
            width: 0;
            min-width: 0;
        }

    .tt-right-header {
        background: #fff;
        border-bottom: 1px solid #e8eaf0;
        padding: 10px 14px;
        display: flex;
        align-items: center;
        gap: 8px;
        flex-shrink: 0;
    }

    .tt-right-title {
        font-size: 13px;
        font-weight: 700;
        color: #1a3c5e;
        flex: 1;
        display: flex;
        align-items: center;
        gap: 6px;
    }

    .tt-right-icons {
        display: flex;
        gap: 2px;
    }

    .tt-rhi-btn {
        background: none;
        border: none;
        color: #888;
        cursor: pointer;
        padding: 3px 5px;
        border-radius: 4px;
        line-height: 1;
        display: flex;
        align-items: center;
        justify-content: center;
        transition: background 0.12s;
    }

        .tt-rhi-btn:hover {
            background: #f5f5f5;
            color: #333;
        }

        .tt-rhi-btn.active {
            background: rgba(26,60,94,0.1);
            color: #1a3c5e;
        }

    /* Right panel empty state */
    .tt-empty-state {
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        height: 100%;
        padding: 32px 20px;
        text-align: center;
        color: #90a4ae;
    }

        .tt-empty-state i {
            font-size: 48px;
            margin-bottom: 12px;
            opacity: 0.35;
        }

        .tt-empty-state p {
            font-size: 12px;
            margin: 0;
            line-height: 1.7;
        }

    #tt-right-frame {
        flex: 1;
        border: none;
        overflow: hidden;
        display: none;
    }

    /* Resize handle on right panel */
    #tt-right-resize {
        width: 5px;
        height: 100%;
        cursor: ew-resize;
        background: transparent;
        flex-shrink: 0;
        transition: background 0.15s ease;
        position: absolute;
        left: 0;
        top: 0;
        bottom: 0;
        z-index: 20;
        touch-action: none;
    }

    #tt-right-resize::after {
        content: '';
        position: absolute;
        top: 0;
        bottom: 0;
        left: -4px;
        right: -4px;
        cursor: ew-resize;
    }

    #tt-right-resize:hover, #tt-right-resize.dragging {
        background: transparent !important;
    }

    body.tt-resizing-active {
        user-select: none !important;
        -webkit-user-select: none !important;
        -moz-user-select: none !important;
        cursor: ew-resize !important;
    }

    body.tt-resizing-active #tt-right-inner,
    body.tt-resizing-active #tblTasks {
        pointer-events: none !important;
    }

    #tt-right-inner {
        position: relative;
        display: flex;
        flex: 1;
        flex-direction: column;
        overflow: hidden;
    }

    /* ── SIZE STATES ── */
    #tt-right.size-half {
        width: 50%;
    }

    #tt-right.size-full {
        width: 100%;
        position: absolute;
        top: 0;
        left: 0;
        right: 0;
        bottom: 0;
        z-index: 100;
    }

    /* ── NEXT ACTION POPUP ── */
    .tt-na-overlay {
        display: none;
        position: fixed;
        inset: 0;
        background: rgba(0,0,0,0.35);
        z-index: 10000;
    }

    .tt-na-popup {
        display: none;
        position: fixed;
        top: 50%;
        left: 50%;
        transform: translate(-50%,-50%);
        background: #fff;
        width: 360px;
        border-radius: 12px;
        box-shadow: 0 8px 32px rgba(79,195,247,0.25), 0 2px 8px rgba(0,0,0,0.12);
        z-index: 10001;
        overflow: hidden;
        font-family: inherit;
    }

    .tt-na-header {
        background: #bf7d2c;
        color: #fff;
        padding: 14px 18px;
        display: flex;
        justify-content: space-between;
        align-items: center;
    }

        .tt-na-header span {
            font-weight: 700;
            font-size: 15px;
            display: flex;
            align-items: center;
            gap: 6px;
        }

    .tt-na-close {
        background: rgba(255,255,255,0.2);
        border: none;
        color: #fff;
        font-size: 18px;
        cursor: pointer;
        width: 28px;
        height: 28px;
        border-radius: 50%;
        display: flex;
        align-items: center;
        justify-content: center;
        line-height: 1;
    }

    .tt-na-body {
        padding: 16px 20px 20px;
        background: #fff;
    }

    /* DataTables top controls */
    #tt-center .dataTables__top {
        display: flex;
        align-items: center;
        gap: 8px;
        padding: 8px 16px;
        flex-wrap: wrap;
        background: #fff;
        border-bottom: 1px solid #eee;
    }

    #tt-center .dataTables_filter {
        display: none !important;
    }

    #tt-center .dataTables_length {
        display: none !important;
    }

    #tt-center .dataTables__bottom {
        padding: 8px 16px;
        display: flex;
        align-items: center;
        justify-content: space-between;
        font-size: 11px;
        color: #888;
    }

    #tt-center .dataTables_info {
        font-size: 11px;
        color: #888;
    }

    #tt-center .dt-buttons {
        display: none !important;
    }
    /* Base dot style */
    .tt-dot {
        display: inline-block;
        width: 8px;
        height: 8px;
        border-radius: 50%;
        margin-right: 5px;
        vertical-align: middle;
        flex-shrink: 0;
    }

    /* Per-priority colors */
    .tt-dot-critical {
        background: #b91c1c;
    }

    .tt-dot-high {
        background: #c2410c;
    }

    .tt-dot-medium {
        background: #a16207;
    }

    .tt-dot-low {
        background: #15803d;
    }

    .tt-dot-default {
        background: #6b7280;
    }

    #tt-center table.dataTable tbody tr.selected td {
        border: 0px !important;
    }


    .tt-status-tabs {
        padding-top: 10px;
    }

    button.tt-fbar-btn {
        margin-left: 10px;
        margin-bottom: 6px;
    }

    .tt-search-wrap {
        margin-bottom: 6px;
    }

    .search-btn {
        display: flex;
        justify-content: flex-end;
        width: 100%;
    }

    input#fu_duedate {
        line-height: 10px;
    }

    .tt-table-wrap {
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
    }

        .tt-table-wrap .dataTables_wrapper {
            min-width: 900px;
        }

    #tblTask {
        min-width: 900px;
    }

    span.bellico {
        display: flex;
        align-items: flex-start;
    }

    .bellico span.badge {
        left: 21px !important;
        right: unset !important;
        top: 1px;
        background: #bf7d2c;
    }

    .message_icon {
        display: flex;
        padding: 5px 8px 0px 10px;
        margin-bottom: 0px;
    }

    span.notify {
        font-size: 13px;
        color: #62748e;
        text-transform: capitalize;
        margin: 0;
        font-weight: 600;
        line-height: 39px;
        padding-left: 6px;
    }

    span.icosvg svg path {
        color: #909caf;
    }

    .message_icon:hover span.notify, .message_icon:hover span.icosvg svg path {
        color: #bf7d2c;
    }

    span.icosvg {
        display: flex;
        margin-top: 7px;
    }

    #tblVendor_wrapper .btn-group {
        padding: 4px;
        border-radius: 12px;
        background: #e8e8e8;
    }

    label,
    .form-group label,
    .card-body .form-group label,
    .form-group > label,
    .list_card_section .form-group label,
    .servicesContainer .services.dependentContainerBorder .form-group label,
    .servicesContainer .services.dependentContainerBorder label {
        color: #62748e !important;
        font-size: 13px !important;
        font-weight: 600 !important;
    }

        .form-group label span,
        .servicesContainer .services.dependentContainerBorder .form-group label span,
        .servicesContainer .services.dependentContainerBorder label span {
            font-size: 13px !important;
        }

    .form-control,
    select.form-control,
    textarea.form-control,
    .SumoSelect > .CaptionCont,
    .select2-container--default .select2-selection--single .select2-selection__rendered,
    .input-group .form-control,
    .intl-tel-input input,
    .iti input,
    input[type="file"] {
        color: #343332 !important;
    }

        .form-control::placeholder,
        textarea.form-control::placeholder,
        .input-group .form-control::placeholder,
        .intl-tel-input input::placeholder,
        .iti input::placeholder {
            color: #939393 !important;
        }



    /* Trip Sense Logs */
    .trip-sense-log-card {
        background: #fff;
        border: 1px solid #dde6f2;
        border-radius: 18px;
        overflow: hidden;
        margin: 25px 0 0;
    }

    .trip-sense-log-toolbar {
        padding: 24px;
        border-bottom: 1px solid #dde6f2;
    }

    .trip-sense-search-box {
        position: relative;
    }

        .trip-sense-search-box i {
            position: absolute;
            left: 18px;
            top: 50%;
            transform: translateY(-50%);
            color: #8b9db8;
            font-size: 18px;
        }

        .trip-sense-search-box input {
            height: 44px;
            border-radius: 16px !important;
            border: 1px solid #dbe4f0 !important;
            padding-left: 48px;
            box-shadow: none !important;
            font-size: 14px;
        }

    .trip-sense-btn {
        height: 44px;
        border-radius: 16px !important;
        border: 1px solid #dbe4f0 !important;
        background: #fff !important;
        color: #33445f !important;
        padding: 0 18px;
        font-weight: 500;
    }

    .trip-sense-primary-btn {
        height: 42px;
        border-radius: 16px !important;
        border: 0 !important;
        background: #c57935 !important;
        color: #fff !important;
        padding: 0 24px;
        font-weight: 700;
        box-shadow: 0 5px 12px rgba(197, 121, 53, 0.28);
    }

    .trip-sense-export-btn {
        height: 42px;
        border-radius: 16px !important;
        border: 1px solid #dbe4f0 !important;
        background: #fff !important;
        color: #33445f !important;
        padding: 0 18px;
        font-weight: 500;
    }

    .trip-sense-metric {
        height: 52px;
        border: 1px solid #dbe4f0;
        border-radius: 17px;
        display: inline-flex;
        align-items: center;
        gap: 14px;
        padding: 0 18px;
        background: #fff;
        margin-right: 10px;
        margin-bottom: 10px;
    }

        .trip-sense-metric label {
            margin: 0;
            color: #8b9db8;
            font-size: 12px;
            font-weight: 800;
            letter-spacing: .6px;
            text-transform: uppercase;
        }

        .trip-sense-metric span {
            min-width: 38px;
            height: 32px;
            border-radius: 8px;
            display: inline-flex;
            align-items: center;
            justify-content: center;
            font-size: 16px;
            font-weight: 800;
        }

        .trip-sense-metric.total span {
            background: #eaf2ff;
            color: #1266ff;
        }

        .trip-sense-metric.large span {
            background: #fff5dd;
            color: #c57935;
        }

        .trip-sense-metric.mid span {
            background: #e8fbf6;
            color: #00a98f;
        }

    .trip-sense-log-filter {
        padding: 24px;
        border-bottom: 1px solid #edf2f7;
    }

        .trip-sense-log-filter label {
            color: #8b9db8;
            font-size: 12px;
            font-weight: 800;
            letter-spacing: .6px;
            text-transform: uppercase;
        }

        .trip-sense-log-filter select {
            height: 38px;
            border-radius: 11px !important;
            border: 1px solid #dbe4f0 !important;
            box-shadow: none !important;
        }

    .trip-sense-table-wrap {
        overflow-x: auto;
    }

    .trip-sense-table {
        margin-bottom: 0;
        min-width: 1120px;
    }

        .trip-sense-table thead th {
            background: #f7f9fc !important;
            border-bottom: 1px solid #dfe7f1 !important;
            color: #637592 !important;
            font-size: 13px !important;
            font-weight: 800 !important;
            letter-spacing: .4px;
            text-transform: uppercase;
            padding: 20px 24px !important;
            white-space: nowrap;
        }

        .trip-sense-table tbody td {
            padding: 16px 24px !important;
            color: #243247 !important;
            vertical-align: middle;
            white-space: nowrap;
        }

        .trip-sense-table th[data-sort] {
            cursor: pointer;
        }
    /* Trip Sense expected UI override */
    #trip-sensing-wrapper.trip-sense-wrapper-card {
        background: transparent !important;
        border: 0 !important;
        box-shadow: none !important;
        margin: 0 !important;
    }

    #trip-sensing-wrapper .trip-sense-tabs-head {
        background: transparent !important;
        border: 0 !important;
        border-bottom: 1px solid #d9e2ee !important;
        min-height: 72px !important;
        line-height: normal !important;
        padding: 26px 30px 0 !important;
    }

    #trip-sensing-wrapper .trip-sense-tabs {
        background: transparent !important;
        border: 0 !important;
        box-shadow: none !important;
        display: flex;
        gap: 20px;
        padding: 0 !important;
        margin: 0 !important;
    }

        #trip-sensing-wrapper .trip-sense-tabs::before,
        #trip-sensing-wrapper .trip-sense-tabs::after,
        #trip-sensing-wrapper .trip-sense-tabs li::before,
        #trip-sensing-wrapper .trip-sense-tabs li::after,
        #trip-sensing-wrapper .trip-sense-tabs a::before,
        #trip-sensing-wrapper .trip-sense-tabs a::after {
            display: none !important;
            content: none !important;
        }

        #trip-sensing-wrapper .trip-sense-tabs li,
        #trip-sensing-wrapper .trip-sense-tabs li.active {
            background: transparent !important;
            border: 0 !important;
            box-shadow: none !important;
            border-radius: 0 !important;
            margin: 0 !important;
            padding: 0 !important;
            height: 46px;
        }

            #trip-sensing-wrapper .trip-sense-tabs li a,
            #trip-sensing-wrapper .trip-sense-tabs li.active a,
            #trip-sensing-wrapper .trip-sense-tabs li a:hover,
            #trip-sensing-wrapper .trip-sense-tabs li a:focus {
                background: transparent !important;
                border: 0 !important;
                border-bottom: 3px solid transparent !important;
                box-shadow: none !important;
                border-radius: 0 !important;
                color: #8fa0bb !important;
                display: inline-flex;
                align-items: center;
                gap: 9px;
                height: 46px;
                padding: 0 38px 15px 38px !important;
                margin: 0 !important;
                opacity: 1 !important;
                font-size: 16px !important;
                font-weight: 800 !important;
                line-height: 1 !important;
            }

            #trip-sensing-wrapper .trip-sense-tabs li.active a {
                border-bottom-color: #c57935 !important;
                color: #c57935 !important;
            }

        #trip-sensing-wrapper .trip-sense-tabs .target-icon {
            color: currentColor !important;
            filter: none !important;
            font-size: 20px;
            margin: 0 !important;
        }

    #trip-sensing-wrapper .trip-sense-content-body {
        background: #f8fafc !important;
        padding: 36px 30px 0 !important;
    }

    #trip-sensing-logs-partial .trip-sense-log-card {
        margin: 0 !important;
        border-radius: 20px !important;
        border-color: #dfe7f1 !important;
        background: #fff !important;
    }

    #trip-sensing-logs-partial .trip-sense-log-toolbar {
        padding: 24px 24px 20px !important;
    }

    #trip-sensing-logs-partial .trip-sense-search-box input {
        max-width: 480px;
        height: 44px !important;
        font-size: 16px !important;
    }

    #trip-sensing-logs-partial .trip-sense-btn {
        font-size: 16px !important;
        display: inline-flex;
        align-items: center;
        gap: 9px;
    }

    #trip-sensing-logs-partial .trip-sense-primary-btn,
    #trip-sensing-logs-partial .trip-sense-export-btn {
        display: inline-flex;
        align-items: center;
        gap: 10px;
        justify-content: center;
        font-size: 16px !important;
        margin-bottom: 10px;
    }

    #trip-sensing-logs-partial .trip-sense-metric {
        height: 52px !important;
        min-width: 190px;
    }

    #trip-sensing-logs-partial .trip-sense-log-filter {
        background: #fff !important;
    }

        #trip-sensing-logs-partial .trip-sense-log-filter select {
            height: 38px !important;
            font-size: 16px !important;
            color: #111827 !important;
        }

    #trip-sensing-logs-partial .trip-sense-table {
        min-width: 1180px;
    }

        #trip-sensing-logs-partial .trip-sense-table thead th {
            background: #f7f9fc !important;
            color: #637592 !important;
            font-size: 14px !important;
            font-weight: 800 !important;
            padding: 22px 36px !important;
        }
    /* Trip Sense Events expected UI */
    #trip-sensing-event-partial .trip-sense-state-grid {
        display: grid;
        grid-template-columns: repeat(6, minmax(0, 1fr));
        gap: 24px;
        margin: 0 0 36px;
    }

    #trip-sensing-event-partial .trip-sense-state-card {
        min-height: 154px;
        background: #fff;
        border: 1px solid #dfe7f1;
        border-radius: 22px;
        padding: 26px 24px;
        display: flex;
        flex-direction: column;
        justify-content: flex-start;
    }

        #trip-sensing-event-partial .trip-sense-state-card label {
            margin: 0 0 10px;
            font-size: 12px;
            font-weight: 800;
            line-height: 1.1;
            letter-spacing: .8px;
            text-transform: uppercase;
            color: #8fa0bb;
        }

        #trip-sensing-event-partial .trip-sense-state-card strong {
            font-size: 30px;
            line-height: 1;
            font-weight: 800;
            color: #111827;
            margin-bottom: 18px;
        }

        #trip-sensing-event-partial .trip-sense-state-card span {
            font-size: 13px;
            font-weight: 600;
            color: #8fa0bb;
        }

        #trip-sensing-event-partial .trip-sense-state-card.transit label,
        #trip-sensing-event-partial .trip-sense-state-card.transit strong {
            color: #1d5cff;
        }

        #trip-sensing-event-partial .trip-sense-state-card.loading label,
        #trip-sensing-event-partial .trip-sense-state-card.loading strong {
            color: #a629ff;
        }

        #trip-sensing-event-partial .trip-sense-state-card.hauling label,
        #trip-sensing-event-partial .trip-sense-state-card.hauling strong {
            color: #c25c00;
        }

        #trip-sensing-event-partial .trip-sense-state-card.dumping label,
        #trip-sensing-event-partial .trip-sense-state-card.dumping strong {
            color: #d70c43;
        }

        #trip-sensing-event-partial .trip-sense-state-card.returns label,
        #trip-sensing-event-partial .trip-sense-state-card.returns strong {
            color: #008966;
        }

    #trip-sensing-event-partial .trip-sense-event-card {
        background: #fff;
        border: 1px solid #dfe7f1;
        border-radius: 20px;
        overflow: hidden;
    }

    #trip-sensing-event-partial .trip-sense-event-toolbar {
        padding: 24px;
        border-bottom: 1px solid #dfe7f1;
    }

    #trip-sensing-event-partial .trip-sense-event-filter {
        padding: 26px 24px 24px;
        border-bottom: 1px solid #edf2f7;
        background: #fff;
    }

        #trip-sensing-event-partial .trip-sense-event-filter label {
            color: #8b9db8;
            font-size: 12px;
            font-weight: 800;
            letter-spacing: .6px;
            text-transform: uppercase;
            margin-bottom: 8px;
        }

        #trip-sensing-event-partial .trip-sense-event-filter input,
        #trip-sensing-event-partial .trip-sense-event-filter select {
            height: 38px !important;
            border-radius: 11px !important;
            border: 1px solid #dbe4f0 !important;
            box-shadow: none !important;
            color: #111827 !important;
            font-size: 16px !important;
        }

    #trip-sensing-event-partial .trip-sense-event-table {
        min-width: 1060px;
    }

    @media only screen and (max-width: 1200px) {
        #trip-sensing-event-partial .trip-sense-state-grid {
            grid-template-columns: repeat(3, minmax(0, 1fr));
        }
    }

    @media only screen and (max-width: 767px) {
        #trip-sensing-event-partial .trip-sense-state-grid {
            grid-template-columns: repeat(1, minmax(0, 1fr));
            gap: 14px;
        }
    }
    /* Trip Sense child tab icon spacing */
    #trip-sensing-wrapper .trip-sense-tabs li a .target-icon {
        margin-right: 10px !important;
    }
    /* Trip Sense export CSV icon */
    .trip-sense-export-icon {
        flex: 0 0 auto;
        margin-right: 8px;
        vertical-align: middle;
    }
    /* Trip Sense search box exact spacing */
    #trip-sensing-wrapper .trip-sense-search-box {
        position: relative !important;
        width: 100%;
    }

        #trip-sensing-wrapper .trip-sense-search-box i {
            position: absolute !important;
            left: 18px !important;
            top: 50% !important;
            transform: translateY(-50%) !important;
            width: 20px;
            height: 20px;
            line-height: 20px !important;
            display: inline-flex !important;
            align-items: center;
            justify-content: center;
            color: #8fa0bb !important;
            font-size: 18px !important;
            pointer-events: none;
            z-index: 2;
        }

        #trip-sensing-wrapper .trip-sense-search-box input.form-control {
            height: 44px !important;
            min-height: 44px !important;
            border: 1px solid #dbe4f0 !important;
            border-radius: 18px !important;
            background: #fff !important;
            box-shadow: none !important;
            padding: 0 18px 0 54px !important;
            font-size: 16px !important;
            line-height: 44px !important;
            color: #33445f !important;
        }

            #trip-sensing-wrapper .trip-sense-search-box input.form-control::placeholder {
                color: #7f8796 !important;
                opacity: 1 !important;
            }
    /* Main Trip Sense tab icon */
    #cma_table_tab_tripsensing .trip-sense-main-icon {
        color: currentColor !important;
        width: 20px;
        height: 20px;
        margin-right: 8px;
        vertical-align: middle;
        filter: none !important;
    }
    /* Trip Sense Log tab pulse icon */
    #trip-sensing-wrapper .trip-sense-log-icon {
        width: 20px;
        height: 20px;
        color: currentColor !important;
        filter: none !important;
        flex: 0 0 auto;
    }
    /* Trip Sense Log table expected columns */
    #trip-sensing-logs-partial .trip-sense-table {
        min-width: 1580px !important;
    }

        #trip-sensing-logs-partial .trip-sense-table thead th {
            text-align: left !important;
            vertical-align: middle !important;
            text-transform: none !important;
            line-height: 1.35 !important;
            white-space: normal !important;
        }

        #trip-sensing-logs-partial .trip-sense-table tbody td {
            text-align: left !important;
            vertical-align: middle !important;
            white-space: normal !important;
            line-height: 1.35 !important;
        }

    #trip-sensing-logs-partial .trip-sense-digger-cell {
        color: #c56f2d !important;
        font-weight: 800 !important;
    }

    #trip-sensing-logs-partial .trip-sense-hauler-cell {
        color: #009b8f !important;
        font-weight: 800 !important;
    }
    /* Trip Sense Event expected table */
    .trip-sensing-event-expected .trip-sense-event-filter {
        padding: 18px 18px 16px;
    }

        .trip-sensing-event-expected .trip-sense-event-filter .row {
            display: flex;
            flex-wrap: nowrap;
            gap: 12px;
            margin-left: 0;
            margin-right: 0;
        }

            .trip-sensing-event-expected .trip-sense-event-filter .row > [class*="col-"] {
                flex: 1 1 0;
                max-width: none;
                padding-left: 0;
                padding-right: 0;
            }

        .trip-sensing-event-expected .trip-sense-event-filter label {
            color: #8da0bd;
            font-size: 12px;
            font-weight: 700;
            letter-spacing: .02em;
            margin-bottom: 8px;
            text-transform: none;
        }

        .trip-sensing-event-expected .trip-sense-event-filter .form-control {
            height: 31px;
            border: 1px solid #d9e3f2;
            border-radius: 7px;
            color: #102033;
            font-size: 14px;
            padding: 5px 12px;
            box-shadow: none;
        }

    .trip-sensing-event-expected .trip-sense-table thead th {
        height: 52px;
        background: #f6f9fd !important;
        border-bottom: 1px solid #dbe5f2;
        color: #607391 !important;
        font-size: 13px;
        font-weight: 700;
        letter-spacing: .02em;
        padding: 16px 26px;
        text-transform: none;
    }

    .trip-sensing-event-expected .trip-sense-table tbody td {
        height: 53px;
        color: #1c2c3f !important;
        font-size: 14px !important;
        padding: 14px 26px;
        vertical-align: middle;
    }

    .trip-sensing-event-expected .trip-sense-table tbody tr:nth-child(even) td {
        background: #fbfcfe !important;
    }

    .trip-sensing-event-expected .trip-sense-time-cell {
        color: #506789 !important;
        white-space: nowrap;
    }

        .trip-sensing-event-expected .trip-sense-time-cell i {
            color: #8aa0be;
            font-size: 14px;
            margin-right: 9px;
        }

    .trip-sensing-event-expected .trip-sense-equipment-no {
        color: #c66d2a !important;
        font-weight: 700 !important;
    }

    .trip-sense-category-pill,
    .trip-sense-material-pill {
        display: inline-flex;
        align-items: center;
        gap: 7px;
        min-height: 20px;
        border-radius: 5px;
        font-size: 12px;
        font-weight: 700;
        line-height: 18px;
        padding: 2px 10px;
    }

        .trip-sense-category-pill.trip {
            background: #eaf3ff;
            border: 1px solid #a8ceff;
            color: #1e6dff;
        }

        .trip-sense-category-pill.loading {
            background: #f8ecff;
            border: 1px solid #dfbdff;
            color: #871cff;
        }

        .trip-sense-category-pill.default {
            background: #eef4fb;
            border: 1px solid #d7e3f2;
            color: #607391;
        }

        .trip-sense-category-pill i {
            font-size: 10px;
        }

        .trip-sense-material-pill.default {
            background: #ffefc2;
            color: #c66d2a;
        }

        .trip-sense-material-pill.waste {
            background: #eef2f7;
            color: #42536a;
        }

    @media (max-width: 991px) {
        .trip-sensing-event-expected .trip-sense-event-filter .row {
            flex-wrap: wrap;
        }

            .trip-sensing-event-expected .trip-sense-event-filter .row > [class*="col-"] {
                flex: 1 1 calc(50% - 12px);
            }
    }

    /* Trip Sense Log expected table */
    .trip-sensing-logs-expected .trip-sense-log-filter-expected {
        padding: 16px 14px 15px;
        border-top: 1px solid #dbe5f2;
        background: #ffffff;
    }

        .trip-sensing-logs-expected .trip-sense-log-filter-expected .row {
            display: flex;
            flex-wrap: nowrap;
            gap: 12px;
            margin-left: 0;
            margin-right: 0;
        }

            .trip-sensing-logs-expected .trip-sense-log-filter-expected .row > [class*="col-"] {
                flex: 1 1 0;
                max-width: none;
                padding-left: 0;
                padding-right: 0;
            }

        .trip-sensing-logs-expected .trip-sense-log-filter-expected label {
            color: #8da0bd;
            font-size: 11px;
            font-weight: 700;
            letter-spacing: .02em;
            margin-bottom: 6px;
            text-transform: none;
        }

        .trip-sensing-logs-expected .trip-sense-log-filter-expected .form-control {
            height: 29px;
            border: 1px solid #d9e3f2;
            border-radius: 7px;
            color: #102033;
            font-size: 12px;
            padding: 4px 12px;
            box-shadow: none;
        }

    .trip-sensing-logs-expected .trip-sense-table thead th {
        height: 79px;
        background: #f6f9fd !important;
        border-bottom: 1px solid #dbe5f2;
        color: #607391 !important;
        font-size: 11px !important;
        font-weight: 700;
        letter-spacing: .02em;
        padding: 15px 14px !important;
        text-transform: none;
        vertical-align: middle;
    }

.trip-sensing-logs-expected .trip-sense-table tbody td {
    height: 80px;
    color: #354762 !important;
    /*        font-size: 12px !important;*/
    font-weight: 500;
    padding: 14px 14px;
    vertical-align: middle;
}

    .trip-sensing-logs-expected .trip-sense-table tbody tr:nth-child(even) td {
        background: #ffffff !important;
    }

    .trip-sensing-logs-expected .trip-sense-map-head,
    .trip-sensing-logs-expected .trip-sense-map-cell {
        width: 36px;
        min-width: 36px;
        max-width: 36px;
        text-align: center;
    }

        .trip-sensing-logs-expected .trip-sense-map-cell i {
            color: #8ea4c2;
            font-size: 22px;
        }

    .trip-sensing-logs-expected .trip-sense-digger-cell {
        color: #d16f2a !important;
        font-weight: 700 !important;
    }

    .trip-sensing-logs-expected .trip-sense-hauler-cell {
        color: #009a8a !important;
        font-weight: 700 !important;
    }

    .trip-sensing-logs-expected .trip-sense-material-pill {
        border-radius: 5px;
        display: inline-flex;
        min-height: 18px;
        align-items: center;
        padding: 1px 8px;
        font-size: 12px;
        font-weight: 700;
    }

        .trip-sensing-logs-expected .trip-sense-material-pill.default {
            background: #ffefc2;
            color: #c66d2a;
        }

        .trip-sensing-logs-expected .trip-sense-material-pill.waste {
            background: #eef2f7;
            color: #42536a;
        }

    @media (max-width: 991px) {
        .trip-sensing-logs-expected .trip-sense-log-filter-expected .row {
            flex-wrap: wrap;
        }

            .trip-sensing-logs-expected .trip-sense-log-filter-expected .row > [class*="col-"] {
                flex: 1 1 calc(50% - 12px);
            }
    }
    /* Trip Sense Log compact DataTable alignment */
    #trip-sensing-logs-partial.trip-sensing-logs-expected .trip-sense-log-card {
        border-radius: 12px !important;
        border-color: #dbe4f0 !important;
        margin: 0 !important;
        overflow: hidden !important;
    }

    #trip-sensing-logs-partial.trip-sensing-logs-expected .trip-sense-log-toolbar {
        padding: 16px !important;
        border-bottom: 1px solid #dbe4f0 !important;
    }

    #trip-sensing-logs-partial.trip-sensing-logs-expected .trip-sense-search-box input {
        height: 34px !important;
        max-width: none !important;
        border-radius: 10px !important;
        font-size: 13px !important;
    }

    #trip-sensing-logs-partial.trip-sensing-logs-expected .trip-sense-btn,
    #trip-sensing-logs-partial.trip-sensing-logs-expected .trip-sense-export-btn {
        height: 34px !important;
        border-radius: 10px !important;
        font-size: 13px !important;
        margin-bottom: 0 !important;
    }

    #trip-sensing-logs-partial.trip-sensing-logs-expected .trip-sense-metric {
        height: 34px !important;
        min-width: 128px !important;
        border-radius: 10px !important;
    }

    #trip-sensing-logs-partial.trip-sensing-logs-expected .trip-sense-log-filter-expected {
        padding: 14px 16px !important;
        border-top: 0 !important;
        border-bottom: 1px solid #e5ebf3 !important;
    }

        #trip-sensing-logs-partial.trip-sensing-logs-expected .trip-sense-log-filter-expected .row {
            display: grid !important;
            grid-template-columns: repeat(5, minmax(150px, 1fr)) !important;
            gap: 12px !important;
            margin: 0 !important;
        }

            #trip-sensing-logs-partial.trip-sensing-logs-expected .trip-sense-log-filter-expected .row > [class*="col-"] {
                max-width: none !important;
                padding: 0 !important;
                margin: 0 !important;
            }

        #trip-sensing-logs-partial.trip-sensing-logs-expected .trip-sense-log-filter-expected label {
            display: block !important;
            margin-bottom: 6px !important;
            color: #8797b6 !important;
            font-size: 11px !important;
            font-weight: 700 !important;
            letter-spacing: .5px !important;
            text-transform: none !important;
        }

        #trip-sensing-logs-partial.trip-sensing-logs-expected .trip-sense-log-filter-expected .form-control {
            height: 34px !important;
            border: 1px solid #d5dfec !important;
            border-radius: 8px !important;
            color: #0a2d55 !important;
            font-size: 13px !important;
            padding: 0 12px !important;
            box-shadow: none !important;
        }

    #trip-sensing-logs-partial.trip-sensing-logs-expected .trip-sense-table-wrap,
    #trip-sensing-logs-partial.trip-sensing-logs-expected .dataTables_scroll,
    #trip-sensing-logs-partial.trip-sensing-logs-expected .dataTables_scrollHead,
    #trip-sensing-logs-partial.trip-sensing-logs-expected .dataTables_scrollHeadInner {
        width: 100% !important;
    }

    #trip-sensing-logs-partial.trip-sensing-logs-expected #tripSenseLogTable {
        border-collapse: collapse !important;
        margin: 0 !important;
        min-width: 1580px !important;
        width: 100% !important;
    }

    #trip-sensing-logs-partial.trip-sensing-logs-expected .trip-sense-table thead th,
    #trip-sensing-logs-partial.trip-sensing-logs-expected .dataTables_scrollHead thead th {
        height: auto !important;
        background: #f4f7fb !important;
        border-bottom: 1px solid #dbe4f0 !important;
        color: #526b91 !important;
        font-size: 12px !important;
        font-weight: 800 !important;
        letter-spacing: .3px !important;
        line-height: 1.25 !important;
        padding: 14px 18px !important;
        text-align: left !important;
        text-transform: none !important;
        vertical-align: middle !important;
        white-space: normal !important;
    }

    #trip-sensing-logs-partial.trip-sensing-logs-expected .trip-sense-table tbody td {
        height: auto !important;
        border-top: 0 !important;
        color: #0b2c53 !important;
/*        font-size: 13px !important;*/
/*        font-weight: 500 !important;*/
        line-height: 1.25 !important;
        padding: 14px 18px !important;
        text-align: left !important;
        vertical-align: middle !important;
        white-space: normal !important;
    }

    #trip-sensing-logs-partial.trip-sensing-logs-expected .trip-sense-table tbody tr:nth-child(even) td {
        background: #fbfcfe !important;
    }

    #trip-sensing-logs-partial.trip-sensing-logs-expected .trip-sense-table .trip-sense-map-cell,
    #trip-sensing-logs-partial.trip-sensing-logs-expected .trip-sense-table .trip-sense-map-head {
        width: 42px !important;
        min-width: 42px !important;
        max-width: 42px !important;
        padding-left: 16px !important;
        padding-right: 8px !important;
        text-align: center !important;
    }

    #trip-sensing-logs-partial.trip-sensing-logs-expected .locate-route-btn {
        width: 18px !important;
        height: 18px !important;
        min-width: 18px !important;
        padding: 0 !important;
        border-radius: 4px !important;
    }

    #trip-sensing-logs-partial.trip-sensing-logs-expected .trip-sense-digger-cell {
        color: #c46b27 !important;
        font-weight: 800 !important;
    }

    #trip-sensing-logs-partial.trip-sensing-logs-expected .trip-sense-hauler-cell {
        color: #009b8f !important;
        font-weight: 800 !important;
    }

    #trip-sensing-logs-partial.trip-sensing-logs-expected .dataTables__top {
        display: none !important;
    }

    #trip-sensing-logs-partial.trip-sensing-logs-expected .dataTables__bottom {
        padding: 12px 16px !important;
    }

    @media (max-width: 1100px) {
        #trip-sensing-logs-partial.trip-sensing-logs-expected .trip-sense-log-filter-expected .row {
            grid-template-columns: repeat(2, minmax(160px, 1fr)) !important;
        }
    }

    #trip-sensing-logs-partial.trip-sensing-logs-expected .trip-sense-log-filter-grid {
        display: grid !important;
        grid-template-columns: repeat(5, minmax(0, 1fr)) !important;
        gap: 10px !important;
        width: 100% !important;
    }

    #trip-sensing-logs-partial.trip-sensing-logs-expected .trip-sense-log-filter-item {
        min-width: 0 !important;
    }

        #trip-sensing-logs-partial.trip-sensing-logs-expected .trip-sense-log-filter-item label {
            display: block !important;
            margin-bottom: 5px !important;
            color: #8797b6 !important;
            font-size: 11px !important;
            font-weight: 700 !important;
            line-height: 1 !important;
        }

        #trip-sensing-logs-partial.trip-sensing-logs-expected .trip-sense-log-filter-item .form-control {
            width: 100% !important;
        }

    @media (max-width: 1100px) {
        #trip-sensing-logs-partial.trip-sensing-logs-expected .trip-sense-log-filter-grid {
            grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        }
    }

    #trip-sensing-logs-partial.trip-sensing-logs-expected .trip-sense-log-toolbar > .row {
        display: flex !important;
        align-items: center !important;
        justify-content: space-between !important;
        gap: 12px !important;
        margin: 0 !important;
    }

        #trip-sensing-logs-partial.trip-sensing-logs-expected .trip-sense-log-toolbar > .row > .col-lg-4,
        #trip-sensing-logs-partial.trip-sensing-logs-expected .trip-sense-log-toolbar > .row > .col-auto {
            width: auto !important;
            max-width: none !important;
            flex: 0 0 auto !important;
            padding: 0 !important;
            margin: 0 !important;
        }

    #trip-sensing-logs-partial.trip-sensing-logs-expected .trip-sense-search-box {
        width: 250px !important;
        flex: 0 0 250px !important;
    }

    #trip-sensing-logs-partial.trip-sensing-logs-expected #tripSenseLogReset {
        margin-left: 10px !important;
    }

    #trip-sensing-logs-partial.trip-sensing-logs-expected .trip-sense-log-toolbar .mx-5.px-5 {
        display: none !important;
    }
    /* Trip Sense Log toolbar final alignment */
    #trip-sensing-logs-partial.trip-sensing-logs-expected .trip-sense-log-toolbar {
        width: 100% !important;
    }

        #trip-sensing-logs-partial.trip-sensing-logs-expected .trip-sense-log-toolbar > .row {
            display: flex !important;
            width: 100% !important;
            max-width: none !important;
            align-items: center !important;
            justify-content: space-between !important;
            gap: 12px !important;
            margin-left: 0 !important;
            margin-right: 0 !important;
        }

            #trip-sensing-logs-partial.trip-sensing-logs-expected .trip-sense-log-toolbar > .row > .col-lg-4 {
                flex: 1 1 auto !important;
                width: auto !important;
                max-width: none !important;
                justify-content: flex-start !important;
                padding-left: 0 !important;
                padding-right: 0 !important;
            }

            #trip-sensing-logs-partial.trip-sensing-logs-expected .trip-sense-log-toolbar > .row > .col-auto {
                flex: 0 0 auto !important;
                width: auto !important;
                max-width: none !important;
                justify-content: flex-end !important;
                padding-left: 0 !important;
                padding-right: 0 !important;
                margin-left: auto !important;
            }

    #trip-sensing-logs-partial.trip-sensing-logs-expected .trip-sense-search-box {
        width: 250px !important;
        max-width: 250px !important;
        flex: 0 0 250px !important;
    }

    #trip-sensing-logs-partial.trip-sensing-logs-expected .trip-sense-log-toolbar .d-flex {
        display: flex !important;
    }

    #trip-sensing-logs-partial.trip-sensing-logs-expected .trip-sense-log-toolbar-row {
        display: flex !important;
        width: 100% !important;
        align-items: center !important;
        justify-content: space-between !important;
        gap: 14px !important;
    }

    #trip-sensing-logs-partial.trip-sensing-logs-expected .trip-sense-log-toolbar-left,
    #trip-sensing-logs-partial.trip-sensing-logs-expected .trip-sense-log-toolbar-right {
        display: flex !important;
        align-items: center !important;
        min-width: 0 !important;
    }

    #trip-sensing-logs-partial.trip-sensing-logs-expected .trip-sense-log-toolbar-left {
        flex: 1 1 auto !important;
        justify-content: flex-start !important;
    }

    #trip-sensing-logs-partial.trip-sensing-logs-expected .trip-sense-log-toolbar-right {
        flex: 0 0 auto !important;
        justify-content: flex-end !important;
        margin-left: auto !important;
    }
    /* Trip Sense Log fit-to-screen table */
    #trip-sensing-logs-partial.trip-sensing-logs-expected .trip-sense-table-wrap {
        overflow-x: hidden !important;
        width: 100% !important;
    }

    #trip-sensing-logs-partial.trip-sensing-logs-expected #tripSenseLogTable,
    #trip-sensing-logs-partial.trip-sensing-logs-expected .trip-sense-table {
        width: 100% !important;
        min-width: 0 !important;
        table-layout: fixed !important;
    }

        #trip-sensing-logs-partial.trip-sensing-logs-expected #tripSenseLogTable thead th,
        #trip-sensing-logs-partial.trip-sensing-logs-expected #tripSenseLogTable tbody td {
            padding: 9px 6px !important;
/*            font-size: 11px !important;*/
            line-height: 1.2 !important;
            white-space: normal !important;
            word-break: normal !important;
            overflow-wrap: anywhere !important;
        }

        #trip-sensing-logs-partial.trip-sensing-logs-expected #tripSenseLogTable thead th {
            font-size: 10.5px !important;
            text-align: center !important;
        }

        #trip-sensing-logs-partial.trip-sensing-logs-expected #tripSenseLogTable tbody td {
            text-align: center !important;
        }

        #trip-sensing-logs-partial.trip-sensing-logs-expected #tripSenseLogTable th.trip-sense-map-head,
        #trip-sensing-logs-partial.trip-sensing-logs-expected #tripSenseLogTable td.trip-sense-map-cell {
            width: 28px !important;
            min-width: 28px !important;
            max-width: 28px !important;
            padding-left: 4px !important;
            padding-right: 4px !important;
        }

        #trip-sensing-logs-partial.trip-sensing-logs-expected #tripSenseLogTable th:nth-child(2),
        #trip-sensing-logs-partial.trip-sensing-logs-expected #tripSenseLogTable th:nth-child(3) {
            width: 105px !important;
        }

        #trip-sensing-logs-partial.trip-sensing-logs-expected #tripSenseLogTable th:nth-child(4) {
            width: 52px !important;
        }

        #trip-sensing-logs-partial.trip-sensing-logs-expected #tripSenseLogTable th:nth-child(5),
        #trip-sensing-logs-partial.trip-sensing-logs-expected #tripSenseLogTable th:nth-child(6) {
            width: 88px !important;
        }

        #trip-sensing-logs-partial.trip-sensing-logs-expected #tripSenseLogTable th:nth-child(n+7) {
            width: 78px !important;
        }

    #trip-sensing-logs-partial.trip-sensing-logs-expected .trip-sense-material-pill {
        padding: 1px 5px !important;
        font-size: 10px !important;
        min-height: 15px !important;
    }
    /* Trip Sense Log brown table theme */
    #trip-sensing-logs-partial.trip-sensing-logs-expected .trip-sense-log-card {
        border-color: #ead8c8 !important;
        background: #fffdfb !important;
    }

    #trip-sensing-logs-partial.trip-sensing-logs-expected .trip-sense-log-toolbar,
    #trip-sensing-logs-partial.trip-sensing-logs-expected .trip-sense-log-filter-expected {
        background: #fffdfb !important;
        border-color: #ead8c8 !important;
    }

        #trip-sensing-logs-partial.trip-sensing-logs-expected .trip-sense-log-filter-item label,
        #trip-sensing-logs-partial.trip-sensing-logs-expected .trip-sense-log-filter-expected label {
            color: #9a744d !important;
        }

        #trip-sensing-logs-partial.trip-sensing-logs-expected .trip-sense-search-box input,
        #trip-sensing-logs-partial.trip-sensing-logs-expected .trip-sense-log-filter-item .form-control,
        #trip-sensing-logs-partial.trip-sensing-logs-expected .trip-sense-log-filter-expected .form-control,
        #trip-sensing-logs-partial.trip-sensing-logs-expected .trip-sense-btn,
        #trip-sensing-logs-partial.trip-sensing-logs-expected .trip-sense-export-btn,
        #trip-sensing-logs-partial.trip-sensing-logs-expected .trip-sense-metric {
            border-color: #e5cdb8 !important;
            background: #fffdfb !important;
        }

#trip-sensing-logs-partial.trip-sensing-logs-expected #tripSenseLogTable thead th {
    background: #faf8f5 !important;
    border-top: 1px solid #ead8c8 !important;
    border-bottom: 1px solid #ead8c8 !important;
    color: #7c5a3a !important;
}

    #trip-sensing-logs-partial.trip-sensing-logs-expected #tripSenseLogTable tbody td {
        color: #2d241d !important;
        border-bottom: 1px solid #f1e4d9 !important;
    }

    #trip-sensing-logs-partial.trip-sensing-logs-expected #tripSenseLogTable tbody tr:nth-child(even) td {
        background: #fffaf5 !important;
    }

    #trip-sensing-logs-partial.trip-sensing-logs-expected #tripSenseLogTable tbody tr:nth-child(odd) td {
        background: #ffffff !important;
    }

    #trip-sensing-logs-partial.trip-sensing-logs-expected #tripSenseLogTable tbody tr:hover td {
        background: #fff3e8 !important;
    }

    #trip-sensing-logs-partial.trip-sensing-logs-expected #tripSenseLogTable_wrapper {
        width: 100% !important;
        display: block !important;
        box-sizing: border-box !important;
        position: relative !important;
    }

    #trip-sensing-logs-partial.trip-sensing-logs-expected .dataTables__bottom {
        background: #fff8f1 !important;
        border-top: 1px solid #ead8c8 !important;
        width: 100% !important;
        display: flex !important;
        justify-content: center !important;
        box-sizing: border-box !important;
        position: sticky !important;
        left: 0 !important;
        bottom: 0 !important;
        z-index: 2 !important;
    }

        #trip-sensing-logs-partial.trip-sensing-logs-expected .dataTables__bottom .dataTables_info,
        #trip-sensing-logs-partial.trip-sensing-logs-expected .dataTables__bottom .dataTables_paginate span {
            color: #7c5a3a !important;
        }

        #trip-sensing-logs-partial.trip-sensing-logs-expected .dataTables__bottom .dataTables_info,
        #trip-sensing-logs-partial.trip-sensing-logs-expected .dataTables__bottom .dataTables_paginate:not(#pager_container) {
            display: none !important;
        }

        #trip-sensing-logs-partial.trip-sensing-logs-expected .dataTables__bottom #pager_container {
            width: 100% !important;
            display: flex !important;
            align-items: center !important;
            justify-content: center !important;
            box-sizing: border-box !important;
        }
    /* Live Events and Trip Sensing Events brown table theme */
    .live-events-wrap .live-events-panel,
    #trip-sensing-event-partial .live-events-panel {
        border-color: #ead8c8 !important;
        background: #fffdfb !important;
    }

    .live-events-wrap .live-events-toolbar,
    .live-events-wrap .live-events-filterbar,
    #trip-sensing-event-partial .live-events-toolbar,
    #trip-sensing-event-partial .live-events-filterbar {
        background: #fffdfb !important;
        border-color: #ead8c8 !important;
    }

    .live-events-wrap .live-filter label,
    #trip-sensing-event-partial .live-filter label {
        color: #9a744d !important;
    }

    .live-events-wrap .live-events-search,
    .live-events-wrap .live-events-btn,
    .live-events-wrap .live-filter input,
    .live-events-wrap .live-filter select,
    #trip-sensing-event-partial .live-events-search,
    #trip-sensing-event-partial .live-events-btn,
    #trip-sensing-event-partial .live-filter input,
    #trip-sensing-event-partial .live-filter select {
        border-color: #e5cdb8 !important;
        background: #fffdfb !important;
    }

    .live-events-wrap #tblLiveEvents thead th,
    #trip-sensing-event-partial #tripSenseEventTable thead th {
        background: #fff8f1 !important;
        border-top: 1px solid #ead8c8 !important;
        border-bottom: 1px solid #ead8c8 !important;
        color: #7c5a3a !important;
    }

    .live-events-wrap #tblLiveEvents tbody td,
    #trip-sensing-event-partial #tripSenseEventTable tbody td {
        color: #2d241d !important;
        border-bottom: 1px solid #f1e4d9 !important;
    }

    .live-events-wrap #tblLiveEvents tbody tr:nth-child(even) td,
    #trip-sensing-event-partial #tripSenseEventTable tbody tr:nth-child(even) td {
        background: #fffaf5 !important;
    }

    .live-events-wrap #tblLiveEvents tbody tr:nth-child(odd) td,
    #trip-sensing-event-partial #tripSenseEventTable tbody tr:nth-child(odd) td {
        background: #ffffff !important;
    }

    .live-events-wrap #tblLiveEvents tbody tr:hover td,
    #trip-sensing-event-partial #tripSenseEventTable tbody tr:hover td {
        background: #fff3e8 !important;
    }

    .live-events-wrap .dataTables__bottom,
    #trip-sensing-event-partial .dataTables__bottom,
    #trip-sensing-event-partial .trip-sense-event-pager {
        background: #fff8f1 !important;
        border-top: 1px solid #ead8c8 !important;
    }

        .live-events-wrap .dataTables__bottom .dataTables_info,
        .live-events-wrap .dataTables__bottom .dataTables_paginate span,
        #trip-sensing-event-partial .dataTables__bottom .dataTables_info,
        #trip-sensing-event-partial .dataTables__bottom .dataTables_paginate span {
            color: #7c5a3a !important;
        }

    .GeneralDetails_craftmyapp_containers .col-sm-12:first-child {
        width: 100%;
        padding: 0 !important;
    }

    .GeneralDetails_craftmyapp_containers .col-sm-12:last-child {
        width: auto;
        padding: 0 !important;
        position: absolute;
        right: 50px;
        z-index: 99;
    }

    .form-group.form-group--float-above {
        width: 100%;
    }

    @media (min-width: 320px) and (max-width: 1023px) {
        .page-header-box {
            align-items: center !important;
        }
    }

    .row.w-100.Add_S_Allocation::before, .row.w-100.Add_S_Allocation::after {
        display: none !important;
    }

    .row.w-100.Add_S_Allocation {
        display: grid;
        grid-template-columns: auto auto;
    }

    .col-lg-9.col-sm-6.col-sm-9.p-0.content-column.w-72 {
        width: 100% !important;
        flex: 1;
        padding-inline: 10px !important;
    }

    .col-lg-3.col-sm-6.col-ms-3.pr-0.w-28 {
        width: 350px !important;
    }

    @media (max-width: 992px) {
        div#map-tab-content .row.p-3 {
            flex-direction: column;
        }

        .col-lg-3.col-sm-6.col-ms-3.pr-0.w-28 {
            width: 100% !important;
        }

        div#map {
            height: 60vh;
            margin-top: 20px;
        }

        .main-content {
            height: 100% !important;
        }
    }

    .row.login_section .col-xl-5.col-lg-5.col-md-12.col-sm-12 {
        flex-direction: column;
        align-items: center;
        justify-content: center !important;
    }

    .row.performance-tab .row.performance-tab {
        display: flex !important;
    }

    .daily_shift .filter_card.card {
        display: none;
    }
    /*.page-header-box {
    width: calc(100% - 95px) !important;
    margin-left: auto;
}*/
/*    .row.w-100.Add_S_Allocation {
        width: calc(100% - 118px) !important;
    }*/

    .page-header-menu-section {
        width: 100%;
        justify-content: end;
    }

    @media (max-width:1203px) {
        .row.w-100.Add_S_Allocation {
            display: flex;
            flex-direction: column;
            gap: 10px;
        }

        .page-header-theme .vertical-tabs.theme-tab {
            top: 13px;
        }

        .page-header-menu-section {
            justify-content: start;
        }

        .page-header-box {
            width: 100% !important;
        }

        .menubar-hoverable.header-fixed #base .row.daily_shift {
            padding-top: 113px !important;
        }

        .dashboard_wrapper .col-sm-12 span {
            font-size: clamp(12px,2.5vw,17px) !important;
        }

        .Add_S_Allocation .col-lg-5.col-md-5.col-sm-12 {
            justify-content: start !important;
        }
    }

    @media (min-width:1203px) {
        .menubar-hoverable.header-fixed #base:has(.table-responsive) {
            padding-top: 63px !important;
        }
    }

    @media (max-width:890px) {
        .Add_S_Allocation .col-lg-5.col-md-5.col-sm-12 {
            max-width: 100% !important;
        }

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

        .brown-theme .filter-item span img {
            width: 24px;
        }

        span.shift-icon {
            width: 24px;
        }

            span.shift-icon svg {
                width: 14px;
                height: 14px;
            }
    }

    @media (max-width:767px) {
        .page-header-box {
            padding-block: 10px !important;
        }

            .page-header-box .btn-icon-toggle.menubar-toggle {
                position: unset !important;
            }

            .page-header-box h1 {
                max-width: 240px;
            }

        .page-header-box {
            width: 100% !important;
        }

        .Add_S_Allocation .col-lg-5.col-md-5.col-sm-12 {
            max-width: 96% !important;
        }

        .vertical-tabs .tab {
            height: 27px;
        }

        .page-header-theme .vertical-tabs.theme-tab {
            top: 13px;
            width: 88px;
            right: 0;
        }

        .Add_S_Allocation .select2-container .select2-selection--single .select2-selection__rendered {
            padding: 0 !important;
        }

        .page-header-box h1 span, .brown-theme .form-control {
            font-size: 10px !important;
        }

        .Add_S_Allocation .edit_ico svg {
            width: 12px;
            height: 12px;
        }

        .Add_S_Allocation .edit_ico {
            width: 16px;
            height: 16px;
            margin: 0px;
        }

        .cls_assignment_shift_dd .select2-container--default .select2-selection--single {
            font-size: 10px !important;
        }
    }

    .menubar-hoverable.header-fixed .main-content:has(#map-tab-content) {
        padding-top: 0 !important;
    }

    @media (max-width:1118px) {
        div#map-tab-content {
            padding-top: 44px;
        }
    }

    .info-box:first-child {
        min-width: 287px;
    }

    .info-box {
        min-width: 227px;
    }

    .info-container {
        max-width: 1100px;
        overflow: auto;
    }

    .card.assignement-card.request-card-list.idle .card-head:before, #tab-sector-content .card-head.Assesment_card:before {
        content: unset;
    }

.workspace-left-panel {
    background: #fff;
    padding-top: 10px;
    border-radius: 8px;
    border: 1px solid #eadecf;
}


    .routes-section-header {
        padding-inline: 20px !important;
    }

    section.routes-section-header .section-title {
        margin: 0 !important;
    }

    .routes-grid {
        gap: 0 !important;
    }

    .route-row-card {
        border-radius: unset !important;
    }

    .menubar-hoverable.header-fixed #base:has(.Add_S_Allocation) {
        padding-top: 0px !important;
    }

    body {
        padding: 0 !important;
    }

    section.main-content:has(.cma_table_tab_assignment) {
        padding: 0 !important;
    }

    .daily_shift .dashboard_wrapper:has(.assignmenthead-card) {
        padding-inline: 20px;
    }

.daily_shift .dashboard-container:has(.workspace-split-wrapper) {
    padding: 20px;
    background: #faf8f5;
    margin-top:0 !important;
}

    #dropdown_container, .gui-controls > li.open > .menu-dropdown ul {
        border-left: 0px solid #fee68566;
        padding-left: 0px;
    }

    .nano.has-scrollbar .gui-controls li .menu-dropdown ul li::before {
        content: "";
        display: block;
        left: 0;
        border-left: 1px solid #fee68566;
        border-bottom: 1px solid #fee68566;
        width: 16px;
        height: 53%;
        border-bottom-left-radius: 4px;
        top: 0%;
    }

    .nano.has-scrollbar .gui-controls li .menu-dropdown ul li:hover::before {
        border-color: #c98a51 !important;
    }

/*.nano.has-scrollbar .gui-controls li:hover > a {
    background: #faf8f5;
    border-radius: unset;
}*/
.workspace-split-wrapper .no-haulers-pill {
    font-size: 12px;
}

.workspace-split-wrapper .linear-timeline-rail::before {
    background: #eadecf;
}
.workspace-split-wrapper button.locate-route-btn, .workspace-split-wrapper button.copy-route-btn, .workspace-split-wrapper .hub-destination-pill {
    background: #f4f0ec;
    border-color: #eadecf;
}

.workspace-split-wrapper button.locate-route-btn svg, .workspace-split-wrapper button.copy-route-btn svg {
    stroke: #9d9a9a
}
    .workspace-split-wrapper .utility-btn {
    border-color: #eadecf;
    color: #706253;
}
.workspace-split-wrapper .utility-btn:hover {
    border-color:#eadecf !important;
}
    .workspace-split-wrapper .badge-sh-id {
    background: #f0c8a6;
    color: #592c08;
    border: 1px solid #dc9d6f;
    min-height: auto;
}
input#asset-search-filter {
    background: #faf8f5;
}
nav.asset-tabs-header {
    background: #faf8f5;
    padding: 5px;
    border-radius: 8px;
    border: 1px solid #eadecf;
}
button.asset-tab-trigger.active {
    background: #fff !important;
    border: 1px solid #eadecf !important;
}
.asset-tab-trigger.active::after{
    content:unset !important;
}
.asset-tab-trigger {
    border-radius: 8px;
    justify-content:center;
    flex: 1;
}
.asset-title-text {
    font-size: 1.2rem !important;
}
.telemetry-page-inner {
    background: #fff !important;
}
.asset-avatar {
    min-width: 30px;
    height: 30px !important;
    font-size: 1.2rem !important;
}
.nano.has-scrollbar .gui-controls li .menu-dropdown ul li:after {
    content: "";
    width: 1px;
    height: 66%;
    position: absolute;
    top: -22px;
    left: 0px;
    display: block;
    background: #fee68566;
}
section.main-content:has(#cma_table_tab_assignment) ul.nav.nav-tabs.nav-b.perform_nav.perform_nav_new {
    background: #fff !important;
    border: 1px solid #f1ddc5 !important;
    border-radius: 8px !important;
    box-shadow: 0 8px 20px rgba(181, 116, 35, 0.08) !important;
    gap: 8px;
    min-height: 54px;
    overflow-x: auto;
    padding: 8px 10px !important;
    scrollbar-width: thin;
}

section.main-content:has(#cma_table_tab_assignment) ul.nav.nav-tabs.nav-b.perform_nav.perform_nav_new > li,
section.main-content:has(#cma_table_tab_assignment) ul.nav.nav-tabs.nav-b.perform_nav.perform_nav_new > li:nth-child(8),
section.main-content:has(#cma_table_tab_assignment) ul.nav.nav-tabs.nav-b.perform_nav.perform_nav_new > li:nth-child(9),
section.main-content:has(#cma_table_tab_assignment) ul.nav.nav-tabs.nav-b.perform_nav.perform_nav_new > li:nth-child(10) {
    margin: 0 !important;
    padding: 0 !important;
    z-index: auto !important;
}

section.main-content:has(#cma_table_tab_assignment) ul.nav.nav-tabs.nav-b.perform_nav.perform_nav_new > li > a,
.brown-theme section.main-content:has(#cma_table_tab_assignment) ul.nav.nav-tabs.nav-b.perform_nav.perform_nav_new > li > a,
section.main-content:has(#cma_table_tab_assignment) ul.nav.nav-tabs.nav-b.perform_nav.perform_nav_new > li.active > a,
.brown-theme section.main-content:has(#cma_table_tab_assignment) ul.nav.nav-tabs.nav-b.perform_nav.perform_nav_new > li.active > a {
    align-items: center !important;
    background: #fff !important;
    border: 1px solid #efd8bd !important;
    border-radius: 7px !important;
    color: #6f6256 !important;
    display: inline-flex !important;
    font-size: 12px !important;
    font-weight: 700 !important;
    gap: 7px;
    height: 38px !important;
    justify-content: center !important;
    line-height: 1 !important;
    min-width: 104px;
    padding: 0 14px !important;
    white-space: nowrap;
}

section.main-content:has(#cma_table_tab_assignment) ul.nav.nav-tabs.nav-b.perform_nav.perform_nav_new > li > a:hover,
.brown-theme section.main-content:has(#cma_table_tab_assignment) ul.nav.nav-tabs.nav-b.perform_nav.perform_nav_new > li > a:hover,
section.main-content:has(#cma_table_tab_assignment) ul.nav.nav-tabs.nav-b.perform_nav.perform_nav_new > li > a:focus,
.brown-theme section.main-content:has(#cma_table_tab_assignment) ul.nav.nav-tabs.nav-b.perform_nav.perform_nav_new > li > a:focus {
    background: #fff4e7 !important;
    border-color: #d89a58 !important;
    color: #b57423 !important;
}

section.main-content:has(#cma_table_tab_assignment) ul.nav.nav-tabs.nav-b.perform_nav.perform_nav_new > li.active > a,
.brown-theme section.main-content:has(#cma_table_tab_assignment) ul.nav.nav-tabs.nav-b.perform_nav.perform_nav_new > li.active > a {
    background: #c67b25 !important;
    border-color: #c67b25 !important;
    box-shadow: 0 8px 16px rgba(181, 116, 35, 0.18);
    color: #fff !important;
}

section.main-content:has(#cma_table_tab_assignment) ul.nav.nav-tabs.nav-b.perform_nav.perform_nav_new > li > a img,
.brown-theme section.main-content:has(#cma_table_tab_assignment) ul.nav.nav-tabs.nav-b.perform_nav.perform_nav_new > li > a img,
section.main-content:has(#cma_table_tab_assignment) ul.nav.nav-tabs.nav-b.perform_nav.perform_nav_new > li > a svg,
.brown-theme section.main-content:has(#cma_table_tab_assignment) ul.nav.nav-tabs.nav-b.perform_nav.perform_nav_new > li > a svg {
    flex: 0 0 auto;
    height: 16px !important;
    margin: 0;
    position: static !important;
    top: auto !important;
    width: 16px !important;
}

section.main-content:has(#cma_table_tab_assignment) ul.nav.nav-tabs.nav-b.perform_nav.perform_nav_new > li > a img,
.brown-theme section.main-content:has(#cma_table_tab_assignment) ul.nav.nav-tabs.nav-b.perform_nav.perform_nav_new > li > a img {
    filter: invert(47%) sepia(35%) saturate(891%) hue-rotate(353deg) brightness(91%) contrast(89%) !important;
}

section.main-content:has(#cma_table_tab_assignment) ul.nav.nav-tabs.nav-b.perform_nav.perform_nav_new > li.active > a img,
.brown-theme section.main-content:has(#cma_table_tab_assignment) ul.nav.nav-tabs.nav-b.perform_nav.perform_nav_new > li.active > a img {
    filter: brightness(0) invert(1) !important;
}

section.main-content:has(#cma_table_tab_assignment) ul.nav.nav-tabs.nav-b.perform_nav.perform_nav_new > li > a svg,
.brown-theme section.main-content:has(#cma_table_tab_assignment) ul.nav.nav-tabs.nav-b.perform_nav.perform_nav_new > li > a svg {
    color: #b57423 !important;
}

section.main-content:has(#cma_table_tab_assignment) ul.nav.nav-tabs.nav-b.perform_nav.perform_nav_new > li.active > a svg,
.brown-theme section.main-content:has(#cma_table_tab_assignment) ul.nav.nav-tabs.nav-b.perform_nav.perform_nav_new > li.active > a svg {
    color: #fff !important;
}
section.main-content:has(#cma_table_tab_assignment) ul.nav.nav-tabs.nav-b.perform_nav.perform_nav_new > li:last-child {
    align-items: center !important;
    display: flex !important;
    flex: 0 0 auto;
    margin-left: auto !important;
    padding: 0 !important;
    z-index: auto !important;
}

section.main-content:has(#cma_table_tab_assignment) .monitor-toggle-wrap {
    align-items: center !important;
    background: #e7e5e4 !important;
    border: 0 !important;
    border-radius: 999px !important;
    box-shadow: 0 2px 3px rgba(0, 0, 0, 0.10) inset !important;
    cursor: pointer;
    display: inline-grid !important;
    grid-template-columns: 1fr 1fr;
    height: 32px !important;
    justify-content: center !important;
    padding: 3px !important;
    position: relative !important;
    user-select: none;
    width: 80px !important;
}

section.main-content:has(#cma_table_tab_assignment) .monitor-toggle-label {
    display: contents !important;
    height: auto !important;
    pointer-events: none;
    position: static !important;
    width: auto !important;
}

section.main-content:has(#cma_table_tab_assignment) .monitor-toggle-switch {
    background: transparent !important;
    border: 0 !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    display: contents !important;
    height: 0 !important;
    position: static !important;
    width: 0 !important;
}

section.main-content:has(#cma_table_tab_assignment) .monitor-toggle-knob {
    background: #fff !important;
    border: 1px solid #b57423 !important;
    border-radius: 999px !important;
    box-shadow: 0 2px 5px rgba(181, 116, 35, 0.18) !important;
    height: 26px !important;
    left: 3px !important;
    padding: 0 !important;
    position: absolute !important;
    top: 3px !important;
    transition: left 0.2s ease !important;
    width: 34px !important;
    z-index: 1 !important;
}

section.main-content:has(#cma_table_tab_assignment) .monitor-toggle-wrap.monitor-on .monitor-toggle-knob {
    left: 41px !important;
}

section.main-content:has(#cma_table_tab_assignment) .monitor-icon-off,
section.main-content:has(#cma_table_tab_assignment) .monitor-icon-on,
section.main-content:has(#cma_table_tab_assignment) .monitor-toggle-wrap.monitor-on .monitor-icon-off,
section.main-content:has(#cma_table_tab_assignment) .monitor-toggle-wrap.monitor-on .monitor-icon-on {
    align-items: center !important;
    display: inline-flex !important;
    height: 26px !important;
    justify-content: center !important;
    position: relative !important;
    top: auto !important;
    width: 36px !important;
    z-index: 2 !important;
}

section.main-content:has(#cma_table_tab_assignment) .monitor-icon-off,
section.main-content:has(#cma_table_tab_assignment) .monitor-toggle-wrap.monitor-on .monitor-icon-off {
    grid-column: 1;
    left: auto !important;
    right: auto !important;
}

section.main-content:has(#cma_table_tab_assignment) .monitor-icon-on,
section.main-content:has(#cma_table_tab_assignment) .monitor-toggle-wrap.monitor-on .monitor-icon-on {
    grid-column: 2;
    left: auto !important;
    right: auto !important;
}

section.main-content:has(#cma_table_tab_assignment) .monitor-icon-off svg,
section.main-content:has(#cma_table_tab_assignment) .monitor-icon-on svg {
    height: 15px !important;
    width: 15px !important;
}

@media only screen and (max-width: 767px) {
    section.main-content:has(#cma_table_tab_assignment) ul.nav.nav-tabs.nav-b.perform_nav.perform_nav_new {
        border-radius: 0 !important;
        gap: 6px;
        margin-inline: -10px;
        padding: 8px 10px !important;
    }

    section.main-content:has(#cma_table_tab_assignment) ul.nav.nav-tabs.nav-b.perform_nav.perform_nav_new > li > a,
    .brown-theme section.main-content:has(#cma_table_tab_assignment) ul.nav.nav-tabs.nav-b.perform_nav.perform_nav_new > li > a,
    section.main-content:has(#cma_table_tab_assignment) ul.nav.nav-tabs.nav-b.perform_nav.perform_nav_new > li.active > a,
    .brown-theme section.main-content:has(#cma_table_tab_assignment) ul.nav.nav-tabs.nav-b.perform_nav.perform_nav_new > li.active > a {
        min-width: 96px;
        padding: 0 12px !important;
    }
}

/* Assignment allocation card styles moved from Planning views. */
	.assignment-container .assignement-card.request-card-list {
		border: 1px solid #dfe8ef;
		border-radius: 10px;
		box-shadow: none;
		overflow: hidden;
		background: #fff;
	}

	.assignment-container .assignement-card .card-head {
		background: #eef9f6;
		border: 0;
		border-radius: 0;
		padding: 12px 14px;
	}

	.assignment-container .assignement-card .ass-cardbody {
		min-height: 28px;
	}

	.assignment-container .assignement-card .text-name,
	.assignment-container .assignement-card .text-name1,
	.assignment-container .assignement-card .name_dot,
	.assignment-container .assignement-card .name_dot1 {
		width: 28px;
		height: 28px;
		min-width: 28px;
		border-radius: 50%;
		display: inline-flex;
		align-items: center;
		justify-content: center;
		font-size: 12px;
		font-weight: 700;
	}

	.assignment-container .assignement-card .label-text-name {
		display: flex;
		align-items: center;
		gap: 10px;
		min-width: 0;
	}

	.assignment-container .assignement-card .label-text-name > span:first-child {
		color: #0d4442;
		font-size: 15px;
		font-weight: 700;
		white-space: nowrap;
		overflow: hidden;
		text-overflow: ellipsis;
	}

	.assignment-container .assignement-card .sts-text {
		color: #071f1d;
		font-size: 12px;
		font-weight: 800;
		text-transform: uppercase;
	}

	.assignment-container .assignement-card .border-style {
		padding: 14px;
	}

	.assignment-container .assignement-card .body-head {
		position: relative;
		display: grid;
		grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) auto;
		gap: 10px 16px;
		align-items: center;
		padding: 10px 12px;
		margin-bottom: 14px;
		background: #fbfcfc;
		border: 1px solid #edf1f4;
		border-radius: 8px;
	}

	.assignment-container .assignement-card .body-head > span:not(.divider) {
		display: inline-flex !important;
		align-items: center;
		justify-content: flex-start !important;
		gap: 6px !important;
		min-width: 0;
		margin: 0 !important;
		color: #111827;
		font-size: 13px;
		font-weight: 700;
	}

	.assignment-container .assignement-card .body-head .head-title {
		color: #aa9a84;
		font-size: 10px;
		font-weight: 800;
		text-transform: uppercase;
		letter-spacing: 0;
	}

	.assignment-container .assignement-card .body-head .divider {
		display: none;
	}

	.assignment-container .assignement-card .body-head .tools {
		grid-row: 1 / span 2;
		grid-column: 3;
		justify-self: end;
		align-self: center;
	}

	.assignment-container .assignement-card .percentage_value {
		background: #e8fff3;
		color: #00a779;
		border-radius: 6px;
		padding: 2px 8px;
		font-size: 12px;
		font-weight: 800;
	}

	.assignment-container .assignement-card .traget_value {
		color: #111827;
		font-weight: 800;
	}

	.assignment-container .assignement-card .body-secound-row {
		row-gap: 12px;
	}

	.assignment-container .assignement-card .body-secound-row > div > label,
	.assignment-container .assignement-card .body-secound-card label {
		color: #8f9aa3;
		font-size: 11px;
		font-weight: 800;
		text-transform: uppercase;
	}

	.assignment-container .assignement-card .ass-box,
	.assignment-container .assignement-card .operatorDropZone {
		min-height: 48px;
		border: 1px solid #edf1f4;
		border-radius: 10px;
		background: #fbfcfc;
		padding: 8px 10px;
	}

	.assignment-container .assignement-card .body-secound-card {
		margin-top: 12px;
		padding-top: 12px;
		border-top: 1px solid #edf1f4;
	}

	.assignment-container .assignement-card .Primary-Secondary-text {
		background: #f7f8fa;
		color: #4b5563;
		border-radius: 999px;
		padding: 3px 8px;
		font-size: 11px;
		font-weight: 700;
	}

	.assignment-container .assignement-card .hauler-list-container ul {
		display: flex;
		flex-direction: column;
		gap: 6px;
		padding: 0;
		margin: 0;
	}

	.assignment-container .assignement-card .body-card {
		border: 1px solid #e8edf2;
		border-radius: 6px;
		background: #fbfcfc;
		overflow: hidden;
	}

	.assignment-container .assignement-card .body-card li.hauleroperatorDropZone {
		display: grid;
		grid-template-columns: minmax(80px, 1fr) minmax(110px, 1.3fr) auto auto;
		align-items: center;
		gap: 8px;
		min-height: 46px;
		padding: 8px 10px;
		border: 0;
		background: transparent;
	}

	.assignment-container .assignement-card .body-card li.hauleroperatorDropZone > span:first-child strong,
	.assignment-container .assignement-card .speed-cal {
		color: #008c78;
		font-weight: 800;
	}

	.assignment-container .assignement-card .body-card li.hauleroperatorDropZone > span:first-child strong {
		color: #111827;
	}

	.assignment-container .assignement-card .body-card li.hauleroperatorDropZone > span:first-child div,
	.assignment-container .assignement-card .hauler-status-text {
		color: #9aa3aa;
		font-size: 11px;
		line-height: 1.1;
	}

	.assignment-container .assignement-card .body-card label {
		margin: 0;
		color: #99a1aa;
		font-size: 12px;
		font-weight: 700;
		white-space: nowrap;
		overflow: hidden;
		text-overflow: ellipsis;
	}

	.assignment-container .assignement-card .value-text {
		color: #b57423;
		font-weight: 800;
	}

	@media (max-width: 640px) {
		.assignment-container .assignement-card .body-head {
			grid-template-columns: 1fr;
		}

		.assignment-container .assignement-card .body-head .tools {
			position: absolute;
			top: 8px;
			right: 8px;
			grid-row: auto;
			grid-column: auto;
		}

		.assignment-container .assignement-card .body-card li.hauleroperatorDropZone {
			grid-template-columns: 1fr 1fr;
		}
	}
	.assignment-container .card.assignement-card.request-card-list.assignment-card-v2 {
		background: #fff !important;
		border: 1px solid #e2ebf2 !important;
		border-radius: 24px !important;
		box-shadow: none !important;
		overflow: hidden !important;
		padding: 0 !important;
	}

	.assignment-container .assignment-card-v2 .card-head.assignment-head {
		background: #eaf4f2 !important;
		border: 0 !important;
		border-radius: 24px 24px 0 0 !important;
		margin: 0 !important;
		padding: 0 16px !important;
	}
	.assignment-container .assignment-card-v2 .card-head.assignment-head:before {
		content: unset !important;
		display: none !important;
	}

	.assignment-container .assignment-card-v2.running .card-head.assignment-head,
	.assignment-container .assignment-card-v2.working .card-head.assignment-head {
		background: #eaf4f2 !important;
	}

	.assignment-container .assignment-card-v2.idle .card-head.assignment-head {
		background: #e0f2fe !important;
	}

	.assignment-container .assignment-card-v2.stopped .card-head.assignment-head {
		background: #f7ebe3 !important;
	}

	.assignment-container .assignment-card-v2.breakdown .card-head.assignment-head {
		background: #ffe2e4 !important;
	}

	.assignment-container .assignment-card-v2 .ass-cardbody {
		min-height: 52px !important;
	}

	.assignment-container .assignment-card-v2 .label-text-name {
		display: flex !important;
		align-items: center !important;
		gap: 10px !important;
		min-width: 0 !important;
	}

	.assignment-container .assignment-card-v2 .label-text-name > span:first-child {
		color: #0f3f3d !important;
		font-size: 18px !important;
		font-weight: 800 !important;
		white-space: nowrap !important;
	}

	.assignment-container .assignment-card-v2.running .label-text-name > span:first-child,
	.assignment-container .assignment-card-v2.working .label-text-name > span:first-child,
	.assignment-container .assignment-card-v2.running .sts-text,
	.assignment-container .assignment-card-v2.working .sts-text {
		color: #00443f !important;
	}

	.assignment-container .assignment-card-v2.idle .label-text-name > span:first-child,
	.assignment-container .assignment-card-v2.idle .sts-text {
		color: #006eaa !important;
	}

	.assignment-container .assignment-card-v2.stopped .label-text-name > span:first-child,
	.assignment-container .assignment-card-v2.stopped .sts-text {
		color: #9a4f13 !important;
	}

	.assignment-container .assignment-card-v2.breakdown .label-text-name > span:first-child,
	.assignment-container .assignment-card-v2.breakdown .sts-text {
		color: #c9182b !important;
	}

	.assignment-container .assignment-card-v2 .assignment-route-label {
		color: #536d7f !important;
		font-size: 15px !important;
		font-weight: 800 !important;
		margin-left: 2px !important;
		padding: 0 !important;
	}

	.assignment-container .assignment-card-v2 .text-name,
	.assignment-container .assignment-card-v2 .text-name1,
	.assignment-container .assignment-card-v2 .name_dot,
	.assignment-container .assignment-card-v2 .name_dot1 {
		width: 28px !important;
		height: 28px !important;
		min-width: 28px !important;
		border-radius: 50% !important;
		display: inline-flex !important;
		align-items: center !important;
		justify-content: center !important;
		font-size: 12px !important;
		font-weight: 800 !important;
	}

	.assignment-container .assignment-card-v2 .sts-text {
		color: #0f3f3d !important;
		font-size: 12px !important;
		font-weight: 900 !important;
		text-transform: uppercase !important;
	}

	.assignment-container .assignment-card-v2 .border-style {
		padding: 16px 18px 14px !important;
		background: #fff !important;
		position: relative !important;
		overflow: visible !important;
	}

	.assignment-container .assignment-card-v2 .body-head {
		position: relative !important;
		display: grid !important;
		grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) !important;
		gap: 12px 18px !important;
		align-items: center !important;
		margin: 0 12px 16px 12px !important;
		padding: 14px 12px !important;
		background: #fbfcfc !important;
		border: 1px solid #edf1f4 !important;
		border-radius: 8px !important;
		overflow: visible !important;
	}

	.assignment-container .assignment-card-v2 .body-head > span:not(.divider) {
		display: inline-flex !important;
		align-items: center !important;
		justify-content: flex-start !important;
		gap: 6px !important;
		min-width: 0 !important;
		margin: 0 !important;
		color: #111827 !important;
		font-size: 13px !important;
		font-weight: 800 !important;
		line-height: 1.2 !important;
		white-space: nowrap !important;
	}

	.assignment-container .assignment-card-v2 .body-head .assignment-target-metric {
		justify-content: flex-end !important;
		padding-right: 4px !important;
	}

	.assignment-container .assignment-card-v2 .body-head .head-title {
		color: #aa9a84 !important;
		font-size: 10px !important;
		font-weight: 900 !important;
		text-transform: uppercase !important;
		letter-spacing: 0 !important;
	}

	.assignment-container .assignment-card-v2 .body-head .divider {
		display: none !important;
	}

	.assignment-container .assignment-card-v2 .body-head .tools {
		display: block !important;
	}

	.assignment-container .assignment-card-v2 .assignment-card-actions {
		position: absolute !important;
		top: 14px !important;
		right: 8px !important;
		transform: none !important;
		width: 24px !important;
		z-index: 20 !important;
	}

	.assignment-container .assignment-card-v2 #assignment_breadcrumb {
		display: inline-flex !important;
		align-items: center !important;
		justify-content: center !important;
		padding: 0 !important;
		width: 24px !important;
		height: 24px !important;
		line-height: 1 !important;
		color: #818181 !important;
		font-size: 22px !important;
		font-weight: 800 !important;
		text-align: center !important;
		text-decoration: none !important;
		background: transparent !important;
		border: 0 !important;
	}

	.assignment-container .assignment-card-v2 .assignment-more-dots {
		display: block !important;
		line-height: 20px !important;
	}

	.assignment-container .assignment-card-v2 .percentage_value {
		background: #e8fff3 !important;
		color: #00a779 !important;
		border-radius: 6px !important;
		padding: 2px 8px !important;
		font-size: 12px !important;
		font-weight: 900 !important;
		line-height: 1.2 !important;
		white-space: nowrap !important;
	}

	.assignment-container .assignment-card-v2 .traget_value {
		color: #111827 !important;
		font-weight: 900 !important;
		display: inline-flex !important;
		align-items: baseline !important;
		gap: 2px !important;
		white-space: nowrap !important;
	}

	.assignment-container .assignment-card-v2 .traget_value span {
		white-space: nowrap !important;
	}

	.assignment-container .assignment-card-v2 .body-head .fa-map-marker {
		color: #ff9900 !important;
	}

	.assignment-container .assignment-card-v2 .body-head .fa-location-arrow {
		color: #0aa2ff !important;
	}

	.assignment-container .assignment-card-v2 .body-secound-row {
		row-gap: 12px !important;
		margin: 0 18px 0 12px !important;
		align-items: stretch !important;
		display: flex !important;
		flex-wrap: wrap !important;
	}

	.assignment-container .assignment-card-v2 .body-secound-row > div {
		display: flex !important;
		flex-direction: column !important;
		min-width: 0 !important;
		padding-left: 0 !important;
		padding-right: 10px !important;
	}

	.assignment-container .assignment-card-v2 .body-secound-row > div:last-child {
		padding-right: 0 !important;
	}

	.assignment-container .assignment-card-v2 .body-secound-row > div > label,
	.assignment-container .assignment-card-v2 .body-secound-card label {
		color: #536d7f !important;
		font-size: 11px !important;
		font-weight: 800 !important;
		text-transform: uppercase !important;
		align-self: flex-start !important;
		margin-bottom: 5px !important;
	}

	.assignment-container .assignment-card-v2 .ass-box,
	.assignment-container .assignment-card-v2 .operatorDropZone {
		min-height: 48px !important;
		height: 48px !important;
		border: 1px solid #edf1f4 !important;
		border-radius: 10px !important;
		background: #fbfcfc !important;
		padding: 8px 10px !important;
		flex: 1 1 auto !important;
		min-width: 0 !important;
		overflow: hidden !important;
	}

	.assignment-container .assignment-card-v2 .operatorDropZone {
		display: flex !important;
		align-items: center !important;
		justify-content: center !important;
		border-style: solid !important;
	}

	.assignment-container .assignment-card-v2 .operatorDropZone .drag_drop_border {
		width: 100% !important;
		height: 100% !important;
		min-height: 0 !important;
		margin: 0 !important;
		padding: 0 !important;
		display: flex !important;
		align-items: center !important;
		justify-content: center !important;
		border: 1px dashed #e0e5eb !important;
		border-radius: 8px !important;
		background: transparent !important;
		color: #365f85 !important;
		font-size: 11px !important;
		font-weight: 700 !important;
		line-height: 1 !important;
		white-space: nowrap !important;
	}

	.assignment-container .assignment-card-v2 .ass-box > .name_dot,
	.assignment-container .assignment-card-v2 .ass-box > .name_dot1,
	.assignment-container .assignment-card-v2 .ass-box > svg {
		flex: 0 0 auto !important;
	}

	.assignment-container .assignment-card-v2 .ass-box > strong {
		display: block !important;
		flex: 1 1 auto !important;
		min-width: 0 !important;
		max-width: 100% !important;
		overflow: hidden !important;
		text-overflow: ellipsis !important;
		white-space: nowrap !important;
		line-height: 1.2 !important;
	}

	.assignment-container .assignment-card-v2 .body-secound-card {
		margin-top: 12px !important;
		padding-top: 12px !important;
		border-top: 1px solid #edf1f4 !important;
	}

	.assignment-container .assignment-card-v2 .Primary-Secondary-text {
		background: #f7f8fa !important;
		color: #4b5563 !important;
		border-radius: 999px !important;
		padding: 3px 8px !important;
		font-size: 11px !important;
		font-weight: 700 !important;
		text-decoration: none !important;
		white-space: nowrap;
	}

	.assignment-container .assignment-card-v2 .hauler-list-container ul {
		display: flex !important;
		flex-direction: column !important;
		gap: 6px !important;
		padding: 0 !important;
		margin: 0 !important;
	}

	.assignment-container .assignment-card-v2 .hauler-list-container.assign-lst {
		max-height: calc((48px * 4) + (6px * 3)) !important;
		overflow-y: auto !important;
		overflow-x: hidden !important;
		padding-right: 4px !important;
	}

	.assignment-container .assignment-card-v2 .body-card {
		border: 1px solid #e8edf2 !important;
		border-radius: 6px !important;
		background: #fbfcfc !important;
		display: block !important;
		align-items: initial !important;
		justify-content: initial !important;
		width: 100% !important;
		min-height: 48px !important;
		margin: 0 !important;
		overflow: visible !important;
	}

        .assignment-container .assignment-card-v2 .body-card li.hauleroperatorDropZone {
            display: grid !important;
            grid-template-columns: 75px minmax(0, 1fr) 198px 75px !important;
            align-items: center !important;
            column-gap: 10px !important;
            row-gap: 0 !important;
            height: 46px !important;
            min-height: 46px !important;
            padding: 9px 10px !important;
            border: 0 !important;
            background: transparent !important;
            overflow: visible !important;
            list-style: none !important;
        }

	.assignment-container .assignment-card-v2 .body-card li.hauleroperatorDropZone > span:first-child strong {
		color: #111827 !important;
		font-weight: 900 !important;
	}

	.assignment-container .assignment-card-v2 .speed-cal {
		color: #008c78 !important;
		font-weight: 900 !important;
	}

	.assignment-container .assignment-card-v2 .body-card label {
		margin: 0 !important;
		color: #2f3438 !important;
		font-size: 11px !important;
		font-weight: 800 !important;
		white-space: nowrap !important;
		overflow: hidden !important;
		text-overflow: ellipsis !important;
		min-width: 0 !important;
		width: 100% !important;
		max-width: 100% !important;
		display: inline-flex !important;
		align-items: center !important;
		gap: 3px !important;
	}

	.assignment-container .assignment-card-v2 .body-card label span {
		display: block !important;
		min-width: 0 !important;
		overflow: hidden !important;
		text-overflow: ellipsis !important;
		white-space: nowrap !important;
	}

	.assignment-container .assignment-card-v2 .body-card label span,
	.assignment-container .assignment-card-v2 .body-card label .dropped-hauler-name {
		font-size: 10px !important;
	}

	.assignment-container .assignment-card-v2 .body-card label svg {
		width: 12px !important;
		height: 12px !important;
		flex: 0 0 12px !important;
	}

	.assignment-container .assignment-card-v2 .body-card li.hauleroperatorDropZone > span:first-child div,
	.assignment-container .assignment-card-v2 .hauler-status-text {
		color: #9aa3aa !important;
		font-size: 10px !important;
		line-height: 1.1 !important;
		white-space: nowrap !important;
		overflow: hidden !important;
		text-overflow: ellipsis !important;
	}

	.assignment-container .assignment-card-v2 .value-text {
		color: #b57423 !important;
		font-weight: 900 !important;
	}

	.assignment-container .assignment-card-v2 .body-card li.hauleroperatorDropZone > span {
		min-width: 0 !important;
		white-space: nowrap !important;
		overflow: visible !important;
		text-overflow: ellipsis !important;
	}

	.assignment-container .assignment-card-v2 .body-card li.hauleroperatorDropZone > span:first-child strong {
		display: block !important;
		overflow: hidden !important;
		text-overflow: ellipsis !important;
		white-space: nowrap !important;
	}

	.assignment-container .assignment-card-v2 .hauler-equipment-cell {
		white-space: normal !important;
		overflow: visible !important;
	}

	.assignment-container .assignment-card-v2 .hauler-equipment-cell strong {
		color: #111827 !important;
		font-size: 15px !important;
		font-weight: 900 !important;
		line-height: 1.15 !important;
	}

	.assignment-container .assignment-card-v2 .hauler-equipment-cell div {
		color: #a98a62 !important;
		font-size: 11px !important;
		font-weight: 500 !important;
		line-height: 1.1 !important;
	}

.assignment-container .assignment-card-v2 .hauler-trip-status {
    display: inline-block !important;
    /*min-width: 141px !important;*/
    width: auto !important;
    min-width: auto !important;
    max-width: 140px !important;
    margin:0 auto;
    /*max-width: 82px !important;*/
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
    text-align: center !important;
    justify-self: center !important;
    background: #dcf7f0 !important;
    color: #007f72 !important;
    border-radius: 8px !important;
    padding: 4px 8px !important;
    font-size: 11px !important;
    font-weight: 700 !important;
    line-height: 1 !important;
}

	.assignment-container .assignment-card-v2 .hauler-trip-status.is-empty {
		display: none !important;
	}

	.assignment-container .assignment-card-v2 .hauler-trip-cell {
		display: flex !important;
		align-items: center !important;
		justify-content: flex-end !important;
		gap: 8px !important;
		min-width: 0 !important;
		overflow: hidden !important;
		white-space: nowrap !important;
	}

	.assignment-container .assignment-card-v2 .hauler-trips-cell {
		overflow: hidden !important;
		text-overflow: clip !important;
		text-align: right !important;
		justify-self: auto !important;
		color: #004f95 !important;
		font-size: 17px !important;
		font-weight: 900 !important;
		white-space: nowrap !important;
		flex: 0 0 auto !important;
	}

	.assignment-container .assignment-card-v2 .speed-cal {
		display: block !important;
		color: #00a779 !important;
		font-size: 12px !important;
		font-weight: 900 !important;
		line-height: 1.1 !important;
		white-space: nowrap !important;
		text-align: right !important;
	}

	.assignment-container .assignment-card-v2 .hauler-speed-cell {
		justify-self: end !important;
		text-align: right !important;
		min-width: 0 !important;
		overflow: hidden !important;
	}

	.assignment-container .assignment-card-v2 .body-card li.hauleroperatorDropZone > span:last-child {
		text-align: right !important;
	}

	@media (max-width: 640px) {
		.assignment-container .assignment-card-v2 .body-head {
			grid-template-columns: 1fr !important;
		}

		.assignment-container .assignment-card-v2 .body-head .tools {
			position: absolute !important;
			top: 8px !important;
			right: 8px !important;
			grid-column: auto !important;
			grid-row: auto !important;
		}

		.assignment-container .assignment-card-v2 .body-card li.hauleroperatorDropZone {
			grid-template-columns: 82px minmax(0, 1fr) 148px 62px !important;
		}
	}
	.Assesment_card .info-container {
		align-items: stretch;
		gap: 10px;
		width: 100%;
	}

	.Assesment_card > .row > .col-lg-8.col-md-4.col-sm-12 {
		flex: 1 1 auto;
		max-width: none;
		width: auto;
	}

	.Assesment_card .info-box.assignment-metric {
		align-items: flex-start;
		background: #fffdf9;
		border: 1px solid #eadfce;
		border-radius: 10px;
		flex-direction: column;
		flex: 0 0 136px;
		gap: 5px;
		min-height: 48px;
		min-width: 118px;
		padding: 9px 14px 8px;
	}

	.Assesment_card .info-container > .d-flex.align-items-center.gap-2 {
		flex: 0 0 auto;
	}

	.Assesment_card .assignment-metric > svg {
		display: none;
	}

	.Assesment_card .assignment-metric-label {
		display: flex;
		align-items: center;
		gap: 5px;
		color: #7a6c60;
		font-size: 10px;
		font-weight: 600;
		line-height: 1.1;
		white-space: nowrap;
	}

	.Assesment_card .assignment-metric-value {
		display: flex;
		align-items: baseline;
		gap: 3px;
		color: #111827;
		font-size: 13px;
		font-weight: 800;
		line-height: 1.2;
		white-space: nowrap;
	}

	.Assesment_card .assignment-metric-value strong {
		font-size: inherit;
	}

	.Assesment_card #geofencebox .assignment-metric-value {
		align-items: center;
	}

	.Assesment_card .info-box.assignment-metric:first-child {
		flex-basis: 150px;
		max-width: 150px;
		min-width: 150px;
	}

	.Assesment_card #actualaskingratebox {
		flex-basis: 110px;
		max-width: 110px;
		min-width: 110px;
	}

	.Assesment_card #geofencebox {
		flex-basis: 130px;
		max-width: 130px;
		min-width: 130px;
	}

	.Assesment_card #aksingratebox {
		border-color: #ffc98f;
	}

	.Assesment_card .isAutoAllocation_craftmyapp_container > div,
	.Assesment_card .isAutoAllocation_craftmyapp_container .d-flex {
		width: 100%;
	}

	.Assesment_card .isAutoAllocation_craftmyapp_container {
		align-items: center !important;
		display: flex !important;
		justify-content: center !important;
		padding: 9px 9px !important;
	}

	.Assesment_card .isAutoAllocation_craftmyapp_container .d-flex {
		align-items: center !important;
		justify-content: center;
	}

	.Assesment_card #isAutoAllocation {
		align-items: center !important;
		display: inline-flex !important;
		justify-content: center !important;
		line-height: 1.2 !important;
		padding: 0 !important;
	}

	#assignmentcard .assignement-card .body-secound-card {
		padding-left: 12px;
		padding-right: 12px;
	}

	#assignmentcard .assignement-card .body-secound-row {
		margin-left: 4px;
		margin-right: 4px;
	}

	#assignmentcard .assignement-card .body-card {
		width: 100%;
	}

    .gui-controls > li.open > a span {
        color: #fff !important;
    }
.menu-dropdown a {
    padding-inline: 10px !important;
}
    .menu-dropdown a.active {
        background: #faf8f5 !important;
    }


ul#main-menu li:first-child:has(.logo-item) {
    padding-inline: 0;
}

.sidebar-profile-footer {
    position: fixed;
    bottom: 0;
    z-index: 99;
    width: 100%;
    border-top: 1px solid #e2e8f0;
    background: #fff !important;
    display: flex;
    flex-direction: column;
}

li.dropdown.dropup {
    width: 100%;
    display: flex;
    align-items: center;
}

#dropdown_container .menu-dropdown ul li a.active:focus, .gui-controls > li.open > .menu-dropdown ul li a.active:focus {
    outline: unset !important;
    background: #f4f0ec;
}

a.craftmyApp_logout_btn.sidebar-logout-button {
    display: flex;
    align-items: center;
    padding: 0 !important;
}

span.profile-info {
    font-size: 13px;
}

.header-nav-profile .dropdown img {
    width: 25px;
    height: 25px;
}

.header-nav > li > a:hover, .header-nav > li > a:focus, .header-nav > li > a:hover {
    background: unset !important;
}

.icon-logout {
    font-size: 18px;
    border: 1px solid #afb1b4 !important;
    border-radius: 8px;
    padding: 5px !important;
    color: #62748e;
    background: #fff;
}
}

.mainSideMenu .menu-dropdown ul li a:focus,
.mainSideMenu .menu-dropdown ul li a:focus-visible, .mainSideMenu .menu-dropdown ul li:focus {
    outline: unset;
}

.nano .gui-controls li a {
    position: relative;
    min-height: auto;
}

.nano .gui-controls li:not(:first-child) a:before {
    content: "⌵";
    display: flex;
    align-items: center;
    justify-content: center;
    position: absolute;
    left: unset !important;
    top: 45%;
    transform: translateY(-50%);
    right: 5px;
    color: #c98a51;
    font-size: 12px;
    font-weight: 600;
    width: 24px;
    height: 20px;
}

li.has-dropdown.HMR_Track_.active.cma_active a:before {
    color: #fff;
}

.nano.has-scrollbar .gui-controls li.open a:before {
    top: 60%;
    transform: translateY(-50%) rotate(180deg);
    color: #fff;
}

.gui-controls > li.open > a {
    border-radius: 8px;
    background: #C98A51;
}

    .gui-controls > li.open > a i {
        color: #fff !important;
    }

.nano-pane {
    display: none !important;
}
.col-sm-12.col-xs-12 {
    padding: 0 !important;
}
.filter_card.card{
    box-shadow:unset !important;
}
.card-head.Assesment_card .col-sm-12 {
    padding: 0;
}
.row.daily_shift .col-sm-12.col-xs-12.p-0 .card.p-0 {
    position: relative;
}

/*.row.daily_shift:has(.workspace-right-panel) .col-sm-12.col-xs-12.p-0 .card.p-0 .card-head.p-0 {
    margin-top: 64px;
}
*/
button#leftdrawer {
    background: #fff !important;
    border: 1px solid #ccc !important;
    position: fixed;
    z-index: 999999;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 25px;
    top: 22px;
    height: 25px;
    left: calc(var(--sideMenuWidth) - 12px);
    transition: ease-in-out 1s;
    padding: 4px;
}
.back-arrow {
    background: #fff !important;
    border: 1px solid #ccc !important;
    border-radius: 50%;
    display: flex !important;
    align-items: center;
    justify-content: center;
    width: 25px;
    height: 25px;
    margin-left: 18px;
    padding: 4px;
}
    .back-arrow i {
        color: #bf7d2c;
    }
.expand-content {
    padding-left: 60px !important;
}
.hide-left {
    width: 61px !important;
}

body:has(.expand-content) .leftdrawer {
    left: 49px !important;
    transform: rotate(180deg);
}
body:has(.expand-content) #header{
    left:61px;
}

div#menubar.hide-left .gui-controls li a span {
    display: none;
}

body:has(.expand-content) .nano.has-scrollbar .gui-controls li {
    padding-inline: 10px;
}

body:has(.expand-content) .nano .gui-controls li:not(:first-child) a:before {
    display: none;
}

body:has(.expand-content) .nano .gui-controls li a {
    min-width: fit-content;
    justify-content: center;
}

body:has(.expand-content) .gui-controls > li > a i {
    padding: 5px !important;
}

body:has(.expand-content) li.dropdown.dropup {
    flex-direction: column;
}

body:has(.expand-content) .header-nav-profile .dropdown .profile-info {
    display: none;
}

body:has(.expand-content) ul.header-nav.header-nav-profile > li > a {
    min-height: auto;
}
.tooltip {
    display: none !important;
}
a.logo-item span {
    display: none;
    background: #B57423;
    border-radius: 10px;
    width:28px;
    height:28px;
    justify-content:center;
    align-items:center;
    color:#fff !important;
}
body:has(.expand-content) a.logo-item span{
    display:flex !important;
}
body:has(.expand-content) a.logo-item img{
    display:none;
}

#gps-filter-modal {
    z-index: 9999 !important;
}

    #gps-filter-modal .modal-header-block h3 {
        margin: 0;
    }

    #gps-filter-modal .modal-close-trigger {
        color: #fff;
    }

#gps-filter-modal img.icon-inline {
    filter: invert(1);
}

#gps-filter-modal span.gps-excavator-row-title {
    font-size: 12px;
}

    #gps-filter-modal .gps-readonly-field {
        font-size: 10px;
    }

    #gps-filter-modal .form-row-dual .form-field-group label {
        font-size: 12px !important;
        margin-bottom: 0;
    }

    #gps-filter-modal .form-row-dual .form-field-group input {
        line-height: 20px;
        font-size: 12px;
    }

    #gps-filter-modal .provision-btn, #gps-filter-modal .modal-header-block, #gps-filter-modal .gps-filters-btn {
        background: #b57423;
    }
        #gps-filter-modal .gps-filters-btn:hover {
            background: #b57423;
        }
   #gps-filter-modal .gps-filters-btn{
       color:#fff;

    }
.row.daily_shift:has(#map-tab-content) {
    padding-inline: 20px;
}

div#menubar.hide-left .gui-controls li a span svg {
    width: 10px;
}
.col-lg-6.col-md-7.col-sm-12.flex.text-white {
    width: fit-content;
}
/*.menubar-hoverable.header-fixed #base {
    padding-top: 0 !important;
}
.menubar-hoverable.header-fixed #base {
    padding-top: 0 !important;
}
*/
ul#main-menu {
    gap: 5px;
}
.cma_active a:before {
    color: #fff !important;
}
#geofenceModal .modal-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
}
#geofenceModal button.close {
    margin-top: 0;
}

div#tab-sector-content .trip-sense-tabs-head {
    padding-top: 10px !important;
    min-height: auto !important;
}

.row.daily_shift #trip-sensing-wrapper .trip-sense-tabs li a {
    padding-bottom: 10px !important;
    height: auto;
}
.row.daily_shift #trip-sensing-wrapper .trip-sense-tabs li {
    height: auto;
}

.row.daily_shift #trip-sensing-logs-partial.trip-sensing-logs-expected #tripSenseLogTable th {
    width: 160px !important;
    white-space:nowrap !important;
}
div#tripSenseLogTable_wrapper{
    overflow:auto;
}
ul#main-menu li:first-child:has(.logo-item) {
    justify-content: center;
}
body:has(.hide-left) .gui-controls > li > .menu-dropdown, body:has(.hide-left) .menu-dropdown {
    display: none !important;
}
.menubar-hoverable.header-fixed #base:has(form) {
    padding-top: 63px !important;
}
.menubar-hoverable.header-fixed #base:has(.ProductionInfo_craftmyapp_container) {
    padding-top: 72px !important;
}
.route-row-card {
    padding-inline: 10px !important
}
.row.login_section .card-head {
    bottom: 13%;
    right: 0%;
}

/* Assignment > Trip Sensing Event: compact cards and single-line filters */
#trip-sensing-event-partial .live-events-stat {
    display: grid !important;
    grid-template-columns: auto minmax(0, 1fr);
    grid-template-rows: auto auto;
    align-items: baseline;
    column-gap: 8px;
    row-gap: 10px;
    min-height: 82px !important;
    padding: 16px 18px 14px !important;
}

#trip-sensing-event-partial .live-events-stat .stat-label {
    grid-column: 1 / -1;
    grid-row: 1;
}

#trip-sensing-event-partial .live-events-stat .stat-value {
    grid-column: 1;
    grid-row: 2;
    margin: 0 !important;
}

#trip-sensing-event-partial .live-events-stat .stat-caption {
    grid-column: 2;
    grid-row: 2;
    margin: 0 !important;
}

#trip-sensing-event-partial .live-events-panel {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
}

#trip-sensing-event-partial .live-events-toolbar {
    display: contents !important;
}

#trip-sensing-event-partial .live-events-toolbar > .live-events-actions:first-child {
    grid-column: 2;
    grid-row: 1;
    align-self: end;
    padding: 12px 16px 12px 8px;
}

#trip-sensing-event-partial .live-events-toolbar > .live-events-actions:nth-child(2) {
    display: none !important;
}

#trip-sensing-event-partial .live-events-search {
    width: 230px !important;
    min-width: 230px !important;
}

#trip-sensing-event-partial .live-events-filterbar {
    grid-column: 1;
    grid-row: 1;
    display: flex !important;
    align-items: flex-end;
    gap: 8px !important;
    padding: 12px 8px 12px 16px !important;
    border-bottom: 1px solid #e5ebf3 !important;
    overflow-x: auto;
}

#trip-sensing-event-partial .live-filter {
    width: 145px;
    min-width: 145px;
}

#trip-sensing-event-partial .live-events-table {
    grid-column: 1 / -1;
    grid-row: 2;
}

/* Assignment > Trip Sensing Logs: filters left, search/reset right */
#trip-sensing-logs-partial.trip-sensing-logs-expected .trip-sense-log-toolbar {
    padding: 10px 12px !important;
    overflow-x: hidden;
}

#trip-sensing-logs-partial.trip-sensing-logs-expected .trip-sense-log-toolbar-row {
    align-items: flex-end !important;
    gap: 6px !important;
    min-width: 0;
}

#trip-sensing-logs-partial.trip-sensing-logs-expected .trip-sense-log-filter-grid {
    grid-template-columns: repeat(5, 110px) !important;
    gap: 6px !important;
    width: auto !important;
}

#trip-sensing-logs-partial.trip-sensing-logs-expected .trip-sense-log-filter-grid.trip-sense-popup-filterbar {
    display: flex !important;
    align-items: center !important;
    flex-wrap: wrap !important;
    gap: 8px !important;
    width: auto !important;
}

#trip-sensing-logs-partial.trip-sensing-logs-expected .trip-sense-popup-filterbar .trip-sense-active-chips {
    display: flex !important;
    align-items: center !important;
    flex-wrap: wrap !important;
    gap: 8px !important;
    min-width: 0;
}

#trip-sensing-logs-partial.trip-sensing-logs-expected .trip-sense-log-filter-item {
    width: 110px;
}

#trip-sensing-logs-partial.trip-sensing-logs-expected .trip-sense-log-filter-item label {
    margin-bottom: 4px !important;
    font-size: 10px !important;
}

#trip-sensing-logs-partial.trip-sensing-logs-expected .trip-sense-log-filter-item .form-control {
    min-height: 28px !important;
    height: 28px !important;
    padding: 0 8px !important;
    font-size: 11px !important;
}

#trip-sensing-logs-partial.trip-sensing-logs-expected .trip-sense-log-toolbar-right {
    align-items: flex-end !important;
    gap: 6px;
}

#trip-sensing-logs-partial.trip-sensing-logs-expected .trip-sense-metric {
    box-sizing: border-box !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    width: 132px !important;
    min-width: 132px !important;
    height: 28px !important;
    padding: 0 6px !important;
    gap: 4px !important;
    margin: 0 !important;
}

#trip-sensing-logs-partial.trip-sensing-logs-expected .trip-sense-metric label {
    flex: 1 1 auto;
    min-width: 0;
    margin: 0 !important;
    font-size: 8.5px !important;
    letter-spacing: 0 !important;
    line-height: 1 !important;
    white-space: nowrap;
}

#trip-sensing-logs-partial.trip-sensing-logs-expected .trip-sense-metric span {
    flex: 0 0 24px !important;
    box-sizing: border-box !important;
    width: 24px !important;
    min-width: 24px !important;
    max-width: 24px !important;
    height: 22px !important;
    padding: 0 !important;
    font-size: 12px !important;
}

#trip-sensing-logs-partial.trip-sensing-logs-expected .trip-sense-search-box {
    box-sizing: border-box !important;
    width: 160px !important;
    max-width: 160px !important;
    flex: 0 0 160px !important;
}

#trip-sensing-logs-partial.trip-sensing-logs-expected .trip-sense-search-box input {
    box-sizing: border-box !important;
    width: 160px !important;
    min-height: 28px !important;
    height: 28px !important;
    padding: 0 8px 0 30px !important;
    border-radius: 9px !important;
    font-size: 10px !important;
    line-height: 28px !important;
}

#trip-sensing-logs-partial.trip-sensing-logs-expected .trip-sense-search-box i {
    left: 10px !important;
    width: 14px !important;
    height: 14px !important;
    font-size: 13px !important;
    line-height: 14px !important;
}

#trip-sensing-logs-partial.trip-sensing-logs-expected #tripSenseLogReset {
    margin-left: 0 !important;
    box-sizing: border-box !important;
    height: 28px !important;
    padding: 0 8px !important;
    border-radius: 9px !important;
    font-size: 10px !important;
}
/* All DataTable headers: display labels in title case. */
.dataTables_wrapper table thead th,
table.dataTable thead th {
    text-transform: capitalize;
}

/* Daily Plan remote monitoring: vertically center the map-panel toggle. */
#map-tab-content .content-column > .expandead-arrow {
    top: 50%;
    transform: translateY(-50%);
}

.header-task-info:not([style*="display: none"]):not([style*="display:none"]) ~ #hdr-default-title {
    display: none !important;
}

.hdr-left-section {
    display: flex !important;
    align-items: center !important;
    gap: 12px !important;
    flex-shrink: 0 !important;
}

.hdr-icon-wrap {
    width: 36px !important;
    height: 36px !important;
    background: #fff3e0 !important;
    border: 1px solid #f9c090 !important;
    border-radius: 8px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    flex-shrink: 0 !important;
}

    .hdr-icon-wrap i {
        font-size: 18px !important;
        color: #b4783b !important;
    }

.hdr-text-wrap {
    display: flex !important;
    flex-direction: column !important;
}

.hdr-title {
    font-size: 15px !important;
    font-weight: 700 !important;
    color: #1e293b !important;
    line-height: 1.2 !important;
}

.hdr-subtitle {
    font-size: 11px !important;
    color: #64748b !important;
    line-height: 1.2 !important;
    margin-top: 1px !important;
}

.hdr-right-section {
    display: flex !important;
    align-items: center !important;
    gap: 12px !important;
    margin-left: auto !important;
    margin-right: 12px !important;
}

    .hdr-right-section .vertical-tabs.theme-tab {
        position: relative !important;
        top: auto !important;
        right: auto !important;
        flex-shrink: 0 !important;
        margin-left: 0 !important;
    }

.hdr-status-tabs {
    display: flex !important;
    align-items: center !important;
    gap: 4px !important;
}

    .hdr-status-tabs .tt-stab {
        padding: 5px 12px !important;
        font-size: 12px !important;
        font-weight: 600 !important;
        color: #64748b !important;
        background: #f8fafc !important;
        border: 1px solid #e2e8f0 !important;
        border-radius: 20px !important;
        cursor: pointer !important;
        display: flex !important;
        align-items: center !important;
        gap: 6px !important;
        transition: all 0.2s ease !important;
    }

        .hdr-status-tabs .tt-stab:hover {
            background: #fff8f0 !important;
            border-color: #fcdfb3 !important;
            color: #b4783b !important;
        }

        .hdr-status-tabs .tt-stab.active {
            background: #b4783b !important;
            border-color: #b4783b !important;
            color: #ffffff !important;
        }

.target-setup-page .target-detail-page {
    padding: 28px 36px 40px;
}

.target-setup-page .target-detail-page {
    padding: 28px 36px 40px;
}

    .target-setup-page .target-detail-page .target-detail-header {
        align-items: center;
        border: 1px solid #ead8c6;
        border-radius: 20px;
        display: flex;
        gap: 30px;
        min-height: 92px;
        padding: 16px 21px;
    }

    .target-setup-page .target-detail-page .target-detail-title {
        align-items: center;
        display: flex;
        flex: 0 0 auto;
    }

    .target-setup-page .target-detail-page .target-back-button {
        border-radius: 14px;
        height: 44px;
        margin-right: 15px;
        min-width: 44px;
    }

        .target-setup-page .target-detail-page .target-back-button .fa {
            font-size: 18px;
        }

    .target-setup-page .target-detail-page .target-detail-title h3 {
        color: #07142d;
        font-size: 20px;
        font-weight: 700;
        line-height: 24px;
        margin: 0;
        white-space: nowrap;
    }

    .target-setup-page .target-detail-page .target-detail-title p {
        color: #ad8762;
        font-size: 15px;
        line-height: 20px;
        margin-top: 1px;
    }

    .target-setup-page .target-detail-page .target-detail-title .status-badge {
        border: 1px solid #f2b84b;
        border-radius: 8px;
        color: #bd6b00;
        display: inline-flex;
        font-size: 13px;
        font-weight: 600;
        line-height: 28px;
        margin-left: 9px;
        padding: 0 12px;
        vertical-align: middle;
    }

    .target-setup-page .target-detail-page .target-detail-search {
        border-radius: 15px;
        height: 38px;
        margin-left: 0;
        padding: 0 14px;
        width: 325px;
    }

        .target-setup-page .target-detail-page .target-detail-search .fa {
            font-size: 16px;
        }

        .target-setup-page .target-detail-page .target-detail-search .form-control {
            font-size: 15px;
            height: 36px;
        }

    .target-setup-page .target-detail-page .target-detail-header > .button-common {
        border-radius: 13px !important;
        font-size: 15px;
        height: 42px;
        min-width: 98px;
        padding: 0 18px;
    }

    .target-setup-page .target-detail-page .target-validation-summary {
        border-radius: 20px;
        font-size: 15px;
        margin-top: 30px;
        min-height: 74px;
        padding: 10px 11px;
    }

    .target-setup-page .target-detail-page .target-validation-tabs {
        border-radius: 15px;
        min-height: 54px;
        padding: 5px;
    }

    .target-setup-page .target-detail-page .target-validation-tab {
        border-radius: 12px;
        font-size: 15px;
        gap: 10px;
        min-height: 44px;
        padding: 0 17px;
    }

        .target-setup-page .target-detail-page .target-validation-tab.active {
            border-radius: 12px;
        }

        .target-setup-page .target-detail-page .target-validation-tab .fa {
            font-size: 16px;
        }

        .target-setup-page .target-detail-page .target-validation-tab strong {
            border-radius: 6px;
            font-size: 14px;
            min-width: 24px;
            padding: 3px 7px;
            text-align: center;
        }

    .target-setup-page .target-detail-page .target-validation-summary > span {
        color: #a48b6c;
        font-size: 15px;
        padding-right: 12px;
    }

    .target-setup-page .target-detail-page .target-validation-table {
        border-radius: 20px !important;
        margin-top: 31px;
    }

        .target-setup-page .target-detail-page .target-validation-table .table-responsive {
            max-height: 320px;
        }

        .target-setup-page .target-detail-page .target-validation-table thead th {
            box-sizing: border-box;
            color: #a28b6e;
            font-size: 16px !important;
            font-weight: 700 !important;
            height: 55px;
            letter-spacing: .03em;
            padding: 15px 21px;
            white-space: nowrap;
        }

        .target-setup-page .target-detail-page .target-validation-table tbody td {
            box-sizing: border-box;
            color: #654f3c;
            font-size: 15px !important;
            height: 50px;
            padding: 13px 21px;
        }

    .target-setup-page .target-detail-page .target-validation-footer {
        border-top: 1px solid #eadfd4;
        color: #866d55;
        font-size: 14px;
        min-height: 60px;
        padding: 0 30px;
    }

        .target-setup-page .target-detail-page .target-validation-footer .btn-link {
            color: #c66f2b;
            font-size: 14px;
            font-weight: 600;
        }

@media(max-width:767px) {
    .target-setup-page .target-detail-page {
        padding: 18px 14px 30px;
    }

        .target-setup-page .target-detail-page .target-detail-header {
            align-items: stretch;
            flex-direction: column;
            gap: 14px;
        }

        .target-setup-page .target-detail-page .target-detail-title h3 {
            font-size: 17px;
            white-space: normal;
        }

        .target-setup-page .target-detail-page .target-detail-search {
            width: 100%;
        }

        .target-setup-page .target-detail-page .target-detail-header > .button-common {
            margin-left: 0;
        }

        .target-setup-page .target-detail-page .target-validation-summary {
            align-items: stretch;
            flex-direction: column;
            gap: 12px;
        }
}

/* Target Setup - AI Studio proportions, scoped away from allocation pages. */
#targetSetupPage {
    padding: 28px 36px 32px;
}

#targetSetupPage #targetPrerequisiteSection,
#targetSetupPage #targetShiftPlanSection {
    background: #fff;
    border: 1px solid #eadfd4;
    border-radius: 18px !important;
    box-shadow: 0 1px 2px rgba(74, 56, 40, .14);
    margin: 0 0 28px;
    padding: 28px;
    width: 100%;
}

#targetSetupPage .section-heading {
    align-items: center;
    margin-bottom: 28px;
}

#targetSetupPage .section-heading h3 {
    color: #07142d;
    font-size: 15px;
    font-weight: 700;
    line-height: 20px;
    margin: 0 0 4px;
}

#targetSetupPage .section-heading p {
    color: #a89985;
    font-size: 13px;
    font-weight: 400;
    line-height: 20px;
    margin: 0;
}

#targetSetupPage #btnAddTargetPlan {
    align-items: center;
    background: #bf7739 !important;
    border: 0;
    border-radius: 14px;
    box-shadow: 0 2px 3px rgba(107, 64, 27, .16);
    color: #fff;
    display: inline-flex;
    flex: 0 0 auto;
    font-size: 13px;
    font-weight: 700;
    gap: 8px;
    height: 36px;
    justify-content: center;
    min-width: 119px;
    padding: 0 18px;
    text-transform: none;
}

#targetSetupPage #btnAddTargetPlan:hover,
#targetSetupPage #btnAddTargetPlan:focus {
    background: #ac682f !important;
    color: #fff !important;
}

#targetSetupPage #btnAddTargetPlan .fa {
    font-size: 14px;
    line-height: 1;
    margin: 0;
}

#targetSetupPage .prerequisite-grid,
#targetSetupPage .material-grid {
    gap: 18px;
}

#targetSetupPage .target-prerequisite-summary {
    display: none;
    flex-wrap: nowrap;
    gap: 10px;
    overflow-x: auto;
    margin-left: auto;
    min-width: 0;
}

#targetPrerequisiteSection:has(.prerequisite-grid.collapse:not(.in):not(.show)) .target-prerequisite-summary {
    display: flex;
}

#targetSetupPage .target-prerequisite-controls {
    flex-shrink: 0;
}

#targetPrerequisiteSection > .section-heading > div:first-child {
    min-width: 0;
}

#targetSetupPage .target-prerequisite-summary-item {
    flex-shrink: 0;
    white-space: nowrap;
    align-items: center;
    background: #fff8e9;
    border: 1px solid #f2dfb8;
    border-radius: 999px;
    color: #946014;
    display: inline-flex;
    font-size: 12px;
    gap: 8px;
    line-height: 18px;
    padding: 7px 12px;
    text-transform: none;
}

#targetSetupPage .target-prerequisite-summary-item.is-completed {
    background: #ecfdf5;
    border-color: #bbebd5;
    color: #087f5b;
}

#targetSetupPage .target-prerequisite-summary-item.is-loading {
    background: #faf8f5;
    border-color: #eadfd4;
    color: #8f7a65;
}

#targetSetupPage .target-prerequisite-summary-item.is-error,
#targetSetupPage .target-prerequisite-summary-item.is-failed {
    background: #fff0f3;
    border-color: #ffd1da;
    color: #c52d50;
}

#targetSetupPage .prerequisite-card {
    display: flex;
    flex-direction: column;
    min-height: 196px;
    padding: 16px;
}

#targetSetupPage .prerequisite-card-header {
    gap: 10px;
    min-height: 44px;
    padding: 0 0 12px;
}

#targetSetupPage .prerequisite-icon {
    flex: 0 0 32px;
    height: 32px;
    margin: 0;
    width: 32px;
}

#targetSetupPage .prerequisite-name {
    font-size: 13px;
    line-height: 17px;
}

#targetSetupPage .prerequisite-stage {
    font-size: 12px;
    line-height: 16px;
}

#targetSetupPage .prerequisite-card-header .status-badge {
    border-radius: 999px;
    flex-shrink: 0;
    font-size: 12px;
    line-height: 18px;
    padding: 3px 9px;
}

#targetSetupPage .upload-area {
    flex: 1 0 auto;
    font-size: 10px;
    min-height: 68px;
    padding: 12px;
}

#targetSetupPage .failed .upload-area,
#targetSetupPage .validated .upload-area {
    margin: 12px 0;
    min-height: 44px;
    padding: 8px 10px;
}

#targetSetupPage .card-actions {
    min-height: 50px;
    padding: 12px 0 0;
}

#targetSetupPage .icon-actions {
    gap: 0;
    padding: 3px;
}

#targetSetupPage .icon-actions .btn {
    background: transparent;
    border: 0;
    border-radius: 5px;
    box-shadow: none;
    min-height: 30px;
    min-width: 30px;
    padding: 3px 7px;
}

#targetSetupPage .icon-actions .btn + .btn {
    border-left: 1px solid #eadfd4;
    border-radius: 0;
}

#targetSetupPage .icon-actions .btn:hover,
#targetSetupPage .icon-actions .btn:focus-visible {
    background: #f1e8de;
}

#targetSetupPage #materialSummary .material-card {
    background: #fff;
    border: 1px solid #e8d6c5;
    border-radius: 13px;
    box-shadow: none;
    gap: 12px;
    margin: 0;
    min-height: 66px;
    padding: 14px 22px;
    text-align: left;
    font-family: inherit;
}

#targetSetupPage #materialSummary .material-card:focus-visible {
    outline: 2px solid #c87a3b;
    outline-offset: 3px;
}

#targetSetupPage #materialSummary .material-card:disabled {
    cursor: wait;
}

#targetSetupPage #materialSummary .material-load-status {
    grid-column: 1 / -1;
    color: #907d6a;
}

#targetSetupPage #materialSummary .material-card.active {
    background: linear-gradient(110deg, #faf7f3, #fff);
    border-color: #c87a3b;
    box-shadow: 0 0 0 1px #c87a3b, 0 6px 16px rgba(151, 93, 43, .06);
}

#targetSetupPage #materialSummary .material-name {
    color: #302c28;
    font-size: 13px;
    line-height: 18px;
}

#targetSetupPage #materialSummary .material-card.active .material-name {
    color: #bf7739;
}

#targetSetupPage #materialSummary .material-indicator {
    flex: 0 0 9px;
    height: 9px;
    margin-right: 10px;
    width: 9px;
}

#targetSetupPage #materialSummary .material-summary {
    align-items: center;
    display: flex;
    flex: 0 0 auto;
    font-size: 11px;
    gap: 12px;
    line-height: 18px;
    white-space: nowrap;
}

#targetSetupPage #materialSummary .material-summary strong {
    font-size: inherit;
    font-weight: 700;
}

#targetSetupPage #materialSummary .patch-badge {
    border-radius: 6px;
    font-size: 12px;
    font-weight: 600;
    line-height: 18px;
    margin: 0;
    padding: 4px 10px;
}

#targetSetupPage #targetShiftPlanSection .shift-plan-table {
    border-radius: 13px !important;
    margin: 28px 0 0;
}

/* A single natural-height table: no nested scrolling or fixed action-column clone. */
#targetSetupPage #targetShiftPlanSection .table-responsive {
    max-height: none;
    overflow-x: auto;
    overflow-y: visible;
}

#targetSetupPage #tblTargetShiftPlan_wrapper {
    min-height: 0;
}

#targetSetupPage #tblTargetShiftPlan {
    box-sizing: border-box;
    min-width: 1100px;
    table-layout: auto;
}

/* Keep the authored Title Case labels across the three Shift Plan pages. */
#targetSetupPage thead th,
#diggerAllocationPage thead th,
#haulerAllocationPage thead th {
    text-transform: none;
}

#targetSetupPage #tblTargetShiftPlan thead th {
    background: #fcfaf7 !important;
    box-sizing: border-box;
    color: #a89985 !important;
    font-size: 12px !important;
    font-weight: 700 !important;
    height: 46px;
    letter-spacing: .035em;
    line-height: 18px;
    padding: 12px 16px;
    position: static;
    text-transform: none;
    white-space: nowrap;
}

#targetSetupPage #tblTargetShiftPlan tbody td {
    background: #fff !important;
    box-sizing: border-box;
    color: #897a69 !important;
    font-size: 13px !important;
    font-weight: 400;
    height: 52px;
    line-height: 20px;
    padding: 12px 16px;
    white-space: nowrap;
    vertical-align: middle;
}

#targetSetupPage #tblTargetShiftPlan tbody tr:last-child td {
    border-bottom: 0;
}

#targetSetupPage #tblTargetShiftPlan thead th.target-plan-number,
#targetSetupPage #tblTargetShiftPlan tbody td.target-plan-number {
    text-align: center !important;
    padding: 12px 16px;
    font-variant-numeric: tabular-nums;
}

#targetSetupPage #tblTargetShiftPlan th.target-plan-priority,
#targetSetupPage #tblTargetShiftPlan td.target-plan-priority,
#targetSetupPage #tblTargetShiftPlan th.target-plan-actions,
#targetSetupPage #tblTargetShiftPlan td.target-plan-actions {
    text-align: center !important;
}

#targetSetupPage #tblTargetShiftPlan .target-plan-bench { width: 196px; min-width: 196px; max-width: 196px; }
#targetSetupPage #tblTargetShiftPlan .target-plan-sector { width: 100px; min-width: 100px; max-width: 100px; }
#targetSetupPage #tblTargetShiftPlan .target-plan-number { width: 180px; min-width: 180px; max-width: 180px; }
#targetSetupPage #tblTargetShiftPlan .target-plan-priority { width: 132px; min-width: 132px; }
#targetSetupPage #tblTargetShiftPlan .target-plan-actions { width: 100px; min-width: 100px; }
#targetSetupPage #tblTargetShiftPlan .target-plan-target-display,
#targetSetupPage #tblTargetShiftPlan .target-plan-target-editor {
    display: inline-flex; align-items: center; justify-content: flex-end; gap: 8px;
    width: 148px; height: 36px; padding: 0 10px; box-sizing: border-box;
}
#targetSetupPage #tblTargetShiftPlan .target-plan-target-editor {
    border: 1px solid #d9bfa5; border-radius: 8px; background: #fff;
}
#targetSetupPage #tblTargetShiftPlan .target-plan-quantity {
    color: #172b3a; font-weight: 600; font-size: 13px; font-variant-numeric: tabular-nums;
}
#targetSetupPage #tblTargetShiftPlan .target-plan-unit { margin: 0; flex: 0 0 auto; font-size: 10px; color: #8c7b68; font-weight: 500; }
#targetSetupPage #tblTargetShiftPlan .target-plan-priority-badge {
    display: inline-block; min-width: 45px; padding: 1px 10px;
    border: 1px solid #e5ddd3; border-radius: 20px; font-size: 11px; line-height: 17px;
}
#targetSetupPage #tblTargetShiftPlan .target-priority-high { color: #df304c; border-color: #ffc6ce; background: #fff8f9; }
#targetSetupPage #tblTargetShiftPlan .target-priority-medium { color: #aa7114; border-color: #f3d69e; background: #fffbf2; }
#targetSetupPage #tblTargetShiftPlan .target-priority-low { color: #00895b; border-color: #b8e8d5; background: #f1fcf6; }
#targetSetupPage #tblTargetShiftPlan .target-priority-neutral { color: #897a69; background: #faf8f5; }
#targetSetupPage #tblTargetShiftPlan .target-plan-action-group { display: flex; align-items: center; justify-content: center; gap: 6px; }
#targetSetupPage #tblTargetShiftPlan .target-plan-action {
    display: inline-flex; align-items: center; justify-content: center;
    width: 34px; height: 34px; padding: 0; border: 1px solid #eadfd4;
    border-radius: 8px; background: transparent; color: #a3937f; cursor: pointer;
}
#targetSetupPage #tblTargetShiftPlan .target-plan-edit { color: #9b6b3e; background: #fff; }
#targetSetupPage #tblTargetShiftPlan .target-plan-edit:hover { color: #bf7739; background: #fff6eb; border-color: #efd7bf; }
#targetSetupPage #tblTargetShiftPlan .target-plan-save { color: #00895b; background: #effcf5 !important; border: 1px solid #a9e8ce !important; }
#targetSetupPage #tblTargetShiftPlan .target-plan-save:hover { color: #006b47; background: #dcf7e9 !important; }
#targetSetupPage #tblTargetShiftPlan .target-plan-cancel { color: #e33351; background: #fff2f5 !important; border: 1px solid #ffc6ce !important; }
#targetSetupPage #tblTargetShiftPlan .target-plan-cancel:hover { color: #bb1633; background: #ffe3e9 !important; }
#targetSetupPage #tblTargetShiftPlan .target-plan-cancel .fa-times::before { content: "\f00d" !important; }
#targetSetupPage #tblTargetShiftPlan .target-plan-action:disabled { opacity: .45; cursor: not-allowed; }
#targetSetupPage #tblTargetShiftPlan .target-plan-action:focus-visible,
#targetSetupPage #tblTargetShiftPlan .target-plan-input:focus-visible { outline: 2px solid #bf7739; outline-offset: 2px; }
#targetSetupPage #tblTargetShiftPlan tr.target-plan-editing td { background: #fffaf4 !important; color: #4f4438 !important; }
#targetSetupPage #tblTargetShiftPlan tr.target-plan-editing td:first-child { box-shadow: inset 2px 0 #bf7739; }
#targetSetupPage #tblTargetShiftPlan .target-plan-input {
    display: inline-block; width: 108px; height: 36px; padding: 6px 10px;
    border: 1px solid #d9bfa5; border-radius: 8px; background: #fff;
    color: #172b3a; font: inherit; line-height: 20px;
}
#targetSetupPage #tblTargetShiftPlan .target-plan-target-editor input.target-plan-input {
    width: 100%; min-width: 0; height: 32px; padding: 0; border: 0; outline: 0;
    box-shadow: none; text-align: right; font-weight: 600; font-variant-numeric: tabular-nums;
    appearance: textfield; -moz-appearance: textfield;
}
#targetSetupPage #tblTargetShiftPlan .target-plan-target-editor input::-webkit-inner-spin-button,
#targetSetupPage #tblTargetShiftPlan .target-plan-target-editor input::-webkit-outer-spin-button { appearance: none; margin: 0; }
#targetSetupPage #tblTargetShiftPlan .target-plan-target-editor:focus-within { border-color: #bf7739; box-shadow: 0 0 0 3px #bf77391a; }
#targetSetupPage #tblTargetShiftPlan select.target-plan-priority-input {
    width: 104px; padding-right: 28px; appearance: none; cursor: pointer;
    background: #fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12'%3E%3Cpath d='m3 4.5 3 3 3-3' fill='none' stroke='%238c7b68' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") no-repeat right 10px center;
}
#targetSetupPage #tblTargetShiftPlan .target-plan-bench .select2-container { width: 164px !important; min-width: 164px; max-width: 164px; }
#targetSetupPage #tblTargetShiftPlan .target-plan-bench .select2-selection--multiple {
    display: flex; align-items: center; gap: 4px; position: relative;
    min-height: 36px; height: 36px; padding: 0 20px 0 6px;
    border: 1px solid #d9bfa5; border-radius: 8px; background: #fff;
}
#targetSetupPage #tblTargetShiftPlan .target-plan-bench .select2-selection--multiple::after {
    content: ""; position: absolute; right: 9px; top: 12px;
    width: 6px; height: 6px; border-right: 1.5px solid #8c7b68; border-bottom: 1.5px solid #8c7b68;
    transform: rotate(45deg); pointer-events: none;
}
#targetSetupPage #tblTargetShiftPlan .target-plan-bench .select2-container--focus .select2-selection { border-color: #bf7739; box-shadow: 0 0 0 3px #bf77391a; }
#targetSetupPage #tblTargetShiftPlan .target-plan-bench .select2-selection__rendered {
    display: flex !important; align-items: center; gap: 4px; padding: 0 !important; margin: 0;
    flex: 0 1 auto; min-width: 0; width: auto; max-width: calc(100% - 18px);
    height: 30px; white-space: nowrap; overflow: hidden;
}
#targetSetupPage #tblTargetShiftPlan .target-plan-bench .select2-selection__choice {
    display: inline-flex; align-items: center; flex: 0 0 auto; gap: 4px;
    max-width: 92px; min-width: 0; margin: 0 !important; padding: 0 6px !important;
    height: 24px; border: 0 !important; border-radius: 5px; background: #f5ede3 !important;
    color: #725536; font-size: 11px; line-height: 24px; overflow: hidden; text-overflow: ellipsis;
}
#targetSetupPage #tblTargetShiftPlan .target-plan-bench .select2-selection__choice ~ .select2-selection__choice { display: none; }
#targetSetupPage #tblTargetShiftPlan .target-plan-bench .select2-selection__choice__remove {
    position: static; display: inline-flex; align-items: center; justify-content: center;
    flex: 0 0 12px; width: 12px; height: 20px; padding: 0; margin: 0;
    border: 0 !important; border-radius: 3px; background: transparent !important;
    color: #927352; font-size: 14px; line-height: 20px;
}
#targetSetupPage #tblTargetShiftPlan .target-plan-bench .select2-selection__choice__remove:focus-visible { outline: 1px solid #bf7739; }
#targetSetupPage #tblTargetShiftPlan .target-plan-bench .select2-selection__choice__display {
    min-width: 0; padding: 0; overflow: hidden; text-overflow: ellipsis;
}
#targetSetupPage #tblTargetShiftPlan .target-plan-bench .select2-search--inline {
    display: flex; align-items: center; float: none; width: 0; min-width: 14px; flex: 1 1 0; margin: 0;
}
#targetSetupPage #tblTargetShiftPlan .target-plan-bench .select2-search__field {
    display: block; width: 100% !important; min-width: 0; margin: 0 !important; padding: 0;
    height: 26px; min-height: 0; border: 0; outline: 0; box-shadow: none;
    font-family: inherit; font-size: 12px; line-height: 26px; vertical-align: middle;
}
#targetSetupPage #tblTargetShiftPlan .target-plan-bench-summary { display: inline-flex; align-items: center; gap: 5px; max-width: 164px; }
#targetSetupPage #tblTargetShiftPlan .target-plan-bench-chip { border-radius: 5px; padding: 2px 7px; background: #f7f2ec; color: #725536; font-size: 11px; }
#targetSetupPage #tblTargetShiftPlan .target-plan-bench-count { flex: 0 0 auto; display: inline-block; margin: 0; border-radius: 5px; padding: 0 5px; height: 24px; line-height: 24px; background: #f1e3d3; color: #986b3a; font-size: 11px; font-weight: 600; }
#targetSetupPage #tblTargetShiftPlan .target-plan-empty { color: #baad9e; }
#targetSetupPage .target-plan-bench-dropdown { border: 1px solid #d9bfa5; border-radius: 9px; overflow: hidden; box-shadow: 0 8px 24px #59412b1a; }
#targetSetupPage .target-plan-bench-dropdown .select2-results__option { padding: 9px 12px; font-size: 12px; color: #574a3c; }
#targetSetupPage .target-plan-bench-dropdown .select2-results__option--selected { background: #faf3e9; color: #986b3a; font-weight: 600; }
#targetSetupPage .target-plan-bench-dropdown .select2-results__option--highlighted { background: #bf7739; color: #fff; }

#targetSetupPage #tblTargetShiftPlan .dataTables_empty {
    background-image: none !important;
    font-size: 13px !important;
    height: 96px;
    padding: 24px 16px;
    text-align: center;
}

#targetSetupPage #targetSetupFooter {
    margin: -1px 0 0;
    padding: 18px 0 0;
}

#targetSetupPage #targetSetupFooter .btn {
    align-items: center;
    border-radius: 14px;
    display: inline-flex;
    font-size: 13px;
    gap: 12px;
    justify-content: center;
    line-height: 20px;
    min-height: 42px;
    padding: 10px 22px;
}

#targetSetupPage #targetSetupFooter .target-clear-button {
    min-width: 143px;
}

#targetSetupPage #targetSetupFooter .trip-sense-primary-btn {
    background: #bf7739 !important;
    color: #fff !important;
}

#targetSetupPage #targetSetupFooter .trip-sense-primary-btn:hover,
#targetSetupPage #targetSetupFooter .trip-sense-primary-btn:focus {
    background: #ac682f !important;
    color: #fff !important;
}

#targetSetupPage #btnAddTargetPlan:focus-visible,
#targetSetupPage #targetSetupFooter .btn:focus-visible {
    outline: 2px solid #bf7739;
    outline-offset: 3px;
}

@media (max-width: 1450px) {
    #targetSetupPage #materialSummary .material-card {
        align-items: flex-start;
        flex-direction: column;
        gap: 8px;
        padding: 14px 18px;
    }

    #targetSetupPage #materialSummary .material-summary {
        justify-content: space-between;
        width: 100%;
    }
}

@media (max-width: 991px) {
    #targetSetupPage { padding: 24px; }

    #targetSetupPage #targetPrerequisiteSection,
    #targetSetupPage #targetShiftPlanSection { padding: 20px; }
}

@media (max-width: 600px) {
    #targetSetupPage { padding: 16px; }

    #targetSetupPage .section-heading {
        align-items: flex-start;
        flex-wrap: wrap;
    }

    #targetSetupPage #targetSetupFooter {
        align-items: stretch;
        flex-direction: column;
        gap: 12px;
    }

    #targetSetupPage #targetSetupFooter .btn {
        width: 100%;
    }
}

/* Target Setup */
.target-setup-page {
    color: #25211d;
    font-family: "Plus Jakarta Sans","Roboto",sans-serif
}

/* Page surface only - the shared header box keeps its own white background */
div.target-setup-page:not(.page-header-box) {
    background: #faf8f5;
    padding: 24px
}

.target-setup-page *, .target-setup-page *::before, .target-setup-page *::after {
    box-sizing: border-box
}

.target-setup-page .target-page-header {
    align-items: center;
    background: #fff;
    display: flex;
    flex: 1;
    flex-wrap: wrap;
    gap: 16px;
    margin: 0;
    min-height: 46px;
    padding: 0 0 0 4px
}

.target-setup-page .target-title {
    align-items: center;
    display: flex;
    color: #0f172a;
    font-size: 20px;
    font-weight: 600;
    margin: 0
}

    .target-setup-page .target-title .material-icons {
        color: #c87a35;
        font-size: 20px;
        margin-right: 8px
    }

.target-setup-page .step-badge, .target-setup-page .workflow-badge, .target-setup-page .status-badge, .target-setup-page .patch-badge {
    border: 1px solid #ead8c6;
    border-radius: 6px;
    color: #b86d2e;
    display: inline-flex;
    font-size: 11px;
    font-weight: 600;
    padding: 3px 10px;
    white-space: nowrap
}

/* These pills also carry .filter-item, whose globals force white text, a 9px select2 and 5px span margins */
.target-setup-page .header-filter {
    align-items: center;
    background: #fcfaf7;
    border: 1px solid #eadfd4;
    border-radius: 12px;
    display: flex;
    height: 34px;
    margin: 0;
    padding: 0 14px
}

    .target-setup-page .header-filter label {
        color: #a58d74 !important;
        font-size: 11px !important;
        font-weight: 700 !important;
        margin: 0 8px 0 0;
        text-transform: uppercase
    }

    .target-setup-page .header-filter .material-icons {
        color: #6b5746;
        font-size: 18px;
        margin-right: 8px
    }

    .target-setup-page .header-filter span {
        margin-bottom: 0 !important
    }

    .target-setup-page .header-filter .form-control, .target-setup-page .header-filter .select2-container, .target-setup-page .header-filter .select2-selection {
        background: transparent !important;
        border: 0 !important;
        box-shadow: none !important;
        height: 30px !important;
        min-width: 142px
    }

    .target-setup-page .header-filter .select2-container--default .select2-selection--single {
        height: 30px !important
    }

        .target-setup-page .header-filter .select2-container--default .select2-selection--single .select2-selection__rendered {
            color: #25211d !important;
            font-size: 13px !important;
            font-weight: 600 !important;
            line-height: 30px !important;
            padding-left: 0 !important
        }

        .target-setup-page .header-filter .select2-container--default .select2-selection--single .select2-selection__arrow {
            height: 30px !important
        }

            .target-setup-page .header-filter .select2-container--default .select2-selection--single .select2-selection__arrow b {
                border: 0;
                border-bottom: 1.5px solid #8f7a65;
                border-right: 1.5px solid #8f7a65;
                height: 7px;
                margin: -5px 0 0 -4px;
                transform: rotate(45deg);
                width: 7px
            }

.target-setup-page .workflow-badge {
    color: #9c876f;
    gap: 8px;
    margin-left: auto;
    padding: 5px 11px
}

    .target-setup-page .workflow-badge strong {
        color: #bd7131
    }

.target-setup-page .workflow-dot {
    background: #d5cbc0;
    border-radius: 50%;
    color: #fff;
    display: inline-block;
    font-size: 10px;
    height: 16px;
    line-height: 16px;
    text-align: center;
    width: 16px
}

    .target-setup-page .workflow-dot.active {
        background: #c87a35
    }

/* !important guards override the global .card rules in themestyles.css (border-radius:0, overflow:visible) */
.target-setup-page .target-section {
    background: #fff;
    border: 1px solid #eadfd4;
    border-radius: 16px !important;
    box-shadow: 0 2px 5px rgba(78,56,37,.08);
    margin-bottom: 24px;
    padding: 24px
}

.target-setup-page .target-collapse-button {
    align-items: center;
    background: #fcfaf7;
    border: 1px solid #eadfd4;
    border-radius: 12px;
    color: #9c876f;
    display: flex;
    height: 34px;
    justify-content: center;
    margin-left: 12px;
    min-width: 34px;
    padding: 0
}

    .target-setup-page .target-collapse-button[aria-expanded="false"] .fa-angle-up {
        transform: rotate(180deg)
    }

.target-setup-page .section-heading {
    align-items: flex-start;
    display: flex;
    justify-content: space-between;
    gap: 16px;
    margin-bottom: 24px
}

.target-setup-page .target-detail-header {
    align-items: center;
    background: #fff;
    border: 1px solid #eadfd4;
    border-radius: 16px;
    display: flex;
    gap: 20px;
    min-height: 72px;
    padding: 14px 16px
}

.target-setup-page .target-detail-page {
    padding: 0 14px
}

.target-setup-page .target-detail-title {
    align-items: center;
    display: flex;
    min-width: 235px
}

    .target-setup-page .target-detail-title h3 {
        align-items: center;
        display: flex;
        font-size: 18px;
        font-weight: 700;
        gap: 10px;
        margin: 0
    }

    .target-setup-page .target-detail-title p {
        color: #ad8e6e;
        font-size: 12px;
        margin: 2px 0 0
    }

.target-setup-page .target-back-button {
    align-items: center;
    background: #fcfaf7;
    border: 1px solid #eadfd4;
    border-radius: 12px;
    color: #8f7a65;
    display: flex;
    height: 40px;
    justify-content: center;
    margin-right: 14px;
    min-width: 40px;
    padding: 0
}

.target-setup-page .target-detail-search {
    align-items: center;
    background: #fcfaf7;
    border: 1px solid #eadfd4;
    border-radius: 12px;
    display: flex;
    height: 36px;
    padding: 0 12px;
    width: 256px
}

    .target-setup-page .target-detail-search i {
        color: #b29b83
    }

    .target-setup-page .target-detail-search .form-control {
        background: transparent;
        border: 0;
        box-shadow: none;
        font-size: 12px;
        height: 34px;
        padding-left: 10px
    }

/* .button-common forces a white/brown button, so the green Save needs !important */
.target-setup-page .target-detail-header > .button-common {
    background: #16a34a !important;
    border: 0 !important;
    border-radius: 10px;
    color: #fff !important;
    font-weight: 700;
    height: 38px;
    margin-left: auto;
    min-width: 92px
}

.target-setup-page .target-validation-summary {
    align-items: center;
    border: 1px solid #eadfd4;
    border-radius: 16px;
    color: #ad8e6e;
    display: flex;
    font-size: 12px;
    justify-content: space-between;
    margin-top: 24px;
    min-height: 58px;
    padding: 8px
}

/* Group sits a shade darker so the active tab reads as a white pill */
.target-setup-page .target-validation-tabs {
    align-items: center;
    background: #efe9e2;
    border-radius: 12px;
    display: flex;
    padding: 4px
}

.target-setup-page .target-validation-tab {
    align-items: center;
    background: transparent;
    border: 0;
    color: #9c876f;
    cursor: pointer;
    display: flex;
    font-family: inherit;
    font-size: 13px;
    font-weight: 600;
    gap: 8px;
    min-height: 36px;
    outline: 0;
    padding: 0 14px
}

    /* Clicking a tab must not leave the browser focus ring around it */
    .target-setup-page .target-validation-tab:focus,
    .target-setup-page .target-validation-tab:focus-visible,
    .target-setup-page .target-validation-tab:active {
        border: 0 !important;
        outline: 0 !important
    }

    .target-setup-page .target-validation-tab strong {
        background: #e9e2db;
        border-radius: 4px;
        padding: 2px 7px
    }

    .target-setup-page .target-validation-tab.active {
        background: #fff;
        border-radius: 10px;
        box-shadow: 0 1px 2px rgba(78,56,37,.10);
        color: #25211d;
        font-weight: 700
    }

        .target-setup-page .target-validation-tab.active .fa-check-circle-o {
            color: #12a05f
        }

.target-setup-page .target-validation-tab-error.active {
    color: #e51549
}

    .target-setup-page .target-validation-tab-error.active strong {
        background: #fff0f3
    }

.target-setup-page .target-validation-table {
    margin-top: 24px
}

    /* Match the shift-plan grid: fill the card, no sort affordances */
    .target-setup-page .target-validation-table table {
        border-collapse: collapse !important;
        margin: 0 !important;
        width: 100% !important
    }

    .target-setup-page .target-validation-table thead th::before,
    .target-setup-page .target-validation-table thead th::after {
        display: none !important
    }

    .target-setup-page .target-validation-table thead th {
        background: #fcfaf7;
        color: #a58d74;
        font-size: 12px;
        font-weight: 700;
        padding: 14px 16px;
        text-transform: uppercase
    }

    .target-setup-page .target-validation-table tbody td {
        border-bottom: 1px solid #eee8e1;
        font-size: 12px;
        padding: 14px 16px;
        vertical-align: middle
    }

/* Error stripe belongs to the staff error grid only, not the equipment/speed viewers */
.target-setup-page #tblTargetStaffUploadErrors tbody tr {
    border-left: 2px solid #ff2b5c
}

.target-setup-page .target-validation-table tbody tr.target-validation-row-focus {
    background: #fff0f3;
    box-shadow: inset 3px 0 0 #ff2b5c
}

.target-setup-page .target-validation-link {
    color: #c00035;
    font-weight: 600;
    text-decoration: underline dotted
}

.target-setup-page .target-flagged-badge {
    background: #ffe6ec;
    border-radius: 14px;
    color: #c00035;
    display: inline-flex;
    font-weight: 600;
    padding: 4px 9px
}

.target-setup-page .target-validation-footer {
    align-items: center;
    color: #8f7a65;
    display: flex;
    font-size: 12px;
    justify-content: space-between;
    min-height: 50px;
    padding: 0 24px
}

    .target-setup-page .target-validation-footer .btn-link {
        color: #c66f2b;
        font-size: 12px;
        font-weight: 600;
        text-decoration: none;
        text-transform: none
    }

.target-setup-page .section-heading h3 {
    color: #0f172a;
    font-size: 15px;
    font-weight: 600;
    letter-spacing: -.01em;
    margin: 0 0 4px
}

.target-setup-page .section-heading p {
    color: #a89985;
    font-size: 12px;
    font-weight: 500;
    margin: 0
}

.target-setup-page .prerequisite-grid, .target-setup-page .material-grid {
    display: grid;
    gap: 16px;
    grid-template-columns: repeat(3,minmax(0,1fr))
}

    .target-setup-page .prerequisite-grid.collapse:not(.in):not(.show) {
        display: none
    }

.target-setup-page .prerequisite-card {
    border: 1px solid #e6d5c5;
    border-radius: 13px !important;
    box-shadow: none;
    margin-bottom: 0;
    min-height: 154px;
    overflow: hidden !important
}

    .target-setup-page .prerequisite-card.failed {
        border-color: #ffb4c0
    }

    .target-setup-page .prerequisite-card.validated {
        border-color: #e6d5c5
    }

.target-setup-page .prerequisite-card-header {
    align-items: center;
    border-bottom: 1px solid #eee8e1;
    display: flex;
    padding: 11px 14px
}

.target-setup-page .prerequisite-icon {
    align-items: center;
    background: #fff3e5;
    border-radius: 9px;
    color: #d68128;
    display: flex;
    height: 28px;
    justify-content: center;
    margin-right: 10px;
    width: 28px
}

.target-setup-page .failed .prerequisite-icon {
    background: #fff0f3;
    color: #f42b5d
}

.target-setup-page .prerequisite-card:nth-child(3) .prerequisite-icon {
    background: #eaf4fb;
    color: #3b93c9
}

.target-setup-page .prerequisite-icon .material-icons {
    font-size: 16px
}

.target-setup-page .prerequisite-name {
    font-size: 12px;
    font-weight: 700;
    line-height: 17px
}

.target-setup-page .prerequisite-stage {
    color: #ad8e6e;
    font-size: 10px
}

.target-setup-page .status-badge {
    color: #6b5746;
    margin-left: auto
}

.target-setup-page .failed .status-badge {
    background: #fff0f3;
    border-color: #ffd1da;
    color: #e51549
}

.target-setup-page .validated > .prerequisite-card-header > .status-badge {
    background: #fff8e9;
    border-color: #f2cf83;
    color: #b36f00;
    font-weight: 700
}

.target-setup-page #targetPrerequisiteSection > .section-heading .status-badge {
    align-items: center;
    border-color: #f0dcb4;
    color: #c98a2f
}

.target-setup-page .upload-area {
    align-items: center;
    color: #a88059;
    display: flex;
    font-size: 12px;
    justify-content: center;
    min-height: 52px;
    padding: 9px 14px;
    text-align: center
}

.target-setup-page .failed .upload-area {
    background: #fffafb;
    border: 1px solid #fff0f3;
    border-radius: 9px;
    justify-content: space-between;
    margin: 8px 14px;
    min-height: 36px
}

.target-setup-page .validated .upload-area {
    background: #f0fff8;
    border: 1px solid #c7f0de;
    border-radius: 9px;
    color: #276c50;
    justify-content: space-between;
    margin: 8px 14px;
    min-height: 36px
}

.target-setup-page .validated .upload-area .status-badge {
    background: #dff8eb;
    border-color: #c5efd9;
    color: #00875a;
    font-weight: 700
}

.target-setup-page .card-actions {
    align-items: center;
    border-top: 1px solid #eee8e1;
    display: flex;
    justify-content: space-between;
    gap: 8px;
    padding: 8px 14px
}

.target-setup-page .icon-actions {
    background: #fbf7f3;
    border: 1px solid #eadfd4;
    border-radius: 9px;
    display: inline-flex;
    padding: 3px
}

    /* .card-actions .btn-sm drops these to 11px, which renders the glyphs too small */
    .target-setup-page .icon-actions .btn {
        color: #a58d74;
        font-size: 14px;
        min-height: 30px;
        min-width: 32px;
        padding: 3px 6px
    }

        .target-setup-page .icon-actions .btn + .btn {
            border-left: 1px solid #eadfd4;
            border-radius: 0
        }

.target-setup-page .failed .icon-actions .btn:nth-child(3) {
    color: #f42b5d
}

.target-setup-page .material-card {
    align-items: center;
    border: 1px solid #e6d5c5;
    border-radius: 13px;
    cursor: pointer;
    display: flex;
    justify-content: space-between;
    min-height: 66px;
    padding: 14px 20px
}

    .target-setup-page .material-card.active {
        border: 2px solid #ce7b32
    }

        .target-setup-page .material-card.active .patch-badge {
            background: #c87a35;
            border-color: #c87a35;
            color: #fff
        }

.target-setup-page .patch-badge {
    background: #fbf7f3
}

.target-setup-page .material-name {
    align-items: center;
    display: flex;
    font-size: 13px;
    font-weight: 700
}

.target-setup-page .material-indicator {
    background: #f2a516;
    border-radius: 50%;
    height: 9px;
    margin-right: 10px;
    width: 9px
}

.target-setup-page .material-card:nth-child(2) .material-indicator {
    background: #928574
}

.target-setup-page .material-card:nth-child(3) .material-indicator {
    background: #0bab78
}

.target-setup-page .material-summary {
    color: #ac9278;
    font-size: 12px
}

    .target-setup-page .material-summary strong {
        color: #28231f;
        font-size: 13px
    }

.target-setup-page .shift-plan-table {
    border: 1px solid #eadfd4;
    border-radius: 13px !important;
    box-shadow: none;
    margin-bottom: 0;
    margin-top: 24px;
    overflow: hidden !important
}

    /* Rows scroll inside the card; the header stays pinned */
    .target-setup-page .shift-plan-table .table-responsive {
        margin: 0;
        max-height: 420px;
        overflow-y: auto
    }

    /* The card already supplies the frame, so the wrapper must not nest a second
       bordered box, and it must not reserve the global 150px pager gap */
    .target-setup-page .shift-plan-table .dataTables_wrapper {
        background: transparent;
        border: 0;
        border-radius: 0;
        padding: 0
    }

        .target-setup-page .shift-plan-table .dataTables_wrapper .dataTables_paginate {
            margin-top: 0
        }

    /* Global empty state reserves 182px; keep it compact so the card stays close to content height */
    .target-setup-page .shift-plan-table .dataTables_empty {
        background-size: 84px auto !important;
        font-size: 14px !important;
        height: 112px;
        padding: 70px 12px 0
    }

.target-setup-page #tblTargetShiftPlan {
    border-collapse: collapse !important;
    table-layout: fixed;
    margin: 0 !important;
    width: 100% !important
}

    .target-setup-page #tblTargetShiftPlan thead th {
        background: #fcfaf7;
        box-shadow: inset 0 -1px 0 #eadfd4;
        color: #a58d74;
        font-size: 12px;
        font-weight: 600;
        letter-spacing: .04em;
        min-width: 0 !important;
        padding: 14px 12px;
        position: sticky;
        text-transform: uppercase;
        top: 0;
        white-space: nowrap;
        z-index: 2
    }

    .target-setup-page #tblTargetShiftPlan tbody td {
        background: #fff;
        border-bottom: 1px solid #eee8e1;
        font-size: 13px;
        min-width: 0 !important;
        overflow: hidden;
        padding: 16px 12px;
        text-overflow: ellipsis;
        vertical-align: middle
    }

.target-setup-page #tblTargetShiftPlan th.target-plan-sector,
.target-setup-page #tblTargetShiftPlan td.target-plan-sector {
    width: 100px !important;
    min-width: 100px !important;
    max-width: 100px !important
}

.target-setup-page #tblTargetShiftPlan th.target-plan-number,
.target-setup-page #tblTargetShiftPlan td.target-plan-number {
    width: 180px !important;
    min-width: 180px !important;
    max-width: 180px !important
}

    .target-setup-page #tblTargetShiftPlan thead th::before,
    .target-setup-page #tblTargetShiftPlan thead th::after {
        display: none !important
    }

.target-setup-page .shift-plan-table .dataTables_scrollHead,
.target-setup-page .shift-plan-table .dataTables_scrollBody {
    width: 100% !important
}

.target-setup-page .shift-plan-table .dataTables_scrollHeadInner,
.target-setup-page .shift-plan-table .dataTables_scrollHeadInner table {
    width: 100% !important
}

.target-setup-page .dataTables_wrapper .dataTables__top {
    padding: 14px 12px
}

.target-setup-page .target-setup-footer {
    align-items: center;
    border-top: 1px solid #eadfd4;
    display: flex;
    justify-content: space-between;
    margin-top: -2px;
    padding: 18px 0 0
}

    .target-setup-page .target-setup-footer .btn {
        min-height: 42px;
        padding-left: 24px;
        padding-right: 24px
    }

    .target-setup-page .target-setup-footer .trip-sense-primary-btn {
        box-shadow: 0 5px 12px rgba(196, 111, 43, .2);
        min-width: 254px
    }

.target-setup-page .target-clear-button {
    background: #fff;
    border: 1px solid #ead8c6;
    color: #6b5746;
    min-width: 128px
}

.target-setup-page .btn {
    font-family: inherit
}

.target-setup-page .card-actions > div:last-child {
    align-items: center;
    display: flex;
    gap: 6px
}

.target-setup-page .card-actions .btn-sm {
    border-radius: 6px;
    font-size: 11px;
    line-height: 18px;
    margin: 0;
    min-height: 28px
}

.target-setup-page .target-fix-button {
    background: #fff8e9;
    border: 1px solid #f2cf83;
    color: #b36f00;
    font-size: 12px;
    font-weight: 700;
    min-height: 32px;
    min-width: 70px
}

.target-setup-page .table_action {
    align-items: center;
    border-radius: 7px;
    display: inline-flex;
    height: 28px;
    justify-content: center;
    margin: 0 2px;
    width: 28px
}

.layout-notification {
    align-items: center;
    background: #fff;
    border: 1px solid #eadfd4;
    border-radius: 18px;
    box-shadow: 0 14px 30px rgba(37,33,29,.18);
    color: #5f5145;
    display: flex;
    font-family: "Plus Jakarta Sans","Roboto",sans-serif;
    font-size: 15px;
    font-weight: 500;
    gap: 14px;
    min-height: 66px;
    opacity: 0;
    padding: 14px 20px;
    pointer-events: none;
    position: fixed;
    right: 24px;
    top: 58px;
    transform: translateY(-10px);
    transition: opacity .25s ease, transform .25s ease, visibility .25s ease;
    visibility: hidden;
    width: min(430px, calc(100vw - 32px));
    z-index: 2200;
}

.layout-notification.visible {
    opacity: 1;
    pointer-events: auto;
    transform: translateY(0);
    visibility: visible;
}

.layout-notification-icon {
    color: #d07a32;
    flex: 0 0 auto;
    font-size: 18px;
}

.layout-notification-success .layout-notification-icon { color: #00ad79; }
.layout-notification-error .layout-notification-icon { color: #dc3545; }
.layout-notification-warning .layout-notification-icon { color: #f0a020; }

.layout-notification-message {
    flex: 1 1 auto;
    white-space: pre-line;
}

.layout-notification-close {
    background: transparent;
    border: 0;
    color: #a18c72;
    flex: 0 0 auto;
    font-size: 22px;
    line-height: 1;
    padding: 0;
}

@media(max-width:575px) {
    .layout-notification {
        left: 16px;
        right: 16px;
        top: 20px;
        width: auto;
    }
}

/* Follows the existing .quick-notice-toast pattern: fixed, opacity transition, .visible toggle */
.target-reset-toast {
    align-items: center;
    background: #fff;
    border: 1px solid #eadfd4;
    border-radius: 12px;
    box-shadow: 0 8px 24px rgba(37,33,29,.14);
    color: #25211d;
    display: flex;
    font-family: "Plus Jakarta Sans","Roboto",sans-serif;
    font-size: 13px;
    font-weight: 500;
    gap: 12px;
    opacity: 0;
    padding: 12px 16px;
    position: fixed;
    right: 24px;
    top: 92px;
    transition: opacity .25s ease;
    visibility: hidden;
    z-index: 2000
}

    .target-reset-toast.visible {
        opacity: 1;
        visibility: visible
    }

    .target-reset-toast .fa-exclamation-triangle {
        color: #f0a020;
        font-size: 16px
    }

    .target-reset-toast .close {
        color: #9c876f !important;
        font-size: 18px;
        font-weight: 400;
        line-height: 1;
        margin-left: 4px;
        opacity: 1;
        text-shadow: none
    }

.target-sequence-toast {
    align-items: center;
    background: #fff;
    border: 1px solid #eadfd4;
    border-radius: 18px;
    box-shadow: 0 14px 30px rgba(37,33,29,.18);
    color: #5f5145;
    display: flex;
    font-family: "Plus Jakarta Sans","Roboto",sans-serif;
    font-size: 16px;
    font-weight: 500;
    gap: 16px;
    min-height: 66px;
    opacity: 0;
    padding: 14px 22px;
    position: fixed;
    right: 24px;
    top: 38px;
    transform: translateY(-10px);
    transition: opacity .25s ease, transform .25s ease, visibility .25s ease;
    visibility: hidden;
    z-index: 2100;
}

    .target-sequence-toast.visible {
        opacity: 1;
        transform: translateY(0);
        visibility: visible;
    }

    .target-sequence-toast .fa-check-circle-o {
        color: #00ad79;
        font-size: 21px;
    }

    .target-sequence-toast .close {
        background: transparent;
        border: 0;
        color: #a18c72 !important;
        font-size: 22px;
        font-weight: 300;
        line-height: 1;
        margin-left: 20px;
        opacity: 1;
        padding: 0;
        text-shadow: none;
    }

@media(max-width:575px) {
    .target-sequence-toast {
        left: 16px;
        right: 16px;
        top: 20px;
    }
}

/* SweetAlert2 6.6.0 applies customClass as a plain string on the popup, and its
   inner elements are .swal2-content / .swal2-buttonswrapper - selectors cover both eras */
.target-discard-popup {
    border-radius: 20px !important;
    box-shadow: 0 18px 45px rgba(37,33,29,.22);
    box-sizing: border-box;
    min-height: 208px;
    padding: 30px 30px 29px !important;
    width: 486px !important
}

    .target-discard-popup .swal2-html-container,
    .target-discard-popup .swal2-content {
        margin: 0;
        overflow: visible;
        padding: 0;
        text-align: left
    }

.target-discard-content {
    align-items: flex-start;
    display: flex;
    gap: 15px;
    text-align: left
}

    .target-discard-content h3 {
        color: #25211d;
        font-size: 18px;
        font-weight: 700;
        line-height: 24px;
        margin: 1px 0 4px
    }

    .target-discard-content p {
        color: #9c876f;
        font-size: 15px;
        line-height: 22px;
        margin: 0;
        max-width: 330px
    }

.target-discard-icon {
    align-items: center;
    background: #fff0f3;
    border: 1px solid #ffd1da;
    border-radius: 15px;
    color: #f00046;
    display: flex;
    flex: 0 0 53px;
    height: 53px;
    justify-content: center;
    width: 53px
}

    .target-discard-icon .fa {
        align-items: center;
        border: 1.5px solid #f00046;
        border-radius: 50%;
        display: flex;
        font-size: 12px;
        height: 22px;
        justify-content: center;
        width: 22px
    }

/* Align the actions with the title/message column rather than the warning icon. */
.target-discard-popup .swal2-actions,
.target-discard-popup .swal2-buttonswrapper {
    box-sizing: border-box;
    display: flex;
    flex-direction: row;
    gap: 18px;
    justify-content: flex-start;
    margin: 18px 0 0;
    padding-left: 68px;
    padding-right: 0;
    width: 100%
}

.target-discard-popup .btn {
    border: 0;
    border-radius: 12px;
    font-size: 14px;
    font-weight: 600;
    height: 41px;
    margin: 0;
    padding: 0 21px
}

/* Outranks the global "body .swal2-confirm/.swal2-cancel" !important brown theming */
.target-discard-popup .target-discard-cancel,
.target-discard-popup .target-discard-cancel:hover,
.target-discard-popup .target-discard-cancel:focus {
    background: #f1eeea !important;
    background-color: #f1eeea !important;
    border: 0 !important;
    border-radius: 12px !important;
    color: #5f554b !important;
    min-width: 91px
}

.target-discard-popup .target-discard-confirm,
.target-discard-popup .target-discard-confirm:hover,
.target-discard-popup .target-discard-confirm:focus {
    background: #ed0045 !important;
    background-color: #ed0045 !important;
    border: 0 !important;
    border-radius: 12px !important;
    color: #fff !important;
    min-width: 126px
}

body.swal2-shown .swal2-container {
    backdrop-filter: blur(4px);
    background-color: rgba(42, 39, 36, .55) !important;
}

@media(max-width:560px) {
    .target-discard-popup {
        min-height: 0;
        padding: 24px 20px !important;
        width: calc(100% - 32px) !important;
    }

    .target-discard-popup .swal2-actions,
    .target-discard-popup .swal2-buttonswrapper {
        padding-left: 0
    }
}

@media(max-width:991px) {
    .target-setup-page .prerequisite-grid, .target-setup-page .material-grid {
        grid-template-columns: 1fr
    }

    .target-setup-page .workflow-badge {
        margin-left: 0;
        width: auto
    }

    .target-setup-page .target-detail-header {
        align-items: stretch;
        flex-wrap: wrap
    }

    .target-setup-page .target-detail-search {
        flex: 1;
        min-width: 220px
    }
}

@media(max-width:575px) {
    .target-setup-page .target-page-header, .target-setup-page .section-heading {
        align-items: stretch;
        flex-direction: column
    }

    .target-setup-page .target-section {
        padding: 20px 16px
    }

    .target-setup-page .header-filter {
        width: 100%
    }

        .target-setup-page .header-filter .form-control,
        .target-setup-page .header-filter .select2-container,
        .target-setup-page .header-filter .select2-selection {
            min-width: 0;
            width: 100% !important
        }

    .target-setup-page .workflow-badge {
        justify-content: center;
        overflow-x: auto;
        width: 100%
    }

    .target-setup-page .card-actions {
        align-items: stretch;
        flex-direction: column
    }

        .target-setup-page .card-actions > div:last-child {
            justify-content: flex-end
        }

    .target-setup-page .target-detail-title, .target-setup-page .target-detail-search {
        min-width: 100%;
        width: 100%
    }

    .target-setup-page .target-detail-header > .button-common {
        margin-left: 0
    }

    .target-setup-page .target-validation-summary {
        align-items: flex-start;
        flex-direction: column;
        gap: 10px
    }

    .target-setup-page .target-setup-footer {
        align-items: stretch;
        flex-direction: column;
        gap: 10px
    }

        .target-setup-page .target-setup-footer .btn {
            width: 100%
        }
}
/* Target Setup - add shift plan modal */
body.target-plan-modal-open {
    overflow: hidden;
}

.target-plan-modal {
    align-items: center;
    display: none;
    inset: 0;
    justify-content: center;
    padding: 24px;
    position: fixed;
    z-index: 1060;
}

    .target-plan-modal.is-open {
        display: flex;
    }

.target-plan-modal-backdrop {
    background: rgba(31, 29, 27, .58);
    backdrop-filter: blur(3px);
    inset: 0;
    position: absolute;
}

.target-plan-dialog {
    background: #fff;
    border: 1px solid #eadfd4;
    border-radius: 21px;
    box-shadow: 0 26px 65px rgba(32, 28, 24, .28);
    color: #3f3934;
    max-height: calc(100vh - 48px);
    max-width: 588px;
    overflow: auto;
    position: relative;
    width: 100%;
}

.target-plan-modal-header {
    align-items: center;
    border-bottom: 1px solid #eadfd4;
    display: flex;
    justify-content: space-between;
    min-height: 75px;
    padding: 20px 31px;
}

    .target-plan-modal-header h3 {
        color: #27231f;
        font-size: 20px;
        font-weight: 700;
        margin: 0;
    }

.target-plan-modal-close {
    background: transparent;
    border: 0;
    color: #a99886;
    cursor: pointer;
    font-size: 29px;
    font-weight: 300;
    line-height: 1;
    padding: 0 7px;
}

    .target-plan-modal-close:hover,
    .target-plan-modal-close:focus {
        color: #c87a35;
        outline: none;
    }

.target-plan-modal-body {
    padding: 31px 31px 29px;
}

.target-plan-form-grid {
    display: grid;
    gap: 21px 21px;
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.target-plan-field-wide {
    grid-column: 1 / -1;
}

.target-plan-field label,
.target-plan-priority legend {
    color: #8f806f;
    display: block;
    font-size: 15px;
    font-weight: 600;
    line-height: 20px;
    margin: 0 0 6px;
}

.target-plan-field .form-control {
    background: #fff;
    border: 1px solid #e6d5c5;
    border-radius: 16px;
    box-shadow: none;
    color: #4b453f;
    font-size: 16px;
    height: 45px;
    padding: 10px 16px;
}

.target-plan-field select.form-control {
    appearance: auto;
}

.target-plan-field .form-control:focus {
    border-color: #c87a35;
    box-shadow: 0 0 0 3px rgba(200, 122, 53, .12);
}

.target-plan-field .form-control:disabled {
    background: #f8f5f1;
    color: #a99c8f;
}

.target-plan-priority {
    border: 0;
    margin: 0;
    min-width: 0;
    padding: 0;
}

.target-plan-priority-options {
    display: grid;
    gap: 10px;
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

    .target-plan-priority-options label {
        cursor: pointer;
        margin: 0;
    }

    .target-plan-priority-options input {
        opacity: 0;
        position: absolute;
        pointer-events: none;
    }

    .target-plan-priority-options span {
        align-items: center;
        border: 1px solid #e6d5c5;
        border-radius: 11px;
        color: #907f6c;
        display: flex;
        font-size: 16px;
        font-weight: 600;
        height: 40px;
        justify-content: center;
        transition: background-color .15s ease, border-color .15s ease, color .15s ease;
    }

    .target-plan-priority-options input:checked + span {
        background: #c97d3b;
        border-color: #c97d3b;
        color: #fff;
    }

    .target-plan-priority-options input:focus + span {
        box-shadow: 0 0 0 3px rgba(200, 122, 53, .18);
    }

.target-plan-form-error {
    color: #d33344;
    font-size: 12px;
    min-height: 18px;
    padding-top: 9px;
}

.target-plan-modal-footer {
    align-items: center;
    border-top: 1px solid #eadfd4;
    display: flex;
    gap: 17px;
    justify-content: flex-end;
    min-height: 80px;
    padding: 17px 21px;
}

    .target-plan-modal-footer .btn {
        border-radius: 11px;
        font-size: 15px;
        font-weight: 600;
        min-height: 38px;
        padding: 8px 21px;
        text-transform: none;
    }

.target-plan-abort {
    background: transparent;
    border: 0;
    color: #92816f;
}

.target-plan-submit {
    background: #c97d3b;
    border: 1px solid #c97d3b;
    color: #fff;
}

    .target-plan-submit:hover,
    .target-plan-submit:focus {
        background: #b96e30;
        border-color: #b96e30;
        color: #fff;
    }

.target-setup-page .target-draft-remove {
    background: transparent;
    border: 0;
    color: #b66c31;
}

@media (max-width: 640px) {
    .target-plan-modal {
        align-items: flex-end;
        padding: 12px;
    }

    .target-plan-dialog {
        border-radius: 18px;
        max-height: calc(100vh - 24px);
    }

    .target-plan-modal-header,
    .target-plan-modal-body {
        padding-left: 20px;
        padding-right: 20px;
    }

    .target-plan-form-grid {
        grid-template-columns: 1fr;
    }

    .target-plan-field-wide {
        grid-column: auto;
    }
}

/* Digger Allocation */
.digger-allocation-page{padding-bottom:32px}.digger-card{background:#fff;border:1px solid #ead8c5;border-radius:18px;box-shadow:none;overflow:hidden;margin:26px 0 0}.digger-mode-bar{height:80px;display:flex;align-items:center;justify-content:space-between;padding:0 20px;border-bottom:1px solid #eee5dc}.digger-mode-tabs{display:inline-flex;border:1px solid #ead4bd;background:#fbf9f6;border-radius:14px;padding:4px}.digger-mode-tabs button,.digger-material-tabs button{border:0;background:transparent;color:#8a7057;font-weight:700;padding:9px 16px;border-radius:11px;cursor:pointer}.digger-mode-tabs button.active,.digger-material-tabs button.active{background:#fff;color:#c87131;border:1px solid #edc9a5;box-shadow:0 2px 5px rgba(76,45,18,.13)}.digger-collapse-button{border:0;background:transparent;color:#a58c74;font-size:18px}.digger-upload-content{display:grid;grid-template-columns:minmax(0,7fr) minmax(340px,5fr);gap:28px;padding:27px}.digger-upload-column h3{margin:0 0 5px;color:#24170d;font-size:16px;font-weight:800}.digger-upload-column>p,.digger-validation-column>div>p{color:#967b62;margin-bottom:18px}.digger-drop-zone{min-height:165px;border:2px dashed #ead4bd;border-radius:18px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:7px;text-align:center;padding:22px;cursor:pointer;transition:.2s}.digger-drop-zone.dragging{border-color:#c97836;background:#fff9f3}#diggerFile{display:none!important}.digger-upload-icon{width:55px;height:55px;border-radius:50%;display:grid;place-items:center;background:#fcf8f4;color:#d58a50;font-size:24px}.digger-upload-icon .fa{font-size:24px;font-weight:400}.digger-drop-zone strong{color:#38281a}.digger-drop-zone small{color:#ac947d}.digger-file-actions{display:flex;flex-wrap:wrap;gap:12px;margin-top:17px}.digger-outline-button,.digger-success-button,.digger-error-button,.digger-primary-button{border-radius:12px;padding:9px 17px;font-weight:700}.digger-outline-button{background:#fff;border:1px solid #e6d0ba;color:#6f543b}.digger-success-button{background:#f4fff8;border:1px solid #a9ecc3;color:#04943d}.digger-success-button:disabled{opacity:.45}.digger-error-button{background:#fff1f2;border:1px solid #ffd5da;color:#d42343}.digger-primary-button{background:#ca7a37;border-color:#ca7a37;color:#fff!important}.digger-record-summary{display:flex;gap:12px;margin-top:15px}.digger-record-summary span{padding:8px 13px;border-radius:10px;font-weight:700}.digger-record-summary .inserted{background:#effcf4;color:#16864a}.digger-record-summary .errors{background:#fff0f2;color:#cf2945}.digger-validation-column{border-left:1px solid #eee3d8;padding-left:28px;display:flex;flex-direction:column}.digger-validation-column h4{font-size:13px;color:#a18b74;font-weight:900;letter-spacing:.025em}.digger-validation-column ul{list-style:none;padding:0;display:grid;gap:16px;margin:18px 0}.digger-validation-column li{display:flex;gap:13px}.digger-validation-column li>i{width:22px;height:22px;border-radius:50%;display:grid;place-items:center;background:#edfff4;color:#18a95d}.digger-validation-column li span{display:flex;flex-direction:column;color:#483423}.digger-validation-column li small{color:#9e8873;margin-top:2px}.digger-file-status{margin-top:auto;border:1px solid #eee5dc;background:#fbfaf8;border-radius:14px;padding:16px;display:flex;justify-content:space-between}.digger-file-status span{display:flex;flex-direction:column}.digger-file-status span:last-child{text-align:right}.digger-file-status small{font-weight:800;color:#a18c76}.digger-file-status strong{font-size:19px;color:#2d1e12}.validation-title{display:flex;justify-content:space-between}.validation-title button{border:0;background:none;font-size:20px;color:#b37d85}.digger-validation-issues{background:#fff5f6;border:1px solid #ffdbe0;border-radius:13px;padding:14px;margin-bottom:16px;max-height:250px;overflow:auto}.digger-validation-item{background:#fff;border-left:3px solid #e6405b;padding:10px;margin-top:8px;border-radius:6px}.digger-validation-item strong{display:block;color:#92233a}.digger-validation-item small{color:#81646a}.digger-list-card{padding:27px}.digger-list-toolbar{display:flex;align-items:center;gap:14px;padding-bottom:23px;border-bottom:1px solid #eee5dc}.digger-material-tabs{display:inline-flex;border:1px solid #e7d3be;border-radius:14px;padding:4px}.digger-active-label{margin-left:auto;color:#8c7259}.digger-list-card #diggerTableWrap{margin-top:22px;border:1px solid #ead8c5;border-radius:14px}.digger-list-card table{margin:0}.digger-list-card thead th{background:#fcfaf7;color:#9e856d;text-transform:uppercase;font-size:12px;letter-spacing:.025em;padding:14px 16px;border-bottom:1px solid #e6d3c0;white-space:nowrap}.digger-list-card tbody td{padding:17px 16px;color:#6c543e;vertical-align:middle;border-top:1px solid #f0e7df}.equipment-cell strong,.location-cell strong{display:block;color:#28190d}.equipment-cell small,.location-cell small{color:#a18a75}.location-cell strong{color:#bf6e31}.status-badge-digger{padding:4px 9px;border-radius:5px;font-size:11px;font-weight:700}.status-badge-digger.deployed{background:#e9f8ee;border:1px solid #c7e9d2;color:#12743a}.status-badge-digger.available{background:#fffaf2;border:1px solid #eadcc9;color:#866b4c}.edit-digger{color:#c67231;font-weight:700}.digger-message{text-align:center;padding:42px;color:#9a826a}.digger-footer{display:flex;justify-content:space-between;margin-top:28px}.digger-page-header .workflow-dot.active{background:#c87938;color:#fff}.digger-page-header .workflow-badge strong{color:#c87938}
    @media(max-width:991px){.digger-upload-content{grid-template-columns:1fr}.digger-validation-column{border-left:0;border-top:1px solid #eee3d8;padding:24px 0 0}.digger-list-toolbar{flex-wrap:wrap}.digger-active-label{width:100%;margin-left:0}.digger-page-header .workflow-badge{display:none}}

.digger-modal{position:fixed;inset:0;z-index:1060;display:flex;align-items:center;justify-content:center;padding:24px}.digger-modal.d-none{display:none!important}.digger-modal-backdrop{position:absolute;inset:0;background:rgba(22,18,14,.58)}.digger-modal-dialog{position:relative;width:min(620px,100%);max-height:calc(100vh - 48px);display:flex;flex-direction:column;background:#fff;border-radius:18px;box-shadow:0 24px 70px rgba(0,0,0,.3);overflow:hidden}.digger-modal-header,.digger-modal-footer{padding:18px 26px;border-color:#ead8c5;display:flex;align-items:center}.digger-modal-header{justify-content:space-between;border-bottom:1px solid #ead8c5}.digger-modal-header h3{margin:0 0 3px;font-size:18px}.digger-modal-header small,.digger-modal-section h4{color:#c97836;font-weight:800;letter-spacing:.04em}.digger-modal-close{border:0;background:transparent;color:#9b846f;font-size:24px}.digger-modal-body{padding:24px 26px;overflow:auto}.digger-modal-section{border:1px solid #ead8c5;border-radius:15px;padding:18px;margin-bottom:18px}.digger-modal-section h4{font-size:11px;margin:0 0 15px}.digger-modal-grid{display:grid;grid-template-columns:1fr 1fr;gap:15px}.digger-modal-grid label{display:flex;flex-direction:column;gap:6px;color:#8f7b67;font-size:11px;font-weight:800;text-transform:uppercase}.digger-modal-grid label.wide{grid-column:1/-1}.digger-modal-grid input,.digger-modal-grid select,.digger-modal-grid .select2-container .select2-selection--single{width:100%;min-height:40px;border:1px solid #e7d2bd;border-radius:12px;background:#fff;color:#463628}.digger-modal-grid input{padding:8px 12px}.digger-modal-footer{justify-content:flex-end;gap:10px;border-top:1px solid #ead8c5;background:#fff}.digger-modal-footer .btn{min-width:125px}@media(max-width:600px){.digger-modal-grid{grid-template-columns:1fr}.digger-modal-grid label.wide{grid-column:auto}}

.upload-errors-modal .digger-modal-backdrop{background:rgba(26,22,18,.48);backdrop-filter:blur(4px)}.upload-errors-dialog{width:min(1296px,calc(100vw - 64px))!important;max-height:min(650px,calc(100vh - 80px));overflow:hidden}.upload-errors-header{justify-content:flex-start;flex:0 0 auto;min-height:94px}.upload-errors-icon{width:46px;height:46px;display:grid;place-items:center;flex:0 0 46px;border-radius:50%;background:#fff0f2;color:#ff3159;font-size:19px}.upload-errors-heading{margin-left:14px}.upload-errors-heading h3{color:#382b21}.upload-errors-heading small{color:#9d8874;font-size:13px;font-weight:500;letter-spacing:0}.upload-errors-header .upload-errors-close{margin-left:auto}.upload-errors-body{flex:0 1 auto;max-height:420px;padding:0 20px;overflow:auto}.upload-errors-table{margin:18px 0 0;min-width:1050px}.upload-errors-table thead th{position:sticky;top:0;z-index:3;padding:14px 16px;background:#fcfaf8;border-bottom:1px solid #ead8c5;box-shadow:0 1px 0 #ead8c5;color:#9c8772;font-size:12px;text-transform:uppercase;white-space:nowrap}.upload-errors-table tbody td{padding:18px 16px;border-top:1px solid #f0e7df;color:#6c5948;vertical-align:middle}.upload-errors-table .error-equipment{color:#382b21;font-weight:700;white-space:nowrap}.upload-errors-table .error-baseline{color:#382b21;font-weight:800;white-space:nowrap}.upload-errors-table .error-description{min-width:440px;color:#ef1748;font-weight:600}.upload-errors-table .error-description i{margin-right:8px}.upload-errors-table .error-assignment{display:inline-block;padding:4px 9px;border:1px solid #e3d5c7;border-radius:5px;background:#fffaf4;font-size:11px}.upload-errors-table .error-assignment.deployed{border-color:#c7e9d2;background:#e9f8ee;color:#12743a}.upload-errors-dialog>footer.digger-modal-footer{position:static!important;left:auto!important;right:auto!important;bottom:auto!important;z-index:auto;width:auto;flex:0 0 74px}

#fileStatus{display:flex;align-items:center;gap:9px}#fileStatusLoader{color:#c97836;font-size:15px}

/* Digger workflow footer */
.digger-allocation-page .digger-footer {
    align-items: center;
    border-top: 1px solid #eadfd4;
    display: flex;
    justify-content: space-between;
    margin-top: 28px;
    padding-top: 18px;
}

.digger-allocation-page .digger-footer .btn {
    align-items: center;
    display: inline-flex;
    gap: 10px;
    height: 42px;
    justify-content: center;
}

.digger-allocation-page .digger-footer-back {
    min-width: 210px;
}

.digger-allocation-page .digger-footer-submit {
    box-shadow: 0 5px 12px rgba(196, 111, 43, .22);
    min-width: 325px;
}

@media(max-width: 991px) {
    .digger-allocation-page .digger-footer {
        align-items: stretch;
        flex-direction: column;
        gap: 10px;
    }

    .digger-allocation-page .digger-footer .btn {
        width: 100%;
    }
}

/* Shift-plan workflow indicator */
.target-page-header .workflow-badge {
    align-items: center;
    background: #fffdfb;
    border: 1px solid #ead8c6;
    border-radius: 18px;
    display: inline-flex;
    gap: 9px;
    min-height: 32px;
    padding: 5px 13px;
    white-space: nowrap;
}

.target-page-header .workflow-badge > span:first-child {
    color: #a68d74;
    font-size: 9px;
    font-weight: 800;
    letter-spacing: .04em;
}

.target-page-header .workflow-step {
    align-items: center;
    background: transparent;
    border: 0;
    color: #9c876f;
    cursor: pointer;
    display: inline-flex;
    font: inherit;
    gap: 4px;
    margin: 0;
    padding: 0;
}

.target-page-header .workflow-step:hover,
.target-page-header .workflow-step:focus-visible {
    color: #c87938;
    outline: none;
}

.target-page-header .workflow-badge > span:not(:first-child) {
    color: #d9c7b5;
}

.target-page-header .workflow-badge strong {
    align-items: center;
    display: inline-flex;
    gap: 4px;
}

.digger-selected-file {
    align-items: center;
    background: #fbfaf8;
    border: 1px solid #eee5dc;
    border-radius: 13px;
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto auto;
    gap: 20px;
    margin-top: 10px;
    min-width: min(505px, 100%);
    padding: 12px 18px;
    text-align: left;
}

#diggerSelectedFileName {
    color: #604b38;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

#diggerSelectedFileSize {
    color: #a18a75;
}

#diggerSelectedFileResult {
    color: #00a948;
    font-size: 12px;
    white-space: nowrap;
}

#diggerSelectedFileResult i {
    font-size: 8px;
}

#diggerSelectedFileResult.error {
    color: #e8274f;
}

.digger-list-card {
    padding: 27px;
}

.digger-list-card #diggerTableWrap {
    overflow: hidden;
}

.digger-list-card tbody tr:first-child td {
    border-top: 0;
}

.digger-list-card .equipment-cell small,
.digger-list-card .location-cell small {
    display: block;
    margin-top: 3px;
    font-size: 10px;
}

.digger-baseline {
    color: #2b1c10 !important;
    font-weight: 800;
}

@media (max-width: 640px) {
    .digger-selected-file {
        grid-template-columns: 1fr auto;
        min-width: 100%;
    }

    #diggerSelectedFileResult {
        grid-column: 1 / -1;
    }
}

.target-setup-page .target-redo-button {
    background: #fbf8f4;
    border: 1px solid #ead8c5;
    border-radius: 13px;
    color: #5f4936;
    font-size: 13px;
    font-weight: 700;
    min-height: 40px;
    padding: 9px 17px;
    white-space: nowrap;
}

.target-setup-page .target-redo-button i {
    margin-right: 7px;
}

.upload-errors-dialog > footer.digger-modal-footer {
    background: #fbfaf8;
    padding: 16px 20px;
}

.upload-errors-dialog > footer.digger-modal-footer .btn {
    min-width: 84px;
    padding: 8px 18px;
}

.upload-errors-modal {
    z-index: 99999;
}

.upload-errors-modal .digger-modal-backdrop {
    -webkit-backdrop-filter: blur(4px);
    backdrop-filter: blur(4px);
}

#diggerModal {
    z-index: 99999;
}

body:has(#diggerModal:not(.d-none)) button#leftdrawer {
    opacity: 0 !important;
    pointer-events: none !important;
    visibility: hidden !important;
}

#diggerModal .digger-modal-backdrop {
    -webkit-backdrop-filter: blur(4px);
    backdrop-filter: blur(4px);
}

.digger-modal-dialog > footer.digger-modal-footer {
    bottom: auto !important;
    left: auto !important;
    position: static !important;
    right: auto !important;
    width: auto !important;
    z-index: auto !important;
}

#diggerModal .digger-modal-header,
#diggerModal .digger-modal-footer {
    flex: 0 0 auto;
}

#diggerModal .digger-modal-body {
    flex: 0 1 auto;
    min-height: 0;
    overflow-y: auto;
}

/* Keep the manual Add Excavator form compact without changing the upload-errors modal. */
#diggerModal {
    padding: 24px;
}

#diggerModal .digger-modal-dialog {
    width: min(640px, 100%);
    height: auto;
    max-height: calc(100vh - 48px);
    border: 1px solid #ead8c5;
    border-radius: 17px;
    background: #fffdfa;
}

#diggerModal .digger-modal-header {
    min-height: 82px;
    gap: 16px;
    padding: 18px 24px;
    background: #fff;
}

#diggerModal .digger-modal-header h3 {
    margin: 0 0 4px;
    color: #17120f;
    font-size: 18px;
    font-weight: 700;
    line-height: 24px;
}

#diggerModal .digger-modal-header small {
    color: #a58b73;
    display: block;
    font-size: 10px;
    line-height: 16px;
}

#diggerModal .digger-modal-header .digger-modal-close {
    align-items: center;
    border: 1px solid #eadfd4;
    border-radius: 9px;
    color: #a89480;
    display: inline-flex;
    flex: 0 0 32px;
    font-size: 22px;
    height: 32px;
    justify-content: center;
    line-height: 1;
    padding: 0;
}

#diggerModal .digger-modal-body {
    padding: 24px;
    background: #fff;
    scrollbar-color: #d7c5b1 transparent;
    scrollbar-width: thin;
}

#diggerModal .digger-modal-body::-webkit-scrollbar {
    width: 6px;
}

#diggerModal .digger-modal-body::-webkit-scrollbar-track {
    background: transparent;
}

#diggerModal .digger-modal-body::-webkit-scrollbar-thumb {
    border-radius: 6px;
    background: #d7c5b1;
}

#diggerModal .digger-modal-section {
    margin-bottom: 18px;
    padding: 18px;
    border-color: #ead8c5;
    border-radius: 13px;
    background: #fffdfa;
}

#diggerModal .digger-modal-section:last-child {
    margin-bottom: 0;
}

#diggerModal .digger-modal-section h4 {
    margin: 0 0 16px;
    font-size: 10px;
    line-height: 16px;
}

#diggerModal .digger-modal-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    column-gap: 18px;
    row-gap: 16px;
}

#diggerModal .digger-modal-grid label {
    gap: 6px;
    color: #8f806f !important;
    font-size: 12px !important;
    font-weight: 600;
    line-height: 18px;
    margin: 0;
    min-width: 0;
    text-transform: none;
}

#diggerModal .digger-modal-grid input,
#diggerModal .digger-modal-grid select,
#diggerModal .digger-modal-grid .select2-container .select2-selection--single {
    min-height: 40px;
    height: 40px;
    border-color: #ead8c5;
    border-radius: 10px;
    color: #463628;
    font-size: 13px;
    text-transform: none;
}

#diggerModal .digger-modal-grid input {
    padding: 7px 12px;
}

#diggerModal .digger-modal-grid select,
#diggerModal .digger-modal-grid select option {
    font-size: 13px !important;
}

#diggerModal .digger-modal-grid .select2-container {
    min-width: 0 !important;
    width: 100% !important;
}

#diggerModal .select2-container .select2-selection--single .select2-selection__rendered {
    padding-left: 12px;
    padding-right: 28px;
    font-size: 13px !important;
    line-height: 38px;
    text-transform: none;
}

#diggerModal .select2-container .select2-selection--single .select2-selection__arrow {
    height: 38px;
    right: 8px;
    top: 0;
}

#diggerModal .digger-modal-footer {
    min-height: 74px;
    gap: 12px;
    padding: 16px 24px;
    background: #fff;
}

#diggerModal .digger-modal-footer .btn {
    align-items: center;
    display: inline-flex;
    justify-content: center;
    min-width: 104px;
    min-height: 40px;
    padding: 10px 18px;
    border-radius: 12px;
    font-size: 13px;
    line-height: 18px;
    text-transform: none;
}

#diggerModal .digger-modal-footer .digger-outline-button {
    background: #f5f1ed !important;
    border: 1px solid #eadfd4;
    color: #6b5746 !important;
}

#diggerModal .select2-dropdown .select2-search__field,
#diggerModal .select2-dropdown .select2-results__option {
    font-size: 13px;
}

#diggerModal .digger-modal-footer #saveDigger {
    background: #bf7739 !important;
    border-color: #bf7739;
    color: #fff !important;
    min-width: 158px;
}

#diggerModal .digger-modal-footer #saveDigger:hover {
    background: #ac682f !important;
}

#diggerModal .btn:focus-visible,
#diggerModal .digger-modal-close:focus-visible {
    outline: 2px solid #bf7739;
    outline-offset: 3px;
}

@media (max-width: 600px) {
    #diggerModal { padding: 16px; }
    #diggerModal .digger-modal-dialog { max-height: calc(100vh - 32px); }
    #diggerModal .digger-modal-body { padding: 16px; }
    #diggerModal .digger-modal-grid { grid-template-columns: 1fr; }
    #diggerModal .digger-modal-grid label.wide { grid-column: auto; }
}

@media (max-height: 650px) {
    #diggerModal .digger-modal-header,
    #diggerModal .digger-modal-footer {
        min-height: 64px;
    }

    #diggerModal .digger-modal-body {
        padding-top: 18px;
        padding-bottom: 18px;
    }
}

.digger-file-actions .digger-record-summary {
    align-items: center;
    margin-top: 0;
}

.digger-list-card #diggerTable_wrapper,
.digger-list-card .dataTables_scroll,
.digger-list-card .dataTables_scrollHead,
.digger-list-card .dataTables_scrollBody {
    width: 100% !important;
}

.digger-list-card .dataTables_scrollBody {
    border: 0 !important;
}

.digger-list-card .dataTables_scrollHeadInner,
.digger-list-card .dataTables_scrollHeadInner table,
.digger-list-card .dataTables_scrollBody table {
    width: 100% !important;
}

.digger-list-card .dataTables_empty {
    color: #9a826a !important;
    height: 280px !important;
    padding: 16px !important;
    text-align: center !important;
    vertical-align: middle !important;
}

.digger-list-card #diggerTableWrap {
    min-height: 350px;
    position: relative;
}

.digger-list-card .dataTables_scrollBody {
    height: 300px !important;
    max-height: 300px !important;
}

.digger-table-loading {
    align-items: center;
    background: rgba(255, 255, 255, .86);
    display: flex;
    inset: 44px 0 0;
    justify-content: center;
    position: absolute;
    z-index: 10;
}

.digger-table-loading.d-none {
    display: none !important;
}

.digger-table-loading span {
    color: #9a826a;
    font-weight: 500;
}

/* Compact upload card to match the Digger Allocation design. */
.digger-upload-card .digger-mode-bar {
    height: 64px;
}

.digger-upload-card .digger-upload-content {
    padding-bottom: 20px;
    padding-top: 20px;
}

.digger-upload-card .digger-drop-zone.has-file {
    min-height: 156px;
    padding-bottom: 12px;
    padding-top: 12px;
}

.digger-upload-card .digger-drop-zone.has-file .digger-upload-icon {
    font-size: 19px;
    height: 42px;
    width: 42px;
}

.digger-upload-card .digger-drop-zone.has-file .digger-upload-icon .fa {
    font-size: 19px;
}

.digger-upload-card .digger-selected-file {
    min-height: 42px;
    padding-bottom: 9px;
    padding-top: 9px;
}

.digger-upload-card .digger-file-actions {
    margin-top: 12px;
}

.digger-upload-card .digger-validation-column > div > p {
    font-size: 12px;
    line-height: 1.35;
    margin-bottom: 10px;
}

.digger-upload-card .digger-validation-column ul {
    gap: 9px;
    margin-bottom: 10px;
    margin-top: 10px;
}

.digger-upload-card .digger-validation-column li {
    gap: 10px;
}

.digger-upload-card .digger-validation-column li > i {
    height: 20px;
    width: 20px;
}

.digger-upload-card .digger-validation-column li strong {
    font-size: 12px;
    line-height: 1.25;
}

.digger-upload-card .digger-validation-column li small {
    font-size: 10px;
    line-height: 1.35;
}

.digger-upload-card .digger-file-status {
    padding: 12px 15px;
}

/* Digger Allocation - match the compact Target Setup / AI Studio layout. */
#diggerAllocationPage {
    padding: 28px 36px 32px;
}

#diggerAllocationPage #diggerAllocationMain > .digger-card {
    background: #fff;
    border: 1px solid #eadfd4;
    border-radius: 18px !important;
    box-shadow: 0 1px 2px rgba(74, 56, 40, .14);
    margin: 0 0 28px;
    overflow: hidden !important;
}

#diggerAllocationPage .digger-upload-card {
    padding: 0;
}

#diggerAllocationPage .digger-mode-bar {
    min-height: 72px;
    padding: 12px 28px;
}

#diggerAllocationPage .digger-mode-tabs,
#diggerAllocationPage .digger-material-tabs {
    align-items: center;
    background: #fcfaf7;
    border: 1px solid #ead8c6;
    border-radius: 14px;
    display: inline-flex;
    gap: 2px;
    max-width: 100%;
    padding: 4px;
}

#diggerAllocationPage .digger-mode-tabs button,
#diggerAllocationPage .digger-material-tabs button {
    align-items: center;
    border: 1px solid transparent;
    display: inline-flex;
    font-size: 13px;
    font-weight: 600;
    gap: 8px;
    justify-content: center;
    line-height: 18px;
    min-height: 34px;
    padding: 7px 14px;
    white-space: nowrap;
}

#diggerAllocationPage .digger-mode-tabs button.active,
#diggerAllocationPage .digger-material-tabs button.active {
    border-color: #edc9a5;
}

#diggerAllocationPage .digger-collapse-button {
    align-items: center;
    background: #fcfaf7;
    border: 1px solid #eadfd4;
    border-radius: 12px;
    display: inline-flex;
    flex: 0 0 36px;
    height: 36px;
    justify-content: center;
    padding: 0;
}

#diggerAllocationPage .digger-upload-content {
    gap: 28px;
    padding: 28px;
}

#diggerAllocationPage .digger-upload-column {
    display: flex;
    flex-direction: column;
    min-width: 0;
}

#diggerAllocationPage .digger-upload-column h3 {
    color: #07142d;
    font-size: 15px;
    font-weight: 700;
    line-height: 20px;
    margin: 0 0 4px;
}

#diggerAllocationPage .digger-upload-column > p {
    color: #a89985;
    font-size: 13px;
    line-height: 20px;
    margin: 0 0 22px;
}

#diggerAllocationPage .digger-drop-zone {
    border-color: #ead8c6;
    border-radius: 16px;
    flex: 1 0 auto;
    gap: 8px;
    min-height: 190px;
    padding: 24px;
}

#diggerAllocationPage .digger-drop-zone strong {
    font-size: 13px;
    line-height: 20px;
}

#diggerAllocationPage .digger-drop-zone small {
    font-size: 11px;
    line-height: 16px;
}

#diggerAllocationPage .digger-drop-zone.has-file {
    min-height: 190px;
}

#diggerAllocationPage .digger-selected-file {
    min-width: 0;
    width: 100%;
}

#diggerAllocationPage .digger-file-actions {
    align-items: center;
    gap: 12px;
    margin-top: 18px;
}

#diggerAllocationPage .digger-transfer-loader {
    align-items: center;
    color: #80532f;
    display: inline-flex;
    gap: 7px;
    min-width: 0;
    padding: 0 4px;
}

#diggerAllocationPage .digger-transfer-loader strong {
    font-size: 11px;
    font-weight: 700;
    line-height: 16px;
    white-space: nowrap;
}

#diggerAllocationPage .digger-transfer-spinner {
    animation: digger-transfer-spin .75s linear infinite;
    border: 2px solid #f0ddca;
    border-radius: 50%;
    border-top-color: #c77834;
    display: block;
    flex: 0 0 16px;
    height: 16px;
    width: 16px;
}

@keyframes digger-transfer-spin { to { transform: rotate(360deg); } }

#diggerAllocationPage .digger-file-actions > .btn {
    align-items: center;
    display: inline-flex;
    font-size: 13px;
    gap: 8px;
    justify-content: center;
    line-height: 18px;
    min-height: 38px;
    padding: 9px 16px;
}

#diggerAllocationPage .digger-validation-column {
    min-width: 0;
    padding-left: 28px;
}

#diggerAllocationPage .digger-validation-column h4 {
    font-size: 12px;
    line-height: 18px;
    margin: 0 0 8px;
}

#diggerAllocationPage .digger-validation-column > div > p {
    font-size: 12px;
    line-height: 18px;
    margin-bottom: 16px;
}

#diggerAllocationPage .digger-validation-column ul {
    gap: 14px;
    margin: 0 0 20px;
}

#diggerAllocationPage .digger-validation-column li > i {
    flex: 0 0 22px;
    height: 22px;
}

#diggerAllocationPage .digger-validation-column li strong {
    font-size: 13px;
    line-height: 18px;
}

#diggerAllocationPage .digger-validation-column li small {
    font-size: 10px;
    line-height: 15px;
}

#diggerAllocationPage .digger-file-status {
    align-items: center;
    gap: 16px;
    min-height: 80px;
    padding: 14px 16px;
}

#diggerAllocationPage .digger-file-status small {
    font-size: 10px;
    line-height: 16px;
}

#diggerAllocationPage #fileStatus {
    font-size: 22px;
    line-height: 28px;
}

#diggerAllocationPage #totalMachines {
    font-size: 15px;
    line-height: 22px;
}

#diggerAllocationPage .digger-list-card {
    padding: 28px;
}

#diggerAllocationPage .digger-list-toolbar {
    flex-wrap: wrap;
    gap: 12px;
    padding-bottom: 22px;
}

#diggerAllocationPage .digger-active-label {
    font-size: 13px;
    line-height: 20px;
}

#diggerAllocationPage #addExcavator {
    align-items: center;
    border-radius: 14px;
    display: inline-flex;
    font-size: 13px;
    gap: 8px;
    min-height: 32px;
    padding: 6px 18px;
}

#diggerAllocationPage #diggerTableWrap {
    margin-top: 22px;
    min-height: 0;
    overflow: hidden;
}

#diggerAllocationPage #diggerTable_wrapper {
    background: transparent;
    border: 0;
    min-height: 0;
    padding: 0;
}

/* Keep search and paging outside the grid's horizontal scroll area. */
#diggerAllocationPage #diggerTable_wrapper .dataTables__top {
    align-items: center;
    background: #fff;
    border-bottom: 1px solid #eee8e1;
    display: flex;
    float: none;
    justify-content: flex-end;
    margin: 0;
    padding: 10px 14px !important;
}

#diggerAllocationPage #diggerTable_wrapper .dataTables_filter,
#diggerAllocationPage #diggerTable_wrapper .dataTables_filter label {
    margin: 0;
}

#diggerAllocationPage #diggerTable_wrapper .dataTables_filter {
    display: block !important;
    float: none;
}

#diggerAllocationPage #diggerTable_wrapper .dataTables_filter input {
    border: 1px solid #eadfd4;
    border-radius: 9px;
    font-size: 12px;
    height: 32px;
    min-width: 0;
    padding: 6px 10px;
}

#diggerAllocationPage .digger-table-scroll {
    clear: both;
    overflow-x: auto;
    width: 100%;
}

#diggerAllocationPage #diggerTable {
    border-collapse: collapse !important;
    box-sizing: border-box;
    margin: 0 !important;
    min-width: 1450px;
    table-layout: fixed;
    width: 100% !important;
}

#diggerAllocationPage #diggerTable th,
#diggerAllocationPage #diggerTable td {
    box-sizing: border-box;
    min-width: 0 !important;
    padding: 14px;
    text-align: left;
    vertical-align: middle;
}

#diggerAllocationPage #diggerTable thead th {
    background: #fcfaf7 !important;
    color: #a89985 !important;
    font-size: 11px !important;
    font-weight: 700 !important;
    height: 46px;
    letter-spacing: .035em;
    line-height: 18px;
    padding: 12px 14px;
    text-transform: none;
    white-space: nowrap;
}

#diggerAllocationPage #diggerTable tbody td {
    background: #fff !important;
    color: #897a69 !important;
    font-size: 13px !important;
    height: 70px;
    line-height: 20px;
    overflow: hidden !important;
    overflow-wrap: anywhere;
    white-space: normal !important;
    word-break: normal;
}

#diggerAllocationPage #diggerTable .equipment-cell strong,
#diggerAllocationPage #diggerTable .location-cell strong {
    font-size: 13px;
    font-weight: 700;
    overflow: hidden;
    text-overflow: ellipsis;
}

#diggerAllocationPage #diggerTable .equipment-cell small,
#diggerAllocationPage #diggerTable .location-cell small {
    font-size: 10px;
    line-height: 15px;
    margin-top: 2px;
}

#diggerAllocationPage #diggerTable .status-badge-digger {
    display: inline-block;
    font-size: 10px;
    line-height: 16px;
    padding: 1px 9px;
}

#diggerAllocationPage #diggerTable .digger-baseline {
    color: #17120e !important;
    font-weight: 700 !important;
}

#diggerAllocationPage #diggerTable td.dataTables_empty {
    background-image: none !important;
    height: 96px !important;
    padding: 24px 16px !important;
}

#diggerAllocationPage #diggerTable_wrapper .dataTables__bottom {
    align-items: center;
    background: #fff !important;
    border-top: 1px solid #eee8e1;
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    justify-content: space-between;
    margin: 0 !important;
    padding: 12px 14px;
}

#diggerAllocationPage #diggerTable_wrapper .dataTables_info,
#diggerAllocationPage #diggerTable_wrapper .dataTables_paginate {
    color: #897a69 !important;
    float: none;
    font-size: 11px;
    margin: 0;
    padding: 0;
    position: static;
}

#diggerAllocationPage #pager_container {
    align-items: center;
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

#diggerAllocationPage .digger-footer {
    background: transparent;
    bottom: auto;
    gap: 16px;
    left: auto;
    margin-top: 0;
    padding-top: 18px;
    position: static;
    right: auto;
    width: 100%;
    z-index: auto;
}

#diggerAllocationPage .digger-footer .btn {
    border-radius: 14px;
    font-size: 13px;
    gap: 12px;
    height: auto;
    line-height: 20px;
    min-height: 42px;
    padding: 10px 22px;
}

#diggerAllocationPage #addExcavator,
#diggerAllocationPage #proceedToHauler {
    background: #bf7739 !important;
    border-color: #bf7739;
    box-shadow: 0 2px 4px rgba(107, 64, 27, .16);
    color: #fff !important;
}

#diggerAllocationPage #addExcavator:hover,
#diggerAllocationPage #proceedToHauler:hover {
    background: #ac682f !important;
}

#diggerAllocationPage .digger-footer .btn:focus-visible,
#diggerAllocationPage .digger-mode-tabs button:focus-visible,
#diggerAllocationPage .digger-material-tabs button:focus-visible,
#diggerAllocationPage .digger-drop-zone:focus-visible {
    outline: 2px solid #bf7739;
    outline-offset: 3px;
}

@media (max-width: 1100px) {
    #diggerAllocationPage .digger-upload-content {
        grid-template-columns: 1fr;
    }

    #diggerAllocationPage .digger-validation-column {
        border-left: 0;
        border-top: 1px solid #eee3d8;
        padding: 24px 0 0;
    }
}

@media (max-width: 991px) {
    #diggerAllocationPage { padding: 24px; }
    #diggerAllocationPage .digger-upload-content,
    #diggerAllocationPage .digger-list-card { padding: 20px; }
}

@media (max-width: 600px) {
    #diggerAllocationPage { padding: 16px; }
    #diggerAllocationPage .digger-mode-bar { gap: 8px; padding: 12px; height: auto; }
    #diggerAllocationPage .digger-mode-tabs,
    #diggerAllocationPage .digger-material-tabs { flex-wrap: wrap; }
    #diggerAllocationPage .digger-mode-tabs button,
    #diggerAllocationPage .digger-material-tabs button { font-size: 12px; padding: 7px 9px; }
    #diggerAllocationPage .digger-footer .btn { min-width: 0; width: 100%; }
}

.digger-page-header .digger-shift-filter {
    width: 216px;
}

.digger-page-header .digger-shift-filter .select2-container {
    flex: 1;
    min-width: 0 !important;
    width: auto !important;
}

.digger-page-header .digger-date-filter {
    width: 196px;
}

.digger-page-header .digger-date-filter input {
    min-width: 0 !important;
    width: 142px;
}

.digger-record-summary [role="button"] {
    cursor: pointer;
}

.digger-record-summary [role="button"]:focus {
    box-shadow: 0 0 0 2px rgba(201, 121, 55, .22);
    outline: 0;
}

#diggerUploadValidationSection {
    padding-top: 26px;
}

#diggerUploadValidationSection .target-validation-summary {
    flex-wrap: wrap;
    gap: 12px 20px;
}

#diggerUploadValidationSection .target-validation-table .table-responsive {
    max-height: 380px;
    overflow: auto;
    scrollbar-width: thin;
}

#diggerUploadValidationSection #tblDiggerUploadValidation {
    table-layout: fixed;
    min-width: 2720px;
    width: 100% !important;
}

#diggerUploadValidationSection #tblDiggerUploadValidation th,
#diggerUploadValidationSection #tblDiggerUploadValidation td {
    box-sizing: border-box;
    padding: 14px 18px;
    text-align: left;
    vertical-align: middle;
    white-space: normal;
    overflow-wrap: anywhere;
}

#diggerUploadValidationSection #tblDiggerUploadValidation.has-validation-errors {
    min-width: 3040px;
}

#diggerUploadValidationSection #tblDiggerUploadValidation thead th {
    position: sticky;
    top: 0;
    z-index: 1;
    background: #fcfaf7;
    box-shadow: inset 0 -1px #ead8c5;
}

#diggerUploadValidationSection #tblDiggerUploadValidation td.dataTables_empty {
    background-image: none !important;
    height: 140px !important;
    min-width: 0 !important;
    padding: 28px 20px !important;
    text-align: left !important;
    vertical-align: middle !important;
    width: auto !important;
}

#diggerUploadValidationSection .error-assignment {
    background: #fffaf4;
    border: 1px solid #e3d5c7;
    border-radius: 5px;
    color: #866b4c;
    display: inline-block;
    font-size: 11px;
    padding: 4px 9px;
}

#diggerUploadValidationSection .error-assignment.deployed {
    background: #e9f8ee;
    border-color: #c7e9d2;
    color: #12743a;
}

#diggerUploadValidationSection #tblDiggerUploadValidation td.digger-validation-error {
    color: #ef1748 !important;
    font-weight: 600;
    overflow-wrap: anywhere;
    word-break: break-word;
}

#diggerUploadValidationSection .digger-validation-error > span {
    align-items: flex-start;
    display: inline-flex;
    gap: 5px;
    max-width: 100%;
}

#diggerUploadValidationSection .digger-validation-error .fa {
    flex: 0 0 auto;
    margin-top: 2px;
}

/* Hauler allocation */
.hauler-allocation-page .hauler-filter-card {
    height: 86px;
    justify-content: flex-start;
    margin-top: 0;
}

.hauler-page-header .target-title .fa-sliders {
    color: #c87a35;
    font-size: 20px;
    font-weight: 400;
    margin-right: 10px;
}

.hauler-filter-card .digger-material-tabs {
    flex: 0 0 auto;
}

.hauler-filter-card .digger-mode-tabs {
    flex: 0 0 auto;
    margin-left: auto;
    padding: 4px;
}

.hauler-filter-card .digger-mode-tabs button {
    line-height: normal;
    min-height: 38px;
    padding: 9px 16px;
}

.hauler-filter-card .digger-mode-tabs button:hover,
.hauler-filter-card .digger-mode-tabs button:focus {
    background: transparent;
    color: #8a7057;
    outline: 0;
}

.hauler-filter-card .digger-mode-tabs button.active:hover,
.hauler-filter-card .digger-mode-tabs button.active:focus {
    background: #fff;
    color: #c87131;
}

.hauler-assignment-panel,
.hauler-sidebar {
    height: 570px;
}

.hauler-allocation-page .hauler-summary-grid {
    margin: 28px 0;
}

.hauler-allocation-page .hauler-summary-grid article {
    height: 82px;
    min-height: 82px;
}

.hauler-allocation-page > .hauler-summary-grid,
.hauler-allocation-page > .hauler-workspace {
    padding: 0;
}

.hauler-allocation-page .hauler-workspace {
    margin-top: 0;
}

.hauler-assignment-list {
    height: calc(100% - 68px);
    overflow-y: auto;
}

.hauler-assignment-panel > .hauler-panel-message {
    height: calc(100% - 68px);
    padding: 0;
    display: flex;
    align-items: center;
    justify-content: center;
}

.hauler-assignment-list > .hauler-panel-message,
.hauler-sidebar-list > .hauler-panel-message {
    width: 100%;
    height: 100%;
    padding: 0;
    display: flex;
    align-items: center;
    justify-content: center;
}

.hauler-sidebar > .hauler-panel-message {
    flex: 1 1 auto;
    padding: 0;
    display: flex;
    align-items: center;
    justify-content: center;
}

.hauler-sidebar {
    display: flex;
    flex-direction: column;
}

.hauler-sidebar-list {
    flex: 1 1 auto;
    min-height: 0;
}

.hauler-bulk-actions {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 100%;
    min-height: 46px;
    padding: 8px 10px;
    box-sizing: border-box;
    border: 1px solid #ead8c5;
    border-radius: 12px;
    background: #fffaf5;
    color: #80664e;
    font-size: 12px;
}

.hauler-bulk-actions button {
    min-height: 32px;
    padding: 7px 11px;
    border: 0;
    border-radius: 9px;
    background: #c87938;
    color: #fff;
    font-weight: 700;
    line-height: 1;
    white-space: nowrap;
}

.hauler-bulk-actions button:disabled {
    background: #ded4ca;
    cursor: not-allowed;
}

.hauler-selected-count {
    position: relative;
    display: inline-flex;
    align-items: center;
    gap: 3px;
    min-width: 0;
    cursor: pointer;
    text-decoration: underline dotted;
    text-underline-offset: 3px;
}

.hauler-selected-count::after {
    content: attr(data-tooltip);
    position: absolute;
    top: calc(100% + 9px);
    left: 0;
    z-index: 20;
    width: max-content;
    max-width: 245px;
    padding: 8px 10px;
    border: 1px solid #dfc6ae;
    border-radius: 8px;
    background: #35271b;
    color: #fff;
    box-shadow: 0 5px 14px rgba(53, 39, 27, .2);
    font-size: 11px;
    font-weight: 400;
    line-height: 1.45;
    white-space: normal;
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    transform: translateY(-3px);
    transition: opacity .15s ease, transform .15s ease, visibility .15s ease;
}

.hauler-selected-count:hover::after {
    opacity: 1;
    visibility: visible;
    transform: translateY(0);
}

.hauler-sidebar .hauler-compatibility-note {
    padding: 10px 12px;
}

.hauler-sidebar .hauler-compatibility-note span {
    margin-top: 3px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.hauler-select-row {
    width: 100%;
    min-height: 64px;
    padding: 10px 12px;
    display: grid;
    grid-template-columns: 18px 34px minmax(0, 1fr) auto;
    align-items: center;
    gap: 10px;
    box-sizing: border-box;
    border: 1px solid #ead8c5;
    border-radius: 12px;
    background: #fff;
    cursor: pointer;
    transition: border-color .15s ease, background .15s ease, box-shadow .15s ease;
}

.hauler-select-row:hover,
.hauler-select-row:has(input:checked) {
    border-color: #cf7934;
    background: #fffaf5;
    box-shadow: 0 2px 8px rgba(96, 57, 24, .08);
}

.hauler-select-row input {
    width: 16px;
    height: 16px;
    margin: 0;
    justify-self: center;
    accent-color: #c87938;
}

.hauler-select-row .truck-icon {
    width: 34px;
    height: 34px;
    display: grid;
    place-items: center;
    border-radius: 10px;
    background: #fff2e5;
    color: #c87938;
}

.hauler-select-details {
    min-width: 0;
    display: flex;
    flex-direction: column;
}

.hauler-select-details strong,
.hauler-select-details small {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.hauler-select-details strong {
    color: #2d2117;
    font-size: 13px;
}

.hauler-select-details small {
    color: #9a8068;
    font-size: 11px;
}

#haulerAllocationPage .hauler-select-details strong,
#haulerAllocationPage .hauler-select-details .hauler-select-make {
    white-space: normal;
    overflow-wrap: anywhere;
    overflow: visible;
    text-overflow: clip;
    line-height: 18px;
}

#haulerAllocationPage .hauler-select-details .hauler-select-make:empty {
    display: none;
}

#haulerAllocationPage .truck-icon.hauler-machine-icon {
    background: #ecfdf5;
    flex-shrink: 0;
}

#haulerAllocationPage .hauler-machine-icon svg {
    width: 36px;
    height: 36px;
    max-width: 100%;
    display: block;
}

.hauler-select-row em {
    align-self: center;
    padding: 3px 7px;
    border-radius: 7px;
    background: #e9fff4;
    color: #008d56;
    font-size: 10px;
    font-style: normal;
    white-space: nowrap;
}

.operator-drag-card {
    cursor: grab;
}

.operator-drag-card:active {
    cursor: grabbing;
}

.operator-drop-target {
    border-style: dashed;
    transition: border-color .15s ease, background .15s ease, box-shadow .15s ease;
}

.operator-drop-target.operator-drag-over {
    border-color: #c87938;
    background: #fff5e9;
    box-shadow: inset 0 0 0 1px #c87938;
}

.excavator-operator-drop {
    padding: 5px 7px;
    border: 1px solid transparent;
    border-radius: 7px;
    cursor: copy;
    transition: background-color .15s ease, border-color .15s ease;
}

.excavator-operator-drop .operator-empty {
    color: #b17c50;
    font-weight: 600;
}

.excavator-operator-drop b {
    display: flex !important;
    align-items: center;
    gap: 7px;
}

.excavator-operator-drop b .fa {
    flex: 0 0 auto;
    color: #9f8268;
    font-size: 11px;
}

.excavator-operator-drop .operator-mobile {
    display: flex;
    align-items: center;
    gap: 6px;
    margin-top: 3px;
    color: #9f8268;
    font-size: 9px;
    font-weight: 500;
    letter-spacing: 0;
    white-space: nowrap;
}

.excavator-operator-drop .operator-mobile .fa {
    color: #c87938;
    font-size: 9px;
}

.excavator-operator-drop:hover {
    background: #fffaf5;
    border-color: #ead8c5;
}

.excavator-operator-drop.operator-drag-over {
    background: #fff5e9;
    border-color: #cf7934;
    box-shadow: 0 0 0 3px rgba(207,121,52,.12);
}

.hauler-allocation-page .hauler-page-footer {
    position: sticky;
    bottom: 10px;
    z-index: 25;
    align-items: center;
    margin: 24px 0 0;
    padding: 16px 18px;
    border: 1px solid #eadfd5;
    border-radius: 14px;
    background: rgba(255,255,255,.97);
    box-shadow: 0 8px 24px rgba(72,49,28,.09);
    backdrop-filter: blur(8px);
}

.hauler-page-header .workflow-step {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    padding: 0;
    border: 0;
    background: transparent;
    color: inherit;
    font: inherit;
    cursor: pointer;
}

.hauler-page-header .workflow-step:hover,
.hauler-page-header .workflow-step:focus-visible {
    color: #c87938;
    outline: none;
}

.hauler-allocation-page .hauler-page-footer > div {
    align-items: center;
    gap: 12px;
}

.hauler-allocation-page .hauler-page-footer .btn {
    min-height: 42px;
    padding: 10px 18px;
    border-radius: 12px;
}

.hauler-allocation-page #submitHaulerPlan {
    min-width: 250px;
    box-shadow: 0 5px 12px rgba(202,122,55,.22);
}

.hauler-allocation-page .hauler-select-details strong {
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.hauler-allocation-page .hauler-assigned-card .hauler-card-operator {
    margin-top: 4px;
}

.hauler-allocation-page .hauler-assigned-card .hauler-card-driver {
    display: flex;
    align-items: center;
    gap: 5px;
    margin-top: 2px;
    color: #9f8268;
    font-size: 10px;
}

.hauler-allocation-page .hauler-assigned-card .hauler-card-driver .fa {
    color: #c87938;
    font-size: 9px;
}

.hauler-auto-modal .modal-dialog {
    max-width: 1120px;
}

.hauler-auto-modal .modal-content {
    overflow: hidden;
    border: 1px solid #ead8c5;
    border-radius: 16px;
}

.hauler-auto-modal .modal-header,
.hauler-auto-modal .modal-footer {
    padding: 14px 18px;
    border-color: #eee3d8;
}

.hauler-auto-modal .modal-header h5 {
    margin: 0 0 3px;
    color: #21170f;
    font-size: 17px;
    font-weight: 800;
}

.hauler-auto-modal .modal-header small,
#haulerAutoSelectionSummary {
    color: #9f8268;
    font-size: 11px;
}

.hauler-auto-modal .modal-body {
    max-height: 62vh;
    padding: 14px 18px;
    overflow-y: auto;
    background: #fcfaf7;
}

.hauler-auto-status {
    display: none;
    align-items: center;
    gap: 8px;
    padding: 10px 18px;
    border-bottom: 1px solid #eee3d8;
    background: #f3f8ff;
    color: #28649a;
    font-size: 12px;
}

.hauler-auto-status.info,
.hauler-auto-status.success,
.hauler-auto-status.warning,
.hauler-auto-status.error {
    display: flex;
}

.hauler-auto-status.success { background: #effbf4; color: #13834a; }
.hauler-auto-status.warning { background: #fff8e7; color: #946900; }
.hauler-auto-status.error { background: #fff1f2; color: #c72d42; }

.hauler-auto-empty {
    padding: 42px 20px;
    text-align: center;
    color: #9f8268;
}

.hauler-auto-balance {
    display: grid;
    grid-template-columns: 1.35fr repeat(3, 1fr);
    gap: 10px;
    margin-bottom: 14px;
}

.hauler-auto-balance > span {
    min-width: 0;
    padding: 12px 14px;
    display: flex;
    flex-direction: column;
    border: 1px solid #ead8c5;
    border-radius: 12px;
    background: #fff;
}

.hauler-auto-balance small,
.hauler-auto-suggestion-card small {
    color: #9f8268;
    font-size: 9px;
    text-transform: uppercase;
}

.hauler-auto-balance b {
    margin-top: 4px;
    overflow: hidden;
    color: #291c12;
    font-size: 12px;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.hauler-auto-suggestion-list {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
}

@media (max-width: 900px) {
    .hauler-auto-suggestion-list {
        grid-template-columns: 1fr;
    }
}

.hauler-inline-auto-suggestions {
    margin-top: 18px;
    padding-top: 16px;
    border-top: 1px dashed #ead8c5;
}

.hauler-inline-auto-heading {
    margin-bottom: 12px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}

.hauler-inline-auto-heading > div {
    display: grid;
    gap: 3px;
}

.hauler-inline-auto-heading strong {
    color: #a95d24;
    font-size: 12px;
    text-transform: uppercase;
}

.hauler-inline-auto-heading small {
    color: #9f8268;
    font-size: 11px;
}

.hauler-inline-auto-suggestions .hauler-auto-status {
    border: 1px solid #d7e7f7;
    border-radius: 10px;
}

.hauler-auto-suggestion-card {
    min-height: 68px;
    margin: 0;
    padding: 11px 14px;
    display: grid;
    grid-template-columns: 20px 38px minmax(160px, 1.2fr) minmax(180px, 1.2fr) minmax(115px, .75fr) minmax(85px, .55fr);
    align-items: center;
    gap: 10px;
    border: 1px solid #ead8c5;
    border-radius: 13px;
    background: #fff;
    cursor: pointer;
}

.hauler-auto-suggestion-card:hover {
    border-color: #cf7934;
    background: #fffdf9;
}

.hauler-auto-suggestion-card.unavailable {
    opacity: .62;
    cursor: not-allowed;
}

.hauler-auto-suggestion-card .truck-icon {
    width: 36px;
    height: 36px;
    display: grid;
    place-items: center;
    border-radius: 11px;
    background: #fff5e9;
    color: #ce762f;
}

.hauler-auto-suggestion-card > span:not(.truck-icon) {
    min-width: 0;
    display: flex;
    flex-direction: column;
}

.hauler-auto-suggestion-card strong,
.hauler-auto-suggestion-card b {
    overflow: hidden;
    color: #291c12;
    font-size: 11px;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.hauler-auto-suggestion-card .hauler-auto-driver small {
    margin-top: 3px;
    color: #b36d34;
}

.hauler-auto-group {
    overflow: hidden;
    margin-bottom: 10px;
    border: 1px solid #ead8c5;
    border-radius: 12px;
    background: #fff;
}

.hauler-auto-group > header {
    min-height: 58px;
    padding: 10px 13px;
    display: flex;
    align-items: center;
    gap: 10px;
    cursor: pointer;
}

.hauler-auto-group > header > div {
    min-width: 160px;
    display: flex;
    flex-direction: column;
}

.hauler-auto-group > header strong { font-size: 12px; }
.hauler-auto-group > header small { color: #9f8268; font-size: 10px; }
.hauler-auto-group > header p { margin: 0 0 0 auto; color: #765c43; font-size: 10px; }

.hauler-auto-status-badge {
    padding: 3px 8px;
    border-radius: 8px;
    background: #fff4dc;
    color: #8b6505;
    font-size: 9px;
    font-weight: 700;
}

.hauler-auto-group-body {
    overflow-x: auto;
    border-top: 1px solid #eee3d8;
}

.hauler-auto-group-body table {
    width: 100%;
    border-collapse: collapse;
}

.hauler-auto-group-body th,
.hauler-auto-group-body td {
    padding: 8px 10px;
    border-bottom: 1px solid #f2e9e0;
    color: #614a35;
    font-size: 10px;
    text-align: left;
    white-space: nowrap;
}

.hauler-auto-group-body th {
    background: #fcfaf7;
    color: #9f8268;
    font-size: 9px;
    text-transform: uppercase;
}

.hauler-auto-modal .modal-footer,
.hauler-auto-pagination,
.hauler-auto-footer-actions {
    display: flex;
    align-items: center;
    gap: 9px;
}

.hauler-auto-pagination {
    margin-left: auto;
}

.hauler-auto-pagination .btn {
    min-width: 34px;
    min-height: 32px;
    padding: 4px 9px;
}

@media (max-width: 760px) {
    .hauler-auto-group > header { flex-wrap: wrap; }
    .hauler-auto-group > header p { width: 100%; margin-left: 0; }
    .hauler-auto-modal .modal-footer { align-items: stretch; flex-direction: column; }
    .hauler-auto-pagination { margin-left: 0; }
    .hauler-auto-balance { grid-template-columns: 1fr 1fr; }
    .hauler-auto-suggestion-card { grid-template-columns: 20px 38px 1fr; }
    .hauler-auto-suggestion-card > span:nth-last-child(-n+3) { grid-column: 3; }
}

.hauler-allocation-page .hauler-assignment-head {
    grid-template-columns: 20px minmax(190px,1.05fr) minmax(145px,.85fr) repeat(4,minmax(90px,.72fr));
    gap: 10px;
    padding-left: 54px;
}

.hauler-allocation-page .hauler-assignment {
    position: relative;
}

.hauler-allocation-page .hauler-assignment.auto-selected {
    box-shadow: inset 3px 0 #c87938;
}

.hauler-auto-excavator-select {
    cursor: pointer;
    display: none;
    left: 20px;
    margin: 0;
    position: absolute;
    top: 27px;
    z-index: 2;
}

.hauler-allocation-page.auto-allocation-mode .hauler-auto-excavator-select {
    display: block;
}

.hauler-allocation-page:not(.auto-allocation-mode) .hauler-assignment-head {
    padding-left: 24px;
}

.hauler-allocation-mode-actions {
    align-items: center;
    display: flex;
    gap: 18px;
    margin-left: auto;
}

.hauler-allocation-page .hauler-filter-card {
    justify-content: space-between;
}

.hauler-mode-separator {
    background: #ead8c5;
    height: 34px;
    width: 1px;
}

#runHaulerAutoAllocation {
    align-items: center;
    border-radius: 11px;
    display: inline-flex;
    justify-content: center;
    min-height: 30px;
    padding: 3px 16px;
}

#runHaulerAutoAllocation:hover,
#runHaulerAutoAllocation:focus {
    background: #ca7a37;
    border-color: #ca7a37;
    color: #fff;
    opacity: 1;
    outline: 0;
    visibility: visible;
}

#runHaulerAutoAllocation .run-allocation-icon {
    fill: none;
    height: 17px;
    margin-right: 7px;
    stroke: currentColor;
    stroke-linecap: round;
    stroke-linejoin: round;
    stroke-width: 2;
    flex: 0 0 17px;
    width: 17px;
}

.hauler-auto-running {
    align-items: center;
    background: #fffdf9;
    border: 1px solid #ead8c5;
    border-radius: 9px;
    color: #9c7350;
    display: inline-flex;
    font-size: 12px;
    font-weight: 700;
    gap: 8px;
    min-height: 30px;
    padding: 3px 14px;
}

.hauler-auto-running .fa {
    animation: hauler-auto-spin 1s linear infinite;
    color: #c87938;
}

.hauler-auto-allocation-blocker {
    align-items: center;
    background: rgba(252, 250, 247, .68);
    cursor: wait;
    display: flex;
    inset: 0;
    justify-content: center;
    position: fixed;
    z-index: 1040;
}

.hauler-auto-allocation-blocker > div {
    align-items: center;
    background: #fff;
    border: 1px solid #ead8c5;
    border-radius: 14px;
    box-shadow: 0 10px 28px rgba(78, 47, 22, .15);
    color: #79583d;
    display: grid;
    gap: 5px;
    justify-items: center;
    min-width: 265px;
    padding: 20px 26px;
}

.hauler-auto-allocation-blocker .fa {
    animation: hauler-auto-spin 1s linear infinite;
    color: #c87938;
    font-size: 20px;
}

.hauler-auto-allocation-blocker strong {
    color: #4a2e1b;
    font-size: 14px;
}

.hauler-auto-allocation-blocker span {
    color: #9f8268;
    font-size: 11px;
}

.hauler-auto-suggestion-badge {
    align-items: center;
    background: #f1e8ff;
    border: 1px solid #d9befd;
    border-radius: 999px;
    color: #7b38bf;
    display: inline-flex;
    font-size: 9px;
    font-style: normal;
    font-weight: 800;
    gap: 4px;
    line-height: 1;
    margin-left: 7px;
    padding: 4px 7px;
    vertical-align: middle;
}

.hauler-auto-suggestion-badge .fa {
    color: #a35add;
}

@keyframes hauler-auto-spin {
    to { transform: rotate(360deg); }
}

.hauler-auto-completed {
    align-items: center;
    display: flex;
    gap: 14px;
}

.hauler-auto-completed > span {
    align-items: center;
    background: #ecfff6;
    border: 1px solid #9ce8c4;
    border-radius: 9px;
    color: #008a57;
    display: inline-flex;
    font-size: 12px;
    font-weight: 700;
    gap: 7px;
    min-height: 34px;
    padding: 6px 14px;
}

.hauler-auto-completed > button {
    background: transparent;
    border: 0;
    color: #a38a70;
    cursor: pointer;
    font-size: 15px;
    padding: 6px;
}

.hauler-auto-completed > button:hover {
    color: #c87938;
}

.hauler-auto-excavator-select input {
    height: 15px;
    accent-color: #c87938;
    cursor: pointer;
    margin: 0;
    width: 15px;
}

.hauler-allocation-page .productivity-priority {
    display: inline-block;
    margin-left: 7px;
    padding: 2px 6px;
    border: 1px solid;
    border-radius: 4px;
    font-size: 8px;
    font-style: normal;
    font-weight: 800;
    line-height: 1.2;
    vertical-align: 2px;
}

.hauler-allocation-page .productivity-priority.high {
    border-color: #ffc7cb;
    background: #fff0f1;
    color: #dc2635;
}

.hauler-allocation-page .productivity-priority.medium {
    border-color: #b8d2ff;
    background: #edf4ff;
    color: #236dd8;
}

.hauler-allocation-page .productivity-priority.low {
    border-color: #dfd5ca;
    background: #f6f2ee;
    color: #705c49;
}

.hauler-load-more {
    width: 100%;
    padding: 10px 14px;
    border: 1px solid #e7d6c5;
    border-radius: 11px;
    background: #fffaf5;
    color: #8b684a;
    font-size: 12px;
    font-weight: 700;
}

.hauler-load-more:hover {
    background: #fff3e7;
    color: #c87938;
}

.hauler-allocation-page{padding-bottom:30px;color:#35271b}.hauler-page-header .workflow-dot.active{background:#c87938;color:#fff}.hauler-page-header .workflow-badge strong{color:#c87938}.hauler-filter-card{margin:26px 0 0;padding:18px;display:flex;align-items:center;justify-content:space-between;border:1px solid #ead8c5;border-radius:18px;background:#fff;box-shadow:none}.hauler-summary-grid{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:18px;margin:28px 0}.hauler-summary-grid article{min-width:0;min-height:82px;padding:16px 18px;display:flex;align-items:center;gap:13px;background:#fff;border-radius:17px;box-shadow:0 4px 14px rgba(77,51,27,.07)}.hauler-summary-grid small{display:block;color:#9a8068;font-size:11px}.hauler-summary-grid strong{display:block;margin-top:4px;color:#21170f;font-size:16px;white-space:nowrap}.hauler-summary-grid #summaryVariance{color:#e2223c}.hauler-summary-grid #summaryVariance.positive{color:#07994a}.hauler-summary-icon{width:46px;height:46px;flex:0 0 46px;border-radius:50%;display:grid;place-items:center;font-size:19px}.hauler-summary-icon.blue{background:#edf5ff;color:#287fff}.hauler-summary-icon.green{background:#eafbf4;color:#00b978}.hauler-summary-icon.red{background:#fff0f2;color:#ff3151}.hauler-summary-icon.purple{background:#f7ecff;color:#9b32ff}.hauler-summary-icon.amber{background:#fff7e5;color:#f6a500}.hauler-summary-icon.orange{background:#fff5ec;color:#ff742b}.hauler-workspace{display:grid;grid-template-columns:minmax(0,1fr) 368px;gap:26px;align-items:start}.hauler-assignment-panel,.hauler-sidebar{border:1px solid #ead8c5;border-radius:18px;background:#fff;box-shadow:none;overflow:hidden}.hauler-assignment-panel>header{height:68px;padding:0 27px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid #eee6de}.hauler-assignment-panel h3{font-size:17px;margin:0;font-weight:800}.hauler-assignment-panel header em,.hauler-assigned-caption em{font-size:11px;color:#aa8f74}.hauler-assignment{border-bottom:1px solid #eee6de}.hauler-assignment-head{width:100%;min-height:70px;padding:12px 24px;display:grid;grid-template-columns:20px minmax(245px,1.65fr) repeat(5,minmax(110px,.75fr));gap:13px;align-items:center;text-align:left;border:0;background:#fff;color:#4e3a28;cursor:pointer}.hauler-assignment-head:hover{background:#fffdfb}.hauler-assignment-head>i{color:#a58d76}.hauler-assignment-head span{min-width:0}.hauler-assignment-head small{display:block;font-size:9px;color:#aa8f74;font-weight:800;letter-spacing:.04em}.hauler-assignment-head b{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:12px}.hauler-loader strong{display:block;color:#17100a;font-size:14px}.hauler-loader small{margin-top:4px;text-transform:none;letter-spacing:0}.hauler-loader small b{display:inline;color:#1479ed}.orange-text{color:#cf762f}.green-text{color:#00a657}.hauler-status{display:inline-block!important;width:max-content;padding:3px 10px;border-radius:9px;font-size:9px!important}.hauler-status.balanced{background:#e5f6ea;color:#147c3a;border:1px solid #c5e7d0}.hauler-status.under-trucked,.hauler-status.over-trucked{background:#fff5dc;color:#986b00;border:1px solid #f4d67c}.hauler-status.standby{background:#f5f1eb;color:#826e59;border:1px solid #e2d7ca}.hauler-assigned-body{padding:18px 24px 22px;background:#fffdfb;transition:.2s}.hauler-assigned-body.drag-over{background:#fff7ed;box-shadow:inset 0 0 0 2px #d2823f}.hauler-assigned-caption{display:flex;justify-content:space-between;margin-bottom:16px;font-size:10px;color:#ad8b6a;letter-spacing:.06em}.hauler-card-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}.hauler-assigned-card{min-height:82px;padding:15px 17px;display:flex;align-items:center;gap:13px;border:1px solid #ead8c5;border-radius:16px;background:#fff}.hauler-assigned-card .truck-icon{width:43px;height:43px;display:grid;place-items:center;border-radius:50%;background:#fff9e9;color:#d2792f;font-size:18px}.hauler-assigned-card strong{color:#17100a}.hauler-assigned-card small,.hauler-assigned-card p{color:#a3886e;font-size:11px}.hauler-assigned-card p{margin:4px 0 0}.hauler-assigned-card p b{color:#4a3726}.hauler-assigned-card .trip-target{margin-left:auto;color:#9d7f62}.hauler-assigned-card button{width:35px;height:35px;border-radius:12px;border:1px solid #eee0d3;background:#fff;color:#ad9277}.hauler-empty-drop{grid-column:1/-1;padding:28px;text-align:center;border:1px dashed #e5cdb4;border-radius:14px;color:#a58a70}.hauler-sidebar{padding:18px;position:sticky;top:92px}.hauler-sidebar-tabs{display:grid;grid-template-columns:1fr 1fr;padding:5px;border-radius:14px;background:#f5f0eb}.hauler-sidebar-tabs button{padding:10px;border:0;border-radius:10px;background:transparent;color:#92785f;font-weight:700}.hauler-sidebar-tabs button.active{background:#fff;color:#322215;box-shadow:0 2px 7px rgba(82,53,25,.08)}.hauler-search{margin:17px 0;display:flex;align-items:center;gap:9px;padding:10px 13px;border:1px solid #e8d5c2;border-radius:13px;color:#a88c70}.hauler-search input{width:100%;border:0;outline:0;color:#493626}.hauler-compatibility-note{padding:14px;border:1px solid #ebdac8;border-radius:13px;display:flex;flex-direction:column;color:#97795e}.hauler-compatibility-note strong{font-size:9px;color:#6f543d}.hauler-compatibility-note span{font-size:11px;margin-top:5px}.hauler-sidebar-list{max-height:535px;overflow:auto;margin-top:16px;display:grid;gap:10px}.hauler-side-card{min-height:72px;padding:12px;display:flex;align-items:center;gap:11px;border:1px solid #ead8c5;border-left:4px solid #cf7934;border-radius:13px;background:#fff;cursor:grab}.hauler-side-card>div{min-width:0;display:flex;flex-direction:column}.hauler-side-card strong{color:#21170f}.hauler-side-card small{color:#a78c72}.hauler-side-card em{width:max-content;margin-top:5px;padding:2px 6px;border-radius:5px;background:#e9fff4;color:#008d56;font-size:9px;font-style:normal}.hauler-side-card button{margin-left:auto;padding:7px 12px;border:1px solid #e7d6c5;border-radius:10px;background:#fff;color:#674d37}.operator-avatar{width:38px;height:38px;display:grid;place-items:center;border-radius:50%;background:#fff4e9;color:#c97431}.hauler-panel-message{padding:40px;text-align:center;color:#a0866d}.hauler-page-footer{margin-top:27px;padding-top:24px;display:flex;justify-content:space-between;border-top:1px solid #eadfd5}.hauler-page-footer>div{display:flex;gap:12px}.hauler-page-footer .btn{min-height:42px}.hauler-sidebar .d-none,.hauler-assignment-panel .d-none{display:none!important}@media(max-width:1400px){.hauler-summary-grid{grid-template-columns:repeat(3,1fr)}.hauler-workspace{grid-template-columns:minmax(0,1fr) 320px}.hauler-assignment-head{grid-template-columns:20px minmax(210px,1.5fr) repeat(5,minmax(90px,.65fr))}}@media(max-width:1050px){.hauler-workspace{grid-template-columns:1fr}.hauler-sidebar{position:static}.hauler-assignment-head{overflow-x:auto}.hauler-card-grid{grid-template-columns:1fr}}@media(max-width:760px){.hauler-summary-grid{grid-template-columns:1fr 1fr}.hauler-filter-card,.hauler-page-footer{align-items:stretch;gap:14px;flex-direction:column}.hauler-page-footer>div{flex-wrap:wrap}.hauler-assignment-head{display:flex;flex-wrap:wrap}.hauler-assignment-head .hauler-loader{width:calc(100% - 30px)}}


/* Hauler Allocation - shared Target / Digger spacing, with responsive allocation cards. */
#haulerAllocationPage { padding: 28px 36px 32px; }

.hauler-page-header .hauler-shift-filter { width: 216px; }
.hauler-page-header .hauler-shift-filter .select2-container { flex: 1; min-width: 0 !important; width: auto !important; }
.hauler-page-header .hauler-date-filter { width: 196px; }
.hauler-page-header .hauler-date-filter input { min-width: 0 !important; width: 142px; }

#haulerAllocationPage .hauler-filter-card,
#haulerAllocationPage .hauler-assignment-panel,
#haulerAllocationPage .hauler-sidebar {
    background: #fff;
    border: 1px solid #eadfd4;
    border-radius: 18px !important;
    box-shadow: 0 1px 2px rgba(74, 56, 40, .14);
    margin: 0;
    min-width: 0;
}

#haulerAllocationPage .hauler-filter-card {
    flex-direction: row;
    flex-wrap: wrap;
    gap: 16px;
    height: auto;
    min-height: 76px;
    padding: 16px 24px;
}

#haulerAllocationPage .hauler-allocation-mode-actions { flex-wrap: wrap; gap: 12px; }
#haulerAllocationPage .digger-material-tabs,
#haulerAllocationPage .digger-mode-tabs {
    align-items: center;
    background: #fcfaf7;
    border: 1px solid #ead8c6;
    border-radius: 14px;
    display: inline-flex;
    flex-wrap: wrap;
    gap: 2px;
    max-width: 100%;
    padding: 4px;
}

#haulerAllocationPage .digger-material-tabs button,
#haulerAllocationPage .digger-mode-tabs button {
    align-items: center;
    display: inline-flex;
    font-size: 13px;
    font-weight: 600;
    gap: 8px;
    line-height: 18px;
    min-height: 34px;
    padding: 7px 14px;
}

#haulerAllocationPage .hauler-summary-grid { gap: 18px; margin: 28px 0; }
#haulerAllocationPage .hauler-summary-grid article {
    border: 1px solid #f0e8df;
    border-radius: 16px;
    box-shadow: 0 2px 6px rgba(74, 56, 40, .05);
    gap: 12px;
    height: auto;
    padding: 16px;
}
#haulerAllocationPage .hauler-summary-grid article > div { min-width: 0; }
#haulerAllocationPage .hauler-summary-grid strong { font-size: 15px; white-space: normal; overflow-wrap: anywhere; }
#haulerAllocationPage .hauler-summary-icon { flex-basis: 40px; width: 40px; height: 40px; font-size: 17px; }
#haulerAllocationPage .hauler-workspace { gap: 16px; grid-template-columns: minmax(0, 1fr) 320px; }
#haulerAllocationPage .hauler-assignment-panel { height: auto; }
#haulerAllocationPage .hauler-assignment-panel > header {
    flex-wrap: wrap;
    gap: 8px 16px;
    height: auto;
    min-height: 68px;
    padding: 20px 24px;
}
#haulerAllocationPage .hauler-assignment-panel h3 { font-size: 15px; font-weight: 700; line-height: 20px; }
#haulerAllocationPage .hauler-assignment-panel header em { font-size: 11px; line-height: 17px; }
#haulerAllocationPage .hauler-assignment-list { height: auto; overflow: visible; }
#haulerAllocationPage .hauler-assignment-panel .hauler-panel-message { min-height: 220px; padding: 24px; }
#haulerAllocationPage .hauler-assignment:last-child { border-bottom: 0; }
#haulerAllocationPage .hauler-assignment-head {
    display: grid;
    grid-template-columns: 16px minmax(190px, 1.1fr) minmax(160px, .9fr) repeat(4, minmax(100px, 1fr));
    gap: 12px;
    min-height: 80px;
    overflow: visible;
    padding: 16px 20px 16px 50px;
}
#haulerAllocationPage:not(.auto-allocation-mode) .hauler-assignment-head { padding-left: 24px; }
#haulerAllocationPage .hauler-auto-excavator-select { left: 20px; top: 29px; }
#haulerAllocationPage .hauler-loader { width: auto; }
#haulerAllocationPage .hauler-loader strong { font-size: 13px; line-height: 21px; overflow-wrap: anywhere; }
#haulerAllocationPage .hauler-assignment-head b { white-space: normal; overflow-wrap: anywhere; }
#haulerAllocationPage .hauler-assignment-head small { line-height: 16px; }
#haulerAllocationPage .hauler-status { max-width: 100%; white-space: normal; }
#haulerAllocationPage .hauler-assigned-body { padding: 18px 24px 24px; }
#haulerAllocationPage .hauler-assigned-caption { flex-wrap: wrap; gap: 8px; line-height: 17px; }
#haulerAllocationPage .hauler-card-grid,
#haulerAllocationPage .hauler-auto-suggestion-list { gap: 14px; grid-template-columns: repeat(2, minmax(0, 1fr)); }
#haulerAllocationPage .hauler-assigned-card {
    display: grid;
    grid-template-columns: 44px minmax(0, 1fr) max-content 35px;
    align-items: center;
    gap: 12px;
    min-width: 0;
    min-height: 84px;
    padding: 12px 18px;
    border-radius: 18px;
}
#haulerAllocationPage .hauler-assigned-card > .truck-icon { grid-column: 1; grid-row: 1; width: 44px; height: 44px; }
#haulerAllocationPage .hauler-assigned-card > div { min-width: 0; overflow-wrap: anywhere; }
#haulerAllocationPage .hauler-assigned-card > div > strong { display: block; font-size: 13px; line-height: 18px; }
#haulerAllocationPage .hauler-assigned-card .hauler-card-operator { margin-top: 3px; line-height: 16px; }
#haulerAllocationPage .hauler-assigned-card .hauler-card-driver { line-height: 14px; }
#haulerAllocationPage .hauler-assigned-card .trip-target { grid-column: 3; grid-row: 1; margin: 0; font-size: 13px; white-space: nowrap; }
#haulerAllocationPage .hauler-assigned-card > button { grid-column: 4; grid-row: 1; width: 35px; height: 35px; display: grid; place-items: center; padding: 0; }
#haulerAllocationPage .hauler-card-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
#haulerAllocationPage .hauler-inline-auto-suggestions {
    container: hauler-suggestions / inline-size;
    margin-top: 20px;
    padding: 20px;
    border: 1px solid #ead8c5;
    border-radius: 16px;
    background: #fcf8f3;
}
#haulerAllocationPage .hauler-inline-auto-heading { flex-wrap: wrap; gap: 16px; margin-bottom: 18px; }
#haulerAllocationPage .hauler-auto-heading-copy { min-width: 0; gap: 6px; }
#haulerAllocationPage .hauler-auto-heading-copy > strong { display: flex; align-items: center; flex-wrap: wrap; gap: 8px; color: #382a20; font-size: 14px; font-weight: 700; line-height: 22px; text-transform: none; }
#haulerAllocationPage .hauler-auto-heading-copy > strong > .fa { color: #c87938; }
#haulerAllocationPage .hauler-auto-heading-copy > small { line-height: 18px; }
#haulerAllocationPage .hauler-auto-count { display: inline-grid; place-items: center; min-width: 24px; height: 24px; padding: 0 6px; border-radius: 8px; background: #f2e5d7; color: #945623; font-size: 11px; }
#haulerAllocationPage .hauler-auto-heading-actions { display: flex; align-items: center; flex-wrap: wrap; gap: 12px; margin-left: auto; }
#haulerAllocationPage .hauler-auto-selection-count { color: #8c725c; font-size: 11px; white-space: nowrap; }
#haulerAllocationPage .hauler-auto-suggestion-list { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; }
#haulerAllocationPage .hauler-auto-suggestion-card {
    grid-template-columns: 16px 36px minmax(80px, .9fr) minmax(0, 1.3fr) minmax(95px, .8fr);
    grid-template-areas: "select icon machine driver productivity";
    gap: 10px;
    min-width: 0;
    min-height: 88px;
    padding: 12px 14px;
    border-radius: 16px;
    transition: border-color .15s ease, background-color .15s ease, box-shadow .15s ease;
}
#haulerAllocationPage .hauler-auto-suggestion-card:has(input:checked) { border-color: #c87938; background: #fffaf3; box-shadow: inset 0 0 0 1px #c87938; }
#haulerAllocationPage .hauler-auto-suggestion-card:focus-within { outline: 2px solid #c87938; outline-offset: 3px; }
#haulerAllocationPage .hauler-auto-row-select { grid-area: select; width: 16px; height: 16px; margin: 0; accent-color: #c87938; cursor: inherit; }
#haulerAllocationPage .hauler-auto-suggestion-card > .truck-icon { grid-area: icon; width: 36px; height: 36px; border-radius: 10px; font-size: 16px; }
#haulerAllocationPage .hauler-auto-suggestion-card > .hauler-auto-machine { grid-area: machine; gap: 6px; }
#haulerAllocationPage .hauler-auto-suggestion-card > .hauler-auto-driver { grid-area: driver; gap: 3px; }
#haulerAllocationPage .hauler-auto-suggestion-card > .hauler-auto-productivity { grid-area: productivity; gap: 6px; padding-left: 10px; border-left: 1px solid #eee3d7; }
#haulerAllocationPage .hauler-auto-suggestion-card strong,
#haulerAllocationPage .hauler-auto-suggestion-card b { white-space: normal; overflow-wrap: anywhere; font-size: 13px; line-height: 19px; }
#haulerAllocationPage .hauler-auto-suggestion-card .hauler-auto-machine strong,
#haulerAllocationPage .hauler-auto-suggestion-card .hauler-auto-driver strong { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
#haulerAllocationPage .hauler-auto-suggestion-card .hauler-auto-rank { align-self: flex-start; padding: 2px 7px; border-radius: 5px; background: #f7efe5; color: #986331; font-size: 10px; line-height: 15px; }
#haulerAllocationPage .hauler-auto-field-label { color: #9f8268; font-size: 10px; line-height: 15px; }
#haulerAllocationPage .hauler-auto-suggestion-card .hauler-auto-driver small { margin: 0; font-size: 10px; line-height: 15px; }
#haulerAllocationPage .hauler-auto-productivity b { font-size: 16px; color: #078656; font-variant-numeric: tabular-nums; }
#haulerAllocationPage .hauler-auto-productivity b small { font-size: 11px; font-weight: 500; color: #658474; }
#haulerAllocationPage .hauler-inline-auto-suggestions .hauler-auto-empty { padding: 24px; margin: 0; border: 1px dashed #e5d1bb; border-radius: 12px; background: #fff; }
@container hauler-suggestions (max-width: 800px) {
    #haulerAllocationPage .hauler-auto-suggestion-list { grid-template-columns: minmax(0, 1fr); }
}
@container hauler-suggestions (max-width: 440px) {
    #haulerAllocationPage .hauler-auto-heading-actions { margin-left: 0; width: 100%; justify-content: space-between; }
    #haulerAllocationPage .hauler-auto-suggestion-card { grid-template-columns: 18px 36px minmax(0, 1fr); grid-template-areas: "select icon machine" ". driver driver" ". productivity productivity"; padding: 14px; }
    #haulerAllocationPage .hauler-auto-suggestion-card > .hauler-auto-productivity { padding: 12px 0 0; border-left: 0; border-top: 1px solid #eee3d7; }
}
#haulerAllocationPage .hauler-sidebar { height: auto; min-height: 360px; max-height: calc(100vh - 150px); padding: 18px; }
#haulerAllocationPage .hauler-sidebar-tabs button { font-size: 13px; line-height: 18px; }
#haulerAllocationPage .hauler-sidebar-list { max-height: 520px; }
#haulerAllocationPage .hauler-side-card { min-width: 0; }
#haulerAllocationPage .hauler-page-footer {
    align-items: center;
    background: transparent;
    backdrop-filter: none;
    border: 0;
    border-top: 1px solid #eadfd5;
    border-radius: 0;
    bottom: auto;
    box-shadow: none;
    flex-wrap: wrap;
    gap: 16px;
    margin: 28px 0 0;
    padding: 18px 0 0;
    position: static;
    z-index: auto;
}
#haulerAllocationPage .hauler-page-footer > div { flex-wrap: wrap; gap: 12px; margin-left: auto; }
#haulerAllocationPage .hauler-page-footer .btn,
#haulerAllocationPage .apply-hauler-auto-allocation {
    align-items: center;
    border-radius: 14px;
    display: inline-flex;
    font-size: 13px;
    gap: 10px;
    justify-content: center;
    line-height: 20px;
    min-height: 42px;
    padding: 10px 18px;
    text-transform: none;
    white-space: normal;
}
#haulerAllocationPage #submitHaulerPlan,
#haulerAllocationPage .apply-hauler-auto-allocation {
    background: #bf7739;
    border-color: #bf7739;
    box-shadow: 0 2px 4px rgba(107, 64, 27, .16);
    color: #fff;
}
#haulerAllocationPage button:focus-visible { outline: 2px solid #bf7739; outline-offset: 3px; }

@media (max-width: 1550px) {
    #haulerAllocationPage .hauler-summary-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
    #haulerAllocationPage .hauler-assignment-head { grid-template-columns: 16px repeat(4, minmax(0, 1fr)); }
    #haulerAllocationPage .hauler-loader { grid-column: 2 / span 2; }
    #haulerAllocationPage .excavator-operator-drop { grid-column: 4 / span 2; }
    #haulerAllocationPage .hauler-assignment-head > span:nth-child(4) { grid-column: 2; }
}
@media (max-width: 1200px) {
    #haulerAllocationPage .hauler-workspace { grid-template-columns: minmax(0, 1fr); }
    #haulerAllocationPage .hauler-sidebar { position: static; max-height: 560px; }
    #haulerAllocationPage .hauler-allocation-mode-actions { margin-left: 0; }
}
@media (max-width: 991px) { #haulerAllocationPage { padding: 24px; } }
@media (max-width: 600px) {
    #haulerAllocationPage { padding: 16px; }
    #haulerAllocationPage .hauler-filter-card { padding: 12px; }
    #haulerAllocationPage .hauler-summary-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
    #haulerAllocationPage .hauler-summary-grid article { flex-direction: column; align-items: flex-start; padding: 12px; }
    #haulerAllocationPage .hauler-mode-separator { display: none; }
    #haulerAllocationPage .hauler-assignment-head { grid-template-columns: 16px repeat(2, minmax(0, 1fr)); }
    #haulerAllocationPage .excavator-operator-drop { grid-column: 2 / span 2; }
    #haulerAllocationPage .hauler-assignment-head > span:nth-child(6) { grid-column: 2; }
    #haulerAllocationPage .hauler-assigned-body { padding: 16px; }
    #haulerAllocationPage .hauler-card-grid,
    #haulerAllocationPage .hauler-auto-suggestion-list { grid-template-columns: minmax(0, 1fr); }
    #haulerAllocationPage .hauler-page-footer > div { width: 100%; margin: 0; }
    #haulerAllocationPage .hauler-page-footer .btn { width: 100%; min-width: 0; }
}

@media (max-width: 480px) {
    #haulerAllocationPage .hauler-assigned-card { grid-template-columns: 40px minmax(0, 1fr) 35px; gap: 6px 10px; padding: 12px; }
    #haulerAllocationPage .hauler-assigned-card > .truck-icon { width: 40px; height: 40px; }
    #haulerAllocationPage .hauler-assigned-card .trip-target { grid-column: 2; grid-row: 2; font-size: 12px; }
    #haulerAllocationPage .hauler-assigned-card > button { grid-column: 3; }
}

#haulerAllocationPage .hauler-assignment-title-search {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 12px;
    min-width: 0;
    max-width: 100%;
}
#haulerAllocationPage .hauler-assignment-search-toggle {
    width: 38px;
    height: 38px;
    flex-shrink: 0;
    border: 1px solid #eadfd4;
    border-radius: 9px;
    background: #fff;
    color: #a56d3e;
    position: absolute;
    left: 0;
    top: 0;
    z-index: 1;
    transition: background .2s ease, border-color .2s ease;
}
#haulerAllocationPage .hauler-assignment-search-control { position: relative; width: 320px; max-width: 100%; height: 38px; }
#haulerAllocationPage .hauler-assignment-search-toggle[aria-expanded="true"] { background: transparent; border-color: transparent; }
#haulerAllocationPage .hauler-assignment-search-toggle:hover { background: #fcf1e6; }
#haulerAllocationPage .hauler-assignment-tip { font-style: normal; color: #a18c78; }
/* Reserve the field's space so neither the header nor its tip jumps on toggle. */
#haulerAllocationPage .hauler-assignment-search-bar {
    display: flex;
    align-items: center;
    flex-wrap: nowrap;
    gap: 10px 16px;
    padding: 0;
    max-width: 100%;
    min-width: 0;
    width: 100%;
    height: 38px;
    position: relative;
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    clip-path: inset(0 100% 0 0 round 9px);
    transition: opacity .2s ease, clip-path .25s ease, visibility 0s linear .25s;
}
#haulerAllocationPage .hauler-assignment-search-bar.is-expanded {
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
    clip-path: inset(-20px -4px -40px -4px round 9px);
    transition-delay: 0s;
}
#haulerAllocationPage .hauler-assignment-search-bar #haulerAssignmentSearchStatus {
    position: absolute;
    top: 100%;
    left: 0;
    line-height: 16px;
}
@media (prefers-reduced-motion: reduce) {
    #haulerAllocationPage .hauler-assignment-search-bar { transition: none; transform: none; }
}
#haulerAllocationPage .hauler-assignment-search-bar .hauler-search {
    width: 100%;
    max-width: 100%;
    margin: 0;
    min-width: 0;
    height: 38px;
    padding: 0 12px 0 40px;
    border-radius: 9px;
    background: #fcfaf7;
    transition: border-color .2s ease, box-shadow .2s ease;
}
#haulerAllocationPage .hauler-assignment-search-bar .hauler-search:focus-within { border-color: #c88a50; box-shadow: 0 0 0 3px rgba(191,119,57,.1); }
#haulerAllocationPage .hauler-assignment-search-bar input { min-width: 0; background: transparent; font-size: 12px; }
#haulerAssignmentSearchStatus { color: #897a69; font-size: 12px; }

/* Give the empty allocation panel and resource list matching, roomy heights. */
#haulerAllocationPage.has-no-assignments .hauler-workspace { align-items: stretch; }
#haulerAllocationPage.has-no-assignments .hauler-assignment-panel,
#haulerAllocationPage.has-no-assignments .hauler-sidebar {
    height: 600px;
    min-height: 0;
    max-height: none;
    position: static;
    display: flex;
    flex-direction: column;
    overflow: hidden;
}
#haulerAllocationPage.has-no-assignments .hauler-assignment-panel > header,
#haulerAllocationPage.has-no-assignments .hauler-sidebar > :not(.hauler-sidebar-list):not(.hauler-panel-message) { flex-shrink: 0; }
#haulerAllocationPage.has-no-assignments .hauler-assignment-list { flex: 1; min-height: 0; }
#haulerAllocationPage.has-no-assignments .hauler-assignment-list > .hauler-panel-message {
    height: 100%;
    min-height: 0;
    padding: 24px;
    text-align: center;
}
#haulerAllocationPage.has-no-assignments .hauler-sidebar-list { overflow-y: auto; max-height: none; }
#haulerAllocationPage .hauler-empty-state { flex-direction: column; gap: 10px; }
#haulerAllocationPage .hauler-empty-state > i { font-size: 28px; color: #bf7739; }
#haulerAllocationPage .hauler-empty-state > strong { color: #6b5746; font-size: 15px; }
#haulerAllocationPage .hauler-empty-state > span { max-width: 420px; line-height: 20px; }
@media (max-width: 1200px) {
    #haulerAllocationPage.has-no-assignments .hauler-assignment-panel,
    #haulerAllocationPage.has-no-assignments .hauler-sidebar { height: 480px; }
}

/* One control and popup alignment for all three Shift Plan headers. */
.target-page-header .shift-plan-shift-filter { flex: 0 0 auto; width: 216px; }
.target-page-header .shift-plan-date-filter { flex: 0 0 auto; width: 196px; }
.target-page-header .shift-plan-shift-filter label,
.target-page-header .shift-plan-date-filter .material-icons { flex-shrink: 0; }
.target-page-header .shift-plan-shift-filter .select2-container {
    flex: 1 1 0%;
    min-width: 0 !important;
    width: auto !important;
}
.target-page-header .shift-plan-shift-filter .select2-selection { min-width: 0 !important; width: 100%; }
.target-page-header .shift-plan-date-filter input { flex: 1 1 0%; min-width: 0 !important; width: 100%; }

body > .shift-plan-dropdown-host { height: auto !important; margin: 0; }
.shift-plan-dropdown-host .select2-dropdown {
    background: #fff;
    border: 1px solid #eadfd4;
    border-radius: 12px;
    box-shadow: 0 8px 22px rgba(74, 56, 40, .14);
    box-sizing: border-box;
    display: block;
    left: auto !important;
    margin: 0;
    overflow: hidden;
    position: relative;
    top: auto !important;
    width: 100% !important;
}
.shift-plan-shift-dropdown .select2-search--dropdown { padding: 8px; }
.shift-plan-shift-dropdown .select2-search__field { border: 1px solid #eadfd4 !important; border-radius: 7px; padding: 6px 8px; }
.shift-plan-shift-dropdown .select2-results__option { color: #6b5746; font-size: 13px; line-height: 20px; padding: 8px 12px; }
.shift-plan-shift-dropdown .select2-results__option--selected { background: #fcf4e9; color: #a96328; }
.shift-plan-shift-dropdown .select2-results__option--highlighted.select2-results__option--selectable { background: #bf7739; color: #fff; }
.shift-plan-shift-dropdown .select2-results__option--disabled { color: #aaa197; }

body .xdsoft_datetimepicker.shift-plan-calendar {
    background: #fff;
    border: 1px solid #eadfd4;
    border-radius: 12px;
    box-shadow: 0 8px 22px rgba(74, 56, 40, .14);
    box-sizing: border-box;
    color: #6b5746;
    margin: 0;
    padding: 12px;
    width: 260px;
}
body .xdsoft_datetimepicker.shift-plan-calendar .xdsoft_datepicker { float: none; margin: 0; width: 100%; }
body .xdsoft_datetimepicker.shift-plan-calendar .xdsoft_monthpicker {
    display: grid;
    grid-template-columns: 20px 20px minmax(0, 1fr) 52px 20px;
    align-items: center;
    gap: 2px;
    min-height: 34px;
    margin-bottom: 8px;
}
body .xdsoft_datetimepicker.shift-plan-calendar .xdsoft_monthpicker > .xdsoft_prev { order: 1; }
body .xdsoft_datetimepicker.shift-plan-calendar .xdsoft_monthpicker > .xdsoft_today_button { order: 2; margin: 0; }
body .xdsoft_datetimepicker.shift-plan-calendar .xdsoft_monthpicker > .xdsoft_month { order: 3; }
body .xdsoft_datetimepicker.shift-plan-calendar .xdsoft_monthpicker > .xdsoft_year { order: 4; }
body .xdsoft_datetimepicker.shift-plan-calendar .xdsoft_monthpicker > .xdsoft_next { order: 5; }
body .xdsoft_datetimepicker.shift-plan-calendar .xdsoft_label {
    background: #fff;
    color: #6b5746;
    font-size: 12px;
    float: none;
    width: auto;
    padding: 5px 0;
    white-space: nowrap;
}
body .xdsoft_datetimepicker.shift-plan-calendar .xdsoft_calendar table { width: 100%; table-layout: fixed; }
body .xdsoft_datetimepicker.shift-plan-calendar .xdsoft_calendar th { background: #fcfaf7; color: #9a8269; font-weight: 600; }
body .xdsoft_datetimepicker.shift-plan-calendar .xdsoft_calendar td,
body .xdsoft_datetimepicker.shift-plan-calendar .xdsoft_calendar th {
    border-color: #f0e8df;
    font-size: 12px;
    height: 30px;
    padding: 0;
    text-align: center;
    vertical-align: middle;
}
body .xdsoft_datetimepicker.shift-plan-calendar .xdsoft_calendar td > div { padding: 0; line-height: 30px; }
body .xdsoft_datetimepicker.shift-plan-calendar .xdsoft_calendar td { background: #fff; color: #6b5746; }
body .xdsoft_datetimepicker.shift-plan-calendar .xdsoft_calendar td.xdsoft_current,
body .xdsoft_datetimepicker.shift-plan-calendar .xdsoft_label > .xdsoft_select > div > .xdsoft_option.xdsoft_current {
    background: #bf7739;
    box-shadow: none;
    color: #fff;
}
@media (max-width: 480px) {
    .target-page-header .shift-plan-shift-filter,
    .target-page-header .shift-plan-date-filter { flex: 0 0 auto; width: 100%; max-width: 100%; }
}

/* Zone Trip Report */
.zone-trip-report-page {
    padding: 20px;
}

    .zone-trip-report-page .zone-trip-report-body {
        padding: 0 1px 1px;
    }

    .zone-trip-report-page .zone-trip-filter-container {
        position: relative;
        margin: 8px 0 12px;
    }

    .zone-trip-report-page .zone-trip-table {
        width: 100%;
    }

    .zone-trip-report-page .zone-trip-device-filter-section {
        display: none;
    }

.zone-trip-select2-dropdown .select2-results__option[aria-selected]::before {
    content: '\2610';
    margin-right: 8px;
}

.zone-trip-select2-dropdown .select2-results__option[aria-selected='true']::before {
    content: '\2611';
    color: #c8871a;
}

.zone-trip-report-page #filterIconBtn {
    width: 42px;
    height: 42px;
    padding: 0 !important;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: #c8871a !important;
    border: 1px solid #c8871a !important;
    border-radius: 6px;
    color: #fff !important;
    box-shadow: none;
}

    .zone-trip-report-page #filterIconBtn i {
        color: #fff !important;
        font-size: 16px;
        line-height: 1;
    }

    .zone-trip-report-page #filterIconBtn:hover,
    .zone-trip-report-page #filterIconBtn:focus,
    .zone-trip-report-page #filterIconBtn:active {
        background: #ad6810 !important;
        border-color: #ad6810 !important;
        color: #fff !important;
        outline: none;
    }

.zone-trip-report-page .zone-trip-filter-popup {
    display: none;
    position: absolute;
    z-index: 9998;
    top: 46px;
    left: 0;
    width: 540px;
    max-width: calc(100vw - 90px);
    padding: 20px 22px 16px;
    background: #fff;
    border: 1px solid #e0ddd8;
    border-radius: 10px;
    box-shadow: 0 10px 28px rgba(15, 23, 42, .16);
}

    .zone-trip-report-page .zone-trip-filter-popup label {
        color: #627492;
        font-weight: 500;
        margin-bottom: 7px;
    }

    .zone-trip-report-page .zone-trip-filter-popup .form-group {
        margin-bottom: 6px;
    }

.zone-trip-report-page .zone-trip-filter-mode {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 6px;
    padding: 4px;
    margin: 2px 0 10px;
    background: #f3f5f7;
    border: 1px solid #e1e5ea;
    border-radius: 8px;
}

.zone-trip-report-page .zone-trip-filter-mode-option {
    margin: 0 !important;
    cursor: pointer;
}

    .zone-trip-report-page .zone-trip-filter-mode-option input {
        position: absolute;
        opacity: 0;
        pointer-events: none;
    }

    .zone-trip-report-page .zone-trip-filter-mode-option span {
        display: flex;
        align-items: center;
        justify-content: center;
        gap: 7px;
        min-height: 36px;
        padding: 7px 12px;
        color: #627492;
        font-size: 13px;
        font-weight: 600;
        border: 1px solid transparent;
        border-radius: 6px;
        transition: all .18s ease;
    }

        .zone-trip-report-page .zone-trip-filter-mode-option span i {
            color: #8190a7;
            font-size: 14px;
        }

    .zone-trip-report-page .zone-trip-filter-mode-option input:checked + span {
        color: #a9630d;
        background: #fff;
        border-color: #d89542;
        box-shadow: 0 2px 5px rgba(15, 23, 42, .08);
    }

        .zone-trip-report-page .zone-trip-filter-mode-option input:checked + span i {
            color: #c47a13;
        }

    .zone-trip-report-page .zone-trip-filter-mode-option input:focus-visible + span {
        outline: 2px solid rgba(196, 122, 19, .28);
        outline-offset: 1px;
    }

.zone-trip-report-page #vehicleFilterSection,
.zone-trip-report-page #deviceFilterSection {
    margin: 0 -6px;
    padding: 4px 6px 2px;
    border-radius: 8px;
}

.zone-trip-report-page .zone-trip-filter-actions {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding-top: 4px;
    border-top: 1px solid #edf0f3;
}

    .zone-trip-report-page .zone-trip-filter-actions .btn {
        min-width: 102px;
        padding: 9px 24px;
        font-weight: 600;
        border-radius: 6px;
    }

.zone-trip-report-page .zone-trip-cancel {
    color: #c47a13;
    background: #fff;
    border: 1px solid #c47a13;
}

    .zone-trip-report-page .zone-trip-cancel:hover,
    .zone-trip-report-page .zone-trip-cancel:focus {
        color: #a9630d;
        background: #fff9f2;
        border-color: #a9630d;
    }

.zone-trip-report-page .zone-trip-apply {
    color: #fff;
    background: #c47a13;
    border: 1px solid #c47a13;
}

    .zone-trip-report-page .zone-trip-apply:hover,
    .zone-trip-report-page .zone-trip-apply:focus {
        color: #fff;
        background: #ad6810;
    }

.zone-trip-report-page .zone-trip-invalid {
    border-color: #dc3545 !important;
    box-shadow: 0 0 0 2px rgba(220, 53, 69, .1) !important;
}

.zone-trip-report-page .zone-trip-filter-popup .select2-container {
    width: 100% !important;
    max-width: 100%;
}

.zone-trip-report-page .zone-trip-filter-popup .select2-selection {
    min-height: 38px;
    overflow: hidden;
}

.zone-trip-report-page #deviceFilterSection .select2-selection--multiple {
    height: auto !important;
    min-height: 44px;
    max-height: 44px;
    padding: 5px 6px;
    overflow: hidden !important;
    background: #fff;
    border-color: #dfe3e8;
    border-radius: 6px;
    transition: min-height .18s ease, max-height .18s ease, border-color .18s ease, box-shadow .18s ease;
}

.zone-trip-report-page #deviceFilterSection .select2-container.has-device-selections .select2-selection--multiple {
    height: 76px !important;
    min-height: 76px;
    max-height: 76px;
}

.zone-trip-report-page #deviceFilterSection .select2-container--focus .select2-selection--multiple,
.zone-trip-report-page #deviceFilterSection .select2-container--open .select2-selection--multiple {
    border-color: #c8871a;
    box-shadow: 0 0 0 2px rgba(200, 135, 26, .1);
}

.zone-trip-report-page #deviceFilterSection .select2-selection__arrow {
    display: none !important;
}

.zone-trip-report-page #deviceFilterSection .select2-selection--multiple .select2-selection__rendered {
    box-sizing: border-box;
    display: flex;
    flex-wrap: wrap;
    align-content: flex-start;
    gap: 4px 5px;
    width: calc(100% - 4px);
    height: 32px !important;
    max-height: 32px !important;
    margin: 0 2px;
    padding: 3px 8px 3px 2px !important;
    overflow-x: hidden !important;
    overflow-y: hidden !important;
    line-height: normal !important;
    white-space: normal !important;
    overscroll-behavior: contain;
    scrollbar-width: none;
}

    .zone-trip-report-page #deviceFilterSection .select2-selection--multiple .select2-selection__rendered > li {
        flex: 0 0 auto;
    }

.zone-trip-report-page #deviceFilterSection .select2-container.has-device-selections .select2-selection__rendered {
    height: 62px !important;
    max-height: 62px !important;
    overflow-y: auto !important;
}

.zone-trip-report-page #deviceFilterSection .select2-selection__rendered::-webkit-scrollbar {
    display: none;
    width: 0;
    height: 0;
}

.zone-trip-report-page #deviceFilterSection .select2-search--inline {
    display: flex;
    float: none !important;
    flex: 1 0 180px;
    align-items: center;
    height: 24px;
    margin: 0 !important;
}

    .zone-trip-report-page #deviceFilterSection .select2-search--inline .select2-search__field {
        width: 100% !important;
        min-width: 110px;
        height: 24px !important;
        margin: 0 !important;
        padding: 0 4px !important;
        line-height: 24px !important;
    }

.zone-trip-report-page #deviceFilterSection .select2-selection--multiple .select2-selection__choice {
    display: inline-flex;
    align-items: center;
    min-height: 24px;
    margin: 0;
    padding: 1px 8px 1px 5px !important;
    color: #42526a;
    line-height: 20px;
    background: #f3f5f7;
    border: 1px solid #cbd2da;
    border-radius: 5px;
}

.zone-trip-report-page #deviceFilterSection .select2-selection--multiple .select2-selection__choice__remove {
    position: static !important;
    display: inline-flex;
    float: none !important;
    align-items: center;
    justify-content: center;
    width: 18px;
    height: 18px;
    margin: 0 5px 0 0 !important;
    padding: 0 !important;
    color: #6b778c;
    background: transparent;
    border: 0 !important;
    border-right: 1px solid #cbd2da !important;
    border-radius: 0;
}

.zone-trip-report-page #tblZoneTrips .dataTables_empty {
    padding: 28px 12px !important;
    color: #6b778c;
    font-size: 14px;
    text-align: center;
}

.zone-trip-report-page .dataTables_scroll .zone-trip-device-column {
    position: sticky !important;
    left: 0;
    z-index: 2;
    min-width: 155px;
    background: #fff;
    box-shadow: 3px 0 5px -4px rgba(15, 23, 42, .45);
}

.zone-trip-report-page .dataTables_scrollHead .zone-trip-device-column {
    z-index: 4;
    background: #fff5ee;
}

.zone-trip-report-page .dataTables_scrollBody tbody tr:nth-child(even) .zone-trip-device-column {
    background: #faf8f8;
}

.zone-trip-report-page .dataTables_scrollBody tbody tr:hover .zone-trip-device-column {
    background: #f5f5f5;
}

.zone-trip-report-page .zone-trip-total-summary {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    margin: 0 14px 0 auto;
    padding: 6px 12px;
    color: #53637a;
    font-size: 13px;
    font-weight: 600;
    white-space: nowrap;
    background: #fff8ef;
    border: 1px solid #edcfaa;
    border-radius: 6px;
}

    .zone-trip-report-page .zone-trip-total-summary strong {
        color: #a9630d;
        font-size: 14px;
    }

.zone-trip-select2-dropdown {
    z-index: 99999 !important;
}

    .zone-trip-select2-dropdown .select2-results__options {
        max-height: 240px !important;
        overflow-x: hidden !important;
        overflow-y: auto !important;
        overscroll-behavior: contain;
        scrollbar-width: thin;
        scrollbar-color: #b8c1cc transparent;
    }

        .zone-trip-select2-dropdown .select2-results__options::-webkit-scrollbar {
            width: 6px;
        }

        .zone-trip-select2-dropdown .select2-results__options::-webkit-scrollbar-track {
            background: transparent;
        }

        .zone-trip-select2-dropdown .select2-results__options::-webkit-scrollbar-thumb {
            background: #b8c1cc;
            border-radius: 8px;
        }

@media (max-width: 767px) {
    .zone-trip-report-page .zone-trip-filter-popup {
        width: calc(100vw - 48px);
        max-height: 75vh;
        overflow-y: auto;
    }
}

/* Target Setup: add staff, equipment availability and speed budget popups. */
.target-record-modal[hidden] { display: none; }
.target-record-modal { position: fixed; inset: 0; z-index: 1000001; display: flex; align-items: center; justify-content: center; padding: 24px; }
body:has(#targetRecordModal:not([hidden])) button#leftdrawer { visibility: hidden; pointer-events: none; }
.target-record-backdrop { position: absolute; inset: 0; background: rgba(35, 29, 23, .45); backdrop-filter: blur(3px); }
.target-record-dialog { position: relative; display: flex; flex-direction: column; width: 560px; max-width: 100%; max-height: calc(100dvh - 48px); margin: 0; padding: 0; overflow: hidden; border: 1px solid #ead8c8; border-radius: 18px; background: #fff; box-shadow: 0 24px 70px #34291b33; }
.target-record-header, .target-record-actions { display: flex; flex: 0 0 auto; align-items: center; gap: 12px; padding: 20px 24px; }
.target-record-header { justify-content: space-between; border-bottom: 1px solid #eee2d8; }
.target-record-dialog h3 { margin: 0 0 5px; color: #152536; font-size: 18px; font-weight: 600; line-height: 1.4; }
.target-record-dialog small { color: #8c7967; font-size: 12px; }
.target-record-header button { flex-shrink: 0; width: 32px; height: 32px; padding: 0; border: 0; border-radius: 8px; background: transparent; color: #967b62; font-size: 24px; cursor: pointer; }
.target-record-header button:hover { background: #faf5ef; }
.target-record-fields { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 20px 16px; min-height: 0; padding: 24px; overflow-y: auto; overscroll-behavior: contain; }
.target-record-fields label { display: flex; flex-direction: column; min-width: 0; gap: 7px; margin: 0; font-size: 12px; font-weight: 500; color: #806f60; }
.target-record-fields label:last-child:nth-child(odd) { grid-column: 1 / -1; }
.target-record-fields input, .target-record-fields select { box-sizing: border-box; min-width: 0; width: 100%; height: 38px; border: 1px solid #ead8c8; border-radius: 10px; background: #fff; padding: 8px 12px; color: #263444; }
.target-record-fields .select2-container { min-width: 0; width: 100% !important; }
.target-record-fields .select2-selection--single { min-height: 38px; border: 1px solid #ead8c8; border-radius: 10px; }
.target-record-fields .select2-selection--multiple { min-height: 38px; border: 1px solid #ead8c8; border-radius: 10px; }
.target-record-fields .select2-selection__rendered { line-height: 36px !important; }
.target-record-fields .select2-selection__arrow { top: 6px !important; }
.target-record-modal > .select2-container--open { z-index: 1000002; }
.target-record-modal > .select2-container--open .select2-dropdown { width: 100% !important; }
.target-record-modal .select2-dropdown { border: 1px solid #ead8c8; border-radius: 10px; overflow: hidden; box-shadow: 0 8px 24px #34291b22; }
.target-record-modal .select2-results__options { max-height: 180px; }
.target-record-actions { justify-content: flex-end; border-top: 1px solid #eee2d8; background: #fdfbf8; }
.target-record-actions button { display: inline-flex; align-items: center; justify-content: center; gap: 8px; min-width: 104px; height: 40px; padding: 0 18px; border: 1px solid #ead8c8; border-radius: 10px; font: inherit; font-size: 13px; font-weight: 600; cursor: pointer; }
.target-record-cancel { background: #fff; color: #735a43; }
.target-record-actions .target-record-save { background: #c67c39; border-color: #c67c39; color: #fff; }
.target-record-actions .target-record-save:hover { background: #af682d; border-color: #af682d; }
.target-record-actions button:disabled { opacity: .55; cursor: not-allowed; }
.target-record-dialog button:focus-visible, .target-record-fields input:focus-visible { outline: 2px solid #c67c39; outline-offset: 3px; }
@media (max-width: 540px) { .target-record-modal { padding: 12px; } .target-record-dialog { max-height: calc(100dvh - 24px); } .target-record-fields { grid-template-columns: 1fr; padding: 20px; } .target-record-header, .target-record-actions { padding: 16px 20px; } }

/* Prerequisite viewers: keep controls aligned without inheriting global form/table sizing. */
#targetSetupPage .target-detail-page { padding: 0; }
#targetSetupPage .target-detail-header { flex-direction: row; flex-wrap: wrap; gap: 20px; min-height: 80px; padding: 16px 18px; }
#targetSetupPage .target-detail-title { flex: 0 1 auto; min-width: 0; gap: 14px; }
:is(#targetSetupPage, #diggerAllocationPage) .target-detail-title > div { min-width: 0; }
:is(#targetSetupPage, #diggerAllocationPage) .target-back-button { flex: 0 0 40px; min-width: 40px; height: 40px; margin: 0; }
:is(#targetSetupPage, #diggerAllocationPage) .target-detail-heading-row { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 12px; }
:is(#targetSetupPage, #diggerAllocationPage) .target-detail-copy { min-width: 0; }
:is(#targetSetupPage, #diggerAllocationPage) .target-detail-heading-row h3 { display: block; font-size: 18px; line-height: 26px; white-space: normal; }
:is(#targetSetupPage, #diggerAllocationPage) .target-detail-title p { margin: 3px 0 0; font-size: 12px; line-height: 18px; }
:is(#targetSetupPage, #diggerAllocationPage) .target-detail-status { display: inline-flex; flex: 0 0 auto; vertical-align: middle; }
:is(#targetSetupPage, #diggerAllocationPage) .target-detail-status-pill { display: inline-flex; align-items: center; justify-content: center; gap: 7px; box-sizing: border-box; min-height: 32px; margin: 0; padding: 6px 10px; border: 1px solid #ead8c8; border-radius: 8px; background: #fdfaf6; color: #896a4d; font: inherit; font-size: 12px; font-weight: 600; line-height: 18px; white-space: nowrap; text-transform: none; }
:is(#targetSetupPage, #diggerAllocationPage) .target-detail-status-pill > .fa { display: inline-flex; align-items: center; justify-content: center; flex: 0 0 14px; width: 14px; height: 18px; margin: 0; font-size: 13px; line-height: 1; }
:is(#targetSetupPage, #diggerAllocationPage) .target-detail-status-count { margin-left: 3px; padding-left: 10px; border-left: 1px solid #f2b8c3; font-weight: 500; font-variant-numeric: tabular-nums; }
:is(#targetSetupPage, #diggerAllocationPage) .target-detail-status.is-failed .target-detail-status-pill { background: #fff3f5; border-color: #f5c5cf; color: #bf304d; cursor: pointer; }
:is(#targetSetupPage, #diggerAllocationPage) .target-detail-status.is-failed .target-detail-status-pill:hover { background: #ffe8ee; border-color: #e8a3b3; }
:is(#targetSetupPage, #diggerAllocationPage) .target-detail-status-pill:focus-visible { outline: 2px solid #bf304d; outline-offset: 3px; }
:is(#targetSetupPage, #diggerAllocationPage) .target-detail-status.is-completed .target-detail-status-pill { background: #eefcf5; border-color: #b8ead1; color: #14865b; }
:is(#targetSetupPage, #diggerAllocationPage) .target-detail-search { flex: 0 1 288px; min-width: 180px; width: 288px; height: 36px; margin: 0; border-radius: 10px; }
:is(#targetSetupPage, #diggerAllocationPage) .target-detail-search .form-control { min-width: 0; width: 100%; height: 34px; padding: 0 0 0 10px; font-size: 13px; background: transparent !important; }
:is(#targetSetupPage, #diggerAllocationPage) .target-detail-actions { display: flex; align-items: center; flex-wrap: wrap; gap: 10px; margin-left: auto; }
:is(#targetSetupPage, #diggerAllocationPage) .target-detail-actions .btn { display: inline-flex; align-items: center; justify-content: center; gap: 7px; height: 40px; margin: 0; padding: 0 16px; border: 1px solid #ead2ba; border-radius: 10px; font-size: 13px; font-weight: 600; white-space: nowrap; text-transform: none; box-shadow: none; }
:is(#targetSetupPage, #diggerAllocationPage) .target-detail-actions .target-clear-button { background: #fff; color: #806247; }
:is(#targetSetupPage, #diggerAllocationPage) .target-detail-actions .target-add-button,
:is(#targetSetupPage, #diggerAllocationPage) .target-detail-actions .target-add-button:hover,
:is(#targetSetupPage, #diggerAllocationPage) .target-detail-actions .target-add-button:focus,
:is(#targetSetupPage, #diggerAllocationPage) .target-detail-actions .target-add-button:active {
    background: #c67c39 !important;
    border-color: #c67c39 !important;
    color: #fff !important;
    display: inline-flex !important;
    opacity: 1 !important;
    visibility: visible !important;
}
:is(#targetSetupPage, #diggerAllocationPage) .target-detail-actions .target-add-button:hover,
:is(#targetSetupPage, #diggerAllocationPage) .target-detail-actions .target-add-button:focus,
:is(#targetSetupPage, #diggerAllocationPage) .target-detail-actions .target-add-button:active {
    background: #af682d !important;
    border-color: #af682d !important;
}
:is(#targetSetupPage, #diggerAllocationPage) .target-detail-actions .btn:disabled { opacity: .55; cursor: not-allowed; }
:is(#targetSetupPage, #diggerAllocationPage) .target-detail-page .target-validation-summary { flex-wrap: wrap; gap: 12px; min-height: 64px; margin-top: 26px; padding: 10px 14px; border-radius: 16px; background: #fff; }
:is(#targetSetupPage, #diggerAllocationPage) .target-detail-page .target-validation-tabs { flex-shrink: 0; min-height: 42px; border-radius: 12px; padding: 4px; }
:is(#targetSetupPage, #diggerAllocationPage) .target-detail-page .target-validation-tab { min-height: 34px; gap: 8px; padding: 0 12px; font-size: 13px; }
:is(#targetSetupPage, #diggerAllocationPage) .target-detail-page .target-validation-tab strong { font-size: 12px; }
:is(#targetSetupPage, #diggerAllocationPage) .target-detail-page .target-validation-summary > span { padding: 0; font-size: 12px; font-weight: 500; }
:is(#targetSetupPage, #diggerAllocationPage) .target-detail-page .target-validation-table { margin-top: 26px; border-radius: 16px !important; background: #fff; }
:is(#targetSetupPage, #diggerAllocationPage) .target-validation-table table { box-sizing: border-box; border: 0 !important; }
:is(#targetSetupPage, #diggerAllocationPage) .target-detail-page .target-validation-table .table-responsive { max-height: 420px; overflow: auto; scrollbar-width: thin; }
:is(#targetSetupPage, #diggerAllocationPage) .target-validation-table .dataTables_wrapper { min-height: 0; }
:is(#targetSetupPage, #diggerAllocationPage) .target-detail-page .target-validation-table thead th { position: sticky; top: 0; z-index: 1; height: auto; padding: 14px 18px; font-family: inherit !important; font-size: 12px !important; line-height: 18px; }
:is(#targetSetupPage, #diggerAllocationPage) .target-detail-page .target-validation-table tbody td { height: auto; padding: 14px 18px; font-family: inherit !important; font-size: 13px !important; }
:is(#targetSetupPage, #diggerAllocationPage) .target-validation-table td.dataTables_empty { background-image: none !important; height: 132px !important; min-width: 0 !important; padding: 28px 20px !important; color: #947d66 !important; text-align: center !important; vertical-align: middle !important; white-space: normal; }
:is(#targetSetupPage, #diggerAllocationPage) .target-detail-page .target-validation-footer { flex-wrap: wrap; gap: 8px; min-height: 56px; padding: 12px 20px; font-size: 12px; background: #fdfbf8; }
:is(#targetSetupPage, #diggerAllocationPage) .target-detail-page .target-validation-footer .btn-link { padding: 4px 0; font-size: 12px; }
#targetSetupPage .prerequisite-card .upload-area > span:first-child { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
#targetSetupPage .target-transfer-loader {
    align-items: center;
    color: #80532f;
    display: inline-flex;
    flex: 0 1 auto;
    gap: 7px;
    justify-content: center;
    margin-right: auto;
    min-width: 0;
    padding: 0 5px;
}
#targetSetupPage .target-transfer-loader[hidden] { display: none !important; }
#targetSetupPage .target-transfer-loader strong { font-size: 11px; font-weight: 700; line-height: 16px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
#targetSetupPage .target-transfer-spinner {
    animation: target-transfer-spin .75s linear infinite;
    border: 2px solid #f0ddca;
    border-radius: 50%;
    border-top-color: #c77834;
    display: block;
    flex: 0 0 16px;
    height: 16px;
    width: 16px;
}
@keyframes target-transfer-spin { to { transform: rotate(360deg); } }
#targetSetupPage .prerequisite-card .upload-area .target-error-link,
#targetSetupPage .prerequisite-card .upload-area .target-inserted-link { display: inline-flex; align-items: center; justify-content: center; gap: 5px; flex-shrink: 0; margin: 0; padding: 5px 10px; border-radius: 7px; font: inherit; font-size: 11px; cursor: pointer; white-space: nowrap; }
#targetSetupPage .target-error-link:hover { background: #ffe5eb; }
#targetSetupPage .target-inserted-link:hover { background: #d7f7e8; }
#targetSetupPage .upload-area .target-error-link, #targetSetupPage .upload-area .target-inserted-link { min-height: 30px; line-height: 16px; vertical-align: middle; }
#targetSetupPage .upload-area .target-error-link > .fa-eye, #targetSetupPage .upload-area .target-inserted-link > .fa-eye { display: inline-flex; align-items: center; justify-content: center; flex: 0 0 14px; width: 14px; height: 16px; margin: 0; padding: 0; position: static; transform: none; font-size: 12px; line-height: 1; }
#targetRecordForm.target-plan-dialog { width: 960px; }
#targetRecordForm.target-plan-dialog .target-record-fields { grid-template-columns: repeat(3, minmax(0, 1fr)); }
#targetRecordForm.target-plan-dialog .target-record-fields > label:last-child:nth-child(odd) { grid-column: auto; }
#targetRecordForm.target-plan-dialog input[readonly] { background: #faf8f5; color: #806d59; }
#targetRecordForm.target-plan-dialog .target-record-section { grid-column: 1 / -1; margin: 8px 0 0; padding-bottom: 9px; border-bottom: 1px solid #eee4da; font-size: 13px; font-weight: 700; color: #806447; }
@media (max-width: 800px) { #targetRecordForm.target-plan-dialog .target-record-fields { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 540px) { #targetRecordForm.target-plan-dialog .target-record-fields { grid-template-columns: minmax(0, 1fr); } }
#targetSetupPage .target-error-link:focus-visible, #targetSetupPage .target-inserted-link:focus-visible, #targetSetupPage .target-detail-actions .btn:focus-visible { outline: 2px solid #c67c39; outline-offset: 3px; }
@media (max-width: 1100px) {
    #targetSetupPage .target-detail-title { flex-basis: 100%; }
    #targetSetupPage .target-detail-search { flex: 1 1 200px; }
}
@media (max-width: 575px) {
    #targetSetupPage .target-detail-header { padding: 16px; }
    #targetSetupPage .target-detail-search { flex-basis: 100%; }
    #targetSetupPage .target-detail-actions { width: 100%; }
    #targetSetupPage .target-detail-actions .btn { flex: 1; padding: 0 10px; }
}

/* Keep the Hauler Run Allocation action visible above legacy button hover rules. */
#haulerAllocationPage .hauler-filter-card #runHaulerAutoAllocation:hover,
#haulerAllocationPage .hauler-filter-card #runHaulerAutoAllocation:focus,
#haulerAllocationPage .hauler-filter-card #runHaulerAutoAllocation:focus-visible,
#haulerAllocationPage .hauler-filter-card #runHaulerAutoAllocation:active {
    background-color: #ca7a37 !important;
    border-color: #ca7a37 !important;
    color: #fff !important;
    filter: none !important;
    opacity: 1 !important;
    transform: none !important;
    visibility: visible !important;
    -webkit-text-fill-color: #fff !important;
}

#haulerAllocationPage .hauler-filter-card #runHaulerAutoAllocation:hover .run-allocation-icon,
#haulerAllocationPage .hauler-filter-card #runHaulerAutoAllocation:focus .run-allocation-icon,
#haulerAllocationPage .hauler-filter-card #runHaulerAutoAllocation:active .run-allocation-icon {
    opacity: 1 !important;
    stroke: currentColor !important;
    visibility: visible !important;
}


/* Shift Execution pages */
/* Trip Sense: shared Events and Log presentation. */
body.trip-sense-page .execution-page { padding:24px 28px 36px; }
body.trip-sense-page .execution-tabs { gap:0; padding:0; margin:0 0 28px; border:0; border-bottom:1px solid #eadfd3; border-radius:0; background:transparent; }
body.trip-sense-page .execution-tabs a { display:inline-flex; align-items:center; gap:10px; min-width:122px; justify-content:center; padding:14px 24px; margin-bottom:-1px; border-bottom:2px solid transparent; border-radius:0; color:#9f9284; background:transparent; font-weight:500; }
body.trip-sense-page .execution-tabs a.active { color:#c27a3f; border-bottom-color:#c27a3f; background:transparent; }
.trip-sense-page .execution-tabs a:hover { color:#ac682f; background:#fffaf3; }
.trip-sense-summary, .trip-sense-log-summary { display:grid; grid-template-columns:repeat(6,minmax(0,1fr)); gap:18px; margin-bottom:28px; }
.trip-sense-log-summary { grid-template-columns:repeat(3,minmax(0,1fr)); }
.trip-state-card { background:#fff; border:1px solid #eadfd3; border-radius:18px; min-height:114px; padding:18px; color:#182334; }
.trip-state-card .trip-stat-label { display:block; color:#a49382; font-size:10px; font-weight:600; letter-spacing:.5px; line-height:1.5; text-transform:uppercase; }
.trip-state-card strong { display:block; font-size:24px; line-height:1.2; font-weight:750; margin:7px 0 12px; }
.trip-state-card small { display:block; font-size:10px; line-height:1.4; color:#a49382; }
.trip-state-card.trip strong, .trip-state-card.trip .trip-stat-label { color:#315dff; }
.trip-state-card.loading strong, .trip-state-card.loading .trip-stat-label { color:#9800ff; }
.trip-state-card.hauling strong { color:#b45b00; }
.trip-state-card.hauling .trip-stat-label { color:#ef8500; }
.trip-state-card.dumping strong, .trip-state-card.dumping .trip-stat-label { color:#eb0046; }
.trip-state-card.return strong { color:#00886c; }
.trip-state-card.return .trip-stat-label { color:#00af84; }
.trip-sense-panel { background:#fff; border:1px solid #eadfd3; border-radius:18px; overflow:hidden; }
.trip-sense-toolbar { display:flex; align-items:center; gap:14px; padding:18px; background:#fcfaf8; border-bottom:1px solid #eadfd3; }
.trip-sense-search { display:flex; align-items:center; gap:10px; width:360px; max-width:100%; margin:0; min-height:34px; padding:0 13px; background:#fff; border:1px solid #eadfd3; border-radius:12px; color:#ab9a87; }
.trip-sense-page .execution-page .trip-sense-search input { background:transparent; border:0; outline:0; width:100%; min-width:0; padding:7px 0; font-size:13px; color:#182334; border-radius:0; box-shadow:none; }
.trip-sense-page input::placeholder { color:#9a9fa5; opacity:1; }
.trip-sense-btn { display:inline-flex; align-items:center; justify-content:center; gap:8px; min-height:34px; padding:7px 14px; font:inherit; font-size:13px; line-height:18px; color:#796b5d; background:#fff; border:1px solid #eadfd3; border-radius:12px; cursor:pointer; white-space:nowrap; }
.trip-sense-btn:hover:not(:disabled) { background:#fff8ee; border-color:#d2ad87; }
.trip-sense-btn:disabled { opacity:.45; cursor:default; }
.trip-sense-export { margin-left:auto; color:#365b75; }
.trip-sense-export i { color:#00aa78; }
.trip-sense-filters { display:grid; grid-template-columns:repeat(5,minmax(0,1fr)); gap:14px; padding:18px; border-bottom:1px solid #f2ece6; background:#fff; }
.trip-sense-filters label { margin:0; color:#a49382; font-weight:500; font-size:11px; letter-spacing:.4px; min-width:0; }
.trip-sense-filters select, .trip-sense-page .execution-page .trip-sense-filters input { display:block; width:100%; min-width:0; height:30px; margin-top:7px; padding:4px 10px; font:inherit; font-size:13px; letter-spacing:normal; line-height:20px; color:#182334; background:#fff; border:1px solid #eadfd3; border-radius:8px; box-shadow:none; }
.trip-sense-status { display:flex; align-items:center; gap:12px; padding:16px 18px; color:#806e5e; background:#fffaf2; }
.trip-sense-status.is-error { background:#fff5f6; color:#b52242; }
.trip-sense-status[hidden], .trip-sense-status button[hidden] { display:none; }
.trip-sense-table-scroll, .trip-sense-table-wrap { overflow-x:auto; }
.trip-sense-events-table { width:100%; min-width:830px; border-collapse:collapse; table-layout:auto; }
.trip-sense-page .execution-page .trip-sense-events-table thead th { padding:16px 26px; color:#9b8b7c; background:#faf8f5; font-size:12px; font-weight:600; border-bottom:1px solid #eadfd3; white-space:nowrap; }
.trip-sense-events-table th button { display:flex; align-items:center; justify-content:space-between; gap:14px; border:0; padding:0; width:100%; background:transparent; color:inherit; font:inherit; letter-spacing:inherit; text-align:left; cursor:pointer; }
.trip-sense-events-table th i { color:#d3bdab; }
.trip-sense-events-table th[aria-sort=ascending] i { transform:rotate(180deg); color:#c27a3f; }
.trip-sense-events-table th[aria-sort=descending] i { color:#c27a3f; }
.trip-sense-page .execution-page .trip-sense-events-table tbody td { padding:14px 26px; height:51px; font-size:13px; vertical-align:middle; border:0; background:#fff; }
.trip-sense-events-table tbody tr:hover td { background:#fdfbf8 !important; }
.trip-sense-events-table td:nth-child(3) { width:24%; }
.trip-sense-time-cell { white-space:nowrap; color:#57616b; }
.trip-sense-time-cell i { margin-right:10px; color:#ac9c89; }
.trip-sense-equipment-no { color:#c27a3f; font-weight:700; white-space:nowrap; }
.trip-equipment-type { display:block; margin-top:3px; color:#a49382; font-size:10px; }
.trip-state-pill { display:inline-flex; align-items:center; gap:7px; padding:4px 10px; border:1px solid #e4dfd8; border-radius:7px; font-size:10px; line-height:15px; white-space:nowrap; color:#796b5d; background:#faf8f5; }
.trip-state-pill.trip { color:#315dff; border-color:#c8d7ff; background:#f1f6ff; }
.trip-state-pill.loading { color:#9800ff; border-color:#e6d1ff; background:#faf5ff; }
.trip-state-pill.hauling { color:#ef8500; border-color:#ffe2a6; background:#fffbef; }
.trip-state-pill.dumping { color:#eb0046; border-color:#ffd0dc; background:#fff4f7; }
.trip-state-pill.return { color:#00a879; border-color:#bdeedc; background:#eefff7; }
.trip-material-pill, .trip-sense-material-pill { display:inline-block; padding:3px 8px; border-radius:4px; background:#fff4c7; color:#92591d; font-size:12px; line-height:16px; }
.trip-material-pill.waste, .trip-sense-material-pill.waste { color:#726457; background:#f2efec; }
.trip-sense-page .trip-empty { text-align:center; padding:40px 20px !important; color:#9c8a79; }
.trip-sense-pager { display:flex; justify-content:space-between; align-items:center; gap:12px; padding:16px 18px; border-top:1px solid #f2ece6; font-size:12px; color:#938373; }
.trip-sense-pager > div { display:flex; align-items:center; gap:12px; flex-wrap:wrap; }
.trip-sense-pager label { display:flex; align-items:center; gap:8px; font-weight:400; margin:0; }
.trip-sense-pager select { min-height:32px; border:1px solid #eadfd3; border-radius:8px; padding:4px 8px; background:#fff; }
.trip-sense-page #tripSenseLogTable { width:100% !important; min-width:1960px; margin:0 !important; border-collapse:collapse !important; }
.trip-sense-page #tripSenseLogTable th { white-space:nowrap; padding:16px; }
.trip-sense-page #tripSenseLogTable td { padding:16px; border-bottom:1px solid #f4eee8; font-size:13px; background:#fff; }
.trip-sense-page #tripSenseLogTable th:first-child, .trip-sense-page #tripSenseLogTable td:first-child { width:50px; text-align:center; }
.trip-sense-page .trip-sense-digger-cell, .trip-sense-page .trip-sense-hauler-cell { color:#c27a3f; font-weight:600; white-space:nowrap; }
.trip-sense-page .trip-sense-log-map-btn { display:inline-flex; justify-content:center; align-items:center; width:28px; height:28px; padding:0; border:1px solid #eadfd3; border-radius:8px; background:#faf8f5; color:#b07443; cursor:pointer; }
.trip-sense-page #tripSenseLogTable_wrapper .dataTables__top { display:none; }
.trip-sense-page #tripSenseLogTable_wrapper .dataTables__bottom { display:flex; justify-content:space-between; align-items:center; flex-wrap:wrap; gap:14px; padding:16px 18px; background:#fff; border-top:1px solid #eadfd3; }
.trip-sense-page #tripSenseLogTable_wrapper .dataTables_info { color:#938373; font-size:12px; padding:0; }
.trip-sense-page #pager_container { display:flex; align-items:center; gap:10px; margin:0; font-size:12px; color:#938373; }
.trip-sense-page #pager_container select, .trip-sense-page #pager_container input, .trip-sense-page #pager_container button { border:1px solid #eadfd3; border-radius:8px; min-height:32px; padding:5px 9px; color:#796b5d; background:#fff; }
.trip-sense-page #pager_txt_currentpage { width:54px; }
.trip-sense-page #pager_container button:disabled { opacity:.4; }
@media(max-width:1250px) { .trip-sense-summary { grid-template-columns:repeat(3,minmax(0,1fr)); } .trip-sense-filters { grid-template-columns:repeat(3,minmax(0,1fr)); } }
@media(max-width:650px) { .trip-sense-page .execution-page { padding:16px 12px 30px; } .trip-sense-summary, .trip-sense-log-summary { grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px; margin-bottom:20px; } .trip-state-card { padding:15px; } .trip-sense-filters { grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; padding:14px; } .trip-sense-toolbar { flex-wrap:wrap; padding:14px; gap:10px; } .trip-sense-search { width:100%; } .trip-sense-pager { align-items:flex-start; flex-direction:column; } .trip-sense-page .execution-tabs a { min-width:110px; } }

/* The host theme styles all sections, search inputs, and DataTables. Keep the Trip Sense panels self-contained. */
body.trip-sense-page .execution-page section.trip-sense-events,
body.trip-sense-page .execution-page section.trip-sense-logs { padding:0; position:static; }
body.trip-sense-page .execution-page .trip-sense-search input[type=search] { background:transparent; border:0; outline:0; width:100%; min-width:0; padding:7px 0; border-radius:0; box-shadow:none; }
body.trip-sense-page .execution-page .trip-sense-filters label { color:#9b8b7c !important; font-size:11px !important; font-weight:500 !important; }
body.trip-sense-page .execution-page .trip-sense-btn { height:34px; min-height:34px; padding:7px 14px; border:1px solid #eadfd3 !important; border-radius:10px !important; background:#fff !important; color:#796b5d !important; font-weight:500; }
body.trip-sense-page .execution-page #tripSenseLogTable { min-width:1960px; width:100% !important; border-collapse:collapse; }
body.trip-sense-page .execution-page #tripSenseLogTable_wrapper { padding:0; border:0; border-radius:0; overflow:visible; font-family:inherit; }
body.trip-sense-page .execution-page #tripSenseLogTable thead th { background:#fffaf5 !important; color:#8c7a68 !important; padding:16px !important; border:0 !important; border-bottom:1px solid #eadfd3 !important; font-family:inherit !important; font-size:12px !important; font-weight:600 !important; line-height:1.4 !important; letter-spacing:.3px; text-transform:none; white-space:nowrap; vertical-align:middle; }
body.trip-sense-page .execution-page #tripSenseLogTable tbody td { background:#fff !important; padding:14px 16px !important; border:0 !important; border-bottom:1px solid #f2ede7 !important; color:#182334; font-size:13px; line-height:1.4; vertical-align:middle; white-space:nowrap; }
body.trip-sense-page .execution-page #tripSenseLogTable tbody td { font-family:inherit !important; }
body.trip-sense-page .execution-page #tripSenseLogTable thead th::before { display:none !important; }
body.trip-sense-page .execution-page #tripSenseLogTable thead th.sorting::after { content:'⌄' !important; font:14px Arial,sans-serif !important; opacity:.65 !important; }
body.trip-sense-page .execution-page #tripSenseLogTable thead th.sorting_asc::after { content:'⌃' !important; font:14px Arial,sans-serif !important; opacity:1 !important; }
body.trip-sense-page .execution-page #tripSenseLogTable thead th.sorting_desc::after { content:'⌄' !important; font:14px Arial,sans-serif !important; opacity:1 !important; }
body.trip-sense-page .execution-page #tripSenseLogTable tbody tr:hover td { background:#fffdf9 !important; }
body.trip-sense-page .execution-page #tripSenseLogTable .trip-sense-digger-cell,
body.trip-sense-page .execution-page #tripSenseLogTable .trip-sense-hauler-cell { color:#c27a3f; font-weight:650; }
body.trip-sense-page .execution-page #tripSenseLogTable_wrapper .dataTables__bottom { display:flex; justify-content:space-between; align-items:center; flex-wrap:wrap; gap:14px; padding:16px 18px; background:#fff; border-top:1px solid #eadfd3; }
@media(max-width:650px) { body.trip-sense-page .execution-page { padding:16px 12px 30px; } }

/* Shared shift execution layout */
body.shift-execution { --execution-accent:#c27a3f; --execution-border:#eadfd3; --execution-ink:#182334; background:#faf8f5; }
.shift-execution #base, .shift-execution #content { background:#faf8f5; }
.shift-execution .execution-page { padding:20px 22px 36px; color:var(--execution-ink); }
.shift-execution .execution-content { min-height:240px; }
.shift-execution .execution-status { border:1px solid var(--execution-border); background:#fff; padding:18px 22px; border-radius:14px; margin-bottom:18px; color:#746658; }
.shift-execution .execution-error { color:#ad2542; border-color:#f1bcc7; background:#fff7f8; }
.execution-empty-state { display:flex; flex-direction:column; align-items:center; justify-content:center; gap:8px; min-height:160px; padding:28px 20px; color:#8d7b6b; text-align:center; width:100%; margin:0 auto; }
.execution-empty-state .material-icons { width:42px; height:42px; padding:10px; border-radius:50%; background:#fff4e8; color:#c27a3f; font-size:22px; margin:0 auto 4px auto; display:inline-flex; align-items:center; justify-content:center; }
.execution-empty-state strong { color:#554637; font-size:14px; display:block; width:100%; margin:4px 0 2px 0; }
.execution-empty-state span { max-width:460px; font-size:12px; line-height:1.55; display:block; margin:0 auto; color:#8d7b6b; }
.shift-execution .execution-no-context { visibility:hidden; height:0; min-height:0; overflow:hidden; }
/* Flat underline tabs, matching the Equipment page's own .equipment-tabs treatment
   (and Trip Sense's page-specific override below) instead of a filled pill card. */
.shift-execution .execution-tabs { display:flex; flex-wrap:wrap; gap:6px 24px; padding:0; margin:0 0 24px; border:0; border-bottom:1px solid var(--execution-border); border-radius:0; background:transparent; }
.shift-execution .execution-tabs a { display:inline-flex; align-items:center; gap:8px; padding:12px 2px; border:0; border-bottom:2px solid transparent; border-radius:0; color:#968777; text-decoration:none; font-weight:600; font-size:13px; line-height:1.4; background:transparent; }
.shift-execution .execution-tabs a .material-icons { font-size:19px; color:inherit; }
.shift-execution .execution-tabs a:hover { background:transparent; color:var(--execution-accent); border-bottom-color:#d8b797; }
.shift-execution .execution-tabs a.active:hover { background:transparent; color:var(--execution-accent); border-bottom-color:var(--execution-accent); }
.shift-execution .execution-tabs a.active { background:transparent; color:var(--execution-accent); border-bottom-color:var(--execution-accent); }
.shift-execution .execution-child-tabs { background:transparent; border:0; padding:0; }
.shift-execution .execution-child-tabs a.active { background:#f4e6d7; color:#8f511d; }
.shift-execution .execution-child-tabs a.active:hover { background:#f4e6d7; color:#8f511d; }
.shift-execution .execution-page .card { border:1px solid var(--execution-border); border-radius:16px; box-shadow:none; overflow:visible; background:#fff; }
.shift-execution .execution-page .card-head { border-radius:16px 16px 0 0; }
.shift-execution .execution-page table { color:var(--execution-ink); }
.shift-execution .execution-page table thead th { background:#fbf9f6; border-bottom:1px solid var(--execution-border); color:#8c7a68; font-size:12px; letter-spacing:.3px; padding:17px 15px; }
.shift-execution .execution-page table tbody td { border-color:#f2ede7; padding:16px 15px; vertical-align:middle; }
.shift-execution .execution-page .btn-primary, .shift-execution .dw-apply-btn { background:var(--execution-accent); border-color:var(--execution-accent); border-radius:10px; }
.shift-execution .execution-page .btn-primary:hover, .shift-execution .dw-apply-btn:hover { background:#aa642f; border-color:#aa642f; color:#fff; }
.shift-execution .execution-page .form-control { border-radius:9px; }
.shift-execution .execution-page input[type=search] { background:#faf8f5; border:1px solid var(--execution-border); border-radius:10px; padding:8px 12px; }
.shift-execution .execution-infrastructure .tenantSection { padding:0 22px; max-width:330px; }
.shift-execution .execution-summary { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:18px; margin:0 0 24px; }
.shift-execution .execution-metric { min-height:124px; background:#fff; border:1px solid var(--execution-border); border-radius:16px; padding:20px; }
.shift-execution .execution-metric-label { display:block; color:#948373; font-size:12px; font-weight:600; margin-bottom:14px; }
.shift-execution .execution-metric-value { font-size:29px; line-height:1.25; font-weight:700; color:var(--execution-ink); }
.shift-execution .execution-metric-unit { margin-left:6px; font-size:12px; color:#948373; }
.shift-execution .execution-metric-note { display:block; margin-top:8px; font-size:11px; color:#948373; }
.shift-execution .execution-metric-negative .execution-metric-value { color:#e80046; }
.shift-execution .execution-monitor { width:100%; height:calc(100vh - 185px); border:1px solid var(--execution-border); border-radius:16px; background:#fff; }
.shift-execution .execution-page .assignment-container { gap:20px; }
.shift-execution .execution-page .machine-card { border-radius:20px; box-shadow:none; }
.shift-execution .mainSideMenu .Shift_execution_ > a { background:var(--execution-accent); color:#fff; border-radius:12px; }
.shift-execution .mainSideMenu .Shift_execution_ .menu-dropdown a.active { background:#fff8ec; color:var(--execution-accent); border-radius:12px; }
.shift-execution .execution-page a:focus-visible, .shift-execution .execution-page button:focus-visible { outline:2px solid var(--execution-accent); outline-offset:3px; }
.shift-execution .execution-section-title { font-size:18px; margin:0 0 12px; }
.shift-execution [data-page="People"] > .execution-content > .card { background:transparent; border:0; padding:0 !important; }
.shift-execution #execution-people-summary { grid-template-columns:repeat(2,minmax(0,1fr)); }
.shift-execution #execution-equipment-summary { grid-template-columns:repeat(3,minmax(0,1fr)); }
.shift-execution .execution-personnel { display:block; width:100% !important; border:0; }
.shift-execution .execution-personnel thead { display:none; }
.shift-execution .execution-personnel tbody { display:flex; flex-direction:column; gap:15px; }
.shift-execution .execution-personnel tbody tr { display:grid; grid-template-columns:100px minmax(220px,2fr) minmax(120px,1fr) minmax(145px,1fr) auto; align-items:center; padding:18px 12px; border:1px solid var(--execution-border); border-left:4px solid var(--execution-accent); border-radius:17px; background:#fff; }
.shift-execution .execution-personnel tbody td { display:block; border:0; white-space:normal; padding:8px 12px; min-width:0; }
.shift-execution .execution-personnel tbody td:before { content:attr(data-label); display:block; color:#9c8a79; font-size:10px; margin-bottom:6px; font-weight:500; }
.shift-execution .execution-personnel tbody td:nth-child(5), .shift-execution .execution-personnel tbody td:nth-child(6), .shift-execution .execution-personnel tbody td:nth-child(7) { display:none; }
.shift-execution .execution-personnel .disp_image { width:44px !important; height:44px !important; }
.shift-execution .execution-personnel tbody td:nth-child(2) { font-weight:600; font-size:14px; }
.shift-execution .execution-personnel .dataTables_empty { grid-column:1 / -1; }
.shift-execution .execution-page .dataTables__top { display:flex; flex-wrap:wrap; align-items:center; gap:12px; padding:15px; margin-bottom:18px; border:1px solid var(--execution-border); background:#fff; border-radius:14px; }
.shift-execution .execution-page .dashboard-container { border-radius:16px; }
.shift-execution .execution-page .routes-section-header { background:#fffaf4; }
@media(max-width:1100px) { .shift-execution .execution-personnel tbody tr { grid-template-columns:100px minmax(200px,2fr) 1fr; } }
@media(max-width:650px) { .shift-execution .execution-personnel tbody tr { grid-template-columns:1fr 2fr; } .shift-execution #execution-equipment-summary { grid-template-columns:1fr; } }
@media(max-width:1000px) { .shift-execution .execution-summary { grid-template-columns:repeat(2,minmax(0,1fr)); } }
@media(max-width:600px) { .shift-execution .execution-page { padding:12px 8px 24px; } .shift-execution .execution-summary { gap:10px; } .shift-execution .execution-metric { padding:14px; } .shift-execution .execution-metric-value { font-size:23px; } .shift-execution .execution-tabs { gap:2px 12px; } .shift-execution .execution-tabs a { padding:10px 2px; font-size:12px; } }


	/* ===== Redesigned Assignment header filters (chips + Filters popup) ===== */
	.shift-execution .dw-header-filters {
		display: flex;
		align-items: center;
		justify-content: flex-end;
		flex-wrap: nowrap;
		gap: 10px;
		position: relative;
		min-width: 0;
		flex: 0 1 auto;
		margin-left: auto;
	}

	.shift-execution .dw-active-chips {
		display: flex;
		align-items: center;
		flex-wrap: wrap;
		gap: 8px;
		justify-content: flex-end;
	}

	.shift-execution .dw-chip {
		display: inline-flex;
		align-items: center;
		gap: 6px;
		min-height: 32px;
		padding: 5px 10px 5px 12px;
		box-sizing: border-box;
		font-size: 12px;
		font-weight: 500;
		line-height: 20px;
		color: #B57423;
		background: #fff9f3;
		border: 1px solid #ead4bb;
		border-radius: 8px;
		white-space: nowrap;
	}

	.shift-execution .dw-chip__x {
		display: inline-flex;
		align-items: center;
		justify-content: center;
		flex: 0 0 16px;
		width: 16px;
		height: 16px;
		margin: 0;
		padding: 0;
		cursor: pointer;
		font-size: 14px;
		font-family: Arial, sans-serif;
		font-weight: 400;
		font-style: normal;
		line-height: 16px;
		vertical-align: middle;
		border: 0;
		border-radius: 0;
		background: transparent;
		opacity: 0.75;
	}

	.shift-execution .dw-chip:hover {
		color: #B57423;
		background: #fff9f3;
		border-color: #ead4bb;
	}

	.shift-execution .dw-chip__x:hover,
	.shift-execution .dw-chip__x:focus {
		color: inherit;
		background: transparent;
		border: 0;
		outline: 0;
		opacity: 1;
	}

	.shift-execution .dw-chip-clear {
		border: none;
		background: transparent;
		color: #6c757d;
		font-size: 12px;
		font-weight: 600;
		cursor: pointer;
		padding: 4px 4px;
	}

	.shift-execution .dw-chip-clear:hover { color: #B57423; text-decoration: underline; }

	.shift-execution .dw-header-filters .dw-filters-toggle {
		display: inline-flex;
		align-items: center;
		justify-content: center;
		gap: 6px;
		min-height: 40px;
		padding: 8px 14px;
		box-sizing: border-box;
		font-size: 13px;
		font-weight: 600;
		line-height: 20px;
		color: #B57423;
		background: #fffaf5;
		border: 1px solid #ead4bb;
		border-radius: 8px;
		box-shadow: none;
		outline: none;
		cursor: pointer;
		white-space: nowrap;
	}

	.shift-execution .dw-header-filters .dw-filters-toggle:hover,
	.shift-execution .dw-header-filters .dw-filters-toggle:focus,
	.shift-execution .dw-header-filters .dw-filters-toggle:active {
		background: #fffaf5 !important;
		border: 1px solid #d69a55 !important;
		color: #B57423 !important;
		box-shadow: none !important;
		outline: none !important;
	}

	.shift-execution .dw-filters-toggle svg { flex: 0 0 auto; }

	/* Popup panel — fixed so it floats above the header instead of being
	   clipped by the header's overflow (which caused the header scrollbar). */
	.shift-execution .dw-filters-panel {
		position: fixed;
		top: 64px;
		right: 16px;
		z-index: 20000;
		width: 320px;
		max-width: 90vw;
		background: #fff;
		border: 1px solid var(--execution-border);
		border-radius: 16px;
		box-shadow: 0 12px 32px rgba(74, 53, 34, 0.14);
		display: none;
		padding: 0;
	}

	.shift-execution .dw-filters-panel:not([hidden]) { display: block; }
.shift-execution .dw-filters-panel[hidden] { display: none !important; }

	.shift-execution .dw-filters-panel__head {
		display: flex;
		align-items: center;
		justify-content: space-between;
		padding: 22px 18px 12px;
		font-size: 13px;
		font-weight: 600;
		color: var(--execution-ink);
	}

	.shift-execution .dw-filters-panel__close {
		border: none;
		background: transparent;
		font-size: 20px;
		line-height: 1;
		color: #856b55;
		width: 24px;
		height: 24px;
		padding: 0;
		cursor: pointer;
	}

	.shift-execution .dw-filters-panel__close:hover { color: #372C2E; }

	.shift-execution .dw-filters-panel__body {
		padding: 14px 18px;
		max-height: 60vh;
		overflow-y: auto;
	}

	.shift-execution .dw-field { margin-bottom: 18px; }
	.shift-execution .dw-field:last-child { margin-bottom: 0; }
	.shift-execution .dw-field[hidden] { display: none !important; }
	.shift-execution .dw-field:has(+ .dw-field[hidden]:last-child) { margin-bottom: 0; }

	.shift-execution .dw-field label {
		display: block;
		margin-bottom: 8px;
		font-size: 13px;
		font-weight: 500;
		letter-spacing: normal;
		text-transform: capitalize;
		/* design's muted slate label colour */
		color: #64748b;
	}

	.shift-execution .dw-field .form-control,
	.shift-execution .dw-field select {
		width: 100%;
		border: 1px solid var(--execution-border);
		border-radius: 8px;
		background: #fff;
		color: #372C2E;
		height: 38px;
	}

	/* placeholder / "All ..." resting text in the design reads as a soft grey */
	.shift-execution .dw-field .select2-selection__placeholder,
	.shift-execution .dw-field .select2-selection__rendered {
		color: #6b7280 !important;
	}
	/* keep the select2 controls aligned with the design's rounded light inputs */
	.shift-execution .dw-field .select2-container--default .select2-selection--single {
		border: 1px solid var(--execution-border);
		border-radius: 8px;
		height: 38px;
	}
	.shift-execution .dw-field .select2-container--default .select2-selection--single .select2-selection__rendered {
		line-height: 38px;
	}
	.shift-execution .dw-field .select2-container--default .select2-selection--single .select2-selection__arrow {
		display: block !important;
		height: 36px !important;
		right: 6px;
	}
	.shift-execution .dw-field .select2-container--default .select2-selection--single .select2-selection__arrow b {
		background: none;
		border-color: #8f8b86 transparent transparent;
		border-style: solid;
		border-width: 5px 4px 0;
	}

	.shift-execution .dw-filters-panel__foot {
		display: flex;
		align-items: center;
		justify-content: space-between;
		gap: 12px;
		padding: 12px 18px 18px;
	}

	.shift-execution .dw-clear-btn {
		min-height: 42px;
		padding: 9px 14px;
		border: 1px solid var(--execution-border);
		border-radius: 8px;
		background: #fff;
		color: #856b55;
		font-size: 13px;
		cursor: pointer;
	}
	.shift-execution .dw-clear-btn:hover { background: #faf8f5; }
	.shift-execution .dw-filters-panel button:focus-visible { outline: 2px solid var(--execution-accent); outline-offset: 2px; }

	.shift-execution .dw-apply-btn {
		border: none;
		background: var(--execution-accent);
		color: #fff;
		min-height: 42px;
		font-size: 13px;
		font-weight: 600;
		padding: 9px 18px;
		border-radius: 8px;
		cursor: pointer;
	}

	.shift-execution .dw-filters-panel .dw-apply-btn:hover,
	.shift-execution .dw-filters-panel .dw-apply-btn:focus,
	.shift-execution .dw-filters-panel .dw-apply-btn:active {
		background: #ab6631 !important;
		border: none !important;
		color: #fff !important;
		box-shadow: none !important;
		outline: none !important;
	}



/* Use the same header pills and typography as _ShiftPlanLayout. */
.shift-execution #header { height: auto; min-height: 64px; }
.shift-execution .page-header-box.execution-header-host { overflow: visible; gap: 10px; }
.shift-execution .execution-header-host > .theme-tab { display: none; }
.shift-execution .execution-header { min-width: 0; }
.shift-execution .execution-header .target-title { white-space: nowrap; flex: 0 0 auto; font-size: 20px; line-height: 30px; }
.shift-execution .execution-header .header-filter { flex-shrink: 0; }
.shift-execution .execution-header .shift-plan-date-filter input { color: #25211d; font-size: 13px; font-weight: 600; padding: 0; }
.shift-execution .execution-header .dw-header-filters { flex: 1 1 200px; min-width: 0; max-width: 100%; }
.shift-execution .execution-header .dw-active-chips { flex:1 1 auto; flex-wrap:wrap; overflow:visible; max-width:none; min-width:0; justify-content:flex-end; }
.shift-execution .dw-chip { flex:0 0 auto; max-width:none; }
.shift-execution .dw-chip-label { overflow:visible; text-overflow:clip; }
.shift-execution .dw-chip__x { color: inherit; }
.shift-execution .dw-filters-toggle .material-icons { font-size: 18px; }
.shift-execution .dw-header-filters .dw-filters-toggle { min-height: 34px; padding: 5px 12px; flex: 0 0 auto; }
.shift-execution .dw-filters-panel { overflow-y: auto; }
.shift-execution .dw-filters-panel__body { max-height: none; overflow: visible; }
.shift-execution .dw-field .select2-container { width: 100% !important; }
.shift-execution.menubar-hoverable.header-fixed #base { padding-top: var(--execution-header-height, 80px) !important; }
@media (max-width: 900px) {
    .shift-execution .execution-header .dw-header-filters { flex-basis: 100%; width: 100%; }
    .shift-execution .execution-header .dw-active-chips { max-width: none; flex: 1; justify-content: flex-start; }
}
@media (max-width: 480px) {
    .shift-execution .execution-header .target-title { width: 100%; }
}

/* Equipment: shared execution header, underline navigation and fleet tables. */
.shift-execution [data-page="Equipment"] .execution-tabs { background:transparent; border:0; border-bottom:1px solid #eadfd3; border-radius:0; padding:0; gap:20px; margin-bottom:28px; }
.shift-execution [data-page="Equipment"] .execution-tabs a { display:inline-flex; align-items:center; gap:9px; padding:16px 20px; border-radius:0; border-bottom:2px solid transparent; background:transparent; color:#968777; }
.shift-execution [data-page="Equipment"] .execution-tabs a.active { color:#c27a3f; border-bottom-color:#c27a3f; background:transparent; }
.shift-execution [data-page="Equipment"] .execution-tabs i { font-size:20px; }
.shift-execution [data-page="Equipment"] #execution-equipment-summary { grid-template-columns:repeat(4,minmax(0,1fr)); gap:18px; margin-bottom:26px; }
.shift-execution [data-page="Equipment"] .execution-metric { position:relative; min-height:106px; padding:19px; border-radius:15px; }
.shift-execution [data-page="Equipment"] .execution-metric-label { padding-left:28px; margin-bottom:9px; font-size:12px; }
.shift-execution [data-page="Equipment"] .equipment-metric-icon { position:absolute; top:18px; left:19px; font-size:19px; color:#7560ff; }
.shift-execution [data-page="Equipment"] .execution-metric:nth-child(2) .equipment-metric-icon { color:#00ad80; }
.shift-execution [data-page="Equipment"] .execution-metric:nth-child(3) .equipment-metric-icon { color:#e94872; }
.shift-execution [data-page="Equipment"] .execution-metric:nth-child(4) .equipment-metric-icon { color:#df9800; }
.shift-execution [data-page="Equipment"] .execution-metric-value { font-size:28px; }
.shift-execution [data-page="Equipment"] .card { padding:0 !important; overflow:hidden; }
.shift-execution [data-page="Equipment"] .card-body,
.shift-execution [data-page="Equipment"] .dependentContainerBodyParent,
.shift-execution [data-page="Equipment"] .col-12 { padding:0 !important; margin:0 !important; }
.shift-execution [data-page="Equipment"] .dataTables_wrapper { border:1px solid #eadfd3; border-radius:16px; overflow:hidden; background:#fff; }
.shift-execution [data-page="Equipment"] .dataTables__top { border:0; border-bottom:1px solid #f2ede7; border-radius:0; margin:0; padding:22px 24px; justify-content:flex-end; }
.shift-execution [data-page="Equipment"] .dataTables__top .input-group { max-width:320px; border:1px solid #eadfd3; border-radius:12px; padding:4px 10px; background:#faf8f5; }
.shift-execution [data-page="Equipment"] .dataTables__top .input-group input { border:0; box-shadow:none; background:transparent; }
.shift-execution [data-page="Equipment"] .summary-count-chips { display:flex; flex-wrap:wrap; gap:8px; margin-right:auto; }
.shift-execution [data-page="Equipment"] .summary-count-chips span { border:1px solid #eadfd3; padding:8px 13px; border-radius:10px; background:#faf8f5; color:#926239; font-size:12px; font-weight:600; }
.shift-execution [data-page="Equipment"] table { width:100% !important; margin:0 !important; border:0; }
.shift-execution [data-page="Equipment"] table thead th { padding:17px 22px; background:#fcfaf8; border:0; border-bottom:1px solid #eadfd3; white-space:nowrap; }
.shift-execution [data-page="Equipment"] table tbody td { height:72px; padding:16px 22px; border:0; border-bottom:1px solid #f2ede7; background:#fff; font-size:13px; }
.shift-execution [data-page="Equipment"] table tbody tr:hover td { background:#fffaf4; }
.shift-execution [data-page="Equipment"] table tbody td:nth-child(4),
.shift-execution [data-page="Equipment"] table tbody td:nth-child(5) { font-weight:600; color:#3f3933; }
.shift-execution [data-page="Equipment"] .dataTables__bottom { padding:18px 22px; display:flex; flex-wrap:wrap; justify-content:space-between; gap:12px; }
.shift-execution [data-page="Equipment"] .dataTables_scrollBody thead { visibility:hidden; }
.shift-execution [data-page="Equipment"] #pager_container { display:flex; align-items:center; flex-wrap:wrap; gap:10px; }
.shift-execution [data-page="Equipment"] #pager_container button,
.shift-execution [data-page="Equipment"] #pager_container select,
.shift-execution [data-page="Equipment"] #pager_container input { border:1px solid #eadfd3; border-radius:9px; background:#fff; color:#806e5e; padding:7px 10px; }
@media(max-width:1000px) { .shift-execution [data-page="Equipment"] #execution-equipment-summary { grid-template-columns:repeat(2,minmax(0,1fr)); } }
@media(max-width:600px) { .shift-execution [data-page="Equipment"] .execution-tabs { gap:0; } .shift-execution [data-page="Equipment"] .execution-tabs a { padding:12px 9px; font-size:12px; } .shift-execution [data-page="Equipment"] .execution-metric { padding:15px; } .shift-execution [data-page="Equipment"] .dataTables__top { padding:15px; } }

/* Line Up Activity retains the Assignment controls and data handlers. */
.lineup-activity-page .execution-page { padding:26px 28px 86px; }
.lineup-activity-page #tab-sector-content { display:grid; grid-template-columns:minmax(0,1fr) 340px; gap:24px; align-items:start; }
.lineup-activity-page #tab-sector-content.execution-no-context { display:block; }
.lineup-activity-page .dashboard_wrapper { display:contents; }
.lineup-activity-page .dashbord-message-left { grid-column:1; grid-row:2; width:auto !important; min-width:0; margin:0; padding:0 !important; }
.lineup-activity-page #assignmentcard { padding-inline:0 !important; }
.lineup-activity-page .right-panel-wrap { grid-column:2; grid-row:2; align-self:start; position:relative; top:0; width:340px !important; min-width:0; margin:0; display:grid; }
.lineup-activity-page .right-panel-wrap > #AssignmentTabRightSideTab { grid-row:1; }
.lineup-activity-page #AssignmentTabRightSideTab { position:relative; inset:auto; width:100% !important; min-width:0 !important; max-width:100%; height:auto; border:1px solid #eadfd3 !important; border-radius:20px !important; background:#fff; box-shadow:none; padding:18px 0 !important; }
.lineup-activity-page .lineup-resources-heading { display:flex; align-items:center; justify-content:space-between; gap:8px; padding:0 18px 14px; }
.lineup-activity-page .lineup-resources-heading h2 { font-size:14px; font-weight:700; margin:0; }
.lineup-activity-page .lineup-resources-heading > span { font-size:10px; color:#aa9782; border:1px solid #f0e9e2; background:#faf8f5; border-radius:5px; padding:4px 7px; white-space:nowrap; }
.lineup-activity-page #nav-tab-businessFunction { display:flex; flex-wrap:wrap; gap:4px; padding:4px; margin:0 18px 16px !important; border:1px solid #eee5db; background:#f7f3ed; border-radius:14px; }
.lineup-activity-page #nav-tab-businessFunction .nav-link { flex:1; border:0 !important; border-radius:10px !important; padding:9px 8px; background:transparent; color:#978574; font-size:12px; }
.lineup-activity-page #nav-tab-businessFunction .nav-link.active { background:#fff !important; box-shadow:0 1px 3px #4730180d; color:#c27a3f; }
.lineup-activity-page #suggestionSearchBox { margin:0 !important; padding:0 18px 14px; border-bottom:1px solid #f2eae1; }
.lineup-activity-page #suggestionSearchInput,.lineup-activity-page #typename { border:1px solid #eadfd3; background:#faf8f5; border-radius:12px; min-height:40px; padding:9px 12px; font-size:13px; }
.lineup-activity-page #AssignmentTabRightSideTab .op-card { margin:0 !important; padding:0 14px; }
.lineup-activity-page #myTabContent { border:0 !important; background:#fff !important; padding:14px 0 0 !important; max-height:calc(100vh - var(--execution-header-height,80px) - 240px); overflow:auto; }
.lineup-activity-page #myTabContent .suggestion-option { border:1px solid #eadfd3 !important; border-radius:15px !important; background:#fff; padding:14px 12px !important; margin-bottom:12px !important; box-shadow:none; }
.lineup-activity-page #myTabContent .suggestion-option:hover { background:#fffcf7; border-color:#d8b797 !important; }
.lineup-activity-page #myTabContent .suggestion-title { font-size:13px; line-height:1.4; color:#372c23; }
.lineup-activity-page #myTabContent .suggestion-content { min-width:0; }
.lineup-activity-page #myTabContent .suggestion-content .small { font-size:11px; color:#99816a; margin-top:5px; }
.lineup-activity-page #myTabContent .suggestion-machine-icon { background:#edfcf5; border-radius:12px; }
.lineup-activity-page #tab-sector-content .Assesment_card { grid-column:1 / -1; grid-row:1; background:transparent !important; border:0 !important; border-radius:0 !important; padding:0 !important; margin:0 !important; box-shadow:none !important; }
.lineup-activity-page .Assesment_card > .row { width:100% !important; margin:0; display:flex !important; flex-wrap:wrap; align-items:center; gap:12px; }
.lineup-activity-page .Assesment_card > .row > .col-lg-8 { max-width:none; width:auto; flex:1 1 auto; padding:0; }
.lineup-activity-page .Assesment_card .info-container { display:flex; flex-wrap:nowrap; align-items:stretch; gap:8px; margin:0; max-width:none; overflow:visible; }
.lineup-activity-page .Assesment_card .info-container > div:has(> .assignment-metric) { display:contents !important; }
.lineup-activity-page .Assesment_card .assignment-metric { flex:1 1 0; min-width:0; max-width:none !important; min-height:72px; padding:10px 12px !important; border:1px solid #efe3d6; border-radius:13px; background:#faf8f5; }
.lineup-activity-page .Assesment_card .info-box.assignment-metric:first-child,
.lineup-activity-page .Assesment_card #actualaskingratebox,
.lineup-activity-page .Assesment_card #geofencebox { flex:1 1 0; min-width:0; max-width:none !important; }
.lineup-activity-page .Assesment_card .assignment-metric > svg { display:none; }
.lineup-activity-page .assignment-metric-label { font-size:10px; color:#a18b77; margin-bottom:5px; }
.lineup-activity-page .assignment-metric-value { display:flex; flex-wrap:nowrap; gap:3px; align-items:baseline; color:#152536; font-size:14px; white-space:nowrap; }
.lineup-activity-page #aksingratebox { background:#fffaf3; border-color:#ffe0b8; }
.lineup-activity-page #aksingratebox .asking_rate { color:#cc752b !important; }
.lineup-activity-page .Assesment_card .info-container > .d-flex { min-width:0; flex:0 0 auto; }
.lineup-activity-page .Assesment_card .info-container > .d-flex:last-child { justify-content:flex-end; }
.lineup-activity-page .Assesment_card .isAutoAllocation_craftmyapp_container { flex:0 1 132px; min-width:132px; min-height:72px; box-sizing:border-box; }
.lineup-activity-page .Assesment_card .isAutoAllocation_craftmyapp_container > div,
.lineup-activity-page .Assesment_card .isAutoAllocation_craftmyapp_container .d-flex { height:100%; }
.lineup-activity-page .Assesment_card .filter_field { display:block !important; flex:1 1 190px; max-width:340px; width:auto; padding:0; align-self:center; }
.lineup-activity-page .Assesment_card .filter_field > .form-group { width:100%; margin:0; }
.lineup-activity-page .Assesment_card .isAutoAllocation_craftmyapp_container { margin-top:0; }
.lineup-activity-page .Assesment_card #typename { width:100%; }
.lineup-activity-page .Assesment_card .info-container > .autoallocationresult,
.lineup-activity-page .Assesment_card .info-container > .autoallocated { flex:0 0 auto; min-width:0; }
/* No !important on display: the expand/collapse toggle (openExpandedView ->
   toggleLeftContainerDiv) sets this element's inline style to display:none via
   jQuery .hide() when a card is expanded; an !important grid here would have
   beaten that inline style and kept the list visible underneath the expanded
   card. Without !important, the inline display:none wins while expanded, and
   this rule still applies normally whenever no inline style overrides it. */
.lineup-activity-page .assignment-container { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:24px !important; padding:0; margin:0; }
.lineup-activity-page .assignment-card-v2 { width:auto !important; min-width:0; margin:0 !important; border:0 !important; border-radius:24px !important; background:#fff; overflow:visible; box-shadow:none; }
.lineup-activity-page .assignment-card-v2 .assignment-head { border:0; border-radius:23px 23px 20px 20px !important; min-height:58px; padding:12px 18px; }
.lineup-activity-page .assignment-card-v2 .ass-cardbody { gap:12px; padding:0; }
.lineup-activity-page .assignment-card-v2 .label-text-name { font-size:17px; font-weight:700; }
.lineup-activity-page .assignment-card-v2 .text-name,.lineup-activity-page .assignment-card-v2 .text-name1 { width:32px; height:32px; min-width:32px; display:inline-flex; align-items:center; justify-content:center; border-radius:50%; background:#fff; font-size:12px; }
.lineup-activity-page .assignment-card-v2 .sts-text { font-size:12px; white-space:nowrap; }
.lineup-activity-page .assignment-card-v2 .border-style { padding:18px; border:0; }
.lineup-activity-page .assignment-container .assignment-card-v2 .body-head { display:grid !important; grid-template-columns:minmax(0,1fr) minmax(0,1.35fr) !important; gap:16px 12px !important; margin:0 0 16px !important; padding:15px 12px !important; border:0 !important; border-radius:18px !important; background:#f7f9f8 !important; font-size:12px; }
.lineup-activity-page .assignment-card-v2 .body-head .divider { display:none; }
.lineup-activity-page .assignment-card-v2 .head-title { color:#aa9782; font-size:9px; font-weight:650; }
.lineup-activity-page .assignment-container .assignment-card-v2 .body-head > span:not(.divider) { min-width:0; display:flex !important; flex-direction:row !important; align-items:center !important; flex-wrap:wrap; gap:5px; justify-content:flex-start !important; }
.lineup-activity-page .assignment-card-v2 .body-secound-row { margin:16px -5px 0; padding:0; border:0; display:flex; flex-wrap:wrap; }
.lineup-activity-page .assignment-card-v2 .body-secound-row > div { width:50%; padding:0 5px; min-width:0; }
.lineup-activity-page .assignment-card-v2 .body-secound-row label,.lineup-activity-page .assignment-card-v2 .body-secound-card > div > div > label { font-size:10px; color:#a18f7b; text-transform:uppercase; }
.lineup-activity-page .assignment-container .assignment-card-v2 .ass-box { padding:10px; min-height:48px; border:0 !important; border-radius:18px !important; background:#f7f9f8 !important; }
.lineup-activity-page .assignment-card-v2 .ass-box strong { font-size:12px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.lineup-activity-page .assignment-card-v2 .body-secound-card { margin:18px 0 0; padding:0; border:0; }
.lineup-activity-page .assignment-container .assignment-card-v2 .body-card { border:0 !important; border-radius:16px !important; background:#f7f9f8 !important; margin-bottom:7px; }
.lineup-activity-page .assignment-card-v2 .hauler-trips-cell { font-size:13px !important; }
.lineup-activity-page .assignment-card-v2 .body-card label { min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font-size:11px; }
.lineup-activity-page .assignment-card-v2 .hauler-equipment-cell strong { font-size:12px; }
.lineup-activity-page .assignment-card-v2 .hauler-status-text { font-size:10px; color:#a18f7b; }
.lineup-activity-page .assignment-container > .checklist-box { grid-column:1 / -1; }
/* Shared across every Shift Execution page (list/map toggle + the map panel
   itself both live in the common layout, not per-page markup), so these use the
   universal .shift-execution body class rather than .lineup-activity-page,
   which only Line Up Activity's own view sets. */
.shift-execution .lineup-view-toggle,
.target-page-header .lineup-view-toggle {
    display: flex;
    align-items: center;
    gap: 4px;
    padding: 4px;
    border: 1px solid #eadfd3;
    background: #f5f0e9;
    border-radius: 12px;
    margin-left: auto;
    margin-right: 8px;
    flex-shrink: 0;
}
.target-page-header .execution-target-filter-button + .lineup-view-toggle {
    margin-left: 0;
}
.shift-execution .execution-header .dw-header-filters + .lineup-view-toggle {
    margin-left: 10px;
}
.shift-execution .lineup-view-toggle button { border:0; background:transparent; color:#ad9983; border-radius:8px; padding:5px; line-height:1; }
.shift-execution .lineup-view-toggle button[aria-pressed="true"] { color:#c27a3f; background:#fff; box-shadow:0 1px 3px #47301812; }
.shift-execution .lineup-view-toggle .material-icons { font-size:19px; }
@media(max-width:600px) { .shift-execution #execution-header .lineup-view-toggle { flex:0 0 auto; width:auto; margin-left:auto; } }
.shift-execution .lineup-map-panel { height:calc(100vh - var(--execution-header-height,80px) - 76px); min-height:360px; overflow:hidden; box-sizing:border-box; margin:20px 24px; }
.shift-execution .execution-page > .lineup-map-panel { margin:0; }
/* Line Up Activity's framed look (gap on every side) comes from its .execution-page
   <main> wrapper's own padding (26px 28px 86px, see .lineup-activity-page .execution-page
   below), not from the panel's margin above, which is zeroed there. Target/People/
   Equipment/Performance render through _ShiftPlanLayout and have no such wrapper around
   #monitor-tab-content, so the panel needs to carry that same inset itself to match. */
.execution-target-page.shift-execution .lineup-map-panel { margin:26px 28px 86px; }
.shift-execution .lineup-map-panel[hidden] { display:none; }
.shift-execution .lineup-map-panel iframe { display:block; width:100%; height:100%; border:1px solid #eadfd3; border-radius:18px; background:#fff; overflow:hidden; }
.lineup-activity-page #tab-sector-content:has(.panel-collapsed-wrap) { grid-template-columns:minmax(0,1fr); }
.lineup-activity-page #tab-sector-content:has(.panel-collapsed-wrap) .dashbord-message-left { width:100% !important; max-width:none !important; }
.lineup-activity-page #tab-sector-content:has(.panel-collapsed-wrap) .assignment-container { width:100%; max-width:none; }
.lineup-activity-page .right-panel-wrap.panel-collapsed-wrap { grid-column:1; grid-row:1; align-self:center; justify-self:end; width:0 !important; height:40px; z-index:2; }
.lineup-activity-page #tab-sector-content:has(.panel-collapsed-wrap) .Assesment_card > .row { box-sizing:border-box; padding-right:40px; }
.lineup-activity-page .right-panel-wrap.panel-collapsed-wrap > #AssignmentTabRightSideTab { height:0; padding:0 !important; border:0 !important; overflow:visible !important; }
.lineup-activity-page .right-panel-wrap > .arrow_btn { position:absolute; grid-row:1; top:20px; transform:none; left:-20px; right:auto; padding:10px 0; margin:0; }
.lineup-activity-page .right-panel-wrap.panel-collapsed-wrap > .arrow_btn { top:50%; transform:translateY(-50%); }
.lineup-activity-page #AssignmentTabRightSideTab { transition:right .3s ease !important; }
.lineup-activity-page .assignment_overlay { z-index:1199; }
@media(min-width:992px) { .lineup-activity-page #AssignmentTabRightSideTab.panel-collapsed { width:0 !important; min-width:0 !important; max-width:0 !important; } .lineup-activity-page .dashbord-message-left.panel-expanded { max-width:none !important; } }
@media(max-width:1650px) { .lineup-activity-page .assignment-container { grid-template-columns:minmax(0,1fr); } .lineup-activity-page #tab-sector-content { grid-template-columns:minmax(0,1fr) 310px; gap:20px; } .lineup-activity-page .right-panel-wrap { width:310px !important; } .lineup-activity-page #tab-sector-content:has(.panel-collapsed-wrap) { grid-template-columns:minmax(0,1fr); } .lineup-activity-page #tab-sector-content:has(.panel-collapsed-wrap) .assignment-container { grid-template-columns:repeat(2,minmax(0,1fr)); } .lineup-activity-page .right-panel-wrap.panel-collapsed-wrap { width:0 !important; } }
@media(max-width:991px) { .lineup-activity-page #tab-sector-content { display:block; } .lineup-activity-page .Assesment_card { margin-bottom:20px !important; } .lineup-activity-page .right-panel-wrap { width:0 !important; position:static; } .lineup-activity-page #AssignmentTabRightSideTab { position:fixed !important; top:var(--execution-header-height,80px); right:-360px; left:auto; bottom:0; width:min(340px,calc(100vw - 24px)) !important; max-height:calc(100vh - var(--execution-header-height,80px)); overflow:auto; z-index:1200; } .lineup-activity-page #AssignmentTabRightSideTab.mobile-overlay-open { right:0; } .lineup-activity-page .right-panel-wrap > .arrow_btn { position:fixed !important; right:0 !important; left:auto !important; top:calc(var(--execution-header-height,80px) + 20px) !important; transform:none !important; z-index:1201 !important; } }
@media(max-width:600px) { .lineup-activity-page .execution-page { padding:16px 12px 80px; } .lineup-activity-page .assignment-container .assignment-card-v2 .border-style { padding:12px !important; } .lineup-activity-page .assignment-container .assignment-card-v2 .body-head { grid-template-columns:1fr !important; } .lineup-activity-page .assignment-card-v2 .body-card li.hauleroperatorDropZone { grid-template-columns:65px minmax(65px,1fr) 70px !important; } .lineup-activity-page .assignment-card-v2 .hauler-trip-cell { grid-column:2; grid-row:2; justify-content:flex-start !important; } .lineup-activity-page .assignment-card-v2 .hauler-speed-cell { grid-column:3; grid-row:1 / span 2; } .lineup-activity-page #execution-header { display:flex !important; flex-flow:row wrap !important; gap:8px; } .lineup-activity-page #execution-header .target-title { flex:0 0 100%; } .lineup-activity-page #execution-header .header-filter { flex:1 1 130px !important; width:auto !important; min-width:0 !important; } .lineup-activity-page #execution-header .dw-header-filters { flex:1 1 130px; width:auto; } .lineup-activity-page #execution-header .lineup-view-toggle { flex:0 0 auto; width:auto; } }

/* Equipment execution: availability and deployment share one shift header and card layout. */
.execution-equipment-page .target-page-header { width:100%; min-width:0; flex-wrap:wrap; }
.execution-equipment-page .page-header-box { min-height:74px; }
.execution-equipment { padding:24px 28px 84px; color:#243243; background:#faf8f5; min-height:calc(100vh - 120px); }
.execution-equipment [hidden] { display:none !important; }
.execution-equipment button,.execution-equipment input,.execution-equipment select { font:inherit; }
.execution-equipment button { cursor:pointer; border:1px solid #eadfd3; border-radius:10px; background:#fff; color:#806e5e; padding:8px 14px; font-size:13px; }
.execution-equipment button:hover:not(:disabled) { border-color:#d8b797; background:#fff8ee; color:#8a5322; }
.execution-equipment button:disabled { cursor:default; opacity:.45; }
.execution-equipment button:focus-visible,.execution-equipment input:focus-visible,.execution-equipment select:focus-visible { outline:2px solid #c27a3f; outline-offset:3px; }
.equipment-tabs { display:flex; gap:24px; border-bottom:1px solid #eadfd3; margin-bottom:24px; }
.execution-equipment .equipment-tabs button { display:inline-flex; align-items:center; gap:8px; padding:12px 14px; border:0; border-bottom:2px solid transparent; border-radius:0; background:transparent; font-weight:600; }
.execution-equipment .equipment-tabs button[aria-selected="true"] { color:#c27a3f; border-bottom-color:#c27a3f; }
.execution-equipment .equipment-tabs button:hover:not(:disabled) { background:transparent; color:#c27a3f; border-bottom-color:#d8b797; }
.execution-equipment .equipment-tabs button[aria-selected="true"]:hover { border-bottom-color:#c27a3f; }
.equipment-tabs .material-icons { font-size:19px; }
.equipment-message { display:flex; align-items:center; justify-content:space-between; gap:16px; background:#fff; border:1px solid #eadfd3; border-radius:12px; padding:14px 18px; margin-bottom:20px; }
.equipment-message.is-error { color:#a32942; background:#fff6f7; border-color:#ffcbd5; }
.equipment-metrics { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:18px; margin-bottom:26px; }
.equipment-metric { border:1px solid #eadfd3; border-radius:16px; background:#fff; padding:18px; min-width:0; }
.equipment-metric-heading { display:flex; align-items:center; gap:8px; font-size:11px; font-weight:700; color:#948373; letter-spacing:.4px; }
.equipment-metric-heading .material-icons { font-size:19px; color:#7560ff; }
.equipment-metric-1 .material-icons { color:#00b985; }
.equipment-metric-2 .material-icons { color:#ff2764; }
.equipment-metric-3 .material-icons { color:#d48720; }
.equipment-metric-tag { margin-left:auto; padding:3px 8px; border:1px solid #e9e5ff; border-radius:4px; background:#f4f2ff; color:#7560ff; font-size:9px; letter-spacing:0; }
.equipment-metric-1 .equipment-metric-tag { color:#009b70; border-color:#c9f5e5; background:#edfcf5; }
.equipment-metric-2 .equipment-metric-tag { color:#e90046; border-color:#ffd6df; background:#fff0f4; }
.equipment-metric-3 .equipment-metric-tag { color:#b6761c; border-color:#ffedb8; background:#fffae9; }
.equipment-metric > strong { display:block; margin-top:8px; font-size:28px; font-weight:750; line-height:1.2; font-variant-numeric:tabular-nums; }
.execution-equipment .equipment-card { display:block; padding:0; border:1px solid #eadfd3; border-radius:18px; overflow:hidden; background:#fff; }
.equipment-toolbar { display:flex; flex-wrap:wrap; align-items:center; gap:14px; padding:22px; background:#fffdfb; border-bottom:1px solid #f1e9e1; }
.equipment-kinds { display:flex; gap:4px; padding:4px; border:1px solid #eee5db; border-radius:14px; background:#f4f0eb; margin-right:auto; }
.execution-equipment .equipment-kinds button { border:0; background:transparent; font-weight:650; padding:9px 18px; }
.execution-equipment .equipment-kinds button[aria-pressed="true"] { background:#c27a3f; color:#fff; }
.execution-equipment .equipment-kinds button[aria-pressed="true"]:hover { background:#aa642f; color:#fff; }
.equipment-kinds button span { display:inline-block; font-size:10px; margin-left:5px; opacity:.85; }
.equipment-view-label { margin-right:auto; font-size:14px; font-weight:650; }
.execution-equipment .equipment-search { display:flex; align-items:center; gap:8px; background:#fff; border:1px solid #eadfd3; border-radius:12px; padding:8px 12px; margin:0; width:310px; max-width:100%; }
.equipment-search .material-icons { font-size:19px; color:#ac9b89; }
.equipment-search input { width:100%; min-width:0; border:0; outline:0; font-size:13px; background:transparent; }
.execution-equipment .equipment-filter-toggle { display:inline-flex; align-items:center; gap:7px; color:#bd7433; font-weight:600; }
.equipment-filter-toggle .material-icons { font-size:18px; }
.equipment-filter-toggle > span { border-radius:10px; background:#fff2d8; padding:0 5px; font-size:11px; }
.equipment-filters { display:flex; flex-wrap:wrap; gap:14px; align-items:flex-end; padding:18px 22px; border-bottom:1px solid #f1e9e1; background:#fcfaf7; }
.equipment-filters label { display:flex; flex:1 1 160px; flex-direction:column; gap:6px; font-size:12px; color:#948373; margin:0; }
.equipment-filters select { width:100%; border:1px solid #eadfd3; border-radius:8px; min-height:35px; background:#fff; padding:5px 8px; color:#243243; }
.equipment-table-scroll { overflow-x:auto; }
.execution-equipment .dataTables_wrapper { padding:0; min-height:0; border:0; }
.execution-equipment table.equipment-execution-table { width:100% !important; min-width:1050px; margin:0 !important; border:0 !important; border-collapse:collapse !important; }
.execution-equipment .equipment-execution-table th,.execution-equipment .equipment-execution-table td { padding:18px 24px; text-align:left; vertical-align:middle; border:0; border-bottom:1px solid #f3ede7; font-size:13px; line-height:1.45; }
.execution-equipment .equipment-execution-table thead th { font-family:inherit !important; background:#fcfaf7 !important; color:#948373 !important; font-weight:650; letter-spacing:.4px; white-space:nowrap; }
.execution-equipment .equipment-execution-table tbody td { background:#fff !important; box-shadow:none !important; height:76px; }
.execution-equipment .equipment-execution-table tbody tr:hover td { background:#fffdf9 !important; }
.equipment-category { color:#9e8f7d; margin-right:8px; white-space:nowrap; }
.equipment-make { display:inline-block; padding:2px 8px; border:1px solid #e2e8ff; background:#f1f5ff; color:#5064b6; border-radius:5px; font-size:10px; }
.equipment-name { display:inline-block; font-weight:650; color:#564c40; background:#faf8f5; border:1px solid #eadfd3; border-radius:8px; padding:5px 10px; white-space:nowrap; }
.equipment-kind-badge { display:inline-block; margin-left:8px; border:1px solid #eee6ff; border-radius:5px; padding:2px 7px; background:#faf7ff; color:#7849ce; font-size:10px; }
.equipment-material { display:inline-block; padding:5px 11px; border:1px solid #ffedbd; border-radius:18px; background:#fffcf3; color:#9c6229; font-size:12px; white-space:nowrap; }
.equipment-material::before { content:'•'; margin-right:6px; color:#c27a3f; }
.equipment-pair-count { display:inline-block; border:1px solid #e0e5ff; background:#f1f3ff; color:#5b50ce; padding:4px 8px; border-radius:6px; font-size:11px; white-space:nowrap; }
.equipment-paired-names { display:flex; flex-wrap:wrap; gap:4px; margin-top:5px; max-width:230px; }
.equipment-paired-name { padding:1px 5px; border:1px solid #eadfd3; border-radius:4px; background:#faf8f5; color:#8d6747; font-size:10px; }
.equipment-muted { color:#aa9b8a; font-size:12px; }
.equipment-location strong { display:block; font-size:12px; font-weight:600; color:#7c6b5a; max-width:260px; }
.equipment-location small { display:block; font-size:11px; color:#a08d79; margin-top:4px; }
.equipment-status { display:inline-flex; align-items:center; gap:8px; min-width:122px; padding:6px 12px; border:1px solid #e9e1d8; border-radius:14px; font-weight:650; font-size:12px; white-space:nowrap; }
.equipment-status::before { content:''; width:7px; height:7px; border-radius:50%; background:currentColor; }
.equipment-status-success { color:#009b70; background:#f1fcf7; border-color:#bdeed8; }
.equipment-status-warning { color:#c88410; background:#fffcf0; border-color:#ffe19b; }
.equipment-status-danger { color:#e90046; background:#fff6f8; border-color:#ffcbd5; }
.equipment-status-neutral { color:#93816d; background:#faf8f5; }
.execution-equipment .equipment-execution-table .dataTables_empty,.equipment-empty { height:140px; text-align:center !important; color:#948373; background-image:none !important; }
.equipment-pagination { display:flex; align-items:center; justify-content:space-between; gap:12px; padding:16px 22px; color:#948373; font-size:12px; }
.equipment-pagination > div { display:flex; align-items:center; gap:12px; }
.equipment-source-note { font-size:11px; color:#a08d79; margin:14px 2px 0; }
@media(max-width:1200px) { .equipment-metrics { grid-template-columns:repeat(2,minmax(0,1fr)); } }
@media(max-width:650px) { .execution-equipment { padding:16px 14px 84px; } .equipment-tabs { gap:4px; } .execution-equipment .equipment-tabs button { padding:10px 6px; font-size:12px; } .equipment-metrics { gap:10px; } .equipment-metric { padding:14px; } .equipment-metric-heading { flex-wrap:wrap; } .equipment-metric-tag { margin-left:0; } .equipment-toolbar { padding:14px; } .equipment-search { flex:1 1 230px; } .equipment-pagination { flex-direction:column; align-items:flex-start; } }

/* Deviation and Safety render the existing legacy DataTables partials (Bootstrap .card,
   dtpager.js pager) rather than a bespoke table like Equipment's. This reskins that same
   markup to match Equipment's card/table/pager look, without editing any of those
   partials' own business logic or the many other pages that still use the legacy look. */
.shift-execution :is([data-page="Deviation"], [data-page="Safety"]) .execution-content .card { padding:0 !important; margin:0 !important; border:1px solid var(--execution-border); border-radius:18px; overflow:hidden; background:#fff; box-shadow:none; }
.shift-execution :is([data-page="Deviation"], [data-page="Safety"]) .execution-content .card-body { padding:0 !important; }
.shift-execution :is([data-page="Deviation"], [data-page="Safety"]) .execution-content .mobileHeader { display:none; }
.shift-execution :is([data-page="Deviation"], [data-page="Safety"]) .execution-content .dataTables_wrapper { padding:0; min-height:0; }
.shift-execution :is([data-page="Deviation"], [data-page="Safety"]) .execution-content .dataTables__top { display:flex !important; justify-content:flex-end !important; align-items:center; padding:22px; background:#fffdfb; border-bottom:1px solid #f1e9e1; }
/* The app-wide .input-group.prefix pattern absolutely-positions its icon and reserves
   space for it via padding-left on the input (see line ~768), then collapses the input to
   40px and expands to 190px on focus. Fighting that layout model with flex/flat padding is
   what caused the icon to sit on top of the text; instead this keeps that exact mechanism
   and only overrides the width so the box matches Equipment's fixed-open size instead of
   the collapse/expand animation, and recolors it to match. */
.shift-execution :is([data-page="Deviation"], [data-page="Safety"]) .execution-content .input-group.prefix { border-radius:12px; overflow:hidden; }
.shift-execution :is([data-page="Deviation"], [data-page="Safety"]) .execution-content .input-group.prefix .input-group-addon { color:#ac9b89; font-size:19px; display:flex; }
.shift-execution :is([data-page="Deviation"], [data-page="Safety"]) .execution-content .dt-global-search,
.shift-execution :is([data-page="Deviation"], [data-page="Safety"]) .execution-content .dt-global-search:focus,
.shift-execution :is([data-page="Deviation"], [data-page="Safety"]) .execution-content .dt-global-search:not(:placeholder-shown) { width:310px !important; max-width:100%; min-width:0; box-sizing:border-box; padding-left:36px !important; border:1px solid var(--execution-border) !important; border-radius:12px !important; outline:0; background:#fff; font-size:13px; box-shadow:none !important; }
/* scrollX tables (Hazard, High Risk, etc.) split into a separate scrollable header/body
   and otherwise show a bare native scrollbar; blend it into the card instead. */
.shift-execution :is([data-page="Deviation"], [data-page="Safety"]) .execution-content .dataTables_scrollHead,
.shift-execution :is([data-page="Deviation"], [data-page="Safety"]) .execution-content .dataTables_scrollHeadInner,
.shift-execution :is([data-page="Deviation"], [data-page="Safety"]) .execution-content .dataTables_scrollHeadInner table { background:#fcfaf7; border:0 !important; width:100% !important; }
.shift-execution :is([data-page="Deviation"], [data-page="Safety"]) .execution-content .dataTables_scrollBody { border:0 !important; scrollbar-width:thin; scrollbar-color:#e2d5c4 transparent; }
.shift-execution :is([data-page="Deviation"], [data-page="Safety"]) .execution-content .dataTables_scrollBody::-webkit-scrollbar { height:8px; }
.shift-execution :is([data-page="Deviation"], [data-page="Safety"]) .execution-content .dataTables_scrollBody::-webkit-scrollbar-track { background:transparent; }
.shift-execution :is([data-page="Deviation"], [data-page="Safety"]) .execution-content .dataTables_scrollBody::-webkit-scrollbar-thumb { background:#e2d5c4; border-radius:8px; }
.shift-execution :is([data-page="Deviation"], [data-page="Safety"]) .execution-content table.dataTable { width:100% !important; margin:0 !important; border:0 !important; border-collapse:collapse !important; }
.shift-execution :is([data-page="Deviation"], [data-page="Safety"]) .execution-content table.dataTable th,
.shift-execution :is([data-page="Deviation"], [data-page="Safety"]) .execution-content table.dataTable td { padding:18px 24px; text-align:left; vertical-align:middle; border:0; border-bottom:1px solid #f3ede7; font-size:13px; line-height:1.45; }
.shift-execution :is([data-page="Deviation"], [data-page="Safety"]) .execution-content table.dataTable thead th { font-family:inherit !important; background:#fcfaf7 !important; color:#948373 !important; font-weight:650; letter-spacing:.4px; white-space:nowrap; }
.shift-execution :is([data-page="Deviation"], [data-page="Safety"]) .execution-content table.dataTable tbody td { background:#fff !important; box-shadow:none !important; }
.shift-execution :is([data-page="Deviation"], [data-page="Safety"]) .execution-content table.dataTable tbody tr:hover td { background:#fffdf9 !important; }
.shift-execution :is([data-page="Deviation"], [data-page="Safety"]) .execution-content .dataTables_empty { height:140px; text-align:center !important; color:#948373; background-image:none !important; }
.shift-execution :is([data-page="Deviation"], [data-page="Safety"]) .execution-content .dataTables__bottom { display:flex; align-items:center; justify-content:space-between; gap:12px; padding:16px 22px; color:#948373; font-size:12px; }
.shift-execution :is([data-page="Deviation"], [data-page="Safety"]) .execution-content .dataTables_info { padding:0; margin:0; color:#948373; font-size:12px; }
.shift-execution :is([data-page="Deviation"], [data-page="Safety"]) .execution-content #pager_container { display:flex; align-items:center; gap:10px; margin:0; }
.shift-execution :is([data-page="Deviation"], [data-page="Safety"]) .execution-content #pager_container button { border:1px solid var(--execution-border); border-radius:8px; background:#fff; color:#7c6b5a; padding:6px 12px; font-size:12px; }
.shift-execution :is([data-page="Deviation"], [data-page="Safety"]) .execution-content #pager_container input { width:46px; text-align:center; border:1px solid var(--execution-border); border-radius:6px; padding:4px; }
.shift-execution :is([data-page="Deviation"], [data-page="Safety"]) .execution-content #pager_container select { border:1px solid var(--execution-border); border-radius:6px; padding:4px 6px; background:#fff; color:#7c6b5a; }
.shift-execution :is([data-page="Deviation"], [data-page="Safety"]) .execution-content .dt-buttons { display:none !important; }
@media(max-width:650px) {
    .shift-execution :is([data-page="Deviation"], [data-page="Safety"]) .execution-content .dataTables__top { padding:14px; }
    .shift-execution :is([data-page="Deviation"], [data-page="Safety"]) .execution-content .input-group.prefix { width:100%; }
    .shift-execution :is([data-page="Deviation"], [data-page="Safety"]) .execution-content table.dataTable th,
    .shift-execution :is([data-page="Deviation"], [data-page="Safety"]) .execution-content table.dataTable td { padding:12px 14px; }
    .shift-execution :is([data-page="Deviation"], [data-page="Safety"]) .execution-content .dataTables__bottom { flex-direction:column; align-items:flex-start; }
}

/* shift-execution-target */
body.execution-target-page { --target-accent:var(--execution-accent,#c27a3f); --target-border:var(--execution-border,#eadfd3); background:#faf8f5; }
.execution-target-page #header { height:auto; min-height:64px; }
.execution-target-page.menubar-hoverable.header-fixed #base { padding-top:var(--target-header-height,80px) !important; }
.execution-target-page .page-header-box { overflow:visible; }
.execution-target-page .target-page-header { min-width:0; }
.execution-target-page .target-title { white-space:nowrap; }
.execution-target-page .execution-target-filter-button { margin-left:auto; display:inline-flex; align-items:center; gap:8px; border:1px solid var(--target-border); border-radius:10px; background:#fffaf5; color:#a65e26; padding:7px 14px; font-size:13px; }
.execution-target-filter-button .material-icons { font-size:18px; }
.execution-target { padding:24px; color:#182334; }
.execution-target [hidden] { display:none !important; }
.execution-target button { cursor:pointer; border:1px solid var(--target-border); border-radius:9px; padding:8px 14px; background:#fff; color:#76583e; font-size:13px; }
.execution-target button:hover:not(:disabled) { border-color:#d8b797; background:#fff8ee; color:#8a5322; }
.execution-target button:disabled { cursor:default; opacity:.45; }
.execution-target button:focus-visible,.execution-target input:focus-visible { outline:2px solid var(--target-accent); outline-offset:2px; }
#targetStatus { padding:14px 18px; margin-bottom:20px; border:1px solid var(--target-border); border-radius:12px; background:#fff; }
#targetStatus.target-error { color:#a42236; border-color:#edb4be; background:#fff4f5; }
.target-overview,#targetResultsPanel { background:#fff; border:1px solid var(--target-border); border-radius:18px; margin-bottom:26px; overflow:hidden; }
.target-overview-title { display:flex; align-items:center; justify-content:space-between; gap:18px; padding:18px 23px; border-bottom:1px solid #f3ede7; min-height:78px; }
.target-overview-heading { display:flex; align-items:center; gap:14px; }
.target-overview-heading p { margin:4px 0 0; font-size:11px; color:#948373; letter-spacing:.2px; }
.target-overview-icon { padding:12px; font-size:20px; background:#fff9e9; color:#c27a3f; border-radius:13px; }
.target-overview-title h3 { margin:0; font-size:16px; font-weight:700; }
.execution-target #targetMetricsToggle { display:inline-flex; align-items:center; gap:8px; background:#f6f3ef; border:0; border-radius:14px; font-size:11px; font-weight:600; white-space:nowrap; }
#targetMetricsToggle .material-icons { font-size:17px; }
#targetScope { color:#948373; font-size:12px; }
.target-metrics-scope { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip-path:inset(50%); }
.target-metrics { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:18px; padding:18px 23px 22px; }
.target-metric { border:1px solid var(--target-border); border-radius:18px; padding:18px; min-width:0; min-height:236px; display:flex; flex-direction:column; }
.target-metric-head { display:flex; justify-content:space-between; align-items:center; gap:12px; color:#948373; font-size:11px; font-weight:700; letter-spacing:.4px; }
.target-metric-head .material-icons { font-size:17px; padding:5px; border-radius:9px; background:#faf6ee; color:#c27a3f; }
.target-metric-value { display:flex; align-items:center; justify-content:space-between; gap:10px; margin:17px 0 4px; }
.target-metric-value > strong { display:block; font-size:29px; font-weight:750; line-height:1.25; overflow-wrap:anywhere; }
.target-achievement-pill { flex-shrink:0; border:1px solid #f2dfc8; border-radius:20px; padding:2px 8px; font-size:10px; color:#c27a3f; background:#fffdf6; font-weight:700; }
.target-metric > small { font-size:10px; letter-spacing:.4px; color:#948373; }
.target-metric-graphic { height:72px; display:flex; align-items:center; margin-top:auto; position:relative; }
.target-sparkline { width:100%; height:58px; }
.target-sparkline svg { display:block; width:100%; height:100%; overflow:visible; }
.target-sparkline.is-empty { height:36px; border-bottom:2px dashed #e4dcd4; color:#a69889; font-size:10px; display:flex; align-items:center; justify-content:center; }
.target-chart-caption { position:absolute; right:0; bottom:1px; font-size:8px; color:#a69889; }
.target-baseline { width:100%; border-top:3px dashed #cbd5e1; }
.target-metric-footer { display:flex; justify-content:space-between; align-items:center; gap:10px; border-top:1px solid #f3ede7; padding-top:10px; font-size:10px; color:#948373; letter-spacing:.5px; }
.target-metric-footer b { border:1px solid #f1dfb7; border-radius:6px; padding:4px 7px; color:#b87436; font-size:10px; letter-spacing:0; background:#fffdf6; }
.target-metric.is-negative { border-color:#ffd6dc; background:#fffcfc; color:#e90046; }
.target-metric.is-positive { border-color:#c6eedc; color:#009b70; }
.target-metric.is-negative .target-metric-head,.target-metric.is-negative .target-metric-footer { color:#e90046; }
.target-metric.is-negative .target-metric-head .material-icons,.target-metric.is-negative .target-metric-footer b { color:#e90046; background:#fff0f3; border-color:#ffd6dc; }
.target-rate .target-metric-head .material-icons { color:#7e4321; }
.target-toolbar { display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:14px; padding:23px; border:1px solid var(--target-border); border-radius:18px; background:#fff; margin-bottom:26px; min-height:92px; }
.target-toolbar label { display:flex; align-items:center; gap:10px; margin:0; font-size:12px; }
.target-materials { display:flex; flex-wrap:wrap; align-items:center; gap:8px; }
.execution-target .target-materials button { display:inline-flex; align-items:center; gap:8px; border-radius:14px; font-weight:600; padding:8px 15px; }
.target-materials button[data-material]:not([data-material=""])::before { content:""; width:6px; height:6px; flex-shrink:0; border-radius:50%; background:var(--target-accent); }
.execution-target .target-materials button[aria-pressed="true"] { background:var(--target-accent); border-color:var(--target-accent); color:#fff; }
.execution-target .target-materials button[aria-pressed="true"]:hover { background:#aa642f; border-color:#aa642f; color:#fff; }
.target-materials button[data-material][aria-pressed="true"]::before { background:currentColor; }
.target-structures { display:flex; flex-wrap:wrap; gap:4px; padding:4px; border:1px solid var(--target-border); background:#f4f0eb; border-radius:14px; }
.execution-target .target-structures button { display:inline-flex; align-items:center; justify-content:center; gap:8px; border-color:transparent; background:transparent; font-weight:600; }
.execution-target .target-structures button[aria-selected="true"] { background:#fff; color:#182334; box-shadow:0 1px 3px #38251330; }
.execution-target .target-structures button[aria-selected="true"]:hover { background:#fff; color:#182334; }
.target-structures .material-icons { font-size:17px; }
.target-search { background:#fcfaf7; border:1px solid var(--target-border); border-radius:10px; padding:8px 12px; flex:1 1 220px; max-width:420px; }
.target-search .material-icons { color:#a99785; font-size:20px; }
.target-search input { border:0; outline:0; min-width:0; width:100%; background:transparent; font-size:13px; }
.target-table-scroll { overflow:auto; }
#targetTable,#targetTable.dataTable { width:100% !important; border-collapse:collapse !important; font-size:13px; margin:0 !important; border:0; }
#targetTable th { background:#fcfaf7; color:#8c7a68; font-weight:700; font-size:12px; letter-spacing:.5px; white-space:nowrap; }
#targetTable th,#targetTable td { box-sizing:border-box; padding:16px 20px; border-bottom:1px solid #f3ede7; text-align:left; vertical-align:middle; line-height:1.5; }
#targetTable tbody tr,#targetTable tbody tr.odd,#targetTable tbody tr.even { background:#fff; }
#targetTable tbody tr:hover { background:#fffdf9; }
#targetTable tbody tr td { height:76px; background:#fff; box-shadow:none; }
#targetTable tbody tr:hover td { background:#fffdf9; }
#targetTable th:nth-child(n+6),#targetTable td:nth-child(n+6) { font-variant-numeric:tabular-nums; }
.target-missing { color:#a79b90; }
#targetTable td:nth-child(n+6) { white-space:nowrap; }
.target-emphasis { font-weight:650; }
.target-material-badge { display:inline-block; border:1px solid #ffe6a3; border-radius:20px; background:#fffbeb; color:#a65f26; padding:4px 10px; font-size:12px; font-weight:600; white-space:nowrap; }
.target-material-badge::before { content:'•'; padding-right:6px; color:#c27a3f; }
.target-sector-badge,.target-bench-badge { display:inline-block; background:#f5f1ed; border:1px solid #eae1d8; padding:2px 8px; border-radius:4px; font-size:11px; white-space:nowrap; }
.target-destination { color:#8c7a68; }
.target-volume-cell strong,.target-volume-cell small { display:block; text-align:left; }
.target-volume-cell strong { font-size:14px; font-weight:700; }
.target-volume-cell small { color:#948373; font-size:11px; }
.target-achievement-cell strong { font-size:12px; }
.target-progress { width:100%; min-width:90px; height:6px; border-radius:12px; background:#f1ede8; overflow:hidden; margin-top:5px; }
.target-progress > span { display:block; height:100%; border-radius:12px; background:linear-gradient(90deg,#ef9b00,#c27a3f); }
.target-variance-badge { display:inline-block; padding:7px 12px; border-radius:25px; font-weight:700; font-size:12px; }
.target-variance-badge.is-negative { color:#e90046; background:#fff7f8; border:1px solid #ffcbd5; }
.target-variance-badge.is-positive { color:#009b70; background:#f3fff9; border:1px solid #b9edd7; }
#targetResultsPanel .dataTables_wrapper { padding:0; min-height:220px; }
#targetResultsPanel .dataTables_wrapper td.dataTables_empty { height:220px; text-align:center !important; vertical-align:middle; color:#8c7a68; font-size:13px; white-space:normal !important; }
#targetResultsPanel .dataTables_wrapper td.dataTables_empty .execution-empty-state { margin:0 auto; }
/* Keep Excavator headings aligned with their values despite the shared DataTables styles. */
#targetResultsPanel[aria-labelledby="targetExcavatorTab"] #targetTable { min-width:1360px; }
#targetResultsPanel[aria-labelledby="targetExcavatorTab"] #targetTable th,
#targetResultsPanel[aria-labelledby="targetExcavatorTab"] #targetTable td { padding:14px 18px; }
#targetResultsPanel[aria-labelledby="targetExcavatorTab"] #targetTable td { height:72px; }
#targetResultsPanel[aria-labelledby="targetExcavatorTab"] #targetTable th:nth-child(n+6),
#targetResultsPanel[aria-labelledby="targetExcavatorTab"] #targetTable td:nth-child(n+6) { text-align:left !important; font-variant-numeric:tabular-nums; }

#targetResultsPanel[aria-labelledby="targetExcavatorTab"] .target-progress { width:112px; margin:5px auto 0; }
#targetResultsPanel[aria-labelledby="targetExcavatorTab"] .target-variance-badge:not(.is-negative):not(.is-positive) { padding:0; }
.target-pagination { display:flex; justify-content:space-between; align-items:center; gap:12px; padding:16px 22px; color:#8c7a68; font-size:12px; }
.target-pagination > div { display:flex; gap:12px; align-items:center; }
.target-filter-panel { position:fixed; z-index:20000; width:320px; max-width:calc(100vw - 16px); overflow-y:auto; background:#fff; border:1px solid var(--target-border); border-radius:15px; box-shadow:0 12px 34px #38251325; padding:18px; }
.target-filter-title { display:flex; justify-content:space-between; align-items:center; margin-bottom:14px; }
.target-filter-title button { border:0; padding:0 5px; font-size:23px; }
.target-filter-panel > label { display:block; font-size:12px; color:#8c7a68; margin:15px 0 6px; }
.target-filter-panel .select2-container { width:100% !important; }
.target-filter-panel .select2-selection { min-height:36px; border:1px solid var(--target-border) !important; border-radius:8px; }
.target-filter-actions { display:flex; justify-content:space-between; gap:10px; margin-top:22px; }
.execution-target .target-primary { background:var(--target-accent); color:#fff; border-color:var(--target-accent); }
@media(max-width:1100px) { .target-metrics { grid-template-columns:repeat(2,minmax(0,1fr)); } }
@media(max-width:600px) { .execution-target { padding:14px; } .target-metrics { grid-template-columns:1fr; } .target-overview-title,.target-pagination { align-items:flex-start; flex-direction:column; } .target-search { min-width:100%; } }

/* assignment-people */
.assignment-people { padding:28px; background:#faf8f5; min-height:70vh; color:#243243; }
.assignment-people button,.assignment-people input,.assignment-people select { font:inherit; }
.assignment-people button { border:1px solid #eadfd3; border-radius:12px; background:#faf8f5; color:#72553f; padding:10px 16px; cursor:pointer; }
.assignment-people button:hover:not(:disabled) { border-color:#d8b797; background:#fff8ee; color:#8a5322; }
.assignment-people button:disabled { opacity:.5; cursor:default; }
.assignment-people button:focus-visible,.assignment-people input:focus-visible,.assignment-people select:focus-visible { outline:2px solid #c27a3f; outline-offset:3px; }
.assignment-people .people-primary { background:#c27a3f; border-color:#c27a3f; color:#fff; font-weight:600; }
.assignment-people .people-primary:hover:not(:disabled) { background:#aa642f; border-color:#aa642f; color:#fff; }
.people-metrics { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:18px; margin-bottom:26px; }
.people-metric { background:#fff; border:1px solid #eee7df; border-radius:18px; padding:22px; display:flex; align-items:center; gap:18px; }
.people-metric .material-icons { padding:15px; border-radius:50%; background:#f0f2ff; color:#6852ff; }
.people-metric:nth-child(2) .material-icons { color:#00a579; background:#edfcf5; }
.people-metric:nth-child(3) .material-icons { color:#e85377; background:#fff1f5; }
.people-metric:nth-child(4) .material-icons { color:#d48a00; background:#fffae9; }
.people-metric small,.people-field small { display:block; color:#9b8c7d; font-size:12px; margin-bottom:5px; }
.people-metric strong { font-size:28px; line-height:1.2; }
.assignment-people .people-toolbar { display:flex; align-items:center; flex-wrap:wrap; gap:14px; background:white; border:1px solid #eadfd3; border-radius:18px; padding:18px; margin-bottom:26px; }
.assignment-people .people-search { display:flex; align-items:center; gap:10px; border:1px solid #eadfd3; background:#faf8f5; border-radius:12px; padding:8px 12px; flex:1 1 230px; margin:0; }
.people-search input { border:0; background:transparent; width:100%; min-width:0; outline:0; }
.assignment-people .people-search { max-width:360px; }
.assignment-people .people-profiles { margin-right:auto; }
.people-search .material-icons { color:#ac9b89; font-size:20px; }
.people-profiles { display:flex; flex-wrap:wrap; padding:4px; border-radius:12px; background:#f4f0ec; }
.people-profiles button { border:0; padding:7px 13px; background:transparent; font-size:12px; }
.people-profiles button[aria-pressed="true"] { background:white; color:#243243; box-shadow:0 1px 3px #0001; }
.people-profiles button[aria-pressed="true"]:hover { background:#fff; color:#243243; }
.people-sort { margin:0; color:#9b8c7d; font-size:12px; }
.people-sort select { border:0; background:transparent; color:#243243; }
.people-person { display:grid; grid-template-columns:minmax(230px,2fr) repeat(3,minmax(110px,1fr)) auto; align-items:center; gap:16px; background:#fff; border:1px solid #eadfd3; border-left:5px solid #c27a3f; border-radius:16px; padding:14px 18px; margin-bottom:10px; transition:box-shadow .15s ease, border-color .15s ease; }
.people-person.has-log { border-left-color:#00b78c; }
.people-person:hover { box-shadow:0 8px 22px rgba(60,45,25,.08); border-color:#e3d5c4; }
.people-person-punchin { margin:-4px 0 10px 4px; color:#a08c78; font-size:11px; }
.people-identity { display:flex; align-items:center; gap:15px; }
.people-avatar { position:relative; display:grid; place-items:center; flex:0 0 52px; height:52px; border-radius:50%; background:#f5eee6; color:#a86935; font-size:18px; font-weight:600; }
/* Real signal, not decoration: reuses the same operatorshiftlogid presence that already
   drives .people-person.has-log, so the dot never claims a status the data doesn't support. */
.people-avatar::after { content:''; position:absolute; right:-1px; bottom:-1px; width:13px; height:13px; border-radius:50%; border:2px solid #fff; background:#c9922c; }
.people-person.has-log .people-avatar::after { background:#00b78c; }
.people-identity small { color:#a29486; font-size:11px; display:block; }
.people-identity strong { display:block; font-size:15px; margin:3px 0; }
.people-profile-label { display:inline-block; padding:3px 9px; border:1px solid #d9eee8; border-radius:12px; color:#008575; background:#f3fcf9; font-size:11px; }
.people-field strong { font-size:13px; font-weight:600; }
.people-row-actions { display:flex; align-items:center; gap:10px; }
.people-call { border:1px solid #eadfd3; padding:9px; border-radius:12px; color:#9d7858; display:flex; transition:background-color .18s ease, color .18s ease, border-color .18s ease; }
.people-call:hover { border-color:#c27a3f; color:#c27a3f; }
/* Marks "you called this person" locally — there is no real telephony status to reflect,
   so this never implies the call is live, only that it was placed from this device. */
.people-call.is-active { background:#00b78c; border-color:#00b78c; color:#fff; }
.people-call.is-calling { animation:people-call-pulse .55s ease; }
@keyframes people-call-pulse {
    0% { transform:scale(1); box-shadow:0 0 0 0 rgba(0,183,140,.45); }
    60% { transform:scale(1.14); box-shadow:0 0 0 9px rgba(0,183,140,0); }
    100% { transform:scale(1); box-shadow:0 0 0 0 rgba(0,183,140,0); }
}
.people-dialog { border:1px solid #eadfd3; border-radius:26px; padding:28px; width:510px; max-width:calc(100vw - 32px); max-height:85vh; color:#3e352c; box-shadow:0 20px 60px #0002; }
.people-dialog::backdrop { background:#0006; backdrop-filter:blur(3px); }
.people-dialog h2 { font-size:20px; margin:0 40px 20px 0; }
.people-dialog .people-close { position:absolute; top:16px; right:16px; border-radius:50%; padding:3px 11px; font-size:24px; }
.people-dialog label { display:block; margin:18px 0 7px; font-weight:600; font-size:13px; color:#927e69; }
.people-dialog input { width:100%; border:1px solid #eadfd3; padding:10px; border-radius:12px; background:#faf8f5; }
.people-dialog p { color:#9b8c7d; font-size:13px; }
#peopleAddDialog { width:520px; max-width:calc(100vw - 32px); max-height:calc(100vh - 48px); padding:0; overflow:visible; border:1px solid #eadfd3; border-radius:24px; background:#fff; box-shadow:0 22px 65px rgba(32,24,17,.24); color:#3e352c; }
#peopleAddDialog::backdrop { background:rgba(0,0,0,.45); backdrop-filter:blur(4px); }
#peopleAddDialog #peopleAddTitle { margin:0; padding:27px 28px 20px; border-bottom:1px solid #eee6de; font-size:20px; font-weight:700; line-height:1.3; }
#peopleAddDialog .people-close { position:absolute; z-index:3; top:17px; right:17px; display:grid; place-items:center; width:38px; height:38px; padding:0; border:1px solid #eadfd3; border-radius:50%; background:#fffaf4; color:#956f4f; font-size:22px; line-height:1; }
#peopleAddDialog .people-close:hover { border-color:#d9b897; background:#fff4e8; color:#8a5322; }
#peopleAddForm { padding:0 28px 26px; }
#peopleAddForm > p:first-of-type { margin:20px 0 22px; line-height:1.5; }
#peopleAddDialog label { margin:0 0 8px; color:#755b45; font-size:13px; font-weight:650; }
#peopleAddDialog label[for="peoplePunch"] { margin-top:20px; }
#peopleAddDialog #peoplePunch { box-sizing:border-box; min-height:44px; padding:9px 12px; border-color:#e5d6c7; border-radius:11px; background:#fcfaf7; color:#3e352c; }
#peopleAddDialog .select2-container { width:100% !important; }
#peopleAddDialog > .select2-container--open { left:28px !important; right:28px !important; width:auto !important; max-width:none !important; }
#peopleAddDialog .select2-container--default .select2-selection--single { height:44px !important; border:1px solid #e5d6c7; border-radius:11px; background:#fcfaf7 !important; }
#peopleAddDialog .select2-container--default .select2-selection--single .select2-selection__rendered { padding:3px 38px 3px 12px; line-height:36px !important; color:#3e352c !important; }
#peopleAddDialog .select2-container--default .select2-selection--single .select2-selection__arrow { height:42px !important; right:8px; }
#peopleAddDialog .select2-dropdown { box-sizing:border-box; width:100% !important; margin-top:5px; overflow:hidden; border:1px solid #d9b897; border-radius:12px; background:#fff; box-shadow:0 12px 28px rgba(55,37,20,.16); }
#peopleAddDialog .select2-search--dropdown { padding:8px; }
#peopleAddDialog .select2-search__field { box-sizing:border-box; width:100% !important; min-height:38px; border:1px solid #d9b897; border-radius:9px; background:#fff; }
#peopleAddDialog .select2-results__options { max-height:150px !important; overflow-y:auto; }
#peopleAddDialog .select2-results__option { padding:9px 12px; font-size:13px; }
#peopleAddDialog #peopleAddContext { min-height:20px; margin:10px 0 0; line-height:1.45; }
#peopleAddDialog #peopleAddStatus:empty { display:none; }
#peopleAddDialog .people-actions { display:grid; grid-template-columns:1fr 1fr; gap:12px; margin-top:20px; padding-top:20px; border-top:1px solid #eee6de; }
#peopleAddDialog .people-actions button { width:100%; min-height:46px; }
#peopleAddDialog .people-cancel { background:#fff; }
#peopleAddDialog .people-primary { background:#c27a3f; border-color:#c27a3f; color:#fff; }
.people-log-info { display:grid; grid-template-columns:1fr 1fr; gap:20px; padding:20px; background:#faf8f5; border-radius:18px; margin-bottom:24px; }
.people-log-event { border-left:2px solid #e6d9cc; padding:0 0 18px 18px; margin-left:5px; }
.people-log-event strong,.people-log-event small { display:block; }
.people-log-event small { color:#9b8c7d; margin-top:4px; }
.people-actions { display:flex; justify-content:flex-end; gap:12px; border-top:1px solid #eee; padding-top:20px; margin-top:20px; }
#peopleStatus:not(:empty) { padding:14px; background:white; border:1px solid #eadfd3; border-radius:12px; margin-bottom:20px; }
#peopleAddStatus { color:#ba2848; }
@media(max-width:1200px) { .people-metrics { grid-template-columns:repeat(2,1fr); } .people-person { grid-template-columns:2fr 1fr 1fr; } }
@media(max-width:650px) { .assignment-people { padding:16px; } .people-metrics { gap:10px; } .people-metric { padding:14px; gap:10px; } .people-metric .material-icons { padding:8px; } .people-person { grid-template-columns:1fr 1fr; padding:18px; } .people-identity,.people-row-actions { grid-column:1/-1; } }
@media(max-width:560px) { #peopleAddDialog { width:calc(100vw - 24px); } #peopleAddForm { padding:0 18px 20px; } #peopleAddDialog #peopleAddTitle { padding:24px 58px 18px 18px; } #peopleAddDialog > .select2-container--open { left:18px !important; right:18px !important; } }

/* Dispatcher routes and the telemetry drawer shared with Trip Sense. */


:is(body.dispatcher-page, body.dispatch-telemetry) {
        --bg-primary: #f8fafc;
        --bg-card: #ffffff;
        --bg-dark-badge: #f0c8a6;
        --text-main: #1e293b;
        --text-muted: #64748b;
        --border-color: #e2e8f0;
        --status-active-green: #22c55e;
        --alert-orange: #c37702;
        --brand-blue: #4f46e5;
        --brand-blue-bg: #e0e7ff;
        /* GPS trace colour — theme-adaptive, not orange (override per theme as needed) */
        --map-trace-color: #4f46e5;
        --tg-default-fill-color: #c7d2fe;
        --tg-default-border-color: #4f46e5;
        --radius-md: 8px;
        --transition-smooth: all 0.2s cubic-bezier(0.4, 0, 0.2, 1);
    }

:is(body.dispatcher-page, body.dispatch-telemetry).blue-theme {
        --tg-default-fill-color: #c7d2fe;
        --tg-default-border-color: #4f46e5;
    }

:is(body.dispatcher-page, body.dispatch-telemetry).brown-theme {
        --tg-default-fill-color: #f0c8a6;
        --tg-default-border-color: #c2712c;
    }

:is(body.dispatcher-page, body.dispatch-telemetry) * {
        box-sizing: border-box;
    }

body.dispatcher-page {
        background-color: var(--bg-primary);
        color: var(--text-main);
        line-height: 1.5;
        padding: 16px;
    }

:is(body.dispatcher-page, body.dispatch-telemetry) .provision-btn {
        background-color: var(--brand-blue);
        color: #ffffff;
        border: none;
        padding: 8px 16px;
        border-radius: 6px;
        font-weight: 600;
        font-size: 1.2rem;
        cursor: pointer;
        display: flex;
        align-items: center;
        gap: 6px;
        transition: var(--transition-smooth);
    }

:is(body.dispatcher-page, body.dispatch-telemetry) .provision-btn:hover {
            background-color: #4338ca;
        }

:is(body.dispatcher-page, body.dispatch-telemetry) #content {
        flex: 0 1 auto !important;
        min-height: auto !important;
        height: auto !important;
    }

:is(body.dispatcher-page, body.dispatch-telemetry) .main-content {
        height: auto !important;
    }

:is(body.dispatcher-page, body.dispatch-telemetry) #base {
        min-height: auto !important;
    }

:is(body.dispatcher-page, body.dispatch-telemetry) .dashboard-container {
        width: 100%;
        margin: 14px 0 0;
        position: relative;
        display: flex;
        flex-direction: column;
    }

:is(body.dispatcher-page, body.dispatch-telemetry) .dashboard-container.is-empty-state {
        min-height: calc(100vh - 180px);
    }

:is(body.dispatcher-page, body.dispatch-telemetry) .routes-section-header {
        display: flex;
        justify-content: space-between;
        align-items: center;
        margin-bottom: 12px;
        padding: 0 4px;
    }

:is(body.dispatcher-page, body.dispatch-telemetry) .section-title {
        font-size: 1.15rem;
        font-weight: 700;
        color: var(--text-main);
    }

:is(body.dispatcher-page, body.dispatch-telemetry) .section-actions {
        display: flex;
        align-items: center;
        gap: 8px;
    }

:is(body.dispatcher-page, body.dispatch-telemetry) .utility-btn {
        background: #ffffff;
        border: 1px solid var(--border-color);
        padding: 6px 14px;
        border-radius: 8px;
        font-size: 1.06rem;
        font-weight: 600;
        color: var(--text-main);
        cursor: pointer;
    }

:is(body.dispatcher-page, body.dispatch-telemetry) .section-actions .utility-btn:hover,
:is(body.dispatcher-page, body.dispatch-telemetry) .section-actions .utility-btn:focus,
:is(body.dispatcher-page, body.dispatch-telemetry) .section-actions .utility-btn:focus-visible,
:is(body.dispatcher-page, body.dispatch-telemetry) .section-actions .utility-btn:active {
            background: #ffffff !important;
            border: 1px solid var(--border-color) !important;
            color: var(--text-main) !important;
            outline: none !important;
            box-shadow: none !important;
        }

:is(body.dispatcher-page, body.dispatch-telemetry) .action-icon-trigger {
        background: #ffffff;
        border: 1px solid var(--border-color);
        width: 36px;
        height: 32px;
        border-radius: 8px;
        display: flex;
        align-items: center;
        justify-content: center;
        cursor: pointer;
        color: var(--text-muted);
    }

:is(body.dispatcher-page, body.dispatch-telemetry) .section-actions .action-icon-trigger:hover,
:is(body.dispatcher-page, body.dispatch-telemetry) .section-actions .action-icon-trigger:focus,
:is(body.dispatcher-page, body.dispatch-telemetry) .section-actions .action-icon-trigger:focus-visible,
:is(body.dispatcher-page, body.dispatch-telemetry) .section-actions .action-icon-trigger:active {
            background: #ffffff !important;
            border: 1px solid var(--border-color) !important;
            color: var(--text-muted) !important;
            outline: none !important;
            box-shadow: none !important;
        }

:is(body.dispatcher-page, body.dispatch-telemetry) .search-input-wrapper {
        position: relative;
        display: flex;
        align-items: center;
    }

:is(body.dispatcher-page, body.dispatch-telemetry) .search-icon-inline {
        position: absolute;
        left: 10px;
        width: 14px;
        height: 14px;
        color: var(--text-muted);
        pointer-events: none;
    }

:is(body.dispatcher-page, body.dispatch-telemetry) .route-search-input {
        width: 200px;
        padding: 6px 12px 6px 30px;
        border: 1px solid var(--border-color);
        border-radius: 8px;
        font-size: 0.8rem;
        color: var(--text-main);
    }

:is(body.dispatcher-page, body.dispatch-telemetry) #route-search-filter:focus,
:is(body.dispatcher-page, body.dispatch-telemetry) #route-search-filter:focus-visible,
:is(body.dispatcher-page, body.dispatch-telemetry) #route-search-filter:active {
            outline: none !important;
            border-color: var(--border-color) !important;
            box-shadow: none !important;
        }

:is(body.dispatcher-page, body.dispatch-telemetry) .route-search-input::placeholder {
            color: var(--text-muted);
        }

:is(body.dispatcher-page, body.dispatch-telemetry) .toolbar-divider {
        width: 1px;
        height: 20px;
        background: var(--border-color);
        margin: 0 4px;
    }

:is(body.dispatcher-page, body.dispatch-telemetry) .action-icon-trigger svg {
        width: 16px;
        height: 16px;
    }

:is(body.dispatcher-page, body.dispatch-telemetry) .filter-popover-wrapper {
        position: relative;
        display: flex;
    }

:is(body.dispatcher-page, body.dispatch-telemetry) .route-filter-popover {
        display: none;
        position: absolute;
        top: calc(100% + 8px);
        right: 0;
        z-index: 40;
        width: 280px;
        background: var(--bg-card);
        border: 1px solid var(--border-color);
        border-radius: 12px;
        box-shadow: 0 12px 24px -6px rgba(15, 23, 42, 0.18);
        padding: 16px;
    }

:is(body.dispatcher-page, body.dispatch-telemetry) .route-filter-popover.open {
            display: block;
        }

:is(body.dispatcher-page, body.dispatch-telemetry) .route-filter-popover-title {
        display: flex;
        align-items: center;
        gap: 8px;
        font-size: 0.9rem;
        font-weight: 700;
        color: var(--text-main);
        padding-bottom: 10px;
        margin-bottom: 12px;
        border-bottom: 1px solid var(--border-color);
    }

:is(body.dispatcher-page, body.dispatch-telemetry) .route-filter-popover-title svg {
            width: 14px;
            height: 14px;
            color: var(--alert-orange);
        }

:is(body.dispatcher-page, body.dispatch-telemetry) .route-filter-field {
        display: flex;
        flex-direction: column;
        gap: 6px;
        margin-bottom: 14px;
    }

:is(body.dispatcher-page, body.dispatch-telemetry) .route-filter-field:last-child {
            margin-bottom: 0;
        }

:is(body.dispatcher-page, body.dispatch-telemetry) .route-filter-label {
        font-size: 0.75rem;
        font-weight: 600;
        color: var(--text-muted);
    }

:is(body.dispatcher-page, body.dispatch-telemetry) .route-filter-select {
        padding: 8px 10px;
        border: 1px solid var(--border-color);
        border-radius: 8px;
        font-size: 0.8rem;
        color: var(--text-main);
        background: #ffffff;
    }

:is(body.dispatcher-page, body.dispatch-telemetry) .routes-grid {
        display: grid;
        grid-template-columns: 1fr;
        row-gap: 0;
        align-content: start;
        flex: 1;
    }

:is(body.dispatcher-page, body.dispatch-telemetry) .route-row-card {
        background-color: var(--bg-card);
        border: none;
        border-bottom: 1px solid var(--border-color);
        border-radius: 0;
        padding: 12px 4px;
        display: grid;
        grid-template-columns: 240px minmax(180px, 1fr) 130px minmax(180px, 1fr) 130px;
        align-items: start;
        column-gap: 18px;
    }

:is(body.dispatcher-page, body.dispatch-telemetry) .route-row-card.compatible-hauler-drop {
            border-color: #22c55e;
            box-shadow: 0 0 0 3px rgba(34, 197, 94, 0.18);
            background: #f0fdf4;
        }

:is(body.dispatcher-page, body.dispatch-telemetry) .route-row-card.incompatible-hauler-drop {
            border-color: #fca5a5;
            background: #fff7f7;
        }

:is(body.dispatcher-page, body.dispatch-telemetry) .route-header-cell {
        display: flex;
        align-items: center;
        justify-content: flex-start;
        gap: 12px;
    }

:is(body.dispatcher-page, body.dispatch-telemetry) .route-footer-cell {
        display: flex;
        align-items: center;
        justify-content: center;
        gap: 12px;
        margin-left: 10px;
    }

:is(body.dispatcher-page, body.dispatch-telemetry) .toggle-details-btn {
        background: none;
        border: none;
        display: flex;
        align-items: center;
        justify-content: center;
        padding: 0;
        color: var(--text-muted);
        cursor: pointer;
        transform: rotate(-90deg);
        transition: var(--transition-smooth);
    }

:is(body.dispatcher-page, body.dispatch-telemetry) .toggle-details-btn svg {
            width: 14px;
            height: 14px;
        }

:is(body.dispatcher-page, body.dispatch-telemetry) .toggle-details-btn.expanded {
            transform: rotate(0deg);
        }

:is(body.dispatcher-page, body.dispatch-telemetry) .badge-sh-id {
        display: flex;
        align-items: center;
        justify-content: center;
        background-color: var(--bg-dark-badge);
        color: #592c08;
        border: 1px solid #dc9d6f;
        box-sizing: border-box;
        width: 116px;
        min-width: 116px;
        max-width: 116px;
        min-height: 40px;
        padding: 9px 8px;
        border-radius: 8px;
        font-weight: 700;
        font-size: 1.1rem;
        line-height: 1.2;
        letter-spacing: 0.15px;
        text-align: center;
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
    }

:is(body.dispatcher-page, body.dispatch-telemetry) .route-header-meta {
        display: flex;
        flex-direction: column;
        align-items: flex-start;
        gap: 4px;
    }

:is(body.dispatcher-page, body.dispatch-telemetry) .route-header-top-row {
        display: flex;
        align-items: center;
        gap: 8px;
    }

:is(body.dispatcher-page, body.dispatch-telemetry) .route-header-bottom-row {
        display: flex;
        align-items: center;
        gap: 12px;
        min-height: 20px;
        white-space: nowrap;
    }

:is(body.dispatcher-page, body.dispatch-telemetry) .exchange-time-label {
        color: var(--text-muted);
        font-size: 0.96rem;
        font-weight: 600;
        white-space: nowrap;
    }

:is(body.dispatcher-page, body.dispatch-telemetry) .exchange-time-label strong {
            color: var(--text-main);
            font-weight: 700;
        }

:is(body.dispatcher-page, body.dispatch-telemetry) .route-hauler-counts {
        display: flex;
        align-items: center;
        flex-wrap: wrap;
        gap: 4px;
        margin-top: 2px;
    }

:is(body.dispatcher-page, body.dispatch-telemetry) .route-hauler-count-badge {
        display: inline-flex;
        align-items: center;
        padding: 2px 6px;
        border-radius: 8px;
        background: #eff6ff;
        color: #1d4ed8;
        font-size: 0.78rem;
        font-weight: 700;
        white-space: nowrap;
    }

:is(body.dispatcher-page, body.dispatch-telemetry) .locate-route-btn {
        background: #eef2ff;
        border: 1px solid #c7d2fe;
        color: var(--brand-blue);
        width: 26px;
        height: 26px;
        border-radius: 6px;
        display: flex;
        align-items: center;
        justify-content: center;
        cursor: pointer;
        font-size: 0.85rem;
        flex-shrink: 0;
        transition: var(--transition-smooth);
    }

:is(body.dispatcher-page, body.dispatch-telemetry) .locate-route-btn:hover {
            background: #e0e7ff;
        }

:is(body.dispatcher-page, body.dispatch-telemetry) .route-header-icon-col {
        display: flex;
        flex-direction: column;
        align-items: center;
        gap: 6px;
        flex-shrink: 0;
    }

:is(body.dispatcher-page, body.dispatch-telemetry) .copy-route-btn,
:is(body.dispatcher-page, body.dispatch-telemetry) .save-draft-btn,
:is(body.dispatcher-page, body.dispatch-telemetry) .delete-draft-btn {
        background: #eef2ff;
        border: 1px solid #c7d2fe;
        color: var(--brand-blue);
        width: 22px;
        height: 22px;
        border-radius: 6px;
        display: flex;
        align-items: center;
        justify-content: center;
        cursor: pointer;
        flex-shrink: 0;
        transition: var(--transition-smooth);
    }

:is(body.dispatcher-page, body.dispatch-telemetry) .copy-route-btn:hover {
            background: #e0e7ff;
        }

:is(body.dispatcher-page, body.dispatch-telemetry) .save-draft-btn {
        background: #dcfce7;
        border-color: #86efac;
        color: #16a34a;
    }

:is(body.dispatcher-page, body.dispatch-telemetry) .save-draft-btn:hover {
            background: #bbf7d0;
        }

:is(body.dispatcher-page, body.dispatch-telemetry) .delete-draft-btn {
        background: #fee2e2;
        border-color: #fca5a5;
        color: #dc2626;
    }

:is(body.dispatcher-page, body.dispatch-telemetry) .delete-draft-btn:hover {
            background: #fecaca;
        }

:is(body.dispatcher-page, body.dispatch-telemetry) .draft-copy-badge {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        width: 16px;
        height: 16px;
        margin-left: 4px;
        border-radius: 50%;
        background: #f97316;
        color: #fff;
        font-size: 0.6rem;
        font-weight: 800;
        vertical-align: super;
    }

:is(body.dispatcher-page, body.dispatch-telemetry) .material-tag-badge {
        display: inline-flex;
        align-items: center;
        flex-shrink: 0;
        white-space: nowrap;
        padding: 2px 10px;
        border-radius: 10px;
        font-size: 0.91rem;
        font-weight: 700;
        letter-spacing: 0.3px;
        text-transform: uppercase;
    }

:is(body.dispatcher-page, body.dispatch-telemetry) .material-tag-badge.pill-coal {
            background-color: #dcfce7;
            color: #166534;
        }

:is(body.dispatcher-page, body.dispatch-telemetry) .material-tag-badge.pill-waste {
            background-color: #ffedd5;
            color: #9a3412;
        }

:is(body.dispatcher-page, body.dispatch-telemetry) .material-tag-badge.pill-ore {
            background-color: #f3e8ff;
            color: #6b21a8;
        }

:is(body.dispatcher-page, body.dispatch-telemetry) .material-tag-badge.pill-crushed {
            background-color: #ecfeff;
            color: #0e7490;
        }

:is(body.dispatcher-page, body.dispatch-telemetry) .material-tag-badge.pill-default {
            background-color: #f1f5f9;
            color: #475569;
        }

:is(body.dispatcher-page, body.dispatch-telemetry) .track-segment-container {
        display: flex;
        flex-direction: column;
        align-items: stretch;
        gap: 6px;
        width: 100%;
        position: relative;
    }

:is(body.dispatcher-page, body.dispatch-telemetry) .track-top-row {
        display: flex;
        align-items: center;
        gap: 12px;
        width: 100%;
    }

:is(body.dispatcher-page, body.dispatch-telemetry) .time-stamp-label {
        font-size: 0.99rem;
        font-weight: 600;
        color: var(--text-muted);
        min-width: 45px;
    }

:is(body.dispatcher-page, body.dispatch-telemetry) .linear-timeline-rail {
        flex-grow: 1;
        height: 20px;
        background-color: transparent;
        border-radius: 6px;
        position: relative;
        transition: background-color 0.2s, border 0.2s;
    }

:is(body.dispatcher-page, body.dispatch-telemetry) .linear-timeline-rail::before {
            content: '';
            position: absolute;
            left: 0;
            right: 0;
            top: 50%;
            height: 2px;
            background-color: #e2e8f0;
            transform: translateY(-50%);
            border-radius: 1px;
        }

:is(body.dispatcher-page, body.dispatch-telemetry) .linear-timeline-rail.drag-target-hover {
            background-color: #e0e7ff !important;
        }

:is(body.dispatcher-page, body.dispatch-telemetry) .linear-timeline-rail.drag-target-hover::before {
                background-color: var(--brand-blue);
            }

:is(body.dispatcher-page, body.dispatch-telemetry) .route-vehicle-box-grid {
        display: grid;
        grid-template-columns: repeat(auto-fill, 132px);
        grid-auto-rows: 24px;
        gap: 5px 6px;
        width: 100%;
        justify-content: start;
        margin-left: 0;
        min-height: 0;
        max-height: 53px;
        overflow-x: hidden;
        overflow-y: auto;
        overscroll-behavior: contain;
        scrollbar-width: thin;
        scrollbar-color: #86efac #f0fdf4;
    }

:is(body.dispatcher-page, body.dispatch-telemetry) .route-vehicle-box-grid[data-vehicle-box-direction="dump"] {
            scrollbar-color: #93c5fd #eff6ff;
        }

:is(body.dispatcher-page, body.dispatch-telemetry) .route-vehicle-box-grid:empty {
            display: none;
        }

:is(body.dispatcher-page, body.dispatch-telemetry) .route-vehicle-box-grid::-webkit-scrollbar {
            width: 6px;
        }

:is(body.dispatcher-page, body.dispatch-telemetry) .route-vehicle-box-grid::-webkit-scrollbar-track {
            background: #f0fdf4;
            border-radius: 999px;
        }

:is(body.dispatcher-page, body.dispatch-telemetry) .route-vehicle-box-grid::-webkit-scrollbar-thumb {
            background: #86efac;
            border-radius: 999px;
        }

:is(body.dispatcher-page, body.dispatch-telemetry) .route-vehicle-box-grid[data-vehicle-box-direction="dump"]::-webkit-scrollbar-track {
            background: #eff6ff;
        }

:is(body.dispatcher-page, body.dispatch-telemetry) .route-vehicle-box-grid[data-vehicle-box-direction="dump"]::-webkit-scrollbar-thumb {
            background: #93c5fd;
        }

:is(body.dispatcher-page, body.dispatch-telemetry) .route-vehicle-box-grid.is-scrollable {
            padding-right: 3px;
        }

:is(body.dispatcher-page, body.dispatch-telemetry) .route-vehicle-box {
        display: flex;
        align-items: center;
        justify-content: center;
        gap: 3px;
        min-width: 0;
        width: 100%;
        height: 24px;
        padding: 3px 5px;
        border: 1px solid #86efac;
        border-radius: 7px;
        background: #dcfce7;
        color: #15803d;
        font-size: 0.8rem;
        font-weight: 800;
        line-height: 1.1;
        white-space: nowrap;
    }

:is(body.dispatcher-page, body.dispatch-telemetry) .route-vehicle-box.returning {
            border-color: #93c5fd;
            background: #dbeafe;
            color: #1d4ed8;
        }

:is(body.dispatcher-page, body.dispatch-telemetry) .route-vehicle-box.breakdown {
            border-color: #fca5a5;
            background: #fee2e2;
            color: #b91c1c;
        }

:is(body.dispatcher-page, body.dispatch-telemetry) .route-vehicle-box-icon {
        flex: 0 0 auto;
        font-size: 0.8rem;
        width: 12px;
        height: 12px;
        display: inline-block;
        background-color: currentColor;
        -webkit-mask-image: url('../images/Svg/truck.svg');
        mask-image: url('../images/Svg/truck.svg');
        -webkit-mask-size: contain;
        mask-size: contain;
        -webkit-mask-repeat: no-repeat;
        mask-repeat: no-repeat;
        -webkit-mask-position: center;
        mask-position: center;
    }

:is(body.dispatcher-page, body.dispatch-telemetry) .route-vehicle-box-icon img {
            display: none;
        }

:is(body.dispatcher-page, body.dispatch-telemetry) .route-vehicle-box-label {
        min-width: 0;
        overflow: hidden;
        text-overflow: ellipsis;
    }

:is(body.dispatcher-page, body.dispatch-telemetry) .route-vehicle-box.draggable-reassignment {
        cursor: grab;
        user-select: none;
    }

:is(body.dispatcher-page, body.dispatch-telemetry) .route-vehicle-box.draggable-reassignment:hover {
            border-color: #3b82f6;
            box-shadow: 0 2px 8px rgba(59, 130, 246, 0.22);
        }

:is(body.dispatcher-page, body.dispatch-telemetry) .route-vehicle-box.draggable-reassignment:active {
            cursor: grabbing;
        }

:is(body.dispatcher-page, body.dispatch-telemetry) .hub-terminal-node {
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        width: 100%;
        text-align: center;
        align-self: center;
    }

:is(body.dispatcher-page, body.dispatch-telemetry) .hub-destination-pill {
        display: inline-flex;
        align-items: center;
        gap: 8px;
        max-width: 100%;
        min-height: 44px;
        padding: 4px 14px 4px 5px;
        background: #ffffff;
        border: 1px solid #dbe4f0;
        border-radius: 999px;
        box-shadow: 0 2px 5px rgba(15, 23, 42, 0.08);
    }

:is(body.dispatcher-page, body.dispatch-telemetry) .hub-icon-wrapper {
        width: 34px;
        height: 34px;
        border-radius: 50%;
        display: flex;
        align-items: center;
        justify-content: center;
        color: #ffffff;
        flex: 0 0 34px;
        background-color: #1677ed;
        box-shadow: 0 2px 5px rgba(22, 119, 237, 0.25);
    }

:is(body.dispatcher-page, body.dispatch-telemetry) .hub-icon-wrapper svg {
            width: 22px;
            height: 22px;
            display: block;
        }

:is(body.dispatcher-page, body.dispatch-telemetry) .hub-icon-wrapper.type-stockpile {
            background-color: #1677ed;
        }

:is(body.dispatcher-page, body.dispatch-telemetry) .hub-icon-wrapper.type-dump {
            background-color: #1677ed;
        }

:is(body.dispatcher-page, body.dispatch-telemetry) .hub-icon-wrapper.type-crusher {
            background-color: #1677ed;
        }

:is(body.dispatcher-page, body.dispatch-telemetry) .hub-icon-wrapper.type-direct {
            background-color: #94a3b8;
        }

:is(body.dispatcher-page, body.dispatch-telemetry) .hub-label-text {
        max-width: 120px;
        overflow: hidden;
        text-overflow: ellipsis;
        font-size: 1.06rem;
        font-weight: 700;
        color: #17223b;
        white-space: nowrap;
    }

:is(body.dispatcher-page, body.dispatch-telemetry) .tipping-point-pill {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        gap: 5px;
        min-height: 24px;
        margin-top: 6px;
        font-size: 0.96rem;
        font-weight: 700;
        color: var(--text-muted);
        background: #f1f5f9;
        padding: 3px 12px;
        border: 1px solid #e2e8f0;
        border-radius: 12px;
        white-space: nowrap;
    }

:is(body.dispatcher-page, body.dispatch-telemetry) .tipping-point-pill svg {
            width: 14px;
            height: 14px;
            flex: 0 0 14px;
            color: #8ca0bd;
        }

:is(body.dispatcher-page, body.dispatch-telemetry) .set-dump-select {
        margin-top: 6px;
        font-size: 0.8rem;
        font-weight: 600;
        color: var(--text-main);
        background: #f8fafc;
        border: 1px solid #cbd5e1;
        border-radius: 6px;
        padding: 4px 6px;
        max-width: 150px;
    }

:is(body.dispatcher-page, body.dispatch-telemetry) .draft-required-invalid {
        border-color: #ef4444 !important;
        box-shadow: 0 0 0 2px rgba(239, 68, 68, 0.12);
    }

:is(body.dispatcher-page, body.dispatch-telemetry) .truck-telemetry-marker {
        position: absolute;
        top: 50%;
        transform: translate(-50%, -50%);
        display: flex;
        flex-direction: row;
        align-items: center;
        justify-content: center;
        gap: 2px;
        padding: 3px 5px;
        min-width: 24px;
        border-radius: 6px;
        border: 2px solid rgba(255,255,255,0.95);
        box-shadow: 0 3px 8px rgba(15,23,42,0.38);
        transition: left 0.4s linear;
        z-index: 10;
        cursor: grab;
        user-select: none;
    }

:is(body.dispatcher-page, body.dispatch-telemetry) .truck-telemetry-marker.locked {
            cursor: default;
        }

:is(body.dispatcher-page, body.dispatch-telemetry) .truck-telemetry-marker.color-coal {
            background-color: #16a34a;
        }

:is(body.dispatcher-page, body.dispatch-telemetry) .truck-telemetry-marker.color-waste {
            background-color: #f97316;
        }

:is(body.dispatcher-page, body.dispatch-telemetry) .truck-telemetry-marker.color-breakdown {
            background-color: #dc2626;
            animation: breakdown-pulse-ring 1.4s ease-out infinite;
        }

:is(body.dispatcher-page, body.dispatch-telemetry) .truck-telemetry-marker.color-empty {
            background-color: #eab308;
        }

:is(body.dispatcher-page, body.dispatch-telemetry) .truck-telemetry-marker.color-ore {
            background-color: #9333ea;
        }

:is(body.dispatcher-page, body.dispatch-telemetry) .truck-telemetry-marker.color-crushed {
            background-color: #06b6d4;
        }

:is(body.dispatcher-page, body.dispatch-telemetry) .truck-marker-icon {
        display: inline-flex;
        align-items: center;
        font-size: 0.85rem;
        line-height: 1;
        color: #ffffff;
    }

:is(body.dispatcher-page, body.dispatch-telemetry) .truck-marker-icon .icon-inline {
            width: 11px;
            height: 11px;
        }

:is(body.dispatcher-page, body.dispatch-telemetry) .truck-marker-label {
        font-size: 0.76rem;
        font-weight: 800;
        line-height: 1;
        color: #ffffff;
        letter-spacing: 0.15px;
        text-shadow: 0 1px 2px rgba(0, 0, 0, 0.65);
        white-space: nowrap;
    }

:is(body.dispatcher-page, body.dispatch-telemetry) .truck-telemetry-marker.truck-marker-cluster {
        min-width: 20px;
        padding: 0;
        background: transparent;
        border: 0;
        border-radius: 0;
        box-shadow: none;
        cursor: default;
    }

:is(body.dispatcher-page, body.dispatch-telemetry) .truck-cluster-count {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        min-width: 20px;
        height: 20px;
        padding: 0 5px;
        color: #ffffff;
        background: #b57423;
        border: 2px solid #ffffff;
        border-radius: 10px;
        font-size: 0.75rem;
        font-weight: 700;
        line-height: 1;
    }

:is(body.dispatcher-page, body.dispatch-telemetry) .truck-cluster-popover {
        display: none;
        position: absolute;
        top: 50%;
        left: 100%;
        z-index: 30;
        min-width: 120px;
        max-height: 112px;
        padding: 6px;
        overflow-x: hidden;
        overflow-y: auto;
        background: #ffffff;
        border: 1px solid #d9dde3;
        border-radius: 8px;
        box-shadow: 0 8px 20px rgba(15, 23, 42, 0.2);
        transform: translateY(-50%);
        scrollbar-width: thin;
        scrollbar-color: #cbd5e1 transparent;
    }

:is(body.dispatcher-page, body.dispatch-telemetry) .truck-marker-cluster.cluster-open-left .truck-cluster-popover {
        right: 100%;
        left: auto;
    }

:is(body.dispatcher-page, body.dispatch-telemetry) .truck-marker-cluster:hover .truck-cluster-popover,
:is(body.dispatcher-page, body.dispatch-telemetry) .truck-marker-cluster:focus-within .truck-cluster-popover {
        display: flex;
        flex-direction: column;
        gap: 4px;
    }

:is(body.dispatcher-page, body.dispatch-telemetry) .truck-telemetry-marker.truck-marker-cluster:hover,
:is(body.dispatcher-page, body.dispatch-telemetry) .truck-telemetry-marker.truck-marker-cluster:focus-within {
        z-index: 50;
    }

:is(body.dispatcher-page, body.dispatch-telemetry) .truck-cluster-item {
        display: flex;
        align-items: center;
        gap: 6px;
        width: 100%;
        padding: 5px 7px;
        color: #334155;
        background: #f8fafc;
        border: 1px solid #e2e8f0;
        border-radius: 5px;
        font-size: 0.75rem;
        font-weight: 700;
        line-height: 1.2;
        white-space: nowrap;
    }

:is(body.dispatcher-page, body.dispatch-telemetry) .truck-cluster-item[draggable="true"] {
        cursor: grab;
    }

:is(body.dispatcher-page, body.dispatch-telemetry) .truck-cluster-item[draggable="true"]:hover {
        color: #9c611b;
        background: #fff9f3;
        border-color: #d69a55;
    }

    @keyframes breakdown-pulse-ring {
        0% {
            box-shadow: 0 0 0 0 rgba(220, 38, 38, 0.55);
        }

        100% {
            box-shadow: 0 0 0 7px rgba(220, 38, 38, 0);
        }
    }

:is(body.dispatcher-page, body.dispatch-telemetry) .no-haulers-pill {
        grid-column: 1 / -1;
        color: #94a3b8;
        font-size: 0.72rem;
        font-weight: 400;
        font-style: italic;
        white-space: nowrap;
        pointer-events: none;
        text-align: left;
    }

:is(body.dispatcher-page, body.dispatch-telemetry) .live-vehicle-tooltip {
        position: fixed;
        background: #ffffff;
        color: var(--text-main);
        padding: 14px;
        border-radius: 8px;
        font-size: 0.8rem;
        min-width: 240px;
        box-shadow: 0 4px 12px rgba(0,0,0,0.12);
        z-index: 9999;
        pointer-events: none;
        display: none;
        border: 1px solid var(--border-color);
    }

:is(body.dispatcher-page, body.dispatch-telemetry) .tooltip-header {
        display: flex;
        justify-content: space-between;
        align-items: center;
        border-bottom: 1px solid var(--border-color);
        padding-bottom: 8px;
        margin-bottom: 8px;
    }

:is(body.dispatcher-page, body.dispatch-telemetry) .tooltip-id {
        font-weight: 700;
        color: #c2712c;
        font-size: 0.9rem;
    }

:is(body.dispatcher-page, body.dispatch-telemetry) .tooltip-status {
        font-size: 0.65rem;
        font-weight: 800;
        padding: 2px 8px;
        border-radius: 4px;
        text-transform: uppercase;
        color: #ffffff;
    }

:is(body.dispatcher-page, body.dispatch-telemetry) .tooltip-status.normal {
            background: #10b981;
        }

:is(body.dispatcher-page, body.dispatch-telemetry) .tooltip-status.delayed {
            background: #f59e0b;
        }

:is(body.dispatcher-page, body.dispatch-telemetry) .tooltip-status.alert {
            background: #ef4444;
        }

:is(body.dispatcher-page, body.dispatch-telemetry) .tooltip-row {
        display: flex;
        justify-content: space-between;
        margin-bottom: 5px;
    }

:is(body.dispatcher-page, body.dispatch-telemetry) .tooltip-label {
        color: var(--text-muted);
    }

:is(body.dispatcher-page, body.dispatch-telemetry) .tooltip-val {
        font-weight: 600;
        text-align: right;
        color: var(--text-main);
    }

:is(body.dispatcher-page, body.dispatch-telemetry) .tooltip-alert-msg {
        margin-top: 8px;
        padding-top: 6px;
        border-top: 1px dashed var(--border-color);
        color: #f59e0b;
        font-weight: 600;
        font-size: 0.7rem;
        display: flex;
        align-items: center;
        gap: 4px;
    }

:is(body.dispatcher-page, body.dispatch-telemetry) .expanded-telemetry-panel {
        grid-column: 1 / -1;
        border-top: 1px dashed var(--border-color);
        margin-top: 14px;
        padding-top: 12px;
    }

:is(body.dispatcher-page, body.dispatch-telemetry) .expanded-telemetry-panel.hidden-state {
            display: none;
        }

:is(body.dispatcher-page, body.dispatch-telemetry) .expanded-grid-2col {
        display: grid;
        grid-template-columns: 1fr 1.2fr;
        gap: 16px;
        align-items: start;
    }

:is(body.dispatcher-page, body.dispatch-telemetry) .detail-cards-col {
        display: flex;
        flex-direction: column;
        gap: 12px;
    }

:is(body.dispatcher-page, body.dispatch-telemetry) .mini-detail-card {
        background: #ffffff;
        border: 1px solid var(--border-color);
        border-radius: var(--radius-md);
        padding: 14px;
        box-shadow: 0 1px 2px rgba(0, 0, 0, 0.04);
        height: 150px;
    }

:is(body.dispatcher-page, body.dispatch-telemetry) .mini-detail-header {
        display: flex;
        justify-content: space-between;
        align-items: center;
        border-bottom: 1px solid var(--border-color);
        padding-bottom: 8px;
        margin-bottom: 8px;
    }

:is(body.dispatcher-page, body.dispatch-telemetry) .mini-detail-title {
        font-size: 0.95rem;
        font-weight: 700;
        letter-spacing: 0.3px;
        color: var(--text-main);
        display: flex;
        align-items: center;
        gap: 6px;
    }

:is(body.dispatcher-page, body.dispatch-telemetry) .mini-detail-title::before {
            content: '';
            width: 6px;
            height: 6px;
            border-radius: 50%;
            background-color: var(--status-active-green);
            display: inline-block;
        }

:is(body.dispatcher-page, body.dispatch-telemetry) .mini-detail-card--dump .mini-detail-title::before {
        background-color: #1d4ed8;
    }

:is(body.dispatcher-page, body.dispatch-telemetry) .status-pill-tiny {
        font-size: 0.68rem;
        font-weight: 800;
        text-transform: uppercase;
        padding: 2px 8px;
        border-radius: 4px;
    }

:is(body.dispatcher-page, body.dispatch-telemetry) .status-pill-tiny.active {
            background-color: #dcfce7;
            color: #166534;
        }

:is(body.dispatcher-page, body.dispatch-telemetry) .status-pill-tiny.tipping {
            background-color: #dbeafe;
            color: #1d4ed8;
        }

:is(body.dispatcher-page, body.dispatch-telemetry) .detail-row {
        display: flex;
        justify-content: space-between;
        align-items: center;
        font-size: 0.85rem;
        padding: 5px 0;
    }

:is(body.dispatcher-page, body.dispatch-telemetry) .detail-label {
        color: var(--text-muted);
        display: flex;
        align-items: center;
        gap: 6px;
        font-size: 1.1rem;
    }

:is(body.dispatcher-page, body.dispatch-telemetry) .detail-value-group {
        display: flex;
        flex-direction: column;
        align-items: flex-end;
    }

:is(body.dispatcher-page, body.dispatch-telemetry) .detail-value-main {
        font-weight: 700;
        color: var(--text-main);
        font-size: 0.85rem;
    }

:is(body.dispatcher-page, body.dispatch-telemetry) .detail-value-sub {
        font-size: 1.1rem;
        color: var(--text-muted);
    }

:is(body.dispatcher-page, body.dispatch-telemetry) .detail-chip {
        background-color: #f1f5f9;
        color: var(--text-main);
        font-weight: 600;
        font-size: 0.85rem;
        padding: 3px 10px;
        border-radius: 6px;
    }

:is(body.dispatcher-page, body.dispatch-telemetry) .detail-chip.chip-green {
            background-color: #dcfce7;
            color: #166534;
        }

:is(body.dispatcher-page, body.dispatch-telemetry) .haul-fleet-card {
        background: #ffffff;
        border: 1px solid var(--border-color);
        border-radius: var(--radius-md);
        padding: 14px;
        display: flex;
        flex-direction: column;
        gap: 14px;
        height: 310px;
        box-shadow: 0 1px 2px rgba(0, 0, 0, 0.04);
    }

:is(body.dispatcher-page, body.dispatch-telemetry) .haul-fleet-header {
        font-size: 1rem;
        font-weight: 700;
        color: var(--text-main);
        display: flex;
        align-items: center;
        gap: 6px;
        border-bottom: 1px solid var(--border-color);
        padding-bottom: 8px;
    }

:is(body.dispatcher-page, body.dispatch-telemetry) .haul-fleet-header-icon {
            color: var(--text-muted);
            display: inline-flex;
            flex-shrink: 0;
        }

:is(body.dispatcher-page, body.dispatch-telemetry) .haul-fleet-list {
        display: flex;
        flex-direction: column;
        gap: 8px;
        max-height: 120px;
        overflow-y: auto;
        padding-right: 2px;
    }

:is(body.dispatcher-page, body.dispatch-telemetry) .haul-fleet-list--staged {
            margin-top: 6px;
        }

:is(body.dispatcher-page, body.dispatch-telemetry) .haul-fleet-list::-webkit-scrollbar {
            width: 5px;
        }

:is(body.dispatcher-page, body.dispatch-telemetry) .haul-fleet-list::-webkit-scrollbar-thumb {
            background: var(--border-color);
            border-radius: 3px;
        }

:is(body.dispatcher-page, body.dispatch-telemetry) .haul-fleet-row {
        display: flex;
        justify-content: space-between;
        align-items: center;
        padding: 10px;
        border: 1px solid var(--border-color);
        border-radius: var(--radius-md);
        cursor: grab;
    }

:is(body.dispatcher-page, body.dispatch-telemetry) .fleet-row-left {
        display: flex;
        align-items: center;
        gap: 10px;
    }

:is(body.dispatcher-page, body.dispatch-telemetry) .fleet-status-dot {
        width: 8px;
        height: 8px;
        border-radius: 50%;
        flex-shrink: 0;
    }

:is(body.dispatcher-page, body.dispatch-telemetry) .fleet-status-dot.dot-green {
            background-color: #22c55e;
        }

:is(body.dispatcher-page, body.dispatch-telemetry) .fleet-status-dot.dot-amber {
            background-color: #f59e0b;
        }

:is(body.dispatcher-page, body.dispatch-telemetry) .fleet-status-dot.dot-red {
            background-color: #ef4444;
        }

:is(body.dispatcher-page, body.dispatch-telemetry) .fleet-id-block {
        display: flex;
        flex-direction: column;
    }

:is(body.dispatcher-page, body.dispatch-telemetry) .fleet-truck-id {
        font-weight: 700;
        font-size: 1.1rem;
        color: var(--text-main);
    }

:is(body.dispatcher-page, body.dispatch-telemetry) .fleet-driver-name {
        font-size: 0.75rem;
        color: var(--text-muted);
    }

:is(body.dispatcher-page, body.dispatch-telemetry) .hauler-operator-dropzone {
        display: inline-block;
        padding: 2px 6px;
        border: 1px dashed #d97706;
        border-radius: 4px;
        color: #d97706;
        background: rgba(217, 119, 6, 0.08);
        cursor: pointer;
    }

:is(body.dispatcher-page, body.dispatch-telemetry) .hauler-operator-dropzone.dropzone-active {
            border-color: #16a34a;
            color: #16a34a;
            background: rgba(22, 163, 74, 0.12);
        }

:is(body.dispatcher-page, body.dispatch-telemetry) .fleet-row-right {
        display: flex;
        align-items: center;
        gap: 10px;
    }

:is(body.dispatcher-page, body.dispatch-telemetry) .route-report-actions { margin-left:2px;display:inline-flex;align-items:center; }

:is(body.dispatcher-page, body.dispatch-telemetry) .route-report-actions .dropdown-toggle {
        display: inline-flex;
        align-items: center;
        gap: 4px;
        height: 22px;
        min-height: 22px;
        padding: 2px 7px;
        border: 1px solid #d69a55;
        border-radius: 8px;
        background: #fff9f3;
        color: #9c611b;
        font-size: 0.78rem;
        line-height:1;
        font-weight: 700;
    }

:is(body.dispatcher-page, body.dispatch-telemetry) .route-report-actions .dropdown-toggle svg { width:13px;height:13px; }

:is(body.dispatcher-page, body.dispatch-telemetry) .route-report-actions .dropdown-toggle:hover,
:is(body.dispatcher-page, body.dispatch-telemetry) .route-report-actions .dropdown-toggle:focus {
        background:#fff3e6;
        border-color:#c8871a;
        color:#8a5417;
        outline:none;
        box-shadow:none;
    }

:is(body.dispatcher-page, body.dispatch-telemetry) .route-report-actions .dropdown-menu { min-width:185px; }

:is(body.dispatcher-page, body.dispatch-telemetry) .route-report-actions .dropdown-item { cursor:pointer;padding:9px 13px; }

:is(body.dispatcher-page, body.dispatch-telemetry) .fleet-speed-val {
         font-size: 1.1rem;
        color: var(--text-muted);
        white-space: nowrap;
    }

:is(body.dispatcher-page, body.dispatch-telemetry) .fleet-status-pill {
         font-size: 1.1rem;
        font-weight: 700;
        padding: 3px 8px;
        border-radius: 4px;
        white-space: nowrap;
    }

:is(body.dispatcher-page, body.dispatch-telemetry) .fleet-status-pill.fleet-pill-good {
            background-color: #dcfce7;
            color: #166534;
        }

:is(body.dispatcher-page, body.dispatch-telemetry) .fleet-status-pill.fleet-pill-neutral {
            background-color: #f1f5f9;
            color: #475569;
        }

:is(body.dispatcher-page, body.dispatch-telemetry) .fleet-status-pill.fleet-pill-alert {
            background-color: #fee2e2;
            color: #991b1b;
        }

:is(body.dispatcher-page, body.dispatch-telemetry) .fleet-trips-pill {
        font-size: 1.1rem;
        font-weight: 600;
        color: var(--text-muted);
        background-color: #f1f5f9;
        padding: 3px 8px;
        border-radius: 4px;
        white-space: nowrap;
    }

:is(body.dispatcher-page, body.dispatch-telemetry) .fleet-empty-msg {
        text-align: center;
        color: var(--text-muted);
       font-size: 1.1rem;
        font-weight: 600;
        padding: 24px 16px;
        border: 1px dashed var(--border-color);
        border-radius: var(--radius-md);
    }

:is(body.dispatcher-page, body.dispatch-telemetry) .fleet-empty-msg span {
            display: block;
            margin-top: 6px;
            font-size: 0.8rem;
            font-weight: 500;
            opacity: .85;
        }

:is(body.dispatcher-page, body.dispatch-telemetry) .allocation-drop-zone {
        border: 1px dashed #d97706;
        background-color: rgba(217, 119, 6, 0.04);
        border-radius: var(--radius-md);
        padding: 16px;
        text-align: center;
        transition: background-color 0.2s, border-color 0.2s;
        margin-top: 10px;
    }

:is(body.dispatcher-page, body.dispatch-telemetry) .allocation-drop-zone.drag-target-hover {
            background-color: #e0e7ff;
            border-color: var(--brand-blue);
        }

:is(body.dispatcher-page, body.dispatch-telemetry) .drop-zone-icon {
        width: 32px;
        height: 32px;
        border-radius: 50%;
        background-color: rgba(217, 119, 6, 0.1);
        display: flex;
        align-items: center;
        justify-content: center;
        margin: 0 auto 6px;
    }

:is(body.dispatcher-page, body.dispatch-telemetry) .drop-zone-title {
        font-size: 1rem;
        font-weight: 700;
        color: var(--text-main);
        margin-top: 4px;
    }

:is(body.dispatcher-page, body.dispatch-telemetry) .drop-zone-subtitle {
        font-size: 1.1rem;
        line-height: 1.4;
        color: var(--text-muted);
        margin-top: 2px;
    }

:is(body.dispatcher-page, body.dispatch-telemetry) .staged-fleet-header {
        margin-top: 12px;
        padding-top: 12px;
        border-top: 1px dashed var(--border-color);
        display: flex;
        align-items: center;
        justify-content: space-between;
    }

:is(body.dispatcher-page, body.dispatch-telemetry) .staged-fleet-title {
        font-weight: 600;
        font-size: 0.85rem;
        color: var(--text-muted);
    }

:is(body.dispatcher-page, body.dispatch-telemetry) .save-staged-haulers-btn {
        background: none;
        border: none;
        color: var(--brand-blue);
        cursor: pointer;
        padding: 2px 4px;
        display: flex;
        align-items: center;
    }

:is(body.dispatcher-page, body.dispatch-telemetry) .remove-staged-hauler-btn {
        background: none;
        border: none;
        color: #ef4444;
        cursor: pointer;
        padding: 2px 6px;
        font-weight: bold;
        font-size: 0.95rem;
        display: flex;
        align-items: center;
        justify-content: center;
        margin-left: 8px;
    }

:is(body.dispatcher-page, body.dispatch-telemetry) .fleet-driver-name-static {
        color: var(--text-muted);
       font-size: 1.1rem;
        font-weight: 500;
    }

:is(body.dispatcher-page, body.dispatch-telemetry) .staged-empty-msg {
        padding: 10px;
        border: 1px dashed var(--border-color);
        border-radius: 6px;
        text-align: center;
        color: var(--text-muted);
        font-size: 0.85rem;
    }

:is(body.dispatcher-page, body.dispatch-telemetry) .inventory-loader {
        text-align: center;
        padding: 8px;
    }

:is(body.dispatcher-page, body.dispatch-telemetry) .inline-set-field {
        width: 150px;
        font-size: 0.75rem;
        padding: 3px 6px;
        border-radius: 5px;
        border: 1px solid var(--border-color);
    }

:is(body.dispatcher-page, body.dispatch-telemetry) .allocate-btn {
        background-color: #fef3c7;
        color: #92400e;
        border: none;
        font-size: 0.65rem;
        font-weight: 800;
        letter-spacing: 0.3px;
        padding: 4px 10px;
        border-radius: 4px;
        cursor: pointer;
        transition: background-color 0.15s;
    }

:is(body.dispatcher-page, body.dispatch-telemetry) .allocate-btn:hover {
            background-color: #fde68a;
        }

:is(body.dispatcher-page, body.dispatch-telemetry) .quick-notice-toast {
            position: fixed;
            bottom: 24px;
            right: 24px;
            background: #0f172a;
            color: #ffffff;
            padding: 10px 16px;
            border-radius: 8px;
            font-size: 0.8rem;
            box-shadow: 0 10px 20px -5px rgba(0,0,0,0.25);
            z-index: 2000;
            opacity: 0;
            transition: opacity 0.25s ease;
        }

:is(body.dispatcher-page, body.dispatch-telemetry) .quick-notice-toast.visible {
                opacity: 1;
            }

:is(body.dispatcher-page, body.dispatch-telemetry) .modal-overlay-shroud {
            position: fixed;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
            background: rgba(15, 23, 42, 0.4);
            backdrop-filter: blur(2px);
            display: flex;
            align-items: center;
            justify-content: center;
            z-index: 5000;
            opacity: 0;
            pointer-events: none;
            transition: opacity 0.2s ease;
        }

:is(body.dispatcher-page, body.dispatch-telemetry) .modal-overlay-shroud.active {
            opacity: 1;
            pointer-events: auto;
        }

:is(body.dispatcher-page, body.dispatch-telemetry) #gps-filter-modal {
        z-index: 9999999 !important;
    }

:is(body.dispatcher-page, body.dispatch-telemetry) .modal-window-frame {
        background: #ffffff;
        border-radius: 12px;
        width: 100%;
        max-width: 520px;
        max-height: 88vh;
        box-shadow: 0 20px 25px -5px rgba(0, 0, 0, 0.1);
        display: flex;
        flex-direction: column;
        overflow: hidden;
    }

:is(body.dispatcher-page, body.dispatch-telemetry) .modal-header-block {
        background: #0f172a;
        color: #ffffff;
        padding: 16px 20px;
        display: flex;
        justify-content: space-between;
        align-items: center;
        flex-shrink: 0;
    }

:is(body.dispatcher-page, body.dispatch-telemetry) .modal-header-block h3 {
            font-size: 1.5rem;
            font-weight: 700;
        }

:is(body.dispatcher-page, body.dispatch-telemetry) .modal-close-trigger {
        background: transparent;
        border: none;
        color: #94a3b8;
        font-size: 1.2rem;
        cursor: pointer;
    }

:is(body.dispatcher-page, body.dispatch-telemetry) .modal-body-form {
        padding: 20px;
        display: flex;
        flex-direction: column;
        gap: 16px;
        overflow-y: auto;
        min-height: 0;
    }

:is(body.dispatcher-page, body.dispatch-telemetry) .form-row-dual {
        display: grid;
        grid-template-columns: 1fr 1fr;
        gap: 16px;
    }

:is(body.dispatcher-page, body.dispatch-telemetry) .form-field-group {
        display: flex;
        flex-direction: column;
        gap: 6px;
    }

:is(body.dispatcher-page, body.dispatch-telemetry) .form-field-group label {
            font-size: 1rem;
            font-weight: 700;
            color: var(--text-muted);
        }

:is(body.dispatcher-page, body.dispatch-telemetry) .form-input-control {
        padding: 10px 12px;
        border-radius: 6px;
        border: 1px solid var(--border-color);
        font-size: 0.85rem;
        color: var(--text-main);
        background: #ffffff;
        width: 100%;
    }

:is(body.dispatcher-page, body.dispatch-telemetry) .cargo-selector-rack {
        display: grid;
        grid-template-columns: 1fr 1fr;
        gap: 12px;
    }

:is(body.dispatcher-page, body.dispatch-telemetry) .cargo-option-pill {
        border: 1px solid var(--border-color);
        padding: 10px;
        border-radius: 6px;
        text-align: center;
        font-size: 0.8rem;
        font-weight: 700;
        color: var(--text-muted);
        cursor: pointer;
    }

:is(body.dispatcher-page, body.dispatch-telemetry) .cargo-option-pill.active {
            background: #eeebff;
            border-color: var(--brand-blue);
            color: var(--brand-blue);
        }

:is(body.dispatcher-page, body.dispatch-telemetry) .modal-footer-actions {
        position: static;
        left: auto;
        right: auto;
        bottom: auto;
        z-index: auto;
        background: transparent;
        display: flex;
        justify-content: flex-end;
        align-items: center;
        gap: 12px;
        border-top: 1px solid var(--border-color);
        padding-top: 16px;
        flex-shrink: 0;
    }

:is(body.dispatcher-page, body.dispatch-telemetry) .btn-link-dismiss {
        background: transparent;
        border: none;
        font-size: 0.85rem;
        font-weight: 600;
        color: var(--text-muted);
        cursor: pointer;
    }

:is(body.dispatcher-page, body.dispatch-telemetry) .telemetry-page-view {
        position: fixed;
        inset: 0;
        top: 0;
        z-index: 999999;
        background: rgba(15, 18, 32, 0.35);
        overflow: hidden;
        pointer-events: none;
        visibility: hidden;
        opacity: 0;
        transition: opacity .3s ease, visibility 0s linear .35s;
    }
/* Hidden via visibility (NOT display:none) so the Google Map inside keeps its size and
           re-opens correctly after a close. It stays out of flow because the page is position:fixed,
           and the leak is prevented by keeping the page inside its tab (destroyed on tab switch)
           and by not using the native Fullscreen API. */
:is(body.dispatcher-page, body.dispatch-telemetry) .telemetry-page-view.active {
            visibility: visible;
            opacity: 1;
            transition: opacity .3s ease;
        }

:is(body.dispatcher-page, body.dispatch-telemetry) .telemetry-page-view.active .telemetry-page-inner {
        pointer-events: auto;
    }

:is(body.dispatcher-page, body.dispatch-telemetry) .telemetry-page-inner {
        position: absolute;
        top: 0;
        right: 0;
        bottom: 0;
        width: 56%;
        max-width: 920px;
        min-width: 480px;
        margin: 0;
        padding: 0px 24px 24px 20px;
        background: #f2f3f5;
        box-shadow: -14px 0 40px rgba(0, 0, 0, 0.25);
        /* flex column so the map fills whatever space the header + (collapsed/expanded)
           drawing form leave behind — perfect fit, no page scroll */
        display: flex;
        flex-direction: column;
        overflow: hidden;
        transform: translateX(105%);
        transition: transform .35s ease;
    }

:is(body.dispatcher-page, body.dispatch-telemetry) .telemetry-page-view.active .telemetry-page-inner {
        /* MUST be `none`, not translateX(0): any transform value makes this a containing block
           for position:fixed descendants, which would trap the full-screen map (tg-map-full)
           inside this 56%-wide panel instead of filling the real viewport. `none` still animates
           in from the inactive translateX(105%). */
        transform: none;
    }

:is(body.dispatcher-page, body.dispatch-telemetry) .telemetry-modal-header {
             align-items: center;
             display: flex;
             justify-content: space-between;
             flex-wrap: nowrap;            /* title and filters share one row, never stacked */
             flex: 0 0 auto;               /* fixed height in the flex column; never squeezed */
             gap: 10px;
             padding: 12px 0;
             border-bottom: 1px solid #fbe4c8;
             margin-bottom: 10px;
             background: #ffffff;
             position: sticky;
             top: 0;
             z-index: 5;
        }

:is(body.dispatcher-page, body.dispatch-telemetry) .telemetry-modal-header .gps-online-badge,
:is(body.dispatcher-page, body.dispatch-telemetry) .telemetry-modal-header .telemetry-header-left {
                white-space: nowrap;
                flex-shrink: 0;
            }

:is(body.dispatcher-page, body.dispatch-telemetry) .telemetry-modal-header .gps-active-filters-bar {
                flex: 1 1 auto;
                min-width: 0;
                justify-content: flex-end;
                flex-wrap: wrap;
                row-gap: 4px;
                border: none;
                background: transparent;
                padding: 0;
                margin: 0 0 0 auto;
            }

:is(body.dispatcher-page, body.dispatch-telemetry) .telemetry-modal-header .gps-filter-pill {
                white-space: nowrap;
            }

:is(body.dispatcher-page, body.dispatch-telemetry) .telemetry-header-left {
            display: flex;
            gap: 18px;
            align-items: center;
            margin-left: 14px;
        }


    @keyframes telemetry-icon-spin {
        from {
            transform: rotate(0deg);
        }

        to {
            transform: rotate(360deg);
        }
    }

:is(body.dispatcher-page, body.dispatch-telemetry) .telemetry-header-top-row {
        display: flex;
        align-items: center;
        gap: 8px;
    }

:is(body.dispatcher-page, body.dispatch-telemetry) .gps-online-badge {
        display: inline-flex;
        align-items: center;
        gap: 10px;
        background: transparent;
        color: #0f172a;
        font-size: 1.18rem;
        font-weight: 800;
        letter-spacing: 0.3px;
        padding: 0;
        border-radius: 0;
        text-transform: none;
    }

:is(body.dispatcher-page, body.dispatch-telemetry) .gps-title-ico {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        width: 38px;
        height: 38px;
        border-radius: 8px;
        background: #fbe4c8;
        border: none;
        flex-shrink: 0;
    }

:is(body.dispatcher-page, body.dispatch-telemetry) .telemetry-header-subtitle {
        font-size: 1.2rem;
        color: #f7f2f2;
    }

:is(body.dispatcher-page, body.dispatch-telemetry) .telemetry-header-title {
        font-size: 1.5rem;
        font-weight: 700;
        color: #f7f2f2;
    }

:is(body.dispatcher-page, body.dispatch-telemetry) .telemetry-back-trigger {
        background: #ffffff !important;
        border: 1px solid #ccc !important;
        border-radius: 50%;
        width: 32px;
        height: 32px;
        display: flex;
        align-items: center;
        justify-content: center;
        cursor: pointer;
        flex-shrink: 0;
        margin-top: 10px;
    }

:is(body.dispatcher-page, body.dispatch-telemetry) .telemetry-back-trigger:hover {
            background: var(--bg-primary) !important;
            border: 1px solid #ccc !important;
        }

:is(body.dispatcher-page, body.dispatch-telemetry) .gps-active-filters-bar {
        display: flex;
        align-items: center;
        flex-wrap: wrap;
        gap: 8px;
        padding: 10px 0 0;
    }

:is(body.dispatcher-page, body.dispatch-telemetry) .gps-filters-label {
        font-size: 0.83rem;
        font-weight: 700;
        letter-spacing: 0.04em;
        color: #4d535c;
        text-transform: uppercase;
    }

:is(body.dispatcher-page, body.dispatch-telemetry) .gps-filter-pill {
        font-size: 1.08rem;
        color: #c2712c;
        background: #ffffff;
        border: 1px solid #c2712c;
        border-radius: 999px;
        padding: 4px 10px;
    }

:is(body.dispatcher-page, body.dispatch-telemetry) .gps-filter-pill strong {
            color: #c2712c;
            font-weight: 800;
        }

:is(body.dispatcher-page, body.dispatch-telemetry) .gps-filters-btn {
        margin-left: auto;
        align-self: center;
        display: inline-flex;
        align-items: center;
        line-height: 1;
        gap: 10px;
        background: #d17a2d !important;
        color: #ffffff;
        border: none !important;
        font-size: 1.4rem;
        font-weight: 700;
        padding: 10px 20px;
        border-radius: 10px;
        cursor: pointer;
    }

:is(body.dispatcher-page, body.dispatch-telemetry) .gps-filters-btn .icon-inline {
            width: 1.1em;
            height: 1.1em;
        }

:is(body.dispatcher-page, body.dispatch-telemetry) .gps-filters-btn:hover {
            background: #b86622 !important;
            color: #ffffff !important;
            border: none !important;
        }

:is(body.dispatcher-page, body.dispatch-telemetry) .gps-filters-btn:focus,
:is(body.dispatcher-page, body.dispatch-telemetry) .gps-filters-btn:focus-visible,
:is(body.dispatcher-page, body.dispatch-telemetry) .gps-filters-btn:active {
            outline: none !important;
            box-shadow: none !important;
        }

:is(body.dispatcher-page, body.dispatch-telemetry) .gps-header-close-btn {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        width: 40px;
        height: 40px;
        background: transparent;
        color: #94a3b8;
        border: none;
        font-size: 1.8rem;
        line-height: 1;
        cursor: pointer;
        border-radius: 6px;
    }

:is(body.dispatcher-page, body.dispatch-telemetry) .gps-header-close-btn:hover {
            background: #f1f5f9;
            color: #334155;
        }

:is(body.dispatcher-page, body.dispatch-telemetry) .gps-excavator-checklist {
        border: 1px solid #e2e8f0;
        border-radius: 8px;
        max-height: 220px;
        overflow-y: auto;
    }

:is(body.dispatcher-page, body.dispatch-telemetry) .gps-excavator-row {
        display: flex;
        align-items: flex-start;
        gap: 10px;
        padding: 10px 12px;
        border-bottom: 1px solid #eef1f5;
        cursor: pointer;
    }

:is(body.dispatcher-page, body.dispatch-telemetry) .gps-excavator-row:last-child {
            border-bottom: none;
        }

:is(body.dispatcher-page, body.dispatch-telemetry) .gps-excavator-row input[type="checkbox"] {
            margin-top: 3px;
        }

:is(body.dispatcher-page, body.dispatch-telemetry) .gps-excavator-row-title {
        font-size: 0.85rem;
        font-weight: 700;
        color: #0f172a;
    }

:is(body.dispatcher-page, body.dispatch-telemetry) .gps-excavator-row-sub {
        font-size: 0.72rem;
        color: #64748b;
    }

:is(body.dispatcher-page, body.dispatch-telemetry) .gps-readonly-field {
        background: #f1f5f9;
        border: 1px solid #e2e8f0;
        border-radius: 8px;
        padding: 10px 12px;
        font-size: 0.85rem;
        font-weight: 600;
        color: #0f172a;
    }

:is(body.dispatcher-page, body.dispatch-telemetry) .telemetry-stat-row {
        display: none;
        grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
        gap: 12px;
        padding: 16px 0;
    }

:is(body.dispatcher-page, body.dispatch-telemetry) .telemetry-stat-card {
        background: var(--bg-primary);
        border: 1px solid var(--border-color);
        border-radius: var(--radius-md);
        padding: 12px 14px;
    }

:is(body.dispatcher-page, body.dispatch-telemetry) .telemetry-stat-label {
        font-size: 1.1rem;
        font-weight: 700;
        color: var(--text-muted);
        text-transform: uppercase;
        letter-spacing: 0.3px;
        margin-bottom: 6px;
    }

:is(body.dispatcher-page, body.dispatch-telemetry) .telemetry-stat-value-row {
        display: flex;
        align-items: center;
        gap: 6px;
        font-weight: 700;
        font-size: 1rem;
        color: var(--text-main);
    }

:is(body.dispatcher-page, body.dispatch-telemetry) .telemetry-stat-sub {
        font-size: 0.95rem;
        color: var(--text-muted);
        margin-top: 2px;
    }

:is(body.dispatcher-page, body.dispatch-telemetry) .telemetry-map-shell {
        padding: 0 0 12px;
        /* grow to fill the space left over above the drawing form */
        flex: 1 1 auto;
        min-height: 0;
        display: flex;
    }

:is(body.dispatcher-page, body.dispatch-telemetry) .telemetry-map-viewport {
        position: relative;
        background: #ffffff;
        border-radius: 12px;
        padding: 0; /* map fills the outer white card fully; toolbar floats over the map */
        flex: 1 1 auto;
        min-height: 0;
        display: flex;
        flex-direction: column;
    }

:is(body.dispatcher-page, body.dispatch-telemetry) .telemetry-map-toolbar-top {
        display: flex;
        justify-content: flex-end;
        align-items: center;
        flex-wrap: wrap;
        gap: 8px;
        margin: 0;
        padding: 0;
        position: absolute;
        top: 10px;
        right: 10px;
        left: auto;
        z-index: 10;
    }

:is(body.dispatcher-page, body.dispatch-telemetry) .telemetry-beacon-pill {
        background: #052e1f;
        color: #4ade80;
        font-size: 0.65rem;
        font-weight: 700;
        padding: 5px 12px;
        border-radius: 20px;
        display: inline-flex;
        align-items: center;
        gap: 6px;
        white-space: nowrap;
    }

:is(body.dispatcher-page, body.dispatch-telemetry) .telemetry-toolbar-right {
        display: flex;
        align-items: center;
        gap: 8px;
    }

:is(body.dispatcher-page, body.dispatch-telemetry) .map-toggle-btn {
        background: #d17a2d;
        color: #ffffff;
        border: 1px solid #d17a2d;
        font-size: 0.95em;
        font-weight: 700;
        letter-spacing: 0.3px;
        padding: 0 12px;
        height: 36px;
        box-sizing: border-box;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        line-height: 1;
        border-radius: 6px;
        cursor: pointer;
    }

:is(body.dispatcher-page, body.dispatch-telemetry) .map-toggle-btn:hover {
            background: #b86622 !important;
            color: #ffffff !important;
        }

:is(body.dispatcher-page, body.dispatch-telemetry) .map-toggle-btn.off:hover {
            background: #fff7ef !important;
            color: #a45f1e !important;
        }

:is(body.dispatcher-page, body.dispatch-telemetry) .map-toggle-btn:disabled,
:is(body.dispatcher-page, body.dispatch-telemetry) .map-toggle-btn.map-toggle-disabled {
            background: #f5f1ed !important;
            color: #b8aca0 !important;
            border-color: #eadfd5 !important;
            cursor: not-allowed;
            pointer-events: none;
        }

:is(body.dispatcher-page, body.dispatch-telemetry) .map-toggle-btn:focus,
:is(body.dispatcher-page, body.dispatch-telemetry) .map-toggle-btn:focus-visible,
:is(body.dispatcher-page, body.dispatch-telemetry) .map-toggle-btn:active {
            outline: none !important;
            box-shadow: none !important;
        }

:is(body.dispatcher-page, body.dispatch-telemetry) .map-toggle-btn .map-toggle-spinner {
            margin-right: 6px;
        }

:is(body.dispatcher-page, body.dispatch-telemetry) #tg-map-expand-btn {
        position: absolute;
        top: 58px;
        right: 10px;
        z-index: 22;
        width: 40px;
        height: 40px;
        border: none;
        border-radius: 2px;
        background: #ffffff;
        color: #555555;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        cursor: pointer;
        box-shadow: 0 1px 4px rgba(0, 0, 0, 0.3);
    }

:is(body.dispatcher-page, body.dispatch-telemetry) #tg-map-expand-btn:hover {
            background: #f8f8f8;
        }

:is(body.dispatcher-page, body.dispatch-telemetry) #tg-map-expand-btn:focus,
:is(body.dispatcher-page, body.dispatch-telemetry) #tg-map-expand-btn:focus-visible,
:is(body.dispatcher-page, body.dispatch-telemetry) #tg-map-expand-btn:active {
            outline: none;
            box-shadow: 0 1px 4px rgba(0, 0, 0, 0.3);
        }

:is(body.dispatcher-page, body.dispatch-telemetry) #tg-map-expand-btn .icon-inline {
            width: 18px;
            height: 18px;
            filter: none;
        }

:is(body.dispatcher-page, body.dispatch-telemetry) .telemetry-map-viewport.tg-map-full {
        position: fixed;
        inset: 0;
        z-index: 4000;
        border-radius: 0;
    }

:is(body.dispatcher-page, body.dispatch-telemetry) .telemetry-map-viewport.tg-map-full .telemetry-map-canvas {
            height: 100vh;
            border-radius: 0;
        }

:is(body.dispatcher-page, body.dispatch-telemetry) .telemetry-map-viewport.tg-map-full #tg-map-expand-btn {
            display: none;
        }

:is(body.dispatcher-page, body.dispatch-telemetry) .tg-map-close-btn {
        position: absolute;
        /* sit below the top toolbar row (GPS TRACES / POINTS / ... / SATELLITE) so they don't overlap */
        top: 58px;
        right: 10px;
        z-index: 21;
        width: 40px;
        height: 40px;
        border: none;
        border-radius: 10px;
        background: #1e293b;
        color: #fff;
        font-size: 1.5rem;
        display: none;
        align-items: center;
        justify-content: center;
        cursor: pointer;
        box-shadow: 0 2px 10px rgba(0,0,0,0.4);
    }

:is(body.dispatcher-page, body.dispatch-telemetry) .tg-map-save-btn {
        position: absolute;
        /* aligned with the X, just below the top toolbar row */
        top: 58px;
        right: 60px;
        z-index: 21;
        height: 40px;
        padding: 0 16px;
        border: none;
        border-radius: 10px;
        background: #B57423;
        color: #fff;
        font-size: 0.95rem;
        font-weight: 700;
        display: none;
        align-items: center;
        cursor: pointer;
        box-shadow: 0 2px 10px rgba(0,0,0,0.4);
    }

:is(body.dispatcher-page, body.dispatch-telemetry) .tg-map-save-btn:disabled {
            opacity: 0.45;
            cursor: not-allowed;
        }
/* keep the label visible on hover (was blending/disappearing after draw) */
:is(body.dispatcher-page, body.dispatch-telemetry) .tg-map-save-btn:hover {
            background: #a85e22 !important;
            color: #fff !important;
        }

:is(body.dispatcher-page, body.dispatch-telemetry) .telemetry-map-viewport.tg-map-full .tg-map-close-btn,
:is(body.dispatcher-page, body.dispatch-telemetry) .telemetry-map-viewport.tg-map-full .tg-map-save-btn {
        display: inline-flex;
    }
/* map loader overlay shown while route-location / dump-filter data loads */
:is(body.dispatcher-page, body.dispatch-telemetry) .tg-map-loader {
        position: absolute;
        top: 50%;
        left: 50%;
        transform: translate(-50%, -50%);
        z-index: 30;
        display: none;
        align-items: center;
        gap: 10px;
        padding: 10px 18px;
        border-radius: 10px;
        background: rgba(15, 23, 42, 0.85);
        color: #fff;
        font-size: 0.9rem;
        font-weight: 600;
        box-shadow: 0 4px 16px rgba(0,0,0,0.4);
    }

:is(body.dispatcher-page, body.dispatch-telemetry) .tg-map-loader.active {
            display: inline-flex;
        }

:is(body.dispatcher-page, body.dispatch-telemetry) .tg-map-loader .fa-spinner {
            font-size: 1.1rem;
        }

:is(body.dispatcher-page, body.dispatch-telemetry) .map-toggle-btn.off {
            background: #ffffff;
            color: #a45f1e;
            border-color: #d17a2d;
        }

:is(body.dispatcher-page, body.dispatch-telemetry) .map-mode-switch {
        display: flex;
        align-items: center;
        height: 36px;
        box-sizing: border-box;
        background: #ffffff;
        border: 1px solid #ccc;
        border-radius: 2px;
        box-shadow: 0 2px 6px rgba(0,0,0,0.3);
        padding: 0;
    }

:is(body.dispatcher-page, body.dispatch-telemetry) .map-mode-btn {
        background: #ffffff;
        color: #1f2a37;
        border: none;
        border-right: 1px solid #ccc;
        font-size: 0.95rem;
        font-weight: 700;
        letter-spacing: 0.3px;
        height: 34px;
        box-sizing: border-box;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        line-height: 1;
        padding: 0 12px;
        border-radius: 0;
        cursor: pointer;
        outline: none;
    }

:is(body.dispatcher-page, body.dispatch-telemetry) .map-mode-btn:last-child {
            border-right: none;
        }

:is(body.dispatcher-page, body.dispatch-telemetry) .map-mode-btn.active {
            background: #c2712c !important;
            color: #ffffff;
            font-weight: 800;
        }

:is(body.dispatcher-page, body.dispatch-telemetry) .map-mode-btn:not(.active):hover {
            background: #e5e7eb !important;
            color: #111827 !important;
        }

:is(body.dispatcher-page, body.dispatch-telemetry) .map-mode-btn.active:hover {
            background: #a85e22 !important;
            color: #ffffff !important;
        }

:is(body.dispatcher-page, body.dispatch-telemetry) .map-mode-btn:focus,
:is(body.dispatcher-page, body.dispatch-telemetry) .map-mode-btn:active {
            outline: none !important;
            box-shadow: none !important;
        }

:is(body.dispatcher-page, body.dispatch-telemetry) .map-mode-btn:focus-visible {
            outline: 2px solid #f59e0b !important;
            outline-offset: -3px;
            box-shadow: none !important;
        }

:is(body.dispatcher-page, body.dispatch-telemetry) .telemetry-map-canvas {
        position: relative;
        width: 100%;
        /* fill the remaining height of the flex column; shrinks automatically when the
           drawing form expands so the page never scrolls */
        flex: 1 1 auto;
        height: auto;
        min-height: 220px;
        border-radius: 8px;
        overflow: hidden;
        background-image: linear-gradient(rgba(255,255,255,0.04) 1px, transparent 1px), linear-gradient(90deg, rgba(255,255,255,0.04) 1px, transparent 1px);
        background-size: 28px 28px;
    }

:is(body.dispatcher-page, body.dispatch-telemetry) .telemetry-map-gmap {
        width: 100%;
        height: 100%;
    }

:is(body.dispatcher-page, body.dispatch-telemetry) .telemetry-legend-box {
        position: absolute;
        left: 28px;
        bottom: 20px;
        background: rgba(255, 250, 246, 0.98);
        border: 1px solid #d78b52;
        border-radius: 8px;
        padding: 10px 12px;
        font-size: 0.65rem;
        color: #592c08;
        box-shadow: 0 4px 14px rgba(89, 44, 8, 0.2);
        z-index: 2;
        max-width: 220px;
    }

:is(body.dispatcher-page, body.dispatch-telemetry) .telemetry-legend-title {
        font-weight: 700;
        color: #592c08;
        margin-bottom: 6px;
        font-size: 1.1rem;
        text-transform: uppercase;
    }

:is(body.dispatcher-page, body.dispatch-telemetry) .telemetry-legend-row {
        display: flex;
        align-items: center;
        gap: 6px;
        margin-top: 4px;
        font-size: 0.85rem;
        color: #592c08 !important;
        font-weight: 600;
        text-shadow: none;
    }

:is(body.dispatcher-page, body.dispatch-telemetry) .dispatcher-map-marker-label {
        color: #ffffff !important;
        text-shadow: -1px -1px 1px #0f172a, 1px -1px 1px #0f172a,
                     -1px 1px 1px #0f172a, 1px 1px 1px #0f172a;
    }

:is(body.dispatcher-page, body.dispatch-telemetry) .dispatcher-tipping-point-label {
        color: #ffffff !important;
        background: #7c3aed;
        border: 1px solid rgba(255, 255, 255, 0.9);
        border-radius: 5px;
        padding: 3px 7px;
        box-shadow: 0 2px 6px rgba(15, 23, 42, 0.35);
        transform: translateY(-22px);
        white-space: nowrap;
    }

:is(body.dispatcher-page, body.dispatch-telemetry) .dispatcher-mapped-tipping-point-label {
        color: #ffffff !important;
        background: #64748b;
        border: 1px solid rgba(255, 255, 255, 0.85);
        border-radius: 5px;
        padding: 3px 7px;
        box-shadow: 0 2px 5px rgba(15, 23, 42, 0.28);
        transform: translateY(-22px);
        white-space: nowrap;
    }

:is(body.dispatcher-page, body.dispatch-telemetry) .dispatcher-dump-label {
        color: #ffffff !important;
        background: #2563eb;
        border: 1px solid rgba(255, 255, 255, 0.9);
        border-radius: 5px;
        padding: 3px 7px;
        box-shadow: 0 2px 6px rgba(15, 23, 42, 0.35);
        transform: translateY(-22px);
        white-space: nowrap;
    }

:is(body.dispatcher-page, body.dispatch-telemetry) .telemetry-legend-swatch {
        width: 14px;
        height: 3px;
        border-radius: 2px;
        flex-shrink: 0;
    }

:is(body.dispatcher-page, body.dispatch-telemetry) .telemetry-legend-dot {
        width: 8px;
        height: 8px;
        border-radius: 50%;
        flex-shrink: 0;
    }

:is(body.dispatcher-page, body.dispatch-telemetry) .legend-color-haulway {
        background: #f97316;
    }

:is(body.dispatcher-page, body.dispatch-telemetry) .legend-color-return {
        background: #3b82f6;
    }

:is(body.dispatcher-page, body.dispatch-telemetry) .legend-color-telemetry {
        background: #f97316;
    }

:is(body.dispatcher-page, body.dispatch-telemetry) .legend-color-hauler-good {
        background: #22c55e;
    }

:is(body.dispatcher-page, body.dispatch-telemetry) .map-hauler-tooltip {
        position: fixed;
        display: none;
        z-index: 9000;
        background: #ffff;
        border: 1px solid #334155;
        border-radius: 10px;
        padding: 12px 14px;
        width: 220px;
        box-shadow: 0 12px 30px rgba(0, 0, 0, 0.5);
        pointer-events: none;
    }

:is(body.dispatcher-page, body.dispatch-telemetry) .map-hauler-tooltip.visible {
            display: block;
        }

:is(body.dispatcher-page, body.dispatch-telemetry) .map-hauler-tooltip-header {
        display: flex;
        align-items: center;
        justify-content: space-between;
        margin-bottom: 8px;
    }

:is(body.dispatcher-page, body.dispatch-telemetry) .map-hauler-tooltip-id {
        font-size: 0.9rem;
        font-weight: 700;
        color: #000000;
    }

:is(body.dispatcher-page, body.dispatch-telemetry) .telemetry-fleet-progress-row {
        margin: 10px 0;
    }

:is(body.dispatcher-page, body.dispatch-telemetry) .telemetry-fleet-progress-label {
        display: flex;
        justify-content: space-between;
        font-size: 0.68rem;
        color: #94a3b8;
        margin-bottom: 4px;
    }

:is(body.dispatcher-page, body.dispatch-telemetry) .telemetry-fleet-progress-track {
        height: 6px;
        border-radius: 3px;
        background: #1e293b;
        overflow: hidden;
    }

:is(body.dispatcher-page, body.dispatch-telemetry) .telemetry-fleet-progress-fill {
        height: 100%;
        border-radius: 3px;
        background: #6366f1;
    }

:is(body.dispatcher-page, body.dispatch-telemetry) .telemetry-fleet-progress-none {
        font-size: 0.68rem;
        color: #64748b;
        font-style: italic;
    }

:is(body.dispatcher-page, body.dispatch-telemetry) .map-hauler-tooltip-meta-row {
        display: flex;
        justify-content: space-between;
        font-size: 0.72rem;
        color: #cbd5e1;
        padding-top: 8px;
        border-top: 1px solid #1e293b;
        margin-top: 6px;
    }

:is(body.dispatcher-page, body.dispatch-telemetry) .map-hauler-tooltip-meta-item span {
        display: block;
    }

:is(body.dispatcher-page, body.dispatch-telemetry) .map-hauler-tooltip-meta-label {
        color: #64748b;
        font-size: 0.62rem;
        text-transform: uppercase;
        letter-spacing: 0.03em;
    }

:is(body.dispatcher-page, body.dispatch-telemetry) .workspace-split-wrapper {
        display: grid;
        grid-template-columns: repeat(12, 1fr);
        /* grid-auto-rows: min-content; */
        gap: 20px;
        /* width: 100%; */
        /* margin: 0; */
        /* align-items: stretch; */
        /* overflow: scroll; */
    }

:is(body.dispatcher-page, body.dispatch-telemetry) .dashboard-container.is-empty-state .workspace-split-wrapper {
        flex: 1;
    }

:is(body.dispatcher-page, body.dispatch-telemetry) .workspace-left-panel {
        grid-column: span 9;
        display: flex;
        flex-direction: column;
        gap: 12px;
        background-color: var(--bg-card);
        border: 1px solid var(--border-color);
        border-radius: 12px;
        padding: 16px 20px;
        box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.05);
        align-self: start;
        overflow-x: hidden;
        height: 84vh;
        overflow-y: scroll;
    }

:is(body.dispatcher-page, body.dispatch-telemetry) .workspace-left-panel:fullscreen {
            padding: 20px;
            overflow-y: auto;
        }

:is(body.dispatcher-page, body.dispatch-telemetry) .workspace-right-panel {
        grid-column: span 3;
        background-color: var(--bg-card);
        border: 1px solid var(--border-color);
        border-radius: 12px;
        padding: 16px;
        position: sticky;
        top: 20px;
        align-self: start;
        box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.05);
    }

:is(body.dispatcher-page, body.dispatch-telemetry) .dashboard-container.is-empty-state .workspace-left-panel,
:is(body.dispatcher-page, body.dispatch-telemetry) .dashboard-container.is-empty-state .workspace-right-panel {
        min-height: 100%;
    }

:is(body.dispatcher-page, body.dispatch-telemetry) .asset-tabs-header {
        display: flex;
        border-bottom: 2px solid var(--border-color);
        margin-bottom: 12px;
        gap: 16px;
    }

:is(body.dispatcher-page, body.dispatch-telemetry) .asset-tab-trigger {
        padding: 8px 4px;
        font-size: 1.5rem;
        font-weight: 700;
        color: var(--text-muted);
        background: none;
        border: none;
        cursor: pointer;
        position: relative;
        display: flex;
        align-items: center;
        gap: 6px;
    }

:is(body.dispatcher-page, body.dispatch-telemetry) .asset-tab-trigger.active {
            color: var(--alert-orange);
        }

:is(body.dispatcher-page, body.dispatch-telemetry) .asset-tab-trigger.active::after {
                content: '';
                position: absolute;
                bottom: -2px;
                left: 0;
                width: 100%;
                height: 2px;
                background-color: var(--alert-orange);
            }

:is(body.dispatcher-page, body.dispatch-telemetry) .asset-search-box {
        width: 100%;
        padding: 8px 12px;
        border: 1px solid var(--border-color);
        border-radius: 6px;
        font-size: 1.2rem;
        margin-bottom: 12px;
    }

:is(body.dispatcher-page, body.dispatch-telemetry) .dispatcher-selected-hauler-section { margin: 8px 0 12px; padding: 8px; border: 1px solid #e5e7eb; border-radius: 6px; background: #fafafa; }

:is(body.dispatcher-page, body.dispatch-telemetry) .dispatcher-selected-hauler-title { display: block; margin-bottom: 6px; font-size: 11px; font-weight: 700; color: #667085; }

:is(body.dispatcher-page, body.dispatch-telemetry) .dispatcher-selected-hauler-tray { display: grid; grid-template-columns: repeat(auto-fit, minmax(135px, 1fr)); gap: 6px; }

:is(body.dispatcher-page, body.dispatch-telemetry) .dispatcher-selected-hauler-empty { grid-column: 1 / -1; font-size: 11px; color: #98a2b3; }

:is(body.dispatcher-page, body.dispatch-telemetry) .dispatcher-selected-hauler-token { display: flex; align-items: center; gap: 6px; min-width: 0; padding: 5px 7px; border: 1px solid #d7dee7; border-radius: 16px; background: #fff; cursor: grab; }

:is(body.dispatcher-page, body.dispatch-telemetry) .dispatcher-selected-hauler-icon { display: inline-flex; align-items: center; justify-content: center; flex: 0 0 24px; width: 24px; height: 24px; border-radius: 50%; background: #ececec; }

:is(body.dispatcher-page, body.dispatch-telemetry) .dispatcher-selected-hauler-icon img { width: 15px; height: 15px; opacity: .65; }

:is(body.dispatcher-page, body.dispatch-telemetry) .dispatcher-selected-hauler-door { min-width: 0; flex: 1; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 12px; font-weight: 600; color: #344054; }

:is(body.dispatcher-page, body.dispatch-telemetry) .dispatcher-selected-hauler-remove { border: 0; background: transparent; padding: 0 2px; font-size: 16px; line-height: 1; color: #667085; cursor: pointer; }

:is(body.dispatcher-page, body.dispatch-telemetry) .asset-items-container {
        display: flex;
        flex-direction: column;
        gap: 8px;
        min-height: 180px;
        max-height: 650px;
        overflow-y: auto;
    }

:is(body.dispatcher-page, body.dispatch-telemetry) .asset-list-shell {
        position: relative;
        min-height: 180px;
    }

:is(body.dispatcher-page, body.dispatch-telemetry) .asset-panel-loader {
        position: absolute;
        inset: 0;
        z-index: 20;
        display: none;
        align-items: center;
        justify-content: center;
        min-height: 180px;
        border-radius: 10px;
        background: rgba(255, 255, 255, 0.9);
        backdrop-filter: blur(2px);
    }

:is(body.dispatcher-page, body.dispatch-telemetry) .asset-list-shell.inventory-loading .asset-panel-loader {
        display: flex;
    }

:is(body.dispatcher-page, body.dispatch-telemetry) .asset-panel-loader-content {
        display: flex;
        flex-direction: column;
        align-items: center;
        gap: 10px;
        color: var(--text-main);
        font-size: 1.15rem;
        font-weight: 700;
    }

:is(body.dispatcher-page, body.dispatch-telemetry) .asset-panel-loader-spinner {
        width: 34px;
        height: 34px;
        border: 4px solid #e2e8f0;
        border-top-color: var(--brand-blue);
        border-radius: 50%;
        animation: dispatcher-inventory-spin 0.8s linear infinite;
    }

    @keyframes dispatcher-inventory-spin {
        to {
            transform: rotate(360deg);
        }
    }

:is(body.dispatcher-page, body.dispatch-telemetry) .asset-draggable-item {
        background-color: var(--bg-primary);
        border: 1px solid var(--border-color);
        border-radius: var(--radius-md);
        padding: 12px;
        display: flex;
        align-items: center;
        gap: 12px;
        cursor: grab;
        transition: var(--transition-smooth);
        user-select: none;
    }

:is(body.dispatcher-page, body.dispatch-telemetry) .asset-draggable-item:hover {
            border-color: #cbd5e1;
            background-color: #f1f5f9;
        }

:is(body.dispatcher-page, body.dispatch-telemetry) .asset-draggable-item .suggestion-check-icon {
            flex-shrink: 0;
        }

:is(body.dispatcher-page, body.dispatch-telemetry) .asset-draggable-item.hauler-selected {
            border-color: #2563eb;
            background-color: #eff6ff;
        }

:is(body.dispatcher-page, body.dispatch-telemetry) .asset-avatar {
        width: 36px;
        height: 36px;
        border-radius: 50%;
        background-color: #e2e8f0;
        color: var(--text-main);
        display: flex;
        align-items: center;
        justify-content: center;
        font-weight: 700;
        font-size: 1.5rem;
    }

:is(body.dispatcher-page, body.dispatch-telemetry) .asset-meta-details {
        display: flex;
        flex-direction: column;
        flex-grow: 1;
    }

:is(body.dispatcher-page, body.dispatch-telemetry) .asset-title-text {
        font-size: 1.5rem;
        font-weight: 700;
        color: var(--text-main);
    }

:is(body.dispatcher-page, body.dispatch-telemetry) .asset-subtitle-text {
        font-size: 1.2rem;
        color: var(--text-muted);
    }

:is(body.dispatcher-page, body.dispatch-telemetry) .badge-capacity-rank {
        background-color: #f0fdf4;
        color: #166534;
        font-size: 1.1rem;
        font-weight: 700;
        padding: 2px 6px;
        border-radius: 4px;
    }

:is(body.dispatcher-page, body.dispatch-telemetry) .icon-inline {
        width: 1em;
        height: 1em;
        flex-shrink: 0;
        vertical-align: -0.125em;
    }

:is(body.dispatcher-page, body.dispatch-telemetry) .js-hidden {
        display: none;
    }

:is(body.dispatcher-page, body.dispatch-telemetry) .hidden-permanently {
        display: none !important;
    }

    @media (max-width: 1100px) {

:is(body.dispatcher-page, body.dispatch-telemetry) .route-row-card {
            grid-template-columns: 175px minmax(140px, 1fr) 110px minmax(140px, 1fr) 110px;
            gap: 10px;
            padding-inline: 12px;
        }

:is(body.dispatcher-page, body.dispatch-telemetry) .badge-sh-id {
            width: 100px;
            min-width: 100px;
            max-width: 100px;
            font-size: 0.84rem;
        }

:is(body.dispatcher-page, body.dispatch-telemetry) .expanded-grid-2col {
            grid-template-columns: 1fr;
        }
    }


    @media (max-width: 992px) {

:is(body.dispatcher-page, body.dispatch-telemetry) .workspace-split-wrapper {
            flex-direction: column;
        }

:is(body.dispatcher-page, body.dispatch-telemetry) .workspace-left-panel,
:is(body.dispatcher-page, body.dispatch-telemetry) .workspace-right-panel {
            flex-basis: auto;
            width: 100%;
            min-height: 0;
        }

:is(body.dispatcher-page, body.dispatch-telemetry) .workspace-right-panel {
            position: static;
            max-height: 420px;
        }

:is(body.dispatcher-page, body.dispatch-telemetry) .asset-list-shell {
            max-height: 320px;
        }
    }

    @media (max-width: 767px) {

body.dispatcher-page {
            padding: 10px;
        }

:is(body.dispatcher-page, body.dispatch-telemetry) .dashboard-container {
            margin-top: 8px;
        }

:is(body.dispatcher-page, body.dispatch-telemetry) .section-title {
            font-size: 1.25rem;
        }

:is(body.dispatcher-page, body.dispatch-telemetry) .routes-section-header {
            flex-wrap: wrap;
            gap: 8px;
        }

:is(body.dispatcher-page, body.dispatch-telemetry) .section-actions {
            flex-wrap: wrap;
        }

:is(body.dispatcher-page, body.dispatch-telemetry) .utility-btn,
:is(body.dispatcher-page, body.dispatch-telemetry) .provision-btn,
:is(body.dispatcher-page, body.dispatch-telemetry) .gps-filters-btn {
            font-size: 1rem;
            padding: 6px 10px;
        }

:is(body.dispatcher-page, body.dispatch-telemetry) .route-row-card {
            grid-template-columns: 1fr;
            row-gap: 12px;
            padding: 14px;
        }

:is(body.dispatcher-page, body.dispatch-telemetry) .route-header-cell,
:is(body.dispatcher-page, body.dispatch-telemetry) .route-footer-cell {
            justify-content: space-between;
        }

:is(body.dispatcher-page, body.dispatch-telemetry) .badge-sh-id {
            width: auto;
            min-width: 90px;
            max-width: none;
        }

:is(body.dispatcher-page, body.dispatch-telemetry) .track-segment-container {
            width: 100%;
        }

:is(body.dispatcher-page, body.dispatch-telemetry) .hub-terminal-node {
            justify-content: center;
        }

:is(body.dispatcher-page, body.dispatch-telemetry) .expanded-grid-2col {
            grid-template-columns: 1fr;
        }

:is(body.dispatcher-page, body.dispatch-telemetry) .form-row-dual {
            grid-template-columns: 1fr;
        }

:is(body.dispatcher-page, body.dispatch-telemetry) .modal-window-frame {
            max-width: 100%;
            max-height: 90vh;
            overflow-y: auto;
            margin: 0 12px;
        }

:is(body.dispatcher-page, body.dispatch-telemetry) .telemetry-page-inner {
            width: 100%;
            max-width: none;
        }

:is(body.dispatcher-page, body.dispatch-telemetry) .telemetry-modal-header {
            flex-wrap: wrap;
            row-gap: 8px;
        }

:is(body.dispatcher-page, body.dispatch-telemetry) .asset-tab-trigger {
            font-size: 1.1rem;
        }
    }

    @media (max-width: 480px) {

:is(body.dispatcher-page, body.dispatch-telemetry) .section-title {
            font-size: 1.1rem;
        }

:is(body.dispatcher-page, body.dispatch-telemetry) .badge-sh-id {
            font-size: 0.8rem;
            min-height: 32px;
            padding: 6px;
        }

:is(body.dispatcher-page, body.dispatch-telemetry) .route-row-card {
            padding: 10px;
        }

:is(body.dispatcher-page, body.dispatch-telemetry) .mini-detail-card {
            padding: 10px;
        }

:is(body.dispatcher-page, body.dispatch-telemetry) .asset-search-box {
            font-size: 0.95rem;
        }

:is(body.dispatcher-page, body.dispatch-telemetry) .gps-active-filters-bar {
            gap: 4px;
        }

:is(body.dispatcher-page, body.dispatch-telemetry) .gps-filter-pill {
            font-size: 0.7rem;
        }
    }

    @media (max-height: 480px) and (orientation: landscape) {

:is(body.dispatcher-page, body.dispatch-telemetry) .modal-window-frame {
            max-height: 92vh;
            overflow-y: auto;
        }

:is(body.dispatcher-page, body.dispatch-telemetry) .telemetry-page-inner {
            overflow-y: auto;
        }

:is(body.dispatcher-page, body.dispatch-telemetry) .telemetry-map-shell {
            max-height: 40vh;
        }
    }

:is(body.dispatcher-page, body.dispatch-telemetry) .tg-fixed-arrow:hover {
            background: #fff7ed;
            border-color: #B57423;
        }

:is(body.dispatcher-page, body.dispatch-telemetry) .tg-form-panel {
            background: #fff;
            border: 1px solid #e2e8f0;
            border-radius: 14px;
            padding: 16px 20px;
            margin-top: 14px;
            /* natural height; the map (flex:1) absorbs the rest so the page never scrolls */
            flex: 0 0 auto;
            max-height: 55%;
            overflow-y: auto;
        }

:is(body.dispatcher-page, body.dispatch-telemetry) .tg-tool-head {
            display: flex;
            align-items: center;
            justify-content: space-between;
            gap: 12px;
        }

:is(body.dispatcher-page, body.dispatch-telemetry) .tg-tool-title {
            display: flex;
            align-items: center;
            gap: 12px;
        }

:is(body.dispatcher-page, body.dispatch-telemetry) .tg-tool-title .tg-tool-ico {
                width: 42px;
                height: 42px;
                border-radius: 10px;
                background: #fff7ed;
                border: 1px solid #fed7aa;
                display: flex;
                align-items: center;
                justify-content: center;
            }

:is(body.dispatcher-page, body.dispatch-telemetry) .tg-tool-title h4 {
                margin: 0;
                font-size: 1.45rem;
                font-weight: 800;
                color: #0f172a;
            }

:is(body.dispatcher-page, body.dispatch-telemetry) .tg-tool-title p {
                margin: 0;
                font-size: 1.1rem;
                color: #64748b;
            }

:is(body.dispatcher-page, body.dispatch-telemetry) .tg-draw-mode-btn {
            background: #ffffff;
            color: #f97316;
            border: 1px solid #f97316;
            border-radius: 9px;
            padding: 9px 16px;
            font-weight: 700;
            font-size: 1.15rem;
            cursor: pointer;
            white-space: nowrap;
            display: inline-flex;
            align-items: center;
            gap: 8px;
        }

:is(body.dispatcher-page, body.dispatch-telemetry) .tg-draw-mode-btn:hover {
                background: #c2712c !important;
                color: #fff !important;
                border-color: #c2712c !important;
            }

:is(body.dispatcher-page, body.dispatch-telemetry) .tg-draw-mode-btn.active {
                background: #c2712c;
                color: #fff;
                border-color: #c2712c;
            }

:is(body.dispatcher-page, body.dispatch-telemetry) .tg-draw-mode-btn:hover {
                background: #c2712c;
                color: #fff;
            }

:is(body.dispatcher-page, body.dispatch-telemetry) .tg-draw-mode-btn.active:hover {
                background: #c2712c;
                color: #fff;
            }

:is(body.dispatcher-page, body.dispatch-telemetry) .tg-form-row {
            display: grid;
            grid-template-columns: repeat(3, 1fr);
            gap: 12px 24px;
            margin-bottom: 12px;
        }
/* Extra top spacing below the "Draw Tipping Geofence"
               header, for the first row only - was inline on that
               element. */
:is(body.dispatcher-page, body.dispatch-telemetry) .tg-form-row--first {
                margin-top: 16px;
            }

:is(body.dispatcher-page, body.dispatch-telemetry) .tg-form-actions {
            display: flex;
            justify-content: flex-start;
        }

:is(body.dispatcher-page, body.dispatch-telemetry) .tg-name-input {
            height: 34px;
            border: 1px solid #dbe1ea;
            border-radius: 7px;
            padding: 2px 8px;
            font-size: 1.15rem;
            flex: 1;
            max-width: 320px;
        }

:is(body.dispatcher-page, body.dispatch-telemetry) .tg-field {
            display: flex;
            flex-direction: column;
            gap: 4px;
        }
/* Aligns a label-less field's control (e.g. the "+ Draw"
               button) to the same baseline as sibling fields that do
               have a label above their control - was inline on that
               field. */
:is(body.dispatcher-page, body.dispatch-telemetry) .tg-field--align-end {
                justify-content: flex-end;
            }

:is(body.dispatcher-page, body.dispatch-telemetry) .tg-field label {
                font-size: 1.05rem;
                font-weight: 700;
                color: #334155;
            }

:is(body.dispatcher-page, body.dispatch-telemetry) .tg-field label .req {
                    color: #e11d48;
                }

:is(body.dispatcher-page, body.dispatch-telemetry) .tg-field select,
:is(body.dispatcher-page, body.dispatch-telemetry) .tg-field input {
                height: 34px;
                border: 1px solid #dbe1ea;
                border-radius: 7px;
                padding: 2px 8px;
                font-size: 1.15rem;
                background: #fff;
                color: #0f172a;
            }

:is(body.dispatcher-page, body.dispatch-telemetry) .tg-toggle-wrap {
            display: flex;
            align-items: center;
            gap: 8px;
            height: 34px;
        }

:is(body.dispatcher-page, body.dispatch-telemetry) .tg-toggle-text {
            font-size: 1.15rem;
            color: #334155;
        }

:is(body.dispatcher-page, body.dispatch-telemetry) .tg-switch {
            position: relative;
            display: inline-block;
            width: 36px;
            height: 19px;
        }

:is(body.dispatcher-page, body.dispatch-telemetry) .tg-switch input {
                opacity: 0;
                width: 0;
                height: 0;
            }

:is(body.dispatcher-page, body.dispatch-telemetry) .tg-switch span {
                position: absolute;
                cursor: pointer;
                inset: 0;
                background: #cbd5e1;
                border-radius: 19px;
                transition: .3s;
            }

:is(body.dispatcher-page, body.dispatch-telemetry) .tg-switch span:before {
                    content: "";
                    position: absolute;
                    width: 15px;
                    height: 15px;
                    left: 2px;
                    top: 2px;
                    background: #fff;
                    border-radius: 50%;
                    transition: .3s;
                }

:is(body.dispatcher-page, body.dispatch-telemetry) .tg-switch input:checked + span {
                background: #c2712c;
            }

:is(body.dispatcher-page, body.dispatch-telemetry) .tg-switch input:checked + span:before {
                    transform: translateX(17px);
                }

:is(body.dispatcher-page, body.dispatch-telemetry) .tg-draw-btn {
            background: #c2712c;
            color: #fff;
            border: none;
            border-radius: 9px;
            height: 34px;
            width: auto;
            padding: 0 18px;
            align-self: flex-end;
            font-weight: 800;
            font-size: 1.2rem;
            cursor: pointer;
            white-space: nowrap;
        }
/* keep the label visible on hover (was blending into the background) */
/* keep the label visible on hover in BOTH states (enabled and disabled/unfilled) */
:is(body.dispatcher-page, body.dispatch-telemetry) .tg-draw-btn:hover {
                background: #a85e22 !important;
                color: #fff !important;
            }

:is(body.dispatcher-page, body.dispatch-telemetry) .tg-draw-btn:disabled {
                opacity: .45;
                cursor: not-allowed;
            }
/* even when disabled (fields not filled), keep the orange bg + white text on hover */
:is(body.dispatcher-page, body.dispatch-telemetry) .tg-draw-btn:disabled:hover {
                background: #c2712c !important;
                color: #fff !important;
            }

:is(body.dispatcher-page, body.dispatch-telemetry) .tg-chip-strip-title {
            font-size: 1rem;
            font-weight: 700;
            letter-spacing: .5px;
            color: #94a3b8;
            text-transform: uppercase;
            margin: 16px 0 8px;
        }

:is(body.dispatcher-page, body.dispatch-telemetry) .tg-chips {
            display: flex;
            flex-wrap: wrap;
            gap: 8px;
        }

:is(body.dispatcher-page, body.dispatch-telemetry) .tg-chip {
            display: inline-flex;
            align-items: center;
            gap: 7px;
            background: #f8fafc;
            border: 1px solid #e2e8f0;
            border-radius: 20px;
            padding: 5px 12px;
            font-size: 1.15rem;
            color: #334155;
            font-weight: 600;
        }

:is(body.dispatcher-page, body.dispatch-telemetry) .tg-chip .tg-chip-dot {
                width: 8px;
                height: 8px;
                border-radius: 50%;
            }

:is(body.dispatcher-page, body.dispatch-telemetry) .tg-chip .tg-chip-x {
                border: none;
                background: none;
                cursor: pointer;
                color: #94a3b8;
                font-size: 1.2rem;
            }

:is(body.dispatcher-page, body.dispatch-telemetry) .tg-footer-actions {
            display: flex;
            justify-content: flex-end;
            align-items: center;
            gap: 10px;
            margin-top: 14px;
        }

:is(body.dispatcher-page, body.dispatch-telemetry) .tg-save-btn {
            background: #16a34a;
            color: #fff;
            border: none;
            border-radius: 9px;
            padding: 9px 22px;
            font-weight: 800;
            font-size: 1.25rem;
            cursor: pointer;
        }

:is(body.dispatcher-page, body.dispatch-telemetry) .tg-save-btn:disabled {
                opacity: .5;
                cursor: not-allowed;
            }

:is(body.dispatcher-page, body.dispatch-telemetry) .tg-status-line {
            font-size: 1.1rem;
            color: #64748b;
            margin-top: 8px;
        }

        @media (max-width: 767px) {

:is(body.dispatcher-page, body.dispatch-telemetry) .tg-tool-head {
                flex-wrap: wrap;
            }

:is(body.dispatcher-page, body.dispatch-telemetry) .tg-draw-mode-btn {
                width: 100%;
                text-align: center;
            }

:is(body.dispatcher-page, body.dispatch-telemetry) .tg-form-row {
                grid-template-columns: 1fr;
            }
        }

        @media (max-width: 480px) {

:is(body.dispatcher-page, body.dispatch-telemetry) .tg-tool-title h4 {
                font-size: 1.2rem;
            }

:is(body.dispatcher-page, body.dispatch-telemetry) .tg-tool-title p {
                font-size: 0.95rem;
            }
        }

/* Dispatcher page shell uses the shared execution header and scrolls each workspace. */
body.dispatcher-page { padding:0; background:#faf8f5; }
body.dispatcher-page .execution-page { padding:24px 24px 84px; }
body.dispatcher-page .dashboard-container { margin:0; min-width:0; }
body.dispatcher-page .workspace-split-wrapper { grid-template-columns:minmax(0,1fr) 350px; align-items:start; }
body.dispatcher-page .workspace-left-panel { grid-column:1; min-width:0; height:calc(100vh - var(--execution-header-height,80px) - 108px); min-height:440px; padding:18px 20px; border:1px solid #eadfd3; border-radius:18px; box-shadow:none; overflow:auto; }
body.dispatcher-page .workspace-right-panel { grid-column:2; min-width:0; position:relative; top:auto; border:1px solid #eadfd3; border-radius:18px; box-shadow:none; padding:16px; }
body.dispatcher-page .routes-section-header { gap:12px; flex-wrap:wrap; background:#fff; padding:0 0 12px; margin:0; }
body.dispatcher-page .section-title { font-size:14px; font-weight:700; }
body.dispatcher-page .section-actions { flex-wrap:wrap; gap:8px; min-width:0; }
body.dispatcher-page .search-input-wrapper { max-width:100%; }
body.dispatcher-page .route-search-input { width:200px; max-width:100%; }
body.dispatcher-page .route-row-card { grid-template-columns:190px minmax(145px,1fr) 130px minmax(145px,1fr) 118px; gap:12px; min-width:820px; padding:20px 8px; }
body.dispatcher-page .route-header-cell { min-width:0; }
body.dispatcher-page .routes-grid { min-height:200px; }
body.dispatcher-page .asset-tabs-header { border:1px solid #eadfd3; border-radius:12px; background:#faf8f5; padding:4px; gap:4px; }
body.dispatcher-page .asset-tab-trigger { flex:1; padding:10px 8px; border-radius:9px; border-bottom:0; font-size:13px; }
body.dispatcher-page .asset-tab-trigger.active { background:#fff; color:#bd7534; box-shadow:0 1px 3px #5837140d; }
body.dispatcher-page .asset-search-box { font-size:12px; border-color:#eadfd3; border-radius:10px; background:#faf8f5; }
body.dispatcher-page .asset-list-shell { max-height:calc(100vh - var(--execution-header-height,80px) - 290px); min-height:180px; }
body.dispatcher-page .asset-items-container { max-height:inherit; overflow-y:auto; }
body.dispatcher-page .asset-draggable-item { border-radius:12px; }
body.dispatcher-page .suggestion-check-icon { pointer-events:none; }
body.dispatcher-page .workspace-left-panel:fullscreen { width:100vw; height:100vh; border-radius:0; }
body.dispatcher-page .dispatch-load-status { display:flex; align-items:center; justify-content:space-between; gap:12px; padding:12px; color:#806e5e; background:#faf8f5; border-radius:10px; font-size:13px; }
body.dispatcher-page .dispatch-load-status[hidden] { display:none; }
body.dispatcher-page .dispatch-load-status.is-error { color:#a52d40; background:#fff5f6; }
body.dispatcher-page #dispatch-retry { padding:6px 12px; border:1px solid #eadfd3; border-radius:8px; background:#fff; color:inherit; }
body.dispatcher-page button:focus-visible,body.dispatcher-page input:focus-visible { outline:2px solid #c27a3f; outline-offset:2px; }
@media(max-width:991px) { body.dispatcher-page #base > footer { left:0; } }
@media(max-width:1450px) { body.dispatcher-page .workspace-split-wrapper { grid-template-columns:minmax(0,1fr) 300px; gap:16px; } }
@media(max-width:991px) { body.dispatcher-page .workspace-split-wrapper { grid-template-columns:minmax(0,1fr); } body.dispatcher-page .workspace-left-panel,body.dispatcher-page .workspace-right-panel { grid-column:1; width:100%; } body.dispatcher-page .workspace-left-panel { height:auto; max-height:65vh; } body.dispatcher-page .workspace-right-panel { max-height:none; } body.dispatcher-page .asset-list-shell { max-height:320px; } }
@media(max-width:600px) { body.dispatcher-page .execution-page { padding:16px 12px 84px; } body.dispatcher-page .workspace-left-panel { padding:14px; } body.dispatcher-page .route-row-card { grid-template-columns:1fr; min-width:0; gap:18px; } body.dispatcher-page .section-actions { width:100%; } body.dispatcher-page .search-input-wrapper { width:100%; } body.dispatcher-page .route-search-input { width:100%; } body.dispatcher-page #execution-header { display:flex !important; flex-flow:row wrap !important; gap:8px; } body.dispatcher-page #execution-header .target-title { flex:0 0 100%; } body.dispatcher-page #execution-header .header-filter { flex:1 1 130px !important; width:auto !important; min-width:0 !important; } }

/* assignment-performance */
#performanceStatus { padding:14px 18px; margin-bottom:20px; border:1px solid var(--target-border); border-radius:12px; background:#fff; }
#performanceStatus.target-error { color:#a42236; border-color:#edb4be; background:#fff4f5; }
.performance-plan { margin:4px 0 0; font-size:11px; color:#a08c78; letter-spacing:.2px; }
.performance-plan:empty { display:none; }
.execution-performance #performanceMetricsToggle { display:inline-flex; align-items:center; gap:8px; background:#f6f3ef; border:0; border-radius:14px; font-size:11px; font-weight:600; white-space:nowrap; }
#performanceMetricsToggle .material-icons { font-size:17px; }
#performanceScope { color:#948373; font-size:12px; }
.performance-share { width:100%; display:flex; align-items:center; }
.performance-share.is-empty { height:36px; border-bottom:2px dashed #e4dcd4; color:#a69889; font-size:10px; justify-content:center; }
.performance-share-track { display:block; width:100%; height:8px; border-radius:12px; background:#f1ede8; overflow:hidden; }
.performance-share-track > span { display:block; height:100%; border-radius:12px; background:linear-gradient(90deg,#ef9b00,#c27a3f); }
.performance-share-track > span.is-positive { background:linear-gradient(90deg,#3ecf9a,#009b70); }
.performance-share-track > span.is-negative { background:linear-gradient(90deg,#ff7d96,#e90046); }

/* Tab strip */
.performance-tabs { display:grid; grid-template-columns:repeat(5,minmax(0,1fr)); gap:12px; margin-bottom:26px; }
.execution-performance .performance-tabs button { display:flex; flex-direction:column; align-items:flex-start; gap:6px; min-width:0; padding:16px 18px; border:1px solid var(--target-border); border-radius:16px; background:#fff; color:#76583e; text-align:left; }
.execution-performance .performance-tabs button:hover { border-color:#dcc6ab; background:#fffdf9; }
.execution-performance .performance-tabs button[aria-selected="true"] { border-color:var(--target-accent); background:#fffaf4; color:#8a5322; box-shadow:0 1px 3px #38251320; }
.performance-tabs .material-icons { font-size:22px; color:#b49781; }
.performance-tabs button[aria-selected="true"] .material-icons { color:var(--target-accent); }
.performance-tab-label { font-size:13px; font-weight:650; line-height:1.3; overflow-wrap:anywhere; }
.performance-tab-count { font-size:23px; font-weight:750; line-height:1.2; font-variant-numeric:tabular-nums; }
.performance-tabs button[data-tab="underperformance"][aria-selected="true"] .performance-tab-count { color:#e90046; }
.performance-tabs button[data-tab="ontarget"][aria-selected="true"] .performance-tab-count { color:#009b70; }
.performance-tabs button[data-tab="overachieving"][aria-selected="true"] .performance-tab-count { color:#c27a3f; }

/* Toolbar filter popover anchored to its own button */
.performance-filter-wrap { position:relative; }
.execution-performance .performance-filter-toggle { display:inline-flex; align-items:center; gap:8px; border-radius:10px; background:#fffaf5; color:#a65e26; padding:9px 15px; }
.execution-performance .performance-filter-toggle.is-active { border-color:var(--target-accent); background:#fff3e6; }
.performance-filter-toggle .material-icons { font-size:18px; }
#performanceFilterCount { min-width:18px; padding:1px 6px; border-radius:20px; background:var(--target-accent); color:#fff; font-size:11px; font-weight:700; }
.execution-performance .target-filter-panel { position:absolute; top:calc(100% + 8px); right:0; left:auto; width:320px; max-width:min(320px,calc(100vw - 32px)); max-height:none; }

/* Results */
#performanceResults { background:#fff; border:1px solid var(--target-border); border-radius:18px; overflow:hidden; }
#performanceResults .dataTables_wrapper { padding:0; min-height:0; }
#performanceTable,#performanceTable.dataTable,#performanceHourlyTable { width:100% !important; border-collapse:collapse !important; font-size:13px; margin:0 !important; border:0; }
#performanceTable { min-width:1180px; }
#performanceHourlyTable { min-width:940px; }
#performanceTable th,#performanceHourlyTable th { background:#fcfaf7; color:#8c7a68; font-weight:700; font-size:12px; letter-spacing:.5px; white-space:nowrap; }
#performanceTable th,#performanceTable td,#performanceHourlyTable th,#performanceHourlyTable td { box-sizing:border-box; padding:16px 20px; border-bottom:1px solid #f3ede7; text-align:left; vertical-align:middle; line-height:1.5; }
#performanceTable tbody tr,#performanceTable tbody tr.odd,#performanceTable tbody tr.even { background:#fff; }
#performanceTable tbody tr:hover td,#performanceHourlyTable tbody tr.performance-hourly-row:hover td { background:#fffdf9; }
#performanceTable tbody tr td { height:76px; background:#fff; box-shadow:none; }
#performanceTable th:nth-child(7),#performanceTable td:nth-child(7),#performanceTable th:nth-child(9),#performanceTable td:nth-child(9) { text-align:right; font-variant-numeric:tabular-nums; }
#performanceTable th:nth-child(8),#performanceTable td:nth-child(8) { text-align:center; font-variant-numeric:tabular-nums; }
#performanceTable td:nth-child(n+7) { white-space:nowrap; }
#performanceTable .target-progress { width:112px; margin:5px auto 0; }
#performanceHourlyTable th:nth-child(n+7),#performanceHourlyTable td:nth-child(n+7) { text-align:right; font-variant-numeric:tabular-nums; }
#performanceHourlyTable th:first-child,#performanceHourlyTable td:first-child { width:64px; padding-right:0; }
.performance-expand-head { position:absolute; width:1px; height:1px; overflow:hidden; clip-path:inset(50%); }
.performance-type-badge { display:inline-block; padding:5px 11px; border-radius:20px; font-size:12px; font-weight:650; white-space:nowrap; }
.performance-type-badge.is-excavator { color:#8a5322; background:#fff6ea; border:1px solid #f2dfc8; }
.performance-type-badge.is-hauler { color:#3f5d86; background:#f2f6fd; border:1px solid #d3e0f2; }
.performance-status { display:inline-block; padding:4px 10px; border-radius:6px; background:#f5f1ed; border:1px solid #eae1d8; font-size:11px; white-space:nowrap; }
.execution-performance .performance-expand { display:inline-flex; align-items:center; justify-content:center; width:30px; height:30px; padding:0; border-radius:50%; }
.performance-expand .material-icons { font-size:18px; color:#a97f52; }
.performance-expand:disabled .material-icons { color:#cdbfb1; }
.performance-hourly-detail > td { padding:0 !important; background:#fdfbf8; }
.performance-hourly-slots { width:100%; border-collapse:collapse; font-size:12px; }
.performance-hourly-slots th { background:#f7f2ec; color:#8c7a68; font-weight:700; font-size:11px; letter-spacing:.4px; }
.performance-hourly-slots th,.performance-hourly-slots td { padding:10px 20px; border-bottom:1px solid #f1e9e0; text-align:left; }
.performance-hourly-slots th:not(:first-child),.performance-hourly-slots td:not(:first-child) { text-align:right; font-variant-numeric:tabular-nums; }
.performance-hourly-slots tr:last-child td { border-bottom:0; }
.performance-empty { padding:26px 20px; color:#a79b90; text-align:center; }
@media(max-width:1280px) { .performance-tabs { grid-template-columns:repeat(3,minmax(0,1fr)); } }
@media(max-width:760px) { .performance-tabs { grid-template-columns:repeat(2,minmax(0,1fr)); } .execution-performance .target-filter-panel { position:fixed; top:auto; right:8px; left:8px; width:auto; max-width:none; } }



/* Assignment pages: webapp/Admin/wwwroot/css/shift-execution-live-events.css */
/* shift-execution-live-events */
.execution-live-events{color:#38291e;padding:16px;background:#faf8f5}
.execution-live-events .live-summary{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:18px;margin-bottom:24px}
.execution-live-events .live-summary article{background:#fff;border:1px solid #ead8c8;border-radius:18px;padding:24px;display:flex;flex-direction:column;gap:12px}
.execution-live-events .live-summary span{text-transform:uppercase;font-size:11px;letter-spacing:.6px;color:#927963}
.execution-live-events .live-summary strong{font-size:30px;line-height:1.2}.execution-live-events .live-summary small{font-size:12px}
.execution-live-events .critical{color:#e4003a}.execution-live-events .warning{color:#c96500}.execution-live-events .info{color:#0072bc}
.execution-live-events .live-results{background:#fff;border:1px solid #ead8c8;border-radius:18px;overflow:hidden}
.execution-live-events .live-toolbar,.execution-live-events .live-pagination{display:flex;align-items:center;gap:12px;flex-wrap:wrap;padding:18px;background:#fcfaf8}
.execution-live-events label{display:flex;flex-direction:column;gap:6px;font-size:12px;color:#806a57;margin:0}
.execution-live-events input,.execution-live-events select,.execution-live-events button{border:1px solid #ead8c8;border-radius:10px;background:#fff;padding:8px 12px;color:#493224;min-height:36px}
.execution-live-events input{min-width:260px}.execution-live-events button:disabled{opacity:.45;cursor:default}
.execution-live-events :focus-visible{outline:2px solid #c97737;outline-offset:2px}
.execution-live-events #eventsUpdated{margin-left:auto;font-size:12px;color:#806a57}
.execution-live-events .live-filters{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:14px;padding:18px;border-top:1px solid #ead8c8;border-bottom:1px solid #ead8c8}
.execution-live-events #eventsMessage{padding:12px 18px;margin:0}.execution-live-events #eventsMessage:empty{display:none}.execution-live-events .is-error{color:#c40032}
.execution-live-events .live-table-scroll{overflow-x:auto}.execution-live-events table{width:100%;border-collapse:collapse;min-width:1100px}
.execution-live-events th{background:#fcfaf8;text-align:left;color:#927963;font-size:12px;padding:18px;white-space:nowrap;border-bottom:1px solid #ead8c8}
.execution-live-events td{padding:16px 18px;border-bottom:1px solid #f3ebe4;font-size:13px}
.execution-live-events .event-pill{display:inline-block;border:1px solid currentColor;border-radius:8px;padding:4px 8px;font-size:11px;background:#fffcf8}
.execution-live-events .event-equipment{font-weight:700;color:#c97737}.execution-live-events .running{color:#00846c}.execution-live-events .stopped{color:#c40032}
.execution-live-events .live-pagination #eventsCount{margin-right:auto}.execution-live-events .live-pagination label{flex-direction:row;align-items:center}
@media(max-width:1000px){.execution-live-events .live-summary{grid-template-columns:repeat(2,minmax(0,1fr))}.execution-live-events .live-filters{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:600px){.execution-live-events{padding:8px}.execution-live-events .live-summary{gap:8px}.execution-live-events .live-summary article{padding:14px}.execution-live-events .live-filters{grid-template-columns:repeat(2,minmax(0,1fr))}.execution-live-events input{min-width:0;width:100%}}



/* Assignment pages: webapp/Admin/wwwroot/css/shift-execution-people.css */
.shift-execution:has(.execution-people) { background:#faf8f5; }
.execution-people { color:#182334; --people-border:#eadfd3; }
.execution-people .execution-summary { grid-template-columns:repeat(4,minmax(0,1fr)); }
.execution-people .execution-metric { min-height:104px; border-radius:18px; padding:20px 24px; background:#fff; }
.execution-people .execution-metric-value { font-size:28px; margin:5px 0; }
.execution-people .execution-metric-label { text-transform:none; font-size:12px; }
.execution-people .people-results { background:transparent; border:0; box-shadow:none; padding:0; }
.execution-people .mobileHeader { display:none; }
.people-toolbar { display:flex; align-items:center; gap:16px; padding:14px 20px; background:#fff; border:1px solid var(--people-border, #eadfd3); border-radius:18px; margin-bottom:26px; flex-wrap:wrap; width:100%; }
.people-search { display:flex; align-items:center; gap:10px; background:#faf8f5; border:1px solid var(--people-border, #eadfd3); border-radius:12px; padding:8px 14px; margin:0; width:300px; flex-shrink:0; }
.people-search .material-icons { color:#a38b75; font-size:18px; }
.people-search input { border:0; outline:none; background:transparent; min-width:0; width:100%; font-size:12px; }
.people-profile-select { display:flex; align-items:center; gap:8px; margin:0; font-size:13px; color:#76583e; font-weight:500; white-space:nowrap; flex-shrink:0; }
.people-profile-select select { border:1px solid var(--people-border, #eadfd3); border-radius:10px; background:#faf8f5; padding:8px 12px; color:#76583e; font-size:13px; font-weight:500; outline:none; min-width:220px; }
#peopleAdd.people-primary { flex-shrink:0; white-space:nowrap; margin-left:auto; background:#c27a3f; color:#fff; border:0; border-radius:10px; padding:10px 18px; font-weight:600; font-size:13px; cursor:pointer; }
#peopleAdd.people-primary:disabled { opacity:0.6; cursor:not-allowed; }
.people-blood-group { display:block; margin-top:8px; font-size:11px; color:#948373; }
.people-toolbar input:focus-visible,.people-toolbar button:focus-visible,.people-toolbar select:focus-visible { outline:2px solid #c27a3f; outline-offset:3px; }


/* Shared Assignment runtime styles */

/* Target-only reference layout; Performance shares the base classes. */
#executionTarget .target-overview { border-radius: 18px; }
#executionTarget .target-overview-title { padding: 18px 23px; min-height: 78px; }
#executionTarget .target-metrics { gap: 18px; padding: 18px 23px 22px; }
#executionTarget .target-metric { min-height: 236px; border-radius: 18px; padding: 18px; }
#executionTarget .target-metric-value > strong { font-size: 29px; font-weight: 750; }
#executionTarget .target-toolbar { padding: 22px; gap: 18px; min-height: 90px; }
#executionTarget #targetMaterials { display: flex; align-items: center; flex-wrap: wrap; gap: 9px; }
#executionTarget #targetMaterials button { min-height: 35px; padding: 7px 14px; border-radius: 14px; font-weight: 600; }
#executionTarget #targetMaterials button[aria-pressed="true"] { background: #c67c3c; border-color: #c67c3c; color: #fff; }
#executionTarget .target-search { flex: 1 1 280px; max-width: 505px; }
#executionTarget .target-structures { border-radius: 14px; padding: 5px; }
#executionTarget .target-structures button { padding: 9px 14px; border-radius: 10px; }
#executionTarget .target-table-scroll { border: 1px solid #eadfd3; border-radius: 18px; }
#executionTarget #targetTable th { background: #fcfaf7; color: #948373; font-size: 12px; padding: 16px 20px; }
#executionTarget #targetTable td { height: 82px; padding: 16px 20px; }
#executionTarget #targetTable tbody tr:nth-child(even) td { background: #fdfbfa; }
#executionTarget .target-volume-cell strong, #executionTarget .target-volume-cell small { text-align: right; }
@media (max-width: 650px) {
    #executionTarget .target-toolbar { padding: 16px; }
    #executionTarget .target-search { max-width: none; }
}

#executionEquipment .equipment-metric { min-height: 96px; border-radius: 16px; padding: 18px; }
#executionEquipment .equipment-outline-icon { display: inline-flex; width: 19px; height: 19px; flex-shrink: 0; color: #7560ff; }
#executionEquipment .equipment-outline-icon svg { width: 100%; height: 100%; }
#executionEquipment .equipment-metric-1 .equipment-outline-icon { color: #00b985; }
#executionEquipment .equipment-metric-2 .equipment-outline-icon { color: #ff2764; }
#executionEquipment .equipment-metric-3 .equipment-outline-icon { color: #e49300; }
#executionEquipment .equipment-metric-2 .equipment-metric-tag { background: #ff87a3; color: #fff; border-color: #ff87a3; }
#executionEquipment .equipment-toolbar { padding: 22px 24px; gap: 12px; }
#executionEquipment .equipment-kinds button { border-radius: 10px; min-height: 36px; padding: 8px 22px; }
#executionEquipment .equipment-kinds button[aria-pressed="true"] { background: #c67c3c; }
#executionEquipment .equipment-filter-icon { width: 18px; height: 18px; flex-shrink: 0; }
#executionEquipment .equipment-filter-toggle { display: inline-flex; align-items: center; gap: 8px; color: #936844; border-radius: 12px; }
@media (max-width: 650px) {
    #executionEquipment .equipment-toolbar { padding: 14px; }
}

/* People roster: compact, aligned rows scoped to the execution page. */
#executionPeople .people-metric { min-height: 102px; padding: 20px 24px; }
#executionPeople .people-metric strong { font-weight: 700; }
#executionPeople .people-toolbar { min-height: 76px; padding: 16px 18px; }
#executionPeople .people-profile-select select { border: 1px solid #eadfd3; border-radius: 12px; background: #f4f0ec; padding: 9px 12px; max-width: 260px; }
#executionPeople .people-person {
    grid-template-columns: minmax(250px, 2.3fr) minmax(100px, .8fr) minmax(100px, .8fr) minmax(130px, 1fr) minmax(80px, .6fr) auto;
    min-height: 110px;
    padding: 20px 24px;
    gap: 24px;
    margin-bottom: 18px;
    border-radius: 20px;
}
#executionPeople .people-identity { min-width: 0; gap: 18px; }
#executionPeople .people-avatar { flex-basis: 60px; height: 60px; }
#executionPeople .people-identity strong { display: inline; margin-right: 10px; line-height: 24px; }
#executionPeople .people-profile-label { padding: 2px 10px; font-size: 10px; vertical-align: middle; }
#executionPeople .people-identity .people-inline-punchin { margin-top: 4px; font-size: 10px; }
#executionPeople .people-field { min-width: 0; }
#executionPeople .people-field small { font-size: 11px; font-weight: 600; margin-bottom: 7px; }
#executionPeople .people-field strong { overflow-wrap: anywhere; }
#executionPeople .people-blood-field strong { display: inline-block; color: #dc2857; background: #fff1f5; border-radius: 5px; padding: 2px 8px; }
#executionPeople .people-row-actions { display: flex; align-items: center; gap: 12px; }
#executionPeople .people-row-actions button { min-height: 42px; padding: 10px 20px; font-weight: 600; white-space: nowrap; }
@media (max-width: 1300px) {
    #executionPeople .people-person { grid-template-columns: minmax(240px, 2fr) repeat(2, minmax(120px, 1fr)); gap: 18px; }
    #executionPeople .people-row-actions { justify-content: flex-end; }
}
@media (max-width: 650px) {
    #executionPeople .people-person { grid-template-columns: repeat(2, minmax(0, 1fr)); padding: 18px; }
    #executionPeople .people-identity, #executionPeople .people-row-actions { grid-column: 1 / -1; }
    #executionPeople .people-profile-select { white-space: normal; flex-wrap: wrap; }
    #executionPeople .people-profile-select select { min-width: 0; max-width: 100%; }
}

	.monitor-icon-on {
		display: none;
	}
	.swal-hauler-list {
		list-style: none;
		padding: 0;
		margin: 0.75rem 0 0;
		text-align: left;
	}
	.swal-hauler-list-item {
		display: flex;
		align-items: center;
		justify-content: space-between;
		padding: 8px 12px;
		margin-bottom: 6px;
		background: #fafafa;
		border: 1px solid #ebebeb;
		border-radius: 6px;
		gap: 10px;
	}
	.swal-hauler-name {
		font-size: 0.875rem;
		font-weight: 500;
		color: #333;
	}
	.restore-hauler-btn {
		display: inline-flex;
		align-items: center;
		padding: 4px 10px;
		font-size: 0.75rem;
		font-weight: 500;
		color: #B57423;
		background: #fff8f0;
		border: 1px solid #B57423;
		border-radius: 20px;
		cursor: pointer;
		white-space: nowrap;
		transition: background 0.15s, color 0.15s;
	}
	.restore-hauler-btn:hover {
		background: #B57423;
		color: #fff;
	}
	.restore-hauler-icon {
		margin-right: 4px;
	}

	.assignment-route-label {
		display: inline-flex;
		align-items: center;
		gap: 5px;
		width: fit-content;
		max-width: 100%;
		margin-left: 8px;
		padding: 1px 6px;
		border: 0;
		border-radius: 4px;
		background: transparent;
		font-size: inherit;
		font-weight: 700;
		line-height: 1.25;
		color: #60717a;
		white-space: nowrap;
		overflow: hidden;
		text-overflow: ellipsis;
	}

	.label-text-name {
		display: inline-flex;
		align-items: center;
		flex-wrap: nowrap;
		min-width: 0;
	}

	.machine-title .assignment-route-label {
		margin-left: 8px;
		margin-top: 0;
		vertical-align: middle;
	}

	.assignment-route-label .route-divider {
		color: #94a1a8;
		font-weight: 700;
	}

	.monitor-icon-off {
		display: inline-flex;
		align-items: center;
	}

	.monitor-toggle-wrap.monitor-on .monitor-icon-off {
		display: none;
	}

	.monitor-toggle-wrap.monitor-on .monitor-icon-on {
		display: inline-flex;
		align-items: center;
	}
	.monitor-toggle-wrap {
		display: flex;
		align-items: center;
		gap: 8px;
		cursor: pointer;
		user-select: none;
	}

	.monitor-toggle-label {
		font-size: 13px;
		font-weight: 600;
		color: #555;
	}

	.monitor-toggle-switch {
		width: 44px;
		height: 22px;
		background: #ccc;
		border-radius: 999px;
		position: relative;
		transition: background 0.25s ease;
	}

	.monitor-toggle-knob {
		width: 18px;
		height: 18px;
		background: #fff;
		border-radius: 50%;
		position: absolute;
		top: 2px;
		left: 2px;
		transition: left 0.25s ease;
		box-shadow: 0 1px 3px rgba(0,0,0,0.3);
	}

	.monitor-toggle-wrap.monitor-on .monitor-toggle-switch {
		background: #f4a426;
	}

	.monitor-toggle-wrap.monitor-on .monitor-toggle-knob {
		left: 24px;
	}

	.monitor-toggle-wrap.monitor-on .monitor-toggle-label {
		color: #f4a426;
	}
	.tooltip-inner {
		background-color: white !important;
		color: black !important;
	}

	.tooltip.bs-tooltip-top {
		text-align: left;
	}

	span.select2-dropdown.select2-dropdown--below {
		z-index: 99999;
		width: 216px !important;
	}

	a.disabled {
		pointer-events: none;
		opacity: 0.5;
		cursor: not-allowed;
	}

	.hidden {
		display: none !important;
	}

	header#header {
		z-index: 9999 !important;
	}

	.xdsoft_datetimepicker {
		z-index: 99999999999 !important;
	}

	.filter-item .select2-container--default .select2-selection--single {
		height: 9px !important;
		border: none;
	}

	.select2-container--default .select2-selection--single {
		background-color: transparent !important;
	}

	body.shift-execution #base {
		padding-top: 0px !important;
	}

	span.select2-dropdown.select2-dropdown--below {
		margin-top: 5px;
	}

	body.shift-execution .main-content {
		width: 100%;
		height: auto !important;
		overflow-y: visible !important;
	}

	.expanded-card {
		background: #ffffff;
		border-radius: 12px;
		padding: 20px 24px;
		box-shadow: 0 4px 12px rgba(0,0,0,0.06);
		border: 1px solid #ececec;
	}

	.expanded-header {
		display: flex;
		justify-content: space-between;
		align-items: center;
		margin-bottom: 18px;
	}

	.machine-title {
		font-size: 20px;
		font-weight: 600;
		color: #333;
	}

	.machine-title span {
		background: #f3f4f6;
		padding: 4px 8px;
		font-size: 13px;
		border-radius: 6px;
		margin-left: 8px;
		color: #666;
	}

	.expanded-trucking-status {
		display: inline-flex;
		align-items: center;
		gap: 6px;
		margin-left: 10px;
		padding: 5px 10px;
		border-radius: 6px;
		font-size: 12px;
		font-weight: 700;
		line-height: 1;
		white-space: nowrap;
		border: 1px solid transparent;
	}

	.expanded-trucking-status::before {
		content: "";
		width: 7px;
		height: 7px;
		border-radius: 50%;
		background: currentColor;
	}

	.expanded-trucking-status.status-under {
		background: #fff3cd;
		border-color: #ffd65a;
		color: #7a5200;
	}

	.expanded-trucking-status.status-over {
		background: #f8d7da;
		border-color: #f1aeb5;
		color: #842029;
	}

	.expanded-trucking-status.status-normal {
		background: #d1e7dd;
		border-color: #a3cfbb;
		color: #0f5132;
	}

	.select2-selection__arrow {
		display: none !important;
	}

	.expanded-metrics {
		display: grid;
		grid-template-columns: repeat(3,1fr);
		gap: 16px;
		margin-bottom: 20px;
	}

	.metric {
		background: #f8fafc;
		padding: 12px 16px;
		border-radius: 8px;
		border: 1px solid #e5e7eb;
	}

	.metric label {
		font-size: 12px;
		color: #8b8b8b;
		display: block;
		margin-bottom: 4px;
	}

	.metric span {
		font-size: 16px;
		font-weight: 600;
		color: #333;
	}

	.status {
		font-weight: 600;
	}

	.status.Breakdown {
		color: #dc2626;
	}

	.status.Working {
		color: #16a34a;
	}

	.status.Stopped {
		color: #f59e0b;
	}

	.hauleroperatorDropZone.hauler-stopped-row {
		background: #fff5f5;
		border-color: #f1a3a3;
		box-shadow: inset 3px 0 0 #d94b4b;
	}

	.hauleroperatorDropZone.hauler-stopped-row .hauler-status-text {
		color: #a33a3a;
		font-weight: 700;
	}

	.expanded-operator {
		display: grid;
		grid-template-columns: 1fr 1fr;
		gap: 16px;
		margin-bottom: 20px;
	}

	.operator-card {
		background: #ffffff;
		border: 1px solid #e5e7eb;
		border-radius: 10px;
		padding: 14px 16px;
		display: flex;
		flex-direction: column;
		width: 100%;
		min-height: 130px;
	}

	.operator-section {
		display: flex;
		align-items: center;
		gap: 10px;
		border: 1px solid #ECECEC;
		border-radius: 8px;
		margin: 12px 12px;
		padding: 20px 20px;
	}

	.operator-card label {
		font-size: 12px;
		color: #9ca3af;
		margin-bottom: 4px;
	}

	.operator-card span {
		font-size: 15px;
		font-weight: 600;
		color: #374151;
	}

	.expanded-haulers {
		margin-top: 8px;
	}

	.expanded-haulers h4 {
		font-size: 20px;
		font-weight: 700;
		margin-bottom: 12px;
		color: #374151;
		font-family: Plus Jakarta Sans;
		line-height: 100%;
		letter-spacing: 0%;
		margin-left: 12px;
	}

	.expanded-haulers table {
		width: 100%;
		border-collapse: collapse;
	}

	.expanded-haulers thead {
		background: #f1f5f9;
	}

	.expanded-haulers th {
		text-align: left;
		font-size: 13px;
		padding: 12px;
		color: #6b7280;
		font-weight: 600;
	}

	.expanded-haulers td {
		padding: 12px;
		font-size: 14px;
		border-bottom: 1px solid #e5e7eb;
	}

	.status-breakdown {
		background: #fff1f2;
		border-left: 3px solid #ef4444;
	}

	.hauleroperatorDropZone.status-breakdown {
		background: #fff1f2;
		border-left: 3px solid #dc2626;
	}

	.hauleroperatorDropZone.status-breakdown strong,
	.hauleroperatorDropZone.status-breakdown .speed-cal,
	.hauleroperatorDropZone.status-breakdown .hauler-status-text {
		color: #dc2626 !important;
	}

	.stoppage-drop-message {
		align-items: center;
		color: #333;
		display: flex;
		font-weight: 600;
		justify-content: center;
		min-height: 48px;
		text-align: center;
		width: 100%;
	}

	.stoppage-readonly-card .btn-save,
	.stoppage-readonly-card .addHauler,
	.stoppage-readonly-card #assignment_breadcrumb {
		opacity: 0.5;
		pointer-events: none;
	}

	.status-working {
		background: #f0fdf4;
	}

	.status-idle {
		background: #f9fafb;
	}

	.hauler-info strong {
		font-weight: 600;
		color: #374151;
	}

	.hauler-info .text-muted {
		font-size: 12px;
		color: #9ca3af;
	}

	.replacement-option {
		border: 1px solid #e9ecef;
		border-radius: 12px;
		padding: 15px 20px;
		background-color: #fff;
		transition: box-shadow 0.2s ease;
		cursor: pointer;
		max-width: 500px;
	}

	.replacement-single-select {
		appearance: none;
		-webkit-appearance: none;
		width: 24px;
		height: 24px;
		border-radius: 50%;
		border: 2px solid #ddd;
		margin-right: 15px;
		display: flex;
		align-items: center;
		justify-content: center;
		cursor: pointer;
	}

	.replacement-single-select:checked {
		background-color: #1a8764;
		border-color: #1a8764;
	}

	.replacement-single-select:checked::after {
		content: '✓';
		color: white;
		font-size: 14px;
		font-weight: bold;
	}

	.replacement-label-text {
		display: flex;
		flex-direction: column;
		font-family: sans-serif;
		font-size: 1.1rem;
		color: #333;
		font-weight: 500;
	}

	.hauler-trip-status {
		font-size: 10px;
		font-weight: 600;
		color: #4a7c6f;
		background: #e6f4f1;
		padding: 2px 7px;
		border-radius: 10px;
		white-space: nowrap;
		max-width: 90px;
		overflow: hidden;
		text-overflow: ellipsis;
		display: inline-block;
		vertical-align: middle;
	}

	.assignment-card-v2 .body-card {
		display: block !important;
		min-height: 48px !important;
		overflow: visible !important;
	}

	.assignment-card-v2 .body-card li.hauleroperatorDropZone {
		display: grid !important;
		grid-template-columns: 82px minmax(0, 1fr) 148px 62px !important;
		align-items: center !important;
		column-gap: 10px !important;
		height: 46px !important;
		min-height: 46px !important;
		padding: 9px 10px !important;
		overflow: visible !important;
		list-style: none !important;
	}

	.assignment-card-v2 .hauler-trip-cell {
		display: flex !important;
		align-items: center !important;
		justify-content: flex-end !important;
		gap: 8px !important;
		white-space: nowrap !important;
	}

	.assignment-card-v2 .hauler-trip-status {
		max-width: 82px !important;
		padding: 4px 8px !important;
		font-size: 11px !important;
		line-height: 1 !important;
	}

	.assignment-card-v2 .hauler-trips-cell {
		color: #004f95 !important;
		font-size: 17px !important;
		font-weight: 900 !important;
		white-space: nowrap !important;
	}

	.assignment-card-v2 .speed-cal {
		font-size: 12px !important;
		line-height: 1.1 !important;
		text-align: right !important;
		white-space: nowrap !important;
	}
	#map-tab-content .card .card-body:not(.card-body.card-line) {
    height: 90vh !important;
	}

	#map-tab-content .map-scroll {
		height: 79vh !important;
	}

/* Line Up Activity presentation only: shared Assignment/Dispatch rules stay intact. */
.lineup-activity-page #tab-sector-content .Assesment_card {
    background: #fff !important;
    border: 1px solid #eadfd3 !important;
    border-radius: 18px !important;
    padding: 12px !important;
    box-shadow: 0 2px 3px #34200e0a !important;
}
.lineup-activity-page #tab-sector-content .Assesment_card > .row > .col-lg-8,
.lineup-activity-page #tab-sector-content .Assesment_card .info-container { display: contents !important; }
.lineup-activity-page #tab-sector-content .Assesment_card { min-width: 0; max-width: 100%; box-sizing: border-box; }
.lineup-activity-page #tab-sector-content .Assesment_card > .row { gap: 10px; }
.lineup-activity-page #tab-sector-content .Assesment_card .assignment-metric {
    flex: 0 1 auto !important;
    width: max-content;
    min-width: 120px;
    max-width: 100% !important;
    min-height: 60px;
    box-sizing: border-box;
}
.lineup-activity-page #tab-sector-content .Assesment_card .assignment-metric-value {
    flex-wrap: wrap;
    white-space: normal;
    overflow-wrap: anywhere;
}
.lineup-activity-page #tab-sector-content .Assesment_card .filter_field {
    flex: 1 1 220px;
    min-width: min(220px, 100%);
    max-width: 340px;
    margin: 0;
}
.lineup-activity-page #tab-sector-content .Assesment_card .info-container > .d-flex { flex-wrap: wrap; }
.lineup-activity-page .Assesment_card .isAutoAllocation_craftmyapp_container { min-height: 60px; }
.lineup-activity-page .assignment-container .assignment-card-v2 .assignment-head {
    border-radius: 24px !important;
    height: 58px !important;
    min-height: 58px !important;
    box-sizing: border-box !important;
    padding: 10px 18px !important;
}
.lineup-activity-page .assignment-container .assignment-card-v2 .border-style { padding: 16px 18px !important; }
.lineup-activity-page .assignment-container .assignment-card-v2 .body-secound-row { margin-top: 12px !important; }
.lineup-activity-page .assignment-container .assignment-card-v2 .body-secound-card {
    margin-top: 12px !important;
    padding: 0 !important;
    border-top: 0 !important;
}
.lineup-activity-page .assignment-container .assignment-card-v2 .ass-box {
    min-height: 48px !important;
    padding: 8px 12px !important;
}
.lineup-activity-page .assignment-card-v2 .ass-box strong {
    white-space: normal;
    overflow-wrap: anywhere;
    line-height: 1.4;
}
.lineup-activity-page .assignment-container .assignment-card-v2 .hauler-list-container.assign-lst {
    height: auto !important;
    max-height: 220px !important;
    padding-right: 6px !important;
    overflow-y: auto !important;
}
.lineup-activity-page .assignment-container .assignment-card-v2 .hauler-list-container ul {
    height: auto !important;
    max-height: none !important;
    overflow: visible !important;
    gap: 7px !important;
}
.lineup-activity-page .assignment-container .assignment-card-v2 .body-card {
    flex: 0 0 auto !important;
    height: auto !important;
    max-height: none !important;
    margin: 0 !important;
}
.lineup-activity-page .assignment-container .assignment-card-v2 .body-card li.hauleroperatorDropZone {
    grid-template-columns: 76px minmax(0, 1fr) 80px 54px 68px !important;
    height: auto !important;
    min-height: 54px !important;
    box-sizing: border-box !important;
    margin: 0 !important;
    float: none !important;
    width: 100% !important;
    padding: 6px 12px !important;
    column-gap: 10px !important;
}
.lineup-activity-page .assignment-container .assignment-card-v2 .body-card label,
.lineup-activity-page .assignment-container .assignment-card-v2 .body-card label span {
    white-space: normal !important;
    overflow: visible !important;
    overflow-wrap: anywhere;
    line-height: 1.4 !important;
    font-size: 11px !important;
}
.lineup-activity-page .assignment-container .assignment-card-v2 .hauler-trip-cell {
    display: contents !important;
}
.lineup-activity-page .assignment-container .assignment-card-v2 .body-card li.hauleroperatorDropZone > label {
    grid-column: 2;
    grid-row: 1;
    align-self: center !important;
    height: auto !important;
    min-height: 0 !important;
    padding-block: 0 !important;
    margin: 0 !important;
}
.lineup-activity-page .assignment-container .assignment-card-v2 .hauler-trip-status {
    grid-column: 3;
    grid-row: 1;
    align-self: center !important;
    padding: 2px 6px !important;
    font-size: 10px !important;
    line-height: 12px !important;
}
.lineup-activity-page .assignment-container .assignment-card-v2 .hauler-trips-cell { grid-column: 4; grid-row: 1; align-self: center !important; }
.lineup-activity-page .assignment-container .assignment-card-v2 .hauler-speed-cell { grid-column: 5; grid-row: 1; align-self: center !important; }
.lineup-activity-page .assignment-container .assignment-card-v2 .hauler-equipment-cell strong { font-size: 13px !important; }
.lineup-activity-page .assignment-container .assignment-card-v2 .hauler-trips-cell { font-size: 13px !important; line-height: 18px !important; }
.lineup-activity-page .assignment-card-v2 .hauler-trip-status { max-width: 100% !important; }
.lineup-activity-page .assignment-card-v2 .hauler-equipment-cell { min-width: 0; overflow-wrap: anywhere; }
@media (min-width: 992px) and (max-width: 1450px) {
    .lineup-activity-page .assignment-container { grid-template-columns: minmax(0, 1fr); }
}
@media (max-width: 600px) {
    .lineup-activity-page .assignment-container .assignment-card-v2 .body-card li.hauleroperatorDropZone {
        grid-template-columns: 65px minmax(65px, 1fr) 66px !important;
    }
    .lineup-activity-page .assignment-container .assignment-card-v2 .hauler-trip-status { grid-column: 2; grid-row: 2; justify-self: start !important; margin: 0 !important; }
    .lineup-activity-page .assignment-container .assignment-card-v2 .hauler-trips-cell { grid-column: 3; grid-row: 2; }
    .lineup-activity-page .assignment-container .assignment-card-v2 .hauler-speed-cell { grid-column: 3; grid-row: 1; }
}

/* People tab pagination styles */
.people-footer-toolbar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-top: 18px;
    padding: 12px 18px;
    background: #fff;
    border: 1px solid var(--people-border, #eadfd3);
    border-radius: 12px;
}
.people-footer-toolbar #peopleCount {
    margin: 0;
    font-size: 13px;
    color: #76583e;
    font-weight: 500;
}
.people-pagination {
    display: flex;
    align-items: center;
    gap: 12px;
}
.people-page-btn {
    border: 1px solid var(--people-border, #eadfd3);
    border-radius: 8px;
    background: #faf8f5;
    padding: 6px 14px;
    color: #76583e;
    font-size: 13px;
    font-weight: 500;
    cursor: pointer;
    transition: all 0.2s ease;
}
.people-page-btn:hover:not(:disabled) {
    background: #f0e7dc;
    border-color: #c27a3f;
}
.people-page-btn:disabled {
    opacity: 0.5;
    cursor: not-allowed;
}
#peoplePageInfo {
    font-size: 13px;
    color: #76583e;
    font-weight: 500;
}

/* AI Studio People Modal Dialog Styles */
#peopleLogDialog {
    border: 0;
    border-radius: 28px;
    padding: 0;
    width: 504px;
    height: min(640px, calc(100vh - 48px));
    max-width: calc(100vw - 32px);
    max-height: calc(100vh - 48px);
    background: #ffffff;
    box-shadow: 0 20px 50px rgba(0, 0, 0, 0.22);
    margin: auto 18px auto auto;
    overflow: hidden;
}
#peopleLogDialog[open] {
    display: flex;
    flex-direction: column;
}
#peopleLogDialog::backdrop {
    background: rgba(0, 0, 0, 0.45);
    backdrop-filter: blur(4px);
}
#peopleLogDialog .people-close {
    position: absolute;
    z-index: 2;
    top: 18px;
    right: 18px;
    width: 36px;
    height: 36px;
    border-radius: 50%;
    border: 1px solid #eadfd3;
    background: #fffaf4;
    color: #9a826b;
    padding: 0;
    font-size: 22px;
    font-weight: 300;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    transition: background 0.2s ease, color 0.2s ease;
}
#peopleLogDialog .people-close:hover {
    background: #e8dfd3;
    color: #1e1b18;
}
#peopleLogContent {
    display: flex;
    flex: 1 1 auto;
    flex-direction: column;
    min-height: 0;
    padding: 0;
    overflow: hidden;
}
.people-dialog-scroll {
    flex: 1 1 auto;
    min-height: 0;
    overflow-y: auto;
    scrollbar-gutter: stable;
    padding: 46px 20px 18px 26px;
}
.people-dialog-scroll::-webkit-scrollbar { width:6px; }
.people-dialog-scroll::-webkit-scrollbar-track { background:transparent; }
.people-dialog-scroll::-webkit-scrollbar-thumb { border-radius:8px; background:#c9c5c0; }
.people-dialog-scroll::-webkit-scrollbar-thumb:hover { background:#a9a39c; }

/* Header Avatar & Titles */
#peopleLogDialog .people-dialog-header {
    display: flex !important;
    flex-direction: column;
    align-items: center !important;
    justify-content: flex-start;
    width: 100%;
    text-align: center !important;
    flex: 0 0 auto;
    margin-bottom: 26px;
}
#peopleLogDialog .people-dialog-avatar-wrap {
    position: relative;
    display: block;
    align-self: center;
    width: 84px;
    height: 84px;
    margin: 0 auto 14px;
}
#peopleLogDialog .people-dialog-avatar {
    width: 84px;
    height: 84px;
    border-radius: 50%;
    background: #364152;
    color: #ffffff;
    font-size: 25px;
    font-weight: 700;
    display: flex;
    align-items: center;
    justify-content: center;
    letter-spacing: 0.5px;
}
#peopleLogDialog .people-avatar-status {
    position: absolute;
    bottom: 2px;
    right: 2px;
    width: 16px;
    height: 16px;
    border-radius: 50%;
    background: #10b981;
    border: 2.5px solid #ffffff;
}
#peopleLogDialog .people-dialog-subid {
    align-self:center;
    width:100%;
    font-size: 12px;
    color: #8c8780;
    margin-bottom: 7px;
    font-weight: 600;
}
#peopleLogDialog .people-dialog-name {
    align-self:center;
    width:100%;
    font-size: 21px;
    font-weight: 700;
    color: #1e1b18;
    margin: 0 0 9px 0;
    line-height: 1.2;
}
#peopleLogDialog .people-dialog-profile-badge {
    align-self:center;
    display: inline-block;
    background: #fdf4ec;
    color: #c0682b;
    font-size: 13px;
    font-weight: 600;
    padding: 5px 16px;
    border-radius: 20px;
}

/* Roster Info Card */
.people-log-info {
    display: block;
    flex: 0 0 auto;
    background: #f9f6f0;
    border: 1px solid #eee5da;
    border-radius: 18px;
    padding: 20px 19px;
    margin-bottom: 26px;
    text-align: left;
}
.people-info-title {
    font-size: 14px;
    font-weight: 600;
    color: #8c8780;
    margin: 0 0 18px 0;
    text-transform: none;
    letter-spacing: 0.1px;
}
.people-info-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    column-gap: 34px;
    row-gap: 18px;
}
.people-info-grid .people-field {
    display: flex;
    flex-direction: column;
    gap: 3px;
    text-align: left;
}
.people-info-grid .people-field small {
    font-size: 13px;
    color: #8c8780;
    font-weight: 500;
    white-space: nowrap;
}
.people-info-grid .people-field strong {
    font-size: 14px;
    color: #1e1b18;
    font-weight: 700;
    word-break: break-word;
}
.people-info-grid .people-field strong.is-blood {
    color: #dc2626;
}
.people-info-grid .people-field strong.is-status-active {
    color: #059669;
}

/* Recent Operational Logs Timeline */
.people-log-section {
    text-align: left;
    margin-bottom: 0;
}
.people-logs-title {
    font-size: 14px;
    font-weight: 700;
    color: #1e1b18;
    margin: 0 0 14px 0;
}
.people-log-timeline {
    display: flex;
    flex-direction: column;
    gap: 12px;
}
.people-log-event {
    position: relative;
    padding-left: 14px;
    border-left: 3px solid #c0682b;
    display: flex;
    flex-direction: column;
    gap: 3px;
    text-align: left;
}
.people-event-title {
    font-size: 13px;
    font-weight: 700;
    color: #1e1b18;
}
.people-event-time {
    font-size: 12px;
    color: #8c8780;
}
.people-event-note {
    font-size: 12px;
    color: #5c564e;
}
.people-log-empty {
    font-size: 13px;
    color: #8c8780;
    margin: 0;
    line-height: 1.5;
    text-align: left;
}

/* Dialog Bottom Actions */
.people-dialog-actions {
    flex: 0 0 auto;
    display: flex;
    align-items: center;
    gap: 12px;
    margin: 0;
    padding: 18px 26px 26px;
    border-top: 1px solid #eee6de;
    background:#fff;
}
#peopleLogDialog .people-btn-edit {
    flex: 1;
    background: #f3ece1;
    color: #3a3229;
    border: none;
    border-radius: 14px;
    min-height: 44px;
    padding: 11px 20px;
    font-size: 14px;
    font-weight: 700;
    cursor: pointer;
    text-align: center;
    transition: background 0.2s ease;
}
#peopleLogDialog .people-btn-edit:hover {
    background: #e8dfd3;
}
#peopleLogDialog .people-btn-remove {
    background: #fdf2f2;
    color: #dc2626;
    border: none;
    border-radius: 14px;
    min-height: 44px;
    padding: 11px 24px;
    font-size: 14px;
    font-weight: 700;
    cursor: pointer;
    text-align: center;
    transition: background 0.2s ease;
}
#peopleLogDialog .people-btn-remove:hover {
    background: #fce4e4;
}
@media(max-width:650px) {
    #peopleLogDialog { width:calc(100vw - 24px); height:calc(100vh - 24px); max-width:none; max-height:none; margin:auto; border-radius:22px; }
    .people-dialog-scroll { padding:42px 12px 16px 18px; }
    .people-dialog-actions { padding:16px 18px 18px; }
    .people-info-grid { column-gap:18px; }
}


/* ==========================================================================
   Vehicle Tracking & History Panel Styles (moved from Daily_Plan.cshtml)
   ========================================================================== */
                                        #vehicleTrackPanel {
                                            background: #fdfaf6;
                                            border: 1px solid #f0e3d3;
                                            border-radius: 10px;
                                            padding: 14px;
                                            margin: 10px 0;
                                            box-shadow: 0 1px 3px rgba(0,0,0,0.04);
                                        }
                                        .vehicle-track-switch { position: relative; display: inline-block; width: 34px; height: 18px; margin: 0; }
                                        .vehicle-track-switch input { opacity: 0; width: 0; height: 0; }
                                        .vehicle-track-slider { position: absolute; cursor: pointer; inset: 0; background-color: #ddd; border-radius: 18px; transition: .3s; }
                                        .vehicle-track-slider:before { content: ""; position: absolute; height: 14px; width: 14px; left: 2px; top: 2px; background: #fff; border-radius: 50%; transition: .3s; }
                                        .vehicle-track-switch input:checked + .vehicle-track-slider { background-color: #c2712c; }
                                        .vehicle-track-switch input:checked + .vehicle-track-slider:before { transform: translateX(16px); }
                                        /* loader shown on the toggle knob itself while tracks load */
                                        .vehicle-track-switch.vt-loading { pointer-events: none; }
                                        .vehicle-track-switch.vt-loading .vehicle-track-slider:before {
                                            background: transparent;
                                            border: 2px solid rgba(255,255,255,0.35);
                                            border-top-color: #fff;
                                            border-right-color: #fff;
                                            box-sizing: border-box;
                                            animation: vtTrackSpin .55s linear infinite;
                                        }
                                        /* keep the loading spin visible even before the toggle is drawn as checked */
                                        .vehicle-track-switch.vt-loading .vehicle-track-slider { background-color: #c2712c; }
                                        @keyframes vtTrackSpin {
                                            from { transform: translateX(16px) rotate(0deg); }
                                            to   { transform: translateX(16px) rotate(360deg); }
                                        }
                                        #vehicleTrackPanel .vehicle-track-title {
                                            font-size: 12px; font-weight: 700; letter-spacing: .5px; color: #c2712c;
                                            text-transform: uppercase; margin-bottom: 0; display: flex; align-items: center; gap: 6px;
                                        }
                                        #vehicleTrackPanel .vehicle-track-title::before {
                                            content: ''; width: 6px; height: 6px; border-radius: 50%; background-color: #c2712c; display: inline-block;
                                        }
                                        #vehicleTrackPanel .vehicle-track-field { flex: 1; min-width: 0; }
                                        #vehicleTrackPanel .vehicle-track-field label { display: block; font-size: 11px; font-weight: 700; color: #7c6f66; margin-bottom: 4px; text-transform: uppercase; letter-spacing: .3px; }
                                        #vehicleTrackPanel .vehicle-track-field input,
                                        #vehicleTrackPanel .vehicle-track-input {
                                            height: 34px; padding: 2px 10px; font-size: 12px; border: 1px solid #e8ddd2 !important;
                                            border-radius: 8px; width: 100%; background: #fff !important; transition: border-color .15s ease;
                                        }
                                        #vehicleTrackPanel .vehicle-track-field input:focus,
                                        #vehicleTrackPanel .vehicle-track-input:focus {
                                            border-color: #c2712c !important; outline: none; box-shadow: 0 0 0 2px rgba(194,113,44,0.12);
                                        }
                                        #vehicleTrackPanel .vehicle-track-btn { height: 34px; padding: 2px 14px; font-size: 12px; font-weight: 600; border: 1px solid #e8ddd2 !important; border-radius: 8px; background: #fff !important; cursor: pointer; }
                                        #vehicleTrackPanel .vehicle-track-btn:hover { background: #fbf1e6 !important; border-color: #e8ddd2 !important; }
                                        #vehicleTrackPanel .vehicle-track-btn--primary { background: #c2712c !important; border-color: #c2712c !important; color: #fff; }
                                        #vehicleTrackPanel .vehicle-track-btn--primary:hover { background: #a85e22 !important; border-color: #a85e22 !important; }

                                        /* Vehicle History Sidebar & Bottom Panel Styles */
                                        #vehicleHistoryCard {
                                            display: none;
                                            background: #ffffff;
                                            border-radius: 8px;
                                            box-shadow: 0 1px 3px rgba(0,0,0,0.04);
                                            overflow: hidden;
                                        }
                                        #vehicleHistoryPanel {
                                            display: flex;
                                            flex-direction: column;
                                            height: 100%;
                                            padding: 12px 14px;
                                            background: #ffffff;
                                            box-sizing: border-box;
                                            overflow-y: auto;
                                            overflow-x: hidden;
                                        }
                                        /* Vehicle History Combined Date-Time Range Button */
                                        .hist-range-btn {
                                            display: flex;
                                            align-items: center;
                                            justify-content: space-between;
                                            width: 100%;
                                            background: #fdfaf6;
                                            border: 1px solid #e8ddd2 !important;
                                            border-radius: 8px;
                                            padding: 6px 10px;
                                            cursor: pointer;
                                            transition: all 0.15s ease;
                                            text-align: left;
                                            outline: none;
                                            box-sizing: border-box;
                                        }
                                        .hist-range-btn:hover {
                                            border-color: #c2712c !important;
                                            background: #fffdfa;
                                        }
                                        .hist-range-btn.active,
                                        .hist-range-btn:focus {
                                            border-color: #c2712c !important;
                                            box-shadow: 0 0 0 2px rgba(194,113,44,0.15);
                                        }
                                        .hist-range-btn-left {
                                            display: flex;
                                            align-items: center;
                                            gap: 9px;
                                            min-width: 0;
                                            flex: 1;
                                        }
                                        .hist-range-calendar-icon {
                                            color: #c2712c;
                                            flex-shrink: 0;
                                        }
                                        .hist-range-texts {
                                            display: flex;
                                            flex-direction: column;
                                            gap: 2px;
                                            min-width: 0;
                                            flex: 1;
                                        }
                                        .hist-range-row {
                                            display: flex;
                                            align-items: center;
                                            gap: 6px;
                                            font-size: 11px;
                                            line-height: 1.2;
                                            white-space: nowrap;
                                            overflow: hidden;
                                            text-overflow: ellipsis;
                                        }
                                        .hist-range-tag {
                                            font-weight: 700;
                                            color: #7c6f66;
                                            text-transform: uppercase;
                                            font-size: 9px;
                                            letter-spacing: .3px;
                                            width: 32px;
                                            flex-shrink: 0;
                                        }
                                        .hist-range-val {
                                            font-weight: 600;
                                            color: #372c2e;
                                            font-size: 11px;
                                            overflow: hidden;
                                            text-overflow: ellipsis;
                                        }
                                        .hist-range-chevron {
                                            color: #a08b78;
                                            font-size: 10px;
                                            margin-left: 6px;
                                            transition: transform 0.2s ease;
                                            flex-shrink: 0;
                                        }
                                        .hist-range-btn.open .hist-range-chevron {
                                            transform: rotate(180deg);
                                            color: #c2712c;
                                        }

                                        /* Mobiscroll-Style Range Picker Popover */
                                        .hist-picker-popover {
                                            position: fixed;
                                            z-index: 999999;
                                            background: #ffffff;
                                            border: 1px solid #dcdce0;
                                            border-radius: 18px;
                                            box-shadow: 0 16px 48px rgba(0,0,0,0.18), 0 2px 10px rgba(0,0,0,0.06);
                                            padding: 16px;
                                            width: 530px;
                                            max-width: 95vw;
                                            box-sizing: border-box;
                                            font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
                                            animation: histPopIn 0.2s cubic-bezier(0.16, 1, 0.3, 1);
                                        }
                                        @keyframes histPopIn {
                                            from { opacity: 0; transform: scale(0.96) translateY(-6px); }
                                            to { opacity: 1; transform: scale(1) translateY(0); }
                                        }
                                        .hist-picker-topbar {
                                            margin-bottom: 14px;
                                        }
                                        .hist-picker-tabs {
                                            display: flex;
                                            background: #e9e9ed;
                                            border-radius: 9999px;
                                            padding: 3px;
                                            gap: 4px;
                                            position: relative;
                                        }
                                        .hist-picker-tab {
                                            flex: 1;
                                            border: none;
                                            background: transparent;
                                            border-radius: 9999px;
                                            padding: 6px 16px;
                                            display: flex;
                                            flex-direction: column;
                                            align-items: flex-start;
                                            cursor: pointer;
                                            transition: all 0.18s cubic-bezier(0.4, 0, 0.2, 1);
                                            text-align: left;
                                            outline: none;
                                        }
                                        .hist-picker-tab.active {
                                            background: #ffffff;
                                            box-shadow: 0 2px 8px rgba(0,0,0,0.12);
                                        }
                                        .hist-tab-label {
                                            font-size: 13px;
                                            font-weight: 700;
                                            color: #1c1c1e;
                                            line-height: 1.2;
                                        }
                                        .hist-tab-val {
                                            font-size: 11px;
                                            color: #8e8e93;
                                            font-weight: 500;
                                            line-height: 1.2;
                                            margin-top: 1px;
                                        }
                                        .hist-picker-tab.active .hist-tab-val {
                                            color: #007aff;
                                            font-weight: 600;
                                        }

                                        /* Picker Body (Calendar + Time Columns) */
                                        .hist-picker-body {
                                            display: flex;
                                            gap: 16px;
                                            align-items: stretch;
                                            padding-bottom: 12px;
                                            border-bottom: 1px solid #f0f0f3;
                                        }
                                        .hist-picker-cal {
                                            flex: 1.25;
                                            min-width: 0;
                                        }
                                        .hist-cal-header {
                                            display: flex;
                                            align-items: center;
                                            justify-content: space-between;
                                            margin-bottom: 10px;
                                            padding: 0 4px;
                                        }
                                        .hist-cal-title {
                                            font-size: 15px;
                                            font-weight: 700;
                                            color: #1c1c1e;
                                        }
                                        .hist-cal-nav {
                                            display: flex;
                                            gap: 8px;
                                        }
                                        .hist-cal-nav-btn {
                                            border: none;
                                            background: transparent;
                                            color: #007aff;
                                            width: 28px;
                                            height: 28px;
                                            border-radius: 50%;
                                            display: inline-flex;
                                            align-items: center;
                                            justify-content: center;
                                            cursor: pointer;
                                            font-size: 12px;
                                            transition: background 0.15s;
                                        }
                                        .hist-cal-nav-btn:hover {
                                            background: #f2f2f7;
                                        }
                                        .hist-cal-weekdays {
                                            display: grid;
                                            grid-template-columns: repeat(7, 1fr);
                                            text-align: center;
                                            font-size: 10px;
                                            font-weight: 700;
                                            color: #8e8e93;
                                            letter-spacing: 0.5px;
                                            margin-bottom: 6px;
                                        }
                                        .hist-cal-grid {
                                            display: grid;
                                            grid-template-columns: repeat(7, 1fr);
                                            row-gap: 3px;
                                        }
                                        .hist-cal-day {
                                            height: 32px;
                                            display: flex;
                                            align-items: center;
                                            justify-content: center;
                                            font-size: 13px;
                                            font-weight: 500;
                                            cursor: pointer;
                                            user-select: none;
                                            position: relative;
                                            color: #1c1c1e;
                                            transition: background 0.1s, color 0.1s;
                                        }
                                        .hist-cal-day.other-month {
                                            color: #c7c7cc;
                                        }
                                        .hist-cal-day.in-month:hover {
                                            background: #f2f2f7;
                                            border-radius: 16px;
                                        }
                                        .hist-cal-day.is-today:not(.is-start):not(.is-end) {
                                            font-weight: 700;
                                            color: #007aff;
                                        }
                                        .hist-cal-day.in-range {
                                            background: #e5f2ff;
                                            color: #007aff;
                                            border-radius: 0;
                                        }
                                        .hist-cal-day.is-start {
                                            background: #007aff !important;
                                            color: #ffffff !important;
                                            border-top-left-radius: 16px;
                                            border-bottom-left-radius: 16px;
                                            font-weight: 700;
                                        }
                                        .hist-cal-day.is-end {
                                            background: #007aff !important;
                                            color: #ffffff !important;
                                            border-top-right-radius: 16px;
                                            border-bottom-right-radius: 16px;
                                            font-weight: 700;
                                        }
                                        .hist-cal-day.is-start.is-end,
                                        .hist-cal-day.is-same-day {
                                            border-radius: 16px !important;
                                        }

                                        /* Time Wheel Column */
                                        .hist-picker-time {
                                            flex: 0.95;
                                            min-width: 175px;
                                            position: relative;
                                            display: flex;
                                            align-items: center;
                                            justify-content: center;
                                            border-left: 1px solid #f2f2f7;
                                            padding-left: 10px;
                                        }
                                        .hist-time-lens {
                                            position: absolute;
                                            left: 10px;
                                            right: 4px;
                                            top: calc(50% - 19px);
                                            height: 38px;
                                            background: #f0f1f5;
                                            border-radius: 12px;
                                            pointer-events: none;
                                            z-index: 1;
                                        }
                                        .hist-time-columns {
                                            display: flex;
                                            width: 100%;
                                            height: 228px;
                                            position: relative;
                                            z-index: 2;
                                            -webkit-mask-image: linear-gradient(to bottom, transparent 0%, black 25%, black 75%, transparent 100%);
                                            mask-image: linear-gradient(to bottom, transparent 0%, black 25%, black 75%, transparent 100%);
                                        }
                                        .hist-time-col {
                                            flex: 1;
                                            height: 100%;
                                            overflow-y: scroll;
                                            scroll-snap-type: y mandatory;
                                            scrollbar-width: none;
                                            -ms-overflow-style: none;
                                            box-sizing: border-box;
                                        }
                                        .hist-time-col::-webkit-scrollbar {
                                            display: none;
                                        }
                                        .hist-wheel-scroll {
                                            padding: 95px 0;
                                            box-sizing: border-box;
                                        }
                                        .hist-wheel-item {
                                            height: 38px;
                                            line-height: 38px;
                                            text-align: center;
                                            font-size: 15px;
                                            color: #8e8e93;
                                            scroll-snap-align: center;
                                            cursor: pointer;
                                            user-select: none;
                                            transition: color 0.12s, font-weight 0.12s, font-size 0.12s;
                                        }
                                        .hist-wheel-item.selected {
                                            color: #1c1c1e;
                                            font-weight: 700;
                                            font-size: 17px;
                                        }

                                        /* Footer Controls */
                                        .hist-picker-footer {
                                            display: flex;
                                            align-items: center;
                                            justify-content: flex-end;
                                            margin-top: 14px;
                                            padding-top: 4px;
                                        }
                                        .hist-picker-actions {
                                            display: flex;
                                            gap: 8px;
                                        }
                                        .hist-picker-cancel-btn {
                                            border: 1px solid #cbd5e1 !important;
                                            background: #ffffff !important;
                                            color: #475569 !important;
                                            padding: 6px 16px !important;
                                            border-radius: 6px !important;
                                            font-size: 12px !important;
                                            font-weight: 600 !important;
                                            cursor: pointer !important;
                                            transition: all 0.15s ease !important;
                                            outline: none !important;
                                            box-sizing: border-box !important;
                                        }
                                        .hist-picker-cancel-btn:hover,
                                        .hist-picker-cancel-btn:focus {
                                            background: #f1f5f9 !important;
                                            border: 1px solid #94a3b8 !important;
                                            color: #1e293b !important;
                                        }
                                        .hist-picker-apply-btn {
                                            border: 1px solid #c2712c !important;
                                            background: #c2712c !important;
                                            color: #ffffff !important;
                                            padding: 6px 20px !important;
                                            border-radius: 6px !important;
                                            font-size: 12px !important;
                                            font-weight: 600 !important;
                                            cursor: pointer !important;
                                            transition: all 0.15s ease !important;
                                            outline: none !important;
                                            box-sizing: border-box !important;
                                        }
                                        .hist-picker-apply-btn:hover,
                                        .hist-picker-apply-btn:focus {
                                            background: #a85e22 !important;
                                            border: 1px solid #a85e22 !important;
                                            color: #ffffff !important;
                                        }
                                        .hist-header {
                                            display: flex;
                                            align-items: center;
                                            justify-content: space-between;
                                            padding-bottom: 8px;
                                            border-bottom: 1px solid #f0e3d3;
                                            margin-bottom: 8px;
                                        }
                                        .hist-header-title {
                                            font-size: 13px;
                                            font-weight: 700;
                                            color: #372c2e;
                                            display: flex;
                                            align-items: center;
                                            gap: 8px;
                                        }
                                        .hist-badge {
                                            background: #c2712c;
                                            color: #ffffff;
                                            padding: 2px 8px;
                                            border-radius: 4px;
                                            font-size: 11px;
                                            font-weight: 600;
                                        }
                                        .hist-back-btn, .hist-close-btn {
                                            border: none !important;
                                            background: transparent !important;
                                            color: #7c6f66 !important;
                                            cursor: pointer !important;
                                            font-size: 12px !important;
                                            display: inline-flex !important;
                                            align-items: center !important;
                                            gap: 4px !important;
                                            padding: 4px 6px !important;
                                            border-radius: 4px !important;
                                            transition: all .15s ease !important;
                                            opacity: 1 !important;
                                            visibility: visible !important;
                                        }
                                        .hist-back-btn:hover, .hist-close-btn:hover {
                                            background: #fdfaf6 !important;
                                            color: #c2712c !important;
                                            opacity: 1 !important;
                                            visibility: visible !important;
                                            -webkit-text-fill-color: #c2712c !important;
                                        }
                                        .hist-back-btn i, .hist-close-btn i,
                                        .hist-back-btn:hover i, .hist-close-btn:hover i {
                                            opacity: 1 !important;
                                            visibility: visible !important;
                                        }
                                        .hist-field {
                                            margin-bottom: 6px;
                                        }
                                        .hist-label {
                                            display: block;
                                            font-size: 11px;
                                            font-weight: 700;
                                            color: #7c6f66;
                                            text-transform: capitalize;
                                            letter-spacing: .4px;
                                            margin-bottom: 4px;
                                        }
                                        .hist-input {
                                            height: 32px;
                                            font-size: 12px;
                                            border: 1px solid #e8ddd2 !important;
                                            border-radius: 6px;
                                            padding: 2px 8px;
                                            background: #ffffff;
                                        }
                                        .hist-input:focus {
                                            border-color: #c2712c !important;
                                            outline: none;
                                            box-shadow: 0 0 0 2px rgba(194,113,44,0.12);
                                        }
                                        .hist-presets {
                                            display: flex;
                                            gap: 6px;
                                            margin-bottom: 10px;
                                        }
                                        .hist-preset-btn {
                                            flex: 1;
                                            height: 25px;
                                            font-size: 11px;
                                            font-weight: 600;
                                            border: 1px solid #e8ddd2 !important;
                                            border-radius: 5px;
                                            background: #fdfaf6 !important;
                                            color: #7c6f66 !important;
                                            cursor: pointer;
                                            transition: all 0.15s ease;
                                            opacity: 1 !important;
                                            visibility: visible !important;
                                            -webkit-text-fill-color: #7c6f66 !important;
                                        }
                                        .hist-preset-btn:hover {
                                            background: #fbf1e6 !important;
                                            border-color: #c2712c !important;
                                            color: #c2712c !important;
                                            opacity: 1 !important;
                                            visibility: visible !important;
                                            -webkit-text-fill-color: #c2712c !important;
                                        }
                                        .hist-preset-btn.active,
                                        .hist-preset-btn.active:hover,
                                        .hist-preset-btn.active:focus {
                                            background: #c2712c !important;
                                            border-color: #c2712c !important;
                                            color: #ffffff !important;
                                            opacity: 1 !important;
                                            visibility: visible !important;
                                            -webkit-text-fill-color: #ffffff !important;
                                        }
                                        .hist-show-btn {
                                            height: 34px !important;
                                            font-size: 12px !important;
                                            font-weight: 600 !important;
                                            background: #c2712c !important;
                                            border-color: #c2712c !important;
                                            color: #ffffff !important;
                                            border-radius: 6px !important;
                                            cursor: pointer !important;
                                            margin-bottom: 8px !important;
                                            transition: background .15s ease !important;
                                            opacity: 1 !important;
                                            visibility: visible !important;
                                            -webkit-text-fill-color: #ffffff !important;
                                        }
                                        .hist-show-btn:hover,
                                        .hist-show-btn:focus {
                                            background: #a85e22 !important;
                                            border-color: #a85e22 !important;
                                            color: #ffffff !important;
                                            opacity: 1 !important;
                                            visibility: visible !important;
                                            -webkit-text-fill-color: #ffffff !important;
                                        }
                                        .hist-status {
                                            font-size: 11px;
                                            color: #8c7f76;
                                            margin-bottom: 8px;
                                            min-height: 16px;
                                        }
                                        .hist-stats-bar {
                                            display: flex;
                                            justify-content: space-between;
                                            background: #fdfaf6;
                                            border: 1px solid #f0e3d3;
                                            border-radius: 6px;
                                            padding: 6px 10px;
                                            margin-bottom: 10px;
                                        }
                                        .hist-stat-item {
                                            display: flex;
                                            flex-direction: column;
                                            align-items: center;
                                        }
                                        .hist-stat-val {
                                            font-size: 12px;
                                            font-weight: 700;
                                            color: #372c2e;
                                        }
                                        .hist-stat-lbl {
                                            font-size: 9px;
                                            color: #a08b78;
                                            text-transform: uppercase;
                                            font-weight: 600;
                                        }
                                        .hist-timeline-container {
                                            flex: 1;
                                            overflow-y: auto;
                                            border-top: 1px solid #f0e3d3;
                                            padding-top: 6px;
                                        }
                                        .hist-timeline-row {
                                            display: flex;
                                            align-items: flex-start;
                                            padding: 6px 8px;
                                            border-radius: 6px;
                                            margin-bottom: 3px;
                                            cursor: pointer;
                                            transition: background 0.15s ease;
                                        }
                                        .hist-timeline-row:hover, .hist-timeline-row.active {
                                            background: #fbf1e6;
                                        }
                                        .hist-row-left {
                                            margin-right: 8px;
                                            padding-top: 1px;
                                        }
                                        .hist-row-right {
                                            flex: 1;
                                            min-width: 0;
                                        }
                                        .hist-event-badge {
                                            display: inline-block;
                                            width: 24px;
                                            height: 19px;
                                            line-height: 19px;
                                            text-align: center;
                                            border-radius: 4px;
                                            font-size: 10px;
                                            font-weight: 700;
                                            color: #ffffff;
                                        }
                                        .hist-event-badge.stop { background: #5f6368; }
                                        .hist-event-badge.drive { background: #1a73e8; }
                                        .hist-event-badge.tip { background: #9334e8; }
                                        .hist-event-icon {
                                            font-size: 13px;
                                            display: inline-block;
                                            width: 24px;
                                            text-align: center;
                                        }
                                        .hist-ev-main {
                                            display: flex;
                                            justify-content: space-between;
                                            align-items: center;
                                        }
                                        .hist-ev-time {
                                            font-size: 11px;
                                            font-weight: 600;
                                            color: #372c2e;
                                        }
                                        .hist-ev-dur {
                                            font-size: 11px;
                                            color: #7c6f66;
                                            font-family: monospace;
                                        }
                                        .hist-ev-sub {
                                            font-size: 10px;
                                            color: #8c7f76;
                                        }
                                        .hist-empty-state {
                                            font-size: 11px;
                                            color: #8c7f76;
                                            text-align: center;
                                            padding: 20px 10px;
                                        }

                                        /* History Button on Hauler Cards */
                                        .vehicle-history-btn {
                                            display: inline-flex !important;
                                            align-items: center !important;
                                            justify-content: center !important;
                                            width: 22px !important;
                                            height: 22px !important;
                                            background: #ffffff !important;
                                            border: 1.5px solid #b57423 !important;
                                            border-radius: 4px !important;
                                            color: #b57423 !important;
                                            padding: 0 !important;
                                            cursor: pointer !important;
                                            transition: all 0.2s ease !important;
                                            margin-left: auto !important;
                                            flex-shrink: 0 !important;
                                            opacity: 1 !important;
                                            visibility: visible !important;
                                        }
                                        .vehicle-history-btn svg {
                                            display: block !important;
                                            width: 13px !important;
                                            height: 13px !important;
                                            stroke: #b57423 !important;
                                            stroke-width: 2.5 !important;
                                            fill: none !important;
                                            opacity: 1 !important;
                                            visibility: visible !important;
                                            pointer-events: none !important;
                                        }
                                        .vehicle-history-btn:hover,
                                        .vehicle-history-btn:focus {
                                            background: #b57423 !important;
                                            border-color: #b57423 !important;
                                            color: #ffffff !important;
                                            box-shadow: 0 2px 6px rgba(181, 116, 35, 0.35) !important;
                                            transform: scale(1.04) !important;
                                            opacity: 1 !important;
                                            visibility: visible !important;
                                        }
                                        .vehicle-history-btn:hover svg,
                                        .vehicle-history-btn:focus svg {
                                            stroke: #ffffff !important;
                                            fill: none !important;
                                            opacity: 1 !important;
                                            visibility: visible !important;
                                        }

                                        /* Trip History Mode Tabs & Trip Cards */
                                        .hist-mode-tabs {
                                            display: flex;
                                            background: #f4efe9;
                                            border-radius: 8px;
                                            padding: 3px;
                                            margin-bottom: 7px;
                                            gap: 4px;
                                        }
                                        .hist-mode-tab {
                                            flex: 1;
                                            display: flex;
                                            align-items: center;
                                            justify-content: center;
                                            gap: 5px;
                                            padding: 6px 8px;
                                            border: none !important;
                                            background: transparent !important;
                                            border-radius: 6px;
                                            font-size: 11px;
                                            font-weight: 600;
                                            color: #6c5f56;
                                            cursor: pointer;
                                            transition: all 0.15s ease;
                                            outline: none !important;
                                        }
                                        .hist-mode-tab:hover {
                                            color: #2c221e;
                                        }
                                        .hist-mode-tab.active {
                                            background: #ffffff !important;
                                            color: #c2712c !important;
                                            box-shadow: 0 1px 3px rgba(0,0,0,0.08);
                                        }
                                        .hist-pill-count {
                                            display: inline-block;
                                            padding: 1px 6px;
                                            font-size: 10px;
                                            font-weight: 700;
                                            border-radius: 10px;
                                            background: #e2d9cf;
                                            color: #55483f;
                                        }
                                        .hist-mode-tab.active .hist-pill-count {
                                            background: #faeedf;
                                            color: #c2712c;
                                        }

                                        #vehicleHistoryCard {
                                            display: none;
                                            position: absolute;
                                            top: 0;
                                            bottom: 0;
                                            left: 14px;
                                            right: 0;
                                            height: 100%;
                                            padding: 12px 14px;
                                            box-sizing: border-box;
                                            flex-direction: column;
                                            overflow: hidden;
                                            background: #ffffff;
                                            border-radius: 8px;
                                            border: 1px solid #f0e3d3;
                                            box-shadow: 0 1px 4px rgba(0,0,0,0.06);
                                            z-index: 20;
                                        }
                                        #vehicleHistoryCard.is-open {
                                            display: flex !important;
                                        }
                                        .hist-trips-summary {
                                            display: none;
                                        }
                                        .hist-trips-summary-item {
                                            display: flex;
                                            flex-direction: column;
                                            align-items: center;
                                            gap: 2px;
                                        }
                                        .hist-sum-lbl {
                                            font-size: 10px;
                                            text-transform: uppercase;
                                            letter-spacing: 0.4px;
                                            color: #8c7f76;
                                            font-weight: 600;
                                        }
                                        .hist-sum-val {
                                            font-size: 13px;
                                            font-weight: 700;
                                            color: #c2712c;
                                        }
                                        #vehicleHistoryPanel {
                                            height: 100%;
                                            display: flex;
                                            flex-direction: column;
                                            overflow: hidden;
                                            min-height: 0;
                                        }
                                        .hist-trips-container {
                                            flex: 1;
                                            min-height: 0;
                                            display: flex;
                                            flex-direction: column;
                                            margin-bottom: 0;
                                            margin-top: 2px;
                                            overflow: hidden;
                                        }
                                        .hist-timeline-section {
                                            flex: 1;
                                            min-height: 0;
                                            display: flex;
                                            flex-direction: column;
                                            overflow: hidden;
                                        }
                                        .hist-trips-header {
                                            display: flex;
                                            align-items: center;
                                            justify-content: space-between;
                                            margin-bottom: 6px;
                                            padding: 0 2px;
                                        }
                                        .hist-trips-title {
                                            font-size: 11px;
                                            font-weight: 700;
                                            text-transform: capitalize;
                                            letter-spacing: .4px;
                                            color: #7c6f66;
                                        }
                                        .hist-refresh-btn {
                                            border: none;
                                            background: transparent;
                                            color: #8c7f76;
                                            cursor: pointer;
                                            padding: 2px 4px;
                                            font-size: 11px;
                                            transition: color .15s;
                                        }
                                        .hist-refresh-btn:hover {
                                            color: #c2712c;
                                        }
                                        .hist-trips-list {
                                            flex: 1;
                                            min-height: 0;
                                            overflow-y: auto;
                                            display: flex;
                                            flex-direction: column;
                                            gap: 6px;
                                            padding-right: 4px;
                                        }
                                        .hist-date-picker-wrap {
                                            display: flex;
                                            align-items: center;
                                            gap: 4px;
                                        }
                                        .hist-nav-day-btn {
                                            width: 28px;
                                            height: 32px;
                                            border: 1px solid #e8ddd2;
                                            background: #fdfaf6;
                                            color: #7c6f66;
                                            border-radius: 6px;
                                            display: flex;
                                            align-items: center;
                                            justify-content: center;
                                            cursor: pointer;
                                            transition: all .15s ease;
                                            flex-shrink: 0;
                                        }
                                        .hist-nav-day-btn:hover {
                                            background: #fbf1e6;
                                            color: #c2712c;
                                            border-color: #c2712c;
                                        }
                                        .hist-date-input {
                                            flex: 1;
                                            height: 32px;
                                            font-size: 12px;
                                            font-weight: 600;
                                            color: #372c2e;
                                            border: 1px solid #e8ddd2 !important;
                                            border-radius: 6px;
                                            padding: 2px 8px;
                                            background: #ffffff;
                                            cursor: pointer;
                                        }
                                        .hist-date-input::-webkit-calendar-picker-indicator {
                                            cursor: pointer;
                                        }
                                        .hist-date-quick-btn {
                                            border: none;
                                            background: transparent;
                                            color: #c2712c;
                                            font-size: 10px;
                                            font-weight: 700;
                                            cursor: pointer;
                                            text-transform: uppercase;
                                            padding: 0;
                                        }
                                        .hist-date-quick-btn:hover {
                                            text-decoration: underline;
                                        }
                                        .hist-shift-time-badge {
                                            font-size: 10px;
                                            font-weight: 600;
                                            color: #c2712c;
                                            background: #fbf1e6;
                                            padding: 2px 6px;
                                            border-radius: 4px;
                                            border: 1px solid #ebdcd0;
                                        }
                                        .hist-trip-card {
                                            background: #fdfaf6;
                                            border: 1px solid #ebdcd0;
                                            border-radius: 8px;
                                            padding: 8px 10px;
                                            cursor: pointer;
                                            transition: all 0.15s ease;
                                        }
                                        .hist-trip-card:hover {
                                            border-color: #c2712c;
                                            background: #fff8f0;
                                            transform: translateY(-1px);
                                            box-shadow: 0 2px 4px rgba(194,113,44,0.08);
                                        }
                                        .hist-trip-card.active {
                                            border-color: #c2712c;
                                            background: #fff4e5;
                                            box-shadow: 0 0 0 1.5px #c2712c;
                                        }
                                        .hist-trip-top {
                                            display: flex;
                                            align-items: center;
                                            justify-content: space-between;
                                            margin-bottom: 4px;
                                        }
                                        .hist-trip-badge {
                                            font-size: 11px;
                                            font-weight: 700;
                                            color: #c2712c;
                                        }
                                        .hist-trip-dur {
                                            font-size: 11px;
                                            font-weight: 600;
                                            color: #55483f;
                                            background: #faeedf;
                                            padding: 1px 6px;
                                            border-radius: 4px;
                                        }
                                        .hist-trip-route {
                                            display: flex;
                                            align-items: center;
                                            gap: 5px;
                                            font-size: 11px;
                                            color: #372c2e;
                                            font-weight: 500;
                                            margin-bottom: 4px;
                                        }
                                        .hist-trip-arrow {
                                            color: #c2712c;
                                            font-weight: bold;
                                        }
                                        .hist-trip-times {
                                            display: flex;
                                            justify-content: space-between;
                                            font-size: 10px;
                                            color: #8c7f76;
                                        }
                                        .hist-trip-info-row {
                                            display: flex;
                                            flex-wrap: wrap;
                                            gap: 6px;
                                            margin-top: 4px;
                                            padding-top: 4px;
                                            border-top: 1px dashed #ebdcd0;
                                        }
                                        .hist-trip-info-item {
                                            display: inline-flex;
                                            align-items: center;
                                            gap: 3px;
                                            font-size: 9.5px;
                                            color: #7c6f66;
                                        }
                                        .hist-trip-info-icon {
                                            font-size: 9px;
                                            color: #c2712c;
                                        }

                                        /* Selected Trip Active Details Banner */
                                        .hist-selected-trip-banner {
                                            background: #fff8f0;
                                            border: 1px solid #e0c8b3;
                                            border-radius: 8px;
                                            padding: 8px 10px;
                                            margin-bottom: 8px;
                                        }
                                        .hist-selected-trip-header {
                                            display: flex;
                                            align-items: center;
                                            justify-content: space-between;
                                            margin-bottom: 4px;
                                        }
                                        .hist-selected-trip-title {
                                            font-size: 11px;
                                            font-weight: 700;
                                            color: #c2712c;
                                        }
                                        .hist-selected-trip-clear {
                                            font-size: 10px;
                                            color: #8c7f76;
                                            background: none;
                                            border: none;
                                            cursor: pointer;
                                            text-decoration: underline;
                                        }
                                        .hist-selected-trip-clear:hover {
                                            color: #c2712c;
                                        }
                                        .hist-phase-breakdown {
                                            display: grid;
                                            grid-template-columns: repeat(4, 1fr);
                                            gap: 4px;
                                            margin-top: 6px;
                                        }
                                        .hist-phase-pill {
                                            display: flex;
                                            flex-direction: column;
                                            align-items: center;
                                            background: #ffffff;
                                            border: 1px solid #ebdcd0;
                                            border-radius: 6px;
                                            padding: 3px 2px;
                                        }
                                        .hist-phase-name {
                                            font-size: 8.5px;
                                            font-weight: 700;
                                            text-transform: uppercase;
                                        }
                                        .hist-phase-name.load { color: #d97706; }
                                        .hist-phase-name.haul { color: #2563eb; }
                                        .hist-phase-name.dump { color: #9333ea; }
                                        .hist-phase-name.retn { color: #16a34a; }
                                        .hist-phase-val {
                                            font-size: 10px;
                                            font-weight: 600;
                                            color: #372c2e;
                                        }

                                        /* Milestone Badges in Timeline */
                                        .hist-event-badge.load { background: #d97706; }
                                        .hist-event-badge.haul { background: #2563eb; }
                                        .hist-event-badge.dump { background: #9333ea; }
                                        .hist-event-badge.retn { background: #16a34a; }

                                        /* Bottom Speed Bar & Player Panel */
                                        .history-bottom-panel {
                                            position: absolute;
                                            bottom: 0;
                                            left: 0;
                                            right: 0;
                                            background: #ffffff;
                                            border-top: 1px solid #e0d0c0;
                                            box-shadow: 0 -4px 16px rgba(0, 0, 0, 0.12);
                                            z-index: 1000;
                                        }
                                        .hist-panel-header {
                                            height: 38px;
                                            padding: 0 14px;
                                            background: #fdfaf6;
                                            border-bottom: 1px solid #f0e3d3;
                                        }
                                        .hist-tab {
                                            font-size: 12px;
                                            font-weight: 700;
                                            color: #c2712c;
                                            border-bottom: 2px solid #c2712c;
                                            padding: 9px 12px;
                                            margin-right: 14px;
                                            text-transform: uppercase;
                                            letter-spacing: .4px;
                                        }
                                        .hist-player-controls {
                                            display: flex;
                                            align-items: center;
                                            gap: 6px;
                                        }
                                        .hist-control-btn {
                                            width: 28px;
                                            height: 28px;
                                            border: 1px solid #e8ddd2;
                                            background: #ffffff;
                                            border-radius: 6px;
                                            display: inline-flex;
                                            align-items: center;
                                            justify-content: center;
                                            color: #372c2e;
                                            cursor: pointer;
                                            transition: all 0.15s ease;
                                            padding: 0;
                                        }
                                        .hist-control-btn:hover {
                                            background: #fbf1e6;
                                            border-color: #c2712c;
                                            color: #c2712c;
                                        }
                                        .hist-speed-multiplier select {
                                            height: 28px;
                                            font-size: 11px;
                                            padding: 0 6px;
                                            border-radius: 6px;
                                            border: 1px solid #e8ddd2;
                                            background: #ffffff;
                                            font-weight: 600;
                                            color: #372c2e;
                                            cursor: pointer;
                                        }
                                        .hist-speed-readout {
                                            font-size: 14px;
                                            font-weight: 700;
                                            color: #372c2e;
                                        }
                                        .hist-speed-unit {
                                            font-size: 11px;
                                            font-weight: 400;
                                            color: #7c6f66;
                                        }
                                        .hist-time-readout {
                                            font-size: 12px;
                                            color: #554a43;
                                            font-family: monospace;
                                            font-weight: 600;
                                        }
                                        .hist-toggle-btn {
                                            height: 28px;
                                            padding: 0 9px;
                                            font-size: 11px;
                                            font-weight: 600;
                                            border: 1px solid #e8ddd2;
                                            background: #ffffff;
                                            border-radius: 6px;
                                            cursor: pointer;
                                            display: inline-flex;
                                            align-items: center;
                                            gap: 5px;
                                            color: #7c6f66;
                                            transition: all 0.15s ease;
                                            user-select: none;
                                        }
                                        .hist-toggle-btn:hover {
                                            background: #fdf6ee;
                                            border-color: #d88947;
                                            color: #c2712c;
                                        }
                                        .hist-toggle-btn.active {
                                            background: #fbf1e6;
                                            border-color: #c2712c;
                                            color: #c2712c;
                                            font-weight: 700;
                                        }
                                        .hist-chart-container {
                                            position: relative;
                                            width: 100%;
                                            height: 135px;
                                            background: #ffffff;
                                        }
                                        .hist-chart-loading {
                                            position: absolute;
                                            top: 50%;
                                            left: 50%;
                                            transform: translate(-50%, -50%);
                                            font-size: 13px;
                                            font-weight: 500;
                                            color: #c2712c;
                                            pointer-events: none;
                                            z-index: 10;
                                            display: flex;
                                            align-items: center;
                                            gap: 8px;
                                            background: rgba(255, 255, 255, 0.94);
                                            padding: 6px 14px;
                                            border-radius: 6px;
                                            box-shadow: 0 1px 4px rgba(0,0,0,0.08);
                                        }
                                        #histSpeedChart {
                                            width: 100%;
                                            height: 100%;
                                            cursor: crosshair;
                                            display: block;
                                        }
                                        .hist-chart-tooltip {
                                            position: fixed;
                                            background: rgba(40, 35, 30, 0.92);
                                            color: #ffffff;
                                            padding: 4px 8px;
                                            border-radius: 4px;
                                            font-size: 11px;
                                            pointer-events: none;
                                            z-index: 1050;
                                            box-shadow: 0 2px 6px rgba(0,0,0,0.2);
                                        }
                                        .vehicle-history-badge {
                                            position: absolute;
                                            background: #ffffff;
                                            border: 1.5px solid #c2712c;
                                            color: #372c2e;
                                            font-size: 11px;
                                            padding: 2px 8px;
                                            border-radius: 12px;
                                            white-space: nowrap;
                                            box-shadow: 0 2px 6px rgba(0,0,0,0.15);
                                            transform: translate(-50%, -100%);
                                            pointer-events: none;
                                            font-family: sans-serif;
                                        }

                                        /* Loaders / Haulers / Support vehicle cards — visual polish only (colors, fonts,
                                           borders); no layout/spacing properties touched. */
                                        .tab-content .card-line {
                                            border: 1px solid #f0e3d3 !important;
                                            box-shadow: 0 1px 3px rgba(0,0,0,0.04) !important;
                                            background: #ffffff;
                                        }
                                        .tab-content .icon img {
                                            border-color: #f0e3d3 !important;
                                        }
                                        .tab-content .vehicle-number {
                                            color: #372C2E;
                                        }
                                        .tab-content .status {
                                            color: #a08b78 !important;
                                            font-weight: 600;
                                        }
                                        .tab-content .dot {
                                            background-color: #d8c7b4 !important;
                                        }
                                        .tab-content .last-update,
                                        .tab-content .speed-info {
                                            color: #a08b78 !important;
                                        }
                                        .tab-content li.detail-item span {
                                            color: #7c6f66 !important;
                                            font-weight: 600;
                                        }
                                        .tab-content .card-button {
                                            border-color: #c2712c !important;
                                            color: #c2712c !important;
                                        }
                                            .tab-content .card-button:hover {
                                                border-color: #c2712c !important;
                                                color: #c2712c !important;
                                            }

                                        /* Gap between the Loaders/Haulers/Support tab underline and the search
                                           row below it, so they no longer visually merge together. */
                                        .daily-plan-tab-card.perform_nav.nav-tabs {
                                            margin-bottom: 14px !important;
                                            display: flex;
                                        }

                                        /* Force the Loaders/Haulers/Support tabs to match the same established
                                           tab style used elsewhere (e.g. Equipment Available / Excavator
                                           Deployment) — no box border on any side, ever, only a bottom
                                           underline that's transparent when inactive and amber when active. */
                                        .daily-plan-tab-card.perform_nav.nav-tabs > li > a,
                                        .daily-plan-tab-card.perform_nav.nav-tabs > li > a:hover,
                                        .daily-plan-tab-card.perform_nav.nav-tabs > li > a:focus {
                                            border: none !important;
                                            border-bottom: 3px solid transparent !important;
                                            background: #fff !important;
                                            color: #7B7B7B !important;
                                            border-radius: 0 !important;
                                        }
                                        .daily-plan-tab-card.perform_nav.nav-tabs > li.active > a,
                                        .daily-plan-tab-card.perform_nav.nav-tabs > li.active > a:hover,
                                        .daily-plan-tab-card.perform_nav.nav-tabs > li.active > a:focus {
                                            border: none !important;
                                            border-bottom: 3px solid #B57423 !important;
                                            background: #fff !important;
                                            color: #B57423 !important;
                                            border-radius: 0 !important;
                                        }
                                        /* Collapse the 12px transparent left/right border reserved by the base
                                           .perform_nav.nav-tabs rule (appstyles.css) — that's what was pushing
                                           Loaders/Haulers/Support so far apart. Use padding instead for a
                                           smaller, controlled gap between tabs. */
                                        .daily-plan-tab-card.perform_nav.nav-tabs > li {
                                            margin-right: 0 !important;
                                            flex: 1 1 25%;
                                            min-width: 0;
                                        }
                                        .daily-plan-tab-card.perform_nav.nav-tabs > li > a {
                                            padding: 0 8px !important;
                                            text-align: center;
                                        }
                                        .heartbeat-dashboard-link {
                                            display: inline-flex;
                                            align-items: center;
                                            justify-content: center;
                                            margin-left: 7px;
                                            line-height: 1;
                                        }
                                        .heartbeat-dashboard-link svg {
                                            display: block;
                                        }
                                        .location-group-header,
                                        .location-list-item {
                                            display: flex;
                                            align-items: center;
                                            justify-content: space-between;
                                            border: 1px solid #f0e3d3;
                                            border-radius: 6px;
                                        }
                                        .location-group-header {
                                            padding: 10px 12px;
                                            margin-bottom: 5px;
                                            background: #f8f3ed;
                                            cursor: pointer;
                                        }
                                        .location-list-item {
                                            padding: 9px 12px;
                                            margin: 0 0 5px 15px;
                                            background: #fff;
                                        }
                                        .location-group-title {
                                            display: flex;
                                            align-items: center;
                                            gap: 8px;
                                        }
                                        .location-group-caret {
                                            color: #B57423;
                                            width: 10px;
                                            text-align: center;
                                        }
                                        .location-group-count {
                                            display: inline-flex;
                                            align-items: center;
                                            justify-content: center;
                                            min-width: 20px;
                                            height: 20px;
                                            padding: 0 6px;
                                            border-radius: 10px;
                                            background: #B57423;
                                            color: #fff;
                                            font-size: 11px;
                                            font-weight: 600;
                                            line-height: 1;
                                        }
                                        .location-focus-button {
                                            border: 0;
                                            background: transparent;
                                            color: #B57423 !important;
                                            cursor: pointer;
                                            padding: 3px 5px;
                                        }
                                        .location-item-actions {
                                            display: flex;
                                            align-items: center;
                                            gap: 2px;
                                        }
                                        .location-edit-button,
                                        .location-save-button,
                                        .location-cancel-button {
                                            border: 0;
                                            background: transparent;
                                            cursor: pointer;
                                            padding: 3px 5px;
                                        }
                                        .location-edit-button {
                                            color: #B57423 !important;
                                        }
                                        .location-edit-controls {
                                            display: flex;
                                            align-items: center;
                                            gap: 2px;
                                        }
                                        .location-save-button {
                                            color: #03743A !important;
                                        }
                                        .location-cancel-button {
                                            color: #F25767 !important;
                                        }
                                        .location-save-button:disabled,
                                        .location-cancel-button:disabled {
                                            opacity: 0.5;
                                            cursor: not-allowed;
                                        }
                                        /* Filter icon sits to the left of the search box; gap keeps the two from
                                           sitting flush against each other. */
                                        .row.mt-2 > .d-flex.align-items.content {
                                            gap: 10px;
                                            align-items: center;
                                        }
                                        .row.mt-2 .filter-ico {
                                            flex: 0 0 auto;
                                        }
                                        .row.mt-2 .search-container {
                                            width: auto;
                                            flex: 1 1 auto;
                                        }