/* PaySlashes deployed-source mobile/runtime repair — 2026-09-22 */
:root{--ps-mobile-nav-safe:116px}
@media (max-width:767.98px){
 html,body{max-width:100%;overflow-x:hidden!important}
 body.mobile-ux-shell{padding-bottom:calc(var(--ps-mobile-nav-safe) + env(safe-area-inset-bottom))!important}
 body.mobile-ux-shell main{padding-bottom:calc(var(--ps-mobile-nav-safe) + 30px)!important}
 body.mobile-ux-shell footer,body.mobile-ux-shell .premium-site-footer{padding-bottom:calc(var(--ps-mobile-nav-safe) + 28px + env(safe-area-inset-bottom))!important}
 body.mobile-ux-shell .ps-mobile-bottom-nav{height:82px!important;bottom:8px!important;left:8px!important;right:8px!important;width:auto!important;border-radius:24px!important;padding-bottom:calc(7px + env(safe-area-inset-bottom))!important}
 body.mobile-ux-shell .ps-ai-shop{right:14px!important;bottom:calc(var(--ps-mobile-nav-safe) + 14px + env(safe-area-inset-bottom))!important;z-index:10040!important}
 body.mobile-ux-shell .ps-ai-shop__launcher{width:50px!important;min-width:50px!important;height:50px!important;min-height:50px!important;padding:0!important;border-radius:50%!important}
 body.mobile-ux-shell .ps-ai-shop__launcher-label{position:absolute!important;width:1px!important;height:1px!important;overflow:hidden!important;clip:rect(0,0,0,0)!important;white-space:nowrap!important}
 body.mobile-ux-shell .ps-ai-shop__panel{inset:auto 8px calc(var(--ps-mobile-nav-safe) + 12px + env(safe-area-inset-bottom)) 8px!important;width:auto!important;max-width:none!important;max-height:calc(100dvh - var(--ps-mobile-nav-safe) - 34px)!important}
 body.mobile-ux-shell .ps-smart-search-panel{left:8px!important;right:8px!important;top:104px!important;max-height:52dvh!important}
}
@media (max-width:575.98px){
 body.mobile-ux-shell .ps-search-results-grid,body.mobile-ux-shell .ps-product-related-grid{display:grid!important;grid-template-columns:minmax(0,1fr)!important;gap:14px!important;overflow:visible!important;width:100%!important;max-width:100%!important}
 body.mobile-ux-shell .ps-search-results-grid>.jumia-product-card,body.mobile-ux-shell .ps-product-related-grid>.jumia-product-card{width:100%!important;min-width:0!important;max-width:100%!important;margin:0!important}
 body.mobile-ux-shell .pcv2-meta{display:flex!important;flex-wrap:wrap!important;align-items:flex-start!important;gap:5px!important;height:auto!important;min-height:0!important;overflow:visible!important}
 body.mobile-ux-shell .pcv2-meta>*{flex:0 1 auto!important;max-width:100%!important;white-space:normal!important;line-height:1.15!important;overflow-wrap:anywhere!important}
 body.mobile-ux-shell .pcv2-title{height:auto!important;min-height:0!important;max-height:none!important;line-height:1.2!important;margin-top:7px!important}
 body.mobile-ux-shell .pcv2-spec{height:auto!important;min-height:0!important;white-space:normal!important;overflow:visible!important}
 body.mobile-ux-shell .pcv2-actions{display:grid!important;grid-template-columns:1fr 1fr!important;gap:8px!important}
 body.mobile-ux-shell .pcv2-actions .pcv2-buy{grid-column:1/-1!important}
 body.mobile-ux-shell .pcv2-actions .pcv2-btn{width:100%!important;min-width:0!important;white-space:normal!important}
 body.mobile-ux-shell .ps-product-actions-v4__secondary{display:grid!important;grid-template-columns:1fr 1fr!important;gap:8px!important}
 body.mobile-ux-shell .ps-product-actions-v4__secondary>*{min-width:0!important;width:100%!important;margin:0!important}
}
@media (max-width:360px){
 :root{--ps-mobile-nav-safe:122px}
 body.mobile-ux-shell .ps-exact-products{grid-template-columns:minmax(0,1fr)!important;gap:14px!important}
 body.mobile-ux-shell main#content .products-grid:not([data-product-slider]){grid-template-columns:minmax(0,1fr)!important;gap:14px!important}
 body.mobile-ux-shell .ps-exact-product{width:100%!important;max-width:100%!important}
 body.mobile-ux-shell .ps-exact-product__image{height:180px!important}
 body.mobile-ux-shell .ps-mobile-bottom-nav{left:5px!important;right:5px!important}
}

