/* === Admin Portal Theme Variables === */
:root {
  --primary-weak: #E6F7F4;
  --primary-weak-text-heading: #000000;
  --primary-weak-text-base: #171616;
  --primary-weak-text-muted: #3d3d3d;
  --primary-weak-link: #000000;
  --primary-weak-link-hover: #171616;
  --primary-weak-link-active: #000000;
  --primary-weak-border: #BBDEFB;
  --primary-weak-action-fill: #E6F7F4;
  --primary-weak-action-fill-hover: #0D47A1;
  --primary-weak-action-fill-active: #0B3C91;
  --primary-weak-action-text: #ffffff;
  --primary-weak-action-border: #1565C0;

  --primary-soft: #6bebe7;
  --primary-soft-text-heading: #000000;
  --primary-soft-text-base: #171616;
  --primary-soft-text-muted: #3d3d3d;
  --primary-soft-link: #000000;
  --primary-soft-link-hover: #171616;
  --primary-soft-link-active: #000000;
  --primary-soft-border: #90CAF9;
  --primary-soft-action-fill: #6bebe7;
  --primary-soft-action-fill-hover: #0D47A1;
  --primary-soft-action-fill-active: #0B3C91;
  --primary-soft-action-text: #FFFFFF;
  --primary-soft-action-border: #1565C0;

  --primary-base: #087c96;
  --primary-base-text-heading: #FFFFFF;
  --primary-base-text-base: #FFFFFF;
  --primary-base-text-muted: #F5CFD1;
  --primary-base-link: #FFFFFF;
  --primary-base-link-hover: #F5CFD1;
  --primary-base-link-active: #FFFFFF;
  --primary-base-border: #1E88E5;
  --primary-base-action-fill: #087c96;
  --primary-base-action-fill-hover: #1565C0;
  --primary-base-action-fill-active: #0D47A1;
  --primary-base-action-text: #FFFFFF;
  --primary-base-action-border: #1565C0;

  --primary-strong: #125568;
  --primary-strong-text-heading: #FFFFFF;
  --primary-strong-text-base: #FFFFFF;
  --primary-strong-text-muted: #f1b6ba;
  --primary-strong-link: #FFFFFF;
  --primary-strong-link-hover: #f1b6ba;
  --primary-strong-link-active: #FFFFFF;
  --primary-strong-border: #1565C0;
  --primary-strong-action-fill: #125568;
  --primary-strong-action-fill-hover: #0D47A1;
  --primary-strong-action-fill-active: #0B3C91;
  --primary-strong-action-text: #FFFFFF;
  --primary-strong-action-border: #0D47A1;

  --primary-stronger: #04344a;
  --primary-stronger-text-heading: #FFFFFF;
  --primary-stronger-text-base: #FFFFFF;
  --primary-stronger-text-muted: #f1b6ba;
  --primary-stronger-link: #FFFFFF;
  --primary-stronger-link-hover: #79bbdc;
  --primary-stronger-link-active: #FFFFFF;
  --primary-stronger-border: #0B3C91;
  --primary-stronger-action-fill: #04344a;
  --primary-stronger-action-fill-hover: #062A66;
  --primary-stronger-action-fill-active: #041C4D;
  --primary-stronger-action-text: #FFFFFF;
  --primary-stronger-action-border: #062A66;

  --secondary-weak: #f7f2ff;
  --secondary-weak-text-heading: #1b1238;
  --secondary-weak-text-base: #34205a;
  --secondary-weak-text-muted: #7b6a9b;
  --secondary-weak-link: #7d2cf3;
  --secondary-weak-link-hover: #6922d1;
  --secondary-weak-link-active: #551aa1;
  --secondary-weak-border: #ddd1f5;
  --secondary-weak-action-fill: #8629ff;
  --secondary-weak-action-fill-hover: #7323db;
  --secondary-weak-action-fill-active: #5d1cb2;
  --secondary-weak-action-text: #ffffff;
  --secondary-weak-action-border: #8629ff;

  --secondary-soft: #e4d4ff;
  --secondary-soft-text-heading: #1a1030;
  --secondary-soft-text-base: #2c1c4a;
  --secondary-soft-text-muted: #685a92;
  --secondary-soft-link: #7a26e6;
  --secondary-soft-link-hover: #651fc2;
  --secondary-soft-link-active: #4e1897;
  --secondary-soft-border: #c9b4f2;
  --secondary-soft-action-fill: #8b32ff;
  --secondary-soft-action-fill-hover: #7428d9;
  --secondary-soft-action-fill-active: #5d20b1;
  --secondary-soft-action-text: #ffffff;
  --secondary-soft-action-border: #7428d9;

  --secondary-base: #9c27b0;
  --secondary-base-text-heading: #fffdfd;
  --secondary-base-text-base: #f1e7ff;
  --secondary-base-text-muted: #c6b0ea;
  --secondary-base-link: #f6f1ff;
  --secondary-base-link-hover: #e7daff;
  --secondary-base-link-active: #d1b8ff;
  --secondary-base-border: #a56aef;
  --secondary-base-action-fill: #fffdfd;
  --secondary-base-action-fill-hover: #f2eaff;
  --secondary-base-action-fill-active: #e4d2ff;
  --secondary-base-action-text: #8629ff;
  --secondary-base-action-border: #fffdfd;

  --secondary-strong: #6a21cc;
  --secondary-strong-text-heading: #fffdfd;
  --secondary-strong-text-base: #efe7ff;
  --secondary-strong-text-muted: #b89ae8;
  --secondary-strong-link: #f8f5ff;
  --secondary-strong-link-hover: #e8ddff;
  --secondary-strong-link-active: #d2bcff;
  --secondary-strong-border: #9160e8;
  --secondary-strong-action-fill: #fffdfd;
  --secondary-strong-action-fill-hover: #f3ecff;
  --secondary-strong-action-fill-active: #e3d3ff;
  --secondary-strong-action-text: #6a21cc;
  --secondary-strong-action-border: #fffdfd;

  --secondary-stronger: #440e8b;
  --secondary-stronger-text-heading: #fffdfd;
  --secondary-stronger-text-base: #efe6ff;
  --secondary-stronger-text-muted: #b59ae8;
  --secondary-stronger-link: #f8f5ff;
  --secondary-stronger-link-hover: #ecddff;
  --secondary-stronger-link-active: #d4bcff;
  --secondary-stronger-border: #7445c7;
  --secondary-stronger-action-fill: #fffdfd;
  --secondary-stronger-action-fill-hover: #f4eeff;
  --secondary-stronger-action-fill-active: #e5d6ff;
  --secondary-stronger-action-text: #4b178f;
  --secondary-stronger-action-border: #fffdfd;

  --accent-weak: #f0f6ff;
  --accent-weak-text-heading: #182433;
  --accent-weak-text-base: #2d3b4f;
  --accent-weak-text-muted: #6b7a90;
  --accent-weak-link: #2563eb;
  --accent-weak-link-hover: #1d4ed8;
  --accent-weak-link-active: #1e40af;
  --accent-weak-border: #cbd8ea;
  --accent-weak-action-fill: #0b3b82;
  --accent-weak-action-fill-hover: #082f66;
  --accent-weak-action-fill-active: #06264f;
  --accent-weak-action-text: #ffffff;
  --accent-weak-action-border: #0b3b82;

  --accent-soft: #cfe0ff;
  --accent-soft-text-heading: #1b2a40;
  --accent-soft-text-base: #31435f;
  --accent-soft-text-muted: #6f84a8;
  --accent-soft-link: #2563eb;
  --accent-soft-link-hover: #1d4ed8;
  --accent-soft-link-active: #1e40af;
  --accent-soft-border: #7fa7e0;
  --accent-soft-action-fill: #18519a;
  --accent-soft-action-fill-hover: #0f3f82;
  --accent-soft-action-fill-active: #0a3268;
  --accent-soft-action-text: #ffffff;
  --accent-soft-action-border: #18519a;

  --accent-base: #3b82f6;
  --accent-base-text-heading: #ffffff;
  --accent-base-text-base: #eaf2ff;
  --accent-base-text-muted: #b8c9e8;
  --accent-base-link: #f8fbff;
  --accent-base-link-hover: #dce8ff;
  --accent-base-link-active: #bed4ff;
  --accent-base-border: #6c97d9;
  --accent-base-action-fill: #0b3b82;
  --accent-base-action-fill-hover: #082f66;
  --accent-base-action-fill-active: #06264f;
  --accent-base-action-text: #ffffff;
  --accent-base-action-border: #0b3b82;

  --accent-strong: #18519a;
  --accent-strong-text-heading: #fffdfd;
  --accent-strong-text-base: #e7f0ff;
  --accent-strong-text-muted: #afc3e6;
  --accent-strong-link: #f5f9ff;
  --accent-strong-link-hover: #dce9ff;
  --accent-strong-link-active: #bed4ff;
  --accent-strong-border: #4e7bc2;
  --accent-strong-action-fill: #fffdfd;
  --accent-strong-action-fill-hover: #eef5ff;
  --accent-strong-action-fill-active: #dce9ff;
  --accent-strong-action-text: #18519a;
  --accent-strong-action-border: #fffdfd;

  --accent-stronger: #052d61;
  --accent-stronger-text-heading: #fffdfd;
  --accent-stronger-text-base: #e5eeff;
  --accent-stronger-text-muted: #a8bdd9;
  --accent-stronger-link: #f5f9ff;
  --accent-stronger-link-hover: #d9e8ff;
  --accent-stronger-link-active: #b9d1ff;
  --accent-stronger-border: #4d6f9e;
  --accent-stronger-action-fill: #fffdfd;
  --accent-stronger-action-fill-hover: #eef5ff;
  --accent-stronger-action-fill-active: #dce8ff;
  --accent-stronger-action-text: #052d61;
  --accent-stronger-action-border: #fffdfd;

  --neutral-weak: #fafafa;
  --neutral-weak-text-heading: #0f172a;
  --neutral-weak-text-base: #1f2937;
  --neutral-weak-text-muted: #6b7280;
  --neutral-weak-link: #1f2937;
  --neutral-weak-link-hover: #0f172a;
  --neutral-weak-link-active: #0f172a;
  --neutral-weak-border: #e2e8f0;
  --neutral-weak-action-fill: #374151;
  --neutral-weak-action-fill-hover: #1f2937;
  --neutral-weak-action-fill-active: #111827;
  --neutral-weak-action-text: #ffffff;
  --neutral-weak-action-border: #374151;

  --neutral-soft: #f0f0f0;
  --neutral-soft-text-heading: #111827;
  --neutral-soft-text-base: #374151;
  --neutral-soft-text-muted: #71717a;
  --neutral-soft-link: #2563eb;
  --neutral-soft-link-hover: #1d4ed8;
  --neutral-soft-link-active: #1e40af;
  --neutral-soft-border: #d1d5db;
  --neutral-soft-action-fill: #4b5563;
  --neutral-soft-action-fill-hover: #374151;
  --neutral-soft-action-fill-active: #1f2937;
  --neutral-soft-action-text: #ffffff;
  --neutral-soft-action-border: #4b5563;

  --neutral-base: #e5e5e5;
  --neutral-base-text-heading: #111827;
  --neutral-base-text-base: #374151;
  --neutral-base-text-muted: #5f6b7a;
  --neutral-base-link: #1d4ed8;
  --neutral-base-link-hover: #1e40af;
  --neutral-base-link-active: #1e3a8a;
  --neutral-base-border: #cbd5e1;
  --neutral-base-action-fill: #4b5563;
  --neutral-base-action-fill-hover: #374151;
  --neutral-base-action-fill-active: #1f2937;
  --neutral-base-action-text: #ffffff;
  --neutral-base-action-border: #4b5563;

  --neutral-strong: #9ca3af;
  --neutral-strong-text-heading: #111827;
  --neutral-strong-text-base: #374151;
  --neutral-strong-text-muted: #5f6b7a;
  --neutral-strong-link: #1d4ed8;
  --neutral-strong-link-hover: #1e40af;
  --neutral-strong-link-active: #1e3a8a;
  --neutral-strong-border: #6b7280;
  --neutral-strong-action-fill: #4b5563;
  --neutral-strong-action-fill-hover: #374151;
  --neutral-strong-action-fill-active: #1f2937;
  --neutral-strong-action-text: #ffffff;
  --neutral-strong-action-border: #4b5563;

  --neutral-stronger: #4b5563;
  --neutral-stronger-text-heading: #fffdfd;
  --neutral-stronger-text-base: #e5e7eb;
  --neutral-stronger-text-muted: #cbd5e1;
  --neutral-stronger-link: #f5f9ff;
  --neutral-stronger-link-hover: #dce8ff;
  --neutral-stronger-link-active: #bfd3ff;
  --neutral-stronger-border: #8892a0;
  --neutral-stronger-action-fill: #f9fafb;
  --neutral-stronger-action-fill-hover: #e5e7eb;
  --neutral-stronger-action-fill-active: #e5e7eb;
  --neutral-stronger-action-text: #374151;
  --neutral-stronger-action-border: #f9fafb;

  --success-weak: #ffffff;
  --success-weak-text-heading: #05331c;
  --success-weak-text-base: #145c3b;
  --success-weak-text-muted: #739e88;
  --success-weak-link: #1f9d55;
  --success-weak-link-hover: #178248;
  --success-weak-link-active: #126637;
  --success-weak-border: #bfe6d1;
  --success-weak-action-fill: #1f9d55;
  --success-weak-action-fill-hover: #178248;
  --success-weak-action-fill-active: #126637;
  --success-weak-action-text: #ffffff;
  --success-weak-action-border: #178248;

  --success-soft: #eafaf1;
  --success-soft-text-heading: #05331c;
  --success-soft-text-base: #0f5132;
  --success-soft-text-muted: #4e7d65;
  --success-soft-link: #157347;
  --success-soft-link-hover: #0f5132;
  --success-soft-link-active: #0a3f28;
  --success-soft-border: #b7e4c7;
  --success-soft-action-fill: #1f9d55;
  --success-soft-action-fill-hover: #178248;
  --success-soft-action-fill-active: #126637;
  --success-soft-action-text: #ffffff;
  --success-soft-action-border: #1f9d55;

  --success-base: #1f9d55;
  --success-base-text-heading: #f7fff9;
  --success-base-text-base: #e7f9ef;
  --success-base-text-muted: #a4d9bb;
  --success-base-link: #ecfff5;
  --success-base-link-hover: #d7f7e6;
  --success-base-link-active: #bdeed1;
  --success-base-border: #58c184;
  --success-base-action-fill: #0f5132;
  --success-base-action-fill-hover: #0a3f28;
  --success-base-action-fill-active: #05331c;
  --success-base-action-text: #ffffff;
  --success-base-action-border: #0f5132;

  --success-strong: #136f3b;
  --success-strong-text-heading: #fffdfd;
  --success-strong-text-base: #d9f5e7;
  --success-strong-text-muted: #8fd0ae;
  --success-strong-link: #f6fff9;
  --success-strong-link-hover: #d6f5e2;
  --success-strong-link-active: #b4ebcf;
  --success-strong-border: #2a8153;
  --success-strong-action-fill: #ffffff;
  --success-strong-action-fill-hover: #e8faf1;
  --success-strong-action-fill-active: #cceedd;
  --success-strong-action-text: #136f3b;
  --success-strong-action-border: #ffffff;

  --success-stronger: #0b4d29;
  --success-stronger-text-heading: #fffdfd;
  --success-stronger-text-base: #d5f2e3;
  --success-stronger-text-muted: #8cc9ab;
  --success-stronger-link: #f4fff8;
  --success-stronger-link-hover: #d4f5e2;
  --success-stronger-link-active: #afe7c8;
  --success-stronger-border: #21784a;
  --success-stronger-action-fill: #ffffff;
  --success-stronger-action-fill-hover: #e8faf1;
  --success-stronger-action-fill-active: #cdeedd;
  --success-stronger-action-text: #0b4d29;
  --success-stronger-action-border: #ffffff;

  --info-weak: #ffffff;
  --info-weak-text-heading: #1e3a8a;
  --info-weak-text-base: #1e40af;
  --info-weak-text-muted: #475569;
  --info-weak-link: #2563eb;
  --info-weak-link-hover: #1d4ed8;
  --info-weak-link-active: #1e40af;
  --info-weak-border: #bfdbfe;
  --info-weak-action-fill: #2563eb;
  --info-weak-action-fill-hover: #1d4ed8;
  --info-weak-action-fill-active: #1e40af;
  --info-weak-action-text: #ffffff;
  --info-weak-action-border: #2563eb;

  --info-soft: #eff6ff;
  --info-soft-text-heading: #1e3a8a;
  --info-soft-text-base: #1e40af;
  --info-soft-text-muted: #526071;
  --info-soft-link: #2563eb;
  --info-soft-link-hover: #1d4ed8;
  --info-soft-link-active: #1e40af;
  --info-soft-border: #bfd8ff;
  --info-soft-action-fill: #2563eb;
  --info-soft-action-fill-hover: #1d4ed8;
  --info-soft-action-fill-active: #1e40af;
  --info-soft-action-text: #ffffff;
  --info-soft-action-border: #2563eb;

  --info-base: #2563eb;
  --info-base-text-heading: #f8fbff;
  --info-base-text-base: #eaf2ff;
  --info-base-text-muted: #b6c9ee;
  --info-base-link: #f8fbff;
  --info-base-link-hover: #dce8ff;
  --info-base-link-active: #bed4ff;
  --info-base-border: #6b9ef3;
  --info-base-action-fill: #0b3b82;
  --info-base-action-fill-hover: #082f66;
  --info-base-action-fill-active: #06264f;
  --info-base-action-text: #ffffff;
  --info-base-action-border: #0b3b82;

  --info-strong: #1e40af;
  --info-strong-text-heading: #fffdfd;
  --info-strong-text-base: #e5eeff;
  --info-strong-text-muted: #afc3e6;
  --info-strong-link: #f5f9ff;
  --info-strong-link-hover: #d9e8ff;
  --info-strong-link-active: #b9d1ff;
  --info-strong-border: #5d84d1;
  --info-strong-action-fill: #ffffff;
  --info-strong-action-fill-hover: #eef5ff;
  --info-strong-action-fill-active: #dce8ff;
  --info-strong-action-text: #1e40af;
  --info-strong-action-border: #ffffff;

  --info-stronger: #1e3a8a;
  --info-stronger-text-heading: #fffdfd;
  --info-stronger-text-base: #e4edff;
  --info-stronger-text-muted: #aabfe3;
  --info-stronger-link: #f5f9ff;
  --info-stronger-link-hover: #d9e8ff;
  --info-stronger-link-active: #b9d1ff;
  --info-stronger-border: #5478c5;
  --info-stronger-action-fill: #ffffff;
  --info-stronger-action-fill-hover: #eef5ff;
  --info-stronger-action-fill-active: #dce8ff;
  --info-stronger-action-text: #1e3a8a;
  --info-stronger-action-border: #ffffff;

  --error-weak: #ffffff;
  --error-weak-text-heading: #7f1d1d;
  --error-weak-text-base: #b91c1c;
  --error-weak-text-muted: #8f4d4d;
  --error-weak-link: #dc2626;
  --error-weak-link-hover: #b91c1c;
  --error-weak-link-active: #991b1b;
  --error-weak-border: #fecaca;
  --error-weak-action-fill: #ef4444;
  --error-weak-action-fill-hover: #dc2626;
  --error-weak-action-fill-active: #b91c1c;
  --error-weak-action-text: #ffffff;
  --error-weak-action-border: #ef4444;

  --error-soft: #fff1f2;
  --error-soft-text-heading: #7a0d0d;
  --error-soft-text-base: #d01616;
  --error-soft-text-muted: #a94a4a;
  --error-soft-link: #d01616;
  --error-soft-link-hover: #b01313;
  --error-soft-link-active: #8f1010;
  --error-soft-border: #f3b5b5;
  --error-soft-action-fill: #d01616;
  --error-soft-action-fill-hover: #b01313;
  --error-soft-action-fill-active: #8f1010;
  --error-soft-action-text: #ffffff;
  --error-soft-action-border: #d01616;

  --error-base: #dc2626;
  --error-base-text-heading: #fff8f8;
  --error-base-text-base: #ffe5e5;
  --error-base-text-muted: #ffb8b8;
  --error-base-link: #fff5f5;
  --error-base-link-hover: #ffe3e3;
  --error-base-link-active: #ffc4c4;
  --error-base-border: #f87171;
  --error-base-action-fill: #7f1d1d;
  --error-base-action-fill-hover: #6b1515;
  --error-base-action-fill-active: #520f0f;
  --error-base-action-text: #ffffff;
  --error-base-action-border: #7f1d1d;

  --error-strong: #991b1b;
  --error-strong-text-heading: #fffdfd;
  --error-strong-text-base: #ffd9d9;
  --error-strong-text-muted: #ff9e9e;
  --error-strong-link: #fff1f1;
  --error-strong-link-hover: #ffe0e0;
  --error-strong-link-active: #ffcaca;
  --error-strong-border: #c24141;
  --error-strong-action-fill: #ffffff;
  --error-strong-action-fill-hover: #ffeded;
  --error-strong-action-fill-active: #ffd5d5;
  --error-strong-action-text: #991b1b;
  --error-strong-action-border: #ffffff;

  --error-stronger: #7f1d1d;
  --error-stronger-text-heading: #fffdfd;
  --error-stronger-text-base: #ffd6d6;
  --error-stronger-text-muted: #ff9a9a;
  --error-stronger-link: #fff1f1;
  --error-stronger-link-hover: #ffe0e0;
  --error-stronger-link-active: #ffcaca;
  --error-stronger-border: #a63333;
  --error-stronger-action-fill: #ffffff;
  --error-stronger-action-fill-hover: #ffecec;
  --error-stronger-action-fill-active: #ffd4d4;
  --error-stronger-action-text: #7f1d1d;
  --error-stronger-action-border: #ffffff;

  --warning-weak: #ffffff;
  --warning-weak-text-heading: #3a2200;
  --warning-weak-text-base: #6b3f00;
  --warning-weak-text-muted: #8a6a35;
  --warning-weak-link: #e68a00;
  --warning-weak-link-hover: #cc7800;
  --warning-weak-link-active: #a66000;
  --warning-weak-border: #ffe2b8;
  --warning-weak-action-fill: #ff9f1a;
  --warning-weak-action-fill-hover: #e68a00;
  --warning-weak-action-fill-active: #bf7000;
  --warning-weak-action-text: #ffffff;
  --warning-weak-action-border: #ff9f1a;

  --warning-soft: #fff7e1;
  --warning-soft-text-heading: #5a2e00;
  --warning-soft-text-base: #7c4500;
  --warning-soft-text-muted: #8f6c2f;
  --warning-soft-link: #e68a00;
  --warning-soft-link-hover: #cc7800;
  --warning-soft-link-active: #a66000;
  --warning-soft-border: #f5d7a1;
  --warning-soft-action-fill: #f59e0b;
  --warning-soft-action-fill-hover: #d97706;
  --warning-soft-action-fill-active: #b45309;
  --warning-soft-action-text: #ffffff;
  --warning-soft-action-border: #f59e0b;

  --warning-base: #ffb020;
  --warning-base-text-heading: #fff9ef;
  --warning-base-text-base: #fff3d9;
  --warning-base-text-muted: #ffd27a;
  --warning-base-link: #fff4e0;
  --warning-base-link-hover: #ffe8c2;
  --warning-base-link-active: #ffd699;
  --warning-base-border: #f5c56e;
  --warning-base-action-fill: #7a4200;
  --warning-base-action-fill-hover: #5e3200;
  --warning-base-action-fill-active: #422300;
  --warning-base-action-text: #ffffff;
  --warning-base-action-border: #7a4200;

  --warning-strong: #d97706;
  --warning-strong-text-heading: #fffdf8;
  --warning-strong-text-base: #fff4e6;
  --warning-strong-text-muted: #ffd08a;
  --warning-strong-link: #fff3e0;
  --warning-strong-link-hover: #ffe2b8;
  --warning-strong-link-active: #ffd08a;
  --warning-strong-border: #c9983a;
  --warning-strong-action-fill: #ffffff;
  --warning-strong-action-fill-hover: #fff1db;
  --warning-strong-action-fill-active: #ffe0b3;
  --warning-strong-action-text: #d97706;
  --warning-strong-action-border: #ffffff;

  --warning-stronger: #a16207;
  --warning-stronger-text-heading: #fffdf8;
  --warning-stronger-text-base: #fff2dd;
  --warning-stronger-text-muted: #f5c56e;
  --warning-stronger-link: #fff3e0;
  --warning-stronger-link-hover: #ffe2b8;
  --warning-stronger-link-active: #ffd08a;
  --warning-stronger-border: #d9a441;
  --warning-stronger-action-fill: #ffffff;
  --warning-stronger-action-fill-hover: #fff1db;
  --warning-stronger-action-fill-active: #ffe0b3;
  --warning-stronger-action-text: #a16207;
  --warning-stronger-action-border: #ffffff;

  --header: #ffffff;
  --header-text-heading: #0f172a;
  --header-text-base: #374151;
  --header-text-muted: #94a3b8;
  --header-link: #1e293b;
  --header-link-hover: #0f172a;
  --header-link-active: #000000;
  --header-border: #e2e8f0;
  --header-action-fill: #312e81;
  --header-action-fill-hover: #312e81;
  --header-action-fill-active: #4338ca;
  --header-action-text: #ffffff;
  --header-action-border: #1e1b4b;

  --footer: #111827;
  --footer-text-heading: #fffdfd;
  --footer-text-base: #e5e7eb;
  --footer-text-muted: #9ca3af;
  --footer-link: #f8fafc;
  --footer-link-hover: #ffffff;
  --footer-link-active: #cbd5e1;
  --footer-border: #374151;
  --footer-action-fill: #ffffff;
  --footer-action-fill-hover: #e5e7eb;
  --footer-action-fill-active: #cbd5e1;
  --footer-action-text: #111827;
  --footer-action-border: #ffffff;

  --default: #ffffff;
  --default-text-heading: #111827;
  --default-text-base: #374151;
  --default-text-muted: #8f8f8f;
  --default-link: #008080;
  --default-link-hover: #008080;
  --default-link-active: #006e70;
  --default-border: #dfe0e1;
  --default-action-fill: #008080;
  --default-action-fill-hover: #006e70;
  --default-action-fill-active: #005a5c;
  --default-action-text: #ffffff;
  --default-action-border: #226d54;

}

