/* PAW Color System - Company Brand Colors */
:root {
  /* Primary Brand Colors */
  --paw-primary: #78a18a;        /* Dark green - main brand color */
  --paw-secondary: #dbe7c7;      /* Light green - secondary brand color */
  --paw-accent: #2c3e50;         /* Dark blue - accent color */
  --paw-light: #f8f9fa;          /* Clean white */
  --paw-dark: #1a252f;           /* Deep charcoal */
  
  /* Derived Colors */
  --paw-primary-dark: #6b8f7c;   /* Darker shade of primary */
  --paw-primary-light: #85ae97;  /* Lighter shade of primary */
  --paw-secondary-dark: #c9d9b0; /* Darker shade of secondary */
  --paw-secondary-light: #e8f0d8; /* Lighter shade of secondary */
  
  /* Text Colors */
  --paw-text: #212529;
  --paw-text-light: #6c757d;
  --paw-text-muted: #adb5bd;
  --paw-text-inverse: #ffffff;
  --paw-text-on-primary: #ffffff;
  --paw-text-on-secondary: #2c3e50;
  
  /* Background Colors */
  --paw-bg: #ffffff;
  --paw-bg-alt: #f8f9fa;
  --paw-bg-muted: #f1f5ec;
  --paw-bg-dark: #2c3e50;
  --paw-bg-primary: #78a18a;
  --paw-bg-secondary: #dbe7c7;
  
  /* Border Colors */
  --paw-border: #e9ecef;
  --paw-border-light: #f1f5ec;
  --paw-border-dark: #cbd5e0;
  --paw-border-primary: #78a18a;
  
  /* Status Colors */
  --paw-success: #68d391;
  --paw-warning: #f6ad55;
  --paw-error: #fc8181;
  --paw-info: #63b3ed;
  
  /* Shadows */
  --paw-shadow-sm: 0 1px 3px rgba(120, 161, 138, 0.1);
  --paw-shadow-md: 0 4px 6px rgba(120, 161, 138, 0.1);
  --paw-shadow-lg: 0 10px 25px rgba(120, 161, 138, 0.15);
  --paw-shadow-xl: 0 20px 25px rgba(120, 161, 138, 0.2);
  
  /* Border Radius */
  --paw-radius-sm: 0.375rem;
  --paw-radius-md: 0.5rem;
  --paw-radius-lg: 0.75rem;
  --paw-radius-xl: 1rem;
}

/* Bootstrap Color Overrides */
.btn-primary {
  background-color: var(--paw-primary) !important;
  border-color: var(--paw-primary) !important;
}

.btn-primary:hover {
  background-color: var(--paw-primary-dark) !important;
  border-color: var(--paw-primary-dark) !important;
}

.btn-secondary {
  background-color: var(--paw-secondary) !important;
  border-color: var(--paw-secondary) !important;
  color: var(--paw-text) !important;
}

.btn-secondary:hover {
  background-color: var(--paw-secondary-dark) !important;
  border-color: var(--paw-secondary-dark) !important;
}

.navbar-brand {
  color: var(--paw-text-on-primary) !important;
}

.bg-primary {
  background-color: var(--paw-primary) !important;
}

.bg-secondary {
  background-color: var(--paw-secondary) !important;
}

.text-primary {
  color: var(--paw-primary) !important;
}

.border-primary {
  border-color: var(--paw-primary) !important;
}