/* PaySlashes narrow-phone commerce readability pass — 2026-09-22 */
@media (max-width: 374.98px){
  /* Homepage product rails: one complete card per swipe, never two crushed cards. */
  body.mobile-ux-shell .ps-exact-products[data-product-slider]{
    display:flex!important;
    grid-template-columns:none!important;
    gap:12px!important;
    width:100%!important;
    max-width:100%!important;
    overflow-x:auto!important;
    overflow-y:hidden!important;
    scroll-snap-type:x mandatory!important;
    scroll-padding-inline:0!important;
    overscroll-behavior-inline:contain!important;
    -webkit-overflow-scrolling:touch!important;
    scrollbar-width:none!important;
    padding:2px 0 8px!important;
  }
  body.mobile-ux-shell .ps-exact-products[data-product-slider]::-webkit-scrollbar{display:none!important}
  body.mobile-ux-shell .ps-exact-products[data-product-slider]>.ps-exact-product{
    flex:0 0 100%!important;
    width:100%!important;
    min-width:100%!important;
    max-width:100%!important;
    scroll-snap-align:start!important;
    scroll-snap-stop:always!important;
    padding:12px!important;
  }
  body.mobile-ux-shell .ps-exact-products[data-product-slider] .ps-exact-product__image{
    height:180px!important;
    min-height:180px!important;
  }
  body.mobile-ux-shell .ps-exact-products[data-product-slider] .ps-exact-product h3{
    min-height:0!important;
    font-size:15px!important;
    line-height:1.28!important;
  }
  body.mobile-ux-shell .ps-exact-products[data-product-slider] .ps-exact-product p{
    min-height:0!important;
    font-size:12.5px!important;
  }

  /* Catalogue/search grids also use a readable single column on very narrow phones. */
  body.mobile-ux-shell main#content .products-grid:not([data-product-slider]),
  body.mobile-ux-shell .ps-search-results-grid,
  body.mobile-ux-shell .ps-product-related-grid{
    display:grid!important;
    grid-template-columns:minmax(0,1fr)!important;
    gap:14px!important;
    width:100%!important;
    max-width:100%!important;
  }
  body.mobile-ux-shell main#content .products-grid:not([data-product-slider])>.jumia-product-card,
  body.mobile-ux-shell main#content .products-grid:not([data-product-slider])>.pcv2-card,
  body.mobile-ux-shell .ps-search-results-grid>.jumia-product-card,
  body.mobile-ux-shell .ps-product-related-grid>.jumia-product-card{
    width:100%!important;
    min-width:0!important;
    max-width:100%!important;
  }

  /* V2 cards may grow naturally so labels/actions cannot collide. */
  body.mobile-ux-shell article.pcv2-card{
    height:auto!important;
    min-height:520px!important;
    max-height:none!important;
  }
  body.mobile-ux-shell article.pcv2-card>.pcv2-body{
    height:auto!important;
    min-height:310px!important;
    max-height:none!important;
    overflow:visible!important;
  }
  body.mobile-ux-shell article.pcv2-card .pcv2-content{
    height:auto!important;
    min-height:132px!important;
    max-height:none!important;
    overflow:visible!important;
  }
  body.mobile-ux-shell article.pcv2-card .pcv2-meta{
    height:auto!important;
    min-height:25px!important;
    flex-wrap:wrap!important;
  }
  body.mobile-ux-shell article.pcv2-card .pcv2-category,
  body.mobile-ux-shell article.pcv2-card .pcv2-brand{
    max-width:100%!important;
  }

  /* Keep the assistant safely above the fixed native nav. */
  body.mobile-ux-shell .ps-ai-shop{
    right:12px!important;
    bottom:calc(var(--ps-mobile-nav-safe) + 22px + env(safe-area-inset-bottom))!important;
  }
}