/* === Admin Portal Background & Fill Utility Classes === */
.bg-primary-weak {
  background-color: var(--primary-weak);
  --bg-color: var(--primary-weak);
  --text-heading: var(--primary-weak-text-heading);
  --text-base: var(--primary-weak-text-base);
  --text-muted: var(--primary-weak-text-muted);

  --link: var(--primary-weak-link);
  --link-hover: var(--primary-weak-link-hover);
  --link-active: var(--primary-weak-link-active);

  --border: var(--primary-weak-border);

  --action-fill: var(--primary-weak-action-fill);
  --action-fill-hover: var(--primary-weak-action-fill-hover);
  --action-fill-active: var(--primary-weak-action-fill-active);
  --action-text: var(--primary-weak-action-text);
  --action-border: var(--primary-weak-action-border);
}

.bg-primary-soft {
  background-color: var(--primary-soft);
  --bg-color: var(--primary-soft);
  --text-heading: var(--primary-soft-text-heading);
  --text-base: var(--primary-soft-text-base);
  --text-muted: var(--primary-soft-text-muted);

  --link: var(--primary-soft-link);
  --link-hover: var(--primary-soft-link-hover);
  --link-active: var(--primary-soft-link-active);

  --border: var(--primary-soft-border);

  --action-fill: var(--primary-soft-action-fill);
  --action-fill-hover: var(--primary-soft-action-fill-hover);
  --action-fill-active: var(--primary-soft-action-fill-active);
  --action-text: var(--primary-soft-action-text);
  --action-border: var(--primary-soft-action-border);
}

