*{margin:0;padding:0;box-sizing:border-box}html,body{height:100%;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Fira Sans,Droid Sans,Helvetica Neue,sans-serif;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;background-color:#f5f7fa;color:#333}body{margin:0;padding:0}app-root{display:block;width:100%;height:100%}::-webkit-scrollbar-thumb{background:#888;border-radius:4px}::-webkit-scrollbar-thumb:hover{background:#555}.container{max-width:1200px;margin:0 auto;padding:0 20px}.text-center{text-align:center}.text-left{text-align:left}.text-right{text-align:right}.mt-0{margin-top:0}.mt-1{margin-top:8px}.mt-2{margin-top:16px}.mt-3{margin-top:24px}.mt-4{margin-top:32px}.mb-0{margin-bottom:0}.mb-1{margin-bottom:8px}.mb-2{margin-bottom:16px}.mb-3{margin-bottom:24px}.mb-4{margin-bottom:32px}.p-0{padding:0}.p-1{padding:8px}.p-2{padding:16px}.p-3{padding:24px}.p-4{padding:32px}.d-none{display:none}.d-flex{display:flex}.gap-1{gap:8px}.gap-2{gap:16px}.gap-3{gap:24px}.spinner{display:inline-block;width:40px;height:40px;border:4px solid #f3f3f3;border-top:4px solid #667eea;border-radius:50%;animation:spin 1s linear infinite}:root{--color-primary: #702283;--color-primary-light: #ed6ea7;--color-accent: #e6007e;--color-secondary: #0d679a;--color-secondary-hover: #0b5a87;--color-bg: #f9f6fb;--color-surface: #ffffff;--color-text: #1f1f1f;--color-muted: #6b7280;--color-border: #e5e7eb;--color-on-primary-border: rgba(255, 255, 255, .16);--color-on-primary-hover: rgba(255, 255, 255, .12);--color-on-primary-soft: rgba(255, 255, 255, .78);--color-on-primary-muted: rgba(255, 255, 255, .82);--color-on-primary-strong: rgba(255, 255, 255, .92);--color-on-primary-surface: rgba(255, 255, 255, .14);--color-on-primary-surface-border: rgba(255, 255, 255, .18);--color-primary-rgb: 112, 34, 131;--color-accent-rgb: 230, 0, 126;--color-secondary-rgb: 13, 103, 154;--color-overlay: rgba(31, 31, 31, .55);--color-danger: #dc3545;--color-danger-bg: #f8d7da;--color-danger-text: #721c24;--color-danger-rgb: 220, 53, 69;--color-success: #1f8f4a;--color-success-bg: #d4edda;--color-success-text: #155724;--color-success-rgb: 31, 143, 74;--color-warning: #b7791f;--color-warning-bg: #fff3cd;--color-warning-text: #856404;--color-warning-rgb: 183, 121, 31;--color-info: #0d679a;--color-info-bg: #d1ecf1;--color-info-text: #0c5460;--color-info-rgb: 13, 103, 154;--shadow-sm: 0 2px 8px rgba(31, 31, 31, .1);--shadow-md: 0 10px 28px rgba(31, 31, 31, .16);--shadow-lg: 0 10px 40px rgba(31, 31, 31, .24);--shadow-focus: 0 0 0 3px rgba(112, 34, 131, .12);--radius-md: 8px;--radius-lg: 12px;--radius-xl: 20px;--radius-2xl: 24px;--space-2: .5rem;--space-3: .75rem;--space-4: 1rem;--space-5: 1.25rem;--space-6: 1.5rem;--space-8: 2rem;--space-10: 2.5rem;--space-12: 3rem;--shadow-soft: 0 16px 32px rgba(31, 31, 31, .08);--shadow-pop: 0 24px 48px rgba(31, 31, 31, .12);--bg: var(--color-bg);--surface: var(--color-surface);--text: var(--color-text);--border: var(--color-border);--primary: var(--color-primary);--primary-light: var(--color-primary-light);--accent: var(--color-accent);--secondary: var(--color-secondary);--secondary-hover: var(--color-secondary-hover);--primary-rgb: var(--color-primary-rgb);--accent-rgb: var(--color-accent-rgb)}html,body{height:100%;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Fira Sans,Droid Sans,Helvetica Neue,sans-serif;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;background-color:var(--color-bg);color:var(--color-text)}body{margin:0;padding:0;background:var(--color-bg);color:var(--color-text)}app-root{display:block;width:100%;min-height:100%}a{color:var(--color-primary)}img{max-width:100%}::selection{background:rgba(var(--color-primary-rgb),.16);color:var(--color-text)}::-webkit-scrollbar{width:8px;height:8px}::-webkit-scrollbar-track{background:#f1f1f1}::-webkit-scrollbar-thumb{background:#8b8b8b;border-radius:4px}::-webkit-scrollbar-thumb:hover{background:#666}.spinner{display:inline-block;width:40px;height:40px;border:4px solid var(--color-border);border-top:4px solid var(--color-primary);border-radius:50%;animation:spin 1s linear infinite}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.card,.employee-container,.access-container,.leave-container,.volunteer-container,.setup-card{background:var(--color-surface)!important;border:1px solid var(--color-border)!important;border-radius:var(--radius-lg)!important;box-shadow:var(--shadow-md)!important}.login-container,.setup-container,.otp-container{background:linear-gradient(135deg,var(--color-primary) 0%,var(--color-accent) 50%,var(--color-primary-light) 100%)!important;color:var(--color-surface)!important}.login-container h2,.setup-card h1,.otp-card h1,.employee-container .header h2,.access-container .header h2,.leave-container .header h2,.volunteer-container .header h2,.topbar-brand-copy h1{color:var(--color-primary)!important}.subtitle,.setup-text,.password-requirements,.loading,.no-data,.topbar-brand-copy span{color:var(--color-muted)!important}.error-message{background-color:var(--color-danger-bg)!important;color:var(--color-danger-text)!important;border-left:4px solid var(--color-danger)!important}.success-message{background-color:var(--color-success-bg)!important;color:var(--color-success-text)!important;border-left:4px solid var(--color-success)!important}.warning-message{background-color:var(--color-warning-bg)!important;color:var(--color-warning-text)!important;border-left:4px solid var(--color-warning)!important}.info-message{background-color:var(--color-info-bg)!important;color:var(--color-info-text)!important;border-left:4px solid var(--color-info)!important}.form-control,.search-input,.filter-select{border:1px solid var(--color-border)!important;background-color:var(--color-surface)!important;color:var(--color-text)}.form-control:focus,.search-input:focus,.filter-select:focus{outline:none!important;border-color:var(--color-primary)!important;box-shadow:var(--shadow-focus)!important}.form-control.is-invalid{border-color:var(--color-danger)!important}.btn,.btn-primary,.btn-secondary,.logout-btn{transition:background-color .3s,color .3s,border-color .3s,box-shadow .3s,opacity .3s}.btn{border:none;border-radius:var(--radius-md)}.btn-primary{background-color:var(--color-primary)!important;color:var(--color-surface)!important}.btn-primary:hover:not(:disabled){background-color:var(--color-accent)!important}.btn-secondary{background-color:var(--color-secondary)!important;color:var(--color-surface)!important}.btn-secondary:hover:not(:disabled){background-color:var(--color-secondary-hover)!important}.btn:disabled,.logout-btn:disabled{opacity:.6;cursor:not-allowed}.dashboard-page{padding:clamp(20px,2.4vw,32px)}.dashboard-page__inner{width:min(100%,1440px);margin:0 auto;display:grid;gap:24px}.page-hero{display:flex;justify-content:space-between;align-items:flex-end;gap:20px;flex-wrap:wrap}.page-hero__actions{display:flex;gap:12px;align-items:center;flex-wrap:wrap;justify-content:flex-end}.page-kicker{margin:0 0 8px;color:var(--color-accent);font-size:12px;font-weight:800;letter-spacing:.14em;text-transform:uppercase}.page-title{margin:0;color:var(--color-text);font-size:clamp(28px,3vw,40px);line-height:1.1}.page-lead{margin:10px 0 0;color:var(--color-muted);max-width:68ch}.stats-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));gap:16px}.stat-card{position:relative;overflow:hidden;padding:20px;background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-xl);box-shadow:var(--shadow-soft)}.stat-card:after{content:"";position:absolute;inset:auto 0 0;height:4px;background:var(--stat-accent, linear-gradient(90deg, var(--color-primary), var(--color-accent)))}.stat-card__top{display:flex;align-items:flex-start;justify-content:space-between;gap:12px}.stat-card__icon{width:48px;height:48px;border-radius:16px;display:grid;place-items:center;background:rgba(var(--color-primary-rgb),.1);color:var(--color-primary);font-weight:800;letter-spacing:.04em}.stat-card__label{margin:0;color:var(--color-muted);font-size:12px;font-weight:800;letter-spacing:.12em;text-transform:uppercase}.stat-card__value{margin:10px 0 0;color:var(--color-text);font-size:32px;line-height:1;font-weight:800}.stat-card__meta{margin:8px 0 0;color:var(--color-muted);font-size:14px}.stat-card--primary{--stat-accent: linear-gradient(90deg, var(--color-primary), #8b329e)}.stat-card--accent{--stat-accent: linear-gradient(90deg, var(--color-accent), var(--color-primary-light))}.stat-card--blue{--stat-accent: linear-gradient(90deg, var(--color-secondary), #4aa2d6)}.stat-card--success{--stat-accent: linear-gradient(90deg, var(--color-success), #5bbf76)}.stat-card--warning{--stat-accent: linear-gradient(90deg, var(--color-warning), #f0c36d)}.section-card{background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-2xl);box-shadow:var(--shadow-soft);overflow:hidden}.section-card__header{padding:24px 24px 18px;border-bottom:1px solid var(--color-border);display:flex;justify-content:space-between;align-items:flex-end;gap:16px}.section-card__title{margin:0;color:var(--color-text);font-size:20px;font-weight:800}.section-card__subtitle{margin:6px 0 0;color:var(--color-muted)}.section-card__actions{display:flex;gap:12px;align-items:center;flex-wrap:wrap}.toolbar{padding:20px 24px;display:flex;gap:12px;flex-wrap:wrap;align-items:center}.toolbar__search{flex:1 1 280px}.toolbar__filters{display:flex;gap:12px;flex-wrap:wrap;align-items:center}.form-group--full{grid-column:1/-1}.dashboard-input,.dashboard-select{width:100%;padding:14px 16px;border:1px solid var(--color-border);border-radius:16px;background:var(--color-surface);color:var(--color-text);font-size:14px;transition:border-color .2s ease,box-shadow .2s ease,transform .2s ease}.dashboard-input::placeholder{color:#9aa0ab}.dashboard-input:focus,.dashboard-select:focus{outline:none;border-color:var(--color-primary);box-shadow:0 0 0 4px rgba(var(--color-primary-rgb),.1)}.table-shell{overflow:auto}.data-table{width:100%;border-collapse:collapse}.data-table thead th{padding:16px 24px;text-align:left;font-size:12px;font-weight:800;letter-spacing:.1em;text-transform:uppercase;color:var(--color-muted);background:linear-gradient(180deg,#fbf8fc,var(--color-surface));border-bottom:1px solid var(--color-border);white-space:nowrap}.data-table tbody td{padding:18px 24px;border-top:1px solid var(--color-border);vertical-align:middle}.data-table tbody tr:hover{background:rgba(var(--color-primary-rgb),.035)}.data-table__actions{white-space:nowrap}.person-cell{display:flex;align-items:center;gap:14px;min-width:0}.person-avatar{width:46px;height:46px;border-radius:16px;flex-shrink:0;display:grid;place-items:center;background:linear-gradient(135deg,var(--color-primary),var(--color-accent));color:var(--color-surface);font-weight:800;box-shadow:var(--shadow-sm)}.person-copy{min-width:0}.person-name{margin:0;color:var(--color-text);font-weight:800;font-size:15px}.person-subtitle{margin:4px 0 0;color:var(--color-muted);font-size:13px;line-height:1.4}.leave-dates{display:flex;flex-direction:column;gap:4px}.leave-dates strong{color:var(--color-text);font-weight:800;line-height:1.35}.leave-dates span,.leave-reason{color:var(--color-muted);font-size:13px;line-height:1.45}.leave-reason{max-width:38ch}.chip-list{display:flex;flex-wrap:wrap;gap:8px}.chip{display:inline-flex;align-items:center;padding:6px 10px;border-radius:999px;background:#f5eff7;color:var(--color-primary);font-size:12px;font-weight:700}.status-pill{display:inline-flex;align-items:center;padding:6px 12px;border-radius:999px;font-size:12px;font-weight:800;text-transform:capitalize;letter-spacing:.02em}.status-pill--active,.status-pill--approved{background:#1f8f4a1f;color:var(--color-success)}.status-pill--inactive,.status-pill--locked,.status-pill--rejected{background:#dc35451f;color:var(--color-danger)}.status-pill--pending,.status-pill--on_break,.status-pill--on_leave,.status-pill--cancelled{background:#b7791f1f;color:var(--color-warning)}.status-pill--warning{background:#b7791f1f;color:var(--color-warning-text)}.empty-state{padding:48px 24px;display:grid;justify-items:center;gap:12px;text-align:center}.empty-state__icon{width:72px;height:72px;border-radius:24px;display:grid;place-items:center;background:rgba(var(--color-primary-rgb),.1);color:var(--color-primary);font-size:28px}.empty-state__title{margin:0;color:var(--color-text);font-size:20px;font-weight:800}.empty-state__text{margin:0;color:var(--color-muted);max-width:52ch}.empty-state__hint{margin:0;color:var(--color-muted);font-size:14px}.message-banner{padding:14px 16px;border-radius:16px;border:1px solid var(--color-border);background:var(--color-surface);box-shadow:var(--shadow-soft)}.table-actions{display:flex;flex-wrap:wrap;gap:8px}.table-action{display:inline-flex;align-items:center;gap:8px;padding:10px 14px;border-radius:14px;border:1px solid var(--color-border);background:var(--color-surface);color:var(--color-text);font-size:13px;font-weight:700;box-shadow:var(--shadow-sm)}.table-action:hover:not(:disabled){transform:translateY(-1px);box-shadow:var(--shadow-soft)}.table-action--primary{border-color:rgba(var(--color-primary-rgb),.18);background:rgba(var(--color-primary-rgb),.08);color:var(--color-primary)}.table-action--accent{border-color:rgba(var(--color-accent-rgb),.18);background:rgba(var(--color-accent-rgb),.08);color:var(--color-accent)}.table-action--blue{border-color:rgba(var(--color-secondary-rgb),.18);background:rgba(var(--color-secondary-rgb),.08);color:var(--color-secondary)}.table-action--danger{border-color:#dc35452e;background:#dc354514;color:var(--color-danger)}.table-action--success{border-color:#1f8f4a2e;background:#1f8f4a14;color:var(--color-success)}.working-patterns-page .pattern-list-card{min-width:0}.working-patterns-page .pattern-list-card__header{align-items:flex-start}.working-patterns-page .pattern-list-card__copy{min-width:0}.working-patterns-page .pattern-list-card__actions{display:flex;align-items:center;justify-content:flex-end;gap:12px;flex-wrap:wrap}.working-patterns-page .working-pattern-selection-banner{margin:0 0 16px;padding:12px 16px;border-color:rgba(var(--color-secondary-rgb),.16);background:rgba(var(--color-secondary-rgb),.05);color:var(--color-text);font-weight:600}.working-patterns-page .pattern-search-input{width:min(420px,100%)}.working-patterns-page .table-wrapper{overflow-x:auto;overflow-y:auto;max-height:calc(100vh - 310px);scrollbar-gutter:stable}.working-patterns-page .pattern-table{width:100%;min-width:1340px;table-layout:fixed;border-collapse:collapse}.working-patterns-page .pattern-table thead th{padding:12px 10px;font-size:11px;font-weight:800;letter-spacing:.08em;white-space:nowrap}.working-patterns-page .pattern-table tbody td{padding:12px 10px;font-size:14px;line-height:1.2;vertical-align:middle;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.working-patterns-page .cell-ellipsis{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.working-patterns-page .pattern-table tbody td.pattern-col-name{white-space:normal}.working-patterns-page .pattern-table tbody tr:hover{background:rgba(var(--color-primary-rgb),.035)}.working-patterns-page .pattern-table tbody tr.working-pattern-row{cursor:pointer}.working-patterns-page .pattern-table .person-cell{gap:8px}.working-patterns-page .pattern-table .person-avatar{width:34px;height:34px;min-width:34px;border-radius:12px;font-size:12px}.working-patterns-page .pattern-table .person-name{font-size:13px;line-height:1.1}.working-patterns-page .pattern-table .person-subtitle{font-size:11px;line-height:1.1}.working-patterns-page .pattern-table .data-row--selected{background:rgba(var(--color-primary-rgb),.05)}.working-patterns-page .pattern-col-name{width:210px}.working-patterns-page .pattern-col-dept{width:140px}.working-patterns-page .pattern-col-title{width:160px}.working-patterns-page .pattern-col-hours{width:90px;text-align:center}.working-patterns-page .pattern-col-days{width:120px;text-align:center}.working-patterns-page .pattern-col-year{width:90px;text-align:center}.working-patterns-page .pattern-col-entitlement{width:170px;text-align:center}.working-patterns-page .pattern-col-remaining{width:150px;text-align:center;font-weight:700;color:var(--color-text)}.working-patterns-page .pattern-col-review{width:110px;text-align:center}.working-patterns-page .pattern-col-actions{width:130px;text-align:right}.working-patterns-page .table-actions{justify-content:flex-end;gap:6px;flex-wrap:nowrap}.working-patterns-page .table-action{padding:8px 10px;font-size:12px;line-height:1.1;white-space:nowrap}.working-patterns-page .pattern-table tbody tr.data-row--selected td:first-child{box-shadow:inset 4px 0 rgba(var(--color-primary-rgb),.75)}.working-patterns-page .selected-staff-panel{display:grid;gap:12px;padding:16px;border-radius:18px;border:1px solid rgba(var(--color-secondary-rgb),.08);background:rgba(var(--color-secondary-rgb),.04)}.working-patterns-page .selected-staff-panel__meta{display:grid;gap:6px;color:var(--color-muted);font-size:13px}.working-patterns-page .working-pattern-form{display:grid;gap:18px}.working-patterns-page .form-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}.working-patterns-page .form-group{display:flex;flex-direction:column;gap:8px}.working-patterns-page .form-group label{color:var(--color-text);font-size:13px;font-weight:700}.working-patterns-page .form-group--full{grid-column:1/-1}.working-patterns-page .field-hint{margin:0;color:var(--color-muted);font-size:12px;line-height:1.45}.working-patterns-page .checkbox-control{display:flex;align-items:flex-start;gap:12px;padding:14px 16px;border:1px solid var(--color-border);border-radius:16px;background:var(--color-surface);cursor:pointer}.working-patterns-page .checkbox-control input{margin-top:2px;width:18px;height:18px;accent-color:var(--color-primary);flex-shrink:0}.working-patterns-page .checkbox-control__copy{display:grid;gap:4px}.working-patterns-page .checkbox-control__copy strong{color:var(--color-text);font-size:14px;font-weight:700}.working-patterns-page .checkbox-control__copy small{color:var(--color-muted);font-size:12px;line-height:1.45}.working-patterns-page .day-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;grid-column:1/-1}.working-patterns-page .calculation-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:12px}.working-patterns-page .calc-card{display:grid;gap:6px;padding:14px 16px;border-radius:18px;border:1px solid var(--color-border);background:var(--color-surface)}.working-patterns-page .calc-card__label{margin:0;font-size:12px;font-weight:800;text-transform:uppercase;letter-spacing:.08em}.working-patterns-page .calc-card__value{font-size:18px;line-height:1.2}.working-patterns-page .calc-card__hint{font-size:12px;color:var(--color-muted)}.working-patterns-page .calc-card--primary{border-color:rgba(var(--color-primary-rgb),.16)}.working-patterns-page .calc-card--success{border-color:rgba(var(--color-success-rgb),.16)}.working-patterns-page .calc-card--warning{border-color:rgba(var(--color-warning-rgb),.16)}.working-patterns-page .calc-card--blue{border-color:rgba(var(--color-secondary-rgb),.16)}.working-patterns-page .calc-card--accent{border-color:rgba(var(--color-accent-rgb),.16)}.working-patterns-page .form-footer{display:flex;gap:12px;flex-wrap:wrap}.working-patterns-page .bank-holiday-panel{margin-top:20px}.working-patterns-page .bank-holiday-form{margin-top:18px;padding:16px;border-radius:18px;border:1px solid var(--color-border);background:rgba(var(--color-secondary-rgb),.03)}.working-patterns-page .leave-form{display:grid;gap:16px}.working-patterns-page .modal-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}.working-patterns-page .modal-card__footer{display:flex;justify-content:flex-end;gap:12px;flex-wrap:wrap;margin-top:16px}.working-patterns-page .message-banner--warning{border-color:rgba(var(--color-warning-rgb),.28);background:rgba(var(--color-warning-rgb),.12);color:var(--color-text)}.working-patterns-page .pattern-drawer-backdrop{position:fixed;inset:0;z-index:1200;display:flex;justify-content:flex-end;padding:16px;background:#0a141c73;backdrop-filter:blur(2px)}.working-patterns-page .pattern-drawer{width:min(960px,100%);height:100%;overflow:auto;display:grid;gap:18px;padding:20px;background:var(--color-surface);border:1px solid rgba(0,0,0,.08);border-radius:24px;box-shadow:var(--shadow-soft)}.working-patterns-page .pattern-drawer__header{position:sticky;top:0;z-index:1;display:flex;justify-content:space-between;align-items:flex-start;gap:16px;padding-bottom:12px;border-bottom:1px solid var(--color-border);background:var(--color-surface)}.working-patterns-page .pattern-drawer__heading{min-width:0}.working-patterns-page .pattern-drawer__close{width:40px;height:40px;min-width:40px;border-radius:12px;border:1px solid var(--color-border);background:var(--color-surface);color:var(--color-text);font-size:24px;font-weight:700;line-height:1}.working-patterns-page .pattern-drawer__close:disabled{opacity:.6;cursor:not-allowed}@media (max-width: 1100px){.working-patterns-page .pattern-list-card__header{flex-direction:column;align-items:stretch}.working-patterns-page .pattern-list-card__actions{justify-content:flex-start}.working-patterns-page .pattern-search-input{width:100%;max-width:none}.working-patterns-page .pattern-table{min-width:1280px}.working-patterns-page .pattern-drawer-backdrop{padding:0}.working-patterns-page .pattern-drawer{width:100%;height:100%;border:none;border-radius:0}}@media (max-width: 768px){.working-patterns-page .form-grid,.working-patterns-page .day-grid,.working-patterns-page .modal-grid,.working-patterns-page .calculation-grid{grid-template-columns:1fr}.working-patterns-page .pattern-table thead th,.working-patterns-page .pattern-table tbody td{padding:8px 10px}.working-patterns-page .pattern-drawer{padding:16px}.working-patterns-page .pattern-drawer__header{padding-bottom:10px}}.modal-overlay{position:fixed;inset:0;background:var(--color-overlay);display:flex;align-items:flex-start;justify-content:center;overflow-y:auto;padding:24px 16px;z-index:1000;box-sizing:border-box}.modal-card{width:min(1040px,100%);max-height:calc(100vh - 48px);background:var(--color-surface);border:1px solid var(--color-border);border-radius:24px;box-shadow:var(--shadow-pop);overflow-x:hidden;overflow-y:auto;margin:24px auto;box-sizing:border-box}.modal-card__header{padding:24px;border-bottom:1px solid var(--color-border);display:flex;justify-content:space-between;gap:16px;align-items:flex-start}.modal-card__title{margin:0;color:var(--color-text);font-size:22px;font-weight:800}.modal-card__subtitle{margin:6px 0 0;color:var(--color-muted)}.modal-card__body{padding:24px}.modal-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}.modal-grid--single{grid-template-columns:1fr}.modal-actions{display:flex;gap:12px;justify-content:flex-end;margin-top:24px}.profile-chip{display:inline-flex;align-items:center;gap:12px;padding:10px 12px;border-radius:18px;background:#ffffff14;border:1px solid rgba(255,255,255,.12)}.profile-chip__copy{display:flex;flex-direction:column;min-width:0}.profile-chip__name{margin:0;font-size:14px;font-weight:700;color:var(--color-surface)}.profile-chip__meta{margin:2px 0 0;font-size:12px;color:#ffffffb8}.sidebar{background:var(--color-primary)!important;color:var(--color-surface)!important}.sidebar-header,.sidebar-footer{border-color:var(--color-on-primary-border)!important}.sidebar-brand,.sidebar-brand-copy span,.sidebar .nav-item,.sidebar .user-info-copy p{color:var(--color-on-primary-strong)!important}.sidebar-brand-copy small,.sidebar .user-info-copy small{color:var(--color-on-primary-muted)!important}.sidebar .nav-item:hover{background-color:var(--color-on-primary-hover)!important;color:var(--color-surface)!important}.sidebar .nav-item.active{background-color:var(--color-accent)!important;color:var(--color-surface)!important;border-left-color:var(--color-surface)!important}.sidebar .nav-children{margin:.35rem 0 .9rem 3.25rem;display:grid;gap:.35rem}.sidebar .nav-subitem{display:grid;grid-template-columns:34px 1fr;align-items:center;gap:.65rem;padding:.55rem .7rem;border-radius:16px;color:#ffffffd6;text-decoration:none;border:1px solid transparent;background:#ffffff0f;transition:background .2s ease,color .2s ease,transform .2s ease,box-shadow .2s ease,border-color .2s ease}.sidebar .nav-subitem:hover{background:#ffffff1c;color:var(--color-surface)!important;transform:translate(2px)}.sidebar .nav-subitem.active{background:#ec008c8c;color:var(--color-surface)!important;border-color:#ffffff29;box-shadow:inset 3px 0 0 var(--color-surface)}.sidebar .nav-subitem-dot{width:30px;height:30px;border-radius:11px;display:grid;place-items:center;background:#ffffff21;color:var(--color-surface);font-size:.7rem;font-weight:900;flex-shrink:0}.sidebar .nav-subitem-text{min-width:0;display:grid;gap:.1rem}.sidebar .nav-subitem-text strong{font-size:.9rem;line-height:1.1;font-weight:800}.sidebar .logout-btn{background-color:var(--color-surface)!important;color:var(--color-primary)!important}.sidebar .logout-btn:hover{background-color:var(--color-on-primary-strong)!important}@media (max-width: 640px){.sidebar .nav-children{margin-left:2.4rem}}.topbar{background:var(--color-surface)!important;border-bottom:1px solid var(--color-border)!important;box-shadow:var(--shadow-sm)!important}.topbar-brand-copy h1{color:var(--color-primary)!important}.topbar-brand-copy span{color:var(--color-muted)!important}.employee-container .header,.access-container .header,.leave-container .header,.volunteer-container .header{border-color:var(--color-border)!important}.table thead{background-color:var(--color-bg)!important}.table th{color:var(--color-muted)!important;border-bottom:1px solid var(--color-border)!important}.table td{border-bottom:1px solid var(--color-border)!important}.table tbody tr:hover{background-color:rgba(var(--color-primary-rgb),.04)!important}.modal-overlay{background-color:var(--color-overlay)!important}.toast{background-color:var(--color-surface)!important;color:var(--color-text)!important;border:1px solid var(--color-border)!important;box-shadow:var(--shadow-sm)!important}.toast-success{background-color:var(--color-success-bg)!important;color:var(--color-success-text)!important;border-left:4px solid var(--color-success)!important}.toast-error{background-color:var(--color-danger-bg)!important;color:var(--color-danger-text)!important;border-left:4px solid var(--color-danger)!important}.toast-warning{background-color:var(--color-warning-bg)!important;color:var(--color-warning-text)!important;border-left:4px solid var(--color-warning)!important}.toast-info{background-color:var(--color-info-bg)!important;color:var(--color-info-text)!important;border-left:4px solid var(--color-info)!important}.container-fluid{width:100%;padding-inline:clamp(20px,2.4vw,32px)}.border-0{border:0!important}.py-3{padding-top:1rem!important;padding-bottom:1rem!important}.py-5{padding-top:3rem!important;padding-bottom:3rem!important}.px-0{padding-left:0!important;padding-right:0!important}.px-4{padding-left:1.25rem!important;padding-right:1.25rem!important}.py-3,.py-5,.px-0,.px-4,.pt-3,.pb-0,.pb-4,.p-lg-5{box-sizing:border-box}.pt-3{padding-top:1rem!important}.pb-0{padding-bottom:0!important}.pb-4{padding-bottom:1.25rem!important}.p-lg-5{padding:3rem!important}.text-end{text-align:right!important}.text-muted{color:var(--color-muted)!important}.text-primary{color:var(--color-primary)!important}.text-danger{color:var(--color-danger)!important}.text-sm{font-size:.875rem!important;line-height:1.45}.fw-bold{font-weight:800!important}.text-nowrap{white-space:nowrap!important}.flex-wrap{flex-wrap:wrap!important}.align-items-center{align-items:center!important}.align-items-end{align-items:flex-end!important}.justify-content-end{justify-content:flex-end!important}.justify-content-between{justify-content:space-between!important}.row{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:var(--grid-gap, 1rem);min-width:0}.g-3{--grid-gap: 1rem}[class*=col-]{min-width:0}.col-12,.col-md-4,.col-md-6,.col-lg-3,.col-lg-4,.col-lg-6,.col-lg-8,.col-xl-2,.col-xl-4{grid-column:span 12}@media (min-width: 768px){.col-md-4{grid-column:span 4}.col-md-6{grid-column:span 6}}@media (min-width: 992px){.col-lg-3{grid-column:span 3}.col-lg-4{grid-column:span 4}.col-lg-6{grid-column:span 6}.col-lg-8{grid-column:span 8}}@media (min-width: 1200px){.col-xl-2{grid-column:span 2}.col-xl-4{grid-column:span 4}}.form-label{display:inline-block;margin-bottom:.45rem;color:var(--color-text);font-size:.95rem;font-weight:700}.form-control,.form-select,.soft-field,.form-field__control{width:100%;min-height:3rem;padding:.9rem 1rem;border:1px solid var(--color-border)!important;border-radius:16px;background-color:var(--color-surface)!important;color:var(--color-text);box-shadow:var(--shadow-sm)}.form-control:focus,.form-select:focus,.soft-field:focus{outline:none!important;border-color:var(--color-primary)!important;box-shadow:0 0 0 4px rgba(var(--color-primary-rgb),.12)!important}.form-control.is-invalid,.form-select.is-invalid,.soft-field.is-invalid{border-color:var(--color-danger)!important}.primary-action{color:var(--color-surface)!important;box-shadow:var(--shadow-sm);background:linear-gradient(135deg,var(--color-primary),var(--color-accent))!important;border-color:rgba(var(--color-primary-rgb),.16)!important}.secondary-action{background:var(--color-surface)!important;color:var(--color-primary)!important;border-color:rgba(var(--color-primary-rgb),.22)!important;box-shadow:var(--shadow-sm)}.secondary-action:hover:not(:disabled){background:rgba(var(--color-primary-rgb),.08)!important;border-color:rgba(var(--color-primary-rgb),.3)!important;color:var(--color-primary)!important}.danger-action{background:var(--color-surface)!important;color:var(--color-danger)!important;border-color:#dc35453d!important}.primary-action--sm,.secondary-action--sm,.danger-action--sm{min-height:2.5rem;padding:.65rem 1rem;font-size:.875rem}.primary-action:hover:not(:disabled),.secondary-action:hover:not(:disabled),.danger-action:hover:not(:disabled){transform:translateY(-1px);box-shadow:var(--shadow-pop)}.primary-action:disabled,.secondary-action:disabled,.danger-action:disabled,.logout-btn:disabled{opacity:.6;cursor:not-allowed;box-shadow:none;transform:none}.message-banner{display:flex;align-items:center;justify-content:space-between;gap:1rem;padding:1rem 1.15rem;border-radius:var(--radius-xl);border:1px solid var(--color-border);background:var(--color-surface);box-shadow:var(--shadow-soft)}.message-banner--success{border-color:#1f8f4a33;background:#1f8f4a14;color:var(--color-success-text)}.message-banner--error{border-color:#dc354533;background:#dc354514;color:var(--color-danger-text)}.table-responsive{overflow-x:auto;-webkit-overflow-scrolling:touch}.table{width:100%;border-collapse:collapse;border-spacing:0}.table th,.table td{padding:1rem 1.15rem;vertical-align:middle}.table thead th{color:var(--color-muted)!important;background:linear-gradient(180deg,#fbf8fc,var(--color-surface));border-bottom:1px solid var(--color-border)!important;font-size:.74rem;font-weight:800;letter-spacing:.1em;text-transform:uppercase;white-space:nowrap}.table tbody td{border-bottom:1px solid var(--color-border)!important}.table-striped>tbody>tr:nth-of-type(odd){background:rgba(var(--color-primary-rgb),.02)}.table-hover>tbody>tr:hover{background:rgba(var(--color-primary-rgb),.04)!important}.table-light{background:rgba(var(--color-primary-rgb),.04)!important}.status-pill{display:inline-flex;align-items:center;justify-content:center;padding:.48rem .85rem;border-radius:999px;border:1px solid transparent;font-size:.75rem;font-weight:800;line-height:1;letter-spacing:.02em;text-transform:capitalize}.status-pill--draft{background:#8392ab24;color:#6b7280;border-color:#8392ab33}.status-pill--warning{background:rgba(var(--color-warning-rgb),.12);color:var(--color-warning-text);border-color:rgba(var(--color-warning-rgb),.2)}.status-pill--submitted{background:rgba(var(--color-secondary-rgb),.12);color:var(--color-secondary);border-color:rgba(var(--color-secondary-rgb),.2)}.status-pill--returned{background:rgba(var(--color-warning-rgb),.12);color:var(--color-warning-text);border-color:rgba(var(--color-warning-rgb),.2)}.status-pill--approved{background:rgba(var(--color-success-rgb),.12);color:var(--color-success);border-color:rgba(var(--color-success-rgb),.2)}.status-pill--rejected{background:rgba(var(--color-danger-rgb),.12);color:var(--color-danger);border-color:rgba(var(--color-danger-rgb),.2)}.status-pill--paid{background:rgba(var(--color-primary-rgb),.12);color:var(--color-primary);border-color:rgba(var(--color-primary-rgb),.2)}.expense-form-page{width:min(100%,1280px);margin:0 auto;padding:clamp(28px,3vw,40px) clamp(20px,2.4vw,32px) 2.5rem;display:grid;gap:1.5rem;color:var(--color-text)}.expense-form-page .expense-hero-card,.expense-form-page .form-section-card,.expense-form-page .form-actions-card,.expense-form-page .loading-card{border:1px solid #eadff0;border-radius:24px;background:var(--color-surface);box-shadow:var(--shadow-soft)}.expense-form-page .expense-hero-card{padding:clamp(24px,2.8vw,36px);background:radial-gradient(circle at top right,rgba(var(--color-accent-rgb),.14),transparent 32%),radial-gradient(circle at left center,rgba(var(--color-primary-rgb),.08),transparent 26%),linear-gradient(135deg,#fff,#faf7fc)}.expense-form-page .expense-hero-card__top,.expense-form-page .form-actions-card__content,.expense-form-page .receipt-grid{display:grid;gap:1rem}.expense-form-page .expense-hero-card__top{grid-template-columns:minmax(0,1.5fr) minmax(280px,.9fr);align-items:start}.expense-form-page .expense-hero-card__eyebrow,.expense-form-page .form-section-card__eyebrow,.expense-form-page .form-actions-card__eyebrow,.expense-form-page .receipt-preview-card__eyebrow{margin:0 0 .45rem;color:var(--color-accent);font-size:.75rem;font-weight:800;letter-spacing:.14em;text-transform:uppercase}.expense-form-page .expense-hero-card__copy h1,.expense-form-page .form-section-card__header h2,.expense-form-page .form-actions-card__copy h3{margin:0;color:var(--color-text);line-height:1.08;font-weight:800}.expense-form-page .expense-hero-card__copy h1{font-size:clamp(1.8rem,2.8vw,2.85rem)}.expense-form-page .expense-hero-card__copy p,.expense-form-page .form-section-card__header p,.expense-form-page .form-actions-card__copy p{margin:.8rem 0 0;color:var(--color-muted);line-height:1.65}.expense-form-page .expense-hero-card__actions{display:flex;flex-wrap:wrap;gap:.75rem;justify-content:flex-end;align-items:center}.expense-form-page .expense-hero-card__meta{margin-top:1.5rem;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:.85rem}.expense-form-page .hero-meta-card{padding:1rem 1.05rem;border-radius:20px;background:#ffffffeb;border:1px solid #eadff0}.expense-form-page .hero-meta-card__label{display:block;margin-bottom:.25rem;color:var(--color-muted);font-size:.72rem;font-weight:800;letter-spacing:.08em;text-transform:uppercase}.expense-form-page .hero-meta-card__value{color:var(--color-text);word-break:break-word}.expense-form-page .loading-card{padding:2rem}.expense-form-page .loading-card__inner{min-height:180px;display:grid;place-items:center;gap:.9rem;text-align:center}.expense-form-page .expense-form-shell{display:grid;gap:1.5rem}.expense-form-page .form-section-card{padding:1.5rem}.expense-form-page .form-section-card__header{margin-bottom:1.2rem}.expense-form-page .form-section-card__header h2{font-size:clamp(1.25rem,1.6vw,1.55rem)}.expense-form-page .form-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:1rem}.expense-form-page .form-field{min-width:0;display:grid;gap:.45rem}.expense-form-page .form-field--span-2{grid-column:span 2}.expense-form-page .form-field--span-3{grid-column:span 3}.expense-form-page .form-field--span-4{grid-column:1/-1}.expense-form-page .form-label{margin:0;color:#1f2a44;font-size:.92rem;font-weight:800}.expense-form-page .form-field__control{width:100%;min-width:0}.expense-form-page :is(.form-field__control,.soft-field){min-height:46px;padding:.8rem 1rem;border:1px solid #e3d6e8!important;border-radius:16px;background:var(--color-surface)!important;color:var(--color-text);box-shadow:none}.expense-form-page .form-field__control--textarea{min-height:140px;resize:vertical}.expense-form-page :is(.form-field__control,.soft-field):focus{outline:none!important;border-color:var(--color-primary)!important;box-shadow:var(--shadow-focus)!important}.expense-form-page :is(.primary-action,.secondary-action,.danger-action,.ghost-action){display:inline-flex;align-items:center;justify-content:center;gap:.5rem;min-height:46px;padding:.8rem 1.2rem;border:1px solid transparent;border-radius:999px;font-weight:800;text-decoration:none;appearance:none;-webkit-appearance:none}.expense-form-page :is(.primary-action--sm,.secondary-action--sm,.danger-action--sm){min-height:38px;padding:.62rem .95rem}.expense-form-page .ghost-action{background:#ffffffeb!important;color:var(--color-muted)!important;border-color:#eadff0!important;box-shadow:var(--shadow-sm)}.expense-form-page .ghost-action:hover:not(:disabled){background:#fff!important;color:var(--color-primary)!important}.expense-form-page .danger-action{background:#fff!important;color:var(--color-danger)!important;border-color:#dc35453d!important}.expense-form-page .field-error,.expense-form-page .field-help{font-size:.84rem;line-height:1.45}.expense-form-page .field-error{color:var(--color-danger)}.expense-form-page .field-help{color:var(--color-muted)}.expense-form-page .receipt-grid{grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr)}.expense-form-page .receipt-upload-card,.expense-form-page .receipt-preview-card{padding:1rem;border:1px solid #eadff0;border-radius:20px;background:var(--color-surface)}.expense-form-page .receipt-upload-card__actions,.expense-form-page .receipt-preview-card__header,.expense-form-page .receipt-preview-card__actions,.expense-form-page .action-buttons{display:flex;align-items:center;gap:.75rem;flex-wrap:wrap}.expense-form-page .receipt-upload-card__actions,.expense-form-page .receipt-preview-card__header{justify-content:space-between}.expense-form-page .receipt-file-input{display:none}.expense-form-page .upload-icon,.expense-form-page .receipt-doc-badge{width:48px;height:48px;border-radius:18px;display:inline-grid;place-items:center;font-size:.75rem;font-weight:900;letter-spacing:.08em;flex-shrink:0}.expense-form-page .upload-icon{background:linear-gradient(135deg,rgba(var(--color-primary-rgb),.16),rgba(var(--color-accent-rgb),.16));color:var(--color-primary)}.expense-form-page .receipt-doc-badge{background:rgba(var(--color-primary-rgb),.1);color:var(--color-primary)}.expense-form-page .receipt-preview-card__title-block{min-width:0;display:grid;gap:.3rem}.expense-form-page .receipt-preview-card__name{color:var(--color-text);word-break:break-word}.expense-form-page .receipt-preview-card__body{margin-top:1rem}.expense-form-page .receipt-preview-card__image{width:100%;max-height:280px;object-fit:contain;border-radius:18px;border:1px solid #eadff0;background:#f8f9fc}.expense-form-page .receipt-preview-card__document,.expense-form-page .receipt-preview-card__empty{min-height:220px;padding:1.5rem;display:grid;place-items:center;gap:.65rem;text-align:center;border-radius:18px;border:1px dashed #e4d5ea;background:linear-gradient(180deg,#f8f9fce0,#fff);color:var(--color-muted)}.expense-form-page .receipt-preview-card__document--pdf{border-style:solid;border-color:#f5365c2e}.expense-form-page .receipt-preview-card__document-title{margin:0;color:var(--color-text);font-weight:800;word-break:break-word}.expense-form-page .form-actions-card{padding:1.5rem}.expense-form-page .form-actions-card__content{grid-template-columns:minmax(0,1fr) auto;align-items:center}.expense-form-page .form-actions-card__copy h3{font-size:1.1rem}.expense-form-page .action-buttons{justify-content:flex-end}@media (max-width: 1199.98px){.expense-form-page .expense-hero-card__top,.expense-form-page .receipt-grid,.expense-form-page .expense-hero-card__meta{grid-template-columns:1fr}.expense-form-page .expense-hero-card__actions{justify-content:flex-start}}@media (max-width: 900px){.expense-form-page .form-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.expense-form-page .form-field--span-2,.expense-form-page .form-field--span-3,.expense-form-page .form-field--span-4{grid-column:1/-1}.expense-form-page .form-actions-card__content{grid-template-columns:1fr}.expense-form-page .action-buttons{justify-content:flex-start}}@media (max-width: 640px){.expense-form-page{padding:1.75rem 16px 2rem}.expense-form-page .form-grid{grid-template-columns:1fr}.expense-form-page .expense-hero-card__actions,.expense-form-page .action-buttons{flex-direction:column;align-items:stretch}}@media print{body{background:#fff}.no-print{display:none}}
