/* Bundled Inter (SIL OFL 1.1): no Google/font network dependency. */
@font-face { font-family: 'Inter'; src: url('/assets/29160a80ff49ddcab2c97711247e08b1fab27a484a329ce8b813d820dc559031/Inter-variable.ttf') format('truetype'); font-weight: 100 900; font-style: normal; font-display: swap; }
@font-face { font-family: 'Inter'; src: url('/assets/acd98e64795781b2058f07b18475e0ecee2a0fe2b42a49e2f9e37d0d6bf66ce6/Inter-italic-variable.ttf') format('truetype'); font-weight: 100 900; font-style: italic; font-display: swap; }
/* ── ND Ag KPIs Custom Styles ──────────────────────────────── */

:root {
  --nd-green: #006633;
  --nd-gold: #F2C75C;
  --nd-blue: #2E86AB;
  --nd-teal: #5BA88B;
  --nd-dark: #2C3E50;
}

/* ── Navbar ─────────────────────────────────────────────── */
.navbar {
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
}

.navbar-brand {
  font-weight: 700;
  font-size: 1.15rem;
  letter-spacing: 0.02em;
}

.navbar-brand img {
  height: 32px;
  margin-right: 8px;
}

/* ── Cards ──────────────────────────────────────────────── */
.card {
  border: none;
  border-radius: 10px;
  box-shadow: 0 1px 6px rgba(0, 0, 0, 0.06);
  transition: box-shadow 0.2s ease;
}

.card:hover {
  box-shadow: 0 4px 16px rgba(0, 0, 0, 0.1);
}

.card-header {
  background: transparent;
  border-bottom: 1px solid rgba(0, 0, 0, 0.06);
  font-weight: 600;
  font-size: 0.95rem;
}

/* ── Sidebar ────────────────────────────────────────────── */
.sidebar {
  background-color: #fff !important;
  border-right: 1px solid rgba(0, 0, 0, 0.06);
}

/* ── Tables ─────────────────────────────────────────────── */
.rt-table {
  font-size: 0.85rem;
}

.rt-th {
  font-weight: 600;
  text-transform: uppercase;
  font-size: 0.75rem;
  letter-spacing: 0.03em;
  color: var(--nd-dark);
}

/* ── Badge / Ranking Pills ──────────────────────────────── */
.rank-badge {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 28px;
  height: 28px;
  border-radius: 50%;
  font-weight: 700;
  font-size: 0.8rem;
  color: #fff;
}

