/* JL Token — Refresh 2026. Loaded after vendor styles; screen-only by design.
   No dependencies, DOM mutation, API changes, or print overrides. */
:root{--rf-bg:#f5f6f8;--rf-surface:#fff;--rf-ink:#20252d;--rf-muted:#697382;--rf-line:#e7e9ee;--rf-accent:#bc3540;--rf-soft:#fcf0f1;--rf-radius:16px}
body.refresh-2026{background:var(--rf-bg)!important;color:var(--rf-ink);font-family:Inter,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;font-size:14px;line-height:1.55}
.refresh-2026 h1,.refresh-2026 h2,.refresh-2026 h3,.refresh-2026 h4,.refresh-2026 h5,.refresh-2026 h6{color:var(--rf-ink);letter-spacing:-.035em}
.refresh-2026 a{color:var(--rf-accent)}
.refresh-2026 .navbar-main{background:#fff!important;color:var(--rf-ink)!important;box-shadow:none;border-bottom:1px solid var(--rf-line)}
.refresh-2026 .navbar-main .nav-wrapper>.navbar-list>li>a,.refresh-2026 .navbar-main .nav-wrapper>.navbar-list>li>span,.refresh-2026 .navbar-main .nav-wrapper>.navbar-list>li>a>i{color:var(--rf-ink)!important}
.refresh-2026 .navbar-main .navbar-list b{font-weight:500;font-size:13px}
.refresh-2026 .navbar-main .navbar-list>li>span{font-size:20px!important;letter-spacing:-.6px}
.refresh-2026 .brand-sidebar{background:#fff!important;border-bottom:1px solid var(--rf-line);box-shadow:none}
.refresh-2026 .brand-sidebar .logo-text,.refresh-2026 .brand-sidebar .navbar-toggler i{color:var(--rf-ink)!important}
.refresh-2026 .sidenav-main .sidenav,.refresh-2026 .navigation-background{background:#fff!important;box-shadow:none;border-inline-end:1px solid var(--rf-line)}
.refresh-2026 .sidenav-main .sidenav li>a{margin:4px 12px;border-radius:10px!important;color:#5c6470!important;font-weight:500;height:auto;min-height:46px;line-height:46px}
.refresh-2026 .sidenav-main .sidenav li>a>i{color:#7b8492!important}
.refresh-2026 .sidenav-main .sidenav li>a:hover{background:#f5f6f8!important}
.refresh-2026 .sidenav-main .sidenav li>a.active,.refresh-2026 .sidenav-main .sidenav li.active>a{background:var(--rf-soft)!important;box-shadow:none!important;color:var(--rf-accent)!important}
.refresh-2026 .sidenav-main .sidenav li>a.active>i,.refresh-2026 .sidenav-main .sidenav li.active>a>i{color:var(--rf-accent)!important}
.refresh-2026 .sidenav .collapsible-body{background:#fff!important}
.refresh-2026 #main{padding-top:24px;padding-right:24px;padding-bottom:28px}
.refresh-2026 #breadcrumbs-wrapper{background:transparent;padding:10px 0 18px}
.refresh-2026 .breadcrumbs-title{font-size:26px;line-height:1.3}
.refresh-2026 .card,.refresh-2026 .card-panel{background:#fff;border:1px solid var(--rf-line);border-radius:var(--rf-radius);box-shadow:0 4px 18px #20252d04}
.refresh-2026 .card .card-content{padding:26px}
.refresh-2026 .card .card-title{font-weight:600;color:var(--rf-ink)}
.refresh-2026 .card .card-action{border-color:var(--rf-line)}
.refresh-2026 .divider{background:var(--rf-line)}
.refresh-heading{display:flex;align-items:center;justify-content:space-between;margin:2px 12px 24px;gap:16px}
.refresh-heading h1{font-size:30px;margin:4px 0;font-weight:650}
.refresh-eyebrow{font-size:10px;font-weight:700;letter-spacing:2px;color:var(--rf-muted)}
.refresh-today{padding:8px 16px;border:1px solid var(--rf-line);background:#fff;border-radius:30px;color:var(--rf-muted);font-size:12px}
.refresh-2026 #card-stats .card-content{background:#fff!important;color:var(--rf-muted)!important;padding:24px;min-height:145px;border-radius:16px}
.refresh-2026 #card-stats .card-stats-title{font-size:13px;font-weight:500}
.refresh-2026 #card-stats .card-stats-number{font-size:42px;font-weight:650;line-height:1.2;color:var(--rf-ink)!important;margin-top:14px}
.refresh-2026 #card-stats .card-action{height:4px;min-height:4px;padding:0;border:0;background:#64748b!important;border-radius:0 0 16px 16px}
.refresh-2026 #card-stats .col:nth-child(2) .card-action{background:#2f7d62!important}
.refresh-2026 #card-stats .col:nth-child(3) .card-action{background:#c28028!important}
.refresh-2026 #card-stats .col:nth-child(4) .card-action{background:var(--rf-accent)!important}
.refresh-2026 .btn,.refresh-2026 .btn-large,.refresh-2026 .btn-small,.refresh-2026 .btn-floating{background:var(--rf-accent);border-radius:10px;box-shadow:none;text-transform:none;letter-spacing:0;font-weight:600}
.refresh-2026 .btn,.refresh-2026 .btn-large,.refresh-2026 .btn-small{height:auto;min-height:42px;line-height:42px}
.refresh-2026 .btn:hover,.refresh-2026 .btn-large:hover,.refresh-2026 .btn-floating:hover{box-shadow:0 4px 10px #20252d18;filter:brightness(.96)}
.refresh-2026 .btn:disabled,.refresh-2026 .btn.disabled{background:#eceef2!important;color:#9299a4!important;box-shadow:none;filter:none}
.refresh-2026 .btn-action{background:#f3f4f6!important;width:34px;height:34px;border-radius:9px;margin-inline-end:4px}
.refresh-2026 .btn-action i{color:#616b79;font-size:18px;line-height:34px}
.refresh-2026 .btn-action.red{background:var(--rf-soft)!important}
.refresh-2026 .btn-action.red i{color:var(--rf-accent)}
.refresh-2026 input:not([type]),.refresh-2026 input[type=text]:not(.browser-default),.refresh-2026 input[type=email]:not(.browser-default),.refresh-2026 input[type=password]:not(.browser-default),.refresh-2026 input[type=number]:not(.browser-default),.refresh-2026 textarea.materialize-textarea{border-bottom-color:#d3d8e0;color:var(--rf-ink);font-family:inherit}
.refresh-2026 input:not([type]):focus:not([readonly]),.refresh-2026 input[type=text]:focus:not([readonly]),.refresh-2026 input[type=email]:focus:not([readonly]),.refresh-2026 input[type=password]:focus:not([readonly]),.refresh-2026 input[type=number]:focus:not([readonly]),.refresh-2026 textarea.materialize-textarea:focus:not([readonly]){border-bottom-color:var(--rf-accent);box-shadow:0 1px 0 var(--rf-accent)}
.refresh-2026 .input-field .prefix.active,.refresh-2026 .input-field input:focus+label{color:var(--rf-accent)!important}
.refresh-2026 .dropdown-content{border:1px solid var(--rf-line);border-radius:12px;box-shadow:0 12px 36px #20252d15}
.refresh-2026 .dropdown-content li>a,.refresh-2026 .dropdown-content li>span{color:var(--rf-ink);font-size:14px}
.refresh-2026 table.dataTable thead th{background:#f7f8fa;color:var(--rf-muted);font-size:12px;font-weight:600;border-bottom:1px solid var(--rf-line);padding:16px 12px}
.refresh-2026 table.dataTable tbody td{padding:15px 12px;border-bottom:1px solid #eff1f4;color:#404955}
.refresh-2026 table.dataTable tbody tr{background:#fff}
.refresh-2026 table.dataTable tbody tr:hover{background:#fafbfc}
.refresh-2026 .dataTables_wrapper .dataTables_filter input{height:36px;margin-bottom:14px}
.refresh-2026 .dataTables_wrapper .dataTables_paginate .paginate_button.current{background:var(--rf-soft)!important;color:var(--rf-accent)!important;border:1px solid #f0d8db!important;border-radius:8px}
.refresh-2026 .switch label input[type=checkbox]:checked+.lever{background:#e9b8bd}
.refresh-2026 .switch label input[type=checkbox]:checked+.lever:after{background:var(--rf-accent)}
.refresh-2026 .tabs .tab a,.refresh-2026 .tabs .tab a.active{color:var(--rf-accent)}
.refresh-2026 .tabs .indicator{background:var(--rf-accent)}
.refresh-2026 .modal{background:#fff;border-radius:18px;box-shadow:0 24px 80px #20252d25}
.refresh-2026 .modal .modal-footer{background:#fff;border-top:1px solid var(--rf-line)}
.refresh-2026 .page-footer{background:transparent!important;color:var(--rf-muted);box-shadow:none;border-top:1px solid var(--rf-line);font-size:11px}
.refresh-2026 .page-footer .footer-copyright{background:transparent;color:var(--rf-muted)}
.refresh-2026 .page-footer a{color:var(--rf-muted)!important}
.refresh-2026 #loader{border-top-color:var(--rf-accent)}
.refresh-2026 #loader-wrapper .loader-section{background:var(--rf-bg)}
.refresh-2026 #service-btn-container{max-width:1050px;margin:48px auto;padding:36px;background:#fff!important;border:1px solid var(--rf-line);text-align:center}
.refresh-2026 #service-btn-container .card-title{display:block;font-size:28px!important;line-height:1.4!important;margin-bottom:28px;letter-spacing:-.5px}
.refresh-2026 #service-btn-container .divider{margin-bottom:28px!important}
.refresh-2026 #service-btn-container .btn-queue{display:inline-flex;align-items:center;justify-content:center;vertical-align:top;background:#fff!important;color:var(--rf-ink);border:1px solid #dee2e9;min-height:112px;line-height:1.4;white-space:normal;width:calc(50% - 18px);margin:8px;padding:24px;font-size:20px;border-radius:14px}
.refresh-2026 #service-btn-container .btn-queue:hover{border-color:var(--rf-accent);color:var(--rf-accent);background:var(--rf-soft)!important;filter:none}
.refresh-2026 #modal1.modal-fixed-footer{height:400px;max-height:80vh!important;max-width:760px}
.refresh-2026 #call-page .container,.refresh-2026 #call-page #card-reveal .card{background:#fff!important}
.refresh-2026 #call-page .row{min-width:0!important}
.refresh-2026 #call-page .truncate{font-size:clamp(52px,8vw,115px)!important;font-weight:650;letter-spacing:-.05em}
.refresh-2026 #call-page .call-bt{min-width:0!important;width:100%;white-space:normal;line-height:1.4;padding:14px 12px;min-height:50px}
.refresh-2026 #call-page .call-bt i{display:none}
.refresh-2026 #display-page .card-panel{box-shadow:none;border-radius:20px}
.refresh-2026 #display-page #callarea>.m8>.card-panel{border-top:4px solid var(--rf-accent)}
.refresh-2026 #display-page #callarea>.m8>.card-panel>div>span{color:var(--rf-accent)!important;letter-spacing:-.045em;font-variant-numeric:tabular-nums}
.refresh-2026 #display-page #side-token-display{overflow:hidden}
.refresh-2026 #display-page #side-token-display>div{border-color:var(--rf-line)!important}
.refresh-2026 #display-page marquee{padding:12px;background:#fff;border:1px solid var(--rf-line);border-radius:12px}
.refresh-2026 #login-page{min-height:100vh;height:auto;padding:36px 0}
.refresh-2026 #login-page .login-card{width:440px;max-width:100%;padding:32px 28px;background:#fff;border-radius:22px;box-shadow:0 20px 70px #2932410a}
.refresh-2026 #login-page .offset-m4{margin-left:0;text-align:center}
.refresh-2026 #login-page h5{margin:12px 0 28px!important;font-size:30px}
.refresh-2026 #login-page .prefix{color:#9299a4}
.refresh-2026 :is(a,button,input,select,textarea,[tabindex]):focus-visible{outline:3px solid #bc354066;outline-offset:3px}
@media(max-width:992px){
 .refresh-2026 #main{padding:18px 12px!important}
 .refresh-2026 .navbar-main .navbar-list b{display:inline-block;max-width:180px;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;vertical-align:middle}
 .refresh-2026 .sidenav-main .sidenav{border-inline-end:0}
}
@media(max-width:600px){
 .refresh-heading{margin:6px 12px 16px}.refresh-heading h1{font-size:25px}
 .refresh-2026 .navbar-main .navbar-list b{max-width:105px;font-size:11px}
 .refresh-2026 .navbar-main .navbar-list>li>span{font-size:16px!important}
 .refresh-2026 .navbar-main .navbar-list>li>a{padding:0 9px}
 .refresh-2026 .card .card-content{padding:18px}
 .refresh-2026 #card-stats .card-content{min-height:110px;padding:18px}
 .refresh-2026 #service-btn-container{margin:12px auto;padding:22px 14px}
 .refresh-2026 #service-btn-container .card-title{font-size:22px!important}
 .refresh-2026 #service-btn-container .btn-queue{width:100%;margin:6px 0;min-height:88px;font-size:18px}
 .refresh-2026 #modal1 .input-field{width:100%}
 .refresh-2026 #call-page .card-content>.col{padding:0}
 .refresh-2026 #call-page .card-content>.col>.row{margin-top:20px!important}
 .refresh-2026 #display-page #callarea{display:flex!important;flex-direction:column-reverse!important}
 .refresh-2026 #display-page #callarea>.col{width:100%}
 .refresh-2026 #display-page #callarea>.m8 .card-panel{height:auto!important;min-height:380px;padding:24px 12px}
 .refresh-2026 #display-page #callarea>.m8 .card-panel>div>.bolder-color{font-size:24px!important}
 .refresh-2026 #display-page #callarea>.m8 .card-panel>div>span{font-size:80px!important}
 .refresh-2026 #display-page #callarea>.m8 .card-panel>div>div{font-size:30px!important}
 .refresh-2026 #display-page #side-token-display{height:auto!important;display:grid;grid-template-columns:1fr 1fr}
 .refresh-2026 #display-page #side-token-display>div{height:auto!important;min-height:145px;padding:12px}
 .refresh-2026 #display-page #side-token-display span{font-size:32px!important}
 .refresh-2026 #display-page #side-token-display small{font-size:18px!important}
 .refresh-2026 .page-footer .container{display:flex;flex-wrap:wrap;gap:8px;justify-content:space-between}
}
@media(prefers-reduced-motion:reduce){.refresh-2026 .btn,.refresh-2026 .btn-large,.refresh-2026 .card{transition:none}}
/* Existing call actions retain their Vue handlers and disabled conditions. */
.refresh-2026 #call-page button.call-bt:not(#next_call){background:#f2f4f7;color:#424c59;border:1px solid #e1e5eb}
.refresh-2026 #call-page #next_call{background:var(--rf-accent);color:#fff}
