/*
 * SDO DavOcc DTS
 * Personnel Table + Local Searchable Select2 + Numbered Pagination v1.1.6
 */

.personnel-directory-v2-panel-head{
    margin-bottom:14px;
}

.personnel-directory-v2-panel-head h2{
    margin:0;
    font-size:18px;
    line-height:1.25;
    font-weight:800;
    color:#17251e;
}

/* Hide only the enhanced native filter select, not form selects elsewhere. */
.dts-select2-native{
    position:absolute!important;
    width:1px!important;
    height:1px!important;
    padding:0!important;
    margin:-1px!important;
    overflow:hidden!important;
    clip:rect(0,0,0,0)!important;
    white-space:nowrap!important;
    border:0!important;
}

.dts-select2{
    min-width:0;
    width:100%;
    position:relative;
}

.dts-select2-trigger{
    width:100%;
    min-height:39px;
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:8px;
    padding:8px 11px;
    border:1px solid #dce5e0;
    border-radius:9px;
    background:#fff;
    color:#283930;
    font:inherit;
    font-size:12.5px;
    line-height:1.2;
    text-align:left;
    cursor:pointer;
    transition:border-color .16s ease,box-shadow .16s ease,background .16s ease;
}

.dts-select2-trigger:hover{
    border-color:#bdcec4;
}

.dts-select2-trigger:focus-visible,
.dts-select2-trigger.is-open{
    outline:none;
    border-color:#179261;
    box-shadow:0 0 0 3px rgba(23,146,97,.10);
}

.dts-select2-value{
    min-width:0;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
}

.dts-select2-chevron{
    flex:0 0 auto;
    color:#6b7c73;
    font-size:9px;
    transition:transform .16s ease;
}

.dts-select2-trigger.is-open .dts-select2-chevron{
    transform:rotate(180deg);
}

.dts-select2-dropdown{
    position:fixed;
    z-index:2147481000;
    display:grid;
    grid-template-rows:auto minmax(0,1fr);
    overflow:hidden;
    border:1px solid #cfdcd5;
    border-radius:10px;
    background:#fff;
    box-shadow:0 16px 38px rgba(12,48,34,.18);
}

.dts-select2-search-wrap{
    padding:8px;
    border-bottom:1px solid #edf2ef;
    background:#fff;
}

.dts-select2-search{
    width:100%;
    min-height:36px;
    padding:7px 10px;
    border:1px solid #d7e2dc;
    border-radius:8px;
    background:#fff;
    color:#23362c;
    font:inherit;
    font-size:12px;
}

.dts-select2-search:focus{
    outline:none;
    border-color:#179261;
    box-shadow:0 0 0 3px rgba(23,146,97,.09);
}

.dts-select2-options{
    min-height:0;
    overflow:auto;
    overscroll-behavior:contain;
    padding:5px;
}

.dts-select2-option{
    width:100%;
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:8px;
    padding:8px 9px;
    border:0;
    border-radius:7px;
    background:transparent;
    color:#273a30;
    font:inherit;
    font-size:12px;
    text-align:left;
    cursor:pointer;
}

.dts-select2-option:hover,
.dts-select2-option:focus-visible{
    outline:none;
    background:#edf7f1;
}

.dts-select2-option.is-selected{
    background:#e4f4eb;
    color:#0a6d42;
    font-weight:750;
}

.dts-select2-option i{
    flex:0 0 auto;
    font-size:10px;
}

.dts-select2-empty{
    padding:14px 11px;
    color:#7a8881;
    font-size:12px;
    text-align:center;
}

/* Keep grid positions identical to the native-select layout. */
.personnel-directory-v2-filters > .dts-select2{
    min-width:0;
}

/* Numbered server-side pagination */
.dt-paging{
    display:flex;
    align-items:center;
    justify-content:flex-end;
    flex-wrap:wrap;
    gap:5px;
}

.dt-paging-button,
.dt-paging-page{
    min-width:34px;
    height:34px;
    display:inline-grid;
    place-items:center;
    padding:0 10px;
    border:1px solid #dce5e0;
    border-radius:8px;
    background:#fff;
    color:#415148;
    font:inherit;
    font-size:11.5px;
    font-weight:700;
    cursor:pointer;
    transition:background .15s ease,border-color .15s ease,color .15s ease;
}

.dt-paging-button:hover:not(:disabled),
.dt-paging-page:hover:not(:disabled){
    background:#edf7f1;
    border-color:#c8dbd0;
    color:#0a6d42;
}

.dt-paging-page.is-current{
    background:#0f7448;
    border-color:#0f7448;
    color:#fff;
    cursor:default;
}

.dt-paging-button:disabled,
.dt-paging-page:disabled{
    opacity:.45;
    cursor:not-allowed;
}

