/* Noor Naksha v1.8.2 - consolidated mobile/header/footer + Shop UAT patch.
 * Additive override layer. Stable desktop homepage rendering is intentionally preserved.
 */

/* --------------------------------------------------------------------------
 * A. Mobile navigation: drawer/backdrop must be deterministic.
 * -------------------------------------------------------------------------- */
.nn-drawer-backdrop[hidden],
.nn-shop-filter-backdrop-v18[hidden]{display:none!important}

@media (max-width:992px){
  .nn-mobile-menu-button{display:grid!important;place-items:center!important;position:relative;z-index:10004}
  .nn-mobile-drawer{
    display:block!important;
    position:fixed!important;
    top:0!important;
    right:0!important;
    bottom:0!important;
    left:auto!important;
    width:min(86vw,360px)!important;
    max-width:360px!important;
    height:100dvh!important;
    padding:20px!important;
    overflow-y:auto!important;
    overscroll-behavior:contain!important;
    background:#fffdf9!important;
    color:var(--nn-ink)!important;
    z-index:10003!important;
    transform:translate3d(105%,0,0)!important;
    visibility:hidden!important;
    pointer-events:none!important;
    transition:transform .25s ease,visibility .25s ease!important;
    box-shadow:-16px 0 42px rgba(0,0,0,.16)!important;
  }
  .nn-mobile-drawer.is-open{
    transform:translate3d(0,0,0)!important;
    visibility:visible!important;
    pointer-events:auto!important;
  }
  .nn-drawer-backdrop{
    position:fixed!important;
    inset:0!important;
    z-index:10002!important;
    background:rgba(7,28,22,.42)!important;
  }
  .nn-drawer-backdrop:not([hidden]){display:block!important}
  .nn-mobile-drawer .nn-mobile-nav-list,
  .nn-mobile-drawer .nn-nav-list{display:block!important;list-style:none!important;margin:0!important;padding:18px 0!important}
  .nn-mobile-drawer .nn-mobile-nav-list>li,
  .nn-mobile-drawer .nn-nav-list>li{display:block!important;border-bottom:1px solid #f0e9df!important}
  .nn-mobile-drawer .nn-mobile-nav-list a,
  .nn-mobile-drawer .nn-nav-list a{display:block!important;padding:13px 2px!important;color:var(--nn-ink)!important}
  .nn-mobile-drawer .sub-menu{position:static!important;display:block!important;visibility:visible!important;opacity:1!important;transform:none!important;box-shadow:none!important;border:0!important;background:transparent!important;list-style:none!important;padding:0 0 4px 14px!important;margin:0!important;min-width:0!important}
}

/* --------------------------------------------------------------------------
 * B. Top announcement bar: readable mobile rotator; desktop/tablet unchanged.
 * Existing per-item mobile visibility and ordering still determine eligibility.
 * -------------------------------------------------------------------------- */
@media (max-width:720px){
  .nn-topbar{display:block!important;overflow:hidden!important}
  .nn-topbar.nn-topbar-mobile-rotator-v182 .nn-topbar-inner{
    min-height:var(--nn-topbar-h-m,var(--nn-topbar-height,30px))!important;
    height:var(--nn-topbar-h-m,var(--nn-topbar-height,30px))!important;
    padding-block:0!important;
    display:flex!important;
    align-items:center!important;
    justify-content:center!important;
    overflow:hidden!important;
  }
  .nn-topbar.nn-topbar-mobile-rotator-v182 .nn-topbar-brand,
  .nn-topbar.nn-topbar-mobile-rotator-v182 .nn-topbar-items{display:contents!important}
  .nn-topbar.nn-topbar-mobile-rotator-v182 .nn-topbar-item{
    display:none!important;
    width:100%!important;
    min-width:0!important;
    justify-content:center!important;
    align-items:center!important;
    gap:6px!important;
    padding-inline:8px!important;
    white-space:nowrap!important;
    overflow:hidden!important;
    text-overflow:ellipsis!important;
    font-size:var(--nn-topbar-font-m,10px)!important;
    text-align:center!important;
  }
  .nn-topbar.nn-topbar-mobile-rotator-v182 .nn-topbar-item.is-active-v182{display:flex!important}
  .nn-topbar.nn-topbar-mobile-rotator-v182 .nn-topbar-item>span{
    display:block!important;
    min-width:0!important;
    max-width:calc(100vw - 54px)!important;
    overflow:hidden!important;
    text-overflow:ellipsis!important;
  }
  .nn-topbar.nn-topbar-mobile-rotator-v182 .nn-topbar-item-hide-mobile{display:none!important}
}

/* --------------------------------------------------------------------------
 * C. Footer branding: one visual axis; mobile is owner-locked to left alignment.
 * Existing visual X-offset remains available for transparent logo canvas padding.
 * -------------------------------------------------------------------------- */
.nn-footer .nn-footer-grid{align-items:start!important}
.nn-footer .nn-footer-brand{
  justify-self:start!important;
  min-width:0!important;
  width:min(100%,var(--nn-footer-brand-width-d,320px))!important;
}
.nn-footer .nn-footer-logo-link,
.nn-footer .nn-footer-tagline,
.nn-footer .nn-footer-brand-contact{max-width:100%!important}
.nn-footer .nn-footer-logo-link{display:block!important;width:max-content!important}
.nn-footer .nn-footer-logo{display:block!important;object-position:left center!important}
.nn-footer .nn-footer-brand-contact-item{justify-content:flex-start!important;text-align:left}

@media (min-width:1025px){
  .nn-footer .nn-footer-brand-d-left{align-items:flex-start!important;text-align:left!important}
  .nn-footer .nn-footer-brand-d-left .nn-footer-logo-link,
  .nn-footer .nn-footer-brand-d-left .nn-footer-tagline,
  .nn-footer .nn-footer-brand-d-left .nn-footer-brand-contact{align-self:flex-start!important;text-align:left!important}
  .nn-footer .nn-footer-brand-d-left .nn-footer-tagline,
  .nn-footer .nn-footer-brand-d-left .nn-footer-brand-contact{width:auto!important;min-width:0!important}
}

@media (min-width:721px) and (max-width:1024px){
  .nn-footer .nn-footer-brand{width:min(100%,var(--nn-footer-brand-width-t,300px))!important}
}

@media (max-width:720px){
  .nn-footer .nn-footer-grid{grid-template-columns:1fr!important;gap:24px!important}
  .nn-footer .nn-footer-brand{
    grid-column:auto!important;
    width:min(100%,var(--nn-footer-brand-width-m,100%))!important;
    max-width:100%!important;
    justify-self:stretch!important;
    align-items:flex-start!important;
    text-align:left!important;
  }
  .nn-footer .nn-footer-brand .nn-footer-logo-link,
  .nn-footer .nn-footer-brand .nn-footer-tagline,
  .nn-footer .nn-footer-brand .nn-footer-brand-contact{
    align-self:flex-start!important;
    text-align:left!important;
    margin-left:0!important;
    margin-right:0!important;
  }
  .nn-footer .nn-footer-brand .nn-footer-tagline,
  .nn-footer .nn-footer-brand .nn-footer-brand-contact{width:100%!important}
  .nn-footer .nn-footer-brand .nn-footer-brand-contact{align-items:flex-start!important}
  .nn-footer .nn-footer-logo{object-position:left center!important}
}

/* --------------------------------------------------------------------------
 * D. Shop category rail: arrows only when scrolling is actually possible.
 * With few categories, keep normal card sizing and center the static set.
 * -------------------------------------------------------------------------- */
.nn-shop-category-track-v18.is-static-v182{
  overflow-x:hidden!important;
  justify-content:center!important;
  scroll-snap-type:none!important;
}
.nn-shop-categories-v18.is-static-v182 .nn-shop-cat-arrow-v18{display:none!important}
.nn-shop-category-card-v18{max-width:210px}
.nn-shop-category-style-chips .nn-shop-category-card-v18{max-width:260px}

@media (max-width:720px){
  .nn-shop-category-track-v18.is-static-v182{justify-content:flex-start!important}
  .nn-shop-category-card-v18{max-width:none}
}

/* --------------------------------------------------------------------------
 * E. Shop product card image: override WooCommerce's more-specific default
 * image margin/height rules that caused the visible blank band below images.
 * -------------------------------------------------------------------------- */
body.woocommerce .nn-shop-products-v18 ul.products li.product .nn-shop-product-image-v18{
  padding:0!important;
  line-height:0!important;
}
body.woocommerce .nn-shop-products-v18 ul.products li.product .nn-shop-product-image-v18 img,
body.woocommerce-page .nn-shop-products-v18 ul.products li.product .nn-shop-product-image-v18 img{
  display:block!important;
  width:100%!important;
  max-width:none!important;
  height:100%!important;
  margin:0!important;
  padding:0!important;
  border-radius:0!important;
  object-fit:cover!important;
  object-position:center!important;
}
body.woocommerce .nn-shop-products-v18 ul.products li.product .nn-shop-product-info-v18{margin-top:0!important}

/* Ensure no stale drawer/filter backdrop can dim the storefront at rest. */
body:not(.nn-mobile-menu-open-v182) .nn-drawer-backdrop[hidden]{display:none!important}
body:not(.nn-shop-filter-open-v182) .nn-shop-filter-backdrop-v18[hidden]{display:none!important}

@media (max-width:992px){
  body.nn-mobile-menu-open-v182 .nn-site-header{z-index:10000!important}
}