/* ==========================================
   EduMate Pro - Core Design System & Reset
   ========================================== */

:root {
  /* Brand Colors */
  --color-primary: #3B82F6;
  --color-primary-hover: #2563EB;
  --color-primary-soft: #EFF6FF;
  
  /* Neutral Palette - White Theme */
  --color-bg: #F8FAFC;
  --color-surface: #FFFFFF;
  --color-border: #E5E7EB;
  --color-border-light: #F3F4F6;
  --color-text: #111827;
  --color-text-secondary: #4B5563;
  --color-text-muted: #9CA3AF;
  
  /* State Colors */
  --color-success-bg: #F0FDF4;   
  --color-success: #16A34A;
  --color-success-border: #BBF7D0;
  
  --color-warning-bg: #FEF3C7;   
  --color-warning: #D97706;
  --color-warning-border: #FDE68A;
  
  --color-danger-bg: #FEF2F2;    
  --color-danger: #EF4444;
  --color-danger-border: #FECACA;
  
  --color-info-bg: #F0F9FF;      
  --color-info: #0284C7;
  --color-info-border: #BAE6FD;
  
  /* Layout Sizing */
  --sidebar-width: 220px;
  --header-height: 50px;
  
  /* Corner Radius */
  --radius-sm: 4px;
  --radius-md: 6px;
  --radius-lg: 8px;
  --radius-full: 9999px;
  
  /* Typography - 11px High-Density Base */
  --font-family: 'Poppins', 'Segoe UI', system-ui, -apple-system, sans-serif;
  --font-size-base: 11px;
}

/* Strictly BAN all box-shadows across the entire application */
*, *::before, *::after {
  box-sizing: border-box;
  box-shadow: none !important;
}

/* Base Typography System - Default 11px Across All Elements */
html, body, input, select, textarea, button, table, th, td, label, p, span, div, h1, h2, h3, h4, a, code, pre, kbd, samp {
  font-family: var(--font-family);
  font-size: 11px;
}

/* Force Poppins on font-mono utility and .mono classes */
.font-mono, .mono, code, pre, kbd, samp {
  font-family: 'Poppins', sans-serif !important;
}

/* Override Tailwind Font Size Utility Classes for Accurate 11px/10px High Density */
.text-xs, .text-sm, .text-base, .text-lg {
  font-size: 11px !important;
}

/* Micro Text (10px / 9px) for Badges & Sub-labels */
.text-\[9px\], .text-\[10px\], .text-micro {
  font-size: 10px !important;
}

/* Metric Highlights & Brand Titles */
.metric-value {
  font-size: 15px !important;
}
.metric-count {
  font-size: 13px !important;
}
.navbar-brand-title {
  font-size: 13px !important;
}
.welcome-greeting {
  font-size: 12px !important;
}

html, body {
  height: 100%;
  margin: 0;
  padding: 0;
  background-color: var(--color-bg);
  color: var(--color-text);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

/* Flaticon UIcons Default Alignment & Sizing */
.fi {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  vertical-align: middle;
  line-height: 1;
}

/* Scrollbars */
::-webkit-scrollbar { width: 4px; height: 4px; }
::-webkit-scrollbar-track { background: #F1F5F9; }
::-webkit-scrollbar-thumb { background: #CBD5E1; border-radius: 4px; }

/* Form Field Reset & Focus States */
input:focus, select:focus, textarea:focus {
  outline: none !important;
  border-color: var(--color-primary-hover) !important;
  box-shadow: none !important;
}

/* Number Spinner Removal */
input::-webkit-outer-spin-button,
input::-webkit-inner-spin-button {
  -webkit-appearance: none !important;
  margin: 0 !important;
}
input[type=number] {
  -moz-appearance: textfield !important;
}

/* Print Utilities */
@media print {
  .no-print { display: none !important; }
  body { background: #fff !important; }
}