:root{--bg:#f6f7fa;--panel:#fff;--ink:#343a4d;--muted:#747b8f;--line:#e4e6eb;--brand:#4F5774;--brand2:#3f465f;--accent:#F1B44C;--success:#0DA34E;--shadow:0 10px 30px rgba(79,87,116,.10)}
*{box-sizing:border-box}html,body{margin:0;font-family:Inter,ui-sans-serif,system-ui,-apple-system,Segoe UI,sans-serif;color:var(--ink);background:var(--bg)}a{text-decoration:none;color:inherit}
.app-shell{min-height:100vh;display:grid;grid-template-columns:250px 1fr}.sidebar{background:#101a33;color:#fff;padding:28px 18px;position:sticky;top:0;height:100vh}.logo{display:flex;align-items:center;gap:12px;padding:0 10px 28px;font-size:19px;letter-spacing:.4px}.logo span,.brand-mark{display:grid;place-items:center;width:40px;height:40px;border-radius:12px;background:linear-gradient(135deg,#4c7cff,#2457e6);color:white;font-weight:800}.sidebar nav{display:grid;gap:5px}.sidebar nav>a{padding:11px 12px;border-radius:10px;color:#c8d0e1}.sidebar nav>a:hover{background:#1b294b;color:#fff}.nav-group{font-size:11px;text-transform:uppercase;letter-spacing:1.2px;color:#7988aa;padding:22px 12px 5px}.main-shell{min-width:0}.topbar{height:74px;background:#fff;border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;padding:0 34px;position:sticky;top:0;z-index:10}.user-chip{display:flex;align-items:center;gap:10px;font-size:14px}.user-chip a{color:var(--brand);font-weight:650}.avatar{display:grid;place-items:center;width:34px;height:34px;border-radius:50%;background:#e9efff;color:var(--brand);font-weight:800}.content{padding:34px}.page-heading{display:flex;justify-content:space-between;align-items:end;margin-bottom:24px}.page-heading h1{margin:5px 0 4px;font-size:30px}.eyebrow{font-size:11px;font-weight:800;letter-spacing:1.3px;color:var(--brand)}.muted{color:var(--muted)}.metric-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:18px}.metric-card,.panel{background:var(--panel);border:1px solid var(--line);border-radius:16px;box-shadow:var(--shadow)}.metric-card{padding:22px;display:grid;gap:8px;transition:.18s}.metric-card:hover{transform:translateY(-2px);border-color:#cfd8ec}.metric-card span{font-size:13px;color:var(--muted)}.metric-card strong{font-size:22px}.metric-card small{color:var(--muted)}.panel{padding:24px}.btn-primary,.btn-secondary{border:0;border-radius:10px;padding:12px 16px;font-weight:750;cursor:pointer}.btn-primary{background:var(--brand);color:#fff}.btn-primary:hover{background:var(--brand2)}.btn-secondary{background:#eef2fb;color:#234}.auth-body{background:#edf1f8;min-height:100vh}.auth-shell{min-height:100vh;display:grid;grid-template-columns:1.05fr .95fr}.auth-brand{background:linear-gradient(145deg,#101a33,#173ca6);color:white;padding:64px;display:flex;align-items:flex-end}.auth-brand h1{font-size:60px;margin:8px 0}.auth-brand p{font-size:19px;color:#d4dcf2;max-width:520px}.auth-panel{display:grid;place-items:center;padding:28px}.auth-card{width:min(430px,100%);background:#fff;padding:36px;border-radius:20px;box-shadow:var(--shadow);display:grid;gap:10px}.auth-card h2{font-size:28px;margin:10px 0 0}.auth-card label{font-size:13px;font-weight:700;margin-top:10px}.auth-card input{width:100%;height:46px;border:1px solid #d9dfeb;border-radius:10px;padding:0 13px;font-size:15px;outline:none}.auth-card input:focus{border-color:#86a2f5;box-shadow:0 0 0 3px #e7edff}.auth-card button{margin-top:12px;height:47px}.validation{color:#b42318;font-size:13px}
@media(max-width:1000px){.app-shell{grid-template-columns:78px 1fr}.sidebar{padding:24px 10px}.logo strong,.sidebar nav>a,.nav-group{font-size:0}.logo{padding-left:8px}.metric-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:760px){.auth-shell{grid-template-columns:1fr}.auth-brand{display:none}.app-shell{display:block}.sidebar{display:none}.content{padding:20px}.metric-grid{grid-template-columns:1fr}.topbar{padding:0 18px}}


.table-wrap{overflow:auto}
.data-table{width:100%;border-collapse:collapse}
.data-table th,.data-table td{padding:14px 12px;border-bottom:1px solid var(--line);text-align:left;white-space:nowrap}
.data-table th{font-size:12px;text-transform:uppercase;letter-spacing:.5px;color:var(--muted)}
.actions{display:flex;gap:12px;justify-content:flex-end}
.inline{display:inline}
.btn-link{border:0;background:none;color:var(--brand);font-weight:700;cursor:pointer;padding:0}
.btn-link.danger{color:#b42318}
.badge{font-size:12px;font-weight:800;padding:5px 9px;border-radius:999px}
.badge.ok{background:#eaf8ef;color:#15713d}
.badge.off{background:#f2f3f5;color:#687385}
.alert{padding:13px 16px;border-radius:10px;margin-bottom:18px;font-weight:650}
.alert.success{background:#eaf8ef;color:#15713d}
.alert.error{background:#fff0ee;color:#b42318}
.form-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px}
.form-grid .full{grid-column:1/-1}
.field{display:grid;gap:7px}
.field label{font-size:13px;font-weight:750}
.field input,.field select{height:44px;border:1px solid #d9dfeb;border-radius:10px;padding:0 12px;background:white;font:inherit}
.checks{align-content:center;gap:12px}
.checks label{display:flex;align-items:center;gap:8px}
.checks input{width:auto;height:auto}
.form-actions{display:flex;justify-content:flex-end}
.two-panels{display:grid;grid-template-columns:1fr 1fr;gap:20px}
.two-panels h2{margin:0 0 4px}
.top-context{font-size:13px;color:var(--muted)}
@media(max-width:800px){.form-grid,.two-panels{grid-template-columns:1fr}.form-grid .full{grid-column:auto}}


.logo-image{height:58px;display:flex;align-items:center;padding:4px 10px 20px}
.logo-image img{display:block;max-width:162px;max-height:38px;object-fit:contain}
.login-logo{width:162px;max-width:100%;height:auto;margin-bottom:12px}
.sidebar{background:#fff!important;color:var(--brand)!important;border-right:1px solid var(--line)}
.sidebar nav>a{color:#5d6478!important}
.sidebar nav>a:hover{background:#f2f3f7!important;color:var(--brand)!important}
.nav-group{color:#9a7a34!important}
.avatar{background:#fff6e7!important;color:#9a6a13!important}
.btn-primary{background:var(--accent)!important;color:#3b3f50!important}
.btn-primary:hover{filter:brightness(.96)}
.eyebrow{color:#a47825!important}
.badge.ok{background:#eaf8ef!important;color:var(--success)!important}
.search-row{display:flex;gap:10px;margin-bottom:18px}
.search-row input{flex:1;height:44px;border:1px solid #d9dfeb;border-radius:10px;padding:0 13px;font:inherit}
.small{font-size:12px}
.section-title{font-size:16px;margin:8px 0 0;padding-top:8px;border-top:1px solid var(--line)}


.top-gap{margin-top:20px}
.document-upload{display:flex;align-items:center;gap:8px;margin-bottom:8px}
.document-upload input[type=file]{max-width:220px}
.search-row select{height:44px;border:1px solid #d9dfeb;border-radius:10px;padding:0 12px;background:#fff;font:inherit;min-width:280px}
.provider-sections{grid-template-columns:repeat(3,minmax(0,1fr))}
@media(max-width:900px){.provider-sections{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:650px){.provider-sections{grid-template-columns:1fr}}


/* Provider administration context */
.provider-context{
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:12px;
    padding:16px 18px;
    margin:0 0 18px;
    border:1px solid #e4e8f0;
    border-radius:14px;
    background:#fff;
    box-shadow:0 4px 18px rgba(79,87,116,.06);
}
.provider-context>div{display:flex;flex-direction:column;gap:4px;min-width:0}
.provider-context-label{
    font-size:11px;
    font-weight:700;
    letter-spacing:.07em;
    text-transform:uppercase;
    color:#7b839b
}
.provider-context strong{color:#4f5774;overflow-wrap:anywhere}

.current-file-card{
    display:flex;
    align-items:center;
    gap:12px;
    min-height:76px;
    padding:10px;
    margin-bottom:10px;
    border:1px solid #e4e8f0;
    border-radius:12px;
    background:#fafbfe
}
.current-file-card>div{display:flex;flex-direction:column;gap:4px}
.provider-photo-preview{
    width:64px;
    height:64px;
    object-fit:cover;
    border-radius:10px;
    border:1px solid #e1e5ec;
    background:#fff
}
.file-icon{
    width:52px;
    height:52px;
    display:flex!important;
    align-items:center;
    justify-content:center;
    border-radius:10px;
    font-weight:800;
    color:#4f5774;
    background:#f1b44c22
}
.current-document-link{display:inline-block;margin-top:8px}

.saving-overlay{
    position:fixed;
    inset:0;
    z-index:9999;
    display:none;
    align-items:center;
    justify-content:center;
    background:rgba(24,29,43,.42);
    backdrop-filter:blur(2px)
}
.saving-box{
    width:min(92vw,360px);
    display:flex;
    flex-direction:column;
    align-items:center;
    gap:8px;
    padding:26px;
    border-radius:16px;
    background:#fff;
    box-shadow:0 24px 70px rgba(0,0,0,.22);
    text-align:center
}
.saving-spinner{
    width:34px;
    height:34px;
    border:3px solid #e5e8ef;
    border-top-color:#f1b44c;
    border-radius:50%;
    animation:paguepj-spin .8s linear infinite
}
@keyframes paguepj-spin{to{transform:rotate(360deg)}}

.autocomplete-field{position:relative}
.autocomplete-results{
    position:absolute;
    left:0;
    right:0;
    top:70px;
    z-index:40;
    max-height:310px;
    overflow:auto;
    border:1px solid #dfe4ed;
    border-radius:12px;
    background:#fff;
    box-shadow:0 14px 34px rgba(35,42,64,.16)
}
.autocomplete-item{
    width:100%;
    display:flex;
    flex-direction:column;
    gap:3px;
    padding:11px 14px;
    border:0;
    border-bottom:1px solid #eef1f6;
    background:#fff;
    text-align:left;
    cursor:pointer
}
.autocomplete-item:hover{background:#f8f9fc}
.autocomplete-item small{color:#7b839b}
.autocomplete-empty{padding:14px;color:#7b839b}

.benefit-grid{
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:12px
}
.benefit-card{
    padding:14px;
    border:1px solid #e4e8f0;
    border-radius:12px;
    background:#fafbfe
}
.panel-title-row{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:16px;
    padding:4px 0 16px
}
.panel-title-row h2{margin:0}
.panel-title-row p{margin:4px 0 0}

@media(max-width:900px){
    .provider-context,
    .benefit-grid{grid-template-columns:1fr}
}


/* Refinements: provider grids, documents, benefits and destructive actions */
.required-mark{color:#b42318;font-weight:800}

.grid-actions{
    display:flex;
    align-items:center;
    justify-content:flex-end;
    gap:7px;
    min-width:235px
}
.action-button{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    min-height:34px;
    padding:7px 10px;
    border:1px solid #dfe4ec;
    border-radius:9px;
    background:#fff;
    color:var(--brand);
    font-size:12px;
    font-weight:750;
    line-height:1;
    cursor:pointer
}
.action-button:hover{background:#f7f8fb;border-color:#cfd5e1}
.action-button.danger{color:#b42318;border-color:#f0d1cd;background:#fffafa}
.action-button.danger:hover{background:#fff0ee}

.actions-column{text-align:right!important}

.document-actions-stack{
    display:flex;
    flex-direction:column;
    align-items:stretch;
    gap:9px;
    min-width:300px
}
.document-upload-card{
    display:grid;
    grid-template-columns:minmax(150px,1fr) auto;
    gap:8px;
    align-items:center;
    padding:8px;
    border:1px solid #e2e6ee;
    border-radius:11px;
    background:#fafbfc
}
.compact-file-picker{
    position:relative;
    display:flex;
    align-items:center;
    min-width:0;
    height:36px;
    padding:0 10px;
    border:1px dashed #cbd2df;
    border-radius:8px;
    background:#fff;
    color:#626b80;
    font-size:12px;
    font-weight:650;
    overflow:hidden;
    cursor:pointer
}
.compact-file-picker input{
    position:absolute;
    inset:0;
    width:100%;
    height:100%;
    opacity:0;
    cursor:pointer
}
.btn-upload,.btn-approve,.btn-reject,.btn-danger-soft{
    border:0;
    border-radius:8px;
    padding:8px 11px;
    font-size:12px;
    font-weight:800;
    cursor:pointer;
    white-space:nowrap
}
.btn-upload{background:#eef1f7;color:var(--brand)}
.btn-upload:hover{background:#e4e8f0}
.approval-actions{display:flex;align-items:center;gap:7px}
.btn-approve{background:#eaf8ef;color:#0b7b3e}
.btn-approve:hover{background:#daf2e3}
.btn-reject,.btn-danger-soft{background:#fff0ee;color:#b42318}
.btn-reject:hover,.btn-danger-soft:hover{background:#ffe5e1}

.file-drop-card{
    display:flex;
    align-items:center;
    gap:14px;
    padding:14px;
    border:1px dashed #c9d0dc;
    border-radius:12px;
    background:#fafbfc
}
.file-drop-card input[type=file]{
    height:auto;
    max-width:320px;
    border:0;
    padding:0;
    background:transparent
}
.file-drop-copy{display:flex;flex-direction:column;gap:3px}
.file-drop-copy small{color:var(--muted)}

.attachment-list{
    display:flex;
    flex-direction:column;
    align-items:flex-start;
    gap:6px;
    max-width:360px
}
.attachment-chip{
    display:inline-flex;
    align-items:center;
    gap:6px;
    max-width:100%;
    padding:5px 7px 5px 10px;
    border:1px solid #dfe4ec;
    border-radius:999px;
    background:#f8f9fc
}
.attachment-chip>a{
    display:block;
    max-width:275px;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
    color:var(--brand);
    font-size:12px;
    font-weight:700
}
.icon-delete{
    width:22px;
    height:22px;
    display:grid;
    place-items:center;
    border:0;
    border-radius:50%;
    background:#fff0ee;
    color:#b42318;
    font-size:16px;
    line-height:1;
    cursor:pointer
}

.benefits-panel{
    padding:3px 0 4px
}
.benefits-list{
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:10px
}
.benefit-row{
    display:grid;
    grid-template-columns:minmax(0,1fr) 160px;
    align-items:center;
    gap:14px;
    min-height:74px;
    padding:13px 14px;
    border:1px solid #e1e5ed;
    border-radius:13px;
    background:#fff;
    transition:border-color .15s ease,box-shadow .15s ease,background .15s ease
}
.benefit-row:has(.benefit-checkbox:checked){
    border-color:#e0b968;
    background:#fffcf5;
    box-shadow:0 0 0 2px rgba(241,180,76,.10)
}
.benefit-toggle{
    display:flex;
    align-items:center;
    gap:10px;
    min-width:0;
    cursor:pointer
}
.benefit-checkbox{
    position:absolute;
    width:1px!important;
    height:1px!important;
    opacity:0
}
.benefit-checkmark{
    flex:0 0 22px;
    width:22px;
    height:22px;
    display:grid;
    place-items:center;
    border:2px solid #c8cfdb;
    border-radius:7px;
    background:#fff
}
.benefit-checkbox:checked + .benefit-checkmark{
    border-color:var(--accent);
    background:var(--accent)
}
.benefit-checkbox:checked + .benefit-checkmark::after{
    content:"✓";
    color:#3b3f50;
    font-size:14px;
    font-weight:900
}
.benefit-name{
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
    color:#40475d;
    font-weight:750
}
.benefit-value{display:flex;flex-direction:column;gap:5px}
.benefit-value>span{
    color:var(--muted);
    font-size:10px;
    font-weight:750;
    text-transform:uppercase;
    letter-spacing:.04em
}
.money-field{
    display:grid;
    grid-template-columns:34px 1fr;
    height:38px;
    overflow:hidden;
    border:1px solid #d9dfeb;
    border-radius:9px;
    background:#fff
}
.money-field>span{
    display:grid;
    place-items:center;
    background:#f3f5f8;
    color:#747b8f;
    font-size:12px;
    font-weight:700
}
.money-field input{
    width:100%;
    height:100%;
    border:0!important;
    border-radius:0!important;
    padding:0 9px!important;
    outline:none
}
.empty-state.compact{
    padding:18px;
    border:1px dashed #d6dbe5;
    border-radius:11px;
    background:#fafbfc;
    color:var(--muted);
    text-align:center
}

/* Global confirmation modal: standard for every delete action */
.modal-open{overflow:hidden}
.confirm-modal[hidden]{display:none!important}
.confirm-modal{
    position:fixed;
    inset:0;
    z-index:11000;
    display:grid;
    place-items:center;
    padding:20px
}
.confirm-modal-backdrop{
    position:absolute;
    inset:0;
    background:rgba(27,32,47,.48);
    backdrop-filter:blur(2px)
}
.confirm-modal-card{
    position:relative;
    z-index:1;
    width:min(430px,100%);
    display:grid;
    grid-template-columns:44px minmax(0,1fr);
    gap:14px;
    padding:22px;
    border-radius:16px;
    background:#fff;
    box-shadow:0 28px 80px rgba(20,24,36,.28)
}
.confirm-modal-icon{
    width:42px;
    height:42px;
    display:grid;
    place-items:center;
    border-radius:12px;
    background:#fff0ee;
    color:#b42318;
    font-size:20px;
    font-weight:900
}
.confirm-modal-copy h2{
    margin:0 0 6px;
    color:#343a4d;
    font-size:18px
}
.confirm-modal-copy p{
    margin:0;
    color:var(--muted);
    line-height:1.45
}
.confirm-modal-actions{
    grid-column:1/-1;
    display:flex;
    justify-content:flex-end;
    gap:9px;
    padding-top:7px
}
.btn-confirm-delete{
    border:0;
    border-radius:10px;
    padding:12px 16px;
    background:#b42318;
    color:#fff;
    font-weight:800;
    cursor:pointer
}
.btn-confirm-delete:hover{background:#971c12}

@media(max-width:900px){
    .benefits-list{grid-template-columns:1fr}
    .document-actions-stack{min-width:250px}
}
@media(max-width:620px){
    .benefit-row{grid-template-columns:1fr}
    .document-upload-card{grid-template-columns:1fr}
    .grid-actions{justify-content:flex-start;min-width:0;flex-wrap:wrap}
}


/* Reports */
.report-filters{
    display:grid;
    grid-template-columns:repeat(5,minmax(150px,1fr));
    gap:12px;
    align-items:end;
    margin-bottom:14px
}
.report-filter-actions{
    display:flex;
    align-items:center;
    gap:8px;
    min-height:42px
}
.report-summary{
    display:flex;
    align-items:center;
    gap:6px;
    margin:10px 2px 12px;
    color:var(--muted);
    font-size:13px
}
.report-summary strong{
    color:var(--brand);
    font-size:15px
}
.report-kpis{
    display:grid;
    grid-template-columns:repeat(2,minmax(180px,260px));
    gap:12px;
    margin-bottom:14px
}
.report-kpi{
    display:flex;
    flex-direction:column;
    gap:3px;
    padding:14px 16px;
    border:1px solid #e2e6ee;
    border-radius:12px;
    background:#fff
}
.report-kpi span{
    color:var(--muted);
    font-size:11px;
    font-weight:750;
    text-transform:uppercase;
    letter-spacing:.04em
}
.report-kpi strong{
    color:var(--brand);
    font-size:21px
}
.btn-excel{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    min-height:40px;
    padding:9px 14px;
    border:1px solid #b9dfc7;
    border-radius:10px;
    background:#edf9f1;
    color:#0b7b3e;
    font-size:13px;
    font-weight:800
}
.btn-excel:hover{background:#e0f5e8}
.table-subtitle{
    display:block;
    margin-top:3px;
    color:var(--muted);
    font-size:11px;
    font-weight:500
}
.text-right{text-align:right!important}

@media(max-width:1100px){
    .report-filters{grid-template-columns:repeat(3,minmax(150px,1fr))}
}
@media(max-width:700px){
    .report-filters{grid-template-columns:1fr}
    .report-kpis{grid-template-columns:1fr}
}


/* Administrative pages */
.admin-form-card{
    margin-bottom:16px
}

.grid-actions.compact{
    min-width:0;
    justify-content:flex-end;
    flex-wrap:wrap
}

.switch-row{
    display:inline-flex;
    align-items:center;
    gap:9px;
    min-height:40px;
    cursor:pointer
}

.switch-row input[type=checkbox]{
    width:18px;
    height:18px;
    margin:0
}

.company-logo-current{
    display:flex;
    flex-direction:column;
    align-items:flex-start;
    gap:8px
}

.company-logo-current img{
    max-width:220px;
    max-height:90px;
    object-fit:contain;
    padding:10px;
    border:1px solid #e1e5ed;
    border-radius:12px;
    background:#fff
}

.communication-text{
    max-width:620px;
    white-space:pre-wrap;
    line-height:1.45
}


/* Navigation 2026 */
.app-shell{
    grid-template-columns:280px minmax(0,1fr)
}

.sidebar{
    width:280px;
    padding:0;
    display:flex;
    flex-direction:column;
    background:#fff!important;
    border-right:1px solid #e4e6eb;
    box-shadow:8px 0 28px rgba(79,87,116,.04);
    z-index:80;
    overflow:hidden
}

.sidebar-head{
    min-height:78px;
    display:flex;
    align-items:center;
    justify-content:space-between;
    padding:12px 18px;
    border-bottom:1px solid #eef0f4
}

.sidebar .logo-image{
    height:auto;
    margin:0;
    padding:0;
    min-width:0
}

.sidebar .logo-image img{
    max-width:170px;
    max-height:44px
}

.sidebar-close{
    display:none;
    width:38px;
    height:38px;
    border:0;
    border-radius:10px;
    background:#f5f6f9;
    color:var(--brand);
    font-size:25px;
    line-height:1;
    cursor:pointer
}

.sidebar-profile{
    display:flex;
    align-items:center;
    gap:10px;
    margin:14px 14px 4px;
    padding:12px;
    border:1px solid #ebeef3;
    border-radius:13px;
    background:#fafbfc
}

.sidebar-profile-avatar{
    flex:0 0 38px;
    width:38px;
    height:38px;
    display:grid;
    place-items:center;
    border-radius:11px;
    background:#fff3dc;
    color:#8a621d;
    font-size:14px;
    font-weight:850
}

.sidebar-profile>div{
    min-width:0;
    display:flex;
    flex-direction:column;
    gap:2px
}

.sidebar-profile strong{
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
    color:#40475d;
    font-size:13px
}

.sidebar-profile span:not(.sidebar-profile-avatar){
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
    color:#81889a;
    font-size:11px
}

.main-navigation{
    flex:1;
    min-height:0;
    overflow-y:auto;
    display:block!important;
    padding:10px 12px 18px;
    scrollbar-width:thin;
    scrollbar-color:#d9dde5 transparent
}

.main-navigation>.nav-item,
.nav-section-items .nav-item{
    min-height:42px;
    display:flex;
    align-items:center;
    gap:10px;
    padding:9px 11px;
    margin:2px 0;
    border-radius:10px;
    color:#5f6679!important;
    font-size:13px!important;
    font-weight:650;
    transition:background .15s ease,color .15s ease,transform .15s ease
}

.main-navigation .nav-item:hover{
    background:#f5f6f9!important;
    color:var(--brand)!important
}

.main-navigation .nav-item.active{
    background:#fff6e7!important;
    color:#70521c!important;
    font-weight:800
}

.nav-item-mark{
    width:20px;
    text-align:center;
    color:#8b93a6;
    font-size:18px
}

.nav-item-dot{
    width:6px;
    height:6px;
    flex:0 0 6px;
    border-radius:50%;
    background:#c6cad3
}

.nav-item.active .nav-item-dot{
    background:var(--accent)
}

.nav-section{
    margin-top:7px;
    border-radius:12px
}

.nav-section-toggle{
    width:100%;
    min-height:39px;
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:10px;
    padding:8px 11px;
    border:0;
    border-radius:10px;
    background:transparent;
    color:#8a6a2e;
    font:inherit;
    font-size:11px;
    font-weight:850;
    letter-spacing:.07em;
    text-transform:uppercase;
    cursor:pointer
}

.nav-section-toggle:hover{
    background:#faf8f3
}

.nav-chevron{
    font-size:16px;
    line-height:1;
    transition:transform .18s ease
}

.nav-section-items{
    display:none;
    padding:1px 0 4px 7px
}

.nav-section.active .nav-section-items,
.nav-section.expanded .nav-section-items{
    display:block
}

.nav-section.active .nav-section-toggle .nav-chevron,
.nav-section.expanded .nav-section-toggle .nav-chevron{
    transform:rotate(180deg)
}

.sidebar-footer{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:8px;
    padding:13px 16px 16px;
    border-top:1px solid #eef0f4;
    background:#fff
}

.sidebar-footer a{
    color:#687085;
    font-size:12px;
    font-weight:750
}

.sidebar-footer a:hover{
    color:var(--brand)
}

.sidebar-backdrop{
    display:none;
    position:fixed;
    inset:0;
    z-index:70;
    border:0;
    background:rgba(23,28,43,.42);
    backdrop-filter:blur(2px)
}

.topbar{
    height:70px;
    padding:0 28px
}

.topbar-left{
    display:flex;
    align-items:center;
    gap:12px
}

.mobile-menu-button{
    display:none;
    width:42px;
    height:42px;
    padding:10px;
    border:1px solid #e0e4eb;
    border-radius:11px;
    background:#fff;
    cursor:pointer
}

.mobile-menu-button span{
    display:block;
    height:2px;
    margin:4px 0;
    border-radius:999px;
    background:var(--brand)
}

.user-chip-copy{
    display:flex;
    flex-direction:column;
    gap:1px;
    min-width:0
}

.user-chip-copy>a{
    max-width:220px;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap
}

.user-chip-copy small{
    color:#8a91a2;
    font-size:10px
}

.logout-link{
    margin-left:8px
}

.form-summary-error:empty,
.form-summary-error.validation-summary-valid{
    display:none
}

.form-summary-error.validation-summary-errors{
    display:block
}

.form-summary-error ul{
    margin:0;
    padding-left:18px
}

@media(max-width:1100px){
    .app-shell{
        display:block;
        grid-template-columns:none
    }

    .sidebar{
        position:fixed;
        top:0;
        bottom:0;
        left:0;
        width:min(86vw,300px);
        height:100dvh;
        padding:0;
        transform:translateX(-102%);
        transition:transform .22s ease;
        box-shadow:20px 0 60px rgba(31,37,55,.18)
    }

    body.menu-open{
        overflow:hidden
    }

    body.menu-open .sidebar{
        transform:translateX(0)
    }

    body.menu-open .sidebar-backdrop{
        display:block
    }

    .sidebar-close,
    .mobile-menu-button{
        display:block
    }

    .sidebar .logo strong,
    .sidebar nav>a,
    .sidebar .nav-group{
        font-size:inherit
    }

    .main-navigation>.nav-item,
    .nav-section-items .nav-item{
        font-size:13px!important
    }

    .topbar{
        padding:0 18px
    }

    .top-context{
        display:none
    }
}

@media(max-width:620px){
    .topbar{
        height:64px;
        padding:0 12px
    }

    .content{
        padding:18px 14px
    }

    .user-chip{
        gap:7px
    }

    .user-chip-copy small,
    .logout-link{
        display:none
    }

    .user-chip-copy>a{
        max-width:135px;
        font-size:12px
    }

    .avatar{
        width:32px;
        height:32px
    }

    .page-heading{
        align-items:flex-start;
        gap:14px
    }

    .page-heading h1{
        font-size:25px
    }
}


/* Company dashboard */
.dashboard-metrics{
    margin-bottom:20px
}

.dashboard-grid{
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:18px
}

.dashboard-card{
    min-width:0;
    padding:20px
}

.dashboard-count{
    display:grid;
    place-items:center;
    min-width:34px;
    height:34px;
    padding:0 9px;
    border-radius:999px;
    background:#fff5e2;
    color:#8a621d;
    font-size:12px;
    font-weight:850
}

.dashboard-list{
    display:flex;
    flex-direction:column;
    max-height:430px;
    overflow:auto
}

.dashboard-list-item{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:12px;
    min-height:58px;
    padding:10px 4px;
    border-top:1px solid #eef0f4
}

.dashboard-list-item:first-child{
    border-top:0
}

.dashboard-list-item>div{
    min-width:0;
    display:flex;
    flex-direction:column;
    gap:3px
}

.dashboard-list-item strong{
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
    color:#41485d;
    font-size:13px
}

.dashboard-list-item span:not(.dashboard-arrow){
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
    color:var(--muted);
    font-size:11px
}

.dashboard-list-item:hover strong{
    color:#9a6a13
}

.dashboard-arrow{
    flex:0 0 auto;
    color:#a0a6b4;
    font-size:22px
}

@media(max-width:900px){
    .dashboard-grid{
        grid-template-columns:1fr
    }
}

@media(max-width:620px){
    .dashboard-metrics{
        grid-template-columns:repeat(2,minmax(0,1fr))
    }

    .dashboard-metrics .metric-card{
        padding:16px
    }

    .dashboard-metrics .metric-card strong{
        font-size:20px
    }

    .dashboard-card{
        padding:16px
    }
}


/* Commercial / account refinements */
.badge.info{
    background:#eef4ff;
    color:#2457a6
}

.status-button{
    border:0;
    cursor:pointer
}

.field textarea{
    width:100%;
    min-height:110px;
    resize:vertical;
    border:1px solid #d9dfeb;
    border-radius:10px;
    padding:11px 12px;
    background:#fff;
    color:var(--ink);
    font:inherit
}

.field textarea:focus{
    outline:none;
    border-color:#d5a13f;
    box-shadow:0 0 0 3px rgba(241,180,76,.12)
}

.account-photo-block{
    padding-bottom:8px
}

.account-photo-row{
    display:flex;
    align-items:center;
    gap:16px;
    padding:13px;
    border:1px solid #e4e8f0;
    border-radius:13px;
    background:#fafbfc
}

.account-photo-preview{
    flex:0 0 88px;
    width:88px;
    height:88px;
    object-fit:cover;
    border:1px solid #dde2ea;
    border-radius:16px;
    background:#fff
}

.account-photo-input{
    min-width:0;
    display:flex;
    flex-direction:column;
    gap:6px
}

.account-photo-input input[type=file]{
    width:100%;
    height:auto;
    padding:9px;
    border:1px dashed #ccd3de;
    background:#fff
}

@media(max-width:620px){
    .account-photo-row{
        align-items:flex-start;
        flex-direction:column
    }
}

.account-photo-placeholder{
    display:grid;
    place-items:center;
    background:#fff5e2;
    color:#8a621d;
    font-size:28px;
    font-weight:850
}