clqms-fe1/src/app.css

@import 'tailwindcss';
@plugin 'daisyui';

@plugin 'daisyui/theme' {
  name: 'clqms';
  default: true;
  prefersdark: false;
  color-scheme: light;

  --color-base-100: oklch(98% 0.01 240);
  --color-base-200: oklch(96% 0.015 240);
  --color-base-300: oklch(93% 0.02 240);
  --color-base-content: oklch(25% 0.04 240);

  /* Primary: Emerald Green */
  --color-primary: oklch(60% 0.16 150);
  --color-primary-content: oklch(98% 0.01 150);

  /* Secondary: Dark Blue */
  --color-secondary: oklch(35% 0.08 250);
  --color-secondary-content: oklch(98% 0.01 250);

  /* Accent: Royal Blue */
  --color-accent: oklch(55% 0.22 250);
  --color-accent-content: oklch(98% 0.01 250);

  --color-neutral: oklch(50% 0.05 240);
  --color-neutral-content: oklch(98% 0.01 240);

  /* Semantic Colors */
  --color-info: oklch(70% 0.15 230);
  --color-info-content: oklch(25% 0.04 230);
  --color-success: oklch(65% 0.18 140);
  --color-success-content: oklch(98% 0.01 140);
  --color-warning: oklch(80% 0.16 85);
  --color-warning-content: oklch(25% 0.04 85);
  --color-error: oklch(60% 0.25 25);
  --color-error-content: oklch(98% 0.01 25);

  /* Border radius - smaller for compact look */
  --radius-selector: 0.25rem;
  --radius-field: 0.25rem;
  --radius-box: 0.375rem;

  /* Base sizes - reduced for compact UI */
  --size-selector: 0.2rem;
  --size-field: 0.2rem;

  /* Border size */
  --border: 1px;

  /* Effects */
  --depth: 0;
  --noise: 0;
}

/* Global compact utility classes */
@layer utilities {
  /* Compact spacing */
  .compact-y { @apply space-y-3; }
  .compact-gap { @apply gap-3; }
  .compact-p { @apply p-4; }
  .compact-py { @apply py-3; }
  .compact-px { @apply px-3; }
  
  /* Compact form elements */
  .compact-input { @apply input-sm; }
  .compact-btn { @apply btn-sm; }
  .compact-select { @apply select-sm; }
  
  /* Compact cards */
  .compact-card { @apply p-4; }
}

@theme {
  /* Custom color helpers */
  --color-emerald-50: #ecfdf5;
  --color-emerald-100: #d1fae5;
  --color-emerald-200: #a7f3d0;
  --color-emerald-300: #6ee7b7;
  --color-emerald-400: #34d399;
  --color-emerald-500: #10b981;
  --color-emerald-600: #059669;
  --color-emerald-700: #047857;
  --color-emerald-800: #065f46;
  --color-emerald-900: #064e3b;

  --color-blue-50: #eff6ff;
  --color-blue-100: #dbeafe;
  --color-blue-200: #bfdbfe;
  --color-blue-300: #93c5fd;
  --color-blue-400: #60a5fa;
  --color-blue-500: #3b82f6;
  --color-blue-600: #2563eb;
  --color-blue-700: #1d4ed8;
  --color-blue-800: #1e40af;
  --color-blue-900: #1e3a8a;

  --color-navy-600: #1e3a5f;
  --color-navy-700: #1a2f4a;
  --color-navy-800: #0f1f33;
  --color-navy-900: #0a1628;
}