/* EtkinMadde v7.4: one shared site header + longer scenic hero. */
/* Shared desktop navigation, independent of the old is-home/is-inner layers. */
body .site-header,
body.single-em_drug .site-header{
    position:relative!important;
    top:auto!important;
    left:auto!important;
    right:auto!important;
    z-index:90!important;
    min-height:82px;
    height:auto;
    margin:0!important;
    background:#fff!important;
    border:0;
    border-bottom:1px solid #e5edf6;
    border-radius:0!important;
    backdrop-filter:none!important;
    box-shadow:0 6px 18px rgba(24,53,87,.035);
}
body .site-header .header-inner.is-home,
body .site-header .header-inner.is-inner{
    display:grid!important;
    grid-template-columns:minmax(176px,220px) minmax(280px,560px) minmax(278px,1fr)!important;
    grid-template-rows:auto!important;
    grid-template-areas:'logo search nav'!important;
    align-items:center;
    justify-content:space-between;
    gap:24px;
    width:min(1190px,calc(100% - 36px));
    min-height:82px;
    height:auto;
    margin:0 auto;
    padding:9px 0;
    background:transparent!important;
    box-shadow:none!important;
    border:0!important;
    border-radius:0!important;
}
body .site-header .brand{
    grid-area:logo!important;
    width:auto;
    min-width:0;
    max-width:220px;
    flex:initial;
    justify-self:start;
    margin:0;
}
body .site-header .brand img{
    display:block;
    width:210px;
    max-width:100%;
    height:auto;
}
body .site-header .header-search-wrap{
    grid-area:search!important;
    grid-column:auto!important;
    grid-row:auto!important;
    width:100%!important;
    min-width:0;
    max-width:560px!important;
    margin:0!important;
    padding:0;
    order:unset!important;
    justify-self:center!important;
}
body .site-header .header-search-wrap .search-form{
    display:flex;
    width:100%;
    min-width:0;
    min-height:52px;
    height:52px;
    padding:4px 4px 4px 12px;
    margin:0;
    border:1px solid #d8e3f0;
    background:#fff;
    border-radius:14px;
    box-shadow:0 6px 17px rgba(20,46,78,.045);
}
body .site-header .header-search-wrap .search-form input[type=search]{
    min-width:0;
    width:100%;
    flex:1 1 0;
    height:42px;
    padding:0 7px!important;
    border:0;
    background:transparent;
    font-size:13px;
}
body .site-header .header-search-wrap .search-form>button{
    flex:0 0 79px;
    min-width:79px;
    height:42px;
    padding:0 13px;
    border-radius:10px;
    font-size:13px;
}
body .site-header .header-nav{
    grid-area:nav!important;
    grid-column:auto!important;
    grid-row:auto!important;
    display:flex;
    position:static;
    width:auto;
    min-width:0;
    flex-direction:row;
    align-items:center;
    justify-content:flex-end;
    justify-self:end!important;
    flex-wrap:nowrap;
    gap:20px;
    padding:0;
    margin:0!important;
    overflow:visible;
    border:0;
    background:transparent;
    box-shadow:none;
}
body .site-header .header-nav a{
    position:relative;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    height:48px;
    padding:12px 0;
    border:0;
    font-size:13px;
    font-weight:760;
    line-height:1.4;
    white-space:nowrap;
    color:#26364c;
}
body .site-header .header-nav a:hover,
body .site-header .header-nav a[aria-current=page]{color:#e01030}
body .site-header .header-nav a[aria-current=page]::after{
    content:'';
    position:absolute;
    bottom:0;
    left:0;
    right:0;
    height:2px;
    background:#e01030;
    border-radius:2px;
}
body .site-header .menu-button{display:none!important}

/* Both inner page types use the SAME full-width wallpaper, fading only near its end. */
body.single-emr_ingredient .em50-page,
body.single-em_drug .em72-page {position:relative;isolation:isolate;background:#f3f6fa}
body.single-emr_ingredient .em50-page>.em50-scene,
body.single-em_drug .em72-page>.em72-scene {
    display:block;
    position:absolute!important;
    top:0!important;
    left:0!important;
    right:0!important;
    z-index:-1!important;
    height:910px!important;
    width:100%!important;
    background-image:
       linear-gradient(to bottom,
          rgba(243,246,250,0) 0%,
          rgba(243,246,250,0) 58%,
          rgba(243,246,250,.08) 70%,
          rgba(243,246,250,.42) 83%,
          rgba(243,246,250,.82) 93%,
          #f3f6fa 100%),
       url('../img/hero-full-bg.webp')!important;
    background-repeat:no-repeat!important;
    background-position:center top!important;
    background-size:cover!important;
    pointer-events:none;
}
/* Keep article cards above the image; preserve breadcrumb's normal document flow. */
body.single-emr_ingredient .em50-page>.em50-shell,
body.single-em_drug .em72-page>.em72-shell{position:relative;z-index:1}
@media(max-width:980px){
    body .site-header .header-inner.is-home,
    body .site-header .header-inner.is-inner{
        grid-template-columns:minmax(160px,185px) minmax(200px,1fr) minmax(245px,auto)!important;
        gap:15px;
        min-height:78px;
        padding:7px 0;
    }
    body .site-header .brand img{width:180px}
    body .site-header .header-nav{gap:14px}
    body .site-header .header-nav a{font-size:12px}
    body .site-header .header-search-wrap .search-form>button{flex-basis:69px;min-width:69px}
}
@media(max-width:760px){
    body .site-header .header-inner.is-home,
    body .site-header .header-inner.is-inner{
        position:relative;
        grid-template-columns:minmax(0,1fr) 46px!important;
        grid-template-rows:auto auto;
        grid-template-areas:'logo toggle' 'search search'!important;
        gap:10px 8px;
        width:calc(100% - 26px);
        min-height:0;
        padding:10px 0;
    }
    body .site-header .brand{max-width:220px}
    body .site-header .brand img{width:185px}
    body .site-header .menu-button{
        display:flex!important;
        grid-area:toggle;
        align-items:center;
        justify-content:center;
        justify-self:end;
        width:43px;
        height:43px;
        margin:0;
        padding:0;
        border:1px solid #dae4f0;
        border-radius:10px;
        background:#fff;
    }
    body .site-header .header-search-wrap{
        justify-self:stretch!important;
        max-width:none!important;
    }
    body .site-header .header-nav{
        display:none!important;
        position:absolute!important;
        top:calc(100% - 4px)!important;
        left:0;
        right:0;
        width:100%;
        margin:0!important;
        padding:8px 14px 14px;
        flex-direction:column;
        gap:0;
        background:#fff;
        border:1px solid #dee8f2;
        border-radius:13px;
        box-shadow:0 14px 27px rgba(17,30,45,.14);
        z-index:120;
    }
    body .site-header .header-nav.is-open{display:flex!important}
    body .site-header .header-nav a{width:100%;height:auto;padding:13px 4px;justify-content:flex-start;border-bottom:1px solid #edf2f6}
    body .site-header .header-nav a[aria-current=page]::after{display:none}
    body .site-header .header-nav a:last-child{border-bottom:0}
    body.single-emr_ingredient .em50-page>.em50-scene,
    body.single-em_drug .em72-page>.em72-scene{height:720px!important}
}
@media(max-width:410px){
    body .site-header .brand img{width:160px}
    body .site-header .header-search-wrap .search-form>button{min-width:67px!important;flex:0 0 67px;font-size:12px}
    body.single-emr_ingredient .em50-page>.em50-scene,
    body.single-em_drug .em72-page>.em72-scene{height:650px!important}
}

/* Older drug styles contained !important named grid areas (brand/menu). Override
   them explicitly so the V7.4 shared header also applies to drug details. */
@media(min-width:761px){
  html body.single-em_drug .site-header .header-inner.is-inner{
    display:grid!important;
    grid-template-columns:minmax(176px,220px) minmax(280px,560px) minmax(278px,1fr)!important;
    grid-template-rows:auto!important;
    grid-template-areas:'logo search nav'!important;
    gap:24px!important;
    padding:9px 0!important;
    width:min(1190px,calc(100% - 36px))!important;
    min-height:82px!important;
  }
  html body.single-em_drug .site-header .brand{grid-area:logo!important;justify-self:start!important}
  html body.single-em_drug .site-header .header-search-wrap{grid-area:search!important;justify-self:center!important}
  html body.single-em_drug .site-header .header-nav{display:flex!important;grid-area:nav!important;justify-self:end!important;position:static!important;width:auto!important;flex-direction:row!important}
  html body.single-em_drug .site-header .menu-button{display:none!important;grid-area:auto!important}
}
@media(min-width:761px) and (max-width:980px){
  html body.single-em_drug .site-header .header-inner.is-inner{
    grid-template-columns:minmax(160px,185px) minmax(200px,1fr) minmax(245px,auto)!important;
    min-height:78px!important;
    gap:15px!important;
    padding:7px 0!important;
  }
}
@media(max-width:760px){
  html body.single-em_drug .site-header .header-inner.is-inner{
    position:relative!important;
    grid-template-columns:minmax(0,1fr) 46px!important;
    grid-template-rows:auto auto!important;
    grid-template-areas:'logo toggle' 'search search'!important;
    gap:10px 8px!important;
    width:calc(100% - 26px)!important;
    min-height:0!important;
    padding:10px 0!important;
  }
  html body.single-em_drug .site-header .brand{grid-area:logo!important;justify-self:start!important}
  html body.single-em_drug .site-header .header-search-wrap{grid-area:search!important;width:100%!important}
  html body.single-em_drug .site-header .menu-button{display:flex!important;grid-area:toggle!important;justify-self:end!important}
  html body.single-em_drug .site-header .header-nav{
    grid-area:unset!important;
    display:none!important;
    position:absolute!important;
    top:calc(100% - 4px)!important;
    left:0!important;
    right:0!important;
    width:100%!important;
    flex-direction:column!important;
  }
  html body.single-em_drug .site-header .header-nav.is-open{display:flex!important}
}