/*
 * Naabrent design tokens -- "Naaber garden" refresh (docs/design/visual-refresh.md).
 * Light theme only in v1; structured so a dark theme can be added later
 * without touching component code (ADR-0004). Every foreground/background
 * pairing is WCAG AA verified in visual-refresh.md.
 */

:root {
  /* ---- Brand: green ---- */
  --color-primary:        #2E7D4E;
  --color-primary-hover:  #276A43;
  --color-primary-active: #1E5636;
  --color-primary-ink:    #1B4E31;
  --color-primary-strong: #0E3D25;   /* nav band */
  --color-primary-50:     #E9F4EC;
  --color-primary-100:    #C7E6D1;

  /* ---- Secondary: terracotta ---- */
  --color-secondary:       #B0522E;
  --color-secondary-hover: #983F24;
  --color-secondary-ink:   #8F3E22;
  --color-secondary-50:    #FBEEE7;
  --color-secondary-100:   #F2D3C4;

  /* ---- Amber (ratings / verified only) ---- */
  --color-accent:     #C4841B;   /* alias kept for existing CSS */
  --color-amber:      #C4841B;   /* star / check glyphs (UI/large) */
  --color-amber-ink:  #8A5A0F;   /* small amber text */
  --color-accent-50:  #FBF0D9;   /* alias */
  --color-amber-50:   #FBF0D9;

  /* ---- Surfaces ---- */
  --surface-page:   #F6F4EC;
  --surface-card:   #FFFFFF;
  --surface-raised: #FFFFFF;
  --surface-sunken: #EFEBDF;
  --surface-muted:  #F1EFE6;

  /* ---- Text ---- */
  --text-primary:    #212B24;
  --text-secondary:  #4F5A51;
  --text-muted:      #66716A;
  --text-on-primary: #FFFFFF;

  /* ---- Lines & focus ---- */
  --border:        #E4E0D3;
  --border-strong: #CFC9BA;
  --focus-ring:    #1E5636;

  /* ---- Semantic ---- */
  --success:     #1E7A45;  --success-ink: #155C33;  --success-50: #E7F4EC;
  --warning:     #B4740E;  --warning-ink: #7E5108;  --warning-50: #FBF0D9;
  --danger:      #B23B2E;  --danger-ink:  #8E2C21;  --danger-50:  #F8E5E2;
  --info:        #1F6F8B;  --info-ink:    #155268;  --info-50:    #E3F0F4;

  /* ---- Type scale ---- */
  --font-sans: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue",
               Arial, "Noto Sans", sans-serif;
  --fs-xs: 12px; --fs-sm: 14px; --fs-base: 16px;
  --fs-lg: 18px; --fs-xl: 22px; --fs-2xl: 28px; --fs-3xl: 36px;
  --measure: 66ch;

  /* ---- Spacing ---- */
  --space-1: 4px;  --space-2: 8px;  --space-3: 12px; --space-4: 16px;
  --space-5: 24px; --space-6: 32px; --space-7: 48px; --space-8: 64px;

  /* ---- Radius ---- */
  --radius-control: 10px;
  --radius-card:    16px;
  --radius-pill:    999px;

  /* ---- Elevation ---- */
  --shadow-sm: 0 1px 2px rgba(20,40,28,0.06), 0 1px 1px rgba(20,40,28,0.04);
  --shadow-md: 0 2px 4px rgba(20,40,28,0.07), 0 4px 12px rgba(20,40,28,0.06);
  --shadow-lg: 0 8px 24px rgba(20,40,28,0.12);
  --shadow-card: var(--shadow-sm);  /* alias kept for existing CSS */

  /* ---- Pico theme mapping (class-light, ADR-0004) ---- */
  --pico-primary:                 var(--color-primary);
  --pico-primary-background:      var(--color-primary);
  --pico-primary-hover:           var(--color-primary-hover);
  --pico-primary-hover-background:var(--color-primary-hover);
  --pico-primary-underline:       var(--color-primary);
  --pico-primary-focus:           rgba(30,86,54,0.35);
  --pico-secondary:               var(--color-secondary);
  --pico-secondary-background:    var(--color-secondary);
  --pico-secondary-hover:         var(--color-secondary-hover);
  --pico-background-color:        var(--surface-page);
  --pico-color:                   var(--text-primary);
  --pico-h1-color:                var(--text-primary);
  --pico-h2-color:                var(--text-primary);
  --pico-h3-color:                var(--text-primary);
  --pico-muted-color:             var(--text-muted);
  --pico-muted-border-color:      var(--border);
  --pico-card-background-color:   var(--surface-card);
  --pico-card-border-color:       var(--border);
  --pico-card-box-shadow:         var(--shadow-sm);
  --pico-border-radius:           var(--radius-control);
  --pico-font-family:             var(--font-sans);
  --pico-font-size:               var(--fs-base);
  --pico-form-element-focus-color:rgba(30,86,54,0.35);
}
