/* Minimal reset — Tailwind CSS handles all layout and component styles via CDN.
   This file provides only the few overrides that Tailwind doesn't cover. */

*, *::before, *::after { box-sizing: border-box; }

html { scroll-behavior: smooth; }

body {
  margin: 0;
  font-size: 1rem;
  font-weight: 400;
  line-height: 1.5;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

/* Headings use the theme display face; body copy never inherits heading weight. */
h1, h2, h3, h4, h5, h6 { font-family: inherit; }
p, li, td, th, label, input, select, textarea, button { font-weight: inherit; }

/* Offline/CDN-blocked fallback. The Tailwind CDN injects its preflight AFTER this sheet, so
   these rules only apply when the CDN script fails to load (preview host without internet,
   ad-blocker). Without them the browser's UA styles take over and every heading renders as
   huge bold serif text ("Welcome back" in 2em bold) — the "whole site is bold and big" defect. */
h1 { font-size: 1.5rem;  font-weight: 700; line-height: 1.25; margin: 0 0 .5rem; }
h2 { font-size: 1.25rem; font-weight: 600; line-height: 1.3;  margin: 0 0 .5rem; }
h3 { font-size: 1.125rem; font-weight: 600; line-height: 1.35; margin: 0 0 .5rem; }
h4, h5, h6 { font-size: 1rem; font-weight: 600; line-height: 1.4; margin: 0 0 .5rem; }
a { color: inherit; text-decoration: none; }
img, svg, video { max-width: 100%; height: auto; display: block; }

/* ── Universal responsive guards ──────────────────────────────────────────────────
   Generated pages must never produce a horizontal page scrollbar. These rules make the
   most common offenders wrap or scroll locally instead of widening the document:
   fixed-width card rows, wide tables, long unbroken strings and oversized flex items. */
html, body { max-width: 100%; overflow-x: hidden; }
main { min-width: 0; }
main > * { max-width: 100%; }
/* Flex/grid children default to min-width:auto, which lets one wide card push the row
   past the viewport. Force them to shrink and let the row wrap instead. */
main .flex { flex-wrap: wrap; }
main .flex > *, main .grid > * { min-width: 0; }
/* A one-row grid with fixed column counts overflows on small screens; below the lg
   breakpoint collapse anything wider than two columns to an auto-fit grid. */
@media (max-width: 1023px) {
  main [class*="grid-cols-3"], main [class*="grid-cols-4"], main [class*="grid-cols-5"], main [class*="grid-cols-6"] {
    grid-template-columns: repeat(auto-fit, minmax(min(100%, 16rem), 1fr));
  }
}
@media (max-width: 639px) {
  main [class*="grid-cols-"] { grid-template-columns: 1fr; }
}
/* Tables scroll inside their own wrapper, never the page. */
main table { width: 100%; max-width: 100%; }
main .table-wrap, main .overflow-x-auto { max-width: 100%; overflow-x: auto; -webkit-overflow-scrolling: touch; }
/* Long tokens (URLs, ids, hashes) break instead of stretching their container. */
main p, main td, main th, main li, main dd, main span { overflow-wrap: anywhere; }
pre, code { max-width: 100%; overflow-x: auto; white-space: pre-wrap; word-break: break-word; }
/* Charts and iframes stay inside their card. */
canvas, iframe, embed, object { max-width: 100%; }

/* Validation summary styles (MVC default) */
.field-validation-error { color: #ef4444; font-size: 0.78rem; }
.input-validation-error { border-color: #ef4444 !important; }
.validation-summary-errors ul { margin: 0; padding-left: 1.25rem; color: #ef4444; font-size: 0.82rem; }
.validation-summary-valid { display: none; }

/* Page-load fade-in animation */
@keyframes fadeIn {
  from { opacity: 0; transform: translateY(6px); }
  to   { opacity: 1; transform: translateY(0); }
}
.fade-in { animation: fadeIn 0.35s ease both; }

/* Scrollbar (WebKit) */
::-webkit-scrollbar { width: 6px; height: 6px; }
::-webkit-scrollbar-track { background: transparent; }
::-webkit-scrollbar-thumb { background: #cbd5e1; border-radius: 999px; }
::-webkit-scrollbar-thumb:hover { background: #94a3b8; }
