/*
 * Mundo de Brincar — responsive/commercial hotfixes.
 *
 * Loaded after the theme and shared commercial polish so the fixes below
 * correct layout defects without changing the theme's content model.
 */

html[data-store-theme="mundo-de-brincar"]{
  scroll-padding-top:132px;
  overflow-x:clip;
}
html[data-store-theme="mundo-de-brincar"] body{overflow-x:hidden}

/* Media wrappers must establish a real box. Inline picture/span elements were
   ignoring aspect-ratio and allowing portrait assets to stretch whole rows. */
html[data-store-theme="mundo-de-brincar"] :is(.toyHeroMedia,.toyEditorialMedia)>picture,
html[data-store-theme="mundo-de-brincar"] .toyWorldGrid a>span>picture,
html[data-store-theme="mundo-de-brincar"] .toyAgeGrid a>span>picture,
html[data-store-theme="mundo-de-brincar"] .toyPartyRail figure>picture{
  display:block;
  width:100%;
}
html[data-store-theme="mundo-de-brincar"] :is(.toyHeroMedia,.toyEditorialMedia)>picture{
  height:100%;
}
html[data-store-theme="mundo-de-brincar"] :is(.toyHeroMedia,.toyEditorialMedia)>picture>img{
  display:block;
  width:100%!important;
  height:100%!important;
  max-width:none;
  aspect-ratio:auto!important;
}

/* Discovery/world cards: keep every image and label inside its own grid cell. */
html[data-store-theme="mundo-de-brincar"] .toyWorldGrid>a{
  display:grid!important;
  grid-template-rows:auto auto;
  align-content:start;
  gap:10px;
  min-width:0;
  overflow:hidden;
}
html[data-store-theme="mundo-de-brincar"] .toyWorldGrid>a>span{
  position:relative;
  display:block!important;
  width:100%;
  aspect-ratio:1.3/1;
  overflow:hidden;
  border-radius:9px;
  background:#f6f6f6;
}
html[data-store-theme="mundo-de-brincar"] .toyWorldGrid>a>span>picture{
  height:100%;
}
html[data-store-theme="mundo-de-brincar"] .toyWorldGrid>a>span img{
  display:block;
  width:100%!important;
  height:100%!important;
  max-width:none;
  aspect-ratio:auto!important;
  object-fit:cover;
}
html[data-store-theme="mundo-de-brincar"] .toyWorldGrid>a.is-catalog-fallback>span{
  background:#fff;
}
html[data-store-theme="mundo-de-brincar"] .toyWorldGrid>a.is-catalog-fallback>span img{
  object-fit:contain!important;
  object-position:center bottom;
}
html[data-store-theme="mundo-de-brincar"] .toyWorldGrid>a>strong{
  display:block;
  min-width:0;
  margin:0!important;
  line-height:1.25;
}

/* Circular age shortcuts also depended on an inline wrapper. */
html[data-store-theme="mundo-de-brincar"] .toyAgeGrid>a>span{
  position:relative;
  display:block!important;
  overflow:hidden;
}
html[data-store-theme="mundo-de-brincar"] .toyAgeGrid>a>span>picture{
  height:100%;
}
html[data-store-theme="mundo-de-brincar"] .toyAgeGrid>a>span img{
  display:block;
  width:100%!important;
  height:100%!important;
  max-width:none;
  aspect-ratio:auto!important;
  object-fit:contain;
}

/* Favourite categories: constrain the photograph instead of letting its
   intrinsic portrait height control the complete section. */
