:root {
  --admin-font: "Open Sans", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;

  --admin-radius-md: 4px;
  --admin-radius-lg: 4px;
  --admin-radius-pill: 4px;

  --admin-staging: #F59E0B;

  --admin-accent: #0088FF;
  --admin-bg-hover: #F1F5F9;
  --admin-bg-input: #F1F5F9;
  --admin-bg-page: #F4F6F6;
  --admin-bg-sidebar: #FFFFFF;
  --admin-bg-surface: #FFFFFF;
  --admin-bg-surface-2: #F8F9FA;
  --admin-border: #E5E7EB;
  --admin-border-strong: #CBD5E1;
  --admin-brand: #000680;
  --admin-danger: #DC2626;
  --admin-danger-bg: #FEE2E2;
  --admin-divider: #F1F5F9;
  --admin-info: #2563EB;
  --admin-info-bg: #DBEAFE;
  --admin-success: #16A34A;
  --admin-success-bg: #DCFCE7;
  --admin-text-on-brand: #FFFFFF;
  --admin-text-primary: #1A1F2E;
  --admin-text-secondary: #6B7280;
  --admin-text-tertiary: #9CA3AF;
  --admin-warning: #D97706;
  --admin-warning-bg: #FEF3C7;

  color-scheme: light;
}

[data-theme="dark"] {
  --admin-accent: #38BDF8;
  --admin-bg-hover: #1F2638;
  --admin-bg-input: #1F2638;
  --admin-bg-page: #0B0F1A;
  --admin-bg-sidebar: #0F1320;
  --admin-bg-surface: #131826;
  --admin-bg-surface-2: #1A2032;
  --admin-border: #2D3548;
  --admin-border-strong: #3F4A66;
  --admin-brand: #4F6CFF;
  --admin-danger: #EF4444;
  --admin-danger-bg: #450A0A;
  --admin-divider: #1F2638;
  --admin-info: #3B82F6;
  --admin-info-bg: #0C1E3D;
  --admin-success: #22C55E;
  --admin-success-bg: #052E16;
  --admin-text-primary: #F5F7FA;
  --admin-text-secondary: #9CA3AF;
  --admin-text-tertiary: #6B7280;
  --admin-warning: #F59E0B;
  --admin-warning-bg: #422006;

  color-scheme: dark;
}

*,
*::before,
*::after {
  box-sizing: border-box;
}

html {
  font-family: var(--admin-font);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

body {
  margin: 0;
  background: var(--admin-bg-page);
  color: var(--admin-text-primary);
  font-family: var(--admin-font);
}

button {
  font-family: inherit;
}

a {
  color: var(--admin-brand);
}

:focus-visible {
  outline: 2px solid var(--admin-brand);
  outline-offset: 2px;
}