/* Salary versioning uses the same quiet glass surface as the rest of the base. */
.salary-settings-body { display:flex; flex-direction:column; gap:18px; }
.salary-settings-body > .field, .salary-settings-body .form-person { margin:0; }
.salary-current { display:flex; align-items:center; justify-content:space-between; gap:18px; padding:18px 20px; border-radius:18px; background:linear-gradient(125deg,#b8d6ff10,#b8d6ff03); }
.salary-current > div { display:flex; flex-direction:column; gap:4px; }
.salary-current span { color:#bdcbdf; font-size:12px; }
.salary-current strong { font-size:27px; letter-spacing:-.5px; font-variant-numeric:tabular-nums; color:#f2f6ff; }
.salary-current small { color:#aabbd0; font-size:11px; }
.salary-current > span { text-align:right; max-width:130px; }
.salary-settings-tabs { display:flex; gap:5px; padding:5px; border-radius:14px; background:#070d1980; }
.salary-settings-tabs button { flex:1; min-height:44px; border:0; border-radius:10px; color:#adbed4; background:transparent; transition:background .2s,color .2s; font-size:13px; font-weight:600; }
.salary-settings-tabs button[aria-selected=true] { background:#a9c9f322; color:#f4f7ff; box-shadow:inset 0 1px #e4f0ff24,0 3px 10px #0002; }
.salary-settings-tabs button:focus-visible { outline:2px solid #a6caff; outline-offset:2px; }
.salary-settings-tabs button span { margin-left:5px; font-size:10px; background:#bfd4ff19; padding:2px 6px; border-radius:6px; }
#salary-edit-panel > .field { margin-bottom:8px; }
#salary-edit-panel .form-grid { margin-block:18px; }
#salary-edit-panel .salary-terms-preview { margin:0 0 18px; padding:18px 20px; gap:6px; }
#salary-edit-panel .salary-terms-preview > strong { font-size:29px; color:#e7f0ff; }
#salary-edit-panel .salary-terms-preview > small { color:#b9cfff; }
.salary-effective-example { margin-bottom:20px; }
.salary-example-heading { display:flex; justify-content:space-between; gap:10px; align-items:center; margin-bottom:12px; font-size:12px; color:#d0e1fa; }
.salary-example-heading small { color:#a4b6d0; font-size:10px; }
.salary-pay-cycle { display:grid; grid-template-columns:1fr 22px 1fr; gap:10px; align-items:center; }
.salary-pay-cycle > div { display:flex; flex-direction:column; gap:5px; padding:15px; border:1px solid #c4d8fa1e; border-radius:14px; background:#0a14233b; }
.salary-pay-cycle span,.salary-pay-cycle small { color:#afbed3; font-size:11px; }
.salary-pay-cycle strong { font-size:21px; color:#e4edfc; font-variant-numeric:tabular-nums; }
.salary-pay-cycle > .is-new { background:#b9d4ff0b; border-color:#c4d8fa38; }
.salary-pay-cycle > .is-new strong { color:#b9d4ff; }
.salary-pay-cycle .salary-cycle-arrow { text-align:center; font-size:18px; color:#8fabc9; }
.salary-effective-example > p { color:#99abc4; font-size:10px; line-height:1.7; margin:10px 0 0; }
.salary-protection { display:flex; align-items:center; gap:8px; margin:14px 0 0; font-size:11px; color:#b5e3d2; }
.salary-protection svg { width:15px; height:15px; flex-shrink:0; }
.salary-history-intro { margin:0 0 18px; }
.salary-history-list { display:flex; flex-direction:column; gap:14px; }
.salary-version { padding:18px; border:1px solid #c5ddff20; border-radius:16px; background:#c5ddff04; }
.salary-version.is-current { border-color:#aee6d33d; background:linear-gradient(130deg,#aee6d30b,#c5ddff02); }
.salary-version header { display:flex; align-items:center; justify-content:space-between; gap:10px; }
.salary-version header > div { display:flex; align-items:center; gap:8px; }
.salary-version header strong { color:#e4edfa; font-size:12px; }
.salary-version .badge { white-space:nowrap; font-size:10px; }
.salary-version-dot { width:6px; height:6px; border-radius:50%; background:#8ca6ca; flex-shrink:0; }
.salary-version.is-current .salary-version-dot { background:#b7ebd7; box-shadow:0 0 8px #b7ebd733; }
.salary-version-amounts { display:grid; grid-template-columns:1fr 1fr; gap:12px; margin-top:14px; }
.salary-version-amounts > div > span { color:#a7bad3; font-size:10px; }
.salary-version-amounts p { display:flex; gap:7px; flex-wrap:wrap; align-items:center; margin:3px 0 0; font-variant-numeric:tabular-nums; line-height:1.8; }
.salary-version-amounts small,.salary-version-amounts i { color:#9cadc5; font-size:11px; font-style:normal; }
.salary-version-amounts strong { color:#e8f0ff; font-size:16px; }
.salary-version-note { margin:12px 0 0; font-size:12px; color:#c0cede; overflow-wrap:anywhere; }
.salary-version footer { display:flex; justify-content:space-between; gap:10px; margin-top:14px; padding-top:11px; border-top:1px solid #c5ddff12; color:#9eafc7; font-size:10px; }
#salary-terms-form [hidden] { display:none !important; }
@media(max-width:600px) {
 .salary-settings-body { gap:15px; }
 .salary-current { padding:16px; gap:10px; }
 .salary-current strong { font-size:25px; }
 .salary-current > span { max-width:90px; font-size:10px; }
 .salary-current small { font-size:10px; }
 .salary-example-heading { align-items:flex-start; }
 .salary-pay-cycle { gap:6px; grid-template-columns:1fr 15px 1fr; }
 .salary-pay-cycle > div { padding:12px 10px; }
 .salary-pay-cycle strong { font-size:20px; }
 .salary-pay-cycle span,.salary-pay-cycle small { font-size:10px; }
 .salary-version { padding:15px; }
 .salary-version-amounts { gap:9px; }
 .salary-version-amounts p { gap:5px; }
 .salary-version-amounts small { font-size:10px; }
 .salary-version-amounts strong { font-size:15px; }
 .salary-version footer { flex-wrap:wrap; gap:5px; }
 .salary-settings-body .form-person { flex-wrap:wrap; gap:10px; }
}

.salary-settings-body:has(#salary-history-tab[aria-selected="true"]) .form-person { display:none; }
