/* Research Innovators — collapse + search preview (?map)
   Every rule is scoped under body.ip-on, which only the gated JS adds,
   so this stylesheet is inert unless the preview is active.
   US-map rules removed 2026-09-09; reference copy in map-reference/. */

body.ip-on {
  --tsc-blue-bright: #086A9B;
  --tsc-blue-deep:   #013865;
  --tsc-navy:        #003A5D;
  --tsc-red-a:       #A31D21;
  --tsc-red-b:       #D5292E;
  --tsc-border:      #CCD8DF;
}

/* retire the old UI under the preview */
body.ip-on .maps-section .select-container,
body.ip-on .map-draw .close-map-draw { display: none !important; }
body.ip-on .map-draw { display: block !important; }
body.ip-on .map-draw .state-info { display: block !important; }

/* ---- search toolbar ----
   Fixed height: it doubles as the scroll sentinel for the floating CTA, so it
   must not collapse when the button inside goes position: fixed. */
body.ip-on .ip-toolbar {
  display: flex; justify-content: center; align-items: center;
  height: 56px; max-width: 900px; margin: 24px auto 8px;
}

body.ip-on .ip-search-open {
  display: inline-flex; align-items: center; gap: 8px;
  margin: 0; padding: 10px 22px;
  background: transparent; color: #fff;
  border: 2px solid #fff; border-radius: 999px !important;
  font-size: 14px; font-weight: 700; text-transform: uppercase; letter-spacing: .06em;
  cursor: pointer; transition: all .18s ease;
}
body.ip-on .ip-search-open:hover { background: #fff; color: var(--tsc-navy); }

/* ---- accordion ---- */
body.ip-on .map-draw .state-info { margin: 0 0 12px; }
body.ip-on .ip-state-toggle {
  display: flex; width: 100%; align-items: center; justify-content: space-between; gap: 16px;
  padding: 12px 18px;
  background: #E3EEF5;
  border-radius: 3px;
  text-align: left; cursor: pointer;
  transition: background .18s ease;
}
body.ip-on .ip-state-toggle:hover { background: #D2E4F0; }
body.ip-on .ip-state-toggle .map-draw-header { margin: 0; }
body.ip-on .ip-state-toggle .map-draw-header h4 { margin: 0; } /* keep theme font/size/color */
body.ip-on .ip-state-meta { display: flex; align-items: center; gap: 14px; flex-shrink: 0; }
body.ip-on .ip-chevron {
  width: 9px; height: 9px;
  border-right: 2px solid var(--tsc-navy); border-bottom: 2px solid var(--tsc-navy);
  transform: rotate(45deg); transition: transform .2s ease; margin-top: -4px;
}
body.ip-on .state-info:not(.ip-collapsed) .ip-chevron { transform: rotate(225deg); margin-top: 4px; }
body.ip-on .state-info.ip-collapsed .top { display: none; }
body.ip-on .state-info .ip-state-toggle + .top { padding-top: 10px; }

body.ip-on .company-info-box li.ip-flash { animation: ip-flash 2.4s ease; }
@keyframes ip-flash {
  0%, 55% { background: rgba(213, 41, 46, .12); box-shadow: inset 4px 0 0 var(--tsc-red-b); }
  100% { background: transparent; box-shadow: none; }
}

/* ---- slide-out search ---- */
body.ip-on .ip-search-panel {
  position: fixed; top: 0; right: 0; z-index: 999;
  width: 380px; max-width: 92vw; height: 100vh;
  background: #fff; box-shadow: -8px 0 32px rgba(0, 28, 44, .25);
  transform: translateX(102%); transition: transform .28s ease;
  display: flex; flex-direction: column; padding: 22px;
}
body.ip-on .ip-search-panel.ip-open { transform: translateX(0); }
body.ip-on .ip-search-head { display: flex; align-items: center; justify-content: space-between; margin-bottom: 14px; }
body.ip-on .ip-search-head h4 { margin: 0; padding: 0; color: var(--tsc-navy); font-size: 19px; line-height: 1; transform: translateY(2px); } /* Fjalla One renders high in its em box */
body.ip-on .ip-search-close {
  display: flex; align-items: center; justify-content: center;
  background: none; border: 0; color: var(--tsc-navy);
  font-size: 20px; line-height: 1; cursor: pointer; padding: 4px 8px; margin: 0;
}
body.ip-on .ip-search-input {
  width: 100%; padding: 12px 14px;
  border: 2px solid var(--tsc-border); border-radius: 4px;
  font-size: 15px; color: var(--tsc-navy);
}
body.ip-on .ip-search-input:focus { border-color: var(--tsc-blue-bright); outline: none; }
body.ip-on .ip-search-results { margin-top: 12px; overflow-y: auto; flex: 1; }
body.ip-on .ip-result-state {
  display: flex; justify-content: space-between; align-items: center;
  padding: 10px 12px; margin-top: 10px;
  background: var(--tsc-navy); color: #fff; border-radius: 3px;
  font-size: 13px; font-weight: 700; text-transform: uppercase; letter-spacing: .05em;
  cursor: pointer;
}
body.ip-on .ip-result-person {
  padding: 9px 12px; border-bottom: 1px solid var(--tsc-border); cursor: pointer;
}
body.ip-on .ip-result-person:hover { background: rgba(8, 106, 155, .07); }
body.ip-on .ip-result-person strong { display: block; color: var(--tsc-navy); font-size: 14px; }
body.ip-on .ip-result-person em { display: block; color: #5b6f7d; font-size: 12.5px; font-style: normal; margin-top: 2px; }
body.ip-on .ip-no-results { padding: 18px 6px; color: #5b6f7d; font-size: 14px; }

@media (max-width: 640px) {
  body.ip-on .ip-state-toggle { font-size: 15px; padding: 13px 14px; }
}

/* ---- keyboard focus + reduced motion ---- */
body.ip-on .ip-state-toggle:focus-visible,
body.ip-on .ip-result-state:focus-visible,
body.ip-on .ip-result-person:focus-visible,
body.ip-on .ip-search-open:focus-visible,
body.ip-on .ip-search-close:focus-visible {
  outline: 3px solid var(--tsc-blue-bright); outline-offset: 2px;
}
@media (prefers-reduced-motion: reduce) {
  body.ip-on .ip-search-panel, body.ip-on .ip-state-toggle { transition: none; }
}

/* ---- floating search CTA after scrolling past the toolbar ---- */
body.ip-on .ip-search-open .ip-search-label { margin-left: 8px; }
body.ip-on .ip-search-open.ip-floating {
  position: fixed; right: 18px; top: 50%; transform: translateY(-50%); z-index: 998;
  width: 56px; height: 56px; padding: 0; justify-content: center;
  background: var(--tsc-navy); color: #fff; border-color: var(--tsc-navy); border-radius: 50% !important;
  font-size: 22px;
  box-shadow: 0 6px 24px rgba(0, 28, 44, .35);
}
body.ip-on .ip-search-open.ip-floating .ip-search-label {
  position: absolute; width: 1px; height: 1px; overflow: hidden;
  clip: rect(0 0 0 0); white-space: nowrap; margin: 0; /* visually hidden, still read by screen readers */
}
body.ip-on .ip-search-open.ip-floating:hover { background: var(--tsc-blue-deep); color: #fff; }
body.ip-on.ip-panel-open .ip-search-open.ip-floating { display: none; }
