/* Shared header, navigation and tokens come directly from index.css. */
.accounting-page { font-family: 'Inter', Arial, sans-serif; color: var(--ink); background: var(--page); }
.accounting-page > :is(.top-nav, .workspace-nav) { flex-shrink: 0; }
.accounting-page > .flex-1 { min-height: 0; }
.accounting-page .bottom-panel { padding-bottom: 48px; }
.accounting-page .auth-user-pill { display: flex; }
.accounting-page .btn-logout-pill { display: inline-flex; align-items: center; }
#accountingUserName { font-size: 13px; font-weight: 600; max-width: 290px; overflow-wrap: anywhere; }
#accountingUserRole { font-size: 11px; color: var(--muted); text-transform: capitalize; }

.pc-ui { font-size: 13px; line-height: 1.5; color: var(--ink); }
.pc-heading { gap: 16px; }
.pc-page-title { font-size: 25px; letter-spacing: -.7px; font-weight: 700; margin-top: 5px; color: var(--ink); }
.pc-heading p { font-size: 12px; color: var(--muted); margin-top: 6px; }
.pc-actions { flex-wrap: wrap; }
.pc-surface { background: var(--surface); border: 1px solid var(--card-line); border-radius: var(--card-radius); box-shadow: var(--card-shadow); }
.pc-employee-tabs { display: flex; align-items: center; gap: 8px; padding: 12px; border-bottom: 1px solid var(--line); background: var(--page); overflow-x: auto; }
.pc-employee-tab { display: inline-flex; align-items: center; flex-shrink: 0; gap: 10px; white-space: nowrap; padding: 10px 12px; min-height: 44px; border: 1px solid transparent; border-radius: 8px; font-size: 12px; font-weight: 600; color: var(--muted); background: transparent; }
.pc-employee-tab:hover { background: var(--surface); color: var(--accent); }
.pc-employee-tab.is-active { color: var(--accent); background: var(--accent-soft); border-color: var(--card-hover-line); }
.pc-sidebar { display: flex; flex-direction: column; flex-shrink: 0; width: 224px; padding: 20px; gap: 8px; border-right: 1px solid var(--line); background: var(--surface); }
.pc-category { display: flex; align-items: center; justify-content: space-between; gap: 10px; width: 100%; min-height: 44px; text-align: left; padding: 10px 12px; border-radius: 7px; border: 1px solid var(--line); background: var(--surface); color: var(--muted); font-size: 12px; font-weight: 600; }
.pc-category:hover { color: var(--accent); background: var(--page); }
.pc-category.is-active { color: var(--accent); background: var(--accent-soft); border-color: var(--card-hover-line); }
.pc-count-active { color: var(--accent); background: var(--accent-soft); }
.pc-count-neutral { color: var(--muted); background: var(--page); }
.pc-content { min-width: 0; }
.pc-content-toolbar { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 16px; padding: 20px; background: var(--surface); border-bottom: 1px solid var(--line); font-size: 12px; }
.pc-chip { display: inline-flex; align-items: center; gap: 4px; border: 1px solid var(--line); border-radius: 5px; padding: 3px 8px; background: var(--page); color: var(--muted); font-size: 11px; font-weight: 600; white-space: nowrap; }
.pc-chip-active { color: var(--accent); background: var(--accent-soft); }
.pc-button { display: inline-flex; align-items: center; justify-content: center; gap: 8px; min-height: 42px; padding: 10px 16px; border-radius: 7px; border: 1px solid var(--line); font-size: 12px; font-weight: 600; white-space: nowrap; box-shadow: none; }
.pc-primary { color: var(--surface); background: var(--accent); border-color: var(--accent); }
.pc-primary:hover { background: var(--accent-dark); border-color: var(--accent-dark); }
.pc-approve { color: var(--surface); background: var(--success); border-color: var(--success); }
.pc-approve:hover { background: var(--accent-dark); border-color: var(--accent-dark); }
.pc-danger { color: var(--danger); background: var(--danger-soft); border-color: var(--danger-line); }
.pc-danger:hover { border-color: var(--danger); }
.pc-refresh { min-width: 44px; }
.pc-balance { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 16px; padding: 20px; margin-bottom: 16px; border: 1px solid var(--card-line); border-radius: var(--card-radius); background: var(--surface); box-shadow: var(--card-shadow); }
.pc-balance-detail { display: flex; flex-wrap: wrap; gap: 16px; font-size: 12px; }
.pc-balance-remaining { display: flex; flex-direction: column; gap: 6px; }
.pc-balance-label { font-size: 11px; color: var(--muted); font-weight: 600; }
.pc-balance-value { font-size: 20px; color: var(--accent); font-weight: 700; line-height: 1.3; }
.pc-balance-value.is-negative { color: var(--danger); background: var(--danger-soft); padding: 4px 8px; border-radius: 5px; }
.pc-table-wrap { min-width: 0; border: 1px solid var(--line); border-radius: var(--card-radius); }
.pc-ui table { font-size: 13px; color: var(--ink); }
.pc-ui thead { background: var(--page); color: var(--muted); font-size: 11px; font-weight: 600; }
.pc-ui :is(th, td, tr, tfoot) { border-color: var(--line); }
.pc-ui tfoot { border-top-width: 1px; background: var(--page); }
.pc-ui tbody tr:hover { background: var(--accent-soft); }
.pc-ui tbody td:last-child > .flex { gap: 8px; }
.pc-ui button { cursor: pointer; }

