/* Native Django components extending the selected Northstar reference. */
[hidden]{display:none!important}a{text-decoration:none}a:hover{color:var(--accent)}input,select,textarea{max-width:100%;border:1px solid var(--line);border-radius:4px;padding:8px 10px;background:white;color:var(--text)}input:not([type=checkbox]):not([type=radio]),select,textarea{width:100%;min-height:36px}input[type=checkbox]{width:16px;height:16px;accent-color:var(--accent)}textarea{height:auto!important}.field label{display:block;margin-bottom:7px;font-size:11px;font-weight:600}.field small{display:block;color:var(--muted);margin-top:6px;font-size:10px}.field .control{font-size:12px}.field input:disabled{background:var(--soft);color:var(--muted)}.required,.errorlist{color:var(--danger)}.errorlist{padding:9px 13px;background:#fff1ee;border-radius:4px;font-size:12px;list-style:none}.has-error input{border-color:var(--danger)}.form-footer{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-top:22px;padding-top:18px;border-top:1px solid var(--line)}.reason-field{margin-top:24px;max-width:700px}.source-form{max-width:1100px}.nav-number{font-size:10px;opacity:.65;font-variant-numeric:tabular-nums}.nav-item{font-size:12px}.side-nav .app-brand{padding-left:9px;padding-right:0}.brand-copy strong{font-size:12px}.stat-denominator{font-size:16px;color:var(--muted);font-weight:400}.section-gap{margin-top:24px}.block{display:block;margin-top:5px}.column-picker{position:relative}.column-picker summary{cursor:pointer}.column-picker label{display:inline-flex;align-items:center;gap:5px;padding:7px}.profile-nav a{display:block;padding:11px 12px;border-left:2px solid transparent;font-size:12px;color:var(--muted)}.profile-nav a.active{border-color:var(--accent);background:var(--tint);color:var(--accent)}.profile-details h3{margin-bottom:14px}.profile-details .panel{margin-bottom:18px}.profile-details dl{margin:0}.profile-details dd{margin:0}.profile-details .prop-row{grid-template-columns:42% 1fr}.tabs a{display:block;padding:11px 2px}.note{font-size:12px}.lifecycle{display:flex;gap:6px;margin:20px 0}.lifecycle span{padding:10px 13px;background:var(--soft);border:1px solid var(--line);border-radius:4px;font-size:11px}.lifecycle .current{background:var(--tint);color:var(--accent);border-color:var(--accent)}.button-form{display:inline-flex;gap:7px;align-items:center}.compact-input{max-width:230px}.table-wrap td .button-form{min-width:280px}.table-wrap td .button-form input{width:150px}.login-layout{max-width:1000px;min-height:100vh;display:grid;grid-template-columns:1fr 420px;align-items:center;gap:90px;margin:auto;padding:40px}.login-brand .brand-mark{margin-bottom:42px}.login-brand h1{font-size:40px;line-height:1.17;margin-bottom:24px}.login-brand p{margin:22px 0}.login-card{padding:32px}.login-card h2{margin-bottom:10px}.login-card form{margin-top:25px}.login-card .field{margin-bottom:18px}.login-card button{width:100%;margin-top:8px}.login-card .note{margin-bottom:0}.report-selector{width:270px!important}.settings-layout{display:grid;grid-template-columns:215px minmax(0,1fr);gap:22px}.audit-json{white-space:pre-wrap;word-break:break-word;max-width:100%;max-height:220px;overflow:auto;font-size:11px}.badge{line-height:1.2}.record-card{margin-bottom:16px}.record-card .between{margin-bottom:12px}.wrap-text{white-space:normal;word-break:break-word}.muted-value{color:var(--muted)}.review-grid{display:grid;grid-template-columns:1fr 1fr;gap:8px 18px}.review-grid div{padding:8px 0;border-bottom:1px solid var(--line)}.review-grid small{display:block;color:var(--muted);margin-bottom:4px}.payslip{max-width:840px;margin:auto}.payslip table{width:100%;border-collapse:collapse}.payslip th{position:static}.payslip .total{font-weight:700;background:var(--tint)}.derived-field .badge{margin-left:4px;font-size:8px}.table-wrap td{max-width:360px}.filterbar select{width:auto}.filterbar input{width:100%}.topbar form{margin:0}.settings-nav{display:flex;flex-direction:column;gap:4px}.settings-nav a{padding:11px;border-radius:4px;color:var(--muted);font-size:12px}.settings-nav a.active{background:var(--tint);color:var(--accent);font-weight:600}
.form-footer{position:static;bottom:auto}.form-page{padding-bottom:0}
.edit-save-bar{display:flex;align-items:end;gap:12px;margin-top:22px;padding:16px;border:1px solid var(--line);border-radius:6px;background:var(--soft)}.edit-save-bar .field{flex:1;min-width:0}.edit-save-bar .btn{white-space:nowrap}@media(max-width:600px){.edit-save-bar{align-items:stretch;flex-direction:column}.edit-save-bar .btn{width:100%}}
.employee-export-picker{position:relative}.employee-export-picker>summary{list-style:none;cursor:pointer}.employee-export-picker>summary::-webkit-details-marker{display:none}.employee-export-picker>.panel{position:absolute;right:0;top:calc(100% + 8px);width:315px;max-width:calc(100vw - 36px);z-index:35;box-shadow:0 12px 30px #172c3830}.employee-export-picker .btn.block{display:block;margin-bottom:8px;text-align:left}.employee-export-picker small{line-height:1.5}@media(max-width:600px){.employee-export-picker>.panel{right:auto;left:0}}
@media(max-width:1100px){.content{padding:22px 20px}.form-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.split{grid-template-columns:1fr}.form-layout{grid-template-columns:1fr}.form-layout>aside{display:none}.summary-strip .stat{padding:16px}.profile-head{flex-wrap:wrap}}
@media(max-width:800px){.side-nav{transform:translateX(-100%)}.side-nav.open{transform:none;box-shadow:0 0 0 100vmax #0005}.workspace{margin-left:0}.mobile-menu{display:inline-flex}.summary-strip{grid-template-columns:repeat(2,1fr)}.equal{grid-template-columns:1fr}.topbar-right>span{display:none}.pagehead{align-items:flex-start;flex-direction:column}.profile-body,.record-layout,.settings-layout{grid-template-columns:1fr}.profile-nav,.settings-nav{flex-direction:row;overflow:auto}.login-layout{grid-template-columns:1fr;gap:20px;max-width:500px}.login-brand{display:none}.form-grid{grid-template-columns:1fr 1fr}.lifecycle{overflow:auto}}
@media print{.side-nav,.topbar,.page-foot,.no-print{display:none!important}.workspace{margin:0}.content{padding:0}.panel{border:0;box-shadow:none}}

/* Manual attendance calendar preview. */
/* Closing guidance and dated attendance views. */
.closing-step>summary{cursor:pointer;font-size:15px}.closing-step>summary .badge{float:right}.closing-step>summary:focus-visible{outline:2px solid var(--accent);outline-offset:6px}
.table-wrap.full-height{max-height:none;overflow-y:visible}.closing-steps{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:10px;margin-top:24px}.closing-steps a{display:flex;flex-direction:column;gap:10px;padding:16px;border:1px solid var(--line);border-radius:5px;background:#fff}.closing-steps strong{font-size:12px}.closing-status{font-size:18px!important}.closing-step{scroll-margin-top:22px}.closing-employee{margin-top:14px;border-top:1px solid var(--line);padding-top:12px}.closing-employee summary{cursor:pointer;font-size:12px;font-weight:600}.closing-employee .line-item{gap:14px}.closing-employee .line-item>span{flex:1}.closing-employee .line-item a{flex-shrink:0}.calendar-filters{display:flex;flex-wrap:wrap;align-items:end;gap:14px}.calendar-filters .field{flex:1 1 170px;min-width:0}.calendar-scroll{overflow-x:auto;border:1px solid var(--line);border-radius:6px;background:white}.month-calendar{width:100%;min-width:900px;table-layout:fixed;border-collapse:collapse}.month-calendar th{position:static;padding:12px 8px;font-size:11px;background:var(--soft)}.month-calendar td{vertical-align:top;height:120px;border:1px solid var(--line);padding:9px;overflow-wrap:anywhere}.month-calendar time{font-weight:600}.month-calendar .outside-month{background:#f5f7fa;color:var(--muted)}.calendar-today{box-shadow:inset 0 0 0 2px var(--accent)}.calendar-event{display:block;font-size:10px;padding:7px;margin-top:7px;border-left:3px solid var(--accent);background:var(--tint);border-radius:3px}.calendar-event strong,.calendar-event span,.calendar-event small{display:block;margin-bottom:3px}.event-pending,.event-review{border-color:#b7791f;background:#fff8e9}.event-non_leave{border-color:#687787;background:#edf0f4}.event-rejected{border-color:#aa5960;background:#fff1ee}#calendar-events tr:target{background:var(--tint)}
@media(max-width:1100px){.closing-steps{grid-template-columns:repeat(3,minmax(0,1fr))}}@media(max-width:800px){.closing-steps{grid-template-columns:repeat(2,minmax(0,1fr))}.closing-employee .line-item{flex-wrap:wrap}.calendar-filters .field{flex-basis:100%}}@media print{.calendar-scroll{overflow:visible}.month-calendar{min-width:0}}
.attendance-fill-form .weekday-field{border:0;padding:0;margin:0;min-width:0}.attendance-fill-form .weekday-field legend{font-size:11px;font-weight:600;margin-bottom:12px}.attendance-fill-form .weekday-field label,.attendance-fill-form .fill-confirm{display:flex;align-items:center;gap:8px;margin-bottom:9px}.attendance-fill-form input[type=checkbox]{flex:none;margin:0}.attendance-fill-form details{max-width:320px}.attendance-fill-form summary{cursor:pointer}.attendance-fill-form details small{white-space:normal;line-height:1.8}

/* Payroll review keeps each employee's money on one readable row. */
.payroll-review-wrap{overflow-x:hidden;max-height:none;max-width:1020px;margin-right:auto}
.payroll-review-wrap .payroll-review-table{width:100%;min-width:0;table-layout:fixed}
.payroll-col-person{width:22%}.payroll-col-base{width:14%}.payroll-col-earnings{width:26%}.payroll-col-deductions{width:25%}.payroll-col-net{width:13%}
.payroll-review-table th{white-space:normal;padding:11px 8px}.payroll-review-table td{padding:12px 8px;overflow-wrap:anywhere;max-width:none;vertical-align:top}
.payroll-person>strong{display:block}.payroll-person .badge{display:inline-block;margin-top:7px}.payroll-payslip-link{display:block;margin-top:8px;font-size:11px;font-weight:600}
.payroll-amount{text-align:right;font-variant-numeric:tabular-nums;white-space:nowrap}
.payroll-mini-grid{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:3px 7px;font-size:10px;line-height:1.35}
.payroll-mini-grid span{color:var(--muted)}.payroll-mini-grid strong{text-align:right;font-weight:600;font-variant-numeric:tabular-nums;white-space:nowrap}.payroll-tax-link{grid-column:1/-1;margin-top:4px}
.payroll-mini-grid .payroll-subtotal{border-top:1px solid var(--line);padding-top:5px;margin-top:3px;color:var(--text);font-weight:700}.payroll-net strong{color:var(--accent);font-size:12px}
@media(max-width:1200px){.payroll-review-table,.payroll-review-table tbody{display:block}.payroll-review-table colgroup,.payroll-review-table thead{display:none}.payroll-review-table tbody tr{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 16px;border-bottom:1px solid var(--line);padding:10px 14px}.payroll-review-table tbody tr:last-child{border-bottom:0}.payroll-review-table td{display:block;border:0;padding:7px 0;min-width:0}.payroll-review-table td::before{content:attr(data-label);display:block;color:var(--muted);font-size:10px;font-weight:600;margin-bottom:4px}.payroll-review-table td:first-child{grid-column:1/-1;border-bottom:1px solid var(--line);margin-bottom:5px}.payroll-review-table .payroll-amount{text-align:left}.payroll-review-table .payroll-amount strong{white-space:normal}}
@media(max-width:440px){.payroll-review-table tbody tr{grid-template-columns:1fr}.payroll-review-table td:first-child{grid-column:1}}