/* PaySlashes 25 — narrow catalogue hardening. Kept last on purpose. */
@media (max-width: 374.98px){
  html body.mobile-ux-shell .ps-search-results-grid,
  html body.mobile-ux-shell main .ps-search-results-grid,
  html body.mobile-ux-shell main#content .ps-search-results-grid{
    display:grid!important;
    grid-template-columns:minmax(0,1fr)!important;
    grid-auto-flow:row!important;
    gap:14px!important;
    width:100%!important;
    max-width:100%!important;
    overflow:visible!important;
  }
  html body.mobile-ux-shell .ps-search-results-grid > article.jumia-product-card,
  html body.mobile-ux-shell .ps-search-results-grid > article.pcv2-card{
    grid-column:1/-1!important;
    width:100%!important;
    min-width:0!important;
    max-width:100%!important;
    margin-inline:0!important;
  }
  html body.mobile-ux-shell .ps-search-results-grid .pcv2-title,
  html body.mobile-ux-shell .ps-search-results-grid .pcv2-title a{
    white-space:normal!important;
    overflow:visible!important;
    text-overflow:clip!important;
    overflow-wrap:anywhere!important;
  }
  html body.mobile-ux-shell .ps-search-results-grid .pcv2-delivery,
  html body.mobile-ux-shell .ps-search-results-grid .pcv2-stock,
  html body.mobile-ux-shell .ps-search-results-grid .pcv2-actions{
    max-width:100%!important;
    overflow:visible!important;
  }
}

/* PaySlashes 26 — 330px catalogue + product-detail recovery (2026-09-22). */
@media (max-width:374.98px){
  /* Every homepage product slider gets one complete, readable card per swipe. */
  html body.mobile-ux-shell [data-product-slider]{
    display:flex!important;grid-template-columns:none!important;grid-auto-flow:unset!important;
    flex-flow:row nowrap!important;gap:12px!important;width:100%!important;max-width:100%!important;
    overflow-x:auto!important;overflow-y:hidden!important;scroll-snap-type:x mandatory!important;
    scroll-padding-inline:0!important;padding:3px 0 10px!important;
  }
  html body.mobile-ux-shell [data-product-slider]>*{
    flex:0 0 100%!important;width:100%!important;min-width:100%!important;max-width:100%!important;
    scroll-snap-align:start!important;scroll-snap-stop:always!important;
  }
  html body.mobile-ux-shell [data-product-slider]>article.pcv2-card{
    height:auto!important;min-height:520px!important;max-height:none!important;
  }

  /* Product detail must remain visible even if legacy Slick fails to initialise. */
  html body.page-product_detail main#content.ps-product-detail-v4{display:block!important;visibility:visible!important;opacity:1!important;min-height:100vh!important;}
  html body.page-product_detail .ps-product-hero-row{display:block!important;visibility:visible!important;opacity:1!important;}
  html body.page-product_detail .ps-product-gallery-column,
  html body.page-product_detail .ps-product-buy-column{display:block!important;width:100%!important;max-width:100%!important;visibility:visible!important;opacity:1!important;}
  html body.page-product_detail #sliderSyncingNav{display:block!important;width:100%!important;min-height:260px!important;visibility:visible!important;opacity:1!important;overflow:hidden!important;}
  html body.page-product_detail #sliderSyncingNav .slick-list,
  html body.page-product_detail #sliderSyncingNav .slick-track{display:block!important;width:100%!important;height:auto!important;transform:none!important;}
  html body.page-product_detail #sliderSyncingNav .js-slide{display:none!important;width:100%!important;visibility:visible!important;opacity:1!important;}
  html body.page-product_detail #sliderSyncingNav .js-slide:first-child{display:block!important;}
  html body.page-product_detail #sliderSyncingThumb{display:none!important;}
  html body.page-product_detail .ps-zoom-stage{display:flex!important;width:100%!important;min-height:260px!important;visibility:visible!important;opacity:1!important;}
  html body.page-product_detail .ps-product-main-image{display:block!important;max-width:100%!important;max-height:300px!important;object-fit:contain!important;visibility:visible!important;opacity:1!important;}
  html body.page-product_detail .ps-product-buy-panel{display:block!important;position:static!important;width:100%!important;padding:12px 0 0!important;visibility:visible!important;opacity:1!important;}
}

