:root { --brand:#132238; --brand2:#2563eb; --bg:#f5f7fb; --line:#e5eaf2; --muted:#64748b; }
body { background: var(--bg); color:#172033; }
.app-nav { background: #132238; box-shadow: 0 8px 24px rgba(15,23,42,.14); }
.app-nav .navbar-brand { margin-right:4rem; }
.app-nav .navbar-nav .nav-link { color:#fff; font-size:1.02rem; font-weight:700; padding-left:1rem; padding-right:1rem; }
.app-nav .navbar-nav .nav-link:hover, .app-nav .navbar-nav .nav-link:focus { color:#dbeafe; }
.app-nav .navbar-nav .nav-link.show { color:#fff; }
.app-brand-lockup { display:inline-flex; flex-direction:column; align-items:center; gap:.2rem; line-height:1.1; }
.app-brand-logo { width:7.25rem; max-width:50%; height:auto; display:block; }
.btn-request-leave { background:#dbeafe; border-color:#dbeafe; color:#1e3a8a; font-weight:700; }
.btn-request-leave:hover, .btn-request-leave:focus { background:#bfdbfe; border-color:#bfdbfe; color:#172554; }
.btn-request-credit { background:transparent; border-color:rgba(255,255,255,.45); color:rgba(255,255,255,.82); font-weight:700; }
.btn-request-credit:hover, .btn-request-credit:focus { background:rgba(255,255,255,.14); border-color:rgba(255,255,255,.72); color:#fff; }
.nav-user-actions { display:flex; flex-direction:column; align-items:center; gap:.55rem; }
.nav-user-name { display:flex; align-items:center; justify-content:center; gap:.35rem; font-weight:400; line-height:1; text-align:center; }
.profile-edit-btn { display:inline-grid; place-items:center; width:1.35rem; height:1.35rem; border:0; border-radius:999px; background:rgba(255,255,255,.14); color:#fff; padding:0; }
.profile-edit-btn:hover, .profile-edit-btn:focus { background:rgba(255,255,255,.24); color:#fff; }
.app-container { max-width: 1500px; }
.card { border:1px solid var(--line); border-radius: 8px; box-shadow: 0 10px 26px rgba(15,23,42,.06); }
.card-header { background:#fff; border-bottom:1px solid var(--line); border-radius:8px 8px 0 0!important; }
.btn { border-radius: 8px; }
.form-control, .form-select { border-radius: 8px; }
.badge { border-radius: 999px; padding:.5em .75em; }
.status-pending { background:#f59e0b; }
.status-approved { background:#16a34a; }
.status-rejected { background:#dc2626; }
.status-cancel_requested { background:#7c3aed; }
.status-cancelled { background:#64748b; }
.hero { background:#fff; border:1px solid var(--line); border-radius:8px; padding:30px; box-shadow: 0 10px 26px rgba(15,23,42,.06); }
.table thead th { color:#475569; font-size:.78rem; text-transform:uppercase; letter-spacing:.05em; }
.metric-label { color:var(--muted); font-size:.78rem; font-weight:700; letter-spacing:.05em; text-transform:uppercase; }
.metric-value { font-size:2.35rem; font-weight:800; line-height:1.1; }
.report-year-input { max-width: 110px; }
.report-date-input { max-width: 165px; }
.report-bar { height:10px; overflow:hidden; background:#e8edf5; border-radius:999px; }
.report-bar span { display:block; height:100%; background:#2563eb; border-radius:999px; }
.report-dot { display:inline-block; width:.75rem; height:.75rem; border-radius:999px; margin-right:.5rem; vertical-align:-.05rem; }
.usage-chip-list { display:flex; flex-wrap:wrap; gap:.4rem; min-width:240px; }
.usage-chip { display:inline-flex; align-items:center; gap:.25rem; border:1px solid #dbe3ef; border-radius:999px; padding:.35rem .6rem; background:#fff; color:#334155; font-size:.78rem; white-space:nowrap; }
.usage-chip .report-dot { margin-right:.1rem; }
.balance-mini { display:grid; gap:.25rem; min-width:180px; font-size:.86rem; }
.balance-mini > div { display:flex; justify-content:space-between; gap:.75rem; }
.balance-mini .badge { justify-content:center; width:100%; }
.page-head { display:flex; align-items:center; justify-content:space-between; gap:1rem; }
.eyebrow { color:var(--muted); font-size:.72rem; font-weight:800; letter-spacing:.08em; text-transform:uppercase; }
.stat-tile { background:#fff; border:1px solid var(--line); border-radius:8px; padding:1.25rem; box-shadow:0 10px 26px rgba(15,23,42,.05); }
.directory-card { overflow:hidden; }
.directory-toolbar { display:flex; align-items:center; justify-content:space-between; gap:1rem; padding:1.25rem; border-bottom:1px solid var(--line); background:#fff; }
.filter-toolbar { display:flex; flex-wrap:wrap; align-items:end; justify-content:space-between; gap:1rem; padding:1.25rem; border-bottom:1px solid var(--line); background:#fff; }
.filter-field { width:min(100%, 420px); }
.bulk-toolbar { display:flex; flex-wrap:wrap; align-items:center; gap:.75rem; padding:1rem 1.25rem; border-bottom:1px solid var(--line); background:#f8fafc; }
.bulk-input { max-width:190px; }
.bulk-status-input { max-width:130px; }
.directory-search { position:relative; width:min(100%, 360px); }
.directory-search i { position:absolute; left:.9rem; top:50%; transform:translateY(-50%); color:var(--muted); pointer-events:none; }
.directory-search .form-control { padding-left:2.35rem; }
.directory-table > :not(caption) > * > * { padding:1rem 1.25rem; }
.directory-table tbody tr { transition:background-color .15s ease; }
.directory-table tbody tr:hover { background:#f8fafc; }
.person-cell { display:flex; align-items:center; gap:.85rem; min-width:220px; }
.avatar { width:42px; height:42px; display:grid; place-items:center; border-radius:999px; background:#132238; color:#fff; font-size:.85rem; font-weight:800; }
.rule-color { width:42px; height:42px; display:inline-block; flex:0 0 auto; border-radius:999px; box-shadow:inset 0 0 0 4px rgba(255,255,255,.75), 0 0 0 1px var(--line); }
.soft-pill { display:inline-flex; align-items:center; border:1px solid #dbe3ef; border-radius:999px; padding:.35rem .65rem; background:#f8fafc; color:#334155; font-size:.8rem; font-weight:700; }
.member-badges { display:flex; flex-wrap:wrap; gap:.35rem; max-width:520px; }
.member-grid { display:grid; grid-template-columns:repeat(2, minmax(0, 1fr)); gap:.75rem; }
.member-card { display:grid; grid-template-columns:minmax(0, 1fr) 170px; align-items:center; gap:.75rem; border:1px solid var(--line); border-radius:8px; padding:.85rem; background:#fff; }
.day-grid { display:grid; grid-template-columns:repeat(7, minmax(0, 1fr)); gap:.5rem; }
.day-toggle { cursor:pointer; }
.day-toggle input { position:absolute; opacity:0; pointer-events:none; }
.day-toggle span { display:grid; min-height:42px; place-items:center; border:1px solid var(--line); border-radius:8px; background:#fff; color:#475569; font-weight:800; }
.day-toggle input:checked + span { border-color:#2563eb; background:#eff6ff; color:#1d4ed8; }
.modal-content { border:0; border-radius:10px; box-shadow:0 24px 80px rgba(15,23,42,.24); }
.modal-header, .modal-footer { border-color:var(--line); }

.fc { --fc-border-color:var(--line); --fc-page-bg-color:#fff; --fc-today-bg-color:#eff6ff; color:#172033; }
.fc a { color:inherit; text-decoration:none; }
.fc .fc-toolbar { align-items:center; gap:1rem; margin-bottom:1.25rem!important; }
.fc .fc-toolbar-title { color:#132238; font-size:1.35rem; font-weight:800; letter-spacing:0; }
.fc .fc-button-primary { background:#132238; border-color:#132238; border-radius:8px; box-shadow:none; font-weight:700; text-transform:capitalize; }
.fc .fc-button-primary:hover, .fc .fc-button-primary:focus { background:#1f3658; border-color:#1f3658; box-shadow:none; }
.fc .fc-button-primary:disabled { background:#dbe3ef; border-color:#dbe3ef; color:#64748b; opacity:1; }
.fc .fc-button-primary:not(:disabled).fc-button-active { background:#2563eb; border-color:#2563eb; }
.fc-theme-standard .fc-scrollgrid { border:1px solid var(--line); border-radius:8px; overflow:hidden; box-shadow:0 10px 26px rgba(15,23,42,.05); }
.fc-theme-standard td, .fc-theme-standard th { border-color:var(--line); }
.fc .fc-col-header-cell { background:#f8fafc; padding:.8rem .35rem; }
.fc .fc-col-header-cell-cushion { color:#475569; font-size:.78rem; font-weight:800; letter-spacing:.05em; text-transform:uppercase; }
.fc .fc-daygrid-day-number { margin:.35rem; min-width:1.8rem; height:1.8rem; display:inline-grid; place-items:center; border-radius:999px; color:#334155; font-weight:800; }
.fc .fc-day-today .fc-daygrid-day-number { background:#2563eb; color:#fff; }
.fc .fc-daygrid-day.fc-day-other { background:#fbfdff; }
.fc .fc-daygrid-day.fc-day-other .fc-daygrid-day-number { color:#94a3b8; }
.fc .fc-event { border:0; border-radius:6px; padding:.15rem .35rem; box-shadow:0 4px 10px rgba(15,23,42,.12); }
.fc .fc-event-title, .fc .fc-event-time { font-weight:700; }
.fc .fc-daygrid-more-link { color:#2563eb; font-weight:800; text-decoration:none; }
.fc .fc-daygrid-day-frame { min-height:96px; }

@media (max-width: 768px) {
  .app-nav .navbar-brand { margin-right:1rem; }
  .nav-user-actions { align-items:flex-start; margin-top:.75rem; }
  .nav-user-name { text-align:left; }
  .page-head, .directory-toolbar, .filter-toolbar { align-items:stretch; flex-direction:column; }
  .page-head .btn, .directory-search, .filter-field { width:100%; }
  .member-grid { grid-template-columns:1fr; }
  .member-card { grid-template-columns:1fr; }
  .day-grid { grid-template-columns:repeat(2, minmax(0, 1fr)); }
  .fc .fc-toolbar { align-items:stretch; flex-direction:column; }
  .fc .fc-toolbar-chunk { display:flex; justify-content:center; }
  .fc .fc-toolbar-title { font-size:1.1rem; text-align:center; }
}