/* Saasto — Color tokens
   Sampled from the Saasto SaaS/App web template (3 home variants: Violet, Coral, Green).
   Violet is the primary brand; Coral and Green are alternate accent themes. */
:root {
  /* ---- Brand: Violet (primary) ---- */
  --violet-50:  #F2EFFF;
  --violet-100: #E6E0FF;
  --violet-200: #CFC6FF;
  --violet-300: #B3A5FE;
  --violet-400: #9C8AFD;
  --violet-500: #8876FC; /* primary */
  --violet-600: #6E56F0;
  --violet-700: #5A43D6;
  --violet-800: #4832AE;

  /* ---- Accent theme: Coral ---- */
  --coral-50:  #FFF3EF;
  --coral-100: #FFE0D7;
  --coral-200: #FFC3B4;
  --coral-300: #FF9F91;
  --coral-400: #FF7A68;
  --coral-500: #FF553E; /* coral primary */
  --coral-600: #F03E27;
  --coral-700: #CE2F1B;

  /* ---- Accent theme: Green ---- */
  --green-50:  #E9F9EF;
  --green-100: #D3F2DE;
  --green-200: #A9E5BF;
  --green-300: #7ECE9A;
  --green-400: #6BC98A;
  --green-500: #5CC17F; /* green primary */
  --green-600: #43A867;
  --green-700: #348A52;

  /* ---- Ink / Navy neutrals (headings, text) ---- */
  --ink-950: #150C33;
  --ink-900: #1B1240; /* primary heading color */
  --ink-800: #2A2150;
  --ink-700: #332B5A;
  --slate-600: #55536B;
  --slate-500: #6B6980; /* body text */
  --slate-400: #9A98AE; /* muted text */
  --slate-300: #C4C3D2;

  /* ---- Surface neutrals ---- */
  --white:       #FFFFFF;
  --neutral-50:  #F8F8FC;
  --neutral-100: #F3F3F8;
  --neutral-200: #ECECF3;
  --neutral-300: #E1E1EC;

  /* ---- Pastel tints (icon tiles, soft badges) ---- */
  --tint-lavender: #EFDAFC;
  --tint-amber:    #FFEDC0;
  --tint-mint:     #D1FAEC;
  --tint-coral:    #FFE0D7;
  --tint-sky:      #E4F0FF;
  --tint-pink:     #FFE0EE;

  /* ---- Feedback ---- */
  --success: #34C77B;
  --success-tint: #E5F8EE;
  --warning: #F5B33F;
  --danger:  #F0483E;
  --danger-tint: #FDE9E7;
  --info:    #4B8DFF;

  /* ---- Semantic aliases (default = Violet theme) ---- */
  --brand:          var(--violet-500);
  --brand-strong:   var(--violet-600);
  --brand-soft:     var(--violet-50);
  --on-brand:       var(--white);

  --text-strong: var(--ink-900);
  --text-body:   var(--slate-500);
  --text-muted:  var(--slate-400);
  --text-on-dark: var(--white);
  --text-link:   var(--violet-600);

  --surface:        var(--white);
  --surface-alt:    var(--neutral-50);
  --surface-card:   var(--white);
  --surface-cream:  #FFF8F2;   /* coral-theme page background */
  --surface-inverse: var(--ink-900);

  --border:      var(--neutral-200);
  --border-strong: var(--neutral-300);
}

/* ---- Theme scopes: retint the semantic brand aliases ---- */
[data-theme="coral"] {
  --brand:        var(--coral-500);
  --brand-strong: var(--coral-600);
  --brand-soft:   var(--coral-50);
  --text-link:    var(--coral-600);
}
[data-theme="green"] {
  --brand:        var(--green-500);
  --brand-strong: var(--green-600);
  --brand-soft:   var(--green-50);
  --text-link:    var(--green-600);
}