/* ==========================================================================
   Administratie Start — Color tokens
   Brand gold (#D6AF36, from the hexagon mark) as accent; cool ink/slate
   neutrals for a clean, trustworthy financial UI. Ink drives primary
   actions (accessible); gold carries brand moments & highlights.
   ========================================================================== */
:root {
  /* --- Brand gold ramp --------------------------------------------------- */
  --gold-50:  #FBF8EC;
  --gold-100: #F6EDC6;
  --gold-200: #EDDA92;
  --gold-300: #E2C45C;
  --gold-400: #D6AF36; /* brand mark color */
  --gold-500: #BE9826; /* hover / pressed gold */
  --gold-600: #9A7A1C;
  --gold-700: #6F580F;

  /* --- Ink / slate neutrals (cool) -------------------------------------- */
  --ink-900:  #131A24; /* strongest text, primary buttons */
  --ink-800:  #1E2733;
  --ink-700:  #2C3744;
  --slate-600: #4A5663; /* secondary text */
  --slate-500: #67727F; /* tertiary text */
  --slate-400: #939DA9; /* muted / placeholder / icons */
  --slate-300: #C5CCD3; /* strong border */
  --slate-200: #E2E6EB; /* default border / divider */
  --slate-100: #EEF1F4; /* hover surface / track */
  --slate-50:  #F7F9FB; /* app background */
  --white:     #FFFFFF;

  /* --- Semantic status --------------------------------------------------- */
  --success-600: #0F6B43;
  --success-500: #198F5B; /* paid / akkoord */
  --success-100: #E6F4EC;
  --warning-600: #966314;
  --warning-500: #B97D17; /* openstaand / in behandeling */
  --warning-100: #FBF0D8;
  --danger-600:  #B23636;
  --danger-500:  #CE4A4A; /* te laat / afgekeurd */
  --danger-100:  #FAE8E8;
  --info-600:    #235C9E;
  --info-500:    #2E72BE; /* informatie / concept */
  --info-100:    #E9F1FB;

  /* --- Semantic aliases -------------------------------------------------- */
  --brand:            var(--gold-400);
  --brand-strong:     var(--gold-500);
  --brand-soft:       var(--gold-50);

  --bg-app:           var(--slate-50);
  --surface-card:     var(--white);
  --surface-sunken:   var(--slate-50);
  --surface-hover:    var(--slate-100);
  --surface-inverse:  var(--ink-900);

  --text-strong:      var(--ink-900);
  --text-body:        var(--ink-800);
  --text-secondary:   var(--slate-600);
  --text-muted:       var(--slate-400);
  --text-on-brand:    var(--ink-900);
  --text-on-inverse:  var(--white);
  --text-link:        var(--gold-600);

  --border-default:   var(--slate-200);
  --border-strong:    var(--slate-300);
  --border-focus:     var(--gold-400);

  --action-primary:        var(--ink-900);
  --action-primary-hover:  var(--ink-800);
  --action-primary-press:  var(--ink-700);
}