/* iSee Ohio brand layer on Bootstrap 5.3. See STYLEGUIDE.md and /style/. */

:root {
  --isee-black: #000;
  --isee-white: #fff;
  --isee-dark-gray: #666;
  --isee-light-green: #e9f7f6;
  --isee-green: #00afa9;
  --isee-bright-green: #06bf9d;
  --isee-dark-green: #1e5959;
  --isee-orange: #e69537;
  --isee-orange-dark: #cf7f22;
  --isee-blue: #6ab5f6;
  --isee-box-shadow: 4px 4px 3.5px 0 #00000075;
  --isee-offset-shadow: 7px 7px 0 var(--isee-dark-green);
  --isee-font: "Gill Sans Nova", "Gill Sans", "Gill Sans MT", "Cabin", Arial, sans-serif;

  /* Bootstrap theme variables */
  --bs-body-font-family: var(--isee-font);
  --bs-body-color: var(--isee-dark-green);
  --bs-body-color-rgb: 30, 89, 89;
  --bs-emphasis-color: var(--isee-dark-green);
  --bs-secondary-color: #4d6b6b;
  --bs-body-bg: #fff;
  --bs-primary: var(--isee-dark-green);
  --bs-primary-rgb: 30, 89, 89;
  --bs-link-color: var(--isee-dark-green);
  --bs-link-color-rgb: 30, 89, 89;
  --bs-link-hover-color: var(--isee-green);
  --bs-link-hover-color-rgb: 0, 175, 169;
  --bs-border-color: #cfe9e6;
  --bs-border-radius: 12px;
  --bs-border-radius-lg: 16px;
  --bs-heading-color: var(--isee-dark-green);
  --bs-focus-ring-color: rgba(0, 175, 169, 0.35);
  --bs-tertiary-bg: var(--isee-light-green);
}

