/*
 * Pro theme. Replace this file with the Web Awesome Theme Builder export (Matter + Mild + teal brand,
 * reduced shadows). Until then it matches the free fallback. See docs/PLAN.md section 4.8.
 */
:root,
.wa-light,
.wa-dark {
  --wa-font-family-body: system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  --wa-font-family-heading: var(--wa-font-family-body);

  /* Matte: flatter surfaces, softer elevation. */
  --wa-shadow-s: 0 1px 1px rgb(0 0 0 / 0.04);
  --wa-shadow-m: 0 1px 3px rgb(0 0 0 / 0.06);
  --wa-shadow-l: 0 2px 8px rgb(0 0 0 / 0.08);
}

/*
 * Brand roles, from the Wrestling Aide design system (deep teal; "white first, teal for action").
 * Values are the design system's tokens; names in comments. Light first, then dark.
 */
:root,
.wa-light {
  --wa-color-surface-default: #ffffff;   /* surface */
  --wa-color-surface-raised: #ffffff;    /* surface-raised, set apart by a border */
  --wa-color-surface-lowered: #f4f7f7;   /* surface-wash */
  --wa-color-surface-border: #dfe4e8;    /* line */
  --wa-color-text-normal: #15181d;       /* ink */
  --wa-color-text-quiet: #5a6573;        /* ink-muted */
  --wa-color-text-link: #00787a;         /* brand-text */
  --wa-color-focus: #00787a;             /* focus */
  --wa-color-brand-fill-loud: #00787a;   /* brand: primary buttons, current item */
  --wa-color-brand-on-loud: #ffffff;     /* on-brand */
  --wa-color-brand-fill-normal: #a4ddde; /* teal-80 */
  --wa-color-brand-on-normal: #002d2e;
  --wa-color-brand-fill-quiet: #ccf0f0;  /* teal-90: a stronger tint than the design system's teal-95, for more contrast */
  --wa-color-brand-on-quiet: #024445;    /* teal-20 */

  /* Event status: text on its fill, always with the word (StatusBadge). Never the brand teal. */
  --wc-status-open: #35731f;
  --wc-status-open-bg: #ebf4e4;
  --wc-status-near: #8a5a06;
  --wc-status-near-bg: #fbf0dc;
  --wc-status-full: #b43d0b;
  --wc-status-full-bg: #fdece4;
  --wc-status-cancelled: #b42318;
  --wc-status-cancelled-bg: #fde8e7;
}

.wa-dark {
  --wa-color-surface-default: #0f1416;
  --wa-color-surface-raised: #1c2527;
  --wa-color-surface-lowered: #161d1f;
  --wa-color-surface-border: #2c3739;
  --wa-color-text-normal: #eef3f3;
  --wa-color-text-quiet: #a3b0b5;
  --wa-color-text-link: #80c2c3;
  --wa-color-focus: #80c2c3;
  --wa-color-brand-fill-loud: #56a4a5;
  --wa-color-brand-on-loud: #001d1e;
  --wa-color-brand-fill-normal: #024445;
  --wa-color-brand-on-normal: #ccf0f0;
  --wa-color-brand-fill-quiet: #024445;
  --wa-color-brand-on-quiet: #ccf0f0;

  --wc-status-open: #9fd38a;
  --wc-status-open-bg: #1d3315;
  --wc-status-near: #f0c46e;
  --wc-status-near-bg: #3a2a0c;
  --wc-status-full: #f6a37c;
  --wc-status-full-bg: #40200f;
  --wc-status-cancelled: #f59a92;
  --wc-status-cancelled-bg: #43191a;
}

:root {
  /* The display face for page titles: Barlow Condensed, served with the app (@fontsource, in +layout). */
  --wc-font-display: "Barlow Condensed", "Arial Narrow", system-ui, sans-serif;
  /* Focus: a 2px ring with a 2px gap on every control. */
  --wa-focus-ring-width: 0.125rem;
  --wa-focus-ring-offset: 0.125rem;
}

/* palette:start (generated by scripts/make-palette.py; don't edit by hand) */
:root {
  --wa-color-red-95: #fcf1f0;
  --wa-color-red-90: #f9e0df;
  --wa-color-red-80: #f3bebc;
  --wa-color-red-70: #ed9a99;
  --wa-color-red-60: #e07878;
  --wa-color-red-50: #c84f55;
  --wa-color-red-40: #a1333f;
  --wa-color-red-30: #7d2b34;
  --wa-color-red-20: #592028;
  --wa-color-red-10: #381216;
  --wa-color-red-05: #25090d;
  --wa-color-orange-95: #fbf1ea;
  --wa-color-orange-90: #f8e1d3;
  --wa-color-orange-80: #f1c1a6;
  --wa-color-orange-70: #ea9e80;
  --wa-color-orange-60: #dc7d63;
  --wa-color-orange-50: #b75e42;
  --wa-color-orange-40: #8e462c;
  --wa-color-orange-30: #723621;
  --wa-color-orange-20: #552617;
  --wa-color-orange-10: #34150a;
  --wa-color-orange-05: #220b05;
  --wa-color-yellow-95: #fcf3d5;
  --wa-color-yellow-90: #fae5a7;
  --wa-color-yellow-80: #f1c55e;
  --wa-color-yellow-70: #e3a249;
  --wa-color-yellow-60: #ce853d;
  --wa-color-yellow-50: #a96630;
  --wa-color-yellow-40: #834c22;
  --wa-color-yellow-30: #683b19;
  --wa-color-yellow-20: #4d2a10;
  --wa-color-yellow-10: #2f1807;
  --wa-color-yellow-05: #1f0e03;
  --wa-color-green-95: #e7f7e7;
  --wa-color-green-90: #cceecb;
  --wa-color-green-80: #a4d4a6;
  --wa-color-green-70: #7abc82;
  --wa-color-green-60: #4fa462;
  --wa-color-green-50: #3d824e;
  --wa-color-green-40: #2e623d;
  --wa-color-green-30: #244c30;
  --wa-color-green-20: #1b3723;
  --wa-color-green-10: #0e2114;
  --wa-color-green-05: #08150b;
  --wa-color-blue-95: #e5f8f8;
  --wa-color-blue-90: #ccf0f0;
  --wa-color-blue-80: #a4ddde;
  --wa-color-blue-70: #80c2c3;
  --wa-color-blue-60: #56a4a5;
  --wa-color-blue-50: #2e8b8d;
  --wa-color-blue-40: #00787a;
  --wa-color-blue-30: #005c5e;
  --wa-color-blue-20: #024445;
  --wa-color-blue-10: #002d2e;
  --wa-color-blue-05: #001d1e;
  --wa-color-gray-95: #eef3f3;
  --wa-color-gray-90: #e0e7e7;
  --wa-color-gray-80: #c4cbcb;
  --wa-color-gray-70: #a8b0b0;
  --wa-color-gray-60: #8e9797;
  --wa-color-gray-50: #6e7878;
  --wa-color-gray-40: #525b5b;
  --wa-color-gray-30: #404848;
  --wa-color-gray-20: #2e3434;
  --wa-color-gray-10: #1a1f1f;
  --wa-color-gray-05: #0f1313;
}
/* palette:end */