/* Limit utility corrections to Personal Cash and its report/posting dialogs. */
:is(.pc-ui, .accounting-page:has(#view-personal-cash:not(.hidden)) #modalVerify) :is(.font-bold, .font-extrabold, .font-black) { font-weight: 600; }
:is(.pc-ui, .accounting-page:has(#view-personal-cash:not(.hidden)) #modalVerify) :is([class^="text-slate-"], [class*=" text-slate-"]) { color: var(--muted); }
:is(.pc-ui, .accounting-page:has(#view-personal-cash:not(.hidden)) #modalVerify) :is(.text-slate-700, .text-slate-800, .text-slate-900) { color: var(--ink); }
:is(.pc-ui, .accounting-page:has(#view-personal-cash:not(.hidden)) #modalVerify) :is([class^="text-teal-"], [class*=" text-teal-"]) { color: var(--accent); }
:is(.pc-ui, .accounting-page:has(#view-personal-cash:not(.hidden)) #modalVerify) :is([class^="bg-slate-"], [class*=" bg-slate-"]) { background-color: var(--page); }
:is(.pc-ui, .accounting-page:has(#view-personal-cash:not(.hidden)) #modalVerify) :is([class^="border-slate-"], [class*=" border-slate-"]) { border-color: var(--line); }
:is(.pc-ui, .accounting-page:has(#view-personal-cash:not(.hidden)) #modalVerify) :is([class^="bg-teal-"], [class*=" bg-teal-"]) { background-color: var(--accent-soft); }
:is(.pc-ui, .accounting-page:has(#view-personal-cash:not(.hidden)) #modalVerify) :is([class^="border-teal-"], [class*=" border-teal-"]) { border-color: var(--line); }
:is(.pc-ui, .accounting-page:has(#view-personal-cash:not(.hidden)) #modalVerify) :is(:is([class^="text-rose-"], [class*=" text-rose-"]), :is([class^="text-red-"], [class*=" text-red-"])) { color: var(--danger); }
:is(.pc-ui, .accounting-page:has(#view-personal-cash:not(.hidden)) #modalVerify) :is(:is([class^="bg-rose-"], [class*=" bg-rose-"]), :is([class^="bg-red-"], [class*=" bg-red-"])) { background-color: var(--danger-soft); }
.pc-ui :is(:is([class^="text-amber-"], [class*=" text-amber-"])) { color: var(--warning); }
.pc-ui :is([class^="bg-amber-"], [class*=" bg-amber-"]) { background-color: var(--warning-soft); }
.pc-ui :is([class^="border-amber-"], [class*=" border-amber-"]) { border-color: var(--line); }
.pc-ui :is([class^="text-blue-"], [class*=" text-blue-"]) { color: var(--info); }
.pc-ui :is([class^="bg-blue-"], [class*=" bg-blue-"]) { background-color: var(--info-soft); }
.pc-ui :is([class^="border-blue-"], [class*=" border-blue-"]) { border-color: var(--line); }
.pc-ui :is([class^="text-emerald-"], [class*=" text-emerald-"]) { color: var(--success); }
.pc-ui :is([class^="bg-emerald-"], [class*=" bg-emerald-"]) { background-color: var(--success-soft); }
.pc-ui :is([class^="border-emerald-"], [class*=" border-emerald-"]) { border-color: var(--line); }
.pc-ui :is([class^="shadow-"], [class*=" shadow-"]) { box-shadow: var(--card-shadow); }
.pc-ui td > span:is([class^="bg-"], [class*=" bg-"]) { border-radius: 5px; }

#modalReportPC { padding: 20px; overflow-y: auto; }
#modalReportPC > .bg-white { margin: auto; border: 1px solid var(--card-line); border-radius: var(--card-radius); box-shadow: var(--card-hover-shadow); max-height: calc(100dvh - 40px); overflow-y: auto; }
#modalReportPC .pc-modal-header { background: var(--surface); color: var(--ink); padding: 20px; border-bottom: 1px solid var(--line); }
#modalReportPC .pc-modal-header p { color: var(--muted); }
#modalReportPC .pc-modal-header button { color: var(--muted); min-height: 44px; min-width: 44px; }
#modalReportPC .pc-modal-header .module-icon { background: var(--accent-soft); color: var(--accent); box-shadow: none; }
:is(#modalReportPC, .accounting-page:has(#view-personal-cash:not(.hidden)) #modalVerify) :is(select, input:not([type="checkbox"])) { min-height: 44px; color: var(--ink); border: 1px solid var(--line); border-radius: 8px; font-family: inherit; }
:is(#modalReportPC, .accounting-page:has(#view-personal-cash:not(.hidden)) #modalVerify) :is(select, input):focus { outline: 2px solid var(--accent); outline-offset: 2px; box-shadow: none; }
#rptIncludeSignatures { accent-color: var(--accent); }
.accounting-page:has(#view-personal-cash:not(.hidden)) #modalVerify { padding: 20px; overflow-y: auto; }
.accounting-page:has(#view-personal-cash:not(.hidden)) #modalVerify > .bg-white { margin: auto; max-height: calc(100dvh - 40px); overflow-y: auto; border: 1px solid var(--card-line); border-radius: var(--card-radius); box-shadow: var(--card-hover-shadow); }
.accounting-page:has(#view-personal-cash:not(.hidden)) #modalVerify button { min-height: 44px; border-radius: 7px; font-size: 12px; font-weight: 600; }
.accounting-page:has(#view-personal-cash:not(.hidden)) #modalVerify button.text-white { background: var(--accent); color: var(--surface); box-shadow: none; }
.accounting-page:has(#view-personal-cash:not(.hidden)) #modalVerify button.text-white:hover { background: var(--accent-dark); }

@media (max-width: 1000px) { .pc-sidebar { width: 200px; padding: 16px; } }
@media (max-width: 767px) {
    .pc-sidebar { width: 100%; border-right: 0; border-bottom: 1px solid var(--line); }
    .pc-content-toolbar { padding: 18px; }
}
@media (max-width: 600px) {
    #accountingUserName { font-size: 12px; }
    .pc-page-title { font-size: 23px; }
    .pc-heading { align-items: stretch; }
    .pc-balance { padding: 18px; }
    .pc-balance-detail { flex-direction: column; gap: 8px; }
    .pc-actions { width: 100%; }
    #modalReportPC :is(.p-6, .px-6) { padding: 18px; }
}