/* OneMagic Unified 2.1.3 — final mobile regression fixes. */

/* The legacy theme contains a broad html body header{z-index:100!important} rule.
   This isolated selector must win on every template. */
html body header.omg-global-header{
  position:sticky!important;
  top:0!important;
  z-index:2147483647!important;
  isolation:isolate!important;
}
html body header.omg-global-header .omg-global-menu{
  z-index:2147483647!important;
}
body.admin-bar header.omg-global-header{top:32px!important}
@media(max-width:782px){body.admin-bar header.omg-global-header{top:46px!important}}

@media(max-width:768px){
  html body header.omg-global-header{
    overflow:visible!important;
  }
  html body header.omg-global-header .omg-global-menu{
    background:#fff!important;
    opacity:1!important;
    visibility:visible!important;
    -webkit-backdrop-filter:none!important;
    backdrop-filter:none!important;
  }
  html body header.omg-global-header:not(.is-open) .omg-global-menu{
    display:none!important;
    visibility:hidden!important;
    pointer-events:none!important;
  }
  html body header.omg-global-header.is-open .omg-global-menu{
    display:grid!important;
    visibility:visible!important;
    pointer-events:auto!important;
  }
  .omg-global-toggle:focus-visible,
  .omg-global-menu a:focus-visible{
    outline:3px solid rgba(18,102,255,.32)!important;
    outline-offset:2px!important;
  }

  /* Home: keep the intentional carousels inside their own scroll areas. */
  .omg-rh-task-grid--routes,
  .omg-rh-steps-list--compact{
    overscroll-behavior-x:contain!important;
    scroll-snap-type:x proximity!important;
    scrollbar-width:none!important;
  }
  .omg-rh-task-grid--routes::-webkit-scrollbar,
  .omg-rh-steps-list--compact::-webkit-scrollbar{display:none!important}
  .omg-rh-task-grid--routes > *,
  .omg-rh-steps-list--compact > *{scroll-snap-align:start!important}

  /* Article archive: horizontal topic chips without a visible scrollbar. */
  .omk2-pills{
    overflow-x:auto!important;
    overflow-y:hidden!important;
    overscroll-behavior-x:contain!important;
    scrollbar-width:none!important;
    -webkit-overflow-scrolling:touch!important;
  }
  .omk2-pills::-webkit-scrollbar{display:none!important}

  /* Single articles: the hero must remain compact and below the global menu. */
  body.single-post.sej-action-page .sej-heading-article.om-article-hero{
    z-index:auto!important;
  }
  body.single-post.sej-action-page .om-article-hero-visual{
    display:none!important;
  }
  body.single-post.sej-action-page .sej-article-meta.om-article-meta{
    display:flex!important;
    flex-wrap:wrap!important;
    gap:6px 12px!important;
  }
  body.single-post.sej-action-page .sejournal-article h1.om-article-title,
  body.single-post.sej-action-page .sejournal-article .article-title.om-article-title{
    max-width:100%!important;
    font-size:clamp(29px,8.4vw,34px)!important;
    line-height:1.04!important;
    overflow-wrap:anywhere!important;
    word-break:normal!important;
  }
  body.single-post.sej-action-page .sej-breadcrumb.om-article-breadcrumb{
    flex-wrap:wrap!important;
    overflow-wrap:anywhere!important;
  }
  body.single-post.sej-action-page .om-article-prose img{
    max-width:100%!important;
    height:auto!important;
  }
  body.single-post.sej-action-page .om-article-prose table{
    display:block!important;
    width:100%!important;
    max-width:100%!important;
    overflow-x:auto!important;
    -webkit-overflow-scrolling:touch!important;
  }

  /* Dictionary term page: late v1.3.132 rules reintroduced a 620+280 grid on phones.
     Force the hero and summary card back into normal mobile flow. */
  body.single-dictionary-premium-v137 .term-page__shell--wide{
    display:block!important;
    width:calc(100% - 24px)!important;
    max-width:100%!important;
    margin-inline:auto!important;
  }
  body.single-dictionary-premium-v137 .term-sidebar{
    position:static!important;
    top:auto!important;
    display:block!important;
    width:100%!important;
    max-width:100%!important;
    margin:0 0 20px!important;
    padding:0!important;
    opacity:1!important;
  }
  body.single-dictionary-premium-v137 .term-sidebar__label,
  body.single-dictionary-premium-v137 .term-sidebar__help{display:none!important}
  body.single-dictionary-premium-v137 .term-sidebar__nav{
    display:flex!important;
    gap:8px!important;
    width:100%!important;
    max-width:100%!important;
    padding:2px 0 8px!important;
    overflow-x:auto!important;
    overflow-y:hidden!important;
    scrollbar-width:none!important;
    -webkit-overflow-scrolling:touch!important;
  }
  body.single-dictionary-premium-v137 .term-sidebar__nav::-webkit-scrollbar{display:none!important}
  body.single-dictionary-premium-v137 .term-sidebar__link{
    flex:0 0 auto!important;
    width:auto!important;
    min-height:36px!important;
    margin:0!important;
    padding:8px 12px!important;
    border-radius:999px!important;
    white-space:nowrap!important;
  }
  body.single-dictionary-premium-v137 .term-hero{
    position:relative!important;
    display:grid!important;
    grid-template-columns:minmax(0,1fr)!important;
    row-gap:18px!important;
    width:100%!important;
    min-height:0!important;
    margin:0 0 24px!important;
    padding:0 0 24px!important;
    overflow:visible!important;
    background:transparent!important;
  }
  body.single-dictionary-premium-v137 .term-hero__main{
    width:100%!important;
    max-width:100%!important;
    min-width:0!important;
  }
  body.single-dictionary-premium-v137 .term-hero__title{
    max-width:100%!important;
    font-size:clamp(30px,9vw,38px)!important;
    line-height:1.04!important;
    overflow-wrap:anywhere!important;
  }
  body.single-dictionary-premium-v137 .term-hero__lead{
    max-width:100%!important;
    margin-top:14px!important;
    font-size:15px!important;
    line-height:1.55!important;
  }
  body.single-dictionary-premium-v137 .term-summary{
    position:static!important;
    inset:auto!important;
    transform:none!important;
    width:100%!important;
    min-width:0!important;
    max-width:100%!important;
    min-height:0!important;
    margin:0!important;
    padding:18px!important;
    display:grid!important;
    grid-template-columns:52px minmax(0,1fr)!important;
    column-gap:14px!important;
    row-gap:10px!important;
    overflow:hidden!important;
  }
  body.single-dictionary-premium-v137 .term-summary__mark{
    width:52px!important;
    height:52px!important;
    min-width:52px!important;
    min-height:52px!important;
    justify-self:start!important;
  }
  body.single-dictionary-premium-v137 .term-summary__list > div{
    grid-template-columns:72px minmax(0,1fr)!important;
  }
}

