/* STAC Browser — Thünen theme overlay.
   Injected into index.html via nginx sub_filter; overrides Bootstrap 5 CSS
   variables to match the Thünen/ThEO look (see landing page). */

@font-face {
  font-family: 'SourceSansPro';
  font-weight: 400;
  font-display: swap;
  src: url('assets/fonts/SourceSansPro-Regular.woff2') format('woff2');
}
@font-face {
  font-family: 'SourceSansPro';
  font-weight: 600;
  font-display: swap;
  src: url('assets/fonts/SourceSansPro-SemiBold.woff2') format('woff2');
}
@font-face {
  font-family: 'SourceSansPro';
  font-weight: 700;
  font-display: swap;
  src: url('assets/fonts/SourceSansPro-Bold.woff2') format('woff2');
}

:root {
  --bs-primary: #008cd2;
  --bs-primary-rgb: 0, 140, 210;
  --bs-primary-bg-subtle: #e8f6fd;
  --bs-primary-text-emphasis: #006ba3;
  --bs-body-bg: #ffffff;
  --bs-body-color: #151819;
  --bs-body-font-family: 'SourceSansPro', system-ui, -apple-system, "Segoe UI",
    Roboto, "Helvetica Neue", Arial, "Noto Sans", sans-serif;
  --bs-body-font-weight: 400;
  --bs-body-line-height: 1.5;
  --bs-link-color: #008cd2;
  --bs-link-hover-color: #0078b8;
  --bs-secondary-color: #5b6b72;
  --bs-secondary-bg: #f2f5f6;
  --bs-tertiary-color: #3a454b;
  --bs-tertiary-bg: #f7f9fa;
  --bs-emphasis-color: #151819;
  --bs-border-radius: 0;
  --bs-border-radius-sm: 0;
  --bs-border-radius-lg: 0;
  --bs-btn-border-radius: 0;
  --bs-card-border-radius: 0;
  --bs-navbar-color: #151819;
  --bs-navbar-hover-color: #008cd2;
  --bs-navbar-active-color: #008cd2;
  --bs-navbar-brand-color: #151819;
  --bs-navbar-brand-hover-color: #008cd2;
  --bs-headings-color: #151819;
}

html {
  color-scheme: light;
}

/* Header bar (site row): turquoise #188191 -> Thünen blue */
:root {
  --sb-header: #008cd2;
  --sb-header-background: var(--sb-header);
  --sb-header-color: #ffffff;
  --sb-header-hover-color: #ffffff;
  --sb-header-button-border-color: rgba(255, 255, 255, 0.55);
  --sb-header-button-hover-background: rgba(255, 255, 255, 0.15);
  --sb-header-button-active-background: rgba(255, 255, 255, 0.25);
}

/* Title: no drop shadow */
#stac-browser>header .site>.col-md-12>.title {
  text-shadow: none;
}

body {
  font-family: 'SourceSansPro', system-ui, -apple-system, "Segoe UI", Roboto,
    "Helvetica Neue", Arial, sans-serif;
  color: #151819;
  background-color: #ffffff;
}

/* Neutralize any dark-mode application (belt and suspenders) */
html[data-theme="dark"],
body[data-theme="dark"],
html[data-bs-theme="dark"],
body[data-bs-theme="dark"] {
  --bs-body-bg: #ffffff;
  --bs-body-color: #151819;
  --bs-secondary-color: #5b6b72;
  --bs-secondary-bg: #f2f5f6;
  --bs-tertiary-color: #3a454b;
  --bs-tertiary-bg: #f7f9fa;
  --bs-emphasis-color: #151819;
  color: #151819;
  background-color: #ffffff;
}

/* Square, Thünen-blue primary buttons */
.btn-primary {
  --bs-btn-bg: #008cd2;
  --bs-btn-border-color: #008cd2;
  --bs-btn-hover-bg: #0078b8;
  --bs-btn-hover-border-color: #0078b8;
  --bs-btn-active-bg: #0078b8;
  --bs-btn-active-border-color: #0078b8;
  --bs-btn-disabled-bg: #008cd2;
  --bs-btn-disabled-border-color: #008cd2;
  border-radius: 0;
}

a {
  color: #008cd2;
}

a:hover {
  color: #0078b8;
}

/* Green accent for badges/indicators (Thünen green) */
.badge {
  --bs-badge-color: #ffffff;
  --bs-badge-bg-color: #78be1e;
}

/* Cards: sharp corners, subtle border */
.card {
  border-radius: 0;
  border-color: #d9dfe6;
}

/* Make headings inherit the Source Sans Pro weight */
h1, h2, h3, h4, h5, h6, .navbar-brand {
  font-weight: 600;
}

/* Light code blocks (JSON/metadata previews) */
.codebox,
.card-code,
pre,
pre.code,
.hljs {
  background-color: #f5f7f8 !important;
  color: #1f2d33 !important;
  border-color: #d9dfe6 !important;
}

.codebox a,
.card-code a {
  color: #008cd2 !important;
}

/* ── Neutralize remaining turquoise (#188191) ──────────────────────────
   Bootstrap compiled its $primary SCSS variable into concrete values in
   active states, form controls and focus rings; override them all. */

:root {
  --bs-dropdown-link-active-bg: #008cd2;
  --bs-pagination-active-bg: #008cd2;
  --bs-progress-bar-bg: #008cd2;
  --bs-list-group-active-bg: #008cd2;
  --bs-list-group-active-border-color: #008cd2;
}

.nav-pills {
  --bs-nav-pills-link-active-bg: #008cd2;
  --bs-nav-pills-link-active-color: #ffffff;
}

.dropdown-item.active,
.dropdown-item:active {
  --bs-dropdown-link-active-bg: #008cd2;
}

.page-link.active {
  --bs-pagination-active-bg: #008cd2;
  --bs-pagination-active-border-color: #008cd2;
}

.list-group-item.active {
  --bs-list-group-active-bg: #008cd2;
  --bs-list-group-active-border-color: #008cd2;
}

.btn-outline-primary {
  --bs-btn-color: #008cd2;
  --bs-btn-border-color: #008cd2;
  --bs-btn-hover-bg: #008cd2;
  --bs-btn-hover-border-color: #008cd2;
  --bs-btn-active-bg: #008cd2;
  --bs-btn-active-border-color: #008cd2;
}

.form-check-input:checked {
  background-color: #008cd2;
  border-color: #008cd2;
}

.form-check-input:indeterminate {
  background-color: #008cd2;
  border-color: #008cd2;
}

.form-range::-webkit-slider-thumb {
  background-color: #008cd2;
  border-color: #008cd2;
}

.form-range::-moz-range-thumb {
  background-color: #008cd2;
  border-color: #008cd2;
}

.nav-link:focus-visible {
  box-shadow: 0 0 0 0.25rem rgba(0, 140, 210, 0.25);
}