/* client/assets/styles/theme.css */
/* CSS Variables — white/blue theme with dark mode support */

:root {
  /* Base colors */
  --bg:              #f8f9fa;
  --bg-2:            #ffffff;
  --text:            #212529;
  --text-muted:      #6c757d;
  --card:            #ffffff;
  --border:          #dee2e6;

  /* Primary (blue) */
  --primary:         #0d6efd;
  --primary-hover:   #0b5ed7;
  --primary-contrast:#ffffff;

  /* Table */
  --table-row-hover:    #e9f0ff;
  --table-row-selected: #cfe2ff;
  --table-header-bg:    #e9ecef;
  --table-stripe:       #f8f9fa;

  /* Status badges */
  --badge-draft:       #6c757d;
  --badge-submitted:   #0d6efd;
  --badge-approved:    #198754;
  --badge-rejected:    #dc3545;
  --badge-split:       #0dcaf0;
  --badge-inprogress:  #fd7e14;
  --badge-completed:   #198754;
  --badge-cancelled:   #adb5bd;
  --badge-exception:   #dc3545;

  /* Sidebar / nav */
  --sidebar-bg:      #ffffff;
  --sidebar-border:  #dee2e6;
  --nav-active-bg:   #e7f1ff;
  --nav-active-text: #0d6efd;

  /* Misc */
  --shadow-sm:       0 1px 3px rgba(0,0,0,0.08);
  --shadow-md:       0 4px 12px rgba(0,0,0,0.12);
  --radius:          8px;
  --radius-sm:       4px;
}

/* Dark mode — system preference */
@media (prefers-color-scheme: dark) {
  :root {
    --bg:              #1a1d20;
    --bg-2:            #212529;
    --text:            #e9ecef;
    --text-muted:      #adb5bd;
    --card:            #2b2f33;
    --border:          #3d4248;

    --primary:         #4d94ff;
    --primary-hover:   #3b85f7;
    --primary-contrast:#ffffff;

    --table-row-hover:    #2c3e50;
    --table-row-selected: #1e3a5f;
    --table-header-bg:    #2b2f33;
    --table-stripe:       #242729;

    --sidebar-bg:      #212529;
    --sidebar-border:  #3d4248;
    --nav-active-bg:   #1e3a5f;
    --nav-active-text: #4d94ff;

    --shadow-sm:       0 1px 3px rgba(0,0,0,0.3);
    --shadow-md:       0 4px 12px rgba(0,0,0,0.4);
  }
}

/* Override via data-theme attribute */
[data-theme="dark"] {
  --bg:              #1a1d20;
  --bg-2:            #212529;
  --text:            #e9ecef;
  --text-muted:      #adb5bd;
  --card:            #2b2f33;
  --border:          #3d4248;
  --primary:         #4d94ff;
  --primary-hover:   #3b85f7;
  --primary-contrast:#ffffff;
  --table-row-hover:    #2c3e50;
  --table-row-selected: #1e3a5f;
  --table-header-bg:    #2b2f33;
  --table-stripe:       #242729;
  --sidebar-bg:      #212529;
  --sidebar-border:  #3d4248;
  --nav-active-bg:   #1e3a5f;
  --nav-active-text: #4d94ff;
}

[data-theme="light"] {
  --bg:              #f8f9fa;
  --bg-2:            #ffffff;
  --text:            #212529;
  --text-muted:      #6c757d;
  --card:            #ffffff;
  --border:          #dee2e6;
  --primary:         #0d6efd;
  --primary-hover:   #0b5ed7;
  --primary-contrast:#ffffff;
  --table-row-hover:    #e9f0ff;
  --table-row-selected: #cfe2ff;
  --table-header-bg:    #e9ecef;
  --table-stripe:       #f8f9fa;
  --sidebar-bg:      #ffffff;
  --sidebar-border:  #dee2e6;
  --nav-active-bg:   #e7f1ff;
  --nav-active-text: #0d6efd;
}