.bg-primary-base {
  background-color: var(--primary-base);
  --bg-color: var(--primary-base);
  --text-heading: var(--primary-base-text-heading);
  --text-base: var(--primary-base-text-base);
  --text-muted: var(--primary-base-text-muted);

  --link: var(--primary-base-link);
  --link-hover: var(--primary-base-link-hover);
  --link-active: var(--primary-base-link-active);

  --border: var(--primary-base-border);

  --action-fill: var(--primary-base-action-fill);
  --action-fill-hover: var(--primary-base-action-fill-hover);
  --action-fill-active: var(--primary-base-action-fill-active);
  --action-text: var(--primary-base-action-text);
  --action-border: var(--primary-base-action-border);
}

.bg-primary-strong {
  background-color: var(--primary-strong);
  --bg-color: var(--primary-strong);
  --text-heading: var(--primary-strong-text-heading);
  --text-base: var(--primary-strong-text-base);
  --text-muted: var(--primary-strong-text-muted);

  --link: var(--primary-strong-link);
  --link-hover: var(--primary-strong-link-hover);
  --link-active: var(--primary-strong-link-active);

  --border: var(--primary-strong-border);

  --action-fill: var(--primary-strong-action-fill);
  --action-fill-hover: var(--primary-strong-action-fill-hover);
  --action-fill-active: var(--primary-strong-action-fill-active);
  --action-text: var(--primary-strong-action-text);
  --action-border: var(--primary-strong-action-border);
}

