/* Scoped attendance workflow; all colours follow the selected theme. */
.department-filter{min-width:260px;max-width:420px;flex:1 1 280px}
.department-filter select{width:100%}
.insight-department-filter{min-width:260px;flex:1 1 280px}
.overview-rankings{margin-top:24px}
.password-required-screen{min-height:100vh;display:grid;place-items:center;padding:28px;background:var(--bg)}
.password-required-card{width:min(100%,520px);padding:32px;background:var(--surface);border:1px solid var(--line);border-radius:14px;box-shadow:0 14px 44px var(--shadow-color)}
.password-required-card h1{font-size:28px;line-height:1.2;margin:14px 0}
.password-required-card p{font-size:16px;line-height:1.6;color:var(--muted);margin:0 0 24px}
.password-required-card form{display:flex;flex-direction:column;gap:18px}
.password-required-card .hint{font-size:14px;line-height:1.5}
.password-required-card>button{margin-top:22px}
.account-row-actions{display:flex;gap:8px;flex-wrap:wrap}
.temporary-credentials p{font-size:16px;line-height:1.6;margin-bottom:22px}
.temporary-credentials .form-field{margin-bottom:18px}
.temporary-credentials input{font-family:ui-monospace,monospace;font-size:17px}
@media(max-width:640px){.department-filter,.insight-department-filter{min-width:0;width:100%;max-width:none;flex-basis:100%}.password-required-screen{padding:16px}.password-required-card{padding:24px 18px}.password-required-card h1{font-size:25px}.temporary-credentials .form-actions{flex-direction:column}}
@media(max-width:760px){.filters .filter-field{min-width:0;flex:1 1 calc(50% - 7px);width:auto}.filters .filter-field.department-filter,.filters .filter-field.office-filter{flex:0 0 100%;width:100%;max-width:none;min-width:0}.filters .filter-field input,.filters .filter-field select{width:100%;min-width:0}.filters .filter-spacer{display:none}}
.attendance-head-badges{display:flex;gap:8px;flex-wrap:wrap;justify-content:flex-end}
.attendance-marks-table .day-marks{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;min-width:88px;min-height:68px;width:100%;padding:8px 7px;font-size:15px;border:1px solid transparent}
.attendance-marks-table .day-marks:hover{border-color:var(--accent-line);background:var(--accent-soft)}
.attendance-marks-table th:first-child,.attendance-marks-table td:first-child{min-width:235px;max-width:290px}
.attendance-marks-table th:nth-last-child(-n+3),.attendance-marks-table td:nth-last-child(-n+3){min-width:115px}
.day-mark{display:flex;align-items:center;gap:6px;font-size:15px;line-height:1.35;font-variant-numeric:tabular-nums;white-space:nowrap}
.day-mark i{font-style:normal;font-size:14px;font-weight:400;opacity:.75}
.day-mark b{font-weight:650}
.day-no-marks{font-size:15px;font-weight:500}
.day-fill-label{display:flex;flex-direction:column;align-items:center;font-size:21px;line-height:1.1;color:var(--accent-text)}
.day-fill-label small{font-size:13px;font-weight:500;line-height:1.4}
.day-late,.day-conflict{font-size:13px!important;line-height:1.4!important;color:var(--warning);font-weight:600}
.lateness-value{font-size:15px;font-weight:500;font-variant-numeric:tabular-nums}
.lateness-value.is-late{color:var(--warning);background:var(--warning-soft);padding:4px 7px;border-radius:5px;display:inline-block}
.work-mode-label{font-size:14px;font-weight:600;line-height:1.35;white-space:normal;overflow-wrap:anywhere}
.day-marks.has-work-mode{background:var(--accent-soft);color:var(--accent-text)}
.calendar-day-marks{display:flex;flex-direction:column;gap:3px;width:100%;font-weight:650}
.calendar-day-marks .calendar-mode-label{align-self:center;white-space:nowrap;overflow-wrap:normal;word-break:normal}
.insight-calendar-day.calendar-marks{min-height:112px;padding:9px 7px;gap:7px}
.insight-calendar-day.calendar-marks .day-mark{font-size:15px;gap:4px}
.insight-calendar-day.calendar-marks small{font-size:13px;white-space:normal;line-height:1.3;min-height:17px}
.insight-calendar-day.calendar-marks.is-mode{background:var(--accent-soft);border-color:var(--accent-line);color:var(--accent-text)}
.calendar-fill{color:var(--accent-text)}
.day-attendance-summary{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;margin:16px 0 18px;padding-bottom:16px;border-bottom:1px solid var(--line)}
.day-attendance-summary>div{display:flex;flex-direction:column;align-items:flex-start;gap:5px}
.day-attendance-summary span{font-size:14px;color:var(--muted)}
.day-attendance-summary strong{font-size:18px;line-height:1.4;font-variant-numeric:tabular-nums}
.work-mode-empty,.work-mode-card{border:1px solid var(--accent-line);border-radius:9px;background:var(--accent-soft);padding:16px;margin:0 0 16px}
.work-mode-empty p{font-size:15px;line-height:1.55;color:var(--ink);margin:0 0 12px}
.work-mode-card>div{display:flex;align-items:center;justify-content:space-between;gap:8px;flex-wrap:wrap}
.work-mode-card strong{font-size:17px;color:var(--accent-text)}
.work-mode-card p{font-size:15px;line-height:1.5;margin:10px 0}
.work-mode-card small{display:block;font-size:13px;color:var(--muted);margin-top:8px}
.work-mode-card .insight-button{margin-top:12px}
.work-mode-card.has-conflict{border-color:var(--warning-line);background:var(--warning-soft)}
.work-mode-form{padding:0;margin:0 0 18px}
.work-mode-form-heading{display:flex;flex-direction:column;gap:7px;margin-bottom:18px}
.work-mode-form-heading strong{font-size:18px}.work-mode-form-heading span{font-size:14px;color:var(--muted)}
.work-mode-hint{font-size:14px;line-height:1.6;color:var(--muted);margin:16px 0 0}
.work-mode-form .form-actions{flex-wrap:wrap}.work-mode-form .work-mode-delete{color:var(--danger)}
.office-policy-list{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:16px;padding:0 22px 22px}
.office-policy-card{border:1px solid var(--line);border-radius:10px;padding:18px;background:var(--surface-soft)}
.office-policy-card>div{display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap;margin-bottom:12px}
.office-policy-card strong{font-size:17px}.office-policy-card span{font-size:16px;font-variant-numeric:tabular-nums}
.office-policy-card p{font-size:14px;color:var(--muted);line-height:1.6;margin:6px 0}
.office-policy-card .btn{margin-top:10px}
.form-field[hidden]{display:none!important}
@media(max-width:520px){
  .attendance-head-badges{justify-content:flex-start}.attendance-marks-table th:first-child,.attendance-marks-table td:first-child{min-width:175px;max-width:200px}
  .insight-calendar-day.calendar-marks{padding:8px 3px;min-height:110px;gap:7px}
  .insight-calendar-day.calendar-marks .day-mark{font-size:14px;gap:2px}.insight-calendar-day.calendar-marks .day-mark i{display:none}
  .insight-calendar-day.calendar-marks .work-mode-label{font-size:13px}.insight-calendar-day.calendar-marks small{font-size:12px}
  .insight-calendar-day.calendar-marks .calendar-mode-label{font-size:12px}
  .office-policy-list{padding:0 16px 16px}.work-mode-form .form-actions .btn{width:100%}
}

