/* theme-pack.css - centralized theme variables for LPC Workbench */

:root {
  --bg: #071b2c;
  --bg-accent: #113a6b;
  --panel: rgba(255, 255, 255, 0.08);
  --panel-strong: rgba(20, 30, 50, 0.95);
  --panel-border: rgba(255, 255, 255, 0.12);
  --text: #e9f1ff;
  --text-muted: #b6c7e6;
  --accent: #4da3ff;
  --accent-strong: #2196f3;
  --accent-text: #081a2f;
  --danger: #ff4b5c;
  --shadow: 0 8px 30px rgba(0, 0, 0, 0.35);
  --radius: 12px;
  --status-top-tint: 28%;
  --status-bottom-tint: 42%;
  --status-border-tint: 34%;
  --status-neutral-top: color-mix(in srgb, var(--panel-strong) 90%, white 10%);
  --status-neutral-bottom: color-mix(in srgb, var(--bg) 82%, white 18%);
  --status-neutral-border: color-mix(in srgb, var(--panel-border) 72%, white 28%);
  --queue-assigned-brightness: 0.72;
  --status-color-urgent: #b98cff;
  --status-color-hold: #d6b46a;
  --status-color-returned: #d87b8a;
  --status-color-approved: #72ca87;
  --status-color-nflpc: #98a1ab;
  --status-color-tocomplete: #9f87e8;
  --priority-high: #ff8f70;
  --priority-critical: #ff5c6a;
  --priority-medium: #e6be62;
  --checkpoint-positive: #67ff4f;
  --checkpoint-positive-surface: color-mix(in srgb, var(--panel) 86%, var(--checkpoint-positive) 14%);
  --checkpoint-positive-button-bg: color-mix(in srgb, var(--panel-strong) 72%, var(--checkpoint-positive) 28%);
  --checkpoint-positive-button-text: var(--text);
  --checkpoint-positive-ring: color-mix(in srgb, transparent 55%, var(--checkpoint-positive) 45%);
}

/* Default theme (dark) */
:root[data-theme="default"] {
  --bg: #071b2c;
  --bg-accent: #113a6b;
  --panel: rgba(255, 255, 255, 0.08);
  --panel-strong: rgba(20, 30, 50, 0.95);
  --panel-border: rgba(255, 255, 255, 0.12);
  --text: #e9f1ff;
  --text-muted: #b6c7e6;
  --accent: #4da3ff;
  --accent-strong: #2196f3;
  --accent-text: #081a2f;
  --danger: #ff4b5c;
  --shadow: 0 8px 30px rgba(0, 0, 0, 0.35);
  --radius: 12px;
}

/* Light theme (white background, black text) */
:root[data-theme="light"] {
  --bg: #ffffff;
  --bg-accent: #f2f4f8;
  --panel: rgba(0, 0, 0, 0.04);
  --panel-strong: rgba(255, 255, 255, 0.98);
  --panel-border: rgba(0, 0, 0, 0.12);
  --text: #0b0b0b;
  --text-muted: #2f2f2f;
  --accent: #1a73e8;
  --accent-strong: #1558b0;
  --accent-text: #ffffff;
  --danger: #d93025;
  --shadow: 0 8px 20px rgba(0, 0, 0, 0.15);
  --radius: 12px;
  --status-top-tint: 10%;
  --status-bottom-tint: 18%;
  --status-border-tint: 30%;
  --queue-assigned-brightness: 0.94;
  --checkpoint-positive-surface: color-mix(in srgb, var(--panel-strong) 74%, var(--checkpoint-positive) 26%);
  --checkpoint-positive-button-bg: color-mix(in srgb, white 56%, var(--checkpoint-positive) 44%);
  --checkpoint-positive-button-text: #143320;
  --checkpoint-positive-ring: color-mix(in srgb, transparent 35%, var(--checkpoint-positive) 65%);
}

/* Metallic theme */
:root[data-theme="metallic"] {
  --bg: #0a0e14;
  --bg-accent: #2b3140;
  --panel: rgba(180, 200, 230, 0.14);
  --panel-strong: rgba(28, 34, 44, 0.97);
  --panel-border: rgba(170, 190, 220, 0.32);
  --text: #eef4fb;
  --text-muted: #c3cfdd;
  --accent: #9db7d6;
  --accent-strong: #7f9cc2;
  --accent-text: #0b0f14;
  --danger: #e06b6b;
  --shadow: 0 12px 28px rgba(0, 0, 0, 0.45);
  --radius: 12px;
}