.bg-primary-stronger {
  background-color: var(--primary-stronger);
  --bg-color: var(--primary-stronger);
  --text-heading: var(--primary-stronger-text-heading);
  --text-base: var(--primary-stronger-text-base);
  --text-muted: var(--primary-stronger-text-muted);

  --link: var(--primary-stronger-link);
  --link-hover: var(--primary-stronger-link-hover);
  --link-active: var(--primary-stronger-link-active);

  --border: var(--primary-stronger-border);

  --action-fill: var(--primary-stronger-action-fill);
  --action-fill-hover: var(--primary-stronger-action-fill-hover);
  --action-fill-active: var(--primary-stronger-action-fill-active);
  --action-text: var(--primary-stronger-action-text);
  --action-border: var(--primary-stronger-action-border);
}

.bg-secondary-weak {
  background-color: var(--secondary-weak);
  --bg-color: var(--secondary-weak);
  --text-heading: var(--secondary-weak-text-heading);
  --text-base: var(--secondary-weak-text-base);
  --text-muted: var(--secondary-weak-text-muted);

  --link: var(--secondary-weak-link);
  --link-hover: var(--secondary-weak-link-hover);
  --link-active: var(--secondary-weak-link-active);

  --border: var(--secondary-weak-border);

  --action-fill: var(--secondary-weak-action-fill);
  --action-fill-hover: var(--secondary-weak-action-fill-hover);
  --action-fill-active: var(--secondary-weak-action-fill-active);
  --action-text: var(--secondary-weak-action-text);
  --action-border: var(--secondary-weak-action-border);
}

.bg-secondary-soft {
  background-color: var(--secondary-soft);
  --bg-color: var(--secondary-soft);
  --text-heading: var(--secondary-soft-text-heading);
  --text-base: var(--secondary-soft-text-base);
  --text-muted: var(--secondary-soft-text-muted);

  --link: var(--secondary-soft-link);
  --link-hover: var(--secondary-soft-link-hover);
  --link-active: var(--secondary-soft-link-active);

  --border: var(--secondary-soft-border);

  --action-fill: var(--secondary-soft-action-fill);
  --action-fill-hover: var(--secondary-soft-action-fill-hover);
  --action-fill-active: var(--secondary-soft-action-fill-active);
  --action-text: var(--secondary-soft-action-text);
  --action-border: var(--secondary-soft-action-border);
}

.bg-secondary-base {
  background-color: var(--secondary-base);
  --bg-color: var(--secondary-base);
  --text-heading: var(--secondary-base-text-heading);
  --text-base: var(--secondary-base-text-base);
  --text-muted: var(--secondary-base-text-muted);

  --link: var(--secondary-base-link);
  --link-hover: var(--secondary-base-link-hover);
  --link-active: var(--secondary-base-link-active);

  --border: var(--secondary-base-border);

  --action-fill: var(--secondary-base-action-fill);
  --action-fill-hover: var(--secondary-base-action-fill-hover);
  --action-fill-active: var(--secondary-base-action-fill-active);
  --action-text: var(--secondary-base-action-text);
  --action-border: var(--secondary-base-action-border);
}

.bg-secondary-strong {
  background-color: var(--secondary-strong);
  --bg-color: var(--secondary-strong);
  --text-heading: var(--secondary-strong-text-heading);
  --text-base: var(--secondary-strong-text-base);
  --text-muted: var(--secondary-strong-text-muted);

  --link: var(--secondary-strong-link);
  --link-hover: var(--secondary-strong-link-hover);
  --link-active: var(--secondary-strong-link-active);

  --border: var(--secondary-strong-border);

  --action-fill: var(--secondary-strong-action-fill);
  --action-fill-hover: var(--secondary-strong-action-fill-hover);
  --action-fill-active: var(--secondary-strong-action-fill-active);
  --action-text: var(--secondary-strong-action-text);
  --action-border: var(--secondary-strong-action-border);
}

.bg-secondary-stronger {
  background-color: var(--secondary-stronger);
  --bg-color: var(--secondary-stronger);
  --text-heading: var(--secondary-stronger-text-heading);
  --text-base: var(--secondary-stronger-text-base);
  --text-muted: var(--secondary-stronger-text-muted);

  --link: var(--secondary-stronger-link);
  --link-hover: var(--secondary-stronger-link-hover);
  --link-active: var(--secondary-stronger-link-active);

  --border: var(--secondary-stronger-border);

  --action-fill: var(--secondary-stronger-action-fill);
  --action-fill-hover: var(--secondary-stronger-action-fill-hover);
  --action-fill-active: var(--secondary-stronger-action-fill-active);
  --action-text: var(--secondary-stronger-action-text);
  --action-border: var(--secondary-stronger-action-border);
}

.bg-accent-weak {
  background-color: var(--accent-weak);
  --bg-color: var(--accent-weak);
  --text-heading: var(--accent-weak-text-heading);
  --text-base: var(--accent-weak-text-base);
  --text-muted: var(--accent-weak-text-muted);

  --link: var(--accent-weak-link);
  --link-hover: var(--accent-weak-link-hover);
  --link-active: var(--accent-weak-link-active);

  --border: var(--accent-weak-border);

  --action-fill: var(--accent-weak-action-fill);
  --action-fill-hover: var(--accent-weak-action-fill-hover);
  --action-fill-active: var(--accent-weak-action-fill-active);
  --action-text: var(--accent-weak-action-text);
  --action-border: var(--accent-weak-action-border);
}

.bg-accent-soft {
  background-color: var(--accent-soft);
  --bg-color: var(--accent-soft);
  --text-heading: var(--accent-soft-text-heading);
  --text-base: var(--accent-soft-text-base);
  --text-muted: var(--accent-soft-text-muted);

  --link: var(--accent-soft-link);
  --link-hover: var(--accent-soft-link-hover);
  --link-active: var(--accent-soft-link-active);

  --border: var(--accent-soft-border);

  --action-fill: var(--accent-soft-action-fill);
  --action-fill-hover: var(--accent-soft-action-fill-hover);
  --action-fill-active: var(--accent-soft-action-fill-active);
  --action-text: var(--accent-soft-action-text);
  --action-border: var(--accent-soft-action-border);
}

.bg-accent-base {
  background-color: var(--accent-base);
  --bg-color: var(--accent-base);
  --text-heading: var(--accent-base-text-heading);
  --text-base: var(--accent-base-text-base);
  --text-muted: var(--accent-base-text-muted);

  --link: var(--accent-base-link);
  --link-hover: var(--accent-base-link-hover);
  --link-active: var(--accent-base-link-active);

  --border: var(--accent-base-border);

  --action-fill: var(--accent-base-action-fill);
  --action-fill-hover: var(--accent-base-action-fill-hover);
  --action-fill-active: var(--accent-base-action-fill-active);
  --action-text: var(--accent-base-action-text);
  --action-border: var(--accent-base-action-border);
}

