.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}}