/* Warm leather theme */
:root[data-theme="leather"] {
  --bg: #1d1712;
  --bg-accent: #3a2d22;
  --panel: rgba(245, 232, 210, 0.07);
  --panel-strong: rgba(31, 25, 20, 0.97);
  --panel-border: rgba(179, 147, 111, 0.3);
  --text: #f3eadc;
  --text-muted: #cbbb9f;
  --accent: #b28a58;
  --accent-strong: #8f6b3f;
  --accent-text: #1a120a;
  --danger: #ba6c56;
  --shadow: 0 14px 34px rgba(0, 0, 0, 0.5);
  --radius: 12px;
}

/* Retro/classic Windows theme */
:root[data-theme="retro"] {
  --bg: #008080;
  --bg-accent: #c0c0c0;
  --panel: rgba(230, 230, 230, 0.95);
  --panel-strong: rgba(245, 245, 245, 0.98);
  --panel-border: rgba(80, 80, 80, 0.6);
  --text: #0a0a0a;
  --text-muted: #2a2a2a;
  --accent: #000080;
  --accent-strong: #000060;
  --accent-text: #f2f2f2;
  --danger: #8b0000;
  --shadow: 0 6px 14px rgba(0, 0, 0, 0.25);
  --radius: 4px;
  --status-top-tint: 12%;
  --status-bottom-tint: 20%;
  --status-border-tint: 34%;
  --queue-assigned-brightness: 0.92;
  --checkpoint-positive-surface: color-mix(in srgb, var(--panel-strong) 76%, var(--checkpoint-positive) 24%);
  --checkpoint-positive-button-bg: color-mix(in srgb, white 54%, var(--checkpoint-positive) 46%);
  --checkpoint-positive-button-text: #143320;
  --checkpoint-positive-ring: color-mix(in srgb, transparent 35%, var(--checkpoint-positive) 65%);
}

/* Modern neon theme */
:root[data-theme="neon"] {
  --bg: #07010f;
  --bg-accent: #1a0633;
  --panel: rgba(125, 0, 255, 0.08);
  --panel-strong: rgba(8, 4, 20, 0.96);
  --panel-border: rgba(120, 70, 255, 0.35);
  --text: #f1e9ff;
  --text-muted: #c7b5ff;
  --accent: #39e6ff;
  --accent-strong: #00bcd4;
  --accent-text: #061018;
  --danger: #ff4bd1;
  --shadow: 0 14px 34px rgba(10, 0, 30, 0.6);
  --radius: 14px;
}

/* Blueprint Draft */
:root[data-theme="blueprint"] {
  --bg: #0a2a4a;
  --bg-accent: #0f4c81;
  --panel: rgba(255, 255, 255, 0.08);
  --panel-strong: rgba(8, 32, 56, 0.96);
  --panel-border: rgba(120, 190, 255, 0.35);
  --text: #e6f4ff;
  --text-muted: #b9d7f2;
  --accent: #7fd3ff;
  --accent-strong: #4db6ff;
  --accent-text: #06243d;
  --danger: #ff6b6b;
  --shadow: 0 12px 30px rgba(0, 0, 0, 0.45);
  --radius: 10px;
}

/* Manufacturing Floor */
:root[data-theme="manufacturing"] {
  --bg: #15181d;
  --bg-accent: #2b2f36;
  --panel: rgba(255, 255, 255, 0.08);
  --panel-strong: rgba(20, 23, 28, 0.97);
  --panel-border: rgba(255, 191, 0, 0.35);
  --text: #f3f5f7;
  --text-muted: #c4c8cd;
  --accent: #ffb300;
  --accent-strong: #ff9800;
  --accent-text: #201500;
  --danger: #ff5252;
  --shadow: 0 12px 28px rgba(0, 0, 0, 0.45);
  --radius: 10px;
}

/* Telemetry Console */
:root[data-theme="telemetry"] {
  --bg: #0b1116;
  --bg-accent: #16222c;
  --panel: rgba(22, 40, 48, 0.6);
  --panel-strong: rgba(9, 16, 20, 0.98);
  --panel-border: rgba(0, 255, 170, 0.28);
  --text: #e4fff5;
  --text-muted: #a6d9c7;
  --accent: #00f5a0;
  --accent-strong: #00c98a;
  --accent-text: #04110c;
  --danger: #ff5d6c;
  --shadow: 0 12px 28px rgba(0, 0, 0, 0.5);
  --radius: 10px;
}

