/* Fixes on top of the exported WordPress / Elementor styles. Loaded last on every page. */

/* Keyboard users can always see where they are. */
a:focus-visible,
button:focus-visible,
summary:focus-visible,
[tabindex]:focus-visible {
  outline: 2px solid #86661c;
  outline-offset: 2px;
}

/* Wide tables scroll inside their own box on small screens instead of widening the page. */
.table-scroll {
  max-width: 100%;
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
}
.table-scroll table {
  margin: 0;
}
.table-scroll td,
.table-scroll th {
  overflow-wrap: break-word;
}
@media (max-width: 480px) {
  /* !important beats the padding written inline on each cell. */
  .table-scroll td,
  .table-scroll th {
    padding: 8px 6px !important;
    font-size: 0.9em;
    hyphens: auto;
  }
}

/* Long words never push the page sideways. */
.wp-block-post-content,
.elementor-widget-text-editor {
  overflow-wrap: break-word;
}

/* Bigger tap areas on phones (at least 44px), without changing how anything looks. */
.wp-block-navigation__responsive-container-open,
.wp-block-navigation__responsive-container-close,
.wp-block-details > summary {
  position: relative;
}
.wp-block-navigation__responsive-container-open::before,
.wp-block-navigation__responsive-container-close::before {
  content: "";
  position: absolute;
  inset: -10px;
}
.wp-block-details > summary::before {
  content: "";
  position: absolute;
  inset: -9px 0;
}

iframe {
  border: 0;
  max-width: 100%;
}

/* Headings whose level was corrected keep the size they had before. */
.heading-size-h3 { font-size: var(--wp--preset--font-size--large); }
.heading-size-h4 { font-size: clamp(1.1rem, 1.1rem + ((1vw - 0.2rem) * 0.767), 1.5rem); }
.heading-size-h5 { font-size: var(--wp--preset--font-size--medium); }

/* Respect "reduce motion" in the operating system. */
@media (prefers-reduced-motion: reduce) {
  *,
  *::before,
  *::after {
    animation-duration: 0.01ms !important;
    transition-duration: 0.01ms !important;
    scroll-behavior: auto !important;
  }
}