body { background: #fff; font-size: 16px; }
h1, .h1 { color: var(--isee-bright-green); font-weight: 600; letter-spacing: -0.01em; }
h2, .h2, h3, .h3, h4, h5, h6 { font-weight: 600; }
a { text-underline-offset: 2px; }
.muted, .text-muted { color: var(--isee-dark-gray) !important; }

/* Header: white bar, teal strip under it (the site's utility bar) */
.site-header { background: #fff; border-bottom: 6px solid var(--isee-green); }
.site-header .navbar-brand { display: flex; align-items: baseline; gap: .5rem; color: var(--isee-dark-green); }
.wordmark { font-size: 1.6rem; font-weight: 600; color: var(--isee-dark-green); line-height: 1; }
.wordmark .eye { color: var(--isee-bright-green); }
.wordmark-sub { font-size: .8rem; text-transform: uppercase; letter-spacing: .08em; color: var(--isee-green); }
.site-header .nav-link { color: var(--isee-dark-green); font-weight: 600; padding: .4rem .8rem; }
.site-header .nav-link:hover { color: var(--isee-green); }
.site-header .nav-link.active { color: var(--isee-bright-green); }
@media (min-width: 992px) {
  .site-header .navbar-nav .nav-item + .nav-item .nav-link { border-left: 1px solid var(--isee-green); }
}

/* Buttons: pills, like the site */
.btn { border-radius: 40px; font-weight: 600; padding-left: 1.1rem; padding-right: 1.1rem; }
.btn-sm { padding-left: .8rem; padding-right: .8rem; }
.btn-primary {
  --bs-btn-bg: var(--isee-dark-green); --bs-btn-border-color: var(--isee-dark-green);
  --bs-btn-hover-bg: #174646; --bs-btn-hover-border-color: #174646;
  --bs-btn-active-bg: #123838; --bs-btn-active-border-color: #123838;
  --bs-btn-disabled-bg: var(--isee-dark-green); --bs-btn-disabled-border-color: var(--isee-dark-green);
}
.btn-outline-primary {
  --bs-btn-color: var(--isee-dark-green); --bs-btn-border-color: var(--isee-dark-green);
  --bs-btn-hover-bg: var(--isee-dark-green); --bs-btn-hover-border-color: var(--isee-dark-green);
  --bs-btn-active-bg: var(--isee-dark-green); --bs-btn-active-border-color: var(--isee-dark-green);
}
.btn-outline-secondary {
  --bs-btn-color: var(--isee-dark-gray); --bs-btn-border-color: #b9c9c9;
  --bs-btn-hover-bg: var(--isee-light-green); --bs-btn-hover-color: var(--isee-dark-green);
  --bs-btn-hover-border-color: var(--isee-green);
}
.btn-outline-success {
  --bs-btn-color: var(--isee-green); --bs-btn-border-color: var(--isee-green);
  --bs-btn-hover-bg: var(--isee-green); --bs-btn-hover-border-color: var(--isee-green);
}
.btn-cta {
  --bs-btn-color: #fff; --bs-btn-bg: var(--isee-orange); --bs-btn-border-color: #fff;
  --bs-btn-hover-color: #fff; --bs-btn-hover-bg: var(--isee-orange-dark); --bs-btn-hover-border-color: #fff;
  --bs-btn-active-color: #fff; --bs-btn-active-bg: var(--isee-orange-dark);
  text-transform: uppercase; letter-spacing: .03em; border-radius: 12px; box-shadow: var(--isee-box-shadow);
}

/* Cards and panels */
.card { border: 1px solid var(--bs-border-color); border-radius: 12px; }
.card-header { background: #fff !important; border-bottom-color: var(--bs-border-color); color: var(--isee-dark-green); }
.card-header:first-child { border-radius: 12px 12px 0 0; }
.card > .table:last-child, .card > .list-group:last-child { border-radius: 0 0 12px 12px; }
.card-feature { border: 2px solid var(--isee-dark-green); box-shadow: var(--isee-offset-shadow); }
.panel-mint { background: var(--isee-light-green); border-radius: 12px; padding: 1rem 1.25rem; }
.stat .num { color: var(--isee-dark-green); font-weight: 600; }
.stat .label { color: var(--isee-dark-gray); }

/* Tables */
.table { --bs-table-color: var(--isee-dark-green); --bs-table-hover-bg: var(--isee-light-green); }
.table thead th { color: var(--isee-green); border-bottom: 2px solid var(--isee-green); }

/* Badges */
.badge { font-weight: 600; border-radius: 40px; }
.sig-3 { background: var(--isee-orange); color: #fff; }
.sig-2 { background: var(--isee-bright-green); color: #fff; }
.sig-1 { background: #e3ecec; color: var(--isee-dark-green); }
.text-bg-info { background-color: var(--isee-blue) !important; color: #0b2f4d !important; }
.text-bg-success { background-color: var(--isee-green) !important; }
.text-bg-light { background-color: var(--isee-light-green) !important; color: var(--isee-dark-green) !important; }
.text-bg-warning { background-color: #fbe3c4 !important; color: #7a4a10 !important; }
.need-high { background: #d64545; color: #fff; }
.need-mid { background: var(--isee-orange); color: #fff; }

/* Forms */
.form-control:focus, .form-select:focus { border-color: var(--isee-green); box-shadow: 0 0 0 .2rem var(--bs-focus-ring-color); }
.form-check-input:checked { background-color: var(--isee-green); border-color: var(--isee-green); }
.filters { background: var(--isee-light-green); border-radius: 12px; padding: .75rem 1rem 1rem; margin-left: 0; margin-right: 0; }

/* Timeline */
.timeline { border-left-color: var(--isee-green); }

/* InstantSearch in brand colors */
.ais-Pagination-item--selected .ais-Pagination-link { background: var(--isee-dark-green); border-color: var(--isee-dark-green); }
.ais-CurrentRefinements-category { background: var(--isee-light-green); color: var(--isee-dark-green); }
.ais-SearchBox-input:focus { outline: none; border-color: var(--isee-green); box-shadow: 0 0 0 .2rem var(--bs-focus-ring-color); }
.ais-Hits-item { border-radius: 12px; }
.ais-ClearRefinements-button, .ais-RefinementList-showMore { color: var(--isee-green); }
.facet h6 { color: var(--isee-green); }

/* Signal scores */
.score { display: inline-flex; align-items: center; justify-content: center; min-width: 2.4rem; height: 1.6rem;
  padding: 0 .45rem; border-radius: 40px; font-weight: 700; font-size: .85rem; cursor: help; }
.score-hot { background: var(--isee-orange); color: #fff; box-shadow: 2px 2px 0 var(--isee-dark-green); }
.score-warm { background: var(--isee-bright-green); color: #fff; }
.score-cool { background: #e3ecec; color: var(--isee-dark-green); }
.tooltip-inner { max-width: 340px; text-align: left; background: var(--isee-dark-green); }

/* Search map */
#map { height: 460px; border-radius: 0 0 12px 12px; }
.map-bar { background: var(--isee-light-green); border-bottom: 1px solid var(--bs-border-color); border-radius: 12px 12px 0 0; }
.leaflet-container { font-family: var(--isee-font); }
.leaflet-popup-content { margin: 10px 14px; font-size: .9rem; color: var(--isee-dark-green); min-width: 200px; }
.leaflet-popup-content a { color: var(--isee-dark-green); }
.map-legend { background: #fff; padding: 6px 10px; border-radius: 10px; box-shadow: var(--isee-box-shadow); font-size: .8rem; line-height: 1.6; }
.map-legend i { display: inline-block; width: 11px; height: 11px; border-radius: 50%; margin-right: 6px; vertical-align: -1px; border: 1px solid #fff; }
.marker-cluster-small, .marker-cluster-medium, .marker-cluster-large { background-color: rgba(0, 175, 169, .25); }
.marker-cluster-small div, .marker-cluster-medium div, .marker-cluster-large div { background-color: rgba(30, 89, 89, .85); color: #fff; font-weight: 600; }
.clinic-pin { background: var(--isee-orange); border: 3px solid #fff; border-radius: 50%; box-shadow: 2px 2px 0 var(--isee-dark-green); }
/* Calm the basemap so brand-colored markers stand out */
.nearby-map { height: 360px; border-radius: 0 0 12px 12px; }
.focus-pin { background: var(--isee-dark-green); border: 4px solid #fff; border-radius: 50%; box-shadow: 0 0 0 3px var(--isee-bright-green); }
.leaflet-control-layers { font-size: .8rem; border-radius: 10px !important; }

/* Call brief */
.brief { border-left: 6px solid var(--isee-bright-green); }
.brief .card-header { background: var(--isee-light-green) !important; }
.brief-h { font-size: .8rem; text-transform: uppercase; letter-spacing: .05em; color: var(--isee-green); font-weight: 700; margin-bottom: .5rem; }
.moment { padding: .6rem 0 .8rem; border-bottom: 1px dashed var(--bs-border-color); }
.moment:last-of-type { border-bottom: 0; }
.moment-what { font-size: 1.05rem; font-weight: 600; margin-bottom: .2rem; }
.moment-label { font-weight: 600; }
.brief-list { padding-left: 1.1rem; margin-bottom: 0; }
.brief-list li { margin-bottom: .35rem; }
.brief-list.care li::marker { content: "⚠ "; color: var(--isee-orange); }
.opener { border-left: 3px solid var(--isee-orange); background: #fff8ef; padding: .5rem .75rem; margin: 0 0 .6rem; border-radius: 0 8px 8px 0; font-style: italic; }
.brief .card-footer { background: #fff; }
.help-dot { display: inline-flex; width: 1.1rem; height: 1.1rem; border-radius: 50%; align-items: center; justify-content: center;
  font-size: .7rem; font-weight: 700; background: var(--isee-light-green); color: var(--isee-dark-green); cursor: help; vertical-align: 1px; }

/* Timeline and connections */
.story .nav-pills .nav-link { padding: .25rem .9rem; color: var(--isee-dark-green); font-weight: 600; }
.story .nav-pills .nav-link.active { background: var(--isee-dark-green); color: #fff; }
.story-timeline { padding: .5rem; }
.story-graph { height: 420px; }
.vis-timeline { border: 0 !important; font-family: var(--isee-font); color: var(--isee-dark-green); }
.vis-labelset .vis-label { color: var(--isee-dark-green) !important; font-weight: 600; font-size: .85rem; }
.vis-item { border-radius: 8px !important; font-size: .8rem; color: var(--isee-dark-green) !important; }
.vis-item.tl-office { background: var(--isee-light-green); border-color: var(--isee-green); }
.vis-item.tl-registered { background: #d6f3ef; border-color: var(--isee-bright-green); }
.vis-item.tl-name { background: #e3eef9; border-color: var(--isee-blue); }
.vis-item.tl-deactivated { background: #f3e1e1; border-color: #d64545; }
.vis-item.vis-point .vis-dot { border-width: 5px; }
.vis-item.tl-sig-3 .vis-dot { border-color: var(--isee-orange); }
.vis-item.tl-sig-2 .vis-dot { border-color: var(--isee-bright-green); }
.vis-item.tl-sig-1 .vis-dot { border-color: #9fb5b5; }
.vis-time-axis .vis-text { color: var(--isee-dark-gray); }
.door { background: #fff8ef; border: 1px solid #f3d6ae; border-radius: 12px; padding: .6rem .9rem; }
.door-row { padding: .25rem 0; }

/* Connections graph */
.graph-wrap { position: relative; background: #fff; }
.graph-wrap.is-full { display: flex; flex-direction: column; padding: 1rem; }
.graph-wrap.is-full .story-graph { flex: 1; height: auto; }
.story-graph { height: 480px; cursor: grab; outline: none; background:
  radial-gradient(circle at 50% 45%, #f6fbfa 0%, #ffffff 70%); }
.story-graph:focus-visible { box-shadow: inset 0 0 0 2px var(--isee-green); }
.graph-toolbar { position: absolute; top: .6rem; right: .6rem; z-index: 5; display: flex; flex-direction: column; gap: .25rem; }
.graph-toolbar .btn { width: 2.1rem; height: 2.1rem; padding: 0; border-radius: 10px; border: 1px solid var(--bs-border-color);
  font-weight: 700; color: var(--isee-dark-green); box-shadow: 0 1px 2px #00000014; }
.graph-toolbar .btn:hover { background: var(--isee-light-green); }
.graph-legend { position: absolute; top: .6rem; left: .8rem; z-index: 5; display: flex; flex-wrap: wrap; gap: .3rem .8rem;
  max-width: 70%; font-size: .75rem; color: var(--isee-dark-green); background: #ffffffd9; padding: .3rem .5rem; border-radius: 10px; }
.graph-legend .lg { display: inline-block; width: 10px; height: 10px; margin-right: 4px; vertical-align: -1px; border: 1px solid #fff; }
.graph-legend .dot { border-radius: 50%; }
.graph-legend .diamond { background: #06bf9d; transform: rotate(45deg); border-color: #1e5959; }
.graph-legend .star { width: auto; height: auto; border: 0; color: #e69537; font-style: normal; font-size: .85rem; line-height: 1; }
.graph-legend .tri { width: 0; height: 0; border: 0; border-left: 6px solid transparent; border-right: 6px solid transparent; border-bottom: 10px solid #6ab5f6; }
.graph-info { border-top: 1px solid var(--bs-border-color); min-height: 2.6rem; font-size: .9rem; }
div.vis-tooltip { font-family: var(--isee-font); background: var(--isee-dark-green); color: #fff; border: 0; border-radius: 8px; padding: .35rem .6rem; }

/* Print: the call brief and key facts, nothing interactive */
@media print {
  .site-header, footer, .story, .nearby-map, .card:has(.nearby-map), .export-menu, .d-print-none,
  .btn, .help-dot, form, .graph-wrap { display: none !important; }
  body { font-size: 11pt; }
  main { padding: 0 !important; }
  .card { break-inside: avoid; box-shadow: none !important; border: 1px solid #cfd8d8 !important; }
  .brief { border-left: 4px solid #06bf9d !important; }
  a { color: #1e5959 !important; text-decoration: none !important; }
  .col-lg-4, .col-lg-8 { width: 100% !important; }
  .score { box-shadow: none !important; border: 1px solid #1e5959; }
}
