/* Murmo Starling palette. See docs/BRAND_COLOUR_GUIDE.md.
   Foundation colours are fixed; semantic colours follow the selected theme. */
:root {
  --murmo-yellow: #ffd02f;
  --murmo-charcoal: #202629;
  --murmo-mist: #f7f6f2;
  --murmo-white: #ffffff;
  --murmo-teal: #38e5dd;
  --murmo-sea-glass: #5f9290;
  --murmo-on-teal: var(--murmo-charcoal);
  --murmo-teal-edge: var(--murmo-sea-glass);
  --murmo-violet: #9864c7;
  /* Approved operational palette: Calendar and Shifts, in both themes. */
  --murmo-op-workforce: #2563eb;
  --murmo-op-volunteer: #6d28d9;
  --murmo-op-ready: #15803d;
  --murmo-op-shift-confirmed: #a3e635;
  --murmo-op-conflict: #dc2626;
  --murmo-op-calendar: var(--murmo-teal);
  --murmo-op-attention: var(--murmo-yellow);
  --murmo-op-on-strong: var(--murmo-white);
  --murmo-op-on-bright: var(--murmo-charcoal);
  --murmo-op-outline: var(--murmo-text);
  --murmo-cream: #fff8d6;
  --murmo-soft-yellow: #ffe78a;
  --murmo-gold: #f2b51d;
  --murmo-soft-glow: linear-gradient(120deg, #fff8d6 0%, #ffe78a 100%);
  --murmo-golden-glow: linear-gradient(120deg, #ffe78a 0%, #ffd02f 55%, #f2b51d 100%);
  --murmo-primary: var(--murmo-yellow);
  --murmo-primary-hover: var(--murmo-gold);
  --murmo-primary-border: #947000;
  --murmo-on-primary: var(--murmo-charcoal);
  --murmo-nav: var(--murmo-charcoal);
  --murmo-nav-soft: #30393c;
  --murmo-on-nav: var(--murmo-white);
  --murmo-nav-muted: #c2ccc7;
  --murmo-sidebar: var(--murmo-yellow);
  --murmo-on-sidebar: var(--murmo-text);
  --murmo-sidebar-hover: var(--murmo-soft-yellow);
  --murmo-sidebar-wordmark-dot: var(--murmo-charcoal);
  --murmo-sidebar-active-icon: var(--murmo-charcoal);
  --murmo-sidebar-active-icon-background: transparent;
  --murmo-sidebar-active-weight: 700;
  --murmo-link-fill: var(--murmo-charcoal);
  --murmo-violet-fill: #77449e;
  --murmo-overlay: rgb(32 38 41 / 55%);
}

:root, html[data-theme="light"] {
  color-scheme: light;
  --murmo-canvas: var(--murmo-mist);
  --murmo-surface: var(--murmo-white);
  --murmo-surface-subtle: #f1f0ea;
  --murmo-text: var(--murmo-charcoal);
  --murmo-muted: #5f6865;
  --murmo-line: #ddded6;
  --murmo-border-strong: #858d87;
  --murmo-link: var(--murmo-charcoal);
  --murmo-on-link: var(--murmo-white);
  --murmo-focus: var(--murmo-sea-glass);
  --murmo-violet-text: #77449e;
  --murmo-event-title: #806000;
  --murmo-teal-soft: #e7efee;
  --murmo-violet-soft: #f0e8f8;
  --murmo-selected: var(--murmo-cream);
  --murmo-hover: #f3f3ec;
  --murmo-success: #247447;
  --murmo-success-soft: #eaf6ed;
  --murmo-warning: #805800;
  --murmo-warning-soft: #fff3d6;
  --murmo-danger: #b83646;
  --murmo-danger-soft: #fcebee;
  --murmo-shadow: 0 12px 32px rgb(32 38 41 / 10%);
}

html[data-theme="dark"] {
  --murmo-sidebar-wordmark-dot: var(--murmo-yellow);
  --murmo-sidebar: var(--murmo-surface-subtle);
  --murmo-sidebar-hover: var(--murmo-hover);
  --murmo-sidebar-active-icon: var(--murmo-yellow);
  --murmo-sidebar-active-icon-background: transparent;
  --murmo-sidebar-active-weight: 650;
  color-scheme: dark;
  --murmo-canvas: #171c1f;
  --murmo-surface: var(--murmo-charcoal);
  --murmo-surface-subtle: #2a3235;
  --murmo-text: var(--murmo-mist);
  --murmo-muted: #bcc4c0;
  --murmo-line: #3d484a;
  --murmo-border-strong: #758481;
  --murmo-link: var(--murmo-teal);
  --murmo-on-link: var(--murmo-charcoal);
  --murmo-focus: var(--murmo-teal);
  --murmo-violet-text: #cea5f0;
  --murmo-event-title: var(--murmo-yellow);
  --murmo-teal-soft: #283a3b;
  --murmo-violet-soft: #382943;
  --murmo-selected: #373326;
  --murmo-hover: #303a3c;
  --murmo-success: #89d6a6;
  --murmo-success-soft: #203b2b;
  --murmo-warning: #ffda80;
  --murmo-warning-soft: #42351d;
  --murmo-danger: #ff98a5;
  --murmo-danger-soft: #482830;
  --murmo-shadow: 0 12px 32px rgb(0 0 0 / 28%);
}

/* Standalone pages without a saved preference follow the OS. */
@media (prefers-color-scheme: dark) {
  html:not([data-theme]) {
    --murmo-sidebar-wordmark-dot: var(--murmo-yellow);
    --murmo-sidebar: var(--murmo-surface-subtle);
    --murmo-sidebar-hover: var(--murmo-hover);
    --murmo-sidebar-active-icon: var(--murmo-yellow);
    --murmo-sidebar-active-icon-background: transparent;
    --murmo-sidebar-active-weight: 650;
    color-scheme: dark;
    --murmo-canvas: #171c1f;
    --murmo-surface: var(--murmo-charcoal);
    --murmo-surface-subtle: #2a3235;
    --murmo-text: var(--murmo-mist);
    --murmo-muted: #bcc4c0;
    --murmo-line: #3d484a;
    --murmo-border-strong: #758481;
    --murmo-link: var(--murmo-teal);
    --murmo-on-link: var(--murmo-charcoal);
    --murmo-focus: var(--murmo-teal);
    --murmo-violet-text: #cea5f0;
    --murmo-event-title: var(--murmo-yellow);
    --murmo-teal-soft: #283a3b;
    --murmo-violet-soft: #382943;
    --murmo-selected: #373326;
    --murmo-hover: #303a3c;
    --murmo-success: #89d6a6;
    --murmo-success-soft: #203b2b;
    --murmo-warning: #ffda80;
    --murmo-warning-soft: #42351d;
    --murmo-danger: #ff98a5;
    --murmo-danger-soft: #482830;
    --murmo-shadow: 0 12px 32px rgb(0 0 0 / 28%);
  }
}

/* Compatibility aliases for retained workspace and React components. */
:root {
  --ink: var(--murmo-text);
  --muted: var(--murmo-muted);
  --line: var(--murmo-line);
  --line-strong: var(--murmo-border-strong);
  --surface: var(--murmo-surface);
  --surface-subtle: var(--murmo-surface-subtle);
  --canvas: var(--murmo-canvas);
  --soft: var(--murmo-canvas);
  --white: var(--murmo-surface);
  --nav: var(--murmo-nav);
  --nav-soft: var(--murmo-nav-soft);
  --navy: var(--murmo-text);
  --navy-deep: var(--murmo-charcoal);
  --accent: var(--murmo-primary);
  --yellow: var(--murmo-primary);
  --yellow-soft: var(--murmo-warning-soft);
  --blue: var(--murmo-link);
  --blue-soft: var(--murmo-teal-soft);
  --purple: var(--murmo-violet-text);
  --green: var(--murmo-success);
  --green-soft: var(--murmo-success-soft);
  --orange: var(--murmo-warning);
  --orange-soft: var(--murmo-warning-soft);
  --red: var(--murmo-danger);
  --red-soft: var(--murmo-danger-soft);
  --brand-blue: var(--murmo-link);
  --brand-saffron: var(--murmo-yellow);
  --brand-chalk: var(--murmo-mist);
  --shadow: var(--murmo-shadow);
  --surface-raised: var(--murmo-surface);
  --surface-muted: var(--murmo-surface-subtle);
  --surface-selected: var(--murmo-selected);
  --focus-ring: 0 0 0 3px color-mix(in srgb, var(--murmo-focus) 24%, transparent);
  --rw-canvas: var(--murmo-canvas);
  --rw-surface: var(--murmo-surface);
  --rw-ink: var(--murmo-text);
  --rw-muted: var(--murmo-muted);
  --rw-line: var(--murmo-line);
  --rw-blue: var(--murmo-link);
}