/* ============================================================
   COLORS — Relume Prompt
   Base palette + semantic aliases.
   The product UI is essentially monochrome (near-black on white);
   the four chromatic palettes exist as a system but are reserved
   for accents/illustration. Color in the product comes from photography.
   ============================================================ */

:root {
  /* ---- Neutral (UI greys). shade-0 = darkest → shade-7 = white ---- */
  --color-neutral-shade-0: #ffffff;   /* alias for white in source */
  --color-neutral-lightest: #f2f2f2;  /* shade-1 */
  --color-neutral-lighter:  #d9d9da;  /* shade-2 */
  --color-neutral-light:    #b4b3b6;  /* shade-3 */
  --color-neutral:          #828185;  /* shade-4 */
  --color-neutral-dark:     #504e54;  /* shade-5 */
  --color-neutral-darker:   #1e1c24;  /* shade-6 */
  --color-neutral-darkest:  #06030c;  /* shade-7 — the brand near-black */
  --color-white:            #ffffff;

  /* ---- Woodsmoke (button / ink black) ---- */
  --color-woodsmoke-lightest: #e6e6e6;
  --color-woodsmoke-lighter:  #cecece;
  --color-woodsmoke-light:    #545555;
  --color-woodsmoke:          #0c0d0d;  /* primary button fill */
  --color-woodsmoke-dark:     #090a0a;  /* button hover */
  --color-woodsmoke-darker:   #040505;
  --color-woodsmoke-darkest:  #030303;

  /* ---- Neon Carrot (warm accent — orange) ---- */
  --color-neon-carrot-lightest: #fff4eb;
  --color-neon-carrot-lighter:  #ffead8;
  --color-neon-carrot-light:    #ffb876;
  --color-neon-carrot:          #ff9a3c;
  --color-neon-carrot-dark:     #cc7b30;
  --color-neon-carrot-darker:   #663d18;
  --color-neon-carrot-darkest:  #4c2e12;

  /* ---- Caribbean Green (teal accent) ---- */
  --color-caribbean-green-lightest: #e5f8f6;
  --color-caribbean-green-lighter:  #ccf2ed;
  --color-caribbean-green-light:    #4cd4c2;
  --color-caribbean-green:          #00c2a8;
  --color-caribbean-green-dark:     #009b86;
  --color-caribbean-green-darker:   #004d43;
  --color-caribbean-green-darkest:  #003a32;

  /* ---- Electric Violet (accent — purple) ---- */
  --color-electric-violet-lightest: #f1ebfd;
  --color-electric-violet-lighter:  #e4d7fb;
  --color-electric-violet-light:    #a375f2;
  --color-electric-violet:          #7c3aed;
  --color-electric-violet-dark:     #632ebd;
  --color-electric-violet-darker:   #31175e;
  --color-electric-violet-darkest:  #251147;

  /* ---- Transparency steps over near-black (for borders/overlays on light) ---- */
  --color-ink-5:  rgba(6, 3, 12, 0.05);
  --color-ink-10: rgba(6, 3, 12, 0.10);
  --color-ink-15: rgba(6, 3, 12, 0.15);
  --color-ink-20: rgba(6, 3, 12, 0.20);
  --color-ink-30: rgba(6, 3, 12, 0.30);
  --color-ink-50: rgba(6, 3, 12, 0.50);
  --color-ink-60: rgba(6, 3, 12, 0.60);

  /* ---- Transparency steps over white (for borders/overlays on dark) ---- */
  --color-white-5:  rgba(255, 255, 255, 0.05);
  --color-white-10: rgba(255, 255, 255, 0.10);
  --color-white-15: rgba(255, 255, 255, 0.15);
  --color-white-20: rgba(255, 255, 255, 0.20);
  --color-white-30: rgba(255, 255, 255, 0.30);
  --color-white-50: rgba(255, 255, 255, 0.50);
  --color-white-60: rgba(255, 255, 255, 0.60);
}