.policy-workdays{margin:0;padding:0;border:0;min-width:0}
.policy-workdays legend{font-size:14px;font-weight:600;color:var(--ink);padding:0;margin-bottom:10px}
.policy-workdays>div{display:flex;flex-wrap:wrap;gap:8px}
.policy-workdays label{display:flex;align-items:center;gap:7px;border:1px solid var(--line);border-radius:7px;padding:9px 11px;cursor:pointer;font-size:14px}
.policy-workdays input{width:16px;height:16px;margin:0;accent-color:var(--accent)}
.policy-workdays label:has(input:checked){background:var(--accent-soft);border-color:var(--accent-line);color:var(--accent-text)}

body[data-theme] .attendance-marks-table .day-marks.can-fill{opacity:1;background:var(--surface-soft)}
.calendar-day-marks .day-no-marks{font-size:13px;overflow-wrap:anywhere;white-space:normal}
@media(max-width:380px){.insight-calendar{gap:3px}.insight-calendar-day.calendar-marks{padding-inline:1px}.insight-calendar-day.calendar-marks .calendar-mode-label{letter-spacing:-.15px}}

/* Sidebar proportions are shared by desktop navigation and the mobile drawer. */
.shell{--sidebar-width:288px}
.sidebar{width:var(--sidebar-width);padding:0 16px 16px}
.sidebar .navigation{gap:4px}
.sidebar .navigation .nav-link{width:100%;min-height:46px;padding:12px;gap:12px;font-size:16px;line-height:22px;text-align:left}
.sidebar .navigation .nav-link span{font-size:inherit}
.sidebar .navigation .nav-link :is(svg,.ticon){width:18px;height:18px;flex-shrink:0}
.sidebar .sidebar-bottom{padding-top:16px}
.sidebar .sidebar-settings{font-size:15px;line-height:20px;gap:12px;padding:10px 12px;margin-bottom:12px;border-radius:8px;justify-content:flex-start;text-align:left}
.sidebar .account{display:grid;grid-template-columns:40px minmax(0,1fr) 36px;gap:12px;align-items:center;min-height:76px;padding:12px;border:1px solid var(--sidebar-line);border-radius:12px;background:var(--sidebar-hover)}
.sidebar .account .avatar{display:grid;place-items:center;width:40px;height:40px;min-width:40px;flex:none;border-radius:10px;font-size:16px;font-weight:600;line-height:1}
.sidebar .account-copy{display:grid;gap:4px;min-width:0}
.sidebar .account-name{font-size:15px;line-height:20px;font-weight:600;white-space:normal;overflow-wrap:anywhere;overflow:visible;text-overflow:clip}
body[data-theme] .sidebar .account .small{font-size:13px;line-height:18px;white-space:normal;overflow-wrap:anywhere;margin:0}
body[data-theme] .sidebar .account .icon-btn{width:36px;height:36px;min-width:36px;min-height:36px;padding:8px;border:1px solid var(--sidebar-line);border-radius:8px;background:transparent;color:var(--sidebar-muted)}
body[data-theme] .sidebar .account .icon-btn:hover{background:var(--sidebar-active);color:var(--sidebar-ink)}
.sidebar .account .icon-btn svg{width:18px;height:18px}
.sidebar :is(.nav-link,.sidebar-settings,.account .icon-btn):focus-visible{outline:2px solid var(--sidebar-accent);outline-offset:2px}
@media(min-width:1021px){.shell{grid-template-columns:var(--sidebar-width) minmax(0,1fr)}}
@media(max-width:1020px){.sidebar{width:min(var(--sidebar-width),calc(100vw - 32px))}}

