/* ============================================================
   UCI² InvenTree Custom Theme
   Overrides Mantine CSS variables — no fragile class names
   ============================================================ */

/* --- Font --- */
:root {
  --mantine-font-family: 'Barlow', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
  --mantine-font-family-headings: 'Barlow', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;

  /* Accent: sky blue replacing Mantine's default blue */
  --mantine-color-blue-0: #f0f9ff;
  --mantine-color-blue-1: #e0f2fe;
  --mantine-color-blue-2: #bae6fd;
  --mantine-color-blue-3: #7dd3fc;
  --mantine-color-blue-4: #38bdf8;
  --mantine-color-blue-5: #0ea5e9;
  --mantine-color-blue-6: #0284c7;
  --mantine-color-blue-7: #0369a1;
  --mantine-color-blue-8: #075985;
  --mantine-color-blue-9: #0c4a6e;
}

/* --- Light scheme overrides --- */
[data-mantine-color-scheme=light] {
  /* Page background: cool gray instead of white */
  --mantine-color-body: #f8fafc;

  /* Blue primary actions */
  --mantine-color-blue-filled:        #0284c7;
  --mantine-color-blue-filled-hover:  #0369a1;
  --mantine-color-blue-light:         rgba(14, 165, 233, 0.1);
  --mantine-color-blue-light-hover:   rgba(14, 165, 233, 0.15);
  --mantine-color-blue-light-color:   #0284c7;
  --mantine-color-blue-outline:       #0284c7;
  --mantine-color-blue-outline-hover: rgba(14, 165, 233, 0.05);
  --mantine-color-blue-text:          #0284c7;

  /* Borders and defaults */
  --mantine-color-default-border: #e2e8f0;
  --mantine-color-default-hover:  #f1f5f9;
  --mantine-color-placeholder:    #94a3b8;
  --mantine-color-dimmed:         #64748b;
  --mantine-color-anchor:         #0284c7;
}

/* --- Global polish --- */
*, *::before, *::after {
  transition: background-color 0.15s ease, border-color 0.15s ease, box-shadow 0.15s ease;
}

/* Smooth scrolling */
html { scroll-behavior: smooth; }

/* Better base text rendering */
body {
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  font-size: 14px;
  line-height: 1.6;
}

/* --- Cards & panels: subtle shadow + white surface --- */
[data-mantine-color-scheme=light] .mantine-Paper-root,
[data-mantine-color-scheme=light] [class*="Paper"] {
  background-color: #ffffff !important;
  box-shadow: 0 1px 3px rgba(15, 23, 42, 0.06), 0 1px 2px rgba(15, 23, 42, 0.04) !important;
  border: 1px solid #e2e8f0 !important;
  border-radius: 8px !important;
}

/* Cards hover lift */
[data-mantine-color-scheme=light] .mantine-Paper-root:hover {
  box-shadow: 0 4px 12px rgba(15, 23, 42, 0.10), 0 2px 4px rgba(15, 23, 42, 0.06) !important;
}

/* --- Tables: clean alternating rows --- */
[data-mantine-color-scheme=light] table tbody tr:nth-child(even) {
  background-color: #f8fafc;
}

[data-mantine-color-scheme=light] table tbody tr:hover {
  background-color: #f0f9ff !important;
  cursor: pointer;
}

[data-mantine-color-scheme=light] table thead tr {
  background-color: #f1f5f9;
}

[data-mantine-color-scheme=light] table thead th {
  font-weight: 600;
  font-size: 0.75rem;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: #475569;
  border-bottom: 2px solid #e2e8f0 !important;
}

[data-mantine-color-scheme=light] table td {
  border-bottom: 1px solid #f1f5f9 !important;
  padding: 10px 12px !important;
}

/* --- Buttons: rounded, polished --- */
[data-mantine-color-scheme=light] button[class*="Button"]:not(:disabled),
[data-mantine-color-scheme=light] [class*="button"]:not(:disabled) {
  border-radius: 6px !important;
  font-weight: 500 !important;
  letter-spacing: 0.01em;
}