.dt-paging-ellipsis{
    min-width:24px;
    display:inline-grid;
    place-items:center;
    color:#74827b;
    font-size:12px;
}

.dt-paging-mobile-label{
    display:none;
    min-width:92px;
    height:34px;
    align-items:center;
    justify-content:center;
    color:#4e5d55;
    font-size:11px;
    font-weight:700;
}

@media(max-width:720px){
    .dt-paging-page,
    .dt-paging-ellipsis{
        display:none;
    }

    .dt-paging-mobile-label{
        display:inline-flex;
    }

    .dt-paging-button{
        min-width:74px;
    }
}

@media(prefers-reduced-motion:reduce){
    .dts-select2-trigger,
    .dts-select2-chevron,
    .dt-paging-button,
    .dt-paging-page{
        transition:none!important;
    }
}

/* DTS Personnel Delete + Top Pagination v1.1.8 */
.personnel-directory-v2-panel .dt-layout-row-top{
    display:grid;
    grid-template-columns:auto minmax(220px,1fr) auto;
    align-items:center;
    gap:12px;
    margin:14px 0 8px;
    padding:9px 0 3px;
    border-top:1px solid #edf2ef;
}

.personnel-directory-v2-panel .dt-layout-row-top .dt-layout-center{
    min-width:0;
    display:flex;
    align-items:center;
    justify-content:center;
}

.personnel-directory-v2-panel .dt-info-top{
    text-align:center;
    white-space:normal;
}

.personnel-directory-v2-panel .dt-paging-top{
    justify-content:flex-end;
}

@media(max-width:1050px){
    .personnel-directory-v2-panel .dt-layout-row-top{
        grid-template-columns:auto 1fr;
    }

    .personnel-directory-v2-panel .dt-layout-row-top .dt-layout-center{
        justify-content:flex-end;
    }

    .personnel-directory-v2-panel .dt-layout-row-top .dt-layout-end{
        grid-column:1 / -1;
    }
}

@media(max-width:720px){
    .personnel-directory-v2-panel .dt-layout-row-top{
        grid-template-columns:1fr;
        align-items:stretch;
    }

    .personnel-directory-v2-panel .dt-layout-row-top .dt-layout-start,
    .personnel-directory-v2-panel .dt-layout-row-top .dt-layout-center,
    .personnel-directory-v2-panel .dt-layout-row-top .dt-layout-end{
        justify-content:center;
        text-align:center;
    }

    .personnel-directory-v2-panel .dt-layout-row-top .dt-paging{
        justify-content:center;
    }
}


/* DTS Personnel Assignment Select2 v1.1.9 */
.personnel-directory-v2-form .dts-select2{
    width:100%;
}

.personnel-directory-v2-form .dts-select2-trigger{
    min-height:43px;
    font-size:13px;
}

.personnel-directory-v2-form .personnel-directory-v2-field > .dts-select2 + small{
    margin-top:5px;
}

.dts-select2-tag-option{
    margin-bottom:3px;
    border:1px dashed #b8d8c6;
    background:#f3faf6;
    color:#0a6d42;
    font-weight:750;
}

.dts-select2-tag-option:hover,
.dts-select2-tag-option:focus-visible{
    background:#e6f5ec;
    border-color:#8ec3a6;
}

.dts-modal.is-submitting .personnel-directory-v2-form .dts-select2-trigger{
    pointer-events:none;
    opacity:.78;
}


/* DTS Personnel Select2 Modal Stack Hotfix v1.1.9.1
   The searchable dropdown is appended directly under <body>.
   Full-screen DTS modals sit at z-index:2147482000, so while a modal
   is open the dropdown must sit above that layer. */
body.dts-modal-open > .dts-select2-dropdown{
    z-index:2147483000!important;
}



/* DTS Personnel UI Cleanup + Select2 Finalization v1.1.9.3 */
.dts-select2-dropdown.is-modal-dropdown{
    z-index:2147483000!important;
}

.dts-select2-dropdown.is-modal-dropdown .dts-select2-search{
    scroll-margin-top:12px;
}

.personnel-directory-v2-form .dts-select2-trigger{
    cursor:pointer;
}

.personnel-directory-v2-form .dts-select2-trigger:focus-visible{
    outline:none;
}

/* DTS_SELECT2_KEYBOARD_FIX_V1_5_45_22_3 */
.dts-select2-option.is-keyboard-active{
    outline:none;
    background:#edf7f1;
    box-shadow:inset 0 0 0 1px #c8dbd0;
}

.dts-select2-option.is-keyboard-active.is-selected{
    background:#dff2e8;
    color:#086b40;
}

.routing-slips-filters > .dts-select2{
    min-width:0;
    width:100%;
}

