/* !important: Bootstrap and page focus rules are more specific than element selectors. */
input,
select,
textarea {
  box-shadow: none !important;
}

button,
.btn,
[role="button"],
.btn-cta,
.cta-card-btn,
.btn-deck-cta,
.hud-nav-btn {
  box-shadow: none !important;
}

/* Bootstrap draws the keyboard focus ring with box-shadow; keep focus visible without it. */
button:focus-visible,
.btn:focus-visible,
[role="button"]:focus-visible,
.btn-cta:focus-visible,
.cta-card-btn:focus-visible,
.btn-deck-cta:focus-visible,
.hud-nav-btn:focus-visible {
  outline: 2px solid var(--itv-color-primary, #4c6b00);
  outline-offset: 2px;
}

/* font-size-adjust shrinks the glyphs without changing the computed font-size,
   so line height and control height stay the same as with a real value. */
:root {
  --itv-placeholder-size-adjust: 0.48;
}

::placeholder {
  font-style: italic;
  font-size-adjust: var(--itv-placeholder-size-adjust);
}

select:not([multiple]):has(option[value=""]:checked),
input.itv-empty {
  font-style: italic;
  font-size-adjust: var(--itv-placeholder-size-adjust);
}

select option:not([value=""]) {
  font-style: normal;
  font-size-adjust: none;
}
