/* ============================================================
   UNIFIED WORKSPACE — CSS VARIABLES
   Primary: #198D87 (Teal) | Background: #FFFFFF
   Edit this file to retheme the entire application.
   ============================================================ */

:root {
  /* ── Primary Teal ───────────────────────────────────────── */
  --color-primary:         #198D87;
  --color-primary-dark:    #147A75;
  --color-primary-darker:  #0E5C59;
  --color-primary-light:   #1FA89F;
  --color-primary-lighter: #4DC5BE;
  --color-primary-faint:   #E4F5F4;
  --color-primary-rgb:     25, 141, 135;

  /* ── Secondary ──────────────────────────────────────────── */
  --color-secondary:       #2C3E50;
  --color-secondary-light: #3D5166;

  /* ── Backgrounds & Surfaces ─────────────────────────────── */
  --color-bg:              #FFFFFF;
  --color-surface:         #F5FAFA;
  --color-surface-alt:     #EEF7F7;
  --color-card:            #FFFFFF;

  /* ── Borders ─────────────────────────────────────────────── */
  --color-border:          #D6EEEC;
  --color-border-light:    #EDF6F5;

  /* ── Text ────────────────────────────────────────────────── */
  --color-text:            #1A2E2D;
  --color-text-muted:      #5A8280;
  --color-text-light:      #8AABAA;

  /* ── Status Colors ───────────────────────────────────────── */
  --color-success:         #1A9E6A;
  --color-success-light:   #E4F7EF;
  --color-warning:         #E6A817;
  --color-warning-light:   #FEF6E1;
  --color-danger:          #DC3545;
  --color-danger-light:    #FDE8EA;
  --color-info:            #0D7BB5;
  --color-info-light:      #E1F0F9;

  /* ── System Source Colors ────────────────────────────────── */
  --color-sys-hr:          #0d6efd;
  --color-sys-accounting:  #198754;
  --color-sys-crm:         #6f42c1;
  --color-sys-warehouse:   #fd7e14;
  --color-sys-it:          #198D87;
  --color-sys-manual:      #6c757d;

  /* ── Sidebar ─────────────────────────────────────────────── */
  --sidebar-width:         255px;
  --sidebar-bg:            var(--color-primary);
  --sidebar-text:          rgba(255,255,255,0.88);
  --sidebar-text-muted:    rgba(255,255,255,0.5);
  --sidebar-hover-bg:      rgba(255,255,255,0.12);
  --sidebar-active-bg:     rgba(255,255,255,0.2);
  --sidebar-border:        rgba(255,255,255,0.14);

  /* ── Topbar ──────────────────────────────────────────────── */
  --topbar-height:         62px;
  --topbar-bg:             #FFFFFF;
  --topbar-border:         var(--color-border);

  /* ── Spacing ─────────────────────────────────────────────── */
  --content-padding:       28px;

  /* ── Shadows ─────────────────────────────────────────────── */
  --shadow-sm:             0 1px 4px rgba(25,141,135,0.08);
  --shadow-md:             0 4px 16px rgba(25,141,135,0.12);
  --shadow-lg:             0 8px 32px rgba(25,141,135,0.15);

  /* ── Border Radius ───────────────────────────────────────── */
  --radius-sm:             6px;
  --radius-md:             10px;
  --radius-lg:             16px;
  --radius-xl:             24px;

  /* ── Typography ──────────────────────────────────────────── */
  --font-family:           'Segoe UI', system-ui, -apple-system, sans-serif;
  --font-size-xs:          11px;
  --font-size-sm:          13px;
  --font-size-base:        14px;
  --font-size-md:          15px;
  --font-size-lg:          18px;
  --font-size-xl:          22px;
  --font-size-2xl:         28px;
}