@import url('https://fonts.googleapis.com/css2?family=Manrope:wght@400;500;600;700&display=swap');

:root {
  /* Colors */
  --color-primary: #279760;
  --color-primary-dark: #1e7a50;
  --color-primary-light: #4db87e;
  
  /* Primary scale for Tailwind compatibility */
  --color-primary-50: #F3FBF7;
  --color-primary-100: #E7F5EE;
  --color-primary-300: #9FD8BF;
  --color-primary-500: #2EA26A;
  --color-primary-600: #279760;
  --color-primary-700: #1F7A4E;
  --color-primary-800: #176141;
  --color-primary-900: #124F35;

  --color-text-primary: #191E1D;
  --color-text-secondary: #1E2B28;
  --color-text-muted: #6F6F6F;
  --color-text-white: #FFFFFF;

  --color-bg-primary: #FFFFFF;
  --color-bg-secondary: #F6F6F6;
  --color-bg-tertiary: #F5F5F5;

  --color-border-light: #E8E8E8;
  --color-border-medium: #D9D9D9;
  --color-border-muted: #C2BFBF;

  --color-status-online: #279760;
  --color-status-error: #FE5959;
  
  /* Tailwind compatibility classes */
  .bg-primary-600 { background-color: var(--color-primary-600); }
  .bg-primary-700 { background-color: var(--color-primary-700); }
  .bg-primary-500 { background-color: var(--color-primary-500); }
  .bg-primary-100 { background-color: var(--color-primary-100); }
  .bg-primary-50 { background-color: var(--color-primary-50); }
  
  .text-white { color: var(--color-text-white); }
  .text-text-primary { color: var(--color-text-primary); }
  .text-text-secondary { color: var(--color-text-secondary); }
  .text-text-muted { color: var(--color-text-muted); }
  
  .border-border { border-color: var(--color-border-medium); }
  .border-primary-300 { border-color: var(--color-primary-300); }
  
  .hover\:bg-primary-700:hover { background-color: var(--color-primary-700); }
  .hover\:bg-neutral-50:hover { background-color: var(--color-bg-tertiary); }
  .hover\:bg-primary-50:hover { background-color: var(--color-primary-50); }
  .hover\:bg-neutral-100:hover { background-color: var(--color-bg-tertiary); }
  
  .focus\:ring-primary-500:focus { --tw-ring-color: var(--color-primary-500); }
  .focus\:ring-red-500:focus { --tw-ring-color: #ef4444; }
  .focus\:ring-yellow-500:focus { --tw-ring-color: #eab308; }
  
  .shadow-sm { box-shadow: 0 1px 2px 0 rgb(0 0 0 / 0.05); }
  
  .bg-white { background-color: var(--color-bg-primary); }
  .bg-neutral-50 { background-color: var(--color-bg-tertiary); }
  .bg-neutral-100 { background-color: var(--color-bg-tertiary); }
  
  .bg-accent-red { background-color: #ef4444; }
  .bg-accent-yellow { background-color: #eab308; }
  
  .text-red-700 { color: #b91c1c; }
  .text-yellow-400 { color: #facc15; }
  
  /* Additional utility classes */
  .inline-flex { display: inline-flex; }
  .items-center { align-items: center; }
  .justify-center { justify-content: center; }
  .font-medium { font-weight: var(--font-weight-medium); }
  .rounded-md { border-radius: var(--radius-md); }
  .focus\:outline-none:focus { outline: 2px solid transparent; outline-offset: 2px; }
  .focus\:ring-2:focus { --tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color); box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow, 0 0 #0000); }
  .focus\:ring-offset-2:focus { --tw-ring-offset-width: 2px; }
  .transition-all { transition-property: all; transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1); transition-duration: 150ms; }
  .duration-200 { transition-duration: 200ms; }
  .disabled\:opacity-50:disabled { opacity: 0.5; }
  .disabled\:cursor-not-allowed:disabled { cursor: not-allowed; }
  
  .px-2\.5 { padding-left: 0.625rem; padding-right: 0.625rem; }
  .px-3 { padding-left: 0.75rem; padding-right: 0.75rem; }
  .px-4 { padding-left: 1rem; padding-right: 1rem; }
  .px-6 { padding-left: 1.5rem; padding-right: 1.5rem; }
  .px-8 { padding-left: 2rem; padding-right: 2rem; }
  
  .py-1\.5 { padding-top: 0.375rem; padding-bottom: 0.375rem; }
  .py-2 { padding-top: 0.5rem; padding-bottom: 0.5rem; }
  .py-2\.5 { padding-top: 0.625rem; padding-bottom: 0.625rem; }
  .py-3 { padding-top: 0.75rem; padding-bottom: 0.75rem; }
  .py-4 { padding-top: 1rem; padding-bottom: 1rem; }
  
  .text-xs { font-size: var(--font-size-xs); }
  .text-sm { font-size: var(--font-size-sm); }
  .text-base { font-size: var(--font-size-base); }
  .text-lg { font-size: var(--font-size-lg); }
  
  .mr-2 { margin-right: 0.5rem; }
  .ml-2 { margin-left: 0.5rem; }
  
  /* Line clamp utility */
  .line-clamp-1 {
    overflow: hidden;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 1;
  }

  /* Typography */
  --font-family-sans: 'Manrope', ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, 'Noto Sans', sans-serif;

  --font-size-xs: 12px;
  --font-size-sm: 13px;
  --font-size-base: 14px;
  --font-size-lg: 16px;
  --font-size-xl: 18px;
  --font-size-2xl: 24px;
  --font-size-3xl: 36px;
  --font-size-4xl: 39px;

  --font-weight-normal: 400;
  --font-weight-medium: 500;
  --font-weight-semibold: 600;
  --font-weight-bold: 700;

  --line-height-tight: 1em;
  --line-height-normal: 1.4em;

  /* Spacing */
  --spacing-0: 0;
  --spacing-1: 4px;
  --spacing-2: 8px;
  --spacing-3: 10px;
  --spacing-4: 16px;
  --spacing-5: 20px;
  --spacing-6: 24px;
  --spacing-8: 30px;
  --spacing-10: 35px;
  --spacing-12: 40px;
  --spacing-15: 50px;
  --spacing-16: 60px;
  --spacing-20: 80px;
  --spacing-24: 100px;

  /* Radius */
  --radius-sm: 2px;
  --radius-md: 6px;
  --radius-lg: 10px;
  --radius-xl: 12px;
  --radius-2xl: 16px;
  --radius-3xl: 60px;
  --radius-full: 9999px;

  /* Components */
  --header-height: 68px;
  --header-padding: 8px 20px;
  --header-border: 1px solid var(--color-border-medium);

  --pill-padding: 10px 18px;
  --pill-border-radius: var(--radius-3xl);
  --pill-font-size: var(--font-size-xs);
  --pill-font-weight: var(--font-weight-medium);

  --card-padding: 20px;
  --card-border-radius: var(--radius-lg);
  --card-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);

  --avatar-size: 26px;
  --avatar-border-radius: var(--radius-full);

  --search-padding: 11px 22px 11px 16px;
  --search-height: 46px;
  --search-border-radius: var(--radius-3xl);

  --table-header-font-size: var(--font-size-xs);
  --table-header-font-weight: var(--font-weight-semibold);
  --table-cell-font-size: var(--font-size-sm);
  --table-cell-font-weight: var(--font-weight-medium);

  --status-dot-size: 8px;
  --status-gap: 10px;
}

/* Utilities */
.font-manrope { font-family: var(--font-family-sans); }
.text-balance { text-wrap: balance; }
.text-pretty { text-wrap: pretty; }
.scrollbar-hide { -ms-overflow-style: none; scrollbar-width: none; }
.scrollbar-hide::-webkit-scrollbar { display: none; }

