/* 22Media Premium Pro v6.75 — collision-proof mobile masthead + true ad-fill visibility */

/*
 * Mobile masthead is kept physically LTR even inside the Urdu RTL application.
 * This gives the three UI zones deterministic real estate:
 *   menu | centered brand | account + search
 * RTL still applies to the rest of the site/content.
 */
@media (max-width:980px){
  .m22-header-v66 .m22-header-main-v6{
    direction:ltr!important;
    display:grid!important;
    grid-template-columns:50px minmax(0,1fr) 92px!important;
    align-items:center!important;
    column-gap:8px!important;
    width:100%!important;
    max-width:100%!important;
    min-width:0!important;
    height:72px!important;
    min-height:72px!important;
    padding:0 9px!important;
    box-sizing:border-box!important;
    overflow:hidden!important;
  }
  .m22-header-v66 .m22-header-left-action{display:none!important}

  .m22-header-v66 .m22-menu-toggle{
    grid-column:1!important;
    grid-row:1!important;
    position:static!important;
    inset:auto!important;
    transform:none!important;
    justify-self:start!important;
    align-self:center!important;
    width:42px!important;
    min-width:42px!important;
    max-width:42px!important;
    height:42px!important;
    margin:0!important;
    z-index:3!important;
  }

  .m22-header-v66 .m22-brand-horizontal{
    grid-column:2!important;
    grid-row:1!important;
    position:static!important;
    inset:auto!important;
    transform:none!important;
    justify-self:center!important;
    align-self:center!important;
    width:min(172px,100%)!important;
    min-width:0!important;
    max-width:172px!important;
    height:54px!important;
    margin:0!important;
    padding:5px 8px!important;
    box-sizing:border-box!important;
    overflow:hidden!important;
    z-index:2!important;
  }
  .m22-header-v66 .m22-brand-square{display:none!important}
  .m22-header-v66 .m22-brand-wordmark{
    display:flex!important;
    width:100%!important;
    min-width:0!important;
    height:100%!important;
    align-items:center!important;
    justify-content:center!important;
  }
  .m22-header-v66 .m22-brand-wordmark .m22-logo-image{
    display:block!important;
    width:100%!important;
    max-width:158px!important;
    height:42px!important;
    max-height:42px!important;
    margin:0 auto!important;
    object-fit:contain!important;
    object-position:center!important;
  }
  .m22-header-v66 .m22-brand-caption{display:none!important}

  .m22-header-v66 .m22-header-actions-v66{
    grid-column:3!important;
    grid-row:1!important;
    direction:rtl!important;
    position:static!important;
    inset:auto!important;
    transform:none!important;
    justify-self:end!important;
    align-self:center!important;
    display:grid!important;
    grid-template-columns:repeat(2,42px)!important;
    align-items:center!important;
    justify-content:end!important;
    gap:5px!important;
    width:89px!important;
    min-width:89px!important;
    max-width:89px!important;
    margin:0!important;
    padding:0!important;
    z-index:4!important;
  }
  .m22-header-v66 .m22-header-actions-v66>.m22-header-compact-link,
  .m22-header-v66 .m22-header-actions-v66>.m22-theme-toggle{display:none!important}
  .m22-header-v66 .m22-header-actions-v66 .m22-search-toggle,
  .m22-header-v66 .m22-header-actions-v66 .m22-account-btn{
    position:static!important;
    inset:auto!important;
    transform:none!important;
    display:grid!important;
    place-items:center!important;
    width:42px!important;
    min-width:42px!important;
    max-width:42px!important;
    height:42px!important;
    min-height:42px!important;
    max-height:42px!important;
    margin:0!important;
    padding:0!important;
    flex:none!important;
    box-sizing:border-box!important;
  }
  .m22-header-v66 .m22-header-actions-v66 .m22-account-btn span{display:none!important}
}