.bg-accent-strong {
  background-color: var(--accent-strong);
  --bg-color: var(--accent-strong);
  --text-heading: var(--accent-strong-text-heading);
  --text-base: var(--accent-strong-text-base);
  --text-muted: var(--accent-strong-text-muted);

  --link: var(--accent-strong-link);
  --link-hover: var(--accent-strong-link-hover);
  --link-active: var(--accent-strong-link-active);

  --border: var(--accent-strong-border);

  --action-fill: var(--accent-strong-action-fill);
  --action-fill-hover: var(--accent-strong-action-fill-hover);
  --action-fill-active: var(--accent-strong-action-fill-active);
  --action-text: var(--accent-strong-action-text);
  --action-border: var(--accent-strong-action-border);
}

.bg-accent-stronger {
  background-color: var(--accent-stronger);
  --bg-color: var(--accent-stronger);
  --text-heading: var(--accent-stronger-text-heading);
  --text-base: var(--accent-stronger-text-base);
  --text-muted: var(--accent-stronger-text-muted);

  --link: var(--accent-stronger-link);
  --link-hover: var(--accent-stronger-link-hover);
  --link-active: var(--accent-stronger-link-active);

  --border: var(--accent-stronger-border);

  --action-fill: var(--accent-stronger-action-fill);
  --action-fill-hover: var(--accent-stronger-action-fill-hover);
  --action-fill-active: var(--accent-stronger-action-fill-active);
  --action-text: var(--accent-stronger-action-text);
  --action-border: var(--accent-stronger-action-border);
}

.bg-neutral-weak {
  background-color: var(--neutral-weak);
  --bg-color: var(--neutral-weak);
  --text-heading: var(--neutral-weak-text-heading);
  --text-base: var(--neutral-weak-text-base);
  --text-muted: var(--neutral-weak-text-muted);

  --link: var(--neutral-weak-link);
  --link-hover: var(--neutral-weak-link-hover);
  --link-active: var(--neutral-weak-link-active);

  --border: var(--neutral-weak-border);

  --action-fill: var(--neutral-weak-action-fill);
  --action-fill-hover: var(--neutral-weak-action-fill-hover);
  --action-fill-active: var(--neutral-weak-action-fill-active);
  --action-text: var(--neutral-weak-action-text);
  --action-border: var(--neutral-weak-action-border);
}

.bg-neutral-soft {
  background-color: var(--neutral-soft);
  --bg-color: var(--neutral-soft);
  --text-heading: var(--neutral-soft-text-heading);
  --text-base: var(--neutral-soft-text-base);
  --text-muted: var(--neutral-soft-text-muted);

  --link: var(--neutral-soft-link);
  --link-hover: var(--neutral-soft-link-hover);
  --link-active: var(--neutral-soft-link-active);

  --border: var(--neutral-soft-border);

  --action-fill: var(--neutral-soft-action-fill);
  --action-fill-hover: var(--neutral-soft-action-fill-hover);
  --action-fill-active: var(--neutral-soft-action-fill-active);
  --action-text: var(--neutral-soft-action-text);
  --action-border: var(--neutral-soft-action-border);
}

.bg-neutral-base {
  background-color: var(--neutral-base);
  --bg-color: var(--neutral-base);
  --text-heading: var(--neutral-base-text-heading);
  --text-base: var(--neutral-base-text-base);
  --text-muted: var(--neutral-base-text-muted);

  --link: var(--neutral-base-link);
  --link-hover: var(--neutral-base-link-hover);
  --link-active: var(--neutral-base-link-active);

  --border: var(--neutral-base-border);

  --action-fill: var(--neutral-base-action-fill);
  --action-fill-hover: var(--neutral-base-action-fill-hover);
  --action-fill-active: var(--neutral-base-action-fill-active);
  --action-text: var(--neutral-base-action-text);
  --action-border: var(--neutral-base-action-border);
}

.bg-neutral-strong {
  background-color: var(--neutral-strong);
  --bg-color: var(--neutral-strong);
  --text-heading: var(--neutral-strong-text-heading);
  --text-base: var(--neutral-strong-text-base);
  --text-muted: var(--neutral-strong-text-muted);

  --link: var(--neutral-strong-link);
  --link-hover: var(--neutral-strong-link-hover);
  --link-active: var(--neutral-strong-link-active);

  --border: var(--neutral-strong-border);

  --action-fill: var(--neutral-strong-action-fill);
  --action-fill-hover: var(--neutral-strong-action-fill-hover);
  --action-fill-active: var(--neutral-strong-action-fill-active);
  --action-text: var(--neutral-strong-action-text);
  --action-border: var(--neutral-strong-action-border);
}

.bg-neutral-stronger {
  background-color: var(--neutral-stronger);
  --bg-color: var(--neutral-stronger);
  --text-heading: var(--neutral-stronger-text-heading);
  --text-base: var(--neutral-stronger-text-base);
  --text-muted: var(--neutral-stronger-text-muted);

  --link: var(--neutral-stronger-link);
  --link-hover: var(--neutral-stronger-link-hover);
  --link-active: var(--neutral-stronger-link-active);

  --border: var(--neutral-stronger-border);

  --action-fill: var(--neutral-stronger-action-fill);
  --action-fill-hover: var(--neutral-stronger-action-fill-hover);
  --action-fill-active: var(--neutral-stronger-action-fill-active);
  --action-text: var(--neutral-stronger-action-text);
  --action-border: var(--neutral-stronger-action-border);
}

.bg-success-weak {
  background-color: var(--success-weak);
  --bg-color: var(--success-weak);
  --text-heading: var(--success-weak-text-heading);
  --text-base: var(--success-weak-text-base);
  --text-muted: var(--success-weak-text-muted);

  --link: var(--success-weak-link);
  --link-hover: var(--success-weak-link-hover);
  --link-active: var(--success-weak-link-active);

  --border: var(--success-weak-border);

  --action-fill: var(--success-weak-action-fill);
  --action-fill-hover: var(--success-weak-action-fill-hover);
  --action-fill-active: var(--success-weak-action-fill-active);
  --action-text: var(--success-weak-action-text);
  --action-border: var(--success-weak-action-border);
}

.bg-success-soft {
  background-color: var(--success-soft);
  --bg-color: var(--success-soft);
  --text-heading: var(--success-soft-text-heading);
  --text-base: var(--success-soft-text-base);
  --text-muted: var(--success-soft-text-muted);

  --link: var(--success-soft-link);
  --link-hover: var(--success-soft-link-hover);
  --link-active: var(--success-soft-link-active);

  --border: var(--success-soft-border);

  --action-fill: var(--success-soft-action-fill);
  --action-fill-hover: var(--success-soft-action-fill-hover);
  --action-fill-active: var(--success-soft-action-fill-active);
  --action-text: var(--success-soft-action-text);
  --action-border: var(--success-soft-action-border);
}

.bg-success-base {
  background-color: var(--success-base);
  --bg-color: var(--success-base);
  --text-heading: var(--success-base-text-heading);
  --text-base: var(--success-base-text-base);
  --text-muted: var(--success-base-text-muted);

  --link: var(--success-base-link);
  --link-hover: var(--success-base-link-hover);
  --link-active: var(--success-base-link-active);

  --border: var(--success-base-border);

  --action-fill: var(--success-base-action-fill);
  --action-fill-hover: var(--success-base-action-fill-hover);
  --action-fill-active: var(--success-base-action-fill-active);
  --action-text: var(--success-base-action-text);
  --action-border: var(--success-base-action-border);
}

.bg-success-strong {
  background-color: var(--success-strong);
  --bg-color: var(--success-strong);
  --text-heading: var(--success-strong-text-heading);
  --text-base: var(--success-strong-text-base);
  --text-muted: var(--success-strong-text-muted);

  --link: var(--success-strong-link);
  --link-hover: var(--success-strong-link-hover);
  --link-active: var(--success-strong-link-active);

  --border: var(--success-strong-border);

  --action-fill: var(--success-strong-action-fill);
  --action-fill-hover: var(--success-strong-action-fill-hover);
  --action-fill-active: var(--success-strong-action-fill-active);
  --action-text: var(--success-strong-action-text);
  --action-border: var(--success-strong-action-border);
}

.bg-success-stronger {
  background-color: var(--success-stronger);
  --bg-color: var(--success-stronger);
  --text-heading: var(--success-stronger-text-heading);
  --text-base: var(--success-stronger-text-base);
  --text-muted: var(--success-stronger-text-muted);

  --link: var(--success-stronger-link);
  --link-hover: var(--success-stronger-link-hover);
  --link-active: var(--success-stronger-link-active);

  --border: var(--success-stronger-border);

  --action-fill: var(--success-stronger-action-fill);
  --action-fill-hover: var(--success-stronger-action-fill-hover);
  --action-fill-active: var(--success-stronger-action-fill-active);
  --action-text: var(--success-stronger-action-text);
  --action-border: var(--success-stronger-action-border);
}

.bg-info-weak {
  background-color: var(--info-weak);
  --bg-color: var(--info-weak);
  --text-heading: var(--info-weak-text-heading);
  --text-base: var(--info-weak-text-base);
  --text-muted: var(--info-weak-text-muted);

  --link: var(--info-weak-link);
  --link-hover: var(--info-weak-link-hover);
  --link-active: var(--info-weak-link-active);

  --border: var(--info-weak-border);

  --action-fill: var(--info-weak-action-fill);
  --action-fill-hover: var(--info-weak-action-fill-hover);
  --action-fill-active: var(--info-weak-action-fill-active);
  --action-text: var(--info-weak-action-text);
  --action-border: var(--info-weak-action-border);
}

