/* Employee profile in the normal Personal page flow. */
#employeeProfile{position:static;width:100%;min-width:0;background:#fff;border-radius:18px;scroll-margin-top:90px}
#employeeProfile .profilePageHead{padding:20px 28px;display:flex;align-items:center;justify-content:space-between;gap:16px;border-bottom:1px solid #e4e9ef;flex-wrap:wrap}
#employeeProfile .profilePageHead h2{margin:0;font-size:24px}
#employeeProfile .profilePageHead button{border:1px solid #d5deeb;background:#fff;border-radius:10px;min-height:40px;padding:10px 16px;color:#25436c;cursor:pointer}
#employeeProfile .profilePageBody{padding:24px 28px 0;min-width:0}
#employeeProfile .profileTop{display:flex;align-items:center;gap:20px;margin-bottom:24px}
#employeeProfile .photo{width:80px;height:80px;object-fit:cover;flex-shrink:0;border-radius:16px}
#employeeProfile .profileIdentity{min-width:0;overflow-wrap:anywhere}
#employeeProfile .profileIdentity h2{margin:0 0 8px}
#employeeProfile .profileIdentity p{margin:8px 0}
#employeeProfile .profileTenure{display:block;margin-top:6px;text-transform:none}
#employeeProfile .profileMetrics,#employeeProfile .profileSections{display:grid!important;grid-template-columns:repeat(4,minmax(0,1fr))!important;gap:16px!important;margin:0 0 24px}
#employeeProfile .profileMetrics>div{min-width:0;padding:16px;border-radius:14px;background:#f3f6fa;overflow-wrap:anywhere}
#employeeProfile .profileMetrics b{display:block;margin-top:8px}
#employeeProfile .profileSections .card{min-width:0;height:100%;margin:0;padding:18px;background:#f3f6fa;border-radius:14px;overflow-wrap:anywhere}
#employeeProfile .profileSections h3{margin:0 0 16px;font-size:15px}
#employeeProfile dl{margin:0}
#employeeProfile .profileDatum+.profileDatum{margin-top:14px}
#employeeProfile dt{font-size:11px;color:#748196;margin-bottom:4px;text-transform:none;font-weight:600}
#employeeProfile dd{margin:0;font-size:13px;text-transform:none;overflow-wrap:anywhere}
#employeeProfile .profileEmail{text-transform:lowercase!important}
#employeeProfile .profileEmpty{color:#748196!important;text-transform:none}
#employeeProfile .drawerFoot{position:static!important;margin:0!important;padding:16px 0 20px!important;display:flex!important;justify-content:flex-end;gap:8px;border-top:1px solid #e4e9ef;background:white;flex-wrap:wrap}
#employeeProfile .drawerFoot button{min-height:40px;padding:10px 16px;border:1px solid #d5deeb;background:white;color:#25436c;border-radius:10px;text-transform:none}
#employeeProfile .drawerFoot .save{background:var(--blue,#2563eb)!important;color:white!important;border-color:var(--blue,#2563eb)}
@media(max-width:999px){#employeeProfile .profileMetrics,#employeeProfile .profileSections{grid-template-columns:repeat(2,minmax(0,1fr))!important}}
@media(max-width:639px){#employeeProfile .profileMetrics,#employeeProfile .profileSections{grid-template-columns:1fr!important}#employeeProfile .profileTop{gap:14px}#employeeProfile .photo{width:64px;height:64px}#employeeProfile .profileIdentity h2{font-size:19px}#employeeProfile .drawerFoot button{width:100%}}

@media(max-width:639px){#employeeProfile .profilePageHead{padding:18px}#employeeProfile .profilePageBody{padding:20px 18px 0}#employeeProfile .profilePageHead h2{font-size:20px}}
@media print{
 body:has(#employeeProfile)>*:not(main){display:none!important}
 body:has(#employeeProfile) main{display:block!important;margin:0!important;padding:0!important;width:100%!important;max-width:none!important}
 body:has(#employeeProfile) main>*:not(#content){display:none!important}
 body:has(#employeeProfile) #content{display:block!important;overflow:visible!important;border:0!important}
 #employeeProfile .drawerFoot,#employeeProfile .profilePageHead button{display:none!important}
 #employeeProfile .profileMetrics,#employeeProfile .profileSections{grid-template-columns:repeat(4,minmax(0,1fr))!important}
}