:root {
  /* SafeNod blue scale */
  --sn-blue-50:  #E8EEFD;
  --sn-blue-100: #D1DEFA;
  --sn-blue-200: #A2BDF6;
  --sn-blue-300: #749BF1;
  --sn-blue-400: #457AED;
  --sn-blue-500: #1759E8;
  --sn-blue-600: #1247BA;
  --sn-blue-700: #0E358B;
  --sn-blue-800: #09245D;
  --sn-blue-900: #05122E;
  --sn-blue-950: #030C20;
  color-scheme: light;
  
  --blue:           #1247BA;   /* primary action color */
  --blue-hover:     #0E358B;   /* darker on hover */
  --primary-light:  #457AED;   /* medium brand — borders, accents */
  --primary-dark:   #0E358B;   /* deeper brand — text, emphasis */
  --accent-steel:   #E8EEFD;   /* very light blue tint for badges */

  
  --bg:             #ffffff;
  --bg2:            #f9f8ff;   /* subtle lavender-white secondary bg */
  --bg-soft:        #f3f4fb;   /* sidebar, left panels */
  --bg-hover:       #E8EEFD;   /* hover overlay bg */
  --btn-bg:         #f5f6fc;   /* button/input resting bg */
  --hover:          #EBECF0;   /* row/item hover — SafeNod neutral grey */
  --input-bg:       #f9f8ff;   /* form input bg */

  
  --header-bg:      #1247BA;   /* top bar — uses main brand dark */
  --sn-gradient:    linear-gradient(90deg, #09245D 0%, #1247BA 50%, #457AED 100%);

  
  --border:         #d8dcf0;   /* general borders — cool blue-grey */

  
  --text:           #05122E;   /* primary text — deep navy */
  --text2:          #4a5080;   /* secondary text */
  --text3:          #8890b5;   /* tertiary / muted */
  --text-muted:     #a9aecf;   /* placeholder / disabled */

  
  --info-bg:        #E8EEFD;   /* light info chip bg */

  
  --status-open-bg:     #f4f5f7;
  --status-open-border: #dfe1e6;
  --status-open-text:   #42526e;
  --status-open-dot:    #6b778c;

  
  --status-progress-bg:     #fffbeb;
  --status-progress-border: #fcd34d;
  --status-progress-text:   #d97706;
  --status-progress-dot:    #f59e0b;

  
  --status-closed-bg:     #f0fdf4;
  --status-closed-border: #86efac;
  --status-closed-text:   #16a34a;
  --status-closed-dot:    #22c55e;

  
  --status-overdue-bg:   #fff8e6;
  --status-overdue-text: #974f0c;
  --status-overdue-dot:  #f59e0b;

  
  --status-total-dot:    #457AED;

  
  --danger-bg:    #fff0f0;
  --danger-text:  #de350b;

  
  --warning-bg:   #fffae6;
  --warning-text: #ffab00;

  
  --success-text: #006644;
  --success-dark: #00875a;
}

[data-theme="dark"] {
  color-scheme: dark;
  
  --blue:           #749BF1;   /* lighter for dark bg readability */
  --blue-hover:     #A2BDF6;
  --primary-light:  #457AED;
  --primary-dark:   #A2BDF6;
  --accent-steel:   rgba(18, 71, 186,0.18);

  
  --bg:             #030C20;
  --bg2:            #05122E;
  --bg-soft:        #05122E;
  --bg-hover:       #09245D;
  --btn-bg:         #05122E;
  --hover:          #09245D;
  --input-bg:       #05122E;

  
  --header-bg:      #05122E;

  
  --border:         #0E358B;

  
  --text:           #E8EEFD;
  --text2:          #b0b8dc;
  --text3:          #7880a8;
  --text-muted:     #555d85;

  
  --info-bg:        rgba(18, 71, 186,0.12);

  
  --status-open-bg:     rgba(255,255,255,0.06);
  --status-open-border: rgba(255,255,255,0.12);
  --status-open-text:   #b0b8dc;
  --status-open-dot:    #7880a8;

  
  --status-progress-bg:     rgba(245,158,11,0.15);
  --status-progress-border: rgba(252,211,77,0.35);
  --status-progress-text:   #fbbf24;
  --status-progress-dot:    #f59e0b;

  
  --status-closed-bg:     rgba(22,163,74,0.15);
  --status-closed-border: rgba(134,239,172,0.35);
  --status-closed-text:   #4ade80;
  --status-closed-dot:    #22c55e;

  
  --status-overdue-bg:   rgba(255,248,230,0.07);
  --status-overdue-text: #f59e0b;
  --status-overdue-dot:  #f59e0b;

  
  --status-total-dot:    #1247BA;

  
  --danger-bg:    rgba(222,53,11,0.15);
  --danger-text:  #ff6b4a;

  
  --warning-bg:   rgba(255,171,0,0.1);
  --warning-text: #ffab00;

  
  --success-text: #57d9a3;
  --success-dark: #00c77a;
}

:root {
    --chart-1: #1247BA;   /* primary blue */
    --chart-2: #1f845a;   /* success green */
    --chart-3: #ff7452;   /* warning orange-red */
    --chart-4: #8270db;   /* purple */
    --chart-5: #f59e0b;   /* amber */
    --chart-6: #00b8d9;   /* cyan */
    --chart-7: #57d9a3;   /* mint */
    --chart-8: #ff8b00;   /* orange */
}
[data-theme="dark"] {
    --chart-1: #457AED;
    --chart-2: #57d9a3;
    --chart-3: #ff7452;
    --chart-4: #998dd9;
    --chart-5: #ffc400;
    --chart-6: #00c7e6;
    --chart-7: #79f2c0;
    --chart-8: #ffb547;
}