.attendance-badges{flex-wrap:wrap;gap:5px;min-width:100px;display:flex}.attendance-badge{background:var(--surface-soft);color:var(--muted);white-space:nowrap;border-radius:7px;align-items:center;padding:3px 8px;font-size:11px;font-weight:500;display:inline-flex}.attendance-absent{background:var(--status-red-bg);color:var(--status-red)}.attendance-late,.attendance-in_missing{color:#99620b;background:#fff1d6}.attendance-out_missing{color:#6b4db0;background:#efebff}.attendance-present{background:var(--status-green-bg);color:var(--status-green)}html[data-theme=dark] .attendance-late,html[data-theme=dark] .attendance-in_missing{color:#f0c47e;background:#443521}html[data-theme=dark] .attendance-out_missing{color:#cab7ff;background:#352d4a}.attendance-summary{border-top:3px solid #3f7da4;border-radius:12px;margin:0 0 16px;padding:14px 16px}.attendance-summary-heading{flex-wrap:wrap;justify-content:space-between;align-items:center;gap:6px;margin-bottom:12px;display:flex}.attendance-summary-heading h2{margin:0;font-size:14px}.attendance-summary-heading>span{font-size:12px}.attendance-metrics{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;display:grid}.attendance-metric{border:1px solid var(--line);background:var(--surface-soft);border-radius:9px;justify-content:space-between;align-items:center;gap:8px;padding:10px 12px;display:flex}.attendance-metric span{color:var(--muted);font-size:12px}.attendance-metric strong{font-size:21px;line-height:1.2}.metric-absent strong{color:var(--status-red)}.metric-late strong,.metric-inMissing strong{color:#bd862d}.metric-outMissing strong{color:#9473d1}.attendance-summary-footer{color:var(--muted);margin:10px 0 0;font-size:12px}@media (max-width:600px){.attendance-metrics{grid-template-columns:repeat(2,minmax(0,1fr))}.attendance-summary{padding:12px}.attendance-metric{padding:9px 10px}}.attendance-summary .attendance-metrics{grid-template-columns:repeat(3,minmax(0,1fr))}.attendance-metric{text-align:left;color:var(--ink);cursor:pointer;transition:border-color .15s,background .15s}.attendance-metric:hover{border-color:var(--red)}.attendance-metric-label{flex-direction:column;gap:5px;display:flex}.attendance-metric-label small{color:var(--muted);font-size:11px}.attendance-metric:disabled{cursor:default}.attendance-featured{flex-direction:column;min-height:310px;margin:0;display:flex}.attendance-featured .attendance-summary-heading{flex-direction:column;align-items:flex-start}.attendance-featured .attendance-metrics{flex:1;grid-template-rows:repeat(3,minmax(70px,1fr));grid-template-columns:1fr}.attendance-featured .attendance-metric{padding:16px 18px}.attendance-featured .attendance-metric strong{font-size:30px}.attendance-featured .attendance-summary-footer{margin-top:14px}.attendance-dialog{border:1px solid var(--line);background:var(--card);width:min(850px,100vw - 32px);max-height:85dvh;color:var(--ink);border-top:3px solid #bd862d;border-radius:16px;margin:auto;padding:20px;overflow:hidden;box-shadow:0 20px 75px #0004}.attendance-dialog[open]{flex-direction:column;display:flex}.attendance-dialog-absent{border-top-color:var(--status-red)}.attendance-dialog::backdrop{-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);background:#10131c88}.attendance-dialog-heading{flex-shrink:0;justify-content:space-between;align-items:flex-start;gap:12px;display:flex}.attendance-dialog-heading h2{margin:5px 0;font-size:21px}.attendance-dialog-heading p{margin:0 0 8px;font-size:12px}.attendance-dialog-close{flex-shrink:0;width:34px;height:34px;padding:0;font-size:24px;line-height:1}.attendance-dialog-search{flex-shrink:0;width:100%;min-width:0;margin:0}.attendance-dialog-table{overscroll-behavior:contain;flex:1;min-height:0;overflow:auto}.attendance-dialog-table th{background:var(--card);z-index:1;position:sticky;top:0}.attendance-dialog-table td small{color:var(--muted);margin-top:4px;font-size:11px;display:block}.attendance-dialog-pagination{color:var(--muted);flex-shrink:0;justify-content:space-between;align-items:center;gap:10px;padding-top:12px;font-size:12px;display:flex}.attendance-dialog-pagination>div{align-items:center;gap:10px;display:flex}@media (max-width:600px){.attendance-summary:not(.attendance-featured) .attendance-metrics{grid-template-columns:1fr}.attendance-dialog{padding:14px}.attendance-featured{min-height:300px}}.attendance-feature-grid{align-items:start}.attendance-redesign{border-top:3px solid var(--red);border-radius:16px;min-height:0;padding:14px 16px}.attendance-redesign .attendance-summary-heading{flex-direction:row;justify-content:space-between;align-items:center;gap:10px;margin-bottom:10px;display:flex}.attendance-redesign .attendance-summary-heading h2{margin:0 0 3px;font-size:20px;line-height:1.3}.attendance-redesign .attendance-summary-heading .muted{font-size:13px}.attendance-percentage{white-space:nowrap;align-items:baseline;gap:5px;display:flex}.attendance-percentage strong{letter-spacing:-1px;font-size:32px;line-height:1.2}.attendance-percentage span{color:var(--muted);font-size:13px}.attendance-progress{border:1px solid var(--line);background:var(--surface-soft);accent-color:#20894d;border-radius:20px;width:100%;height:7px;display:block;overflow:hidden}.attendance-progress::-webkit-progress-bar{background:var(--surface-soft);border-radius:20px}.attendance-progress::-webkit-progress-value{background:#20894d;border-radius:20px}.attendance-progress::-moz-progress-bar{background:#20894d;border-radius:20px}.attendance-coverage{color:var(--muted);flex-wrap:wrap;justify-content:space-between;gap:4px 8px;margin:6px 0 10px;font-size:13px;display:flex}.attendance-redesign .attendance-metrics{flex:none;grid-template-rows:auto;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;display:grid}.attendance-redesign .attendance-metric{border-top:3px solid var(--status-red);border-radius:11px;flex-direction:column;justify-content:flex-start;align-items:flex-start;gap:1px;padding:8px 11px;transition:box-shadow .15s,transform .15s;display:flex}.attendance-redesign .metric-late{border-top-color:#ba7d1c}.attendance-redesign .metric-inMissing{border-top-color:#2c65ff}.attendance-redesign .metric-inMissing strong{color:#2c65ff}.attendance-redesign .metric-late strong{color:#ba7d1c}.attendance-redesign .attendance-metric strong{font-size:32px;line-height:1.1}.attendance-redesign .attendance-metric-label,.attendance-redesign .attendance-metric small{color:var(--muted);font-size:12px;line-height:1.4}.attendance-redesign .attendance-metric small{margin-top:1px}.attendance-redesign .attendance-metric:hover:not(:disabled){transform:translateY(-1px);box-shadow:0 4px 12px #00000012}.attendance-dialog-filters{flex-shrink:0;grid-template-columns:repeat(3,minmax(0,1fr));align-items:end;gap:12px;margin:7px 0 14px;display:grid}.attendance-dialog-filters label{color:var(--muted);flex-direction:column;gap:5px;font-size:12px;display:flex}.attendance-dialog-filters select{text-overflow:ellipsis;width:100%;min-width:0}@media (max-width:600px){.attendance-dialog-filters{grid-template-columns:repeat(2,minmax(0,1fr))}.attendance-dialog-filters .attendance-search-field{grid-column:1/-1}}@media (max-width:380px){.attendance-dialog-filters .attendance-search-field{grid-column:auto}}@media (max-width:650px){.attendance-redesign{padding:12px}.attendance-redesign .attendance-summary-heading h2{font-size:17px}.attendance-percentage strong{font-size:27px}.attendance-redesign .attendance-metric{padding:8px}.attendance-redesign .attendance-metric strong{font-size:29px}.attendance-redesign .attendance-metric small{font-size:11px}}@media (max-width:380px){.attendance-redesign .attendance-summary-heading{align-items:flex-start;gap:8px}.attendance-percentage{flex-direction:column;gap:0}.attendance-redesign .attendance-metrics{gap:6px}.attendance-redesign .attendance-metric{padding:8px}.attendance-redesign .attendance-metric-label{font-size:11px}.attendance-dialog-filters{grid-template-columns:1fr}}.attendance-dialog-late{width:min(1080px,100vw - 32px)}.attendance-shift-details{white-space:nowrap;font-variant-numeric:tabular-nums}.attendance-shift-details>div{min-height:24px;line-height:1.6}.attendance-late-duration{color:var(--overview-amber);font-weight:600}
