/* OTSI site-specific styles, loaded after the 6.6.0 template and theme.
   Keep this file small: prefer template classes over custom CSS. */

/* Header logo: keep the OTSI logo a sensible height */
.header-organization-banner .logo-img {
  max-height: 70px;
  width: auto;
}

/* Home page: executive profile cards stack in the right column */
.executive-profile + .executive-profile {
  margin-top: 1rem;
}
/* Round photos: the template's generic "figure > img { width: 100% }" rule
   stretches these into ovals, so lock them to a 100x100 square and crop. */
.executive-profile > img {
  width: 100px;
  height: 100px;
  max-width: none;
  flex-shrink: 0;
  object-fit: cover;
  object-position: center top;
}

/* Keyboard shortcut table on the Accessibility page */
.table kbd {
  white-space: nowrap;
}

/* Home page feature box (strategic plan).
   Uses the theme's secondary color so it follows light/dark mode:
   Santa Cruz = pale blue (#EFF4FA), Ukiah Dark = deep blue (#014A72). */
.otsi-feature {
  background-color: var(--color-s1, #eff4fa);
  color: var(--text-color, inherit);
}

/* Keyboard shortcut labels (Accessibility page): readable in both modes */
kbd {
  color: #fff;
  background-color: #212529;
  border: 1px solid #6c757d;
}