/* Primary filled buttons */
[data-mantine-color-scheme=light] button[data-variant=filled] {
  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.08) !important;
}
[data-mantine-color-scheme=light] button[data-variant=filled]:hover {
  box-shadow: 0 4px 8px rgba(2, 132, 199, 0.25) !important;
  transform: translateY(-1px);
}
[data-mantine-color-scheme=light] button[data-variant=filled]:active {
  transform: translateY(0);
  box-shadow: none !important;
}

/* --- Inputs: clean focus ring --- */
[data-mantine-color-scheme=light] input,
[data-mantine-color-scheme=light] textarea,
[data-mantine-color-scheme=light] select {
  border-color: #e2e8f0 !important;
  border-radius: 6px !important;
  background-color: #ffffff !important;
}

[data-mantine-color-scheme=light] input:focus,
[data-mantine-color-scheme=light] textarea:focus,
[data-mantine-color-scheme=light] select:focus {
  border-color: #0ea5e9 !important;
  box-shadow: 0 0 0 3px rgba(14, 165, 233, 0.12) !important;
  outline: none;
}

/* --- Badges & status chips --- */
[data-mantine-color-scheme=light] [class*="Badge"] {
  border-radius: 4px !important;
  font-weight: 600 !important;
  font-size: 0.7rem !important;
  letter-spacing: 0.03em;
}

/* --- Modals: centered, clean --- */
[data-mantine-color-scheme=light] [class*="Modal-content"],
[data-mantine-color-scheme=light] [class*="modal-content"] {
  border-radius: 10px !important;
  box-shadow: 0 20px 60px rgba(15, 23, 42, 0.18) !important;
}

[data-mantine-color-scheme=light] [class*="Modal-header"] {
  border-bottom: 1px solid #e2e8f0 !important;
  padding-bottom: 12px !important;
  font-weight: 600 !important;
}

/* --- Tooltips --- */
[data-mantine-color-scheme=light] [class*="Tooltip-tooltip"] {
  border-radius: 4px !important;
  font-size: 12px !important;
  padding: 4px 8px !important;
}

/* --- Sidebar / nav items: active state polish --- */
[data-mantine-color-scheme=light] [class*="NavLink"][data-active],
[data-mantine-color-scheme=light] [aria-selected=true] {
  background-color: rgba(14, 165, 233, 0.12) !important;
  color: #0284c7 !important;
  font-weight: 600 !important;
}

/* --- Scrollbars: thin & subtle --- */
::-webkit-scrollbar { width: 6px; height: 6px; }
::-webkit-scrollbar-track { background: transparent; }
::-webkit-scrollbar-thumb { background: #cbd5e1; border-radius: 3px; }
::-webkit-scrollbar-thumb:hover { background: #94a3b8; }

/* --- Stats / metric cards --- */
[data-mantine-color-scheme=light] [class*="StatsCard"],
[data-mantine-color-scheme=light] [class*="stats-card"] {
  border-left: 3px solid #0ea5e9 !important;
}

/* --- Loading indicators --- */
[data-mantine-color-scheme=light] [class*="Loader"] {
  color: #0ea5e9 !important;
}

/* --- Tabs: clean underline style --- */
[data-mantine-color-scheme=light] [class*="Tab"][data-active] {
  border-bottom: 2px solid #0284c7 !important;
  color: #0284c7 !important;
  font-weight: 600 !important;
}

/* --- DataGrid / Mantine table component --- */
[data-mantine-color-scheme=light] [class*="DataTable"],
[data-mantine-color-scheme=light] [class*="TableScrollContainer"] {
  border-radius: 8px !important;
  overflow: hidden;
  border: 1px solid #e2e8f0 !important;
}

/* Login page: center card with shadow */
[data-mantine-color-scheme=light] #root > div > div[class*="Center"],
[data-mantine-color-scheme=light] #root > div[class*="login"],
[data-mantine-color-scheme=light] #root > div[class*="auth"] {
  background: linear-gradient(135deg, #1e3a5f 0%, #1b5ea6 50%, #0284c7 100%) !important;
  min-height: 100vh;
}

