/* ==== Responsive + mobile fixes for classic Weebly table themes (IDDC mirror) ==== */
img { max-width: 100%; height: auto; }
.wslide-slide img { max-width: none; } /* keep slideshow inner sizing intact */

/* Slideshow arrows (created by site.js). The glyph is drawn via ::before, NOT text
   content: pseudo-element content is excluded from innerText/textContent, so the
   rendered text layer keeps the exact capture content order (Play/Pause/arrow text
   between content lines otherwise breaks sequential content verification).
   Accessibility label is set by site.js via aria-label. */
.wslide-arrow {
  position: absolute; top: 50%; transform: translateY(-50%); z-index: 50;
  background: rgba(74, 71, 67, 0.75); color: #fff; border: none;
  font-size: 26px; line-height: 1; padding: 10px 13px; cursor: pointer; border-radius: 3px;
  font-family: Arial, sans-serif;
  min-width: 44px; min-height: 44px; /* touch-friendly hit target */
}
/* horizontal swipes are handled by site.js; vertical page scroll stays native */
.wslide-content { touch-action: pan-y; }
.wslide-arrow::before { display: block; }
.wslide-arrow-left::before { content: "\2039"; }
.wslide-arrow-right::before { content: "\203A"; }
.wslide-arrow:hover { background: rgba(110, 83, 0, 0.9); }
.wslide-arrow-left { left: 6px; }
.wslide-arrow-right { right: 6px; }

/* Weebly runtime slideshow controls (Play/Pause/prev/next inside .wslide-button-wrap)
   are editor chrome: every one of them is display:none in the source capture. They
   carry only control text ("Play", "Pause") and icons -- no page content. Pin them
   hidden (with !important so runtime inline styles from main.js cannot surface them)
   so they can never inject stray text between content lines. */
.wslide .wslide-button-wrap { display: none !important; }

/* Mobile menu toggle (hidden on desktop; shown <=767px) */
#mobile-nav-toggle {
  display: none;
  -webkit-appearance: none; appearance: none;
  background: #4a4743; color: #fff; border: 1px solid #6e5300;
  font-family: inherit; font-size: 16px; padding: 9px 18px; margin: 6px auto;
  border-radius: 4px; cursor: pointer;
}
body.nav-open #mobile-nav-toggle { background: #6e5300; }

/* Desktop MORE dropdown (revealed by site.js; wrap lives at end of body) */
#wsite-menus { position: absolute; top: 0; left: 0; z-index: 9999; }
#wsite-menus .wsite-menu-wrap { min-width: 180px; }
.wsite-menu-default > li.wsite-nav-more > a.wsite-menu-item { cursor: pointer; }
.wsite-menu-default > li.wsite-nav-more:hover > a.wsite-menu-item,
.wsite-menu-default > li.wsite-nav-more-open > a.wsite-menu-item { color: #6e5300; }

@media screen and (max-width: 991px) {
  /* the single width driver of the theme */
  .icontent_container .container {
    width: 100% !important; min-width: 0 !important; max-width: 100% !important;
    box-sizing: border-box !important; padding-left: 10px !important; padding-right: 10px !important;
  }
  .icontent_container #nav-wrap { padding: 10px 0 !important; }
  .icontent_container #nav-wrap .container { overflow: visible !important; }
  .icontent_container #nav-wrap .container ul { float: none !important; }

  #mobile-nav-toggle { display: inline-block; position: relative; z-index: 60; }

  /* neutralize fixed table chrome: header/footer stack vertically */
  table#header { width: 100% !important; }
  table#header > tbody, table#header > tbody > tr, table#header > tbody > tr > td,
  table#footer, table#footer > tbody, table#footer > tbody > tr, table#footer > tbody > tr > td {
    display: block !important; width: 100% !important; float: none !important;
  }
  td#logo { text-align: center !important; padding: 12px 0 !important; }
  td#logo img { max-height: 90px; width: auto; }
  td#nav { text-align: center !important; padding: 0 !important; }

  /* stacked nav, toggle via body.nav-open */
  ul.wsite-menu-default { display: none; }
  body.nav-open ul.wsite-menu-default { display: block; margin: 0; padding: 0 8px 8px; }
  ul.wsite-menu-default > li { display: block !important; width: 100% !important; float: none !important; position: static !important; }
  /* children are flattened inline, so the "more..." trigger is redundant and
     its absolutely-positioned dropdown must not fire on mobile */
  ul.wsite-menu-default > li.wsite-nav-more { display: none !important; }
  ul.wsite-menu-default > li > a { display: block !important; padding: 12px 4px !important; border-bottom: 1px solid rgba(0, 0, 0, 0.12); }
  /* dropdown children expand inline */
  ul.wsite-menu-default ul {
    position: static !important; display: block !important; visibility: visible !important;
    opacity: 1 !important; left: auto !important; top: auto !important;
  }
  ul.wsite-menu-default ul > li > a { padding: 9px 18px !important; font-size: 95% !important; }

  /* banner shrinks */
  #banner { min-height: 150px !important; height: auto !important; background-size: cover !important; }
  #banner .wsite-header { min-height: 150px !important; }

  /* multi-column element tables stack */
  table.wsite-multicol-table, .wsite-multicol-table-wrap,
  table.wsite-multicol-table > tbody, table.wsite-multicol-table > tbody > tr,
  table.wsite-multicol-table > tbody > tr > td, td.wsite-multicol-col {
    display: block !important; width: 100% !important; max-width: 100% !important;
    box-sizing: border-box !important;
  }

  /* banner header image scales down */
  #banner .wsite-header, .wsite-header { width: 100% !important; max-width: 100% !important; background-size: cover !important; }
  #banner { max-width: 100% !important; }

  body { font-size: 95% !important; }
  .wsite-content-title { font-size: 130% !important; }
}