/* Workshop Leather */
:root[data-theme="workshop-leather"] {
  --bg: #241b15;
  --bg-accent: #433227;
  --panel: rgba(243, 230, 208, 0.08);
  --panel-strong: rgba(36, 28, 22, 0.97);
  --panel-border: rgba(181, 150, 115, 0.33);
  --text: #f2e8db;
  --text-muted: #ccbca1;
  --accent: #bc915a;
  --accent-strong: #987242;
  --accent-text: #1c130a;
  --danger: #c16f5c;
  --shadow: 0 14px 34px rgba(0, 0, 0, 0.48);
  --radius: 12px;
}

/* Corkboard */
:root[data-theme="corkboard"] {
  --bg: #d1a96f;
  --bg-accent: #ecd19f;
  --panel: rgba(255, 248, 229, 0.7);
  --panel-strong: rgba(255, 246, 219, 0.96);
  --panel-border: rgba(91, 58, 28, 0.3);
  --text: #2a170b;
  --text-muted: #5d3b1d;
  --accent: #c2a15b;
  --accent-strong: #a88749;
  --accent-text: #241306;
  --danger: #d57557;
  --shadow: 0 12px 26px rgba(64, 38, 16, 0.22);
  --radius: 12px;
  --status-top-tint: 12%;
  --status-bottom-tint: 20%;
  --status-border-tint: 30%;
  --queue-assigned-brightness: 0.9;
  --checkpoint-positive-surface: color-mix(in srgb, var(--panel-strong) 74%, var(--checkpoint-positive) 26%);
  --checkpoint-positive-button-bg: color-mix(in srgb, white 52%, var(--checkpoint-positive) 48%);
  --checkpoint-positive-button-text: #143320;
  --checkpoint-positive-ring: color-mix(in srgb, transparent 35%, var(--checkpoint-positive) 65%);
}

/* Midnight Library */
:root[data-theme="midnight-library"] {
  --bg: #0b1020;
  --bg-accent: #1b2547;
  --panel: rgba(255, 255, 255, 0.08);
  --panel-strong: rgba(12, 16, 30, 0.97);
  --panel-border: rgba(184, 154, 92, 0.35);
  --text: #f6f1e7;
  --text-muted: #cdbfa6;
  --accent: #c9a24a;
  --accent-strong: #a5802f;
  --accent-text: #1a1206;
  --danger: #e1695a;
  --shadow: 0 14px 30px rgba(0, 0, 0, 0.55);
  --radius: 12px;
}

/* Neo-Groove */
:root[data-theme="neo-groove"] {
  --bg: #0c0520;
  --bg-accent: #3c0f7a;
  --panel: rgba(255, 255, 255, 0.08);
  --panel-strong: rgba(12, 6, 28, 0.97);
  --panel-border: rgba(255, 102, 255, 0.35);
  --text: #f7e9ff;
  --text-muted: #d8b8f1;
  --accent: #ff5dc8;
  --accent-strong: #ff2fb4;
  --accent-text: #1a0012;
  --danger: #ff6b6b;
  --shadow: 0 14px 34px rgba(8, 0, 26, 0.6);
  --radius: 14px;
}

/* Brutalist Clinic */
:root[data-theme="brutalist"] {
  --bg: #f4f4f2;
  --bg-accent: #d9d9d6;
  --panel: rgba(0, 0, 0, 0.04);
  --panel-strong: rgba(255, 255, 255, 0.98);
  --panel-border: rgba(0, 0, 0, 0.6);
  --text: #0b0b0b;
  --text-muted: #2f2f2f;
  --accent: #00e5ff;
  --accent-strong: #00bcd4;
  --accent-text: #001014;
  --danger: #ff1744;
  --shadow: 0 8px 16px rgba(0, 0, 0, 0.25);
  --radius: 2px;
  --status-top-tint: 11%;
  --status-bottom-tint: 19%;
  --status-border-tint: 34%;
  --queue-assigned-brightness: 0.94;
  --checkpoint-positive-surface: color-mix(in srgb, var(--panel-strong) 74%, var(--checkpoint-positive) 26%);
  --checkpoint-positive-button-bg: color-mix(in srgb, white 56%, var(--checkpoint-positive) 44%);
  --checkpoint-positive-button-text: #143320;
  --checkpoint-positive-ring: color-mix(in srgb, transparent 35%, var(--checkpoint-positive) 65%);
}