.bg-info-soft {
  background-color: var(--info-soft);
  --bg-color: var(--info-soft);
  --text-heading: var(--info-soft-text-heading);
  --text-base: var(--info-soft-text-base);
  --text-muted: var(--info-soft-text-muted);

  --link: var(--info-soft-link);
  --link-hover: var(--info-soft-link-hover);
  --link-active: var(--info-soft-link-active);

  --border: var(--info-soft-border);

  --action-fill: var(--info-soft-action-fill);
  --action-fill-hover: var(--info-soft-action-fill-hover);
  --action-fill-active: var(--info-soft-action-fill-active);
  --action-text: var(--info-soft-action-text);
  --action-border: var(--info-soft-action-border);
}

.bg-info-base {
  background-color: var(--info-base);
  --bg-color: var(--info-base);
  --text-heading: var(--info-base-text-heading);
  --text-base: var(--info-base-text-base);
  --text-muted: var(--info-base-text-muted);

  --link: var(--info-base-link);
  --link-hover: var(--info-base-link-hover);
  --link-active: var(--info-base-link-active);

  --border: var(--info-base-border);

  --action-fill: var(--info-base-action-fill);
  --action-fill-hover: var(--info-base-action-fill-hover);
  --action-fill-active: var(--info-base-action-fill-active);
  --action-text: var(--info-base-action-text);
  --action-border: var(--info-base-action-border);
}

.bg-info-strong {
  background-color: var(--info-strong);
  --bg-color: var(--info-strong);
  --text-heading: var(--info-strong-text-heading);
  --text-base: var(--info-strong-text-base);
  --text-muted: var(--info-strong-text-muted);

  --link: var(--info-strong-link);
  --link-hover: var(--info-strong-link-hover);
  --link-active: var(--info-strong-link-active);

  --border: var(--info-strong-border);

  --action-fill: var(--info-strong-action-fill);
  --action-fill-hover: var(--info-strong-action-fill-hover);
  --action-fill-active: var(--info-strong-action-fill-active);
  --action-text: var(--info-strong-action-text);
  --action-border: var(--info-strong-action-border);
}

.bg-info-stronger {
  background-color: var(--info-stronger);
  --bg-color: var(--info-stronger);
  --text-heading: var(--info-stronger-text-heading);
  --text-base: var(--info-stronger-text-base);
  --text-muted: var(--info-stronger-text-muted);

  --link: var(--info-stronger-link);
  --link-hover: var(--info-stronger-link-hover);
  --link-active: var(--info-stronger-link-active);

  --border: var(--info-stronger-border);

  --action-fill: var(--info-stronger-action-fill);
  --action-fill-hover: var(--info-stronger-action-fill-hover);
  --action-fill-active: var(--info-stronger-action-fill-active);
  --action-text: var(--info-stronger-action-text);
  --action-border: var(--info-stronger-action-border);
}

.bg-error-weak {
  background-color: var(--error-weak);
  --bg-color: var(--error-weak);
  --text-heading: var(--error-weak-text-heading);
  --text-base: var(--error-weak-text-base);
  --text-muted: var(--error-weak-text-muted);

  --link: var(--error-weak-link);
  --link-hover: var(--error-weak-link-hover);
  --link-active: var(--error-weak-link-active);

  --border: var(--error-weak-border);

  --action-fill: var(--error-weak-action-fill);
  --action-fill-hover: var(--error-weak-action-fill-hover);
  --action-fill-active: var(--error-weak-action-fill-active);
  --action-text: var(--error-weak-action-text);
  --action-border: var(--error-weak-action-border);
}

.bg-error-soft {
  background-color: var(--error-soft);
  --bg-color: var(--error-soft);
  --text-heading: var(--error-soft-text-heading);
  --text-base: var(--error-soft-text-base);
  --text-muted: var(--error-soft-text-muted);

  --link: var(--error-soft-link);
  --link-hover: var(--error-soft-link-hover);
  --link-active: var(--error-soft-link-active);

  --border: var(--error-soft-border);

  --action-fill: var(--error-soft-action-fill);
  --action-fill-hover: var(--error-soft-action-fill-hover);
  --action-fill-active: var(--error-soft-action-fill-active);
  --action-text: var(--error-soft-action-text);
  --action-border: var(--error-soft-action-border);
}

.bg-error-base {
  background-color: var(--error-base);
  --bg-color: var(--error-base);
  --text-heading: var(--error-base-text-heading);
  --text-base: var(--error-base-text-base);
  --text-muted: var(--error-base-text-muted);

  --link: var(--error-base-link);
  --link-hover: var(--error-base-link-hover);
  --link-active: var(--error-base-link-active);

  --border: var(--error-base-border);

  --action-fill: var(--error-base-action-fill);
  --action-fill-hover: var(--error-base-action-fill-hover);
  --action-fill-active: var(--error-base-action-fill-active);
  --action-text: var(--error-base-action-text);
  --action-border: var(--error-base-action-border);
}

.bg-error-strong {
  background-color: var(--error-strong);
  --bg-color: var(--error-strong);
  --text-heading: var(--error-strong-text-heading);
  --text-base: var(--error-strong-text-base);
  --text-muted: var(--error-strong-text-muted);

  --link: var(--error-strong-link);
  --link-hover: var(--error-strong-link-hover);
  --link-active: var(--error-strong-link-active);

  --border: var(--error-strong-border);

  --action-fill: var(--error-strong-action-fill);
  --action-fill-hover: var(--error-strong-action-fill-hover);
  --action-fill-active: var(--error-strong-action-fill-active);
  --action-text: var(--error-strong-action-text);
  --action-border: var(--error-strong-action-border);
}

.bg-error-stronger {
  background-color: var(--error-stronger);
  --bg-color: var(--error-stronger);
  --text-heading: var(--error-stronger-text-heading);
  --text-base: var(--error-stronger-text-base);
  --text-muted: var(--error-stronger-text-muted);

  --link: var(--error-stronger-link);
  --link-hover: var(--error-stronger-link-hover);
  --link-active: var(--error-stronger-link-active);

  --border: var(--error-stronger-border);

  --action-fill: var(--error-stronger-action-fill);
  --action-fill-hover: var(--error-stronger-action-fill-hover);
  --action-fill-active: var(--error-stronger-action-fill-active);
  --action-text: var(--error-stronger-action-text);
  --action-border: var(--error-stronger-action-border);
}

.bg-warning-weak {
  background-color: var(--warning-weak);
  --bg-color: var(--warning-weak);
  --text-heading: var(--warning-weak-text-heading);
  --text-base: var(--warning-weak-text-base);
  --text-muted: var(--warning-weak-text-muted);

  --link: var(--warning-weak-link);
  --link-hover: var(--warning-weak-link-hover);
  --link-active: var(--warning-weak-link-active);

  --border: var(--warning-weak-border);

  --action-fill: var(--warning-weak-action-fill);
  --action-fill-hover: var(--warning-weak-action-fill-hover);
  --action-fill-active: var(--warning-weak-action-fill-active);
  --action-text: var(--warning-weak-action-text);
  --action-border: var(--warning-weak-action-border);
}

.bg-warning-soft {
  background-color: var(--warning-soft);
  --bg-color: var(--warning-soft);
  --text-heading: var(--warning-soft-text-heading);
  --text-base: var(--warning-soft-text-base);
  --text-muted: var(--warning-soft-text-muted);

  --link: var(--warning-soft-link);
  --link-hover: var(--warning-soft-link-hover);
  --link-active: var(--warning-soft-link-active);

  --border: var(--warning-soft-border);

  --action-fill: var(--warning-soft-action-fill);
  --action-fill-hover: var(--warning-soft-action-fill-hover);
  --action-fill-active: var(--warning-soft-action-fill-active);
  --action-text: var(--warning-soft-action-text);
  --action-border: var(--warning-soft-action-border);
}

.bg-warning-base {
  background-color: var(--warning-base);
  --bg-color: var(--warning-base);
  --text-heading: var(--warning-base-text-heading);
  --text-base: var(--warning-base-text-base);
  --text-muted: var(--warning-base-text-muted);

  --link: var(--warning-base-link);
  --link-hover: var(--warning-base-link-hover);
  --link-active: var(--warning-base-link-active);

  --border: var(--warning-base-border);

  --action-fill: var(--warning-base-action-fill);
  --action-fill-hover: var(--warning-base-action-fill-hover);
  --action-fill-active: var(--warning-base-action-fill-active);
  --action-text: var(--warning-base-action-text);
  --action-border: var(--warning-base-action-border);
}

.bg-warning-strong {
  background-color: var(--warning-strong);
  --bg-color: var(--warning-strong);
  --text-heading: var(--warning-strong-text-heading);
  --text-base: var(--warning-strong-text-base);
  --text-muted: var(--warning-strong-text-muted);

  --link: var(--warning-strong-link);
  --link-hover: var(--warning-strong-link-hover);
  --link-active: var(--warning-strong-link-active);

  --border: var(--warning-strong-border);

  --action-fill: var(--warning-strong-action-fill);
  --action-fill-hover: var(--warning-strong-action-fill-hover);
  --action-fill-active: var(--warning-strong-action-fill-active);
  --action-text: var(--warning-strong-action-text);
  --action-border: var(--warning-strong-action-border);
}