@media (max-width:420px){
  .m22-header-v66 .m22-header-main-v6{
    grid-template-columns:46px minmax(0,1fr) 84px!important;
    column-gap:6px!important;
    padding:0 7px!important;
  }
  .m22-header-v66 .m22-menu-toggle{width:40px!important;min-width:40px!important;max-width:40px!important;height:40px!important}
  .m22-header-v66 .m22-brand-horizontal{
    width:min(160px,100%)!important;
    max-width:160px!important;
    height:52px!important;
    padding:5px 7px!important;
  }
  .m22-header-v66 .m22-brand-wordmark .m22-logo-image{max-width:146px!important;height:40px!important;max-height:40px!important}
  .m22-header-v66 .m22-header-actions-v66{
    grid-template-columns:repeat(2,39px)!important;
    gap:4px!important;
    width:82px!important;
    min-width:82px!important;
    max-width:82px!important;
  }
  .m22-header-v66 .m22-header-actions-v66 .m22-search-toggle,
  .m22-header-v66 .m22-header-actions-v66 .m22-account-btn{
    width:39px!important;min-width:39px!important;max-width:39px!important;
    height:39px!important;min-height:39px!important;max-height:39px!important;
  }
}

@media (max-width:360px){
  .m22-header-v66 .m22-header-main-v6{
    grid-template-columns:43px minmax(0,1fr) 78px!important;
    column-gap:4px!important;
    padding:0 5px!important;
  }
  .m22-header-v66 .m22-brand-horizontal{width:min(145px,100%)!important;max-width:145px!important}
  .m22-header-v66 .m22-brand-wordmark .m22-logo-image{max-width:133px!important}
  .m22-header-v66 .m22-header-actions-v66{
    grid-template-columns:repeat(2,37px)!important;
    gap:3px!important;
    width:77px!important;min-width:77px!important;max-width:77px!important;
  }
  .m22-header-v66 .m22-header-actions-v66 .m22-search-toggle,
  .m22-header-v66 .m22-header-actions-v66 .m22-account-btn{
    width:37px!important;min-width:37px!important;max-width:37px!important;
    height:37px!important;min-height:37px!important;max-height:37px!important;
  }
}

/*
 * Ads: older theme revisions could expose a large blank placeholder when an
 * AdSense iframe existed but no creative was actually confirmed. v6.75 makes
 * the default state zero-space on ALL devices. Only our JS-confirmed filled
 * slot may occupy space.
 */
.m22-ad-slot,
.m22-ad-slot.is-ad-loading,
.m22-ad-slot.is-unfilled,
.m22-ad-slot.is-ad-filled,
.m22-ad-slot:not(.m22-ad-confirmed){
  height:0!important;
  min-height:0!important;
  max-height:0!important;
  width:0!important;
  max-width:0!important;
  margin:0!important;
  padding:0!important;
  border:0!important;
  overflow:hidden!important;
  opacity:0!important;
  visibility:hidden!important;
  pointer-events:none!important;
  background:transparent!important;
}
.m22-ad-slot>span{display:none!important}

.m22-ad-slot.m22-ad-confirmed{
  display:block!important;
  visibility:visible!important;
  opacity:1!important;
  pointer-events:auto!important;
  width:min(var(--m22-container,1180px),calc(100% - 36px))!important;
  max-width:100%!important;
  height:auto!important;
  min-height:0!important;
  max-height:none!important;
  margin:18px auto!important;
  padding:10px!important;
  border:1px dashed var(--m22-line,#dbe5f2)!important;
  overflow:hidden!important;
  background:var(--m22-surface,#fff)!important;
  box-sizing:border-box!important;
}
.m22-ad-slot.m22-ad-confirmed>span{
  display:block!important;
  margin:0 0 5px!important;
  font-size:9px!important;
  line-height:1.2!important;
  letter-spacing:.12em!important;
  text-transform:uppercase!important;
}
.m22-ad-slot.m22-ad-confirmed ins.adsbygoogle{
  display:block!important;
  width:100%!important;
  max-width:100%!important;
  overflow:hidden!important;
}
.m22-article-content .m22-ad-slot.m22-ad-confirmed{width:100%!important;margin:26px 0!important}
.m22-mostread-panel .m22-ad-slot:not(.m22-ad-confirmed){display:block!important;width:0!important;height:0!important;margin:0!important;padding:0!important}

@media(max-width:720px){
  .m22-ad-slot.m22-ad-confirmed{
    width:calc(100% - 24px)!important;
    margin:12px auto!important;
    padding:7px!important;
  }
  .m22-article-content .m22-ad-slot.m22-ad-confirmed{width:100%!important}
}
