/* Dapple Grey — Competitor tokens (A — success-green light bar / slate dark).
 * Locked greys unchanged. Leather is defined only as a retired Organiser coat-spot.
 * Secondary = info #41708D (already the C).
 * Light: AppbarBackground = success #456E51, AppbarText = paper, Background = dapple
 *   (dapple to steel wash + 35% coat pattern are CSS, not MudBlazor), Surface = paper.
 *   paper-on-success 5.214 PASS 4.5. Steel bar retired (steel remains wash bottom + card divider).
 * Dark: AppbarBackground = ink, Background = charcoal (charcoal to ink wash is CSS),
 *   Surface = slate, TextPrimary = paper (paper-on-slate 6.049 PASS 4.5).
 *   info-dark-on-slate 2.285 FAIL 3:1 — Secondary and card links are paper, underlined.
 * Pair with ../../theme/font-face.css. Toggle dark with [data-theme="dark"].
 */

:root {
  /* Brand greys (locked) */
  --dg-ink: #1C1E22;
  --dg-charcoal: #3A3F46;
  --dg-slate: #555C65;
  --dg-steel: #7B8490;
  --dg-dapple: #C5CBD1;
  --dg-paper: #F4F2EE;
  --dg-white: #FFFFFF;
  --dg-leather: #8C5A3C; /* Organiser coat-spot — retired for Competitor; do not use as Secondary */

  /* Status — locked, shared across apps */
  --dg-success: #456E51;
  --dg-success-chip: #E1E3DD;
  --dg-success-dark: #71A07D;
  --dg-success-dark-chip: #28302F;
  --dg-warning: #835E19;
  --dg-warning-chip: #E8E2D7;
  --dg-warning-dark: #C58A2F;
  --dg-warning-dark-chip: #342D24;
  --dg-error: #A33A2C;
  --dg-error-chip: #E6D3CD;
  --dg-error-dark: #D97C6E;
  --dg-error-dark-chip: #382C2D;
  --dg-info: #41708D;
  --dg-info-chip: #EDEDEA;
  --dg-info-dark: #6A9CBC;
  --dg-info-dark-chip: #273038;

  /* Wash stops (dapple/steel mixes only) */
  --dg-wash-top: var(--dg-dapple);
  --dg-wash-25: #B2B9C1;   /* 25% steel into dapple */
  --dg-wash-mid: #A0A8B0;  /* 50% dapple / 50% steel */
  --dg-wash-65: #959DA7;   /* 65% steel */
  --dg-wash-bottom: var(--dg-steel);

  /* Light Competitor A aliases */
  --dg-bg: var(--dg-dapple);              /* MudBlazor Background; wash+pattern via .dg-competitor-bg */
  --dg-surface: var(--dg-paper);          /* paper cards on the paddock */
  --dg-text: var(--dg-ink);
  --dg-text-secondary: var(--dg-slate);   /* paper cards only — slate-on-steel fails 3:1 */
  --dg-text-muted: var(--dg-steel);
  --dg-divider: var(--dg-steel);          /* 3.387:1 on paper, UI 3:1 */
  --dg-appbar-bg: var(--dg-success);
  --dg-appbar-text: var(--dg-paper);      /* 5.214:1 PASS 4.5 */
  --dg-primary: var(--dg-charcoal);       /* same family as Organiser — grey buttons, not blue */
  --dg-primary-contrast: var(--dg-white); /* 10.610:1 */
  --dg-secondary: var(--dg-info);         /* the C — not leather */
  --dg-secondary-contrast: var(--dg-white); /* 5.348:1 */
  --dg-table-hover: #E5E5E3;
  --dg-drawer-bg: var(--dg-success);
  --dg-drawer-text: var(--dg-paper);
  --dg-drawer-icon: var(--dg-paper);
  --dg-action: var(--dg-slate);
  --dg-action-disabled: var(--dg-steel);

  /* State chips — light (locked) */
  --dg-chip-draft-bg: #E1E0DF;
  --dg-chip-draft-fg: #555C65;
  --dg-chip-published-bg: #E1E3DD;
  --dg-chip-published-fg: #456E51;
  --dg-chip-not-open-bg: #E3E3E1;
  --dg-chip-not-open-fg: #555C65;
  --dg-chip-open-bg: #E1E3DD;
  --dg-chip-open-fg: #456E51;
  --dg-chip-closed-bg: #D3D2D0;
  --dg-chip-closed-fg: #3A3F46;
  --dg-chip-eliminated-bg: #E6D3CD;
  --dg-chip-eliminated-fg: #A33A2C;
  --dg-chip-dnc-bg: #D4D4D3;
  --dg-chip-dnc-fg: #555C65;
  --dg-chip-valid-bg: #E1E3DD;
  --dg-chip-valid-fg: #456E51;
  --dg-chip-discipline-bg: #EDEDEA;
  --dg-chip-discipline-fg: #41708D;

  --dg-font: "Varela Round", "Helvetica Neue", Helvetica, Arial, sans-serif;
}

