/* App shell tweaks for the Next.js mirror.
   Theme CSS is loaded from /ot-hawaii-2027/styles/OTHI_colors.css (public) so webpack
   does not try to resolve missing Edurock template image URLs. */

html {
  scroll-behavior: smooth;
}

body {
  margin: 0;
}

.site-main {
  min-height: 50vh;
}

/* Mobile header / off-canvas (from top_navigation.html) */
@media (max-width: 991px) {
  .header__area {
    position: relative;
    z-index: 100;
  }

  .mob_menu_wrapper {
    position: relative;
    z-index: 100;
  }

  .mobile-logo {
    position: relative;
    z-index: 101;
  }

  .mobile-off-canvas-active {
    position: fixed;
    z-index: 2000;
  }

  .body-overlay {
    z-index: 1500;
  }

  .mobile-off-canvas .mobile-aside-button {
    position: relative;
    z-index: 2100;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 8px 10px;
    background: rgba(255, 255, 255, 0.9);
    color: #000;
    border: 0;
    border-radius: 4px;
    cursor: pointer;
  }

  .mobile-off-canvas {
    position: fixed;
    top: 18px;
    right: 24px;
    z-index: 2100;
  }

  .mobile-aside-close {
    position: absolute;
    top: 16px;
    right: 16px;
    z-index: 2101;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 36px;
    background: rgba(255, 255, 255, 0.9);
    color: #000;
    border: 0;
    border-radius: 50%;
    cursor: pointer;
  }

  .mobile-menu .dropdown-toggle {
    background: transparent;
    border: 0;
    color: inherit;
    width: 100%;
    text-align: left;
    padding: 0;
    cursor: pointer;
  }
}

/* Newsletter notice on Vercel mirror */
.email-signup-notice a {
  text-decoration: underline;
}

/* Policy iframes */
#autoHeightIframe {
  width: 100%;
  min-height: 80vh;
  border: 0;
}

/* Stova agenda / faculty widget frames, before their content is measured. */
iframe[data-containerid] {
  width: 100%;
  min-height: 70vh;
  border: 0;
}

/* Avoid double horizontal scroll from CMS fragments */
.page-html-content img {
  max-width: 100%;
  height: auto;
}