/* VeriCase Global UI polish (lightweight, framework-free) */

/* 1) Base reset and typography */
html {
  -webkit-text-size-adjust: 100%;
}

body {
  font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Inter', 'SF Pro Display', 'Roboto', 'Helvetica Neue', Arial, sans-serif;
  line-height: 1.5;
  color: #1F2937; /* var(--vericase-navy) fallback */
}

img { max-width: 100%; height: auto; }

/* 2) Utility containers and stacks */
.container {
  max-width: 1400px;
  margin-inline: auto;
  padding-inline: 24px;
}

.stack-sm { display: grid; gap: 8px; }
.stack-md { display: grid; gap: 16px; }
.stack-lg { display: grid; gap: 24px; }

.text-muted { color: #64748b; }

.visually-hidden,
.sr-only {
  position: absolute !important;
  height: 1px; width: 1px;
  overflow: hidden;
  clip: rect(1px, 1px, 1px, 1px);
  white-space: nowrap;
}

/* 3) Focus rings for accessibility */
a:focus-visible,
button:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible {
  outline: 3px solid rgba(23, 181, 163, 0.45);
  outline-offset: 2px;
}

/* 4) Breadcrumbs */
.breadcrumbs {
  background: #ffffff;
  border-bottom: 1px solid #e5e7eb; /* border */
}
.breadcrumbs .inner {
  display: flex;
  align-items: center;
  gap: 8px;
  min-height: 44px;
  font-size: 14px;
}
.breadcrumbs a {
  color: #4b5563; /* muted */
  text-decoration: none;
}
.breadcrumbs a:hover { color: #111827; }
.breadcrumbs .sep { color: #9ca3af; }
.breadcrumbs .current { color: #111827; font-weight: 600; }

/* 5) Buttons - improve hover/active/focus without changing existing colors */
.btn { transition: transform 0.06s ease, box-shadow 0.2s ease !important; }
.btn:hover { transform: translateY(-1px); }
.btn:active { transform: translateY(0); }
.btn:focus-visible { box-shadow: 0 0 0 3px rgba(23, 181, 163, 0.35); }

/* 6) Cards defaults (non-invasive) */
.card {
  background: #fff;
  border: 1px solid #e5e7eb;
  border-radius: 10px;
  box-shadow: 0 1px 2px rgba(0,0,0,0.04);
}

/* 7) AG Grid readability tweaks (Quartz theme) */
.ag-theme-quartz {
  --row-padding-y: 6px;
}
.ag-theme-quartz .ag-header {
  background: #f8fafc; /* subtle header bg */
  border-bottom: 1px solid #e5e7eb;
}
.ag-theme-quartz .ag-header-cell-label { font-weight: 600; color: #111827; }
.ag-theme-quartz .ag-row { border-bottom: 1px solid #eef2f7; }
.ag-theme-quartz .ag-row-odd { background: #fbfdff; }
.ag-theme-quartz .ag-cell { padding-block: var(--row-padding-y); }

/* 8) Tables (generic) */
table.compact thead th {
  background: #f8fafc;
  border-bottom: 1px solid #e5e7eb;
  font-weight: 600;
}
table.compact td, table.compact th { padding: 10px 12px; }
table.compact tbody tr:nth-child(odd) { background: #fbfdff; }

/* 9) Helper spacing utilities */
.mt-0 { margin-top: 0 !important; }
.mt-8 { margin-top: 8px !important; }
.mt-12 { margin-top: 12px !important; }
.mt-16 { margin-top: 16px !important; }
.mb-16 { margin-bottom: 16px !important; }
.py-12 { padding-block: 12px !important; }
.px-16 { padding-inline: 16px !important; }
