/* DecathlonSport public UI polish v5.14.39
   - Prevents orphan Bootstrap/visual-search backdrops from masking public pages.
   - Gives interactive icons a consistent, readable size.
   - Keeps text and labels readable on coloured/dark surfaces in light mode.
   - Normalises product CTA contrast across archive, home, sliders and related products. */

:root{
  --dc-ui-icon-sm:16px;
  --dc-ui-icon-md:18px;
  --dc-ui-icon-lg:21px;
  --dc-ui-control:44px;
}

/* Native hidden must always win over component display rules. */
[hidden]{display:none!important}
html:not(.dc-public-ui-ready) :is(.offcanvas-backdrop,.modal-backdrop){display:none!important}
body:not(.pro-visual-search-open) .pro-visual-search[aria-hidden="true"]{display:none!important}
body .nav-mini-cart[hidden][aria-hidden="true"]{visibility:hidden!important;pointer-events:none!important}

/* Consistent icon baseline. Only interactive/status icons are affected; large illustrations keep their own sizing. */
body :is(a,button,summary,label,.btn,.badge,.chip,.tag,.filter-title,.icon-btn) > i.bi,
body :is(a,button,summary,label,.btn,.badge,.chip,.tag,.filter-title,.icon-btn) > span > i.bi{
  flex:0 0 auto;
  font-size:max(1em,var(--dc-ui-icon-sm));
  line-height:1;
  vertical-align:-.08em;
}

.dynamic-site-header .icon-btn{
  width:48px;
  min-width:48px;
  height:48px;
  padding:0!important;
  border-radius:15px;
}
.dynamic-site-header .icon-btn>i{font-size:20px!important}
.dynamic-site-header .cart-badge{
  top:-6px;
  right:-5px;
  width:22px;
  height:22px;
  font-size:11px;
  line-height:22px;
  border:2px solid #fff;
  box-shadow:0 5px 12px rgba(15,23,42,.18);
}
.dynamic-site-header .nav-builder__icon>i,
.dynamic-site-header .nav-builder__toggle>i{font-size:17px!important}
.dynamic-site-header .pro-search-leading,
.dynamic-site-header .pro-search-submit i,
.dynamic-site-header .pro-visual-search-trigger i{font-size:18px!important}

