@import "https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700&family=Outfit:wght@400;500;600;700&display=swap";
:root{--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark;--bg-primary:#0a0a0f;--bg-secondary:#14141d;--bg-tertiary:#ffffff08;--accent-primary:#6366f1;--accent-secondary:#8b5cf6;--accent-tertiary:#ec4899;--accent-success:#10b981;--accent-warning:#f59e0b;--accent-danger:#ef4444;--text-primary:#f8fafc;--text-secondary:#94a3b8;--text-muted:#64748b;--border-color:#ffffff1a;--border-color-hover:#fff3;--font-sans:"Inter", sans-serif;--font-display:"Outfit", sans-serif;--glass-bg:#14141db3;--glass-border:1px solid #ffffff14;--glass-shadow:0 8px 32px 0 #0000005e;--glass-blur:blur(12px);--sidebar-width:280px;--header-height:72px;--transition-fast:.15s ease;--transition-normal:.3s cubic-bezier(.4, 0, .2, 1);--transition-slow:.5s cubic-bezier(.4, 0, .2, 1)}[data-theme=light]{--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light;--bg-primary:#f8fafc;--bg-secondary:#fff;--bg-tertiary:#00000005;--text-primary:#0f172a;--text-secondary:#475569;--text-muted:#94a3b8;--border-color:#00000014;--border-color-hover:#00000026;--glass-bg:#ffffffb3;--glass-border:1px solid #00000014;--glass-shadow:0 8px 32px 0 #1f268712}*{box-sizing:border-box;margin:0;padding:0}html,body{max-width:100vw;font-family:var(--font-sans);background-color:var(--bg-primary);color:var(--text-primary);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;transition:background-color var(--transition-normal), color var(--transition-normal);overflow-x:hidden}a{color:inherit;text-decoration:none}button{font-family:var(--font-sans);cursor:pointer;background:0 0;border:none}h1,h2,h3,h4,h5,h6{font-family:var(--font-display);color:var(--text-primary);letter-spacing:-.02em;font-weight:600}.glass-panel{background:var(--glass-bg);-webkit-backdrop-filter:var(--glass-blur);border:var(--glass-border);box-shadow:var(--glass-shadow);border-radius:16px}.text-gradient{background:linear-gradient(135deg, var(--accent-primary), var(--accent-tertiary));-webkit-text-fill-color:transparent;color:#0000;-webkit-background-clip:text;background-clip:text}.container{width:100%;max-width:1200px;margin:0 auto;padding:0 24px}@keyframes fadeIn{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}.animate-fade-in{animation:.6s cubic-bezier(.16,1,.3,1) forwards fadeIn}@keyframes pulse-glow{0%{box-shadow:0 0 #6366f166}70%{box-shadow:0 0 0 10px #6366f100}to{box-shadow:0 0 #6366f100}}.modal-overlay{-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);z-index:1000;background:#00000080;justify-content:center;align-items:center;width:100vw;height:100vh;display:flex;position:fixed;top:0;left:0}.modal-content{background:var(--bg-secondary);border-radius:16px;width:100%;max-width:500px;padding:32px;position:relative}.modal-content h2{margin-bottom:24px;font-size:1.5rem}.modal-form{flex-direction:column;display:flex}.modal-actions{justify-content:flex-end;gap:16px;margin-top:32px;display:flex}.attendance-grid{flex-wrap:wrap;gap:16px;margin-top:16px;display:flex}.attendance-avatar-wrapper{cursor:pointer;display:inline-block;position:relative}.attendance-avatar{background:linear-gradient(135deg, var(--bg-tertiary), var(--border-color));width:48px;height:48px;color:var(--text-primary);border:3px solid #0000;border-radius:50%;justify-content:center;align-items:center;font-size:1.125rem;font-weight:600;transition:all .2s ease-in-out;display:flex}.attendance-avatar--in{border-color:#10b981!important;box-shadow:0 0 15px #10b98199!important}.attendance-avatar--out{opacity:.7;border-color:var(--text-muted)!important}.attendance-tooltip{visibility:hidden;opacity:0;border:1px solid var(--border-color);color:var(--text-primary);white-space:nowrap;z-index:999;pointer-events:none;background:#0f172a;border-radius:8px;padding:16px;font-size:.875rem;transition:all .2s ease-in-out;position:absolute;bottom:125%;left:50%;transform:translate(-50%)translateY(10px);box-shadow:0 10px 25px #000c}.attendance-tooltip:after{content:"";border:6px solid #0000;border-top-color:#0f172a;position:absolute;top:100%;left:50%;transform:translate(-50%)}.attendance-avatar-wrapper:hover .attendance-tooltip{visibility:visible;opacity:1;transform:translate(-50%)translateY(0)}.tooltip-name{color:var(--accent-primary);margin-bottom:4px;font-weight:600;display:block}.tooltip-time{color:var(--text-secondary);margin-bottom:2px;font-size:.75rem;display:block}.tooltip-duration{color:#10b981;margin-top:4px;font-size:.75rem;font-weight:500;display:block}.table-responsive{width:100%;overflow-x:auto}.ui-table{border-collapse:collapse;text-align:left;width:100%}.ui-table th{background:var(--bg-tertiary);color:var(--text-secondary);text-transform:uppercase;letter-spacing:.05em;border-bottom:1px solid var(--border-color);padding:16px 24px;font-size:.875rem;font-weight:600}.ui-table td{border-bottom:1px solid var(--border-color);color:var(--text-primary);vertical-align:middle;padding:16px 24px;font-size:.9375rem}.ui-table tr:last-child td{border-bottom:none}.ui-table tr:hover td{background:#ffffff05}.font-medium{font-weight:500}.status-badge{border-radius:100px;padding:4px 12px;font-size:.75rem;font-weight:600;display:inline-block}.status-pending{color:var(--accent-warning);background:#f59e0b1a}.status-approved{color:var(--accent-success);background:#10b9811a}.status-rejected{color:var(--accent-danger);background:#ef44441a}.status-withdrawn,.status-cancelled{color:var(--text-muted);background:#64748b1f}.status-closed{color:var(--accent-success);background:#10b9811a}.status-open{color:var(--accent-primary);background:#6366f11a}.action-buttons{gap:8px;display:flex}.text-danger{color:var(--accent-danger)!important}.ui-select{background:var(--bg-secondary);border:1px solid var(--border-color);width:100%;color:var(--text-primary);font-family:var(--font-sans);appearance:none;cursor:pointer;transition:all var(--transition-fast);background-image:url("data:image/svg+xml,%3Csvg width='12' height='8' viewBox='0 0 12 8' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M1 1.5L6 6.5L11 1.5' stroke='%2394a3b8' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");background-position:right 16px center;background-repeat:no-repeat;border-radius:8px;padding:12px 16px;font-size:1rem}.ui-select:focus{border-color:var(--accent-primary);outline:none;box-shadow:0 0 0 3px #6366f133}.ui-select option{background:var(--bg-secondary);color:var(--text-primary)}.ui-textarea{background:var(--bg-secondary);border:1px solid var(--border-color);width:100%;color:var(--text-primary);font-family:var(--font-sans);resize:vertical;transition:all var(--transition-fast);border-radius:8px;padding:12px 16px;font-size:1rem}.ui-textarea::placeholder{color:var(--text-muted)}.ui-textarea:focus{border-color:var(--accent-primary);background:var(--bg-primary);outline:none;box-shadow:0 0 0 3px #6366f133}@media (max-width:768px){.modal-content{border-radius:16px;max-width:calc(100vw - 24px);margin:0 12px;padding:24px 20px}.modal-actions{flex-direction:column-reverse;gap:10px;margin-top:20px}.modal-actions>*{width:100%}.table-responsive{-webkit-overflow-scrolling:touch;border-radius:12px;overflow-x:auto}.ui-table th,.ui-table td{white-space:nowrap;padding:12px 14px;font-size:.85rem}}@media (max-width:480px){.ui-select{font-size:.8rem}}