html[data-theme="dark"]{--bg:#0f172a;--surface:#111827;--surface2:#1f2937;--text:#e5e7eb;--muted:#d1d5db;--form-text:#d1d5db;--placeholder:#c4cedd;--border:#374151;--link:#4ea1ff}


html[data-theme="light"]{--bg:#f3f4f6;--surface:#fff;--surface2:#f9fafb;--text:#111827;--muted:#6b7280;--form-text:#6b7280;--placeholder:#6b7280;--border:#d1d5db;--link:#0d6efd}


body{background:var(--bg);color:var(--text);min-height:100vh}.navbar{background:var(--surface);border-color:var(--border)!important}.navbar-brand,.nav-link{color:var(--text)!important}.card,.table,.modal-content{background:var(--surface);color:var(--text);border-color:var(--border)}


.form-control,.form-select,.input-group-text{background:var(--surface2);color:var(--text);border-color:var(--border)}.form-control::placeholder{color:var(--placeholder);opacity:1}.form-control:focus,.form-select:focus{background:var(--surface2);color:var(--text);border-color:#64748b;box-shadow:0 0 0 .2rem rgba(100,116,139,.25)}.form-text{color:var(--form-text)!important;opacity:1}.form-label{color:var(--text)}.table{--bs-table-bg:var(--surface);--bs-table-color:var(--text);--bs-table-border-color:var(--border)}.text-muted{color:var(--muted)!important}


.login-page{min-height:100vh;display:flex;align-items:center;justify-content:center;padding:24px}.login-card{width:min(440px,100%)}.stat-card{min-height:130px}


.table-scroll{width:100%;max-width:100%;overflow-x:auto;-webkit-overflow-scrolling:touch}.table-scroll .data-table{min-width:950px}.dataTables_wrapper{width:100%}.dataTables_wrapper .dt-layout-row{gap:.75rem;flex-wrap:wrap}


.desktop-form-modal .modal-dialog{width:min(1200px,96vw);max-width:none;margin:.75rem auto}.desktop-form-modal .modal-content{max-height:94vh;overflow:hidden}.desktop-form-modal .modal-body{overflow:auto;max-height:calc(94vh - 125px)}


.desktop-form-modal .modal-header,.desktop-form-modal .modal-footer{flex-shrink:0}.modal-header .btn-close{background-color:#fff!important;background-image:var(--bs-btn-close-bg)!important;opacity:1;border:2px solid #fff;border-radius:.375rem;padding:.65rem;box-shadow:0 0 0 2px rgba(0,0,0,.35)}html[data-theme="light"] .modal-header .btn-close{background-color:#212529!important;background-image:var(--bs-btn-close-bg)!important;filter:invert(1);border-color:#212529}


.candidate-link{color:var(--link)!important;text-decoration:underline!important;text-underline-offset:2px}.candidate-link:visited,.candidate-link:hover,.candidate-link:active{color:var(--link)!important}


.status-badge{font-weight:600}


@media(max-width:767.98px){


 .container-fluid{padding-left:10px;padding-right:10px}


 .desktop-form-modal .modal-dialog{width:calc(100vw - 12px);max-width:none;margin:.35rem auto}


 .desktop-form-modal .modal-content{min-width:0;width:100%;max-width:100%;max-height:calc(100vh - .7rem);border-radius:.55rem}


 .desktop-form-modal .modal-body{min-width:0;width:100%;max-width:100%;overflow-x:hidden;overflow-y:auto;max-height:calc(100vh - 108px);padding:.9rem}


 .desktop-form-modal .modal-body .row{width:100%;margin-left:0;margin-right:0}


 .desktop-form-modal .modal-header,.desktop-form-modal .modal-footer{padding:.75rem .9rem}


 .desktop-form-modal .form-control,.desktop-form-modal .form-select{width:100%;max-width:100%;}


 .table-scroll .data-table{min-width:950px}


 .page-heading{gap:.75rem;flex-wrap:wrap}


}



.fetch-candidate-btn{height:calc(1.5em + .75rem + 2px);margin-top:0}


@media(max-width:767.98px){.fetch-candidate-btn{height:auto}}


/* Modern flash notifications */


.flash-toast{position:fixed;top:76px;right:20px;z-index:2000;width:min(380px,calc(100vw - 32px));display:flex;align-items:flex-start;gap:.7rem;padding:.8rem .9rem;border:1px solid var(--border);border-left-width:4px;border-radius:.65rem;background:var(--surface);color:var(--text);box-shadow:0 12px 30px rgba(0,0,0,.28);animation:flash-in .22s ease-out both;}


.flash-icon{width:28px;height:28px;min-width:28px;border-radius:50%;display:inline-flex;align-items:center;justify-content:center;font-weight:800;font-size:1rem;color:#fff;line-height:1;}


.flash-success{border-left-color:#16a34a}.flash-success .flash-icon{background:#16a34a}


.flash-danger{border-left-color:#dc2626}.flash-danger .flash-icon{background:#dc2626}


.flash-warning{border-left-color:#d97706}.flash-warning .flash-icon{background:#d97706}


.flash-info{border-left-color:#2563eb}.flash-info .flash-icon{background:#2563eb}


.flash-message{flex:1;line-height:1.35;font-size:.92rem;word-break:break-word}


.flash-close{border:0;background:transparent;color:var(--muted);font-size:1.35rem;line-height:1;padding:0 .1rem;cursor:pointer}.flash-close:hover{color:var(--text)}


.flash-toast.is-leaving{animation:flash-out .2s ease-in forwards}


@keyframes flash-in{from{opacity:0;transform:translateY(-10px) translateX(12px)}to{opacity:1;transform:none}}


@keyframes flash-out{to{opacity:0;transform:translateY(-8px) translateX(12px)}}


/* Mobile/tablet navigation: visible hamburger and theme toggle beside it */


.navbar-toggler{border:1px solid var(--border)!important;background:var(--surface2)!important;color:var(--text)!important;padding:.35rem .55rem;border-radius:.4rem;box-shadow:none!important}


.navbar-toggler:focus{box-shadow:0 0 0 .2rem rgba(96,165,250,.3)!important}


html[data-theme="dark"] .navbar-toggler-icon{filter:invert(1) grayscale(1) brightness(2)}


html[data-theme="light"] .navbar-toggler-icon{filter:none}


/* Responsive modal/forms: never force a fixed/minimum width on small screens */


.desktop-form-modal .modal-dialog{width:min(1200px,calc(100vw - 1.5rem));max-width:none;margin:.75rem auto}


.desktop-form-modal .modal-content{width:100%;max-width:100%;max-height:calc(100vh - 1.5rem);overflow:hidden}


.desktop-form-modal .modal-body{width:100%;max-width:100%;overflow-x:hidden;overflow-y:auto;max-height:calc(100vh - 130px)}


.desktop-form-modal .modal-body .row{width:100%;margin-left:0;margin-right:0}


@media(max-width:767.98px){


 .desktop-form-modal .modal-dialog{width:calc(100vw - 12px);margin:.35rem auto}


 .desktop-form-modal .modal-content{min-width:0;width:100%;max-width:100%;max-height:calc(100vh - .7rem)}


 .desktop-form-modal .modal-body{min-width:0;width:100%;max-width:100%;max-height:calc(100vh - 108px);overflow-x:hidden;overflow-y:auto}


 .flash-toast{top:66px;right:10px;width:min(360px,calc(100vw - 20px))}


}


/* v14 footer and field-level validation */


body{padding-bottom:54px}


.app-footer{position:fixed;left:0;right:0;bottom:0;z-index:1030;text-align:center;padding:10px 12px;background:var(--surface);color:var(--muted);border-top:1px solid var(--border);font-size:.9rem}


.app-footer a{color:var(--link);text-decoration:underline;text-underline-offset:2px}


.field-error{color:#dc3545;font-size:.82rem;margin-top:.3rem;font-weight:600}


html[data-theme="dark"] .field-error{color:#ff7b7b}


.form-control.is-invalid,.form-select.is-invalid{border-color:#dc3545!important;box-shadow:0 0 0 .15rem rgba(220,53,69,.12)}


@media(max-width:767.98px){


 .navbar .container-fluid{display:flex;flex-wrap:nowrap;gap:.45rem}


 .navbar-brand{min-width:0;flex:1 1 auto;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}


 .mobile-theme-wrap{order:2;flex:0 0 auto}


 .navbar-toggler{order:3;flex:0 0 auto}


 .navbar .collapse{order:4;flex-basis:100%}


 .app-footer{font-size:.78rem;padding:9px 8px}


}


.dashboard-card-link{display:block;color:inherit;text-decoration:none}.dashboard-card-link:hover .card{transform:translateY(-2px);box-shadow:0 8px 24px rgba(0,0,0,.18)}.dashboard-card-link .card{transition:transform .15s ease,box-shadow .15s ease}


/* v15 modern mobile navigation */


.app-navbar{position:sticky;top:0;z-index:1040}.app-nav-inner{position:relative}.theme-toggle{white-space:nowrap}.mobile-theme-wrap{flex:0 0 auto}.navbar-toggler{width:44px;height:40px;display:inline-flex;align-items:center;justify-content:center;border:1px solid #4b6380!important;background:var(--surface2)!important;border-radius:.65rem!important}.navbar-toggler-icon{width:1.35rem;height:1.35rem}.nav-tools{margin-left:auto}.user-label{white-space:nowrap}


@media(max-width:991.98px){


 .app-nav-inner{display:flex;align-items:center;gap:.5rem;flex-wrap:wrap}.navbar-brand{flex:1 1 auto;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.mobile-theme-wrap{order:2}.navbar-toggler{order:3}.navbar-collapse{order:4;flex:0 0 100%;width:100%;margin-top:.45rem;padding:.6rem;border:1px solid var(--border);border-radius:.8rem;background:var(--surface);box-shadow:0 12px 30px rgba(0,0,0,.22)}.navbar-collapse .navbar-nav{width:100%}.navbar-collapse .nav-link{padding:.7rem .8rem;border-radius:.55rem}.navbar-collapse .nav-link:hover{background:var(--surface2)}.nav-tools{margin-top:.7rem;padding-top:.7rem;border-top:1px solid var(--border);width:100%;display:flex!important;flex-wrap:wrap}.desktop-theme{display:none!important}.user-label{flex:1 1 auto;white-space:normal}.app-navbar .navbar-brand{font-size:1rem}


}


@media(max-width:575.98px){


 .app-nav-inner{gap:.4rem;padding-left:.6rem;padding-right:.6rem}.navbar-brand{font-size:.95rem}.mobile-theme-wrap .theme-toggle{font-size:.76rem;padding:.38rem .52rem}.navbar-toggler{width:42px;height:38px}.navbar-collapse{padding:.5rem;margin-top:.35rem}.navbar-collapse .nav-link{font-size:.95rem;padding:.62rem .7rem}.nav-tools .btn{font-size:.8rem}.app-footer{font-size:.76rem}


}


/* v15 export/report styling */


@media print{ @page{size:landscape;margin:12mm} }


.company-report-summary{font-size:1rem}.company-name-link{color:var(--link)!important;text-decoration:underline!important;text-underline-offset:2px;font-weight:600}.report-total{font-size:1.05rem;font-weight:700}


.assign-fetch-row{align-items:flex-start!important}.assign-fetch-button-wrap{padding-top:2.02rem}.assign-fetch-button{height:calc(1.5em + .75rem + 2px)}


.assignment-alert{font-size:1.08rem;font-weight:600;padding:1rem 1.1rem;border-width:1px}.assignment-alert strong{font-weight:800}



/* v16 mobile menu behavior */


@media(max-width:991.98px){


 .app-navbar.mobile-menu-open .navbar-brand,


 .app-navbar.mobile-menu-open .mobile-theme-wrap,


 .app-navbar.mobile-menu-open .navbar-toggler{display:none!important}


 .app-navbar.mobile-menu-open .app-nav-inner{gap:0}


 .app-navbar.mobile-menu-open .navbar-collapse{margin-top:0;border-radius:.9rem;padding:.65rem}


 .app-navbar.mobile-menu-open .navbar-collapse .nav-link{font-size:1rem;font-weight:500;padding:.78rem .85rem}


 .app-navbar.mobile-menu-open .nav-tools{margin-top:.8rem;padding-top:.8rem}


}


.session-timer{display:inline-flex;align-items:center;justify-content:center;white-space:nowrap;padding:.32rem .55rem;border:1px solid var(--border);border-radius:.5rem;background:var(--surface2);color:var(--muted);font-size:.76rem;font-variant-numeric:tabular-nums}


.session-timer-warning{color:#fbbf24;border-color:#a16207;background:rgba(161,98,7,.12)}


@media(max-width:991.98px){.session-timer{font-size:.74rem}.navbar-collapse .session-timer{width:max-content}.nav-tools{gap:.45rem!important}}


@media(max-width:575.98px){.session-timer{font-size:.7rem;padding:.3rem .45rem}}



/* v17: robust mobile modal sizing so the footer actions are always visible */


.desktop-form-modal .modal-dialog-scrollable .modal-content{


    display:flex;


    flex-direction:column;


    max-height:calc(100vh - 1.5rem);


}


.desktop-form-modal .modal-dialog-scrollable .modal-body{


    flex:1 1 auto;


    min-height:0;


    max-height:none;


    overflow-x:hidden;


    overflow-y:auto;


}


.desktop-form-modal .modal-dialog-scrollable .modal-footer{


    flex:0 0 auto;


    position:relative;


    z-index:2;


    background:var(--surface);


    border-top:1px solid var(--border);


}


.refresh-timer-warning{color:#fbbf24;border-color:#a16207;background:rgba(161,98,7,.12)}


@media(max-width:767.98px){


    .desktop-form-modal .modal-dialog-scrollable{


        width:calc(100vw - 12px);


        max-width:none;


        height:calc(100vh - .7rem);


        margin:.35rem auto;


    }


    .desktop-form-modal .modal-dialog-scrollable .modal-content{


        width:100%;


        max-width:100%;


        height:100%;


        max-height:100%;


        min-height:0;


    }


    .desktop-form-modal .modal-dialog-scrollable .modal-body{


        padding:.85rem;


        min-height:0;


    }


    .desktop-form-modal .modal-dialog-scrollable .modal-footer{


        padding:.7rem .85rem;


    }


    .desktop-form-modal .modal-dialog-scrollable .modal-footer .btn{


        min-height:42px;


    }


    .refresh-timer,.session-timer{font-size:.68rem;padding:.28rem .42rem}


}


@media(max-width:380px){


    .desktop-form-modal .modal-dialog-scrollable .modal-header{padding:.65rem .75rem}


    .desktop-form-modal .modal-dialog-scrollable .modal-body{padding:.75rem}


    .desktop-form-modal .modal-dialog-scrollable .modal-footer{padding:.65rem .75rem}


    .desktop-form-modal .modal-dialog-scrollable .modal-footer .btn{flex:1 1 0;min-width:0}


}


/* v17.1: mobile candidate form scrolling fix */


@media (max-width: 767.98px) {


    .desktop-form-modal .modal-dialog.modal-dialog-scrollable {


        width: calc(100vw - 12px);


        max-width: calc(100vw - 12px);


        height: calc(100dvh - .7rem);


        min-height: 0;


        margin: .35rem auto;


    }



    .desktop-form-modal .modal-dialog.modal-dialog-scrollable .modal-content {


        display: flex;


        flex-direction: column;


        width: 100%;


        height: 100%;


        min-height: 0;


        max-height: 100%;


        overflow: hidden;


    }



    .desktop-form-modal .modal-dialog.modal-dialog-scrollable form {


        display: flex;


        flex-direction: column;


        flex: 1 1 auto;


        min-height: 0;


        overflow: hidden;


    }



    .desktop-form-modal .modal-dialog.modal-dialog-scrollable .modal-header {


        flex: 0 0 auto;


    }



    .desktop-form-modal .modal-dialog.modal-dialog-scrollable .modal-body {


        display: block;


        flex: 1 1 0;


        height: auto;


        min-height: 0;


        max-height: none;


        overflow-x: hidden;


        overflow-y: auto;


        -webkit-overflow-scrolling: touch;


        overscroll-behavior: contain;


        touch-action: pan-y;


    }



    .desktop-form-modal .modal-dialog.modal-dialog-scrollable .modal-footer {


        flex: 0 0 auto;


    }


}


/* v55: legacy-browser modal scrolling fallback (Chrome/Windows 7/10) */


.desktop-form-modal .modal-dialog{


    max-height:calc(100vh - 20px);


}


.desktop-form-modal .modal-content{


    max-height:calc(100vh - 20px);


}


.desktop-form-modal .modal-body{


    overflow-x:hidden;


    overflow-y:auto;


    -webkit-overflow-scrolling:touch;


}


@media (max-width:767.98px){


    .desktop-form-modal .modal-dialog{


        width:calc(100vw - 12px);


        max-width:calc(100vw - 12px);


        height:calc(100vh - 12px);


        max-height:calc(100vh - 12px);


        margin:6px auto;


    }


    .desktop-form-modal .modal-content{


        height:calc(100vh - 12px);


        max-height:calc(100vh - 12px);


        min-height:0;


    }


    .desktop-form-modal .modal-body{


        height:auto;


        min-height:0;


        max-height:calc(100vh - 125px);


        overflow-y:scroll;


        overflow-x:hidden;


        -webkit-overflow-scrolling:touch;


    }


}


/* v20 report table headers */


.data-table thead th{ text-align:center!important; font-size:1rem!important; font-weight:700!important; vertical-align:middle!important; border:1px solid var(--border)!important; }


.data-table thead th,.data-table tbody td{ border-left:1px solid var(--border)!important; border-right:1px solid var(--border)!important; }


/* v48: theme-aware disabled candidate description field */


html[data-theme="dark"] .desktop-form-modal .form-control:disabled, html[data-theme="dark"] .desktop-form-modal .form-select:disabled{background-color:var(--surface2)!important;color:var(--muted)!important;-webkit-text-fill-color:var(--muted)!important;border-color:var(--border)!important;opacity:1!important;}


html[data-theme="dark"] .desktop-form-modal .form-control:disabled::placeholder{color:var(--placeholder)!important;opacity:1!important;}



/* v56: compact, cross-browser modal layout.


   Keep normal dialog size; only the body scrolls when content is taller


   than the available viewport. Avoid fixed/full-viewport dialog heights so


   older Chrome/Windows releases behave like modern browsers. */


.desktop-form-modal .modal-dialog.modal-dialog-scrollable{


    width:90%;


    max-width:820px;


    height:auto !important;


    min-height:0 !important;


    margin:1rem auto;


}


.desktop-form-modal .modal-content{


    width:100%;


    max-width:100%;


    height:auto !important;


    max-height:85vh;


    min-height:0 !important;


    overflow:hidden;


}


.desktop-form-modal .modal-dialog-scrollable .modal-content{


    height:auto !important;


    max-height:85vh;


    min-height:0 !important;


}


.desktop-form-modal .modal-dialog-scrollable form{


    display:flex;


    flex-direction:column;


    min-height:0;


}


.desktop-form-modal .modal-dialog-scrollable .modal-header,


.desktop-form-modal .modal-dialog-scrollable .modal-footer{


    flex:0 0 auto;


}


.desktop-form-modal .modal-dialog-scrollable .modal-body{


    min-height:0 !important;


    max-height:calc(85vh - 125px);


    overflow-y:auto !important;


    overflow-x:hidden !important;


    -webkit-overflow-scrolling:touch;


}



@media (max-width:767.98px){


    .desktop-form-modal .modal-dialog.modal-dialog-scrollable{


        width:calc(100vw - 20px);


        max-width:calc(100vw - 20px);


        height:auto !important;


        margin:10px auto;


    }


    .desktop-form-modal .modal-content,


    .desktop-form-modal .modal-dialog-scrollable .modal-content{


        max-height:92vh;


        height:auto !important;


    }


    .desktop-form-modal .modal-dialog-scrollable .modal-body{


        max-height:calc(92vh - 112px);


        overflow-y:auto !important;


        overflow-x:hidden !important;


        -webkit-overflow-scrolling:touch;


    }


}


/* Legacy-browser fallback: no explicit full-viewport dialog height. */


@media (max-width:767.98px){


    .desktop-form-modal .modal-dialog.modal-dialog-scrollable,


    .desktop-form-modal .modal-dialog.modal-dialog-scrollable .modal-content{


        height:auto !important;


        min-height:0 !important;


    }


}



/* v57: compact desktop navigation for smaller desktop widths (e.g. 1336x786).


   Keep the full desktop navigation, but prevent wrapping/overflow by tightening


   link and utility spacing. This avoids changing the mobile hamburger behavior. */


@media (min-width:992px) and (max-width:1399.98px){


    .app-navbar{overflow-x:hidden;}


    .app-navbar .app-nav-inner{min-width:0;flex-wrap:nowrap;gap:.35rem;}


    .app-navbar .navbar-brand{


        flex:0 1 auto;


        min-width:0;


        max-width:150px;


        margin-right:.2rem;


        font-size:.92rem;


        white-space:nowrap;


    }


    .app-navbar .navbar-collapse{


        min-width:0;


        flex:1 1 auto;


    }


    .app-navbar .navbar-nav{


        min-width:0;


        flex-wrap:nowrap!important;


    }


    .app-navbar .navbar-nav .nav-item{flex:0 0 auto;}


    .app-navbar .navbar-nav .nav-link{


        padding:.5rem .35rem;


        font-size:.80rem;


        line-height:1.15;


        white-space:nowrap;


    }


    .app-navbar .nav-tools{


        flex:0 0 auto;


        gap:.3rem!important;


        min-width:0;


    }


    .app-navbar .session-timer{


        font-size:.60rem;


        padding:.26rem .38rem;


    }


    .app-navbar .theme-toggle{


        font-size:.72rem;


        padding:.3rem .42rem;


    }


    .app-navbar .user-label{


        max-width:145px;


        overflow:hidden;


        text-overflow:ellipsis;


        white-space:nowrap;


        font-size:.72rem;


    }


    .app-navbar .nav-tools .btn-danger{


        font-size:.74rem;


        padding:.31rem .48rem;


        white-space:nowrap;


    }


    body{overflow-x:hidden;}


}


/* v58: compact desktop/tablet navigation below 1400px. Bootstrap's lg breakpoint


   leaves long labels visible at 1336px, which can create horizontal overflow.


   Use the existing hamburger/collapse component for these narrower desktop widths. */


@media (min-width: 992px) and (max-width: 1399.98px){


    .app-navbar .navbar-toggler{


        display:block!important;


        flex:0 0 auto;


    }


    .app-navbar .navbar-collapse.collapse:not(.show){


        display:none!important;


    }


    .app-navbar .navbar-collapse.collapse.show{


        display:block!important;


        flex-basis:100%;


        width:100%;


        margin-top:.5rem;


        padding-top:.5rem;


        border-top:1px solid var(--border);


    }


    .app-nav-inner{


        flex-wrap:wrap!important;


    }


    .app-navbar .navbar-brand{


        margin-right:.75rem;


        white-space:nowrap;


    }


    .app-navbar .navbar-toggler{


        margin-left:auto;


    }


    .app-navbar.mobile-menu-open .navbar-brand{


        display:none!important;


    }


    .app-navbar.mobile-menu-open .navbar-collapse{


        margin-top:0;


        padding-top:.25rem;


    }


    .app-navbar .nav-link{


        white-space:nowrap;


    }


}



/* v66 responsive navigation: below 1650px use the hamburger menu so the top bar never


   becomes a horizontally scrolling navigation. When opened on desktop, keep the menu


   links on one row and the utility controls on the next row. Tablets/phones retain the


   existing compact hamburger presentation. */


@media (max-width:1649.98px){


 .app-nav-inner{display:flex;align-items:center;flex-wrap:wrap;gap:.25rem .5rem}


 .app-nav-inner > .navbar-brand{flex:1 1 auto;min-width:0}


 .app-nav-inner > .navbar-toggler{display:inline-flex!important;order:3;flex:0 0 auto}


 .app-nav-inner > .navbar-collapse{order:4;flex:0 0 100%;width:100%;margin-top:.45rem;padding:.6rem;display:none!important;flex-wrap:wrap;align-items:flex-start;border:1px solid var(--border);border-radius:.8rem;background:var(--surface);box-shadow:0 12px 30px rgba(0,0,0,.22)}


 .app-nav-inner > .navbar-collapse.show{display:flex!important}


 .app-nav-inner > .navbar-collapse .navbar-nav{flex:1 1 100%;width:100%;display:flex;flex-wrap:nowrap;overflow:visible;margin-right:0!important;margin-bottom:0!important;gap:.1rem}


 .app-nav-inner > .navbar-collapse .navbar-nav .nav-item{flex:0 0 auto}


 .app-nav-inner > .navbar-collapse .navbar-nav .nav-link{padding:.65rem .72rem;border-radius:.5rem;white-space:nowrap}


 .app-nav-inner > .navbar-collapse .navbar-nav .nav-link:hover{background:var(--surface2)}


 .app-nav-inner > .navbar-collapse .nav-tools{flex:1 1 100%;width:100%;margin-left:0;margin-top:.6rem;padding-top:.6rem;border-top:1px solid var(--border);justify-content:flex-end;flex-wrap:wrap;white-space:normal}


 .app-nav-inner > .navbar-collapse .nav-tools .session-timer,.app-nav-inner > .navbar-collapse .nav-tools .theme-toggle,.app-nav-inner > .navbar-collapse .nav-tools .user-label,.app-nav-inner > .navbar-collapse .nav-tools .btn{white-space:nowrap}


 .app-navbar.mobile-menu-open .navbar-brand,.app-navbar.mobile-menu-open .mobile-theme-wrap,.app-navbar.mobile-menu-open .navbar-toggler{display:none!important}


 .app-navbar.mobile-menu-open .app-nav-inner{gap:0}


 .app-navbar.mobile-menu-open .navbar-collapse{margin-top:0}


}


/* Company List web page only: keep a usable table width and wrap at word boundaries. */


@media screen{


 .company-list-report-table{min-width:1450px!important;table-layout:auto}


 .company-list-report-table th,.company-list-report-table td{white-space:normal!important;overflow-wrap:break-word;word-break:normal;hyphens:none;vertical-align:middle}


 .company-list-report-table th{min-width:90px}


 .company-list-report-table th:nth-child(1){min-width:130px}


 .company-list-report-table th:nth-child(2){min-width:130px}


 .company-list-report-table th:nth-child(3){min-width:110px}


 .company-list-report-table th:nth-child(4){min-width:150px}


 .company-list-report-table th:nth-child(5){min-width:180px}


 .company-list-report-table th:nth-child(6){min-width:105px}


 .company-list-report-table th:nth-child(7),


 .company-list-report-table th:nth-child(8),


 .company-list-report-table th:nth-child(10),


 .company-list-report-table th:nth-child(11){min-width:130px}


 .company-list-report-table th:nth-child(9){min-width:95px}


 .company-list-report-table th:nth-child(n+12){min-width:170px}


}

/* Candidate add/edit modal: keep the full form visible and vertically scrollable on small screens. */
.candidate-form-modal .modal-dialog.modal-dialog-scrollable{
    width:min(900px,calc(100vw - 32px));
    max-width:calc(100vw - 32px);
    max-height:calc(100vh - 24px);
    margin:12px auto;
}
.candidate-form-modal .modal-dialog-scrollable .modal-content{
    width:100%;
    max-width:100%;
    max-height:calc(100vh - 24px);
    height:auto !important;
    min-height:0 !important;
    overflow:hidden;
}
.candidate-form-modal .modal-dialog-scrollable form{
    display:flex;
    flex-direction:column;
    min-height:0;
    max-height:calc(100vh - 24px);
}
.candidate-form-modal .modal-dialog-scrollable .modal-body{
    flex:1 1 auto;
    min-height:0 !important;
    max-height:calc(100vh - 128px);
    overflow-x:hidden !important;
    overflow-y:auto !important;
    -webkit-overflow-scrolling:touch;
}
@media (max-width:767.98px){
    .candidate-form-modal .modal-dialog.modal-dialog-scrollable{
        width:calc(100vw - 12px);
        max-width:calc(100vw - 12px);
        max-height:calc(100vh - 12px);
        margin:6px auto;
    }
    .candidate-form-modal .modal-dialog-scrollable .modal-content{
        max-height:calc(100vh - 12px);
    }
    .candidate-form-modal .modal-dialog-scrollable form{
        max-height:calc(100vh - 12px);
    }
    .candidate-form-modal .modal-dialog-scrollable .modal-body{
        max-height:calc(100vh - 112px);
        padding:.8rem;
    }
    .candidate-form-modal .modal-dialog-scrollable .modal-body .row{
        --bs-gutter-x:.75rem;
        --bs-gutter-y:.75rem;
    }
}

/* Candidate add/edit modal mobile visibility fix. */
@media (max-width: 767.98px) {
    #addCandidate.candidate-form-modal .modal-dialog,
    #editCandidate.candidate-form-modal .modal-dialog {
        width: calc(100vw - 12px) !important;
        max-width: calc(100vw - 12px) !important;
        height: calc(100vh - 12px) !important;
        max-height: calc(100vh - 12px) !important;
        margin: 6px auto !important;
    }
    #addCandidate.candidate-form-modal .modal-content,
    #editCandidate.candidate-form-modal .modal-content {
        width: 100% !important;
        max-width: 100% !important;
        height: 100% !important;
        max-height: 100% !important;
        min-height: 0 !important;
        display: flex !important;
        flex-direction: column !important;
        overflow: hidden !important;
    }
    #addCandidate.candidate-form-modal form,
    #editCandidate.candidate-form-modal form {
        width: 100% !important;
        height: 100% !important;
        max-height: 100% !important;
        min-height: 0 !important;
        display: flex !important;
        flex-direction: column !important;
        overflow: hidden !important;
    }
    #addCandidate.candidate-form-modal .modal-header,
    #editCandidate.candidate-form-modal .modal-header,
    #addCandidate.candidate-form-modal .modal-footer,
    #editCandidate.candidate-form-modal .modal-footer {
        flex: 0 0 auto !important;
    }
    #addCandidate.candidate-form-modal .modal-body,
    #editCandidate.candidate-form-modal .modal-body {
        flex: 1 1 auto !important;
        width: 100% !important;
        max-width: 100% !important;
        min-height: 0 !important;
        height: auto !important;
        max-height: none !important;
        overflow-x: hidden !important;
        overflow-y: auto !important;
        -webkit-overflow-scrolling: touch !important;
    }
}

/* Ensure all application modals remain usable on short mobile screens. */
@media (max-width: 767.98px) and (max-height: 700px) {
    .modal.show {
        overflow-y: hidden !important;
    }
    .desktop-form-modal .modal-dialog.modal-dialog-scrollable {
        width: calc(100vw - 8px) !important;
        max-width: calc(100vw - 8px) !important;
        height: calc(100vh - 8px) !important;
        max-height: calc(100vh - 8px) !important;
        margin: 4px auto !important;
        display: flex !important;
        align-items: stretch !important;
    }
    .desktop-form-modal .modal-dialog-scrollable .modal-content {
        width: 100% !important;
        height: 100% !important;
        max-height: 100% !important;
        min-height: 0 !important;
        overflow: hidden !important;
        display: flex !important;
        flex-direction: column !important;
    }
    .desktop-form-modal .modal-dialog-scrollable form {
        height: 100% !important;
        max-height: 100% !important;
        min-height: 0 !important;
        display: flex !important;
        flex-direction: column !important;
    }
    .desktop-form-modal .modal-dialog-scrollable .modal-header,
    .desktop-form-modal .modal-dialog-scrollable .modal-footer {
        flex: 0 0 auto !important;
    }
    .desktop-form-modal .modal-dialog-scrollable .modal-body {
        flex: 1 1 auto !important;
        height: auto !important;
        max-height: none !important;
        min-height: 0 !important;
        overflow-x: hidden !important;
        overflow-y: auto !important;
        -webkit-overflow-scrolling: touch !important;
    }
}

/* Extra-small-height phones: keep footer actions visible while the form body scrolls. */
@media (max-width: 767.98px) and (max-height: 520px) {
    .desktop-form-modal .modal-dialog.modal-dialog-scrollable {
        width: calc(100vw - 4px) !important;
        max-width: calc(100vw - 4px) !important;
        height: calc(100vh - 4px) !important;
        max-height: calc(100vh - 4px) !important;
        margin: 2px auto !important;
    }
    .desktop-form-modal .modal-dialog-scrollable .modal-header {
        padding: .4rem .6rem !important;
    }
    .desktop-form-modal .modal-dialog-scrollable .modal-footer {
        padding: .4rem .6rem !important;
    }
    .desktop-form-modal .modal-dialog-scrollable .modal-body {
        padding: .6rem !important;
    }
}


/* Company Coordinator Associate monitoring rows use red for active queue candidates and green for completed interviews. */
.helper-monitor-table .table-success > td, .helper-monitor-table .table-success > th { background-color: rgba(25,135,84,.18) !important; }
.helper-monitor-table .table-danger > td, .helper-monitor-table .table-danger > th { background-color: rgba(220,53,69,.18) !important; }


/* Candidate modal: reserve a full viewport-height flex container so footer actions remain visible on short phones. */
.candidate-form-modal .modal-dialog.modal-dialog-scrollable{
    height:calc(100vh - 16px) !important;
    max-height:calc(100vh - 16px) !important;
    margin:8px auto !important;
}
.candidate-form-modal .modal-dialog-scrollable .modal-content{
    height:100% !important;
    max-height:100% !important;
    display:flex !important;
    flex-direction:column !important;
    overflow:hidden !important;
}
.candidate-form-modal .modal-dialog-scrollable form{
    height:100% !important;
    max-height:100% !important;
    min-height:0 !important;
    display:flex !important;
    flex-direction:column !important;
}
.candidate-form-modal .modal-dialog-scrollable .modal-header,
.candidate-form-modal .modal-dialog-scrollable .modal-footer{
    flex:0 0 auto !important;
    position:relative !important;
    z-index:2 !important;
}
.candidate-form-modal .modal-dialog-scrollable .modal-body{
    flex:1 1 auto !important;
    min-height:0 !important;
    height:auto !important;
    max-height:none !important;
    overflow-y:auto !important;
    overflow-x:hidden !important;
    -webkit-overflow-scrolling:touch !important;
}
@media (max-width:767.98px){
    .candidate-form-modal .modal-dialog.modal-dialog-scrollable{
        width:calc(100vw - 12px) !important;
        max-width:calc(100vw - 12px) !important;
        height:calc(100vh - 12px) !important;
        max-height:calc(100vh - 12px) !important;
        margin:6px auto !important;
    }
    .candidate-form-modal .modal-dialog-scrollable .modal-footer{
        padding:.6rem !important;
        gap:.5rem !important;
    }
    .candidate-form-modal .modal-dialog-scrollable .modal-footer .btn{
        min-height:42px !important;
    }
}
@supports (height:100dvh){
    .candidate-form-modal .modal-dialog.modal-dialog-scrollable{
        height:calc(100dvh - 12px) !important;
        max-height:calc(100dvh - 12px) !important;
    }
}
@media (max-width:767.98px) and (max-height:600px){
    .candidate-form-modal .modal-dialog-scrollable .modal-header{
        padding:.5rem .75rem !important;
    }
    .candidate-form-modal .modal-dialog-scrollable .modal-header h5{
        font-size:1.05rem !important;
    }
    .candidate-form-modal .modal-dialog-scrollable .modal-footer{
        padding:.45rem .6rem !important;
    }
    .candidate-form-modal .modal-dialog-scrollable .modal-body{
        padding:.65rem !important;
    }
}

/* v80 desktop navigation: keep application name and navigation links on the first row,
   and place auto logout, auto refresh, theme, account name, and logout on the second row. */
@media (min-width:1650px){
    .app-nav-inner{display:flex!important;align-items:flex-start!important;flex-wrap:wrap!important;gap:.15rem .75rem!important;}
    .app-nav-inner > .navbar-brand{flex:0 0 auto!important;white-space:nowrap!important;margin-top:.2rem!important;}
    .app-nav-inner > .navbar-collapse{display:contents!important;flex:0 0 auto!important;width:auto!important;}
    .app-nav-inner > .navbar-collapse .navbar-nav{display:flex!important;flex:1 1 auto!important;flex-wrap:nowrap!important;align-items:center!important;min-width:0!important;margin:0!important;overflow:visible!important;}
    .app-nav-inner > .navbar-collapse .navbar-nav .nav-item{flex:0 0 auto!important;}
    .app-nav-inner > .navbar-collapse .navbar-nav .nav-link{white-space:nowrap!important;}
    .app-nav-inner > .navbar-collapse .nav-tools{flex:0 0 100%!important;width:100%!important;max-width:none!important;margin:0!important;padding-top:.45rem!important;padding-left:0!important;border-top:1px solid var(--border)!important;justify-content:flex-end!important;display:flex!important;flex-wrap:wrap!important;}
    .app-nav-inner > .navbar-toggler,.app-nav-inner > .mobile-theme-wrap{display:none!important;}
}

/* Waiting Hall: keep table rows on the normal table background; status badges provide the visual status colors. */
.waiting-hall-table tbody > tr > td, .waiting-hall-table tbody > tr > th { background-color: var(--surface) !important; background-image: none !important; }
.waiting-hall-table tbody > tr:hover > td, .waiting-hall-table tbody > tr:hover > th { background-color: var(--surface) !important; }

/* Candidate Add/Edit mobile fix: keep the dialog inside the visible viewport so the action footer is always visible. */
@media (max-width:767.98px){
    .candidate-form-modal .modal-dialog.modal-dialog-scrollable{
        position:fixed !important;
        top:6px !important;
        right:6px !important;
        bottom:6px !important;
        left:6px !important;
        width:auto !important;
        max-width:none !important;
        height:auto !important;
        max-height:none !important;
        margin:0 !important;
        transform:none !important;
    }
    .candidate-form-modal .modal-dialog-scrollable .modal-content{
        width:100% !important;
        height:100% !important;
        max-height:none !important;
        min-height:0 !important;
        display:flex !important;
        flex-direction:column !important;
        overflow:hidden !important;
    }
    .candidate-form-modal .modal-dialog-scrollable form{
        width:100% !important;
        height:100% !important;
        max-height:none !important;
        min-height:0 !important;
        display:flex !important;
        flex-direction:column !important;
        overflow:hidden !important;
    }
    .candidate-form-modal .modal-dialog-scrollable .modal-header,
    .candidate-form-modal .modal-dialog-scrollable .modal-footer{
        flex:0 0 auto !important;
    }
    .candidate-form-modal .modal-dialog-scrollable .modal-body{
        flex:1 1 auto !important;
        min-height:0 !important;
        max-height:none !important;
        height:auto !important;
        overflow-x:hidden !important;
        overflow-y:auto !important;
        -webkit-overflow-scrolling:touch !important;
    }
}


/* Final mobile Add Candidate modal fix: keep the action footer inside the visible viewport while only the form body scrolls. */
@media (max-width: 767.98px) {
    #addCandidate.candidate-form-modal {
        overflow: hidden !important;
    }
    #addCandidate.candidate-form-modal .modal-dialog.modal-dialog-scrollable {
        position: fixed !important;
        top: .5rem !important;
        right: .5rem !important;
        bottom: .5rem !important;
        left: .5rem !important;
        width: auto !important;
        max-width: none !important;
        height: auto !important;
        max-height: none !important;
        margin: 0 !important;
        padding: 0 !important;
        transform: none !important;
        overflow: hidden !important;
    }
    #addCandidate.candidate-form-modal .modal-dialog-scrollable .modal-content {
        width: 100% !important;
        height: 100% !important;
        max-width: none !important;
        max-height: none !important;
        min-height: 0 !important;
        display: flex !important;
        flex-direction: column !important;
        overflow: hidden !important;
    }
    #addCandidate.candidate-form-modal .modal-dialog-scrollable form {
        width: 100% !important;
        height: 100% !important;
        max-width: none !important;
        max-height: none !important;
        min-height: 0 !important;
        display: flex !important;
        flex-direction: column !important;
        overflow: hidden !important;
    }
    #addCandidate.candidate-form-modal .modal-dialog-scrollable .modal-header {
        flex: 0 0 auto !important;
        position: relative !important;
        z-index: 3 !important;
    }
    #addCandidate.candidate-form-modal .modal-dialog-scrollable .modal-body {
        flex: 1 1 0% !important;
        min-height: 0 !important;
        height: 0 !important;
        max-height: none !important;
        overflow-x: hidden !important;
        overflow-y: auto !important;
        -webkit-overflow-scrolling: touch !important;
        overscroll-behavior: contain !important;
    }
    #addCandidate.candidate-form-modal .modal-dialog-scrollable .modal-footer {
        flex: 0 0 auto !important;
        display: flex !important;
        visibility: visible !important;
        opacity: 1 !important;
        position: relative !important;
        z-index: 10 !important;
        width: 100% !important;
        min-height: 58px !important;
        background: var(--surface) !important;
        border-top: 1px solid var(--border) !important;
        padding: .65rem .75rem !important;
        margin: 0 !important;
        gap: .5rem !important;
    }
    #addCandidate.candidate-form-modal .modal-dialog-scrollable .modal-footer .btn {
        flex: 1 1 0 !important;
        min-width: 0 !important;
        min-height: 42px !important;
        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;
        visibility: visible !important;
        opacity: 1 !important;
    }
}
@supports (height: 100svh) {
    @media (max-width: 767.98px) {
        #addCandidate.candidate-form-modal .modal-dialog.modal-dialog-scrollable {
            height: calc(100svh - 1rem) !important;
        }
    }
}

/* v104: Edit Candidate uses the same fixed-footer mobile behavior as Add Candidate. */
@media (max-width: 767.98px) {
    #editCandidate.candidate-form-modal {
        overflow: hidden !important;
    }
    #editCandidate.candidate-form-modal .modal-dialog.modal-dialog-scrollable {
        position: fixed !important;
        top: .5rem !important;
        right: .5rem !important;
        bottom: .5rem !important;
        left: .5rem !important;
        width: auto !important;
        max-width: none !important;
        height: auto !important;
        max-height: none !important;
        margin: 0 !important;
        padding: 0 !important;
        transform: none !important;
        overflow: hidden !important;
    }
    #editCandidate.candidate-form-modal .modal-dialog-scrollable .modal-content {
        width: 100% !important;
        height: 100% !important;
        max-width: none !important;
        max-height: none !important;
        min-height: 0 !important;
        display: flex !important;
        flex-direction: column !important;
        overflow: hidden !important;
    }
    #editCandidate.candidate-form-modal .modal-dialog-scrollable form {
        width: 100% !important;
        height: 100% !important;
        max-width: none !important;
        max-height: none !important;
        min-height: 0 !important;
        display: flex !important;
        flex-direction: column !important;
        overflow: hidden !important;
    }
    #editCandidate.candidate-form-modal .modal-dialog-scrollable .modal-header {
        flex: 0 0 auto !important;
        position: relative !important;
        z-index: 3 !important;
    }
    #editCandidate.candidate-form-modal .modal-dialog-scrollable .modal-body {
        flex: 1 1 0% !important;
        min-height: 0 !important;
        height: 0 !important;
        max-height: none !important;
        overflow-x: hidden !important;
        overflow-y: auto !important;
        -webkit-overflow-scrolling: touch !important;
        overscroll-behavior: contain !important;
    }
    #editCandidate.candidate-form-modal .modal-dialog-scrollable .modal-footer {
        flex: 0 0 auto !important;
        display: flex !important;
        visibility: visible !important;
        opacity: 1 !important;
        position: relative !important;
        z-index: 10 !important;
        width: 100% !important;
        min-height: 58px !important;
        background: var(--surface) !important;
        border-top: 1px solid var(--border) !important;
        padding: .65rem .75rem !important;
        margin: 0 !important;
        gap: .5rem !important;
    }
    #editCandidate.candidate-form-modal .modal-dialog-scrollable .modal-footer .btn {
        flex: 1 1 0 !important;
        min-width: 0 !important;
        min-height: 42px !important;
        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;
        visibility: visible !important;
        opacity: 1 !important;
    }
}
@supports (height: 100svh) {
    @media (max-width: 767.98px) {
        #editCandidate.candidate-form-modal .modal-dialog.modal-dialog-scrollable {
            height: calc(100svh - 1rem) !important;
        }
    }
}