/* Overview: confirmed lateness for the active office and date range. */
.overview-report{margin-bottom:24px;overflow:hidden}
.overview-report .panel-head{align-items:flex-start;gap:16px}
.overview-report .panel-head p{margin:7px 0 0;color:var(--muted);font-size:15px}
.overview-report-actions{display:flex;gap:8px;flex-wrap:wrap;align-items:center}
.overview-export span{display:grid;gap:3px;text-align:left}
.overview-export small{font-size:13px;font-weight:400;line-height:1.3;font-variant-numeric:tabular-nums}
.overview-report-actions .overview-export{padding:10px 16px;min-height:58px;white-space:normal}
.overview-report-summary{display:flex;gap:12px 26px;flex-wrap:wrap;padding:16px 22px 7px;font-size:15px;color:var(--muted)}
.overview-report-summary strong{color:var(--ink);font-variant-numeric:tabular-nums}
.overview-report-summary .report-has-conflicts,.overview-report-summary .report-has-conflicts strong{color:var(--warning)}
.overview-report-hint{padding:0 22px 16px;margin:0;color:var(--muted);font-size:14px;line-height:1.5}
.overview-report-scroll{max-height:580px;overflow:auto;position:relative}
.overview-report-table{min-width:1170px;margin:0}
.overview-report-table thead{position:sticky;top:0;z-index:2;background:var(--surface-soft)}
.overview-report-table th{font-size:14px;white-space:nowrap}
.overview-report-table td,.overview-report-table .person-name{font-size:16px}
.overview-report-table .person{min-width:230px}
.overview-report-table th:nth-child(7),.overview-report-table td:nth-child(7){min-width:175px}
.overview-report-table th:nth-child(8),.overview-report-table td:nth-child(8){min-width:170px}
.overview-timesheet-link{display:block;margin-top:6px;font-size:13px}
.overview-report-foot{gap:12px;flex-wrap:wrap}
.overview-report-pager{display:flex;gap:12px;align-items:center;flex-wrap:wrap}
.overview-report-pager label{display:flex;align-items:center;gap:8px;font-size:14px;color:var(--muted)}
.overview-report-pager select{width:70px;min-height:38px;padding:7px;border:1px solid var(--line);border-radius:6px;background:var(--surface);color:var(--ink)}
@media(max-width:640px){.overview-report .panel-head{flex-direction:column}.overview-report-summary{padding:14px 18px 8px}.overview-report-hint{padding:0 18px 14px}.overview-report-scroll{max-height:500px}.overview-report-pager{gap:8px}.overview-report-pager .btn{padding-inline:9px}.overview-report-foot{padding:14px 18px}.overview-report-actions{width:100%}.overview-report-actions .btn-primary{flex:1}}
.lateness-leaders{margin-bottom:22px}
.lateness-leaders .panel-head{align-items:flex-start}
.lateness-leaders .panel-head p{font-size:15px;line-height:1.5;margin:7px 0 0;color:var(--muted)}
.lateness-source{font-size:14px;color:var(--muted);line-height:1.5;text-align:right}
.lateness-leaders-table{min-width:990px}
.lateness-leaders-table th{font-size:15px}
.lateness-leaders-table td,.lateness-leaders-table .person-name{font-size:16px}
.lateness-leaders-table th:first-child,.lateness-leaders-table td:first-child{width:56px;text-align:center}
.lateness-leaders-table .lateness-rank{color:var(--muted);font-variant-numeric:tabular-nums}
.lateness-leaders-table .person{min-width:210px}
.lateness-frequency{display:flex;align-items:center;gap:14px;min-width:150px}
.lateness-frequency strong{font-size:16px;font-weight:600;min-width:24px;font-variant-numeric:tabular-nums}
.lateness-frequency>span{width:92px;height:5px;border-radius:4px;background:var(--accent-soft);overflow:hidden}
.lateness-frequency i{display:block;height:100%;background:var(--accent);border-radius:4px;opacity:.72}
.lateness-leaders-table .lateness-total{white-space:nowrap;font-variant-numeric:tabular-nums}
.lateness-times-hint{margin:0;padding:0 22px 16px;color:var(--muted);font-size:14px;line-height:1.5}
.lateness-days-toggle{margin:7px 0 0 44px;font-size:14px}
.lateness-detail-row[hidden]{display:none!important}
.lateness-leaders-table .lateness-detail-row>td{padding:14px 22px;text-align:left;background:var(--surface-soft)}
.lateness-days-table{width:100%;margin:0;background:var(--surface);border:1px solid var(--line)}
.lateness-days-table caption{caption-side:top;text-align:left;padding:0 0 12px;font-weight:600;color:var(--ink);font-size:15px}
.lateness-leaders-table .lateness-days-table th:first-child,.lateness-leaders-table .lateness-days-table td:first-child{width:auto;text-align:left}
.lateness-days-table td:last-child{text-align:right}
.lateness-leaders-foot{gap:10px 22px;flex-wrap:wrap;font-size:14px}
.lateness-order{padding:13px 22px;font-size:14px;line-height:1.5;color:var(--muted);border-top:1px solid var(--line)}
@media(max-width:640px){.lateness-leaders .panel-head{flex-direction:column;gap:10px}.lateness-source{text-align:left}.lateness-order{padding:13px 18px}}