.bg-warning-stronger {
  background-color: var(--warning-stronger);
  --bg-color: var(--warning-stronger);
  --text-heading: var(--warning-stronger-text-heading);
  --text-base: var(--warning-stronger-text-base);
  --text-muted: var(--warning-stronger-text-muted);

  --link: var(--warning-stronger-link);
  --link-hover: var(--warning-stronger-link-hover);
  --link-active: var(--warning-stronger-link-active);

  --border: var(--warning-stronger-border);

  --action-fill: var(--warning-stronger-action-fill);
  --action-fill-hover: var(--warning-stronger-action-fill-hover);
  --action-fill-active: var(--warning-stronger-action-fill-active);
  --action-text: var(--warning-stronger-action-text);
  --action-border: var(--warning-stronger-action-border);
}

.bg-header {
  background-color: var(--header);
  --bg-color: var(--header);
  --text-heading: var(--header-text-heading);
  --text-base: var(--header-text-base);
  --text-muted: var(--header-text-muted);

  --link: var(--header-link);
  --link-hover: var(--header-link-hover);
  --link-active: var(--header-link-active);

  --border: var(--header-border);

  --action-fill: var(--header-action-fill);
  --action-fill-hover: var(--header-action-fill-hover);
  --action-fill-active: var(--header-action-fill-active);
  --action-text: var(--header-action-text);
  --action-border: var(--header-action-border);
}

.bg-footer {
  background-color: var(--footer);
  --bg-color: var(--footer);
  --text-heading: var(--footer-text-heading);
  --text-base: var(--footer-text-base);
  --text-muted: var(--footer-text-muted);

  --link: var(--footer-link);
  --link-hover: var(--footer-link-hover);
  --link-active: var(--footer-link-active);

  --border: var(--footer-border);

  --action-fill: var(--footer-action-fill);
  --action-fill-hover: var(--footer-action-fill-hover);
  --action-fill-active: var(--footer-action-fill-active);
  --action-text: var(--footer-action-text);
  --action-border: var(--footer-action-border);
}

.bg-default {
  background-color: var(--default);
  --bg-color: var(--default);
  --text-heading: var(--default-text-heading);
  --text-base: var(--default-text-base);
  --text-muted: var(--default-text-muted);

  --link: var(--default-link);
  --link-hover: var(--default-link-hover);
  --link-active: var(--default-link-active);

  --border: var(--default-border);

  --action-fill: var(--default-action-fill);
  --action-fill-hover: var(--default-action-fill-hover);
  --action-fill-active: var(--default-action-fill-active);
  --action-text: var(--default-action-text);
  --action-border: var(--default-action-border);
}

.fill-primary-weak {
  fill: var(--primary-weak);
}

.fill-primary-soft {
  fill: var(--primary-soft);
}

.fill-primary-base {
  fill: var(--primary-base);
}

.fill-primary-strong {
  fill: var(--primary-strong);
}

.fill-primary-stronger {
  fill: var(--primary-stronger);
}

.fill-secondary-weak {
  fill: var(--secondary-weak);
}

.fill-secondary-soft {
  fill: var(--secondary-soft);
}

.fill-secondary-base {
  fill: var(--secondary-base);
}

.fill-secondary-strong {
  fill: var(--secondary-strong);
}

.fill-secondary-stronger {
  fill: var(--secondary-stronger);
}

.fill-accent-weak {
  fill: var(--accent-weak);
}

.fill-accent-soft {
  fill: var(--accent-soft);
}

.fill-accent-base {
  fill: var(--accent-base);
}

.fill-accent-strong {
  fill: var(--accent-strong);
}

.fill-accent-stronger {
  fill: var(--accent-stronger);
}

.fill-neutral-weak {
  fill: var(--neutral-weak);
}

.fill-neutral-soft {
  fill: var(--neutral-soft);
}

.fill-neutral-base {
  fill: var(--neutral-base);
}

.fill-neutral-strong {
  fill: var(--neutral-strong);
}

.fill-neutral-stronger {
  fill: var(--neutral-stronger);
}

.fill-success-weak {
  fill: var(--success-weak);
}

.fill-success-soft {
  fill: var(--success-soft);
}

.fill-success-base {
  fill: var(--success-base);
}

.fill-success-strong {
  fill: var(--success-strong);
}

.fill-success-stronger {
  fill: var(--success-stronger);
}

.fill-info-weak {
  fill: var(--info-weak);
}

.fill-info-soft {
  fill: var(--info-soft);
}

.fill-info-base {
  fill: var(--info-base);
}

.fill-info-strong {
  fill: var(--info-strong);
}

.fill-info-stronger {
  fill: var(--info-stronger);
}

.fill-error-weak {
  fill: var(--error-weak);
}

.fill-error-soft {
  fill: var(--error-soft);
}

.fill-error-base {
  fill: var(--error-base);
}

.fill-error-strong {
  fill: var(--error-strong);
}

.fill-error-stronger {
  fill: var(--error-stronger);
}

.fill-warning-weak {
  fill: var(--warning-weak);
}

.fill-warning-soft {
  fill: var(--warning-soft);
}

.fill-warning-base {
  fill: var(--warning-base);
}

.fill-warning-strong {
  fill: var(--warning-strong);
}

.fill-warning-stronger {
  fill: var(--warning-stronger);
}

.fill-header {
  fill: var(--header);
}

.fill-footer {
  fill: var(--footer);
}

.fill-default {
  fill: var(--default);
}

/* === Admin Portal Border Utility Classes === */
.border-primary-weak {
  border-color: var(--primary-weak);
}

.hover\:border-primary-weak:hover {
  border-color: var(--primary-weak);
}

.active\:border-primary-weak:active {
  border-color: var(--primary-weak);
}

.border-primary-soft {
  border-color: var(--primary-soft);
}

.hover\:border-primary-soft:hover {
  border-color: var(--primary-soft);
}

.active\:border-primary-soft:active {
  border-color: var(--primary-soft);
}

.border-primary-base {
  border-color: var(--primary-base);
}

.hover\:border-primary-base:hover {
  border-color: var(--primary-base);
}

.active\:border-primary-base:active {
  border-color: var(--primary-base);
}

.border-primary-strong {
  border-color: var(--primary-strong);
}

.hover\:border-primary-strong:hover {
  border-color: var(--primary-strong);
}

.active\:border-primary-strong:active {
  border-color: var(--primary-strong);
}

.border-primary-stronger {
  border-color: var(--primary-stronger);
}

.hover\:border-primary-stronger:hover {
  border-color: var(--primary-stronger);
}

.active\:border-primary-stronger:active {
  border-color: var(--primary-stronger);
}

.border-secondary-weak {
  border-color: var(--secondary-weak);
}

.hover\:border-secondary-weak:hover {
  border-color: var(--secondary-weak);
}

.active\:border-secondary-weak:active {
  border-color: var(--secondary-weak);
}

.border-secondary-soft {
  border-color: var(--secondary-soft);
}

.hover\:border-secondary-soft:hover {
  border-color: var(--secondary-soft);
}

.active\:border-secondary-soft:active {
  border-color: var(--secondary-soft);
}

.border-secondary-base {
  border-color: var(--secondary-base);
}

.hover\:border-secondary-base:hover {
  border-color: var(--secondary-base);
}

.active\:border-secondary-base:active {
  border-color: var(--secondary-base);
}

.border-secondary-strong {
  border-color: var(--secondary-strong);
}

.hover\:border-secondary-strong:hover {
  border-color: var(--secondary-strong);
}

.active\:border-secondary-strong:active {
  border-color: var(--secondary-strong);
}

.border-secondary-stronger {
  border-color: var(--secondary-stronger);
}

.hover\:border-secondary-stronger:hover {
  border-color: var(--secondary-stronger);
}

.active\:border-secondary-stronger:active {
  border-color: var(--secondary-stronger);
}

.border-accent-weak {
  border-color: var(--accent-weak);
}

.hover\:border-accent-weak:hover {
  border-color: var(--accent-weak);
}

.active\:border-accent-weak:active {
  border-color: var(--accent-weak);
}

.border-accent-soft {
  border-color: var(--accent-soft);
}

.hover\:border-accent-soft:hover {
  border-color: var(--accent-soft);
}

.active\:border-accent-soft:active {
  border-color: var(--accent-soft);
}

.border-accent-base {
  border-color: var(--accent-base);
}

.hover\:border-accent-base:hover {
  border-color: var(--accent-base);
}

.active\:border-accent-base:active {
  border-color: var(--accent-base);
}

.border-accent-strong {
  border-color: var(--accent-strong);
}

.hover\:border-accent-strong:hover {
  border-color: var(--accent-strong);
}

.active\:border-accent-strong:active {
  border-color: var(--accent-strong);
}

.border-accent-stronger {
  border-color: var(--accent-stronger);
}

.hover\:border-accent-stronger:hover {
  border-color: var(--accent-stronger);
}

.active\:border-accent-stronger:active {
  border-color: var(--accent-stronger);
}

.border-neutral-weak {
  border-color: var(--neutral-weak);
}

.hover\:border-neutral-weak:hover {
  border-color: var(--neutral-weak);
}

