update HR dan Payroll

assets/css/app-final.css

@@ -263,6 +263,13 @@ body.app-v2 {
 	font-size: 10px;
 	color: #8d929b;
 }
+.user-copy a,
+.user-copy a:hover,
+.user-copy a:focus,
+.user-copy a:visited {
+	color: inherit;
+	text-decoration: none;
+}
 .sidebar-user > a {
 	width: 30px;
 	height: 30px;

assets/css/hr-payroll.css

@@ -0,0 +1,8 @@
+.hr-module-hero{display:flex;align-items:center;justify-content:space-between;gap:1rem;margin-bottom:1rem;padding:1.35rem 1.5rem;border-radius:18px;color:#fff;background:linear-gradient(120deg,#17284a 0%,#273e67 62%,#ed7900 100%);box-shadow:0 12px 28px rgba(21,38,70,.14)}
+.hr-module-hero span{display:block;margin-bottom:.25rem;font-size:.68rem;font-weight:800;letter-spacing:.15em;color:#ffd29f}.hr-module-hero h2{margin:0;font-size:1.45rem;line-height:1.25;color:#fff}.hr-module-hero p{margin:.35rem 0 0;max-width:760px;font-size:.85rem;color:rgba(255,255,255,.82)}
+.hr-module-nav{display:flex;gap:.35rem;margin-bottom:1rem;padding:.45rem;overflow-x:auto;border:1px solid #e2e8f0;border-radius:14px;background:#fff;box-shadow:0 5px 18px rgba(30,41,59,.05);scrollbar-width:thin}.hr-module-nav a{display:inline-flex;align-items:center;gap:.4rem;flex:0 0 auto;padding:.62rem .78rem;border-radius:10px;color:#34415a;font-size:.78rem;font-weight:700;text-decoration:none;white-space:nowrap}.hr-module-nav a:hover{background:#fff4e8;color:#b95c00}.hr-module-nav a.active{background:#1d345b;color:#fff;box-shadow:0 6px 14px rgba(29,52,91,.18)}
+body[data-page="employees"] .container.mt-4,body[data-page="shift"] .container.mt-4,body[data-page="holidays"] .container.mt-4,body[data-page="attendance_monitoring"] .container.mt-4,body[data-page="attendance_monthly"] .container.mt-4{max-width:none;margin-top:0!important;padding:0}
+.hr-panel{border:1px solid #e2e8f0!important;border-radius:16px!important;box-shadow:0 7px 20px rgba(30,41,59,.06)!important}.hr-workflow-strip{display:grid;grid-template-columns:repeat(7,minmax(115px,1fr));gap:.45rem;margin-bottom:1rem}.hr-workflow-strip span{padding:.65rem;border:1px solid #e2e8f0;border-radius:11px;background:#fff;text-align:center;font-size:.73rem;font-weight:700;color:#4b5870}.hr-workflow-strip span b{display:inline-grid;place-items:center;width:20px;height:20px;margin-right:.25rem;border-radius:50%;background:#fff0df;color:#c35d00}
+.salary-restricted-note{padding:.7rem .8rem;border:1px solid #ffd7ad;border-radius:10px;background:#fff8ef;color:#874500;font-size:.78rem}
+.payroll-table th,.payroll-table td{font-size:11px}.payroll-actions{display:flex;flex-wrap:wrap;align-items:center;gap:.35rem;min-width:230px}.payroll-actions form{margin:0}.payroll-actions .form-control,.payroll-actions .form-select{width:auto;min-width:112px}.payroll-setting-tabs{padding:.4rem;border:1px solid #e2e8f0;border-radius:14px;background:#fff;overflow-x:auto;flex-wrap:nowrap}.payroll-setting-tabs .nav-link{white-space:nowrap;color:#34415a;font-size:.78rem;font-weight:700}.payroll-setting-tabs .nav-link.active{background:#1d345b}.payroll-info-box{height:100%;padding:1rem;border:1px solid #e2e8f0;border-radius:12px;background:#f8fafc}.payroll-info-box b,.payroll-info-box span{display:block}.payroll-info-box span{margin-top:.3rem;color:#64748b;font-size:.78rem}
+@media(max-width:767.98px){.hr-module-hero{align-items:flex-start;flex-direction:column;padding:1.1rem}.hr-module-hero h2{font-size:1.2rem}.hr-workflow-strip{display:flex;overflow-x:auto}.hr-workflow-strip span{min-width:130px}}

assets/css/leave-requests.css

@@ -0,0 +1,9 @@
+.leave-hero{display:flex;align-items:center;justify-content:space-between;gap:24px;padding:24px 28px;margin-bottom:16px;border-radius:20px;color:#fff;background:linear-gradient(120deg,#172b4d 0%,#263b5f 62%,#ed7600 100%);box-shadow:0 14px 30px rgba(23,43,77,.14)}
+.leave-hero h2{margin:2px 0 5px;font-size:24px;font-weight:750}.leave-hero p{margin:0;color:rgba(255,255,255,.8)}.leave-kicker{font-size:10px;font-weight:750;letter-spacing:.16em;color:#ffbd7d}.leave-hero .btn{flex:none}
+.leave-flow{display:flex;align-items:center;justify-content:center;gap:14px;padding:12px 18px;margin-bottom:16px;border:1px solid #e2e7ef;border-radius:14px;background:#fff}.leave-flow span{display:flex;align-items:center;gap:8px}.leave-flow b{display:grid;place-items:center;width:25px;height:25px;border-radius:50%;color:#a94d00;background:#fff0df}.leave-flow small{font-weight:650;color:#34445e}.leave-flow>i{color:#aab4c4}
+.leave-metrics{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px;margin-bottom:16px}.leave-metrics article{padding:17px 19px;border:1px solid #e3e8f0;border-radius:15px;background:#fff;box-shadow:0 7px 20px rgba(23,43,77,.045)}.leave-metrics small,.leave-metrics span{display:block;color:#718096}.leave-metrics strong{display:block;margin:4px 0;font-size:22px;color:#172b4d}.leave-metrics .metric-warning{border-left:4px solid #ed7600}.leave-metrics .metric-success{border-left:4px solid #198754}
+.leave-card{overflow:hidden;border-radius:16px!important;box-shadow:0 8px 24px rgba(23,43,77,.055)}.leave-tabs{display:flex;gap:5px;padding:10px 12px;border-bottom:1px solid #e5e9f0;overflow-x:auto}.leave-tabs button{display:flex;align-items:center;gap:7px;padding:9px 13px;border:0;border-radius:10px;color:#40516c;background:transparent;white-space:nowrap}.leave-tabs button.active{color:#fff;background:#172b4d}.leave-tabs b{min-width:20px;padding:2px 6px;border-radius:99px;font-size:10px;text-align:center;color:#4b5c76;background:#edf1f7}.leave-tabs button.active b{color:#172b4d;background:#fff}
+.leave-toolbar{display:grid;grid-template-columns:minmax(220px,1fr) minmax(190px,.7fr) auto;gap:10px;padding:14px 16px;border-bottom:1px solid #e5e9f0}.leave-status{display:inline-flex;align-items:center;padding:4px 9px;border-radius:99px;font-size:10px;font-weight:750}.leave-status-draft{color:#40516c;background:#e9edf3}.leave-status-submitted{color:#984800;background:#fff0dd}.leave-status-approved{color:#087047;background:#dff5ea}.leave-status-rejected{color:#b42331;background:#fde5e8}.leave-status-cancelled{color:#687386;background:#eef0f3}
+.leave-detail-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.leave-detail-grid>span{padding:12px 14px;border:1px solid #e4e8ef;border-radius:11px;color:#718096}.leave-detail-grid strong,.leave-detail-grid small{display:block;margin-top:3px;color:#172b4d}.leave-detail-grid small{font-size:11px;color:#718096}.leave-reason{padding:14px;margin-top:12px;border-radius:11px;background:#f6f8fb}.leave-reason small{font-weight:750;letter-spacing:.08em;color:#718096}.leave-reason p{margin:6px 0 0;white-space:pre-wrap}.leave-history{list-style:none;padding:0;margin:0}.leave-history li{position:relative;display:flex;gap:11px;padding:0 0 16px 4px}.leave-history li:after{content:"";position:absolute;top:15px;bottom:0;left:9px;border-left:1px solid #d9e0e9}.leave-history li:last-child:after{display:none}.leave-history-dot{position:relative;z-index:1;width:11px;height:11px;margin-top:4px;border:3px solid #ffe0bd;border-radius:50%;background:#ed7600}.leave-history strong,.leave-history small{display:block}.leave-history small{color:#718096}.leave-history p{margin:4px 0 0;color:#44526a}
+@media(max-width:767.98px){.leave-hero{align-items:flex-start;padding:20px;flex-direction:column}.leave-flow{justify-content:flex-start;overflow-x:auto}.leave-flow small{white-space:nowrap}.leave-metrics{grid-template-columns:repeat(2,minmax(0,1fr))}.leave-toolbar{grid-template-columns:1fr}.leave-detail-grid{grid-template-columns:1fr}}
+@media(max-width:420px){.leave-metrics{grid-template-columns:1fr}}

assets/css/profile.css

@@ -0,0 +1 @@
+.profile-page{max-width:1320px;margin:0 auto}.profile-hero{display:flex;align-items:center;justify-content:space-between;gap:24px;padding:25px 28px;margin-bottom:16px;border-radius:16px;color:#fff;background:linear-gradient(115deg,#172b4d 0%,#223b63 72%,#d96c00 140%);box-shadow:0 12px 28px rgba(23,43,77,.14)}.profile-identity{display:flex;align-items:center;gap:16px}.profile-identity span{font-size:9px;font-weight:700;letter-spacing:.16em;color:#fbb96f}.profile-identity h2{margin:2px 0 3px;font-size:21px;color:#fff}.profile-identity p{margin:0;color:rgba(255,255,255,.7)}.profile-avatar-large,.profile-avatar-preview{display:grid;place-items:center;overflow:hidden;background:#ee7800;color:#fff;font-weight:700}.profile-avatar-large{width:64px;height:64px;border:3px solid rgba(255,255,255,.2);border-radius:16px;font-size:23px}.profile-avatar-large img,.profile-avatar-preview img,.user-avatar img{width:100%;height:100%;object-fit:cover}.profile-security-summary{min-width:245px;padding:12px 15px;border:1px solid rgba(255,255,255,.14);border-radius:12px;background:rgba(255,255,255,.08)}.profile-security-summary small,.profile-security-summary span{display:block;color:rgba(255,255,255,.68)}.profile-security-summary b{display:block;margin:2px 0;font-size:14px}.profile-tabs{display:flex;gap:7px;padding:6px;margin-bottom:16px;border:1px solid #e4e7ec;border-radius:13px;background:#fff}.profile-tabs a{display:flex;align-items:center;gap:8px;padding:9px 13px;border-radius:9px;color:#475467;text-decoration:none;font-weight:600}.profile-tabs a:hover{background:#f8fafc}.profile-tabs a.active{color:#fff;background:#172b4d}.profile-tabs a b{display:grid;place-items:center;min-width:19px;height:19px;padding:0 5px;border-radius:10px;background:#ee7800;color:#fff;font-size:9px}.profile-grid{display:grid;grid-template-columns:minmax(310px,.78fr) minmax(480px,1.22fr);gap:16px}.profile-stack{display:grid;gap:16px}.profile-card{overflow:hidden;padding:19px;border:1px solid #e4e7ec;border-radius:14px;background:#fff;box-shadow:0 5px 14px rgba(16,24,40,.035)}.profile-card-head{display:flex;align-items:flex-start;justify-content:space-between;gap:15px;margin-bottom:17px}.profile-card-head h5{margin:0;color:#172b4d;font-size:14px}.profile-card-head p{margin:3px 0 0;color:#667085;font-size:11px}.profile-card-head>i{font-size:20px;color:#ee7800}.profile-photo-field{display:grid;grid-template-columns:72px 1fr;align-items:center;gap:14px;margin-bottom:17px}.profile-avatar-preview{width:72px;height:72px;border-radius:14px;font-size:23px}.profile-card small{color:#667085;font-size:10px}.profile-notice{display:flex;gap:9px;padding:10px 12px;margin:14px 0;border:1px solid #fed7aa;border-radius:9px;background:#fff7ed;color:#9a4508;font-size:10.5px}.profile-count{padding:5px 9px;border-radius:20px;background:#ecfdf3;color:#087443;font-size:10px;font-weight:700}.device-list{display:grid;gap:10px}.device-row{display:grid;grid-template-columns:42px minmax(0,1fr) auto;gap:12px;align-items:start;padding:13px;border:1px solid #e4e7ec;border-radius:11px;background:#fcfcfd}.device-icon{display:grid;place-items:center;width:42px;height:42px;border-radius:10px;background:#eef4ff;color:#175cd3;font-size:19px}.device-main b{color:#172b4d}.device-main .badge{margin-left:6px}.device-main>small,.profile-table small{display:block;margin-top:2px}.device-times{display:flex;flex-wrap:wrap;gap:5px 18px;margin-top:8px;color:#667085;font-size:10px}.device-times b{color:#344054}.device-main details{margin-top:7px;color:#667085;font-size:10px}.device-main summary{cursor:pointer;color:#175cd3}.user-agent{padding:7px;margin-top:4px;border-radius:6px;background:#f2f4f7;word-break:break-word}.profile-empty{padding:28px;text-align:center;color:#667085}.profile-table{margin:0;font-size:11px}.profile-table th{background:#f8fafc;color:#475467;font-size:9px;text-transform:uppercase;letter-spacing:.04em}.profile-table td{vertical-align:middle}.profile-table .badge{font-size:9px}@media(max-width:900px){.profile-grid{grid-template-columns:1fr}.profile-hero{align-items:flex-start;flex-direction:column}.profile-security-summary{width:100%}.device-row{grid-template-columns:40px minmax(0,1fr)}.device-row form{grid-column:2}}@media(max-width:575px){.profile-hero{padding:19px}.profile-tabs a{flex:1;justify-content:center;padding:9px}.profile-tabs a span{font-size:10px}.profile-card{padding:15px}.device-times{display:grid}.profile-identity h2{font-size:18px}}