/*
  theme.css
  BuildingIQ – Theme configuration.

  Warm Institutional palette: sandstone surfaces, walnut darks, steel-blue accents.
  Inspired by the physical warmth of NYC brownstone and the authority of municipal
  records. Edit values here to retheme BuildingIQ without touching layout or
  component CSS in style.css.

  Sections:
    1. Brand / primary
    2. Text
    3. Backgrounds & surfaces
    4. Borders
    5. Semantic status colors
    6. Site header
    7. Data table headers
    8. Sidebar navigation
    9. Section accent colors
   10. Badge colors
   11. Status indicator colors
   12. Shadows & overlays
   13. Transitions
*/

:root {

  /* ==========================================================================
     1. Brand / primary
     ========================================================================== */

  --color-primary:       #3a6b94;   /* Warm steel blue — institutional, not consumer */
  --color-primary-dark:  #2d5577;   /* Hover / pressed state */
  --color-primary-light: #eef3f7;   /* Tint background — selected rows, highlights */
  --color-focus-ring:    rgba(58, 107, 148, 0.18); /* Input focus glow */


  /* ==========================================================================
     2. Text
     ========================================================================== */

  --color-text:          #2c2622;   /* Warm near-black — walnut ink */
  --color-text-muted:    #7c7267;   /* Warm taupe gray */


  /* ==========================================================================
     3. Backgrounds & surfaces
     ========================================================================== */

  --color-bg:            #faf8f5;   /* Sandstone cream — warm paper */
  --color-bg-alt:        #f0ece7;   /* Warm sand — alternating rows, section bg */
  --color-bg-hover:      #e8e3dc;   /* Warm hover */
  --color-surface:       #fefdfb;   /* Barely warm white — card/panel surface */
  --color-surface-raised:#f5f2ee;   /* Slightly elevated warm surface */

  /* Table row stripe — deeper than bg-alt for visible alternation */
  --color-table-stripe:      #ece7e0;  /* Warm sand stripe — doubled contrast vs bg */

  /* Nested / subtable stripe — cooler tint to distinguish from parent rows */
  --color-subtable-row:      #f7f5f2;  /* Warm off-white — subtable odd rows */
  --color-subtable-row-alt:  #edeae5;  /* Slightly deeper sand — subtable even rows */


  /* ==========================================================================
     4. Borders
     ========================================================================== */

  --color-border:        #d4cfc8;   /* Warm sand border */
  --color-border-strong: #b8b0a6;   /* Emphasized dividers */


  /* ==========================================================================
     5. Semantic status colors
     ========================================================================== */

  --color-success:       #3a7d52;   /* Muted forest green — compliant */
  --color-warning:       #b07d2a;   /* Warm amber — caution */
  --color-danger:        #b83c3c;   /* Warm brick red — violation / penalty */
  --color-danger-light:  #fdf0ee;   /* Warm danger row highlight */


  /* ==========================================================================
     6. Site header
     ========================================================================== */

  --color-header-bg:          #2c2622;  /* Dark walnut — warm authority */
  --color-header-text:        #faf8f5;  /* Cream on walnut */
  --color-header-text-muted:  rgba(250, 248, 245, 0.65); /* Tagline / secondary header text */
  --color-header-border:      #3d3530;  /* Header bottom rule */


  /* ==========================================================================
     7. Data table headers
     ========================================================================== */

  --color-table-header-top:   #352f2a;  /* Slightly lighter walnut for thead */
  --color-table-header-hover: #443d37;  /* Sortable column header hover */


  /* ==========================================================================
     8. Sidebar navigation
     ========================================================================== */

  --sidebar-bg:            #f3f0eb;  /* Warm sand */
  --sidebar-border:        #e0dbd4;  /* Warm border */
  --sidebar-active-bg:     #e4eff7;  /* Steel-blue tint for active state */
  --sidebar-active-text:   #2d5577;  /* Dark steel blue */
  --sidebar-active-border: #3a6b94;  /* Primary steel blue */


  /* ==========================================================================
     9. Section accent colors  (left-border stripe per data section)
     ========================================================================== */

  --color-accent-tax:        #3a6b94;  /* Steel blue — matches primary */
  --color-accent-ll97:       #6d50a3;  /* Muted plum */
  --color-accent-dob:        #b07d2a;  /* Warm amber / brownstone gold */
  --color-accent-violations: #b83c3c;  /* Warm brick red */
  --color-accent-safety:     #2a7f8e;  /* Warm teal */
  --color-accent-311:        #3a7d52;  /* Forest green */
  --color-accent-hpd:        #8b5fa3;  /* Warm purple */
  --color-accent-acris:      #3a6b94;  /* Steel blue */
  --color-accent-landmark:   #8b6914;  /* Aged brass */
  --color-accent-entity:     #6b6560;  /* Warm graphite — corporate / legal */


  /* ==========================================================================
     9b. Category accent colors  (sidebar nav groups + content category headers)
     ========================================================================== */

  --color-cat-overview:      #6b6560;  /* Warm graphite — overview / identity */
  --color-cat-finance:       #3a6b94;  /* Steel blue — taxes / sales / mortgages */
  --color-cat-construction:  #b07d2a;  /* Brownstone gold — DOB / construction */
  --color-cat-housing:       #8b5fa3;  /* Warm purple — HPD / complaints */
  --color-cat-compliance:    #2a7f8e;  /* Warm teal — compliance / safety */

  /* Nav group header background */
  --nav-group-header-bg:     #eae6e0;  /* Warm sand, slightly darker than sidebar */


  /* ==========================================================================
     10. Badge colors
     ========================================================================== */

  /* Default / neutral */
  --badge-default-bg:    #e8e3dc;
  --badge-default-text:  #4a4440;

  /* Open / pending / in-progress */
  --badge-open-bg:       #faf0d4;
  --badge-open-text:     #7a5a10;

  /* Closed / resolved / compliant */
  --badge-closed-bg:     #d6efe0;
  --badge-closed-text:   #1a5c38;

  /* Violation / error / overdue */
  --badge-violation-bg:  #f8e0de;
  --badge-violation-text:#7a2020;

  /* Resolve — alias of closed */
  --badge-resolve-bg:    var(--badge-closed-bg);
  --badge-resolve-text:  var(--badge-closed-text);

  /* Active / approved */
  --badge-active-bg:     #dce9f4;
  --badge-active-text:   #2d5577;

  /* Muted (permit status fallback) */
  --badge-muted-bg:      var(--badge-default-bg);
  --badge-muted-text:    var(--badge-default-text);

  /* HPD violation class A — non-hazardous */
  --badge-class-a-bg:    #f7f0d0;
  --badge-class-a-text:  #6b5010;

  /* HPD violation class B — hazardous (same amber family as open/pending) */
  --badge-class-b-bg:    var(--badge-open-bg);
  --badge-class-b-text:  var(--badge-open-text);

  /* Needs attention (amber/caution) */
  --badge-attention-bg:  #faf0d4;
  --badge-attention-text:#7a5a10;

  /* Landmark designation */
  --badge-landmark-bg:   #f5edd0;
  --badge-landmark-text: #6b5010;


  /* ==========================================================================
     11. Status indicator colors  (mortgage / unit status chips)
     ========================================================================== */

  --status-active-bg:    #faf0d4;   /* Active / outstanding */
  --status-active-text:  #7a5a10;

  --status-paid-bg:      #d6efe0;   /* Paid / satisfied */
  --status-paid-text:    #1a5c38;


  /* ==========================================================================
     12. Shadows & overlays
     ========================================================================== */

  --shadow-sm:              0 1px 2px rgba(44, 38, 34, 0.05);
  --shadow-md:              0 2px 6px rgba(44, 38, 34, 0.08);
  --shadow-card:            0 1px 3px rgba(44, 38, 34, 0.06);
  --shadow-card-hover:      0 2px 8px rgba(44, 38, 34, 0.10);
  --shadow-modal:           0 8px 32px rgba(44, 38, 34, 0.20);
  --color-modal-backdrop:   rgba(44, 38, 34, 0.50);


  /* ==========================================================================
     13. Transitions
     ========================================================================== */

  --transition: 150ms ease;

}