/* Product cards: readable controls and clear purchase hierarchy. */
body .product-card-actions{gap:8px}
body .product-card-action{
  width:38px!important;
  min-width:38px!important;
  height:38px!important;
  min-height:38px!important;
  border-radius:12px!important;
}
body .product-card-action>i{font-size:17px!important}
body :is(.product-card-cta,.archive-product-buy .add-cart,.quick-add-btn.card-submit-btn,.card-submit-btn,.home-card-actions .add-cart){
  min-height:46px!important;
  padding:10px 15px!important;
  gap:8px!important;
  border-radius:13px!important;
  font-size:12px!important;
  font-weight:900!important;
  line-height:1.5!important;
  text-decoration:none!important;
}
body :is(.product-card-cta,.archive-product-buy .add-cart,.quick-add-btn.card-submit-btn,.card-submit-btn,.home-card-actions .add-cart) i{
  font-size:18px!important;
}
body.theme-light :is(.product-card-cta,.archive-product-buy .add-cart,.quick-add-btn.card-submit-btn,.card-submit-btn,.home-card-actions .add-cart):not(.is-unavailable),
body.theme-light :is(.product-card-cta,.archive-product-buy .add-cart,.quick-add-btn.card-submit-btn,.card-submit-btn,.home-card-actions .add-cart):not(.is-unavailable) :is(span,i,b,small){
  color:#fff!important;
  opacity:1!important;
  text-shadow:none!important;
}
body.theme-light :is(.product-card-cta,.archive-product-buy .add-cart,.quick-add-btn.card-submit-btn,.card-submit-btn).is-view-product{
  background:linear-gradient(135deg,#165b89,#1593aa)!important;
  border-color:transparent!important;
}
body.theme-light :is(.product-card-cta,.archive-product-buy .add-cart,.quick-add-btn.card-submit-btn,.card-submit-btn).is-add-to-cart{
  background:linear-gradient(135deg,#0b8b73,#16b44c)!important;
  border-color:transparent!important;
}
body.theme-light .product-status-badge:not(.status-neutral),
body.theme-light .product-status-badge:not(.status-neutral) :is(span,small,i){color:#fff!important;opacity:1!important}

/* Filter, slider and floating utility controls. */
body .filter-title i,
body .filter-panel i,
body .archive-toolbar i,
body .view-switch i{font-size:17px!important}
body .slider-nav{
  width:46px!important;
  min-width:46px!important;
  height:46px!important;
  min-height:46px!important;
  border-radius:15px!important;
}
body .slider-nav>i{font-size:20px!important}
body :is(.float-support,.back-top)>i{font-size:24px!important}
body .float-support{width:58px!important;height:58px!important}
body .back-top{width:50px!important;height:50px!important}

/* White copy on genuinely dark/coloured public surfaces in light mode.
   This is deliberately scoped so ordinary white cards never receive white text. */
body.theme-light :is(
  .blog-archive-hero,
  .blog-hero,
  .archive-hero,
  .hero-panel,
  .promo-banner,
  .club-box,
  .blog-inline-banner,
  .archive-inline-banner,
  .nav-layout-row--announcement,
  .text-bg-dark
) :is(h1,h2,h3,h4,h5,h6,p,small,label,em,.eyebrow,.badge,.tag),
body.theme-light :is(
  .blog-archive-hero,
  .blog-hero,
  .archive-hero,
  .hero-panel,
  .promo-banner,
  .club-box,
  .blog-inline-banner,
  .archive-inline-banner,
  .nav-layout-row--announcement,
  .text-bg-dark
) :is(h1,h2,h3,h4,h5,h6,p,small,label,em,.eyebrow,.badge,.tag) :is(span,i,b){
  color:#fff!important;
  opacity:1!important;
}
body.theme-light :is(
  .blog-archive-hero,
  .blog-hero,
  .archive-hero,
  .hero-panel,
  .promo-banner,
  .club-box,
  .blog-inline-banner,
  .archive-inline-banner
) p,
body.theme-light :is(
  .blog-archive-hero,
  .blog-hero,
  .archive-hero,
  .hero-panel,
  .promo-banner,
  .club-box,
  .blog-inline-banner,
  .archive-inline-banner
) small{color:rgba(255,255,255,.88)!important}

/* Search and mini-cart icon/detail readability. */
.pro-search-panel :is(button,a)>i,
.nav-mini-cart :is(button,a,span)>i{font-size:17px!important}
.nav-mini-cart__heading-icon>i{font-size:22px!important}
.nav-mini-cart__close{width:42px!important;height:42px!important}

@media(max-width:767.98px){
  :root{--dc-ui-control:42px}
  .dynamic-site-header .icon-btn{width:42px;min-width:42px;height:42px;border-radius:13px}
  .dynamic-site-header .icon-btn>i{font-size:18px!important}
  body .product-card-action{width:36px!important;min-width:36px!important;height:36px!important;min-height:36px!important}
  body .slider-nav{width:42px!important;min-width:42px!important;height:42px!important;min-height:42px!important}
}

@media(prefers-reduced-motion:reduce){
  body :is(.product-card-action,.product-card-cta,.slider-nav,.icon-btn){transition:none!important}
}

/* v5.14.54 — readable product CTAs in every storefront card */
body :is(.product-card-cta,.product-card-reference__cta).is-view-product,
body :is(.product-card-cta,.product-card-reference__cta).is-view-product :is(span,i,b,small){color:#fff!important}
body .stock-notify-card-btn,
body :is(.product-card-cta,.product-card-reference__cta).is-unavailable{
  color:#fff!important;
  border-color:transparent!important;
  background:linear-gradient(135deg,#9f1239 0%,#be123c 52%,#e11d48 100%)!important;
  box-shadow:0 12px 26px rgba(190,18,60,.18)!important;
}
body .stock-notify-card-btn :is(span,i,b,small),
body :is(.product-card-cta,.product-card-reference__cta).is-unavailable :is(span,i,b,small){color:#fff!important}

/* v5.17.12 — compact one-row mobile storefront header
   Keep the live logo and the four configured header actions on one row.
   Search remains full-width directly underneath. No controls are hidden. */
@media (max-width:767.98px){
  .dynamic-site-header .nav-layout-row--search-main .nav-layout-grid{
    display:flex!important;
    flex-wrap:wrap!important;
    align-items:center!important;
    gap:6px 8px!important;
    min-height:0!important;
    padding:7px 0 8px!important;
  }
  .dynamic-site-header .nav-layout-row--search-main .nav-layout-column--logo{
    order:1!important;
    flex:1 1 88px!important;
    width:auto!important;
    min-width:76px!important;
    max-width:none!important;
    justify-content:flex-start!important;
    gap:0!important;
  }
  .dynamic-site-header .nav-layout-row--search-main .nav-layout-column--actions{
    order:2!important;
    flex:0 0 auto!important;
    width:auto!important;
    max-width:calc(100% - 96px)!important;
    justify-content:flex-end!important;
    align-items:center!important;
    flex-wrap:nowrap!important;
    gap:5px!important;
  }
  .dynamic-site-header .nav-layout-row--search-main .nav-layout-column--search{
    order:3!important;
    flex:0 0 100%!important;
    width:100%!important;
    max-width:100%!important;
    margin:0!important;
  }
  .dynamic-site-header .nav-layout-row--search-main .decathlon-brand,
  .dynamic-site-header .nav-layout-row--search-main .brand{
    display:flex!important;
    align-items:center!important;
    width:auto!important;
    max-width:112px!important;
    min-width:0!important;
    margin:0!important;
    padding:0!important;
  }
  .dynamic-site-header .nav-layout-row--search-main .brand-logo-img{
    display:block!important;
    width:108px!important;
    max-width:100%!important;
    height:auto!important;
    max-height:34px!important;
    object-fit:contain!important;
    object-position:center!important;
  }
  .dynamic-site-header .nav-layout-row--search-main .nav-layout-column--actions>.icon-btn,
  .dynamic-site-header .nav-layout-row--search-main .nav-layout-column--actions>a.icon-btn,
  .dynamic-site-header .nav-layout-row--search-main .nav-layout-column--actions>button.icon-btn{
    flex:0 0 36px!important;
    width:36px!important;
    min-width:36px!important;
    height:36px!important;
    min-height:36px!important;
    padding:0!important;
    border-radius:11px!important;
  }
  .dynamic-site-header .nav-layout-row--search-main .nav-layout-column--actions>.icon-btn>i{
    font-size:17px!important;
  }
  .dynamic-site-header .nav-layout-row--search-main .nav-layout-column--actions .dc-theme-switch{
    flex:0 0 72px!important;
    inline-size:72px!important;
    block-size:36px!important;
    margin:0!important;
    padding:3px!important;
    border-radius:11px!important;
  }
  .dynamic-site-header .nav-layout-row--search-main .nav-layout-column--actions .dc-theme-switch:before{
    inline-size:calc(50% - 3px)!important;
    inset-block:3px!important;
    inset-inline-start:3px!important;
    border-radius:8px!important;
  }
  .dynamic-site-header .nav-layout-row--search-main .nav-layout-column--actions .dc-theme-switch button{
    block-size:30px!important;
    border-radius:8px!important;
    font-size:15px!important;
  }
  .dynamic-site-header .nav-layout-row--search-main .cart-badge{
    top:-5px!important;
    right:-5px!important;
    width:18px!important;
    height:18px!important;
    line-height:16px!important;
    font-size:9px!important;
    border-width:2px!important;
  }
  .dynamic-site-header .nav-layout-row--search-main .pro-search-form{
    min-height:50px!important;
    padding:3px!important;
    border-radius:14px!important;
    grid-template-columns:minmax(0,1fr) 44px!important;
  }
  .dynamic-site-header .nav-layout-row--search-main .pro-search-field{
    height:44px!important;
    padding:0 9px!important;
    gap:6px!important;
    border-radius:11px!important;
  }
  .dynamic-site-header .nav-layout-row--search-main .pro-search-submit{
    width:44px!important;
    min-width:44px!important;
    height:44px!important;
    border-radius:11px!important;
  }
  .dynamic-site-header .nav-layout-row--search-main .pro-visual-search-trigger{
    min-width:34px!important;
    width:34px!important;
    height:32px!important;
    border-radius:9px!important;
  }
}
@media (max-width:380px){
  .dynamic-site-header .nav-layout-row--search-main .nav-layout-grid{gap:5px 6px!important;padding:6px 0 7px!important}
  .dynamic-site-header .nav-layout-row--search-main .nav-layout-column--logo{flex-basis:76px!important;min-width:68px!important}
  .dynamic-site-header .nav-layout-row--search-main .decathlon-brand,
  .dynamic-site-header .nav-layout-row--search-main .brand{max-width:98px!important}
  .dynamic-site-header .nav-layout-row--search-main .brand-logo-img{width:96px!important;max-height:31px!important}
  .dynamic-site-header .nav-layout-row--search-main .nav-layout-column--actions{max-width:calc(100% - 82px)!important;gap:4px!important}
  .dynamic-site-header .nav-layout-row--search-main .nav-layout-column--actions>.icon-btn,
  .dynamic-site-header .nav-layout-row--search-main .nav-layout-column--actions>a.icon-btn,
  .dynamic-site-header .nav-layout-row--search-main .nav-layout-column--actions>button.icon-btn{
    flex-basis:34px!important;width:34px!important;min-width:34px!important;height:34px!important;min-height:34px!important
  }
  .dynamic-site-header .nav-layout-row--search-main .nav-layout-column--actions .dc-theme-switch{flex-basis:68px!important;inline-size:68px!important;block-size:34px!important}
  .dynamic-site-header .nav-layout-row--search-main .nav-layout-column--actions .dc-theme-switch button{block-size:28px!important;font-size:14px!important}
}