.po-page{--po-blue:#086cdf;--po-ink:#123959;--po-border:#d4e4f2;display:grid;gap:18px;color:var(--po-ink)}
.po-page .personnel-hero{margin:0;background:linear-gradient(115deg,#f6fbff,#e9f5ff);border-color:#cde4fa}
.po-page .personnel-hero h1{font-size:clamp(23px,2.2vw,34px);line-height:1.2;color:#073971;letter-spacing:-.6px}
.po-page .personnel-hero-icon{background:linear-gradient(135deg,#079df3,#0864e9);color:white;box-shadow:0 5px 15px #0c74db24}
.po-kpis{grid-template-columns:repeat(var(--po-kpis),minmax(0,1fr));margin:0!important;gap:12px}
.po-kpis .personnel-kpi{padding:18px 14px;min-width:0;min-height:112px}.po-kpis .personnel-kpi strong{font-size:30px}.po-kpis .personnel-kpi b{font-size:13px;line-height:1.45}.po-kpis .personnel-kpi>span{width:50px;height:56px;flex-shrink:0}
.po-page h2{font-size:17px;color:#103c6d;margin:0 0 16px;display:flex;align-items:center;gap:8px}.po-page h3{font-size:15px;color:#1f4d76;margin:20px 0 12px}
.po-page .personnel-card{padding:22px;border:1px solid var(--po-border);box-shadow:0 3px 13px #234e7810;border-radius:12px;min-width:0;margin:0}.po-filter form{display:grid;grid-template-columns:repeat(auto-fit,minmax(145px,1fr));align-items:end;gap:14px}.po-filter label{display:flex;flex-direction:column;gap:6px;font-size:12px;font-weight:750;color:#294b70}.po-filter input,.po-filter select{font-size:13px;min-height:42px}.po-filter .po-search{grid-column:span 2}.po-filter .btn{min-height:42px;justify-content:center}.po-focus{grid-column:1/-1}.po-toolbar{margin:0}.po-toolbar>div{gap:9px}.po-page .btn{font-size:13px;border-radius:7px;min-height:37px;white-space:normal}.po-page .btn.primary{background:#087bf4;border-color:#087bf4;color:#fff}.po-page .btn:hover{box-shadow:0 2px 7px #144d7620}.po-page .po-pdf{border-color:#f9ced4;color:#c9374c}
.po-page .po-list{padding:0;overflow:hidden}.po-list .personnel-list-heading{padding:20px 22px;margin:0}.po-list .personnel-list-heading h2{margin:0 0 5px}.po-list p{margin:0;color:#6b839b;font-size:13px}.po-count{background:#e9f4ff;color:#0874de;font-size:14px;font-weight:800;border-radius:8px;padding:7px 13px}.po-list .table-scroll{border:none;border-radius:0;max-width:100%}.po-list table{min-width:1050px;font-size:13px;width:100%;border-collapse:collapse}.po-list th{background:#ecf5fd;color:#194773;font-size:12px;white-space:normal!important;padding:13px 10px;border:1px solid #dbe8f3}.po-list td{padding:12px 10px;white-space:normal!important;overflow-wrap:anywhere;max-width:260px;border:1px solid #e3ecf4;line-height:1.5;vertical-align:middle}.po-list td strong{color:#17416a}.po-list td:nth-child(4){min-width:180px}.po-list tr:nth-child(even){background:#f9fcff}.po-list tbody tr:hover{background:#edf6ff}.po-list th:first-child,.po-list td:first-child{width:34px}.po-list small{display:block;font-size:11px;color:#71839b}.po-list td:last-child{min-width:116px}.po-list .personnel-pagination{padding:16px 20px;gap:16px}.po-list .personnel-pagination nav{display:flex;gap:7px;align-items:center}.po-list .personnel-pagination .btn{min-width:34px;min-height:32px;padding:4px 8px}.po-list .personnel-pagination select{width:78px}
.po-row-actions{display:flex;gap:5px;flex-wrap:wrap}.po-row-actions .btn{padding:7px;min-width:30px;min-height:30px;border-color:#b7d6f3;color:#0673e5}.po-row-actions .po-danger{color:#cf324d;border-color:#f1bec7}.po-badge{display:inline-flex;gap:5px;padding:4px 8px;background:color-mix(in srgb,var(--po-tone) 13%,white);color:color-mix(in srgb,var(--po-tone) 70%,#19314c);border:1px solid color-mix(in srgb,var(--po-tone) 25%,white);font-size:11px;font-weight:750;line-height:1.35;border-radius:6px}.po-code-count{display:inline-block;background:color-mix(in srgb,var(--po-tone) 12%,white);min-width:24px;padding:2px 4px;border-radius:4px;text-align:center;font-weight:650}.po-day-check{display:inline-flex;width:18px;height:18px;justify-content:center;align-items:center;border-radius:4px;color:white;background:#00a572;font-weight:900}.po-progress{height:5px;background:#e8eef5;margin-top:6px;border-radius:3px;overflow:hidden}.po-progress i{display:block;height:100%;background:#00a978}.po-warning{color:#b96013!important}
.po-analytics{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}.po-analytics>.personnel-card{min-width:0}.po-analytics .personnel-employment{gap:20px;flex-wrap:wrap;justify-content:center}.po-analytics .personnel-donut{flex-shrink:0;width:152px;height:152px}.po-analytics .personnel-donut>div{width:100px;height:100px}.po-analytics .personnel-employment ul{min-width:175px;flex:1;font-size:12px;max-height:270px;overflow:auto}.po-analytics .personnel-employment li{padding:5px 0}.po-analytics .personnel-employment li small{font-size:11px;white-space:nowrap}.po-note{font-size:12px;line-height:1.6;color:#6e8198;margin:12px 0 0}.po-calendar h2{flex-wrap:wrap}.po-calendar h2 span{font-size:12px;margin-left:auto;color:#627b95}.po-calendar-grid{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:5px}.po-calendar-grid>b{font-size:11px;text-align:center;padding:7px 2px;color:#64819c}.po-calendar-grid button{background:#f5f9fd;border:1px solid #e2ecf5;border-radius:5px;min-height:41px;padding:4px 1px;color:#305372;cursor:pointer}.po-calendar-grid button:hover{background:#deefff;border-color:#62acf1}.po-calendar-grid button>b{font-size:12px}.po-calendar-grid button>span{display:flex;justify-content:center;gap:2px;margin-top:3px}.po-calendar-grid i{width:5px;height:5px;border-radius:50%}.po-legend>div{display:grid;grid-template-columns:10px 30px 1fr;gap:8px;align-items:center;border-bottom:1px solid #edf2f7;padding:6px 0;font-size:12px}.po-legend i{width:8px;height:8px;border-radius:3px}.po-alert{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:12px 0;border:0;border-bottom:1px solid #e7eef6;background:none;width:100%;text-align:left;color:#325879;font-size:12px}.po-alert b,.po-alert small{display:block}.po-alert small{font-size:11px;margin-top:4px;color:#7c8da2}.po-alert:is(button){cursor:pointer}.po-alert:is(button):hover{color:#0678eb}.po-bars{height:220px;display:flex;gap:6px;align-items:flex-end;background:repeating-linear-gradient(to top,transparent 0,transparent 43px,#e9f0f7 44px);padding:15px 0 0}.po-bars>div{flex:1;min-width:0;height:100%;display:flex;flex-direction:column;align-items:center;justify-content:flex-end}.po-bar-group{height:155px;width:100%;display:flex;gap:2px;align-items:flex-end;justify-content:center}.po-bar-group i{display:block;width:75%;min-width:3px;border-radius:3px 3px 0 0}.po-bars small{font-size:9px;color:#657d95;margin-top:7px}.po-bars b{font-size:9px;white-space:nowrap;line-height:20px}.po-week table{font-size:11px;min-width:380px}.po-week td,.po-week th{padding:7px 4px}.po-slot{display:block;text-align:center;border-radius:4px;padding:4px}.po-slot.has-staff{background:#d8f5e8;color:#158153;font-weight:700}.po-timeline{padding-left:16px;border-left:2px solid #b7dafa}.po-timeline>div{position:relative;display:grid;gap:4px;padding:0 0 18px 4px;font-size:12px}.po-timeline>div:before{content:'';position:absolute;left:-22px;top:3px;background:#1382eb;width:10px;height:10px;border:3px solid white;border-radius:50%;box-shadow:0 0 0 1px #b7dafa}.po-timeline time{font-size:10px;color:#7492ac}.po-timeline small{color:#6d8297;line-height:1.5;overflow-wrap:anywhere}.po-page .personnel-footnote{font-size:12px;line-height:1.7;margin:0;color:#6b849e}
.po-form-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px}.po-form-grid .full,.po-form-grid .po-full,.po-weekdays,.po-approval,.po-form-context{grid-column:1/-1}.po-form-context{display:grid;gap:7px;background:#edf6ff;border:1px solid #cde4fc;border-radius:10px;padding:17px;margin-bottom:10px;color:#20527e}.po-form-context span{font-size:13px}.po-weekdays{border:1px solid #dbe6f2;border-radius:9px;padding:16px;display:flex;flex-wrap:wrap;gap:15px}.po-weekdays legend{font-weight:700;font-size:13px;color:#335675;padding:0 7px}.po-weekdays label{display:flex;align-items:center;gap:6px;font-size:13px}.po-weekdays input,.po-approval input{width:17px;height:17px;margin:0;flex-shrink:0}.po-approval{border:1px solid #b9e9d7;background:#f3fcf8;border-radius:9px;padding:17px;font-size:13px}.po-approval label{display:flex;align-items:center;gap:9px;font-weight:700}.po-approval p{font-size:12px;line-height:1.65;color:#54776b}.po-approval strong{font-size:12px;color:#127b56}.po-details{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}.po-details>div{min-width:0;border-bottom:1px solid #e5edf5;padding-bottom:12px}.po-details dt{font-size:11px;color:#7890a4;margin-bottom:4px}.po-details dd{font-size:14px;white-space:pre-wrap;overflow-wrap:anywhere;margin:0;color:#284e70}.po-page input[type=checkbox]{width:16px;height:16px;accent-color:#0778e8}.po-page .po-chart .personnel-donut b{font-size:28px}
@media(min-width:1700px){.po-analytics .personnel-employment{flex-wrap:nowrap}.po-kpis .personnel-kpi strong{font-size:34px}}
@media(max-width:1450px){.po-kpis{grid-template-columns:repeat(3,minmax(0,1fr))}.po-analytics{grid-template-columns:repeat(2,minmax(0,1fr))}.po-page .personnel-photo{width:150px}.po-page .personnel-logo{width:65px}}
@media(max-width:760px){.po-analytics{grid-template-columns:1fr}.po-kpis{grid-template-columns:repeat(2,minmax(0,1fr))}.po-filter form{grid-template-columns:repeat(2,minmax(0,1fr))}.po-page .personnel-hero{flex-wrap:wrap;padding:18px}.po-page .personnel-photo{display:none}.po-page .personnel-hero-copy{min-width:200px}.po-list .personnel-pagination{flex-wrap:wrap;justify-content:center}.po-form-grid,.po-details{grid-template-columns:1fr}.po-page .personnel-card{padding:17px}.po-page .po-list{padding:0}.po-kpis .personnel-kpi>span{width:36px}.po-kpis .personnel-kpi strong{font-size:26px}.po-kpis .personnel-kpi b{font-size:11px}}