html[data-store-theme="mundo-de-brincar"] .toyPartyRail>a{
  display:block!important;
  min-width:0;
  overflow:hidden;
}
html[data-store-theme="mundo-de-brincar"] .toyPartyRail figure{
  display:grid!important;
  grid-template-rows:auto auto;
  align-content:start;
  gap:9px;
  min-width:0;
  margin:0;
}
html[data-store-theme="mundo-de-brincar"] .toyPartyRail figure>picture{
  height:auto;
  aspect-ratio:1.15/1;
  overflow:hidden;
  border-radius:9px;
  background:#f5f5f5;
}
html[data-store-theme="mundo-de-brincar"] .toyPartyRail figure>picture>img{
  display:block;
  width:100%!important;
  height:100%!important;
  max-width:none;
  aspect-ratio:auto!important;
  border-radius:0!important;
  object-fit:cover;
  object-position:center;
}
html[data-store-theme="mundo-de-brincar"] .toyPartyRail figcaption{
  min-width:0;
  min-height:0!important;
  padding:0!important;
  line-height:1.3;
  overflow-wrap:anywhere;
}

/* Editorial image wrappers should fill the card without creating hidden extra
   height below the picture. */
html[data-store-theme="mundo-de-brincar"] .toyEditorialMedia{
  min-width:0;
  overflow:hidden;
}

/* Commercial footer: reset inherited pill-button styles and restore a real
   navigation grid. */
html[data-store-theme="mundo-de-brincar"] :is(.toyFooter,.toyStoreFooter){
  display:grid!important;
  grid-template-columns:minmax(0,1.45fr) minmax(150px,.75fr) minmax(150px,.75fr);
  align-items:start;
  gap:32px;
  width:100%;
}
html[data-store-theme="mundo-de-brincar"] :is(.toyFooter,.toyStoreFooter)>*{
  min-width:0;
}
html[data-store-theme="mundo-de-brincar"] :is(.toyFooter,.toyStoreFooter)>div>strong{
  display:block;
  font-size:24px;
  line-height:1.1;
}
html[data-store-theme="mundo-de-brincar"] :is(.toyFooter,.toyStoreFooter)>div>p{
  max-width:42ch;
  margin:14px 0 0;
  line-height:1.55;
}
html[data-store-theme="mundo-de-brincar"] :is(.toyFooter,.toyStoreFooter)>nav{
  display:grid!important;
  grid-template-columns:minmax(0,1fr)!important;
  align-content:start;
  justify-items:start;
  gap:5px!important;
  min-width:0;
}
html[data-store-theme="mundo-de-brincar"] :is(.toyFooter,.toyStoreFooter)>nav>strong{
  display:block;
  margin:0 0 7px;
  line-height:1.2;
}
html[data-store-theme="mundo-de-brincar"] :is(.toyFooter,.toyStoreFooter)>nav>:is(a,button,span){
  appearance:none;
  display:inline-flex!important;
  align-items:center;
  justify-content:flex-start!important;
  width:auto!important;
  max-width:100%;
  min-width:0!important;
  min-height:0!important;
  height:auto!important;
  margin:0!important;
  padding:4px 0!important;
  border:0!important;
  border-radius:0!important;
  background:transparent!important;
  box-shadow:none!important;
  color:#fff!important;
  font-size:13px;
  font-weight:400;
  line-height:1.35;
  text-align:left!important;
  white-space:normal;
  opacity:.92;
}
html[data-store-theme="mundo-de-brincar"] :is(.toyFooter,.toyStoreFooter)>nav>:is(a,button):hover{
  opacity:1;
  text-decoration:underline;
  text-underline-offset:3px;
}
html[data-store-theme="mundo-de-brincar"] :is(.toyFooter,.toyStoreFooter)>.toyMeasureGuide{
  grid-column:1/-1;
  justify-self:center;
  margin-top:8px!important;
}

/* Keep commercial pages inside the viewport. */
html[data-store-theme="mundo-de-brincar"] .toyCommercial,
html[data-store-theme="mundo-de-brincar"] .toyCommercial .productDetail,
html[data-store-theme="mundo-de-brincar"] .toyCommercial .relatedSection{
  min-width:0;
}
html[data-store-theme="mundo-de-brincar"] .toyCommercial .relatedSection .sectionTitle{
  line-height:1.05;
}

