/* Editable-site additions. The existing responsive design is in theme.css.
   Put your own overrides below these rules. No CSS build step is needed. */
html { scroll-behavior: smooth; }
[hidden] { display: none !important; }
[data-editable-menu] a { display: block; padding: .65rem 1rem; }
html:not(.has-site-js) [data-testid="button-mobile-menu"] { display: none; }
html.has-site-js [data-editable-menu]:not([data-open]) { display: none; }
dialog.editable-dialog {
  position: fixed;
  inset: 0;
  transform: none;
  width: min(32rem, calc(100% - 2rem));
  max-width: none;
  height: fit-content;
  max-height: 90dvh;
  margin: auto;
  padding: 1.5rem;
  overflow: auto;
  color: hsl(var(--foreground));
  background: hsl(var(--card));
  border: 1px solid hsl(var(--border));
  border-radius: .75rem;
  box-shadow: 0 20px 60px #0005;
}
dialog.editable-dialog::backdrop { background: #0009; }
body:has(dialog[open]) { overflow: hidden; }
dialog.bulletin-dialog { width: min(72rem, calc(100% - 1rem)); padding: 1rem; }
.popup-heading { display: flex; align-items: center; justify-content: space-between; gap: 1rem; }
.popup-heading h2 { font-size: 1.25rem; font-weight: 700; }
.popup-heading button, .bulletin-toolbar button, .bulletin-page-viewport button,
[data-testid="button-bulletin-metadata-retry"] {
  border: 1px solid hsl(var(--border));
  border-radius: .375rem;
  padding: .4rem .7rem;
  background: hsl(var(--background));
}
.bulletin-toolbar { display: flex; flex-wrap: wrap; justify-content: center; align-items: center; gap: .5rem; margin: 1rem 0; }
.bulletin-toolbar button:disabled { opacity: .45; cursor: not-allowed; }
.bulletin-page-viewport { overflow: auto; max-height: 58dvh; background: #e9e9e9; padding: .5rem; }
.bulletin-page-viewport img { display: block; width: 100%; max-width: none; height: auto; margin: auto; }
.bulletin-downloads { display: flex; flex-wrap: wrap; gap: .5rem 1.25rem; padding-top: 1rem; }
.bulletin-downloads a { color: hsl(var(--primary)); text-decoration: underline; }
dialog p[role="status"], dialog div[role="alert"] { margin: .75rem 0; }
button:focus-visible, a:focus-visible { outline: 2px solid hsl(var(--primary)); outline-offset: 3px; }
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } }

/* Some visual HTML editors wrap iframes in a fixed-size Jodit element.
   Let that wrapper and the map fill the existing map box instead. */
[data-testid="church-map"] > [data-jodit_iframe_wrapper] {
  display: block !important;
  width: 100% !important;
  height: 100% !important;
}
[data-testid="church-map"] iframe {
  display: block;
  width: 100%;
  height: 100%;
  border: 0;
}