@import "tailwindcss";

@theme {
  /* ── Backgrounds ─────────────────────────────────────────────────────────── */
  --color-bg: #0c1220;
  --color-surface: #141c2e;
  --color-surface-2: #1c2640;
  --color-surface-hover: #222e4a;
  --color-border: #1f2d45;
  --color-border-subtle: #172035;

  /* ── Text ────────────────────────────────────────────────────────────────── */
  --color-text: #f1f5f9;
  --color-text-secondary: #94a3b8;
  --color-text-muted: #64748b;
  --color-text-dim: #475569;

  /* ── Warm accent (Today / active states) ─────────────────────────────────── */
  --color-accent: #f59e0b;
  --color-accent-hover: #d97706;
  --color-accent-text: #fef3c7;
  --color-accent-muted: #78350f;

  /* ── Open (green) ────────────────────────────────────────────────────────── */
  --color-open-bg: #052e16;
  --color-open-border: #16a34a;
  --color-open-text: #4ade80;
  --color-open-hours: #dcfce7;

  /* ── Passholder preview (purple) ─────────────────────────────────────────── */
  --color-ph-bg: #1e0f2e;
  --color-ph-border: #7e22ce;
  --color-ph-hours: #e9d5ff;
  --color-ph-label: #c084fc;

  /* ── Today column (amber instead of cold blue) ───────────────────────────── */
  --color-today-bg: #1c1a0e;
  --color-today-border: #f59e0b;
  --color-today-text: #fde68a;

  /* ── Weekend header ──────────────────────────────────────────────────────── */
  --color-weekend-header: #141f35;

  /* ── Region header ───────────────────────────────────────────────────────── */
  --color-region-bg: #0e1628;
  --color-region-accent: #334155;
}

:root {
  background-color: var(--color-bg);
  color: var(--color-text);
  font-family: ui-sans-serif, system-ui, -apple-system, sans-serif;
}

* {
  box-sizing: border-box;
  margin: 0;
  padding: 0;
}

/* ── Scrollbar ───────────────────────────────────────────────────────────── */
::-webkit-scrollbar {
  width: 6px;
  height: 6px;
}
::-webkit-scrollbar-track {
  background: var(--color-bg);
}
::-webkit-scrollbar-thumb {
  background: var(--color-border);
  border-radius: 3px;
}
::-webkit-scrollbar-thumb:hover {
  background: var(--color-text-muted);
}

/* ── Sticky column shadow when scrolling ─────────────────────────────────── */
.sticky-shadow {
  box-shadow: 4px 0 16px -2px rgba(0, 0, 0, 0.5);
  clip-path: inset(0 -16px 0 0);
}

/* ── Park row hover (group/group-hover via Tailwind not enough across sticky cols) */
.park-row:hover td,
.park-row:hover th {
  background-color: var(--color-surface-hover) !important;
}

/* ── Park name link hover ────────────────────────────────────────────────── */
.park-name-link {
  text-decoration: none;
  color: inherit;
  transition: color 120ms ease;
}
.park-name-link:hover {
  color: var(--color-accent);
}

/* ── Pulse animation for skeleton ───────────────────────────────────────── */
@keyframes pulse {
  0%, 100% { opacity: 1; }
  50% { opacity: 0.4; }
}
.skeleton {
  animation: pulse 1.8s ease-in-out infinite;
  background-color: var(--color-surface);
  border-radius: 4px;
}