@import "tailwindcss";

:root {
  /* Core tokens */
  --bg: #ffffff;
  --surface: #f8f9fa;
  --fg: #1a1a2e;
  --muted: #6b7280;
  --meta: #9ca3af;
  --border: #d1d5db;

  /* Accent — Duolingo green */
  --accent: #58cc02;
  --accent-on: #ffffff;
  --accent-hover: #46a302;
  --accent-active: #3a8a01;

  /* Status */
  --success: #00c853;
  --warn: #ff9800;
  --danger: #ff4444;

  /* Shadows */
  --shadow-chunky: 0 4px 0 0 var(--accent-active);
  --shadow-card: 0 2px 0 0 rgba(0, 0, 0, 0.08);
}

@theme inline {
  --color-bg: var(--bg);
  --color-surface: var(--surface);
  --color-fg: var(--fg);
  --color-muted: var(--muted);
  --color-meta: var(--meta);
  --color-border: var(--border);
  --color-accent: var(--accent);
  --color-accent-on: var(--accent-on);
  --color-accent-hover: var(--accent-hover);
  --color-accent-active: var(--accent-active);
  --color-success: var(--success);
  --color-warn: var(--warn);
  --color-danger: var(--danger);
  --font-display: "Feather Bold", "DIN Round Pro", "Helvetica Neue", sans-serif;
  --font-body: "Mona Sans", "Helvetica Neue", system-ui, sans-serif;
  --font-mono: "JetBrains Mono", ui-monospace, Menlo, Monaco, Consolas, monospace;
}

body {
  background: var(--bg);
  color: var(--fg);
  font-family: var(--font-body);
}

/* Button press-down animation */
.btn-press:active {
  transform: translateY(2px);
  box-shadow: none !important;
}

/* Smooth transitions for interactive elements */
input, select, textarea, button {
  transition: border-color 0.15s ease, box-shadow 0.15s ease;
}

/* Customer color palette for item grouping */
.customer-color-0 { --customer-border: #3b82f6; --customer-bg: #eff6ff; --customer-chip: #dbeafe; --customer-chip-text: #1e40af; }
.customer-color-1 { --customer-border: #10b981; --customer-bg: #ecfdf5; --customer-chip: #d1fae5; --customer-chip-text: #065f46; }
.customer-color-2 { --customer-border: #8b5cf6; --customer-bg: #f5f3ff; --customer-chip: #ede9fe; --customer-chip-text: #5b21b6; }
.customer-color-3 { --customer-border: #f97316; --customer-bg: #fff7ed; --customer-chip: #ffedd5; --customer-chip-text: #9a3412; }
.customer-color-4 { --customer-border: #14b8a6; --customer-bg: #f0fdfa; --customer-chip: #ccfbf1; --customer-chip-text: #115e59; }
.customer-color-5 { --customer-border: #ec4899; --customer-bg: #fdf2f8; --customer-chip: #fce7f3; --customer-chip-text: #9d174d; }

/* Customer color presets */
.customer-color-0 {
  --customer-border: #3b82f6;
  --customer-bg: #eff6ff;
  --customer-text: #1e40af;
}
.customer-color-1 {
  --customer-border: #10b981;
  --customer-bg: #ecfdf5;
  --customer-text: #065f46;
}
.customer-color-2 {
  --customer-border: #8b5cf6;
  --customer-bg: #f5f3ff;
  --customer-text: #5b21b6;
}
.customer-color-3 {
  --customer-border: #f97316;
  --customer-bg: #fff7ed;
  --customer-text: #9a3412;
}
.customer-color-4 {
  --customer-border: #14b8a6;
  --customer-bg: #f0fdfa;
  --customer-text: #0f766e;
}
.customer-color-5 {
  --customer-border: #ec4899;
  --customer-bg: #fdf2f8;
  --customer-text: #9d174d;
}