/* PaySlashes 27 — mobile rail visibility + dead-space recovery (2026-09-22).
   This intentionally supersedes the over-broad PaySlashes 26 100%-child rule. */
@media (max-width:767.98px){
  html body.mobile-ux-shell .ps-home-collection,
  html body.mobile-ux-shell section.ps-home-collection,
  html body.mobile-ux-shell .ps-product-slider-shell{
    height:auto!important;min-height:0!important;max-height:none!important;
    overflow:visible!important;
  }
  html body.mobile-ux-shell .ps-product-slider-track[data-product-slider],
  html body.mobile-ux-shell .products-grid.ps-product-slider-track[data-product-slider]{
    display:flex!important;flex-flow:row nowrap!important;align-items:stretch!important;
    grid-template-columns:none!important;grid-auto-flow:unset!important;
    width:100%!important;max-width:100%!important;height:auto!important;min-height:0!important;max-height:none!important;
    gap:12px!important;overflow-x:auto!important;overflow-y:hidden!important;
    scroll-snap-type:x mandatory!important;padding:3px 2px 10px!important;
    visibility:visible!important;opacity:1!important;
  }
  html body.mobile-ux-shell .ps-product-slider-track[data-product-slider] > article.pcv2-card,
  html body.mobile-ux-shell .ps-product-slider-track[data-product-slider] > article.jumia-product-card{
    display:flex!important;visibility:visible!important;opacity:1!important;
    flex:0 0 min(82vw,286px)!important;width:min(82vw,286px)!important;
    min-width:min(82vw,286px)!important;max-width:min(82vw,286px)!important;
    height:auto!important;min-height:0!important;max-height:none!important;
    scroll-snap-align:start!important;
  }
  html body.mobile-ux-shell article.pcv2-card>.pcv2-body,
  html body.mobile-ux-shell article.pcv2-card .pcv2-content{
    height:auto!important;min-height:0!important;max-height:none!important;
  }
  /* Never reserve a tall product zone when a collection genuinely has no cards. */
  html body.mobile-ux-shell .ps-product-slider-shell:has(.ps-product-slider-track:empty),
  html body.mobile-ux-shell .ps-product-slider-shell:has(.ps-product-slider-track:not(:has(>article))){
    min-height:0!important;height:auto!important;margin-bottom:0!important;padding-bottom:0!important;
  }
  html body.mobile-ux-shell main#content{padding-bottom:calc(118px + env(safe-area-inset-bottom))!important;}
}
@media (max-width:374.98px){
  html body.mobile-ux-shell .ps-product-slider-track[data-product-slider] > article.pcv2-card,
  html body.mobile-ux-shell .ps-product-slider-track[data-product-slider] > article.jumia-product-card{
    flex-basis:calc(100vw - 58px)!important;width:calc(100vw - 58px)!important;
    min-width:calc(100vw - 58px)!important;max-width:calc(100vw - 58px)!important;
  }
}