/* Solar Flare */
:root[data-theme="solar-flare"] {
  --bg: #140000;
  --bg-accent: #3a0a00;
  --panel: rgba(255, 255, 255, 0.08);
  --panel-strong: rgba(22, 4, 0, 0.97);
  --panel-border: rgba(255, 140, 0, 0.4);
  --text: #ffe9d6;
  --text-muted: #f0bfa1;
  --accent: #ff8c00;
  --accent-strong: #ff5a00;
  --accent-text: #1a0800;
  --danger: #ff4d4d;
  --shadow: 0 14px 34px rgba(20, 0, 0, 0.6);
  --radius: 12px;
}

/* Foggy Morning */
:root[data-theme="foggy"] {
  --bg: #e8edf2;
  --bg-accent: #f5f7fa;
  --panel: rgba(0, 0, 0, 0.03);
  --panel-strong: rgba(255, 255, 255, 0.98);
  --panel-border: rgba(0, 0, 0, 0.12);
  --text: #1a1f24;
  --text-muted: #5a6773;
  --accent: #6a8fb3;
  --accent-strong: #50779b;
  --accent-text: #ffffff;
  --danger: #d33c3c;
  --shadow: 0 8px 16px rgba(0, 0, 0, 0.12);
  --radius: 12px;
  --status-top-tint: 10%;
  --status-bottom-tint: 18%;
  --status-border-tint: 28%;
  --queue-assigned-brightness: 0.95;
  --checkpoint-positive-surface: color-mix(in srgb, var(--panel-strong) 76%, var(--checkpoint-positive) 24%);
  --checkpoint-positive-button-bg: color-mix(in srgb, white 58%, var(--checkpoint-positive) 42%);
  --checkpoint-positive-button-text: #143320;
  --checkpoint-positive-ring: color-mix(in srgb, transparent 36%, var(--checkpoint-positive) 64%);
}

/* Eucalyptus */
:root[data-theme="eucalyptus"] {
  --bg: #f4f7f3;
  --bg-accent: #e3efe8;
  --panel: rgba(0, 0, 0, 0.03);
  --panel-strong: rgba(255, 255, 255, 0.98);
  --panel-border: rgba(44, 110, 85, 0.25);
  --text: #1b2a24;
  --text-muted: #4a6157;
  --accent: #4c8c6a;
  --accent-strong: #3a7357;
  --accent-text: #ffffff;
  --danger: #c44545;
  --shadow: 0 8px 16px rgba(0, 0, 0, 0.12);
  --radius: 12px;
  --status-top-tint: 11%;
  --status-bottom-tint: 20%;
  --status-border-tint: 29%;
  --queue-assigned-brightness: 0.95;
  --checkpoint-positive-surface: color-mix(in srgb, var(--panel-strong) 75%, var(--checkpoint-positive) 25%);
  --checkpoint-positive-button-bg: color-mix(in srgb, white 56%, var(--checkpoint-positive) 44%);
  --checkpoint-positive-button-text: #143320;
  --checkpoint-positive-ring: color-mix(in srgb, transparent 35%, var(--checkpoint-positive) 65%);
}

/* Zen Mono */
:root[data-theme="zen-mono"] {
  --bg: #f0ede7;
  --bg-accent: #e4ded3;
  --panel: rgba(0, 0, 0, 0.04);
  --panel-strong: rgba(255, 255, 255, 0.98);
  --panel-border: rgba(60, 60, 60, 0.2);
  --text: #2a2a2a;
  --text-muted: #5a5a5a;
  --accent: #9a7f5a;
  --accent-strong: #7d6445;
  --accent-text: #ffffff;
  --danger: #b84c4c;
  --shadow: 0 8px 16px rgba(0, 0, 0, 0.12);
  --radius: 10px;
  --status-top-tint: 11%;
  --status-bottom-tint: 18%;
  --status-border-tint: 30%;
  --queue-assigned-brightness: 0.94;
  --checkpoint-positive-surface: color-mix(in srgb, var(--panel-strong) 76%, var(--checkpoint-positive) 24%);
  --checkpoint-positive-button-bg: color-mix(in srgb, white 56%, var(--checkpoint-positive) 44%);
  --checkpoint-positive-button-text: #143320;
  --checkpoint-positive-ring: color-mix(in srgb, transparent 35%, var(--checkpoint-positive) 65%);
}

