/* Shared working surfaces: consistent spacing, accessible controls and compact navigation. */
.portal-sidebar .portal-nav-section{display:flex;align-items:center;justify-content:space-between;width:100%;padding:8px 10px;margin:5px 0 2px;border:0;background:transparent;color:#a1b8cd;font-family:inherit;font-size:10px;font-weight:600;line-height:1.3;text-align:left;cursor:pointer;letter-spacing:0}
.portal-sidebar .portal-nav-section::after{content:"+";font-size:16px;font-weight:400}
.portal-sidebar .portal-nav-section[aria-expanded="true"]::after{content:"-"}
.portal-nav-button.nav-group-collapsed{display:none!important}
.portal-nav-button{min-height:40px!important;padding-block:6px!important;border-radius:6px!important;font-size:13px!important}
.portal-sidebar .portal-brand{padding-bottom:8px!important}
.portal-sidebar .portal-scope{margin-bottom:10px!important}
.portal-sidebar .portal-nav-product{background:#123e58!important;border-color:#286076!important}
.portal-content{padding:28px 30px!important}
.portal-content .app-page-head{margin-bottom:24px}
.portal-content .app-page-head h1,.hr-content .page-heading h1{font-size:30px;line-height:1.2;letter-spacing:0}
.portal-content .panel-section{box-shadow:0 3px 14px rgba(0,0,0,.25);border-radius:6px}
.portal-content .app-table th{font-size:11px;letter-spacing:0}
.portal-content .app-table td{padding-block:15px;font-size:13px}
.portal-content .app-table tbody tr:hover{background:var(--surface-hover)}
.portal-content .panel-section-head{padding:18px 20px}
.portal-content input:not([type="checkbox"]):not([type="radio"]),.portal-content select,.modal-form input:not([type="checkbox"]):not([type="radio"]),.modal-form select{min-height:42px;padding:10px 12px;border-radius:5px}
.portal-content .app-table select{max-width:100%;min-width:115px;background-color:var(--white);border:1px solid var(--line)}
.portal-shell button:focus-visible,.portal-shell a:focus-visible,.hr-shell button:focus-visible,.hr-shell a:focus-visible{outline:3px solid #39b7c6;outline-offset:3px}
.hr-central-access{border:0;border-top:1px solid var(--line);border-radius:0;background:transparent;padding-inline:0}
.hr-sidebar nav{gap:10px}
.hr-sidebar .nav-text small{display:none}
.hr-sidebar .nav-item,.hr-sidebar .back-link{min-height:44px}
.hr-content{padding:28px 30px 40px}
.hr-content .toolbar{flex-wrap:wrap;gap:10px}
.hr-content .toolbar .search{flex:1 1 240px;min-width:0}
.hr-content .toolbar select{max-width:100%;min-width:0}
.hr-main{min-width:0}
.hr-content .metrics{box-shadow:none;border-radius:6px;overflow:hidden}
.hr-content .metric{position:relative;padding:20px 22px;background:var(--white)}
.hr-content .metric::before{content:"";position:absolute;left:0;top:20px;bottom:20px;width:3px;background:var(--brand-strong)}
.hr-content .metric:nth-child(2)::before{background:#2fb8c2}
.hr-content .metric:nth-child(3)::before{background:var(--warning)}
.hr-content .metric:nth-child(4)::before{background:var(--muted)}
.hr-content .overview-panel{border:0;border-top:2px solid var(--line);background:transparent;box-shadow:none;padding:20px 0}
.hr-content .overview-item{background:transparent}
.hr-content .table-wrap{position:relative;border-radius:6px;box-shadow:none}
.hr-content tbody tr:hover{background:var(--surface-hover)}
.hr-content #employmentForm{border:0;border-top:1px solid var(--line);border-bottom:1px solid var(--line);box-shadow:none;border-radius:0;padding:22px 0;background:transparent}
.hr-content #employmentForm>.primary-button{max-width:220px;justify-self:end}
dialog{border-radius:8px}
dialog .form-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
dialog .form-grid>label,dialog .occupation-field{min-width:0}
dialog .form-grid input,dialog .form-grid select{min-width:0;width:100%;max-width:100%}
@media(max-width:640px){dialog .form-grid{grid-template-columns:minmax(0,1fr)}}
.employment-status.submitted{background:rgba(47,191,133,.14);color:#5fe0ab}
.employment-status.ready{background:rgba(7,85,173,.16);color:#7fb8ea}
.employment-status.cancelled{background:var(--surface);color:var(--muted)}
#loadFailure{margin:40px 24px;gap:14px}
@media(max-height:800px) and (min-width:901px){.portal-sidebar{padding-top:12px!important}.portal-sidebar .portal-brand img{max-height:46px;width:auto}.portal-nav-button{min-height:36px!important}.portal-nav-section{padding-block:5px!important}.portal-sidebar .portal-scope{padding-block:9px!important}}
@media(max-width:700px){.portal-content,.hr-content{padding:22px 16px 36px!important}.portal-content .app-page-head h1,.hr-content .page-heading h1{font-size:26px}.hr-content .metric{padding:16px}.hr-content #employmentForm>.primary-button{max-width:none}.occupation-field>div>.exit-open{grid-column:1/-1;width:100%}.portal-content .app-table td{font-size:12px}}
@media(prefers-reduced-motion:reduce){.portal-sidebar,.hr-sidebar,.portal-notification-drawer{transition:none!important}}