/* =============================================================================
   ASMES — COLOR PALETTE  (single source of truth)
   12-hue color wheel (starting at blue). Each hue: base + -light (tint) + -shade.
   Load this file LAST so it is authoritative over any legacy color rules.

   Reference from HTML:
     background : <div class="color-blue-green">
     text       : <span class="text-blue-green">
     border     : <div class="border-blue-green">
     variable   : style="background: var(--blue-green)"
   Visual reference: color-palette.html
   ============================================================================= */

:root{
  /* blue */          --blue:#2F6FD6;          --blue-light:#B9CFF3;          --blue-shade:#1E4A8F;
  /* blue-green */    --blue-green:#10AEC4;     --blue-green-light:#A9E4EC;    --blue-green-shade:#0A7180;
  /* green */         --green:#1EB47E;          --green-light:#A9E6CD;         --green-shade:#12764F;
  /* yellow-green */  --yellow-green:#7CC23F;   --yellow-green-light:#CFE9AC;  --yellow-green-shade:#4F7D26;
  /* yellow */        --yellow:#F6C026;         --yellow-light:#FBE6A3;        --yellow-shade:#B0850F;
  /* yellow-orange */ --yellow-orange:#F7A021;  --yellow-orange-light:#FCD9A2; --yellow-orange-shade:#B06A08;
  /* orange */        --orange:#FD8300;         --orange-light:#FFCF99;        --orange-shade:#B65900;
  /* red-orange */    --red-orange:#F65A2B;     --red-orange-light:#FCC0AA;    --red-orange-shade:#AD3413;
  /* red */           --red:#FD3F28;            --red-light:#FFC0B5;           --red-shade:#B41F10;
  /* red-violet */    --red-violet:#CF3D84;     --red-violet-light:#F0B3D1;    --red-violet-shade:#8C2456;
  /* violet */        --violet:#773CB2;         --violet-light:#D3BDE8;        --violet-shade:#4C2775;
  /* indigo */        --indigo:#4B52C9;         --indigo-light:#BCBFF0;        --indigo-shade:#2E3488;
  /* brand / neutral */ --rowad:#346FB4;        --light-grey:#FAFAFA;
}

/* ---------- BACKGROUND ---------- */
.color-blue{background-color:var(--blue)}                 .color-blue-light{background-color:var(--blue-light)}                 .color-blue-shade{background-color:var(--blue-shade)}
.color-blue-green{background-color:var(--blue-green)}     .color-blue-green-light{background-color:var(--blue-green-light)}     .color-blue-green-shade{background-color:var(--blue-green-shade)}
.color-green{background-color:var(--green)}               .color-green-light{background-color:var(--green-light)}               .color-green-shade{background-color:var(--green-shade)}
.color-yellow-green{background-color:var(--yellow-green)} .color-yellow-green-light{background-color:var(--yellow-green-light)} .color-yellow-green-shade{background-color:var(--yellow-green-shade)}
.color-yellow{background-color:var(--yellow)}             .color-yellow-light{background-color:var(--yellow-light)}             .color-yellow-shade{background-color:var(--yellow-shade)}
.color-yellow-orange{background-color:var(--yellow-orange)} .color-yellow-orange-light{background-color:var(--yellow-orange-light)} .color-yellow-orange-shade{background-color:var(--yellow-orange-shade)}
.color-orange{background-color:var(--orange)}             .color-orange-light{background-color:var(--orange-light)}             .color-orange-shade{background-color:var(--orange-shade)}
.color-red-orange{background-color:var(--red-orange)}     .color-red-orange-light{background-color:var(--red-orange-light)}     .color-red-orange-shade{background-color:var(--red-orange-shade)}
.color-red{background-color:var(--red)}                   .color-red-light{background-color:var(--red-light)}                   .color-red-shade{background-color:var(--red-shade)}
.color-red-violet{background-color:var(--red-violet)}     .color-red-violet-light{background-color:var(--red-violet-light)}     .color-red-violet-shade{background-color:var(--red-violet-shade)}
.color-violet{background-color:var(--violet)}             .color-violet-light{background-color:var(--violet-light)}             .color-violet-shade{background-color:var(--violet-shade)}
.color-indigo{background-color:var(--indigo)}             .color-indigo-light{background-color:var(--indigo-light)}             .color-indigo-shade{background-color:var(--indigo-shade)}
.color-rowad{background-color:var(--rowad)}               .color-light-grey{background-color:var(--light-grey)}

/* ---------- TEXT ---------- */
.text-blue{color:var(--blue)}                 .text-blue-shade{color:var(--blue-shade)}
.text-blue-green{color:var(--blue-green)}     .text-blue-green-shade{color:var(--blue-green-shade)}
.text-green{color:var(--green)}               .text-green-shade{color:var(--green-shade)}
.text-yellow-green{color:var(--yellow-green)} .text-yellow-green-shade{color:var(--yellow-green-shade)}
.text-yellow{color:var(--yellow)}             .text-yellow-shade{color:var(--yellow-shade)}
.text-yellow-orange{color:var(--yellow-orange)} .text-yellow-orange-shade{color:var(--yellow-orange-shade)}
.text-orange{color:var(--orange)}             .text-orange-shade{color:var(--orange-shade)}
.text-red-orange{color:var(--red-orange)}     .text-red-orange-shade{color:var(--red-orange-shade)}
.text-red{color:var(--red)}                   .text-red-shade{color:var(--red-shade)}
.text-red-violet{color:var(--red-violet)}     .text-red-violet-shade{color:var(--red-violet-shade)}
.text-violet{color:var(--violet)}             .text-violet-shade{color:var(--violet-shade)}
.text-indigo{color:var(--indigo)}             .text-indigo-shade{color:var(--indigo-shade)}
.text-rowad{color:var(--rowad)}

/* ---------- BORDER (base) ---------- */
.border-blue{border-color:var(--blue)} .border-blue-green{border-color:var(--blue-green)} .border-green{border-color:var(--green)}
.border-yellow-green{border-color:var(--yellow-green)} .border-yellow{border-color:var(--yellow)} .border-yellow-orange{border-color:var(--yellow-orange)}
.border-orange{border-color:var(--orange)} .border-red-orange{border-color:var(--red-orange)} .border-red{border-color:var(--red)}
.border-red-violet{border-color:var(--red-violet)} .border-violet{border-color:var(--violet)} .border-indigo{border-color:var(--indigo)}
.border-rowad{border-color:var(--rowad)}