@media(max-width:900px){
  /* The two utility bars use different class names on home and inner routes. */
  html[data-store-theme="mundo-de-brincar"] .toyUtility,
  html[data-store-theme="mundo-de-brincar"] #storeHeader .toyStoreUtility{
    display:none!important;
  }
  html[data-store-theme="mundo-de-brincar"] #storeHeader .toyStoreHeader{
    top:0!important;
  }

  /* The previous rule changed the hero to flex without changing its direction,
     leaving text and photograph squeezed side by side on a phone. */
  html[data-store-theme="mundo-de-brincar"] .toyHero{
    display:grid!important;
    grid-template-columns:minmax(0,1fr)!important;
    grid-template-rows:auto auto!important;
    min-height:0!important;
    width:100%;
    overflow:hidden;
  }
  html[data-store-theme="mundo-de-brincar"] .toyHeroMedia{
    grid-column:1;
    grid-row:1;
    width:100%!important;
    height:auto!important;
    min-height:0!important;
    aspect-ratio:4/3!important;
    overflow:hidden;
  }
  html[data-store-theme="mundo-de-brincar"] .toyHeroCopy{
    grid-column:1;
    grid-row:2;
    width:100%;
    min-width:0;
    padding:30px 20px 34px!important;
  }
  html[data-store-theme="mundo-de-brincar"] .toyHeroCopy :is(h1,h2){
    max-width:14ch!important;
    margin:9px 0 15px;
    font-size:clamp(36px,10.5vw,48px)!important;
    line-height:.98!important;
    overflow-wrap:break-word;
  }
  html[data-store-theme="mundo-de-brincar"] .toyHeroCopy p{
    max-width:38ch;
    margin:0;
    font-size:16px;
    line-height:1.48;
  }
  html[data-store-theme="mundo-de-brincar"] .toyHeroActions{
    display:flex!important;
    flex-wrap:wrap;
    align-items:center;
    gap:12px 16px!important;
    margin-top:20px;
  }
  html[data-store-theme="mundo-de-brincar"] .toyHeroActions .toyButton{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    width:auto;
    max-width:100%;
    min-height:44px;
    padding:10px 18px!important;
    line-height:1.2;
    text-align:center;
    white-space:normal;
  }
  html[data-store-theme="mundo-de-brincar"] .toyHeroActions .toyTextLink{
    display:inline-flex;
    align-items:center;
    gap:5px;
    min-height:36px;
    line-height:1.25;
  }

  /* Use a portrait product window for full-body discovery photographs. */
  html[data-store-theme="mundo-de-brincar"] .toyWorldGrid>a>span{
    aspect-ratio:4/5!important;
  }
  html[data-store-theme="mundo-de-brincar"] .toyPartyRail figure>picture{
    aspect-ratio:4/5!important;
  }

  html[data-store-theme="mundo-de-brincar"] :is(.toyFooter,.toyStoreFooter){
    grid-template-columns:1fr!important;
    gap:24px!important;
    padding:38px 20px 46px!important;
  }
  html[data-store-theme="mundo-de-brincar"] :is(.toyFooter,.toyStoreFooter)>.toyMeasureGuide{
    grid-column:1;
    justify-self:start;
    margin-top:2px!important;
  }
}

@media(max-width:520px){
  html[data-store-theme="mundo-de-brincar"] .toyWorldGrid,
  html[data-store-theme="mundo-de-brincar"] .toyPartyRail{
    gap:12px!important;
  }
  html[data-store-theme="mundo-de-brincar"] .toyWorldGrid>a{
    gap:8px;
  }
  html[data-store-theme="mundo-de-brincar"] .toyWorldGrid>a>strong,
  html[data-store-theme="mundo-de-brincar"] .toyPartyRail figcaption{
    font-size:13px!important;
  }
  html[data-store-theme="mundo-de-brincar"] .toyHeroCopy :is(h1,h2){
    max-width:none!important;
  }
}