/* v106: attendance report tables use one normal DataTables grid.
   Do not use the generic 950px table minimum or DataTables horizontal-scroll
   header/body split for these reports. */
.table-scroll .report-fit-table-wrap{width:100%;max-width:100%;overflow-x:hidden!important;}
.table-scroll .report-fit-table{width:100%!important;min-width:0!important;max-width:100%!important;table-layout:fixed!important;}
.report-fit-table th,.report-fit-table td{box-sizing:border-box!important;white-space:normal!important;overflow-wrap:anywhere!important;word-break:break-word!important;vertical-align:middle!important;}
.report-fit-table thead th{overflow:hidden;}
@media (max-width:767.98px){
  .report-fit-table th,.report-fit-table td{font-size:.78rem!important;padding:.4rem .32rem!important;}
}

/* v107: Attendance reports use the same wide, multi-column DataTables layout as
   Company List Report. The wrapper fills the card and DataTables provides a
   synchronized horizontal viewport when the table is wider than the screen. */
@media screen{
 .attendance-report-table{min-width:1450px!important;table-layout:auto!important;width:100%!important}
 .attendance-report-table th,.attendance-report-table td{white-space:normal!important;overflow-wrap:break-word;word-break:normal;hyphens:none;vertical-align:middle}
 .attendance-report-table th{min-width:90px}
 .attendance-report-table th:nth-child(1){min-width:115px}
 .attendance-report-table th:nth-child(2){min-width:150px}
 .attendance-report-table th:nth-child(3),
 .attendance-report-table th:nth-child(4){min-width:125px}
 .attendance-report-table th:nth-child(5){min-width:250px}
 .attendance-report-table th:nth-child(6){min-width:170px}
 .attendance-report-table th:nth-child(7){min-width:145px}
 .attendance-report-table th:nth-child(8){min-width:270px}
}