.rank-badge.rank-1 { background-color: #FFD700; color: #333; }
.rank-badge.rank-2 { background-color: #C0C0C0; color: #333; }
.rank-badge.rank-3 { background-color: #CD7F32; color: #fff; }
.rank-badge.rank-other { background-color: var(--nd-teal); }

/* ── Responsive tweaks ──────────────────────────────────── */
@media (max-width: 768px) {
  .card-header {
    font-size: 0.85rem;
  }

  .navbar-brand {
    font-size: 0.95rem;
  }

  .sidebar {
    border-right: none;
    border-bottom: 1px solid rgba(0, 0, 0, 0.06);
  }
}

@media (max-width: 576px) {
  .rt-table {
    font-size: 0.78rem;
  }
}

/* ── Loading spinner ────────────────────────────────────── */
.spinner-overlay {
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 200px;
  color: var(--nd-green);
}

/* ── Chart containers ───────────────────────────────────── */
.chart-container {
  width: 100%;
  min-height: 350px;
}

@media (max-width: 768px) {
  .chart-container {
    min-height: 250px;
  }
}

/* The Crops production chart fills its card, and its row is as tall as the
 * Historical Data table beside it. Reserve the table's height before it loads
 * so the server draws that chart once, at its final size. */
#crops-summary_table {
  min-height: 376px;
}

/* ── Miscellaneous ──────────────────────────────────────── */
.recalculating,
.recalculating > * {
  /* Keep existing results steady while their replacements are prepared. */
  opacity: 1 !important;
  transition: none !important;
}

[data-shiny-busy-spinners] .recalculating.html-widget-output > * {
  visibility: visible !important;
}

[data-shiny-busy-spinners] .recalculating::after,
[data-shiny-busy-pulse].shiny-busy::after {
  display: none !important;
  animation: none !important;
}

/* Slow-update cue: a thin bar at the top of the page appears only after a
 * visitor's action has waited about 0.6 s (session.js adds .nd-working), so
 * quick updates never flash while slow or queued ones still show progress. */
html.nd-working body::before {
  content: "";
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 3px;
  z-index: 2000;
  pointer-events: none;
  background: linear-gradient(90deg, transparent 0%, var(--nd-green, #006633) 50%, transparent 100%) no-repeat;
  background-size: 40% 100%;
  animation: nd-working-slide 1.1s ease-in-out infinite;
}

@keyframes nd-working-slide {
  from { background-position: -60% 0; }
  to { background-position: 160% 0; }
}

@media (prefers-reduced-motion: reduce) {
  html.nd-working body::before {
    animation: none;
    background: var(--nd-green, #006633);
    opacity: .6;
  }
}

.section-divider {
  border-top: 3px solid var(--nd-green);
  margin: 1.5rem 0;
  opacity: 0.3;
}

.stat-highlight {
  font-size: 2rem;
  font-weight: 800;
  color: var(--nd-green);
}

.trend-up { color: #27ae60; }
.trend-down { color: #e74c3c; }
.trend-stable { color: #7f8c8d; }

/* Crop Explorer: controls stay with the content; compact KPIs keep units separate. */
.crop-controls {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 240px), 1fr));
  align-items: end;
  gap: 0.75rem 1.25rem;
  padding: 0.85rem 1rem;
  margin: 0.75rem 0;
  background: #fff;
  border-radius: 10px;
}
.crop-controls .form-group { margin-bottom: 0; }
.crop-controls .shiny-input-container { width: 100%; }
.crop-retry { padding-bottom: 2px; }
.crop-explorer > h2 { margin-top: 0.75rem; }
/* One KPI system across Overview, Crops, Livestock, Economics and Counties. */
.nd-kpi-grid {
  display: grid;
  grid-template-columns: repeat(var(--nd-kpi-columns, 4), minmax(0, 1fr));
  gap: 1rem;
  align-items: stretch;
}
.nd-kpi-grid > .shiny-html-output { min-width: 0; }
.nd-kpi {
  height: 100%;
  min-height: 188px;
  margin: 0;
  border-radius: 12px;
  border: 1px solid rgba(255,255,255,0.14);
  box-shadow: 0 4px 12px rgba(28, 50, 40, 0.09);
  overflow: hidden;
}
.nd-kpi.bg-primary { background-color: #006633 !important; color: #fff; }
.nd-kpi.bg-success { background-color: #2e789b !important; color: #fff; }
.nd-kpi.bg-info { background-color: #287866 !important; color: #fff; }
.nd-kpi.bg-warning { background-color: #f2c75c !important; color: #26352c; }
.nd-kpi.bg-danger { background-color: #ba463c !important; color: #fff; }
.nd-kpi.bg-secondary { background-color: #586883 !important; color: #fff; }
.nd-kpi .value-box-grid {
  display: grid;
  grid-template-columns: 46px minmax(0, 1fr) !important;
  grid-template-areas: "showcase content" !important;
  gap: 1rem;
  padding: 1.1rem;
  align-items: center;
}
.nd-kpi .value-box-showcase { grid-area: showcase !important; padding: 0 !important; opacity: 0.85; }
.nd-kpi .value-box-showcase i { font-size: 2.75rem !important; }
.nd-kpi .value-box-area {
  display: flex;
  flex-direction: column;
  grid-area: content !important;
  padding: 0 !important;
  gap: 0.3rem;
  min-width: 0;
}
.nd-kpi .value-box-title {
  font-size: 0.72rem !important;
  font-weight: 600;
  letter-spacing: 0.035em;
  text-transform: uppercase;
  line-height: 1.35;
  min-height: 2.7em;
  margin: 0;
}
.nd-kpi .value-box-value {
  font-size: 1.85rem !important;
  font-weight: 750;
  line-height: 1.15;
  letter-spacing: -0.02em;
  margin: 0;
  overflow-wrap: normal;
  font-variant-numeric: tabular-nums;
}
.nd-kpi .nd-kpi-meta { font-size: 0.78rem; line-height: 1.35; margin: 0; opacity: 0.95; }
.nd-kpi .nd-kpi-detail { font-size: 0.76rem; line-height: 1.4; min-height: 2.8em; margin: 0.2rem 0 0; opacity: 0.95; }
.nd-kpi-missing .value-box-value { font-size: 1.2rem !important; line-height: 1.75; letter-spacing: 0; }
@media (max-width: 1100px) {
  .nd-kpi-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 575px) {
  .nd-kpi-grid { grid-template-columns: 1fr; gap: 0.75rem; }
  .nd-kpi { min-height: 170px; }
  .nd-kpi .value-box-grid { padding: 1rem; }
}

/* County Explorer keeps filters beside the content they control. */
.county-controls {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  align-items: end;
  gap: .6rem 1rem;
  background: #f2f6f3;
  border: 1px solid #dce7df;
  border-radius: 10px;
  padding: 1rem;
  margin-bottom: 1rem;
}
.county-controls .shiny-input-container { width: 100%; margin-bottom: 0; }
.county-coverage {
  border-left: 4px solid #006633;
  background: #edf4ef;
  border-radius: 6px;
  padding: .85rem 1rem;
  margin-bottom: 1rem;
  line-height: 1.6;
}
.leaflet-container { background: #f3f6f8; }

@media (max-width: 900px) { .county-controls { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 575px) { .county-controls { grid-template-columns: minmax(0, 1fr); } }

/* Shared report/current comparison explorer. */
.nd-comparison-filters { display: grid; grid-template-columns: minmax(0, 2fr) minmax(0, 1fr); gap: 1rem; }
.nd-comparison-status { border-left: 4px solid var(--nd-green, #1b5e20); background: #f3f7f4; border-radius: 8px; padding: 1rem 1.25rem; margin: 1rem 0; }
.nd-comparison-status p { margin: .35rem 0 0; }
@media (max-width: 575px) { .nd-comparison-filters { grid-template-columns: minmax(0, 1fr); gap: 0; } }
.nd-comparison-filters .shiny-input-container { width: 100%; }
.nd-comparison-filters + .shiny-input-radiogroup .radio-inline { margin-right: 1rem; }

.nd-change-hero { padding: 1.8rem 0 1rem; }
.nd-change-hero h2 { color: #005a30; font-size: clamp(2rem, 4vw, 3rem); font-weight: 800; margin-bottom: .65rem; }
.nd-eyebrow { font-size: .72rem; letter-spacing: .14em; font-weight: 800; color: #526679; }
.nd-change-hero p:not(.nd-eyebrow) { max-width: 760px; color: #52616b; }
.nd-movers { display: flex; flex-wrap: wrap; gap: .5rem 2rem; padding: .75rem 0; }
.nd-explore-links { display: flex; flex-wrap: wrap; gap: 1rem; }
.nd-revision-panel { background: #fff; padding: 1.2rem; border: 1px solid #dae2dd; border-radius: 12px; }
.nd-revision-panel summary { color: #005a30; font-weight: 700; cursor: pointer; margin-bottom: .75rem; }
.nd-evidence { border-top: 1px solid #cadbd0; margin-top: .75rem; padding-top: .75rem; }

/* Shared titles for the detailed report explorers. */
.report-detail-title { color: #005b38; font-weight: 800; margin: 1.25rem 0 .6rem; }

/* Keep the active section legible on the dark navigation background. */
.navbar .nav-link.active { color: #fff !important; border-bottom-color: #d4b25b !important; }
@media (max-width: 767.98px) {
  .bslib-navs-card-title > span,
  .bslib-navs-card-title > .nav {
    flex: 1 0 100%;
    width: 100%;
    min-width: 0;
  }
}

.snapshot-status { margin: .5rem 1rem; padding: .65rem 1rem; border: 1px solid #cdded4; border-radius: .5rem; background: #f4faf6; color: #245238; font-size: .85rem; display: flex; gap: .5rem 1rem; flex-wrap: wrap; align-items: center; }
.snapshot-status small { display: block; }
/* Consent controls must remain hidden even when their layout class uses flex. */
#nd-analytics-notice[hidden], #nd-analytics-choices[hidden] { display: none !important; }

/* An idle tab keeps its last rendered view until its visitor returns. */
.nd-released #shiny-disconnected-overlay { display: none !important; }
#nd-loading {
  position: fixed; inset: 0; z-index: 100000;
  display: flex; align-items: center; justify-content: center;
  background: var(--bs-body-bg, #fff); color: var(--bs-body-color, #212529);
  font-size: 1.125rem;
}