:root {
    --erp-navy: #0a2942;
    --erp-blue: #0b5cab;
    --erp-cyan: #1aa6b7;
    --erp-ink: #172b3a;
    --erp-muted: #647687;
    --erp-line: #dfe7ee;
    --erp-bg: #f3f7fa;
    --erp-white: #fff;
    --erp-green: #16845b;
    --erp-amber: #b86b00;
    --erp-red: #bf3b3b;
    --erp-sidebar: 260px;
}

* { box-sizing: border-box; }
body { margin: 0; color: var(--erp-ink); background: var(--erp-bg); font-family: Inter, "Segoe UI", Arial, sans-serif; }
a { color: var(--erp-blue); text-decoration: none; }
a:hover { color: #07447f; }

.erp-sidebar { position: fixed; inset: 0 auto 0 0; width: var(--erp-sidebar); z-index: 1030; display: flex; flex-direction: column; color: #fff; background: linear-gradient(180deg, #071f33 0%, #0a3555 100%); box-shadow: 5px 0 22px rgba(6, 31, 51, .15); }
.erp-brand { min-height: 92px; display: flex; align-items: center; gap: 12px; padding: 18px 20px; color: #fff; border-bottom: 1px solid rgba(255,255,255,.12); }
.erp-brand:hover { color: #fff; background: rgba(255,255,255,.04); }
.erp-brand img { width: 52px; height: 52px; padding: 4px; object-fit: contain; border-radius: 12px; background: #fff; }
.erp-brand span { display: flex; flex-direction: column; line-height: 1.25; }
.erp-brand strong { font-size: .94rem; letter-spacing: .01em; }
.erp-brand small { margin-top: 4px; color: #a9c5da; font-size: .72rem; text-transform: uppercase; letter-spacing: .07em; }
.erp-nav { display: grid; gap: 5px; min-height: 0; padding: 20px 14px; overflow-y: auto; }
.erp-nav a { display: flex; align-items: center; gap: 13px; min-height: 46px; padding: 10px 13px; color: #cfe0ed; border-radius: 9px; font-size: .92rem; }
.erp-nav a i { width: 22px; text-align: center; }
.erp-nav a:hover, .erp-nav a.active { color: #fff; background: rgba(255,255,255,.12); }
.erp-nav a.active { box-shadow: inset 3px 0 0 #42c8d8; }
.erp-sidebar-footer { margin-top: auto; padding: 18px 20px; border-top: 1px solid rgba(255,255,255,.12); }
.erp-sidebar-footer a { color: #d9e6ee; }
.erp-sidebar-footer i { margin-right: 10px; }

.erp-main { min-height: 100vh; margin-left: var(--erp-sidebar); }
.erp-topbar { height: 78px; display: flex; align-items: center; gap: 20px; padding: 0 32px; background: #fff; border-bottom: 1px solid var(--erp-line); position: sticky; top: 0; z-index: 1020; }
.erp-topbar > div:nth-child(2) { display: flex; flex-direction: column; }
.erp-topbar > div:nth-child(2) strong { font-size: 1.05rem; }
.eyebrow { display: block; margin-bottom: 3px; color: var(--erp-cyan); font-size: .69rem; line-height: 1.3; font-weight: 800; letter-spacing: .11em; text-transform: uppercase; }
.erp-user { margin-left: auto; display: flex; align-items: center; gap: 10px; }
.erp-user > span:last-child { display: flex; flex-direction: column; font-size: .82rem; }
.erp-user small { color: var(--erp-muted); }
.avatar { width: 38px; height: 38px; display: grid; place-items: center; color: #fff; background: var(--erp-navy); border-radius: 50%; font-weight: 800; }
.sidebar-toggle { display: none; border: 0; background: transparent; font-size: 1.2rem; }
.erp-content { max-width: 1660px; margin: 0 auto; padding: 30px 32px 48px; }

.page-heading { display: flex; align-items: flex-end; justify-content: space-between; gap: 24px; margin-bottom: 24px; }
.page-heading h1 { margin: 0 0 7px; color: var(--erp-navy); font-size: clamp(1.65rem, 2.5vw, 2.25rem); font-weight: 760; letter-spacing: -.03em; }
.page-heading p { max-width: 760px; margin: 0; color: var(--erp-muted); }
.back-link { display: inline-flex; gap: 8px; align-items: center; margin-bottom: 12px; font-size: .86rem; font-weight: 700; }
.btn-primary { --bs-btn-bg: var(--erp-blue); --bs-btn-border-color: var(--erp-blue); --bs-btn-hover-bg: #084d90; --bs-btn-hover-border-color: #084d90; }

.metric-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 16px; }
.metric-card { min-height: 114px; display: flex; align-items: center; gap: 16px; padding: 20px; background: #fff; border: 1px solid var(--erp-line); border-radius: 15px; box-shadow: 0 8px 22px rgba(20, 50, 71, .05); }
.metric-card > div { display: flex; flex-direction: column; }
.metric-card small { color: var(--erp-muted); font-size: .78rem; font-weight: 650; }
.metric-card strong { color: var(--erp-navy); font-size: 1.8rem; line-height: 1.1; }
.metric-icon { width: 46px; height: 46px; display: grid; flex: 0 0 46px; place-items: center; border-radius: 12px; }
.metric-icon.blue { color: #0b5cab; background: #e7f1fb; }.metric-icon.violet { color: #7254b7; background: #f0eafa; }.metric-icon.cyan { color: #087e8b; background: #e1f5f6; }.metric-icon.amber { color: #9b600a; background: #fff3d9; }.metric-icon.green { color: #16845b; background: #e2f5ed; }.metric-icon.red { color: #b23b3b; background: #fde9e9; }

.dashboard-grid { display: grid; grid-template-columns: minmax(0, 1.6fr) minmax(300px, .8fr); gap: 20px; }
.panel { overflow: hidden; background: #fff; border: 1px solid var(--erp-line); border-radius: 15px; box-shadow: 0 8px 25px rgba(20, 50, 71, .05); }
.panel-heading { min-height: 74px; display: flex; align-items: center; justify-content: space-between; gap: 20px; padding: 18px 22px; border-bottom: 1px solid var(--erp-line); }
.panel-heading h2 { margin: 0; color: var(--erp-navy); font-size: 1.08rem; font-weight: 760; }
.panel-heading span:not(.eyebrow) { color: var(--erp-muted); font-size: .82rem; }
.bar-chart { display: grid; gap: 17px; padding: 23px; }
.bar-label { display: flex; justify-content: space-between; gap: 20px; margin-bottom: 7px; font-size: .84rem; }
.bar-track { height: 8px; overflow: hidden; background: #e9eff4; border-radius: 99px; }
.bar-track span { display: block; height: 100%; min-width: 3px; background: linear-gradient(90deg, var(--erp-blue), var(--erp-cyan)); border-radius: inherit; }
.list-stat { display: grid; padding: 9px 22px 18px; }
.list-stat div { display: flex; justify-content: space-between; gap: 20px; padding: 13px 0; border-bottom: 1px solid #edf2f5; font-size: .88rem; }
.list-stat div:last-child { border-bottom: 0; }
.list-stat strong { color: var(--erp-blue); }

.erp-table { margin: 0; font-size: .86rem; }
.erp-table thead th { padding: 13px 17px; color: #587080; background: #f6f9fb; border-bottom: 1px solid var(--erp-line); font-size: .69rem; letter-spacing: .06em; text-transform: uppercase; white-space: nowrap; }
.erp-table tbody td { padding: 15px 17px; border-color: #edf2f5; vertical-align: middle; }
.erp-table tbody tr:hover { background: #fbfdfe; }
.erp-table td small { display: block; margin-top: 3px; color: var(--erp-muted); }
.empty-state { padding: 32px !important; color: var(--erp-muted); text-align: center; }

.status-pill { display: inline-flex; align-items: center; min-height: 26px; padding: 4px 9px; color: #455a68; background: #edf2f5; border-radius: 99px; font-size: .69rem; font-weight: 800; white-space: nowrap; }
.status-pill.approved, .status-pill.active { color: #116b4b; background: #dff4e9; }
.status-pill.rejected, .status-pill.suspended, .status-pill.separated { color: #a32f2f; background: #fbe4e4; }
.status-pill[class*="pending"], .status-pill.probation { color: #8a5506; background: #fff0cf; }
.status-pill.clarification { color: #5f4b99; background: #eee9fa; }
.status-pill.incomplete { color: #5b6872; background: #e9eef2; }
.status-large { padding: 8px 14px; font-size: .76rem; }

.form-panel { padding-bottom: 22px; }
.form-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 19px 22px; padding: 24px; }
.form-field { display: flex; flex-direction: column; gap: 7px; }
.form-field > span { font-size: .8rem; font-weight: 750; }
.form-field > small { color: var(--erp-muted); font-size: .74rem; }
.form-field-wide { grid-column: 1 / -1; }
.single-column { grid-template-columns: 1fr; }
.form-control, .form-select { min-height: 45px; border-color: #cad7e0; border-radius: 8px; font-size: .88rem; }
.form-control:focus, .form-select:focus { border-color: var(--erp-blue); box-shadow: 0 0 0 .2rem rgba(11,92,171,.12); }
.check-field { display: flex; flex-direction: row; align-items: flex-start; gap: 12px; padding: 14px; background: #f6f9fb; border: 1px solid var(--erp-line); border-radius: 9px; }
.check-field > span { display: flex; flex-direction: column; }
.check-field small { color: var(--erp-muted); }
.form-actions { display: flex; justify-content: flex-end; gap: 10px; padding: 0 24px; }
.required-note { color: var(--erp-muted); font-size: .75rem; }

.balance-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; }
.balance-card { padding: 18px; background: #fff; border: 1px solid var(--erp-line); border-radius: 14px; }
.balance-card > div:first-child { display: flex; align-items: center; gap: 9px; }
.balance-icon { width: 30px; height: 30px; display: grid; place-items: center; color: var(--erp-blue); background: #e7f1fb; border-radius: 8px; }
.balance-card > strong { display: block; margin: 15px 0; color: var(--erp-navy); font-size: 1.45rem; }
.balance-card > strong small { color: var(--erp-muted); font-size: .72rem; font-weight: 600; }
.balance-card dl { display: grid; grid-template-columns: repeat(3, 1fr); margin: 0; }
.balance-card dl div { padding: 0 8px; border-right: 1px solid var(--erp-line); }
.balance-card dl div:first-child { padding-left: 0; }.balance-card dl div:last-child { border: 0; }
.balance-card dt { color: var(--erp-muted); font-size: .66rem; font-weight: 600; }.balance-card dd { margin: 2px 0 0; font-weight: 800; }
.balance-card .policy-based { font-size: 1rem; }.balance-card > p { margin: 0; color: var(--erp-muted); font-size: .78rem; }
.info-callout { display: flex; gap: 13px; padding: 14px; color: #1c536e; background: #eaf6fa; border-radius: 9px; }.info-callout i { margin-top: 3px; }.info-callout p { margin: 0; font-size: .82rem; }.info-callout strong { display: block; }

.filter-tabs { display: flex; gap: 7px; margin-bottom: 16px; overflow-x: auto; }
.filter-tabs a { padding: 9px 13px; color: #536b7b; background: #fff; border: 1px solid var(--erp-line); border-radius: 8px; font-size: .82rem; font-weight: 700; white-space: nowrap; }
.filter-tabs a.active { color: #fff; background: var(--erp-blue); border-color: var(--erp-blue); }
.check-count { display: block; color: #537063; font-size: .73rem; white-space: nowrap; }.check-count i { width: 18px; }.check-count.warning { color: var(--erp-red); font-weight: 700; }

.detail-grid { display: grid; grid-template-columns: minmax(0, 1.65fr) minmax(310px, .75fr); gap: 22px; align-items: start; }
.detail-list { display: grid; grid-template-columns: repeat(2, minmax(0,1fr)); margin: 0; padding: 7px 22px 21px; }
.detail-list div { padding: 14px 10px 14px 0; border-bottom: 1px solid #edf2f5; }.detail-list .wide { grid-column: 1 / -1; }
.detail-list dt { color: var(--erp-muted); font-size: .7rem; text-transform: uppercase; letter-spacing: .05em; }.detail-list dd { margin: 4px 0 0; font-size: .88rem; }
.conflict-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 14px; padding: 20px 22px; }
.conflict-grid article { display: grid; grid-template-columns: auto auto 1fr; align-items: center; gap: 10px; padding: 15px; color: #33715a; background: #eef8f3; border-radius: 10px; }.conflict-grid article.has-conflict { color: #9b4d22; background: #fff2e8; }.conflict-grid strong { font-size: 1.4rem; }.conflict-grid span { font-size: .76rem; }
.warning-note, .success-note { margin: 0 22px 20px; padding: 12px 14px; border-radius: 8px; font-size: .79rem; }.warning-note { color: #8e4d15; background: #fff3e4; }.success-note { color: #196848; background: #e9f7f0; }.warning-note i, .success-note i { margin-right: 7px; }
.action-panel form { padding: 20px 22px 22px; }.decision-actions { display: flex; justify-content: flex-end; gap: 9px; margin-top: 16px; flex-wrap: wrap; }
.workflow-timeline { list-style: none; margin: 0; padding: 20px 20px 6px; }
.workflow-timeline li { position: relative; display: grid; grid-template-columns: 35px 1fr; gap: 10px; min-height: 88px; }.workflow-timeline li:not(:last-child)::before { content: ""; position: absolute; top: 30px; bottom: 0; left: 16px; width: 2px; background: var(--erp-line); }
.timeline-marker { width: 34px; height: 34px; z-index: 1; display: grid; place-items: center; color: #6f7f8b; background: #edf2f5; border-radius: 50%; }.workflow-timeline .approved .timeline-marker { color: #fff; background: var(--erp-green); }.workflow-timeline .pending .timeline-marker { color: #fff; background: var(--erp-amber); }.workflow-timeline .rejected .timeline-marker { color: #fff; background: var(--erp-red); }
.workflow-timeline li > div { display: flex; flex-direction: column; padding-bottom: 14px; }.workflow-timeline small { color: var(--erp-muted); font-size: .72rem; }.workflow-timeline li > div > span { margin-top: 4px; font-size: .67rem; font-weight: 800; text-transform: uppercase; }.workflow-timeline p { margin: 7px 0 0; color: var(--erp-muted); font-size: .75rem; }
.audit-list { list-style: none; margin: 0; padding: 10px 20px 18px; }.audit-list li { display: grid; padding: 11px 0; border-bottom: 1px solid #edf2f5; font-size: .76rem; }.audit-list li:last-child { border: 0; }.audit-list span { color: var(--erp-blue); font-weight: 800; }.audit-list small { color: var(--erp-muted); }.audit-list p { margin: 6px 0 0; color: var(--erp-muted); }

.preserve-lines { white-space: pre-line; }
.score-display { display: flex; align-items: baseline; gap: 5px; color: var(--erp-navy); font-size: 2rem; }
.score-display strong { font-size: 2rem; }
.score-display span { color: var(--erp-muted); font-size: .8rem; }
.scorecard { display: grid; gap: 14px; padding: 22px; }
.score-row { display: grid; grid-template-columns: minmax(220px, 1.25fr) 110px minmax(220px, 1fr); gap: 18px; align-items: center; padding-bottom: 14px; border-bottom: 1px solid #edf2f5; }
.score-row:last-child { padding-bottom: 0; border-bottom: 0; }
.score-row strong, .score-row small { display: block; }
.score-row small { margin-top: 3px; color: var(--erp-muted); }
.pipeline-list, .task-list { list-style: none; margin: 0; padding: 18px 22px; }
.pipeline-list { display: grid; grid-template-columns: repeat(6, minmax(105px, 1fr)); gap: 8px; overflow-x: auto; }
.pipeline-list li { min-width: 105px; padding: 12px; color: #657986; background: #edf2f5; border-radius: 9px; font-size: .72rem; font-weight: 800; text-align: center; }
.pipeline-list li.complete { color: #126849; background: #dff4e9; }
.pipeline-list li.current { color: #fff; background: var(--erp-blue); }
.task-list { display: grid; gap: 10px; }
.task-list li { display: grid; grid-template-columns: 1fr auto; align-items: center; gap: 14px; padding: 14px; background: #f7fafb; border: 1px solid var(--erp-line); border-radius: 10px; }
.task-list li.complete { background: #edf8f3; border-color: #cce9dc; }
.task-list strong, .task-list small { display: block; }
.task-list small { margin-top: 4px; color: var(--erp-muted); }
.onboarding-task { display: grid; grid-template-columns: auto 1fr minmax(150px, auto); align-items: center; gap: 14px; padding: 14px; background: #f7fafb; border: 1px solid var(--erp-line); border-radius: 10px; }
.onboarding-task.completed { background: #edf8f3; border-color: #cce9dc; }
.onboarding-task strong, .onboarding-task small { display: block; }
.onboarding-task small { margin-top: 4px; color: var(--erp-muted); }
.onboarding-task p { margin: 7px 0 0; color: var(--erp-muted); font-size: .8rem; }
.task-icon { width: 34px; height: 34px; display: grid; place-items: center; color: var(--erp-blue); background: #e5f0fa; border-radius: 50%; }
.onboarding-task.completed .task-icon { color: #fff; background: var(--erp-green); }
.progress { height: 9px; overflow: hidden; background: #e7edf1; border-radius: 99px; }
.progress-bar { height: 100%; background: linear-gradient(90deg, var(--erp-blue), var(--erp-cyan)); }

.careers-body { min-height: 100vh; margin: 0; color: #243746; background: #f5f8fa; font-family: Inter, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif; }
.careers-nav { min-height: 78px; display: flex; align-items: center; justify-content: space-between; gap: 25px; padding: 0 clamp(20px, 6vw, 88px); color: #fff; background: #0c2d48; }
.careers-brand { display: flex; align-items: center; gap: 12px; color: #fff; }
.careers-brand img { width: 44px; height: 44px; object-fit: contain; }
.careers-brand span { display: grid; font-size: .87rem; line-height: 1.15; }
.careers-brand small { margin-top: 4px; color: #bcd5e6; font-size: .68rem; letter-spacing: .08em; text-transform: uppercase; }
.careers-nav > a:last-child { color: #d8e8f2; font-size: .82rem; font-weight: 700; }
.careers-hero, .career-detail-hero { padding: clamp(56px, 8vw, 100px) clamp(20px, 8vw, 120px); color: #fff; background: linear-gradient(118deg, #0c2d48 0%, #0b5cab 70%, #1498a9 120%); }
.careers-hero { text-align: center; }
.careers-hero div { max-width: 820px; margin: 0 auto; }
.careers-hero h1, .career-detail-hero h1 { margin: 10px 0 18px; font-size: clamp(2.1rem, 5vw, 4rem); line-height: 1.04; letter-spacing: -.04em; }
.careers-hero p, .career-detail-hero p { max-width: 720px; margin: 0 auto; color: #d8e9f4; font-size: clamp(1rem, 2vw, 1.15rem); }
.career-detail-hero p { margin: 0; }
.career-detail-hero .back-link { color: #d8e9f4; }
.careers-section { max-width: 1240px; margin: 0 auto; padding: 55px clamp(20px, 5vw, 70px); }
.careers-section-heading { margin-bottom: 24px; }
.careers-section-heading h2 { margin: 0 0 8px; color: #0c2d48; font-size: clamp(1.5rem, 3vw, 2.25rem); }
.careers-section-heading p { margin: 0; color: #617684; }
.career-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 20px; }
.career-card { display: flex; flex-direction: column; min-height: 260px; padding: 24px; background: #fff; border: 1px solid #dce6ec; border-radius: 15px; box-shadow: 0 10px 30px rgba(20,50,71,.06); }
.career-card h3 { margin: 14px 0 10px; color: #0c2d48; font-size: 1.18rem; }
.career-card p { color: #617684; font-size: .87rem; }
.career-card-meta { display: flex; flex-wrap: wrap; gap: 8px 14px; color: #536d7d; font-size: .76rem; }
.career-card .btn { margin-top: auto; align-self: flex-start; }
.career-detail-grid { display: grid; grid-template-columns: minmax(0, 1.45fr) minmax(320px, .75fr); gap: 24px; align-items: start; }
.career-detail-grid .panel { padding-bottom: 22px; }
.career-detail-grid .panel > p, .career-detail-grid .panel > ul { margin-left: 22px; margin-right: 22px; }
.careers-footer { padding: 28px 20px; color: #bad0df; background: #0c2d48; text-align: center; font-size: .75rem; }
.confirmation-wrap { min-height: calc(100vh - 148px); display: grid; place-items: center; padding: 40px 20px; }
.confirmation-card { width: min(580px, 100%); padding: 42px; background: #fff; border: 1px solid #dce6ec; border-radius: 18px; box-shadow: 0 18px 45px rgba(20,50,71,.1); text-align: center; }
.confirmation-card i { color: var(--erp-green); font-size: 3rem; }
.confirmation-card h1 { margin: 18px 0 12px; color: #0c2d48; }
.confirmation-card p { color: #617684; }

@media (max-width: 1180px) { .metric-grid { grid-template-columns: repeat(2, minmax(0,1fr)); }.balance-grid { grid-template-columns: repeat(2, minmax(0,1fr)); } }
@media (max-width: 900px) {
    .erp-sidebar { transform: translateX(-100%); transition: transform .25s ease; }.sidebar-open .erp-sidebar { transform: translateX(0); }.erp-main { margin-left: 0; }.sidebar-toggle { display: block; }.erp-content { padding: 24px 18px 40px; }.erp-topbar { padding: 0 18px; }.erp-user > span:last-child { display: none; }
    .dashboard-grid, .detail-grid, .career-detail-grid { grid-template-columns: 1fr; }.page-heading { align-items: flex-start; flex-direction: column; }.page-heading .btn { width: 100%; }.form-grid { grid-template-columns: 1fr; }.form-field-wide { grid-column: auto; }.career-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }.score-row { grid-template-columns: 1fr; }.onboarding-task { grid-template-columns: auto 1fr; }.onboarding-task form, .onboarding-task > .status-pill { grid-column: 2; }
}
@media (max-width: 620px) { .metric-grid, .balance-grid, .career-grid { grid-template-columns: 1fr; }.detail-list, .conflict-grid { grid-template-columns: 1fr; }.detail-list .wide { grid-column: auto; }.erp-topbar .eyebrow { display: none; }.decision-actions > * { width: 100%; }.careers-nav { padding: 12px 18px; }.careers-brand span { display: none; }.confirmation-card { padding: 30px 22px; } }

@media (prefers-reduced-motion: reduce) { *, *::before, *::after { scroll-behavior: auto !important; transition: none !important; } }