/* Coat page: CSS only. MudBlazor Background stays dapple. Overlay group opacity is in the SVG.
   The gradient covers the first viewport and finishes on the wash end. Further scroll,
   and any place the gradient layer does not paint, stays that end colour (steel / ink)
   rather than the lighter dapple or charcoal stop. The coat pattern keeps tiling. */
.dg-competitor-bg {
  background-color: var(--dg-wash-bottom);
  background-image:
    url("../brand/pattern-dapple.svg"),
    linear-gradient(180deg, var(--dg-wash-top) 0%, var(--dg-wash-top) 22%, var(--dg-wash-mid) 50%, var(--dg-wash-bottom) 68%, var(--dg-wash-bottom) 100%);
  background-repeat: repeat, no-repeat;
  background-size: 512px 512px, 100% 100vh;
}

[data-theme="dark"] {
  /* Dark wash stops (charcoal/ink mixes only) */
  --dg-wash-top: var(--dg-charcoal);
  --dg-wash-25: #32373D;
  --dg-wash-mid: #2B2E34;
  --dg-wash-65: #262A2F;
  --dg-wash-bottom: var(--dg-ink);

  --dg-bg: var(--dg-charcoal);            /* MudBlazor Background; wash via .dg-competitor-bg */
  --dg-surface: var(--dg-slate);          /* slate cards — paper type 6.049 PASS 4.5 */
  --dg-text: var(--dg-paper);             /* paper-on-slate 6.049. steel+white/paper both FAIL 4.5 */
  --dg-text-secondary: var(--dg-paper);   /* dapple-on-slate 4.134 FAIL 4.5 — paper only */
  --dg-text-muted: var(--dg-dapple);      /* 4.134 FAIL 4.5 / PASS 3.0 UI */
  --dg-divider: var(--dg-dapple);         /* 4.134:1 UI on slate */
  --dg-appbar-bg: var(--dg-ink);
  --dg-appbar-text: var(--dg-paper);      /* 14.928:1 */
  --dg-primary: var(--dg-charcoal);       /* match light charcoal pills. paper label 9.489 */
  --dg-primary-contrast: var(--dg-paper); /* 9.489:1 */
  --dg-secondary: var(--dg-paper);        /* info-dark-on-slate 2.285 FAIL 3:1 — paper links */
  --dg-secondary-contrast: var(--dg-ink); /* 14.928:1 */
  --dg-table-hover: #666E78;
  --dg-drawer-bg: var(--dg-charcoal);
  --dg-drawer-text: var(--dg-paper);
  --dg-drawer-icon: var(--dg-dapple);
  --dg-action: var(--dg-paper);
  --dg-action-disabled: var(--dg-dapple);

  --dg-success: #71A07D;
  --dg-success-chip: #28302F;
  --dg-warning: #C58A2F;
  --dg-warning-chip: #342D24;
  --dg-error: #D97C6E;
  --dg-error-chip: #382C2D;
  --dg-info: #6A9CBC;
  --dg-info-chip: #273038;

  --dg-chip-draft-bg: #31343A;
  --dg-chip-draft-fg: #C5CBD1;
  --dg-chip-published-bg: #28302F;
  --dg-chip-published-fg: #71A07D;
  --dg-chip-not-open-bg: #2D3036;
  --dg-chip-not-open-fg: #C5CBD1;
  --dg-chip-open-bg: #28302F;
  --dg-chip-open-fg: #71A07D;
  --dg-chip-closed-bg: #373A3E;
  --dg-chip-closed-fg: #C5CBD1;
  --dg-chip-eliminated-bg: #382C2D;
  --dg-chip-eliminated-fg: #D97C6E;
  --dg-chip-dnc-bg: #34383E;
  --dg-chip-dnc-fg: #C5CBD1;
  --dg-chip-valid-bg: #28302F;
  --dg-chip-valid-fg: #71A07D;
  --dg-chip-discipline-bg: #273038;
  --dg-chip-discipline-fg: #6A9CBC;
}

[data-theme="dark"] .dg-competitor-bg {
  background-image: linear-gradient(180deg, var(--dg-wash-top) 0%, var(--dg-wash-top) 22%, var(--dg-wash-mid) 50%, var(--dg-wash-bottom) 68%, var(--dg-wash-bottom) 100%);
  background-repeat: no-repeat;
  background-size: 100% 100vh;
  background-color: var(--dg-wash-bottom);
}

/* min-height only. height:100% locked the wash to the viewport, so scrolling
   a long page revealed the lighter canvas underneath. */
html, body, #app {
  min-height: 100vh;
}

.mud-layout.dg-competitor-bg {
  min-height: 100vh;
  height: auto;
}

/* Wash must show through; MudBlazor paints main content with Background. */
.dg-competitor-bg > .mud-main-content {
  background-color: transparent !important;
}

/* Dark card links: paper, underlined (info-dark-on-slate fails). */
[data-theme="dark"] .dg-page a:not(.mud-button-root):not(.dg-unstyled-link):not(.dg-bottom-nav-item) {
  color: var(--dg-paper);
  text-decoration: underline;
}