.attendance-statistics{margin-bottom:22px}
.attendance-statistics .panel-head p{font-size:15px;line-height:1.5;margin:7px 0 0;color:var(--muted)}
.attendance-statistics-basis{font-size:15px;line-height:1.6;padding:0 22px 18px;color:var(--muted)}
.attendance-statistics-table{min-width:820px}
.attendance-statistics-table th{font-size:15px}
.attendance-statistics-table td,.attendance-statistics-table .person-name{font-size:16px}
.attendance-statistics-table .person{min-width:220px}
.attendance-statistics-table th:nth-child(n+3),.attendance-statistics-table td:nth-child(n+3){text-align:center}
.attendance-missing-count{display:inline-flex;align-items:center;justify-content:center;min-width:34px;padding:5px 8px;border-radius:5px;color:var(--muted);font-weight:600;font-variant-numeric:tabular-nums}
.attendance-missing-count.has-missing{background:var(--accent-soft);color:var(--accent-text)}
.attendance-day-count{font-weight:500;font-variant-numeric:tabular-nums}
.attendance-statistics-foot{flex-wrap:wrap;gap:10px 22px;font-size:14px}
.attendance-statistics-notes{padding:14px 22px;border-top:1px solid var(--line);font-size:14px;line-height:1.6;color:var(--muted)}
.attendance-statistics-notes p{margin:0}.attendance-statistics-notes p+p{margin-top:7px}
@media(max-width:640px){.attendance-statistics-basis{padding:0 18px 16px}.attendance-statistics-notes{padding:14px 18px}}