@media(max-width:360px){
  /* Keep the dictionary first screen readable on 320–360px devices. */
  body.sej-dictionary-page .hero__title{
    font-size:34px!important;
    line-height:1.04!important;
    letter-spacing:-.045em!important;
  }
  body.sej-dictionary-page .hero__lead{
    font-size:15px!important;
    line-height:1.5!important;
  }
  body.sej-dictionary-page .dictionary-seo-note h2{
    font-size:20px!important;
    line-height:1.22!important;
  }
  /* The fee row is too compressed at 320px when kept in one line. */
  .omg-rh-fee{
    grid-template-columns:1fr!important;
    gap:6px!important;
  }
  .omg-rh-fee strong{justify-self:start!important}
}

@media(prefers-reduced-motion:reduce){
  .omg-global-toggle span{transition:none!important}
}


@media(max-width:360px){
  body.single-post.sej-action-page .sejournal-article h1.om-article-title,
  body.single-post.sej-action-page .sejournal-article .article-title.om-article-title{
    font-size:28px!important;
    line-height:1.05!important;
  }
}

/* 2.1.3 QA — stable mobile breadcrumbs on single articles. */
@media (max-width: 768px){
  html body.single-post.sej-action-page .sej-breadcrumb.om-article-breadcrumb{
    display:flex!important;
    align-items:center!important;
    flex-wrap:wrap!important;
    gap:4px 7px!important;
    width:100%!important;
    max-width:100%!important;
    margin:0 0 14px!important;
    padding:0!important;
    color:#7d8baa!important;
    font-size:12px!important;
    line-height:1.35!important;
  }
  html body.single-post.sej-action-page .sej-breadcrumb.om-article-breadcrumb > *{
    flex:0 0 auto!important;
    max-width:100%!important;
  }
  html body.single-post.sej-action-page .sej-breadcrumb.om-article-breadcrumb > :last-child{
    flex:1 1 160px!important;
    min-width:0!important;
    overflow-wrap:anywhere!important;
  }
}
