@import "@fontsource-variable/figtree/wght.css";

.theme-alby {
  --app-font-sans: "Figtree Variable", ui-sans-serif, system-ui, sans-serif;
  --radius: 0.875rem;

  --primary: oklch(0.852 0.199 91.936);
  /* Match default button label color to secondary (`text-secondary-foreground`). */
  --primary-foreground: var(--secondary-foreground);
  --chart-1: oklch(0.905 0.182 98.111);
  --chart-2: oklch(0.795 0.184 86.047);
  --chart-3: oklch(0.681 0.162 75.834);
  --chart-4: oklch(0.554 0.135 66.442);
  --chart-5: oklch(0.476 0.114 61.907);
  --sidebar-primary: oklch(0.681 0.162 75.834);
  --sidebar-primary-foreground: oklch(0.987 0.026 102.212);
}

.theme-alby.dark {
  --primary: oklch(0.795 0.184 86.047);
  /* Primary buttons keep the light yellow fill in dark mode; label stays dark like light theme. */
  --primary-foreground: oklch(0.205 0 0);
  --secondary: oklch(0.269 0 0);
  --secondary-foreground: oklch(0.985 0 0);
  --chart-1: oklch(0.905 0.182 98.111);
  --chart-2: oklch(0.795 0.184 86.047);
  --chart-3: oklch(0.681 0.162 75.834);
  --chart-4: oklch(0.554 0.135 66.442);
  --chart-5: oklch(0.476 0.114 61.907);
  --sidebar-primary: oklch(0.795 0.184 86.047);
  --sidebar-primary-foreground: oklch(0.987 0.026 102.212);
}

/*
 * Default (primary) buttons: subtle highlight overlay on top of `bg-primary`.
 * Sets `background-image` only so Tailwind's `background-color: var(--primary)`
 * remains the base. Matches `data-slot~="button"` so Radix's Slot forwarding
 * still picks up `<Button asChild>` (e.g. DialogTrigger asChild) without
 * leaking onto unrelated items that also expose `data-variant` (e.g.
 * DropdownMenuItem, Badge).
 */
.theme-alby
  :is(button, a, span)[data-slot~="button"][data-variant="default"]:not(
    :disabled,
    [aria-disabled="true"]
  ) {
  background-image: linear-gradient(
    180deg,
    rgba(255, 255, 255, 0.58) 0%,
    rgba(255, 236, 175, 0.22) 100%
  );
  box-shadow: 0 0 0 1px #ffdf6f;
}

.theme-alby
  :is(button, a, span)[data-slot~="button"][data-variant="default"]:hover:not(
    :disabled,
    [aria-disabled="true"]
  ) {
  background-image: linear-gradient(
    180deg,
    rgba(255, 255, 255, 0.45) 0%,
    rgba(255, 224, 140, 0.28) 100%
  );
  box-shadow: 0 0 0 1px #ffdf6f;
}

/* Keep keyboard focus ring (Button uses ring via box-shadow); stack with brand stroke. */
.theme-alby
  :is(button, a, span)[data-slot~="button"][data-variant="default"]:focus-visible:not(
    :disabled,
    [aria-disabled="true"]
  ) {
  box-shadow:
    0 0 0 1px #ffdf6f,
    0 0 0 3px color-mix(in oklch, var(--ring), transparent 50%);
}