/* PaySlashes 28 — mobile phantom-space elimination (2026-09-22).
   Disable intrinsic placeholder sizing on the live mobile homepage and collapse
   product rails whose cards were removed/filtered out. */
@media (max-width:767.98px){
  html body.page-home.mobile-ux-shell .ps-exact-mobile-home,
  html body.page-home.mobile-ux-shell .ps-exact-mobile-home section,
  html body.page-home.mobile-ux-shell .ps-exact-mobile-home .ps-home-collection,
  html body.page-home.mobile-ux-shell .ps-exact-mobile-home .categories-section,
  html body.page-home.mobile-ux-shell main#content > .ps-exact-mobile-home{
    content-visibility:visible!important;
    contain:none!important;
    contain-intrinsic-size:auto!important;
    height:auto!important;
    min-height:0!important;
    max-height:none!important;
  }
  html body.page-home.mobile-ux-shell .ps-exact-mobile-home .ps-product-slider-shell{
    height:auto!important;min-height:0!important;max-height:none!important;
    margin-block:0!important;overflow:visible!important;
  }
  html body.page-home.mobile-ux-shell .ps-exact-mobile-home .ps-product-slider-shell:not(:has(article)):not(:has(.ps-exact-product)),
  html body.page-home.mobile-ux-shell .ps-exact-mobile-home [data-product-slider]:empty,
  html body.page-home.mobile-ux-shell .ps-exact-mobile-home [data-product-slider]:not(:has(>article)):not(:has(>.ps-exact-product)){
    display:none!important;height:0!important;min-height:0!important;max-height:0!important;
    margin:0!important;padding:0!important;border:0!important;overflow:hidden!important;
  }
  /* Do not let legacy reveal/containment reserve a 500px placeholder while scrolling. */
  html body.page-home.mobile-ux-shell .ps-exact-mobile-home .ps-reveal{
    content-visibility:visible!important;contain:none!important;contain-intrinsic-size:auto!important;
  }
}

/* PaySlashes 32 V5 — definitive mobile dead-space fix.
   Sprint-40 globally reserved 624px on every product grid, including grids whose
   cards are absent/filtered. On mobile the grid/rail must size from real cards. */
@media (max-width:767.98px){
  html body.page-home.mobile-ux-shell .ps-product-slider-shell,
  html body.page-home.mobile-ux-shell [data-product-slider],
  html body.page-home.mobile-ux-shell .ps-product-slider-track,
  html body.page-home.mobile-ux-shell .products-grid,
  html body.page-home.mobile-ux-shell .products-row,
  html body.page-home.mobile-ux-shell .product-grid,
  html body.page-home.mobile-ux-shell .jumia-products-grid,
  html body.page-home.mobile-ux-shell .ps-product-grid{
    min-height:0!important;height:auto!important;max-height:none!important;
  }
  html body.page-home.mobile-ux-shell .products-grid:empty,
  html body.page-home.mobile-ux-shell .products-row:empty,
  html body.page-home.mobile-ux-shell .product-grid:empty,
  html body.page-home.mobile-ux-shell .jumia-products-grid:empty,
  html body.page-home.mobile-ux-shell .ps-product-grid:empty,
  html body.page-home.mobile-ux-shell [data-product-slider]:empty,
  html body.page-home.mobile-ux-shell .ps-mobile-dead-space{
    display:none!important;height:0!important;min-height:0!important;max-height:0!important;
    margin:0!important;padding:0!important;border:0!important;overflow:hidden!important;
  }
  html body.page-home.mobile-ux-shell section.ps-home-collection.ps-mobile-dead-space{
    display:none!important;
  }
}

/* PaySlashes 32 V6 — hard mobile homepage isolation.
   The desktop homepage contains container wrappers in addition to sections.
   They must not participate in mobile layout after the dedicated exact-mobile
   homepage has rendered; otherwise hidden/empty desktop rails reserve space. */
