/*
 * theme.css — WRITTEN BY THE PLATFORM. Do not edit.
 *
 * Palette: Classic Fresh Food Market (e-commerce)
 * Source colours: #132816 #3a7341 #62b469 #b7d4c2 #ddfcd6
 *
 * Every value below is either one of those five or derived from them, and each
 * one is contrast-corrected against this palette's own background. Consume
 * them with var(--token); never write a colour value in app code.
 */

:root {
  --canvas: #f0fced;
  --surface: #f8fef7;
  --surface-2: #e5f1e2;
  --border: #d1decf;
  --border-strong: #aebcad;
  --ink: #132816;
  --muted: #5a6a5b;
  --accent: #62b469;
  --accent-hover: #539959;
  --accent-ink: #132816;
  --accent-text: #407845;
  --accent-strong: #3b6e3f;
  --accent-soft: #dcf2db;
  --accent-border: #b0dcb2;
  --success: #15803d;
  --success-ink: #ffffff;
  --success-soft: #d6edd8;
  --success-strong: #137638;
  --warning: #b45309;
  --warning-ink: #ffffff;
  --warning-soft: #e9e8d2;
  --warning-strong: #a64c08;
  --danger: #b91c1c;
  --danger-ink: #ffffff;
  --danger-soft: #e9e1d4;
  --danger-strong: #b91c1c;
  --chart-1: #4fa157;
  --chart-2: #1a9eab;
  --chart-3: #4e6fc3;
  --chart-4: #bb73bf;
  --chart-5: #b24c46;
  --chart-6: #ad861a;
  --radius-sm: 6px;
  --radius: 10px;
  --radius-lg: 14px;
  --radius-pill: 999px;

  --shadow: 0 1px 2px rgba(15, 18, 26, 0.05);
  --shadow-raised: 0 1px 2px rgba(15, 18, 26, 0.06), 0 8px 24px rgba(15, 18, 26, 0.06);

  --font-sans: "Public Sans", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  --font-mono: "IBM Plex Mono", ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
}

/* The same palette on a dark page — written here, never by the app. It
   applies while <html> carries data-theme="dark", which the platform's own
   toggle sets and remembers; an app that never renders that toggle is exactly
   as it was. Do not repoint any of these from app code: a token that
   references another token here is a cycle, and CSS makes every property in
   a cycle invalid. */
html[data-theme="dark"] {
  --canvas: #0e1d10;
  --surface: #263428;
  --surface-2: #1a281c;
  --border: #303d31;
  --border-strong: #566158;
  --ink: #f0fced;
  --muted: #96a395;
  --accent: #62b469;
  --accent-hover: #7abf80;
  --accent-ink: #132816;
  --accent-text: #62b469;
  --accent-strong: #62b469;
  --accent-soft: #203e24;
  --accent-border: #346138;
  --success: #15803d;
  --success-ink: #ffffff;
  --success-soft: #10331a;
  --success-strong: #58a474;
  --warning: #b45309;
  --warning-ink: #ffffff;
  --warning-soft: #33290e;
  --warning-strong: #ca854f;
  --danger: #b91c1c;
  --danger-ink: #ffffff;
  --danger-soft: #341d13;
  --danger-strong: #d57575;
  --chart-1: #62b469;
  --chart-2: #04d2e4;
  --chart-3: #5f82d7;
  --chart-4: #e095e2;
  --chart-5: #c75e57;
  --chart-6: #ddb042;
  --shadow: 0 1px 2px rgba(0, 0, 0, 0.45);
  --shadow-raised: 0 1px 2px rgba(0, 0, 0, 0.5), 0 8px 24px rgba(0, 0, 0, 0.55);
}

/* app.css — this app's own CSS.
 *
 * Empty on this template: it is served and seeded so that the frozen
 * assets.ts can import it on EVERY template in the chain (a frozen file may
 * not import a file that is not seeded — that broke ~190 apps once). Only
 * templates that list it in `writable` let the app put anything here.
 */