body{margin:0;font-family:Inter,Arial,sans-serif;background:#f4f6f8;color:#111827;overflow:hidden}.login{min-height:100vh;display:grid;place-items:center}.loginCard{width:360px}.card{background:#fff;border-radius:14px;padding:20px;box-shadow:0 8px 24px #0000000f;margin:16px 0}input,textarea{width:100%;padding:12px;margin:8px 0;border:1px solid #d1d5db;border-radius:10px}button{border:0;background:#111827;color:#fff;border-radius:10px;padding:12px 16px;cursor:pointer}.err{color:#b91c1c}.app{display:flex;min-height:100vh}aside{width:18%;background:#111827;color:#fff;padding:20px;display:flex;flex-direction:column;gap:8px}aside h2{margin:0 0 18px}aside a,.logout{display:flex;gap:10px;align-items:center;color:#fff;text-decoration:none;padding:11px;border-radius:10px;background:transparent;text-align:left}.logout{margin-top:auto;background:#374151}aside a:hover{background:#374151}main{flex:1;padding:5px;width:82%}header{display:flex;justify-content:space-between;align-items:center;background:#fff;padding:10px 20px;border-radius:14px;box-shadow:0 8px 24px #0000000d}h1{font-size:22px;margin:0}.grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:16px}.metric span{text-transform:capitalize;color:#6b7280}.metric b{display:block;font-size:34px;margin-top:10px}table{width:100%;border-collapse:collapse}th,td{text-align:left;padding:12px;border-bottom:1px solid #e5e7eb;vertical-align:top}th{background:#f9fafb}.answer{background:#f9fafb;padding:14px;border-radius:10px}.form-page-content{width:min(1120px,calc(100% - 32px));margin:28px auto 48px}.page{width:100%}.form-page-header{margin-bottom:20px;display:flex;align-items:flex-start;justify-content:space-between;gap:18px}.form-title-group h1{margin:0;color:#172033;font-size:30px;line-height:1.15}.form-title-group p{margin:8px 0 0;color:#68778b;font-size:13px}.compact-title-group h1{color:#416d9c;font-size:24px}.form-panel{overflow:hidden;border:1px solid #b8d2f0;border-radius:8px;background:#f4f8ff;box-shadow:0 12px 34px #2a69b01f}.panel-header{padding:10px 22px;border-bottom:1px solid #cfe0f5;display:flex;align-items:center;justify-content:space-between;gap:18px;background:#eaf3ff}.panel-title{display:flex;align-items:center;gap:12px}.panel-icon{width:44px;height:44px;border-radius:8px;display:grid;place-items:center;background:#e8f1fb;color:#416d9c}.panel-title h2{margin:0;color:#1f2d3d;font-size:18px}.panel-title p{margin:5px 0 0;color:#eef2f7;font-size:12px}.form-message{margin:18px 22px 0;padding:10px 12px;border:1px solid #b9dec8;border-radius:8px;background:#effaf3;color:#247346;font-size:13px;font-weight:700}.form-grid{height:430px;overflow:auto;padding:22px;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px 20px}.form-grid label{min-width:0;display:grid;gap:8px;color:#34475c;font-size:12px;font-weight:700;max-height:20px}.form-grid label.full-width{grid-column:1 / -1}.label-text{color:#34475c;font-size:12px;font-weight:700}.required{color:#d84f49}.input-shell{min-height:42px;border:1px solid #b8d2f0;border-radius:8px;display:flex;align-items:center;gap:9px;background:#f8fbff;color:#4f78a8;transition:border-color .2s ease,box-shadow .2s ease}.input-shell:focus-within{border-color:#416d9c;background:#fff;box-shadow:0 0 0 3px #416d9c24}.input-shell>svg{margin-left:12px;flex:0 0 auto}.input-shell input,.input-shell select{width:100%;height:25px;min-width:0;border:none;outline:none;background:transparent;color:#263548;font-size:13px}.input-shell input::placeholder{color:#98a5b4}.input-shell select{padding-right:10px}.field-chip{margin-right:8px;padding:4px 7px;border-radius:6px;background:#dcecff;color:#416d9c;font-size:10px;font-weight:800}.form-actions{padding:10px 22px;border-top:1px solid #cfe0f5;display:flex;justify-content:flex-end;gap:10px;background:#eaf3ff}.primary-button,.secondary-button{min-height:38px;border-radius:8px;display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:0 15px;font-size:13px;font-weight:800;cursor:pointer}.primary-button{border:1px solid #416d9c;background:#416d9c;color:#fff}.primary-button:hover{border-color:#315b89;background:#315b89}.secondary-button{border:1px solid #ccd7e4;background:#fff;color:#4b5d70}.secondary-button:hover{background:#f4f7fb}.clear-button{flex:0 0 auto}@media(max-width:720px){.app-nav{padding:12px 16px;flex-direction:column;align-items:stretch}.app-nav a{justify-content:center}.form-page-content{width:calc(100% - 32px);margin:20px auto 34px}.form-page-header,.panel-header{flex-direction:column;align-items:stretch}.form-title-group h1{font-size:25px}.clear-button{width:100%}.form-grid{grid-template-columns:1fr}.form-grid label.full-width{grid-column:auto}.form-actions{flex-direction:column}.primary-button,.secondary-button{width:100%}}.textarea-shell{min-height:112px;align-items:flex-start;padding-top:12px}.input-shell textarea{width:100%;min-height:92px;min-width:0;resize:vertical;border:none;outline:none;background:transparent;color:#263548;font-size:13px;line-height:1.45}.input-shell textarea::placeholder{color:#98a5b4}*{box-sizing:border-box}.employee-page{width:100%;min-height:calc(100vh - 64px);padding:12px;border:1px solid #8b8e92;background:#f3f7fc;color:#1f2937;font-family:Inter,Arial,sans-serif}.employee-page-heading{display:flex;align-items:center;justify-content:space-between;gap:12px;margin:0 0 10px;padding:2px 4px}.employee-page-heading h1{margin:0;color:#102a50;font-size:21px;line-height:1.2;letter-spacing:0}.employee-page-heading p{margin:3px 0 0;color:#536981;font-size:10px}.employee-clear-button,.employee-form-actions button,.employee-add-row-button{min-height:34px;border:1px solid #cfdbe9;border-radius:6px;display:inline-flex;align-items:center;justify-content:center;gap:7px;background:#fff;color:#29405d;padding:0 11px;font-size:11px;font-weight:800;box-shadow:0 2px 6px #20334e1a;cursor:pointer}.employee-clear-button:hover,.employee-form-actions button:hover,.employee-add-row-button:hover{border-color:#9db6d5;background:#f8fbff}.employee-message{margin-bottom:10px;padding:8px 12px;border-radius:5px;font-size:13px;font-weight:700}.employee-message.success{border:1px solid #86efac;background:#f0fdf4;color:#15803d}.employee-message.error{border:1px solid #fecaca;background:#fef2f2;color:#b91c1c}.employee-form{height:480px;overflow:auto;gap:10px}.employee-section{overflow:hidden;border:1px solid #d8e4f2;border-radius:8px;background:#fff;box-shadow:0 6px 16px #1c2f4c0f}.employee-section-heading{min-height:38px;padding:9px 16px 7px;display:flex;align-items:center;justify-content:space-between;gap:12px;background:#fff}.employee-section-heading h2{margin:0;color:#102a50;font-size:14px;font-weight:800}.employee-two-column-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px 16px;padding:0 16px 14px}.employee-column{min-width:0;display:grid;align-content:start;gap:8px}.employee-details-grid,.document-details-grid{display:grid;gap:9px;padding:0 16px 14px}.employee-details-row{display:grid;gap:14px}.employee-details-row.row-three{grid-template-columns:repeat(3,minmax(0,1fr))}.employee-details-row.row-four{grid-template-columns:.76fr 1.12fr 1fr 1fr}.document-main-row{grid-template-columns:1fr 1fr 1fr 1fr}.employee-details-row.row-two{grid-template-columns:repeat(2,minmax(0,1fr))}.employee-details-row .compact-field{max-width:180px}.employee-details-grid .employee-field,.document-details-grid .employee-field{grid-template-columns:1fr;align-items:start;gap:5px}.employee-field{min-width:0;display:grid;grid-template-columns:205px minmax(0,1fr);align-items:center;gap:8px}.employee-label{color:#0f1f38;font-size:10.5px;font-weight:800}.required{margin-left:2px;color:#dc2626}.employee-field input,.employee-field select,.employee-field textarea{width:100%;min-width:0;height:32px;border:1px solid #cfdded;border-radius:5px;padding:5px 10px;background:#fbfdff;color:#263548;font:inherit;font-size:10.5px;font-weight:700;outline:none;transition:border-color .2s ease,box-shadow .2s ease,background-color .2s ease}.employee-field textarea{min-height:52px;height:auto;resize:vertical}.employee-field input::placeholder,.employee-field textarea::placeholder{color:#71839a}.employee-field input:focus,.employee-field select:focus,.employee-field textarea:focus{border-color:#2563eb;background:#fff;box-shadow:0 0 0 3px #2563eb1c}.employee-name-fields{display:grid;grid-template-columns:72px minmax(0,1fr);gap:7px}.checkbox-field{min-height:32px;border:1px solid #cfdded;border-radius:5px;padding:0 10px;display:flex;align-items:center;gap:7px;background:#fbfdff;color:#263548;font-size:10.5px;font-weight:700}.checkbox-field input{width:15px;height:15px}.radio-group{min-height:32px;border:1px solid #cfdded;border-radius:5px;padding:0 10px;display:flex;align-items:center;gap:24px;background:#fbfdff}.radio-group label{display:flex;align-items:center;gap:6px;color:#263548;font-size:10.5px;font-weight:700}.radio-group input{width:14px;height:14px}.upload-button{min-height:32px;padding:5px 10px;border:none;border-radius:5px;display:inline-flex;align-items:center;justify-content:center;gap:6px;background:#2563eb;color:#fff;font-size:10.5px;font-weight:800;box-shadow:0 6px 14px #2563eb3d;cursor:pointer}.upload-button:hover{background:#1d4ed8}.upload-button input{display:none}.document-upload-field>.upload-button{width:100%}.employee-add-row-button{width:max-content;margin:0 16px 10px}.employee-section-heading .employee-add-row-button{margin:0}.section-content{padding-top:0}.full-row-field{grid-column:1 / -1}.employee-form-actions{padding:10px 12px;border:1px solid #d8e4f2;border-radius:8px;display:flex;justify-content:flex-end;gap:10px;background:#fff;box-shadow:0 6px 16px #1c2f4c0f}.employee-form-actions .employee-save-button{border-color:#2563eb;background:#2563eb;color:#fff;box-shadow:0 8px 18px #2563eb47}.employee-form-actions .employee-save-button:hover{background:#1d4ed8}@media(max-width:900px){.employee-two-column-grid{grid-template-columns:1fr}.employee-details-row.row-three,.employee-details-row.row-four{grid-template-columns:repeat(2,minmax(0,1fr))}.employee-details-row .compact-field{max-width:none}}@media(max-width:700px){.employee-page{padding:10px}.employee-page-heading{align-items:stretch;flex-direction:column;margin-bottom:10px;padding:0}.employee-field{grid-template-columns:1fr;gap:5px}.employee-details-row.row-three,.employee-details-row.row-four,.employee-details-row.row-two{grid-template-columns:1fr}.employee-form-actions{flex-direction:column}.employee-form-actions button,.employee-clear-button{width:100%}}.ultra-thin-scroll{scrollbar-width:none;scrollbar-color:#c0c0c0 transparent}.ultra-thin-scroll::-webkit-scrollbar{width:1px;height:1px}.ultra-thin-scroll::-webkit-scrollbar-track{background:transparent}.ultra-thin-scroll::-webkit-scrollbar-thumb{background-color:silver;border-radius:1px}.ultra-thin-scroll::-webkit-scrollbar-thumb:hover{background-color:#a0a0a0}
