/* ========================================================================
   GMAP — Estilos base (derivados do FIPS Design System)
   ======================================================================== */
@import url('https://fonts.googleapis.com/css2?family=Open+Sans:wght@400;500;600;700&family=Saira+Expanded:wght@500;600;700&display=swap');

:root {
  /* FIPS palette */
  --fips-blue-950: #002a68;
  --fips-blue-900: #004b9b;
  --fips-blue-700: #658ec9;
  --fips-blue-400: #93bde4;
  --fips-blue-200: #d3e3f4;
  --fips-sky-600: #0090d0;
  --fips-yellow-400: #fdc24e;
  --fips-yellow-600: #f6921e;
  --fips-yellow-100: #ffe4b8;
  --fips-green-500: #00c64c;
  --fips-green-700: #00904c;
  --fips-green-300: #8be5ad;
  --fips-red-600: #ef4444;
  --fips-red-100: #fee2e2;
  --fips-orange-100: #fff0d6;
  --fips-gray-900: #333b41;
  --fips-gray-400: #c0ccd2;
  --fips-neutral-100: #e8ebff;
  --fips-neutral-50: #f5f8fc;
  --fips-neutral-25: #fbfdff;

  /* semantic */
  --color-primary: var(--fips-blue-900);
  --color-primary-hover: var(--fips-blue-950);
  --color-secondary: var(--fips-sky-600);
  --color-secondary-hover: #007ab1;
  --color-accent: var(--fips-yellow-400);
  --color-accent-strong: var(--fips-yellow-600);
  --color-success: var(--fips-green-500);
  --color-success-strong: var(--fips-green-700);
  --color-warning: var(--fips-yellow-600);
  --color-danger: var(--fips-red-600);
  --color-surface: #ffffff;
  --color-surface-soft: var(--fips-neutral-25);
  --color-surface-muted: var(--fips-neutral-50);
  --color-border: #d7e0ea;
  --color-border-strong: var(--fips-gray-400);
  --color-fg: var(--fips-gray-900);
  --color-fg-muted: #6b7784;
  --color-ring: var(--fips-sky-600);
  --color-sidebar: var(--fips-blue-950);
  --color-sidebar-soft: var(--fips-blue-900);
  --color-gov-gradient-from: #004b9b;
  --color-gov-gradient-to: #002a68;

  --shadow-field: 0 1px 2px rgb(15 23 42 / 0.04), inset 0 1px 2px rgb(15 23 42 / 0.03);
  --shadow-card: 0 2px 8px rgb(15 23 42 / 0.04), 0 10px 24px rgb(15 23 42 / 0.06);
  --shadow-card-hover: 0 8px 22px rgb(15 23 42 / 0.08), 0 18px 38px rgb(0 75 155 / 0.08);
  --shadow-elevated: 0 22px 64px rgb(0 75 155 / 0.18);

  --font-sans: 'Open Sans', ui-sans-serif, system-ui, sans-serif;
  --font-heading: 'Saira Expanded', 'Open Sans', ui-sans-serif, system-ui, sans-serif;

  --radius-sm: 0.25rem;
  --radius-md: 0.375rem;
  --radius-lg: 0.5rem;
  --radius-xl: 0.75rem;
  --radius-2xl: 1rem;
}

* { box-sizing: border-box; }
html, body, #root { margin: 0; height: 100%; }
html, body { overflow-x: hidden; max-width: 100%; }
html { -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; }
body {
  font-family: var(--font-sans);
  background: var(--color-surface-muted);
  color: var(--color-fg);
  font-size: 14px;
  line-height: 1.5;
}

h1, h2, h3, h4, h5 {
  font-family: var(--font-heading);
  color: var(--color-fg);
  margin: 0;
  letter-spacing: -0.02em;
  font-weight: 600;
}

p, label, input, select, textarea, button { font-family: var(--font-sans); }

/* ─── DS_FIPS form controls: hover / focus ─── */
input:not([type="checkbox"]):not([type="radio"]):hover,
select:hover,
textarea:hover { border-color: var(--fips-blue-400); }

input:not([type="checkbox"]):not([type="radio"]):focus,
select:focus,
textarea:focus {
  border-color: var(--color-primary);
  box-shadow: 0 0 0 3px var(--fips-blue-200);
}

input[aria-invalid="true"]:focus,
input.has-error:focus,
select.has-error:focus,
textarea.has-error:focus {
  border-color: var(--color-danger);
  box-shadow: 0 0 0 3px rgba(239,68,68,0.22);
}

button { font-family: inherit; cursor: pointer; border: none; background: none; color: inherit; }
a { color: inherit; text-decoration: none; }

::selection { background: rgb(0 144 208 / 0.18); color: var(--fips-blue-950); }

/* ─── Scrollbars ─── */
.sidebar-scroll { scrollbar-width: thin; scrollbar-color: rgba(255,255,255,0.3) transparent; }
.sidebar-scroll::-webkit-scrollbar { width: 6px; }
.sidebar-scroll::-webkit-scrollbar-track { background: transparent; }
.sidebar-scroll::-webkit-scrollbar-thumb { background-color: rgba(255,255,255,0.25); border-radius: 3px; }
.no-scrollbar { -ms-overflow-style: none; scrollbar-width: none; }
.no-scrollbar::-webkit-scrollbar { display: none; }

.thin-scroll { scrollbar-width: thin; }
.thin-scroll::-webkit-scrollbar { width: 8px; height: 8px; }
.thin-scroll::-webkit-scrollbar-thumb { background: #cbd5e1; border-radius: 6px; }
.thin-scroll::-webkit-scrollbar-track { background: transparent; }

/* ─── Animations ─── */
@keyframes shimmer-sweep {
  0% { transform: translateX(-100%); }
  100% { transform: translateX(100%); }
}
@keyframes fade-in {
  from { opacity: 0; transform: translateY(4px); }
  to { opacity: 1; transform: translateY(0); }
}
@keyframes spin-slow {
  to { transform: rotate(360deg); }
}

.fade-in { animation: fade-in 0.25s ease-out both; }

/* ─── Hero background rail lines (decorative SVG) ─── */
.rail-lines {
  position: absolute;
  inset: 0;
  pointer-events: none;
  opacity: 0.14;
}

/* ─── Focus ─── */
button:focus-visible,
[role="button"]:focus-visible,
input:not(.ds-input):focus-visible,
select:focus-visible,
textarea:focus-visible {
  outline: none;
  box-shadow: 0 0 0 4px rgba(0, 144, 208, 0.2);
  border-radius: 10px;
}

/* DSInput: wrap handles the border/focus; inner <input> stays bare */
.ds-input,
.ds-input:hover,
.ds-input:focus,
.ds-input:focus-visible {
  border: none !important;
  box-shadow: none !important;
  outline: none !important;
  border-radius: 0 !important;
}

/* ─── Drag helpers ─── */
.dragging { opacity: 0.4; transform: scale(0.98); }
.drag-over { background: rgba(0, 144, 208, 0.08) !important; outline: 2px dashed rgba(0, 144, 208, 0.5); outline-offset: -6px; }

/* ─── Utility truncate ─── */
.truncate { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.line-clamp-2 {
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}