/* PowerRental Wiki — Premium SaaS aesthetic.
   Cleaner, calmer, professional. PowerRental-oranje als sparingly accent. */

:root {
  /* Surfaces — pure white met zachte cool-gray ondergrond */
  --bg:             #F7F8FA;
  --surface:        #FFFFFF;
  --surface-2:      #F1F3F5;
  --surface-3:      #E9ECEF;
  --surface-deep:   #DEE2E6;

  /* Tekst */
  --text:           #111827;
  --text-2:         #374151;
  --text-muted:     #6B7280;
  --text-faint:     #9CA3AF;

  /* Borders — heel subtiel */
  --border:         #E5E7EB;
  --border-strong:  #D1D5DB;

  /* Accent (PowerRental brand) — gebruik spaarzaam */
  --accent:         #E5481D;
  --accent-deep:    #B0360F;
  --accent-soft:    #FFF1ED;
  --accent-text:    #FFFFFF;

  /* Status */
  --success:        #16A34A;
  --warn:           #F59E0B;
  --danger:         #DC2626;
  --info:           #2563EB;

  /* Spacing — 4..64 (unchanged) */
  --s-1: 4px; --s-2: 8px; --s-3: 12px; --s-4: 16px;
  --s-5: 20px; --s-6: 24px; --s-8: 32px; --s-10: 48px; --s-12: 64px;

  /* Radii — modern, niet te rond */
  --r-1: 6px;
  --r-2: 10px;
  --r-3: 14px;

  /* Shadows — soft drop, multi-layer voor depth */
  --shadow-xs:  0 1px 2px rgba(17, 24, 39, .04);
  --shadow-sm:  0 1px 2px rgba(17, 24, 39, .06), 0 1px 3px rgba(17, 24, 39, .04);
  --shadow:     0 1px 3px rgba(17, 24, 39, .08), 0 4px 12px rgba(17, 24, 39, .04);
  --shadow-lg:  0 4px 16px rgba(17, 24, 39, .08), 0 16px 32px rgba(17, 24, 39, .06);
  --shadow-focus: 0 0 0 3px rgba(229, 72, 29, .18);

  /* Typografie */
  --font-display: "Bricolage Grotesque", "Manrope", "Inter Tight", system-ui, sans-serif;
  --font-body:    "Bricolage Grotesque", "Manrope", "Inter Tight", system-ui, sans-serif;
  --font-mono:    "JetBrains Mono", ui-monospace, "SF Mono", Consolas, monospace;

  --track-loose:  .08em;
  --track-tight:  -.02em;

  /* Aliases voor backward-compat met bestaande class-namen */
  --paper:          var(--bg);
  --paper-elev:     var(--surface);
  --paper-shade:    var(--surface-2);
  --paper-deep:     var(--surface-deep);
  --ink:            var(--text);
  --ink-2:          var(--text-2);
  --ink-muted:      var(--text-muted);
  --ink-faint:      var(--text-faint);
  --rule:           var(--border);
  --rule-strong:    var(--border-strong);
  --signal:         var(--accent);
  --signal-deep:    var(--accent-deep);
  --shadow-card:       var(--shadow);
  --shadow-card-hover: var(--shadow-lg);
  --shadow-soft:    var(--shadow-xs);
  --bg-elev:        var(--surface);
  --bg-elev-2:      var(--surface-2);
  --text-secondary: var(--text-2);
  --border-color:   var(--border);
  --accent-hover:   var(--accent-deep);
  --radius-sm:      var(--r-1);
  --radius:         var(--r-2);
  --radius-lg:      var(--r-3);
  --space-1: var(--s-1); --space-2: var(--s-2); --space-3: var(--s-3);
  --space-4: var(--s-4); --space-6: var(--s-6); --space-8: var(--s-8);
  --font:           var(--font-body);
  --blueprint:      var(--info);
  --safety:         var(--warn);
  --green-ok:       var(--success);
}
