@tailwind base;
@tailwind components;
@tailwind utilities;

@layer base {
  :root {
    --font-sans: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  }
}

@layer base {
  :root {
    --background: 0 0% 98%;
    --foreground: 222 20% 12%;
    --card: 0 0% 100%;
    --card-foreground: 222 20% 12%;
    --popover: 0 0% 100%;
    --popover-foreground: 222 20% 12%;
    --primary: 213 74% 37%;
    --primary-foreground: 0 0% 100%;
    --secondary: 210 20% 96%;
    --secondary-foreground: 222 20% 12%;
    --muted: 210 20% 96%;
    --muted-foreground: 215 16% 47%;
    --accent: 210 20% 94%;
    --accent-foreground: 222 20% 12%;
    --destructive: 0 72% 40%;
    --destructive-foreground: 0 0% 100%;
    --border: 214 20% 90%;
    --input: 214 20% 90%;
    --ring: 213 74% 37%;
    --radius: 0.5rem;

    /* Brand-specific */
    --brand-50:  #e6f1fb;
    --brand-100: #b5d4f4;
    --brand-400: #185fa5;
    --brand-500: #0c447c;
    --success:   #3b6d11;
    --warning:   #854f0b;
    --danger:    #a32d2d;
    --info:      #185fa5;
  }

  .dark {
    --background: 222 25% 10%;
    --foreground: 210 20% 96%;
    --card: 222 25% 13%;
    --card-foreground: 210 20% 96%;
    --popover: 222 25% 13%;
    --popover-foreground: 210 20% 96%;
    --primary: 213 74% 55%;
    --primary-foreground: 0 0% 100%;
    --secondary: 222 25% 18%;
    --secondary-foreground: 210 20% 96%;
    --muted: 222 25% 18%;
    --muted-foreground: 215 16% 60%;
    --accent: 222 25% 20%;
    --accent-foreground: 210 20% 96%;
    --destructive: 0 60% 50%;
    --destructive-foreground: 0 0% 100%;
    --border: 222 20% 22%;
    --input: 222 20% 22%;
    --ring: 213 74% 55%;
  }
}

@layer base {
  * { @apply border-border; }
  body { @apply bg-background text-foreground font-sans antialiased; }
  h1 { @apply text-2xl font-semibold tracking-tight; }
  h2 { @apply text-xl font-semibold tracking-tight; }
  h3 { @apply text-lg font-medium; }
}

/* Scrollbar */
::-webkit-scrollbar { width: 5px; height: 5px; }
::-webkit-scrollbar-track { @apply bg-transparent; }
::-webkit-scrollbar-thumb { @apply bg-border rounded-full; }
::-webkit-scrollbar-thumb:hover { @apply bg-muted-foreground; }

/* Table */
.table-lms th { @apply text-xs font-medium text-muted-foreground uppercase tracking-wider px-3 py-2 border-b bg-muted/50; }
.table-lms td { @apply text-sm px-3 py-2.5 border-b; }
.table-lms tr:last-child td { @apply border-b-0; }
.table-lms tr:hover td { @apply bg-accent/50; }

/* Badges */
.badge { @apply inline-flex items-center rounded-full px-2.5 py-0.5 text-xs font-medium; }
.badge-success { @apply bg-green-100 text-green-800 dark:bg-green-900/30 dark:text-green-400; }
.badge-warning { @apply bg-amber-100 text-amber-800 dark:bg-amber-900/30 dark:text-amber-400; }
.badge-danger  { @apply bg-red-100 text-red-800 dark:bg-red-900/30 dark:text-red-400; }
.badge-info    { @apply bg-blue-100 text-blue-800 dark:bg-blue-900/30 dark:text-blue-400; }
.badge-default { @apply bg-gray-100 text-gray-700 dark:bg-gray-800 dark:text-gray-400; }

/* Sidebar active */
.nav-active { @apply bg-primary/10 text-primary font-medium border-l-2 border-primary; }
.nav-item   { @apply flex items-center gap-2.5 px-3 py-2 text-sm text-muted-foreground rounded-md hover:bg-accent hover:text-foreground transition-colors cursor-pointer; }

/* Stat card */
.stat-card { @apply bg-card border rounded-lg p-4 flex flex-col gap-1; }
.stat-label { @apply text-xs text-muted-foreground font-medium uppercase tracking-wide; }
.stat-value { @apply text-2xl font-semibold; }
.stat-change { @apply text-xs; }

/* Form */
.form-label { @apply text-sm font-medium text-foreground; }
.form-hint  { @apply text-xs text-muted-foreground mt-0.5; }

/* Print */
@media print {
  .no-print { display: none !important; }
  .print-full { width: 100% !important; }
}