/*
 * Sillage admin theme (design-system/tokens.json): plain CSS on top of Filament,
 * no build step required on the host. Sidebar = trust (#001f66) with white text,
 * brand #004dff, accent #4dff00 used sparingly, Bricolage Grotesque headings,
 * Nunito Sans body-sm density, 44px table rows.
 */
:root {
  --sl-brand: #004dff; --sl-brand-strong: #0038c2; --sl-trust: #001f66; --sl-on-trust: #ffffff;
  --sl-trust-tint: #e4ffd6; --sl-accent: #4dff00; --sl-ink: #0a1433; --sl-ink-muted: #4f5873;
  --sl-surface: #ffffff; --sl-surface-sunken: #e8ecf5; --sl-border: #d6dcea; --sl-border-strong: #7a849e;
  --sl-danger: #d60000; --sl-danger-tint: #ffe0e0; --sl-info-tint: #e0e9ff; --sl-success-strong: #268000;
  --sl-shadow-card: 0 2px 8px rgba(10, 20, 51, 0.08);
  --sl-font-display: 'Bricolage Grotesque', 'Nunito Sans', system-ui, sans-serif;
}
.fi-body { font-size: 14px; line-height: 20px; color: var(--sl-ink); }
.dark .fi-body { color: #eef1fa; }

/* Sidebar */
.fi-sidebar, .fi-sidebar-header, .fi-sidebar-header-ctn { background: var(--sl-trust) !important; }
.fi-sidebar .fi-logo { color: var(--sl-on-trust) !important; font-family: var(--sl-font-display); font-weight: 800; font-size: 26px; }
.fi-sidebar-group-label, .fi-sidebar .fi-sidebar-group-btn { color: rgba(255,255,255,.72) !important; }
.fi-sidebar-item-btn { min-height: 44px; border-radius: 12px; }
.fi-sidebar-item-label, .fi-sidebar-item-icon { color: var(--sl-on-trust) !important; }
.fi-sidebar-item-btn:hover { background: rgba(255,255,255,.10) !important; }
.fi-sidebar-item.fi-active > .fi-sidebar-item-btn { background: #ffffff !important; }
.fi-sidebar-item.fi-active .fi-sidebar-item-label, .fi-sidebar-item.fi-active .fi-sidebar-item-icon { color: var(--sl-trust) !important; font-weight: 700; }
.fi-sidebar-item-grouped-border-part { background: rgba(255,255,255,.4) !important; }

/* Headings & numbers */
.fi-header-heading, .fi-section-header-heading, .fi-modal-heading, .fi-wi-stats-overview-stat-value, .sl-display {
  font-family: var(--sl-font-display); font-weight: 700;
}
.fi-wi-stats-overview-stat-value { font-weight: 800; }
.fi-section, .fi-wi-stats-overview-stat, .fi-ta-ctn { border-radius: 20px !important; box-shadow: var(--sl-shadow-card); }

/* Dense tables: 44px rows */
.fi-ta-row { height: 44px; }
.fi-ta-cell { padding-top: 6px !important; padding-bottom: 6px !important; font-size: 14px; }

/* Buttons: pills; sensitive actions = secondary bordered danger */
.fi-btn { border-radius: 999px !important; }
.fi-btn.sl-sensitive, .sl-sensitive.fi-btn { background: transparent !important; color: var(--sl-danger) !important; box-shadow: inset 0 0 0 2px var(--sl-danger) !important; }
.dark .fi-btn.sl-sensitive { color: #ff8a8a !important; box-shadow: inset 0 0 0 2px #ff8a8a !important; }

/* Sillage helpers used by custom pages */
.sl-card { background: var(--sl-surface); border-radius: 20px; box-shadow: var(--sl-shadow-card); padding: 20px; }
.dark .sl-card { background: #141f45; }
.sl-muted { color: var(--sl-ink-muted); }
.dark .sl-muted { color: #a9b1c7; }
.sl-badge { display: inline-block; padding: 4px 10px; border-radius: 8px; font-size: 12px; font-weight: 700; color: var(--sl-ink); white-space: nowrap; }
.sl-badge-ok { background: var(--sl-trust-tint); } .sl-badge-wait { background: var(--sl-info-tint); }
.sl-badge-bad { background: var(--sl-danger-tint); } .sl-badge-off { background: var(--sl-surface-sunken); }
.sl-live { display: inline-flex; align-items: center; gap: 8px; padding: 8px 14px; background: var(--sl-trust-tint); color: var(--sl-ink); border-radius: 8px; font-weight: 700; }
.sl-live-dot { width: 8px; height: 8px; border-radius: 999px; background: var(--sl-success-strong); }
.sl-live.sl-down { background: var(--sl-danger-tint); } .sl-live.sl-down .sl-live-dot { background: var(--sl-danger); }
.sl-grid { display: grid; gap: 16px; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); }
.sl-row { display: flex; justify-content: space-between; gap: 12px; padding: 10px 0; border-bottom: 1px solid var(--sl-border); }
.dark .sl-row { border-color: #2a3560; }
.sl-row:last-child { border-bottom: 0; }
.sl-row > span:last-child { font-weight: 700; text-align: end; }
.sl-pill { padding: 4px 10px; border-radius: 8px; background: var(--sl-info-tint); color: var(--sl-ink); }
.sl-timeline-at { font-family: var(--sl-font-display); font-weight: 700; min-width: 56px; }
.sl-map { height: 280px; border-radius: 16px; overflow: hidden; background: var(--sl-surface-sunken); }
.sl-check { width: 26px; height: 26px; border-radius: 999px; display: inline-flex; align-items: center; justify-content: center; font-weight: 700; }
.sl-check-yes { background: var(--sl-trust); color: #fff; } .sl-check-no { border: 1.5px solid var(--sl-border-strong); color: var(--sl-ink-muted); }
.sl-doc { background: var(--sl-surface-sunken); border-radius: 12px; min-height: 140px; display: flex; align-items: center; justify-content: center; overflow: hidden; }
.sl-doc img { max-width: 100%; max-height: 320px; }
.sl-queue-item { display: flex; gap: 12px; align-items: center; padding: 12px; border-radius: 12px; }
.sl-queue-item.sl-active { background: var(--sl-info-tint); }
.sl-avatar { width: 40px; height: 40px; border-radius: 999px; background: var(--sl-trust); color: #fff; display: flex; align-items: center; justify-content: center; font-weight: 700; flex-shrink: 0; }
.sl-diff-before { background: var(--sl-danger-tint); } .sl-diff-after { background: var(--sl-trust-tint); }
.sl-table { width: 100%; border-collapse: collapse; } .sl-table th, .sl-table td { text-align: start; padding: 10px 8px; border-bottom: 1px solid var(--sl-border); vertical-align: top; }
.sl-table th { color: var(--sl-ink-muted); font-weight: 700; }