.active\:border-neutral-weak:active {
  border-color: var(--neutral-weak);
}

.border-neutral-soft {
  border-color: var(--neutral-soft);
}

.hover\:border-neutral-soft:hover {
  border-color: var(--neutral-soft);
}

.active\:border-neutral-soft:active {
  border-color: var(--neutral-soft);
}

.border-neutral-base {
  border-color: var(--neutral-base);
}

.hover\:border-neutral-base:hover {
  border-color: var(--neutral-base);
}

.active\:border-neutral-base:active {
  border-color: var(--neutral-base);
}

.border-neutral-strong {
  border-color: var(--neutral-strong);
}

.hover\:border-neutral-strong:hover {
  border-color: var(--neutral-strong);
}

.active\:border-neutral-strong:active {
  border-color: var(--neutral-strong);
}

.border-neutral-stronger {
  border-color: var(--neutral-stronger);
}

.hover\:border-neutral-stronger:hover {
  border-color: var(--neutral-stronger);
}

.active\:border-neutral-stronger:active {
  border-color: var(--neutral-stronger);
}

.border-success-weak {
  border-color: var(--success-weak);
}

.hover\:border-success-weak:hover {
  border-color: var(--success-weak);
}

.active\:border-success-weak:active {
  border-color: var(--success-weak);
}

.border-success-soft {
  border-color: var(--success-soft);
}

.hover\:border-success-soft:hover {
  border-color: var(--success-soft);
}

.active\:border-success-soft:active {
  border-color: var(--success-soft);
}

.border-success-base {
  border-color: var(--success-base);
}

.hover\:border-success-base:hover {
  border-color: var(--success-base);
}

.active\:border-success-base:active {
  border-color: var(--success-base);
}

.border-success-strong {
  border-color: var(--success-strong);
}

.hover\:border-success-strong:hover {
  border-color: var(--success-strong);
}

.active\:border-success-strong:active {
  border-color: var(--success-strong);
}

.border-success-stronger {
  border-color: var(--success-stronger);
}

.hover\:border-success-stronger:hover {
  border-color: var(--success-stronger);
}

.active\:border-success-stronger:active {
  border-color: var(--success-stronger);
}

.border-info-weak {
  border-color: var(--info-weak);
}

.hover\:border-info-weak:hover {
  border-color: var(--info-weak);
}

.active\:border-info-weak:active {
  border-color: var(--info-weak);
}

.border-info-soft {
  border-color: var(--info-soft);
}

.hover\:border-info-soft:hover {
  border-color: var(--info-soft);
}

.active\:border-info-soft:active {
  border-color: var(--info-soft);
}

.border-info-base {
  border-color: var(--info-base);
}

.hover\:border-info-base:hover {
  border-color: var(--info-base);
}

.active\:border-info-base:active {
  border-color: var(--info-base);
}

.border-info-strong {
  border-color: var(--info-strong);
}

.hover\:border-info-strong:hover {
  border-color: var(--info-strong);
}

.active\:border-info-strong:active {
  border-color: var(--info-strong);
}

.border-info-stronger {
  border-color: var(--info-stronger);
}

.hover\:border-info-stronger:hover {
  border-color: var(--info-stronger);
}

.active\:border-info-stronger:active {
  border-color: var(--info-stronger);
}

.border-error-weak {
  border-color: var(--error-weak);
}

.hover\:border-error-weak:hover {
  border-color: var(--error-weak);
}

.active\:border-error-weak:active {
  border-color: var(--error-weak);
}

.border-error-soft {
  border-color: var(--error-soft);
}

.hover\:border-error-soft:hover {
  border-color: var(--error-soft);
}

.active\:border-error-soft:active {
  border-color: var(--error-soft);
}

.border-error-base {
  border-color: var(--error-base);
}

.hover\:border-error-base:hover {
  border-color: var(--error-base);
}

.active\:border-error-base:active {
  border-color: var(--error-base);
}

.border-error-strong {
  border-color: var(--error-strong);
}

.hover\:border-error-strong:hover {
  border-color: var(--error-strong);
}

.active\:border-error-strong:active {
  border-color: var(--error-strong);
}

.border-error-stronger {
  border-color: var(--error-stronger);
}

.hover\:border-error-stronger:hover {
  border-color: var(--error-stronger);
}

.active\:border-error-stronger:active {
  border-color: var(--error-stronger);
}

.border-warning-weak {
  border-color: var(--warning-weak);
}

.hover\:border-warning-weak:hover {
  border-color: var(--warning-weak);
}

.active\:border-warning-weak:active {
  border-color: var(--warning-weak);
}

.border-warning-soft {
  border-color: var(--warning-soft);
}

.hover\:border-warning-soft:hover {
  border-color: var(--warning-soft);
}

.active\:border-warning-soft:active {
  border-color: var(--warning-soft);
}

.border-warning-base {
  border-color: var(--warning-base);
}

.hover\:border-warning-base:hover {
  border-color: var(--warning-base);
}

.active\:border-warning-base:active {
  border-color: var(--warning-base);
}

.border-warning-strong {
  border-color: var(--warning-strong);
}

.hover\:border-warning-strong:hover {
  border-color: var(--warning-strong);
}

.active\:border-warning-strong:active {
  border-color: var(--warning-strong);
}

.border-warning-stronger {
  border-color: var(--warning-stronger);
}

.hover\:border-warning-stronger:hover {
  border-color: var(--warning-stronger);
}

.active\:border-warning-stronger:active {
  border-color: var(--warning-stronger);
}

.border-header {
  border-color: var(--header);
}

.hover\:border-header:hover {
  border-color: var(--header);
}

.active\:border-header:active {
  border-color: var(--header);
}

.border-footer {
  border-color: var(--footer);
}

.hover\:border-footer:hover {
  border-color: var(--footer);
}

.active\:border-footer:active {
  border-color: var(--footer);
}

.border-default {
  border-color: var(--default);
}

.hover\:border-default:hover {
  border-color: var(--default);
}

.active\:border-default:active {
  border-color: var(--default);
}

/* === Font Faces === */
@font-face { font-family: "Roboto"; src: url("https://clyrex.api.administration.onmakemysite.com/itemassets/fontfile/34/roboto-italic-variablefontwdthwght.ttf") format("truetype"); font-style: italic; font-weight: 100 900; font-display: swap; }
@font-face { font-family: "Roboto"; src: url("https://clyrex.api.administration.onmakemysite.com/itemassets/fontfile/100/roboto-variablefontwdthwght.ttf") format("truetype"); font-style: normal; font-weight: 300 900; font-display: swap; }
@font-face { font-family: "Playfair Display"; src: url("https://clyrex.api.administration.onmakemysite.com/itemassets/fontfile/35/playfairdisplay-variablefontwght.ttf") format("truetype"); font-style: normal; font-weight: 400 900; font-display: swap; }
@font-face { font-family: "Playfair Display"; src: url("https://clyrex.api.administration.onmakemysite.com/itemassets/fontfile/36/playfairdisplay-italic-variablefontwght.ttf") format("truetype"); font-style: italic; font-weight: 200 900; font-display: swap; }
@font-face { font-family: "Poppins"; src: url("https://clyrex.api.administration.onmakemysite.com/itemassets/fontfile/37/poppins-thin.ttf") format("truetype"); font-style: normal; font-weight: 100; font-display: swap; }
@font-face { font-family: "Poppins"; src: url("https://clyrex.api.administration.onmakemysite.com/itemassets/fontfile/103/poppins-italic.ttf") format("truetype"); font-style: italic; font-weight: 200; font-display: swap; }
@font-face { font-family: "Nunito"; src: url("https://clyrex.api.administration.onmakemysite.com/itemassets/fontfile/84/nunito-variablefontwght.ttf") format("truetype"); font-style: normal; font-weight: 200 1000; font-display: swap; }
@font-face { font-family: "Nunito"; src: url("https://clyrex.api.administration.onmakemysite.com/itemassets/fontfile/85/nunito-italic-variablefontwght.ttf") format("truetype"); font-style: italic; font-weight: 200 1000; font-display: swap; }
@font-face { font-family: "Abril Fatface"; src: url("https://clyrex.api.administration.onmakemysite.com/itemassets/fontfile/107/abrilfatface-regular.ttf") format("truetype"); font-style: normal; font-weight: 400; font-display: swap; }
@font-face { font-family: "Pacifico"; src: url("https://clyrex.api.administration.onmakemysite.com/itemassets/fontfile/108/pacifico-regular.ttf") format("truetype"); font-style: normal; font-weight: 400 600; font-display: swap; }
@font-face { font-family: "caveat"; src: url("https://clyrex.api.administration.onmakemysite.com/itemassets/fontfile/109/caveat-variablefontwght.ttf") format("truetype"); font-style: normal; font-weight: 400 700; font-display: swap; }
@font-face { font-family: "Nosifer"; src: url("https://clyrex.api.administration.onmakemysite.com/itemassets/fontfile/137/nosifer-regular.ttf") format("truetype"); font-style: normal; font-weight: 400; font-display: swap; }
@font-face { font-family: "eater"; src: url("https://clyrex.api.administration.onmakemysite.com/itemassets/fontfile/143/eater-regular.ttf") format("truetype"); font-style: normal; font-weight: 400 700; font-display: swap; }