.statistics-more{margin-left:auto;font-size:15px;min-width:154px}
@media(max-width:640px){.statistics-more{width:100%;margin-left:0}}

.day-arrival-basis{font-size:13px;line-height:1.4;color:var(--muted)}
.profile-arrival-basis{font-size:15px;line-height:1.5;margin:12px 0 0;color:var(--muted)}
.attendance-excluded{white-space:normal;max-width:230px}

.profile-timesheet-action{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;margin:14px 0;padding:14px;border:1px solid var(--line);border-radius:10px;background:var(--surface-soft)}
.profile-timesheet-action span{font-size:14px;line-height:1.5;color:var(--muted);flex:1;min-width:180px}

/* Employee profile: shared spacing for the selected day and its records. */
.insight-wide-modal{max-width:1160px!important}
.insight-profile-columns{grid-template-columns:minmax(0,1.15fr) minmax(340px,1fr);gap:24px}
.insight-profile-columns>section{min-width:0}
.insight-calendar-day.calendar-marks{min-height:104px;gap:6px}
.insight-day-panel{padding:20px;display:flex;flex-direction:column;gap:18px;background:var(--surface);border-radius:12px}
.insight-day-panel>header{padding:0;display:flex;align-items:center;justify-content:space-between;gap:12px;min-width:0}
.insight-day-panel>header h3{margin:0;font-size:20px;line-height:1.4}
.insight-day-panel>header>span{font-size:14px;color:var(--muted);text-align:right;overflow-wrap:anywhere}
.insight-day-panel .insight-day-tabs{display:grid;grid-template-columns:1fr 1fr;width:100%;margin:0;padding:4px;border-radius:8px;background:var(--bg);gap:4px}
.insight-day-panel .insight-day-tabs button{margin:0;min-width:0;min-height:42px;padding:8px 10px;border-radius:6px;display:flex;align-items:center;justify-content:center;gap:8px;font-size:15px;line-height:1.4}
.insight-day-tabs button>span{font-size:13px;min-width:22px;padding:1px 6px;background:var(--surface);border-radius:4px}
.insight-day-panel .insight-day-records{padding:0;margin:0;gap:12px;max-height:440px;overflow:auto;scrollbar-gutter:stable}
.insight-day-panel .insight-day-records.is-summary{max-height:none;overflow:visible;scrollbar-gutter:auto}
.profile-day-overview{display:grid;gap:16px;min-width:0}
.profile-day-marks{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.profile-day-marks>div{display:flex;flex-direction:column;gap:7px;padding:16px;background:var(--bg);border:1px solid var(--line);border-radius:9px;min-width:0}
.profile-day-marks span{font-size:14px;color:var(--muted)}
.profile-day-marks strong{font-size:28px;line-height:1.2;font-weight:650;font-variant-numeric:tabular-nums;letter-spacing:-.5px}
.profile-day-marks small{font-size:13px;line-height:1.4;color:var(--muted)}
.insight-day-panel .profile-arrival-basis{font-size:14px;line-height:1.5;margin:0;color:var(--muted)}
.insight-day-panel .day-attendance-summary{margin:0;padding:0;border:0;gap:14px 20px}
.insight-day-panel .day-attendance-summary>div{gap:4px;min-width:0}
.insight-day-panel .day-attendance-summary strong{font-size:17px;line-height:1.5}
.insight-day-panel .day-attendance-summary.is-single{display:block}
.insight-day-panel .day-attendance-summary.is-single>div{flex-direction:row;align-items:center;justify-content:space-between;gap:16px}
.insight-day-panel .work-mode-card,.insight-day-panel .work-mode-empty{margin:0;padding:14px}
.insight-day-panel .insight-empty{padding:22px 6px;margin:0;min-height:0}
.insight-day-panel .insight-empty p{margin:8px 0 0;font-size:14px;line-height:1.6}
.insight-day-panel [data-work-mode-editor]:empty{display:none}
.insight-day-panel .profile-timesheet-action{margin:0;padding:16px 0 0;border:0;border-top:1px solid var(--line);border-radius:0;background:none;display:flex;align-items:center;gap:12px;flex-wrap:wrap}
.profile-timesheet-action>div{flex:1 1 170px;min-width:0;display:grid;gap:4px}
.profile-timesheet-action>div>strong{font-size:15px;font-weight:600;color:var(--ink)}
.profile-timesheet-action>div>span{font-size:13px;line-height:1.5;min-width:0}
.profile-timesheet-action>button{min-height:42px;white-space:nowrap;font-size:14px;padding:9px 12px}
.profile-visit-details{border-top:1px solid var(--line);padding-top:14px;min-width:0}
.profile-visit-details>summary{font-size:14px;color:var(--muted);cursor:pointer;min-height:32px;line-height:1.6}
.profile-visit-details>summary span{margin-left:6px;color:var(--ink);font-variant-numeric:tabular-nums}
.profile-visit-list{display:grid;gap:10px;margin-top:10px}
.insight-day-panel .insight-record{padding:14px;min-width:0;overflow-wrap:anywhere}
.insight-day-panel .insight-record p{font-size:14px;line-height:1.55;margin-bottom:0}
.insight-day-panel .insight-record>div{flex-wrap:wrap;align-items:center}
.insight-day-panel .insight-record footer{font-size:13px;margin-top:12px;padding-top:10px}
@media(max-width:1000px){.insight-profile-columns{grid-template-columns:minmax(0,1fr)}.insight-day-panel .insight-day-records{max-height:420px}.insight-day-panel .insight-day-records.is-summary{max-height:none}}
@media(max-width:520px){.insight-day-panel{padding:16px;gap:16px}.profile-day-marks>div{padding:14px}.profile-day-marks strong{font-size:26px}.insight-calendar-day.calendar-marks{padding:8px 3px;min-height:96px}.insight-calendar-day.calendar-marks .day-mark{font-size:14px;gap:0}.insight-calendar-day .day-mark i{display:none}.profile-timesheet-action>button{width:100%}.insight-profile-metrics{gap:8px}.insight-profile-metrics .insight-metric{padding:12px}.insight-profile-metrics .insight-metric>strong{font-size:24px}}
