*{margin:0;padding:0;font-family:Open Sans,sans-serif}.layout-container{flex-direction:column;height:100vh;font-family:Arial,sans-serif;display:flex}.layout-navbar{color:#fff;background-color:#1e293b;justify-content:space-between;align-items:center;height:60px;padding:0 20px;display:flex}.layout-logo{margin:0}.layout-menu{gap:15px;display:flex}.menu-item{color:#cbd5f5;border-radius:6px;padding:8px 12px;text-decoration:none;transition:all .2s}.menu-item:hover{color:#fff;background-color:#334155}.menu-item.active{color:#fff;background-color:#3b82f6}.layout-content{background-color:#f1f5f9;flex:1;padding:20px}.dashboard-container{background:#f6f7fb;min-height:100vh;padding:30px}.top-bar{color:#fff;background-color:#1f2937;border-radius:10px;justify-content:space-between;align-items:center;margin-bottom:25px;padding:18px 25px;display:flex;box-shadow:0 4px 12px #00000014}.top-bar-title{font-size:18px;font-weight:600}.table-container{background:#fff;border-radius:12px;padding:20px;box-shadow:0 6px 20px #0000000f}.grid-row{grid-template-columns:2.2fr 1fr 1.5fr 1fr 1fr 1fr 140px;align-items:center;gap:12px;padding:14px 10px;display:grid}.table-header{color:#6b7280;text-transform:uppercase;border-bottom:1px solid #e5e7eb;font-size:13px}.table-item{border-bottom:1px solid #f1f1f1}.employee-info{align-items:center;gap:10px;display:flex}.avatar{object-fit:cover;border-radius:50%;flex-shrink:0;width:44px;height:44px}.actions{justify-content:center;align-items:center;gap:8px;display:flex}.btn-edit,.btn-info{cursor:pointer;color:#fff;border:none;border-radius:6px;padding:7px 12px;font-size:13px}.btn-edit{background:#3b82f6}.btn-info{background:#10b981}.text-center,.status-toggle-wrapper{justify-content:center;align-items:center;display:flex}.status-toggle{cursor:pointer;background:#ef4444;border:none;border-radius:999px;justify-content:center;align-items:center;width:94px;height:34px;padding:0;transition:all .25s;display:flex;position:relative;overflow:hidden}.status-toggle.active{background:#22c55e}.status-toggle .knob{background:#fff;border-radius:50%;width:26px;height:26px;transition:transform .25s;position:absolute;top:4px;left:4px;box-shadow:0 2px 8px #00000026}.status-toggle.active .knob{transform:translate(60px)}.status-text{color:#fff;z-index:2;pointer-events:none;font-size:12px;font-weight:600}.status-toggle.active .status-text{color:#fff}.status-toggle:active{transform:scale(.96)}*{font-family:Open Sans,sans-serif}.hr-container{background:#f4f5f7;height:100vh;display:flex}.hr-sidebar{background:#ccc;border-right:1px solid #bbb;flex-direction:column;width:250px;display:flex}.hr-brand{color:#fff;text-align:center;background:#e60023;padding:20px;font-size:22px;font-weight:700}.hr-brand span{font-size:12px;font-weight:400;display:block}.hr-accordion-header{cursor:pointer;border-bottom:1px solid #bbb;justify-content:space-between;padding:15px;font-weight:700;display:flex}.hr-accordion-header.active{background:#aaa}.hr-accordion-body{background:#e4e4e4;max-height:0;transition:all .3s;overflow:hidden}.hr-accordion-body.open{max-height:300px}.hr-sub-item{color:#333;padding:12px 30px;text-decoration:none;display:block}.hr-sub-item.active{background:#c5c5c5}.hr-main{flex-direction:column;flex:1;display:flex}.hr-topbar{color:#fff;background:#2c2c2c;justify-content:space-between;align-items:center;padding:15px 25px;display:flex}.hr-title{font-size:18px;font-weight:700}.hr-actions{align-items:center;gap:10px;display:flex}.badge{background:#fff;border-radius:20px;padding:6px 12px;font-weight:700}.badge.active{color:#73c000}.badge.passive{color:#e60023}.btn-add{color:#fff;cursor:pointer;background:#73c000;border:none;border-radius:6px;padding:8px 16px}.hr-content{padding:25px;overflow-y:auto}.create-page{background:#f4f5f7;min-height:100vh;padding:30px}.create-header{color:#fff;background:#2c2c2c;border-radius:8px;margin-bottom:20px;padding:15px 20px}.create-form{background:#fff;border-radius:10px;padding:25px}.section-title{color:#e60023;margin:25px 0 12px;font-weight:700}.grid-2,.grid-3{grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:20px;margin-bottom:10px;display:grid}input,select,textarea{box-sizing:border-box;border:1px solid #ccc;border-radius:6px;outline:none;width:100%;padding:10px;font-size:14px}textarea{resize:vertical;min-height:80px}.photo-wrapper{flex-direction:column;align-items:center;gap:10px;margin-bottom:20px;display:flex}.photo-box{cursor:pointer;color:#666;text-align:center;background:#fafafa;border:2px dashed #bbb;border-radius:50%;justify-content:center;align-items:center;width:140px;height:140px;font-weight:600;transition:all .2s;display:flex;position:relative;overflow:hidden}.photo-box:hover{background:#f2f2f2;border-color:#73c000}.photo-box input{opacity:0;cursor:pointer;position:absolute;inset:0}.avatar-img{object-fit:cover;border-radius:50%;width:100%;height:100%}.file-grid{grid-template-columns:1fr 1fr;gap:15px;display:grid}.file-item{background:#fafafa;border:1px solid #e2e2e2;border-radius:8px;flex-direction:column;gap:8px;padding:12px;transition:all .2s;display:flex}.file-item:hover{background:#f3f3f3;border-color:#d6d6d6}.file-item span{font-size:13px;font-weight:600}.file-input-box{cursor:pointer;color:#444;background:#fff;border:1px dashed #bbb;border-radius:8px;justify-content:center;align-items:center;padding:12px;font-size:13px;font-weight:600;transition:all .2s;display:flex;position:relative}.file-input-box:hover{background:#f7fdf3;border-color:#73c000;transform:translateY(-1px)}.file-input-box input{opacity:0;cursor:pointer;position:absolute;inset:0}.file-item small{color:#666;text-overflow:ellipsis;white-space:nowrap;font-size:12px;overflow:hidden}.actions{justify-content:flex-end;gap:10px;margin-top:25px;display:flex}.cancel{cursor:pointer;background:#ccc;border:none;border-radius:6px;padding:10px 20px}.save{color:#fff;cursor:pointer;background:#73c000;border:none;border-radius:6px;padding:10px 20px}.error-message{color:#ef4444;align-items:center;gap:4px;margin-top:6px;font-size:12px;display:flex}.required-star{color:#ef4444;margin-left:4px;font-weight:700}.field-value{background:#f8fafc;border:1px solid #e5e7eb;border-radius:8px;align-items:center;min-height:38px;padding:10px 12px;font-size:14px;display:flex}.field-value.multiline{white-space:pre-line;align-items:flex-start}.avatar-img{object-fit:cover;border:3px solid #e5e7eb;border-radius:50%;width:120px;height:120px}.file-card{background:#fff;border:1px solid #e5e7eb;border-radius:12px;flex-direction:column;justify-content:space-between;gap:12px;padding:14px;transition:all .2s;display:flex}.file-card:hover{border-color:#cbd5f5;box-shadow:0 4px 12px #0000000d}.file-title{color:#374151;font-size:14px;font-weight:500}.file-button{color:#4f46e5;cursor:pointer;background:#eef2ff;border:none;border-radius:8px;padding:8px 12px;font-size:13px;font-weight:500;transition:all .2s}.file-button:hover{color:#fff;background:#4f46e5}.file-button:active{transform:scale(.97)}