/* VHS Arcade */
:root[data-theme="vhs-arcade"] {
  --bg: #0b0012;
  --bg-accent: #2b003d;
  --panel: rgba(255, 255, 255, 0.08);
  --panel-strong: rgba(8, 0, 16, 0.97);
  --panel-border: rgba(255, 0, 204, 0.4);
  --text: #ffe6ff;
  --text-muted: #d9b6ff;
  --accent: #00f0ff;
  --accent-strong: #00c2d4;
  --accent-text: #001218;
  --danger: #ff4f8b;
  --shadow: 0 14px 34px rgba(8, 0, 20, 0.6);
  --radius: 14px;
}

/* 70s Terminal */
:root[data-theme="seventies-terminal"] {
  --bg: #2b1b0f;
  --bg-accent: #3b2717;
  --panel: rgba(255, 232, 200, 0.08);
  --panel-strong: rgba(43, 27, 15, 0.96);
  --panel-border: rgba(130, 190, 90, 0.4);
  --text: #e8f6c9;
  --text-muted: #bfd69b;
  --accent: #8be06a;
  --accent-strong: #69c74a;
  --accent-text: #0c1a0c;
  --danger: #e06b4a;
  --shadow: 0 12px 28px rgba(0, 0, 0, 0.5);
  --radius: 10px;
}

/* Memphis */
:root[data-theme="memphis"] {
  --bg: #fff3d6;
  --bg-accent: #ffe4ad;
  --panel: rgba(0, 0, 0, 0.04);
  --panel-strong: rgba(255, 255, 255, 0.98);
  --panel-border: rgba(0, 0, 0, 0.25);
  --text: #121212;
  --text-muted: #3a3a3a;
  --accent: #ff6f61;
  --accent-strong: #ff3b30;
  --accent-text: #1a0a0a;
  --danger: #e63946;
  --shadow: 0 8px 16px rgba(0, 0, 0, 0.15);
  --radius: 8px;
  --status-top-tint: 11%;
  --status-bottom-tint: 20%;
  --status-border-tint: 31%;
  --queue-assigned-brightness: 0.94;
  --checkpoint-positive-surface: color-mix(in srgb, var(--panel-strong) 74%, var(--checkpoint-positive) 26%);
  --checkpoint-positive-button-bg: color-mix(in srgb, white 55%, var(--checkpoint-positive) 45%);
  --checkpoint-positive-button-text: #143320;
  --checkpoint-positive-ring: color-mix(in srgb, transparent 34%, var(--checkpoint-positive) 66%);
}

/* Christmas */
:root[data-theme="christmas"] {
  --bg: #0f231d;
  --bg-accent: #1d4a38;
  --panel: rgba(255, 255, 255, 0.08);
  --panel-strong: rgba(18, 43, 34, 0.96);
  --panel-border: rgba(240, 246, 241, 0.18);
  --text: #f7f4ea;
  --text-muted: #d7e3db;
  --accent: #c62828;
  --accent-strong: #9f1d1d;
  --accent-text: #fff6f6;
  --danger: #ef5350;
  --shadow: 0 14px 32px rgba(0, 0, 0, 0.4);
  --radius: 12px;
  --status-top-tint: 18%;
  --status-bottom-tint: 28%;
  --status-border-tint: 32%;
  --queue-assigned-brightness: 0.9;
  --checkpoint-positive-surface: color-mix(in srgb, var(--panel-strong) 74%, var(--checkpoint-positive) 26%);
  --checkpoint-positive-button-bg: color-mix(in srgb, var(--panel-strong) 64%, var(--checkpoint-positive) 36%);
  --checkpoint-positive-button-text: #eef7ee;
  --checkpoint-positive-ring: color-mix(in srgb, transparent 34%, var(--checkpoint-positive) 66%);
}

/* Rose Atelier */
:root[data-theme="rose-atelier"] {
  --bg: #2a1621;
  --bg-accent: #5a2b43;
  --panel: rgba(255, 240, 246, 0.08);
  --panel-strong: rgba(38, 20, 30, 0.97);
  --panel-border: rgba(237, 165, 196, 0.28);
  --text: #fff0f6;
  --text-muted: #e4bfd0;
  --accent: #e06c9f;
  --accent-strong: #c24d83;
  --accent-text: #260713;
  --danger: #ef6d85;
  --shadow: 0 14px 32px rgba(20, 0, 12, 0.5);
  --radius: 14px;
}

