/* Project-specific overrides on top of the compiled Tailwind/daisyUI output
   (app.css, built from input.css — see package.json's build:css). Kept as a
   separate hand-written file rather than folded into input.css so the
   daisyUI/Tailwind build output stays untouched and these overrides are easy
   to find, read, and diff on their own. Loaded as a second <link> after
   app.css in base.html — being unlayered plain CSS, it takes priority over
   daisyUI's `@layer`-wrapped component styles regardless of load order. */

/* daisyUI's card-border ties its border color to --color-base-200, which is
   also this app's body background (bg-base-200) — on a white card sitting on
   that page, the "border" is literally invisible. base-300 is the next step
   darker and reads as the mocks' visible card border. */
.card-border {
  border-color: var(--color-base-300);
}

/* daisyUI's corporate theme ships a warning token that's yellow-green
   (oklch(85% .199 91.936)) — reads as "orangeish green" rather than the
   mocks' amber (#b45309, the same color used for "cause" throughout the
   mocks, and Tailwind's own amber-700). Overriding the token itself — rather
   than patching each alert-warning/btn-warning/badge-warning/text-warning
   usage individually — means every warning-styled element (the due-banner,
   the Paused status pill, and anything added later) picks up the right
   color automatically, including daisyUI's derived "soft"/outline tints.
   --color-error is already a legitimate red (oklch(70% .191 22.216), hue
   22°) and needs no override. */
:root {
  --color-warning: #b45309;
  --color-warning-content: #fff;
}

/* Same base-100-vs-base-200 collision as .card-border, hitting a different
   token: neutral .btn-soft (no color modifier, e.g. Cancel/Pause/+Add) mixes
   8% base-content into base-100 for its background — on pure white that's
   fine, but at only 8% it lands almost exactly at base-200's own lightness,
   so on this app's base-200 page it nearly vanishes. Forcing it to actual
   base-100 (solid white) + a base-300 border (matching card-border) gives it
   the mocks' plain "white surface, visible border" secondary-button look.
   Scoped to the bare `.btn-soft` selector only, so it doesn't touch a
   colored soft button (e.g. a future `btn-primary btn-soft`) — this app's
   convention is to reserve unmodified `.btn-soft` for the neutral/secondary
   role and use a solid `btn-warning`/`btn-primary`/etc. for colored actions,
   not a colored soft variant. */
.btn-soft {
  --btn-bg: var(--color-base-100);
  --btn-border: var(--color-base-300);
}