@media (max-width:767.98px){
  html body main#content > section:not(.ps-exact-mobile-home),
  html body main#content > div:not(.ps-exact-mobile-home),
  html body main#content > .container,
  html body main#content > .ps-home-collection,
  html body main#content > .categories-section,
  html body main#content > .ps-hero-section{
    display:none!important;
    height:0!important;min-height:0!important;max-height:0!important;
    margin:0!important;padding:0!important;border:0!important;
    overflow:hidden!important;visibility:hidden!important;
  }
  html body main#content > .ps-exact-mobile-home{
    display:block!important;visibility:visible!important;
    height:auto!important;min-height:0!important;max-height:none!important;
    margin:0!important;overflow:visible!important;
  }
  html body main#content > .ps-exact-mobile-home .ps-exact-wrap,
  html body main#content > .ps-exact-mobile-home .ps-exact-wrap > section{
    height:auto!important;min-height:0!important;max-height:none!important;
  }
}

/* PaySlashes 32 V8 — FINAL mobile homepage geometry lock.
   Mobile renders ONLY the dedicated exact-mobile homepage. No removed desktop rail
   is allowed to reserve layout space. Restore the original 290px hero geometry. */
@media (max-width:767.98px){
  html body.page-home main#content{min-height:0!important;height:auto!important;padding:0!important;margin:0!important;}
  html body.page-home main#content > :not(.ps-exact-mobile-home){display:none!important;position:absolute!important;width:0!important;height:0!important;min-width:0!important;min-height:0!important;max-height:0!important;margin:0!important;padding:0!important;border:0!important;overflow:hidden!important;visibility:hidden!important;content-visibility:hidden!important;}
  html body.page-home main#content > .ps-exact-mobile-home{display:block!important;position:relative!important;width:100%!important;height:auto!important;min-height:0!important;max-height:none!important;margin:0!important;padding:0!important;overflow:visible!important;visibility:visible!important;content-visibility:visible!important;contain:none!important;}
  html body.page-home .ps-exact-mobile-home .ps-exact-wrap{display:block!important;height:auto!important;min-height:0!important;max-height:none!important;overflow:visible!important;}
  html body.page-home .ps-exact-mobile-home .ps-exact-wrap > section:not(.ps-exact-hero){height:auto!important;min-height:0!important;max-height:none!important;content-visibility:visible!important;contain:none!important;}
  html body.page-home .ps-exact-mobile-home .ps-exact-hero{display:block!important;position:relative!important;height:290px!important;min-height:290px!important;max-height:290px!important;margin:0 0 16px!important;padding:0!important;border-radius:14px!important;overflow:hidden!important;}
  html body.page-home .ps-exact-mobile-home .ps-exact-hero__media{display:block!important;position:absolute!important;inset:0!important;width:100%!important;height:100%!important;}
  html body.page-home .ps-exact-mobile-home .ps-exact-hero__media img{display:block!important;width:100%!important;height:100%!important;object-fit:cover!important;object-position:center!important;}
  html body.page-home .ps-exact-mobile-home .ps-exact-hero__copy{position:absolute!important;left:18px!important;right:18px!important;top:20px!important;bottom:auto!important;z-index:3!important;}
  html body.page-home .ps-exact-mobile-home [data-product-slider],
  html body.page-home .ps-exact-mobile-home .ps-exact-products{height:auto!important;min-height:0!important;max-height:none!important;}
  html body.page-home .ps-exact-mobile-home [data-product-slider]:empty,
  html body.page-home .ps-exact-mobile-home .ps-exact-section:has([data-product-slider]:empty){display:none!important;height:0!important;min-height:0!important;margin:0!important;padding:0!important;}
}
@media (max-width:374px){html body.page-home .ps-exact-mobile-home .ps-exact-hero{height:260px!important;min-height:260px!important;max-height:260px!important;}}