/* Evergreen Ledger */
:root[data-theme="evergreen-ledger"] {
  --bg: #10211b;
  --bg-accent: #214537;
  --panel: rgba(236, 248, 241, 0.08);
  --panel-strong: rgba(18, 35, 28, 0.97);
  --panel-border: rgba(143, 191, 162, 0.26);
  --text: #eef8f1;
  --text-muted: #bdd4c4;
  --accent: #67b07c;
  --accent-strong: #4c9662;
  --accent-text: #08170e;
  --danger: #d96d63;
  --shadow: 0 14px 32px rgba(0, 0, 0, 0.45);
  --radius: 12px;
}

/* Optional utility classes for quick adoption */
.theme-bg {
  background: radial-gradient(circle at top left, var(--bg-accent), var(--bg));
  color: var(--text);
}

.theme-panel {
  background: var(--panel);
  border: 1px solid var(--panel-border);
  box-shadow: var(--shadow);
  color: var(--text);
  border-radius: var(--radius);
}

.theme-panel-strong {
  background: var(--panel-strong);
  border: 1px solid var(--panel-border);
  box-shadow: var(--shadow);
  color: var(--text);
  border-radius: var(--radius);
}

.theme-accent {
  background: var(--accent);
  color: var(--accent-text);
}

.theme-accent:hover {
  background: var(--accent-strong);
}

#theme-layer {
  position: fixed;
  inset: 0;
  pointer-events: none;
  overflow: hidden;
}

.theme-snowflake {
  position: absolute;
  top: -8vh;
  color: rgba(255, 255, 255, 0.9);
  text-shadow: 0 0 10px rgba(255, 255, 255, 0.3);
  will-change: transform;
  animation: theme-snowfall linear infinite;
}

@keyframes theme-snowfall {
  0% {
    transform: translate3d(0, -10vh, 0) rotate(0deg);
    opacity: 0;
  }
  10% {
    opacity: 0.95;
  }
  100% {
    transform: translate3d(var(--drift, 0px), 115vh, 0) rotate(300deg);
    opacity: 0.18;
  }
}

/* Semantic status styling shared across queue-style pages */
.status-todo,
.status-offhold,
.status-urgent,
.status-onhold,
.status-returned,
.status-approved,
.status-nflpc,
.status-tocomplete,
.status-Unassigned,
.status-Assigned,
.status-Completed {
  color: var(--text);
  background: linear-gradient(
    to bottom,
    var(--status-top-surface, color-mix(in srgb, var(--panel-strong) calc(100% - var(--status-top-tint)), var(--status-color) var(--status-top-tint))),
    var(--status-bottom-surface, color-mix(in srgb, var(--bg) calc(100% - var(--status-bottom-tint)), var(--status-color) var(--status-bottom-tint)))
  );
  border-top: 1px solid var(--status-border-top, color-mix(in srgb, transparent calc(100% - var(--status-border-tint)), var(--status-color) var(--status-border-tint)));
  border-bottom: 1px solid var(--status-border-bottom, color-mix(in srgb, transparent calc(100% - var(--status-border-tint)), var(--status-color) var(--status-border-tint)));
}

.status-todo,
.status-offhold,
.status-Unassigned,
.status-Assigned {
  --status-top-surface: var(--status-neutral-top);
  --status-bottom-surface: var(--status-neutral-bottom);
  --status-border-top: var(--status-neutral-border);
  --status-border-bottom: var(--status-neutral-border);
}

.status-urgent {
  --status-color: var(--status-color-urgent);
}

.status-onhold {
  --status-color: var(--status-color-hold);
}

.status-returned {
  --status-color: var(--status-color-returned);
}

.status-approved,
.status-Completed {
  --status-color: var(--status-color-approved);
}

.status-nflpc {
  --status-color: var(--status-color-nflpc);
}

.status-tocomplete {
  --status-color: var(--status-color-tocomplete);
}

.priority-High {
  color: color-mix(in srgb, var(--priority-high) 80%, var(--text) 20%);
  font-weight: 700;
}

.priority-Critical {
  color: color-mix(in srgb, var(--priority-critical) 86%, var(--text) 14%);
  font-weight: 700;
}

.priority-Medium {
  color: color-mix(in srgb, var(--priority-medium) 78%, var(--text) 22%);
  font-weight: 700;
}