/* Vanilla Retail header layout correction, October 2026.
   All four desktop header children occupy one explicit CSS-grid row:
   original logo | categories | search | account actions.
   Previously a three-track grid forced actions onto the next row. */
body.vanilla-store.recipe-store--uniqlo-v3 .u-header .u-header__main {
  display:grid!important;
  grid-template-columns:minmax(175px,230px) minmax(275px,1fr) minmax(145px,215px) max-content!important;
  grid-template-rows:minmax(76px,auto)!important;
  align-items:center!important;
  gap:clamp(12px,1.65vw,30px)!important;
  height:auto!important;
  min-height:76px!important;
  max-width:none!important;
  width:100%!important;
  margin:0 auto!important;
  padding:0 clamp(16px,2.7vw,56px)!important;
  box-sizing:border-box!important;
}
body.vanilla-store.recipe-store--uniqlo-v3 .u-header .u-header__main > .u-brand {
  grid-column:1!important;
  grid-row:1!important;
  align-self:center!important;
  justify-self:start!important;
  min-width:0!important;
  width:100%!important;
  max-width:230px!important;
  margin:0!important;
}
body.vanilla-store.recipe-store--uniqlo-v3 .u-header .u-header__main > .u-departments {
  grid-column:2!important;
  grid-row:1!important;
  align-self:stretch!important;
  justify-self:start!important;
  display:flex!important;
  align-items:center!important;
  gap:clamp(14px,1.7vw,32px)!important;
  min-width:0!important;
  margin:0!important;
}
body.vanilla-store.recipe-store--uniqlo-v3 .u-header .u-header__main > .u-v3-search {
  grid-column:3!important;
  grid-row:1!important;
  display:block!important;
  min-width:0!important;
  width:100%!important;
  max-width:215px!important;
  justify-self:end!important;
  margin:0!important;
}
body.vanilla-store.recipe-store--uniqlo-v3 .u-header .u-v3-search form {
  width:100%!important;
  height:44px!important;
  display:grid!important;
  grid-template-columns:minmax(0,1fr) 44px!important;
  align-items:center!important;
  border:1px solid rgba(0,0,0,.22)!important;
  border-radius:0!important;
  background:transparent!important;
  box-shadow:none!important;
}
body.vanilla-store.recipe-store--uniqlo-v3 .u-header .u-v3-search input {
  width:100%!important;
  min-width:0!important;
  padding:0 9px 0 13px!important;
  box-sizing:border-box!important;
  font-size:14px!important;
}
body.vanilla-store.recipe-store--uniqlo-v3 .u-header .u-header__main > .u-actions {
  grid-column:4!important;
  grid-row:1!important;
  display:flex!important;
  align-items:center!important;
  flex-wrap:nowrap!important;
  justify-self:end!important;
  justify-content:flex-end!important;
  gap:clamp(9px,1.2vw,18px)!important;
  min-width:max-content!important;
  width:max-content!important;
  margin:0!important;
  padding:0!important;
  position:static!important;
  align-self:center!important;
}
body.vanilla-store.recipe-store--uniqlo-v3 .u-header .u-actions > :is(a,button) {
  flex:0 0 auto!important;
  display:grid!important;
  place-items:center!important;
  width:32px!important;
  min-width:32px!important;
  height:39px!important;
  padding:5px!important;
  margin:0!important;
  box-sizing:border-box!important;
  border:0!important;
  background:transparent!important;
  color:#000!important;
  line-height:1!important;
  cursor:pointer;
}
body.vanilla-store.recipe-store--uniqlo-v3 .u-header .u-actions :is(a,button) svg {
  width:23px!important;
  height:23px!important;
  stroke:#000!important;
  fill:none!important;
  stroke-width:1.65!important;
  stroke-linecap:round!important;
  stroke-linejoin:round!important;
  filter:none!important;
  display:block!important;
}
body.vanilla-store.recipe-store--uniqlo-v3 .u-header .u-actions > :is(a,button):focus-visible,
body.vanilla-store.recipe-store--uniqlo-v3 .u-header .u-v3-search button:focus-visible {
  outline:2px solid #000!important;
  outline-offset:3px!important;
}
body.vanilla-store.recipe-store--uniqlo-v3 .u-header .u-actions > .u-menu-toggle,
body.vanilla-store.recipe-store--uniqlo-v3 .u-header .u-actions > .vanilla-search-toggle {
  display:none!important;
}
body.vanilla-store.recipe-store--uniqlo-v3 .u-header .u-actions .u-action span:not(.u-cart-count) {
  position:absolute!important;
  width:1px!important;
  height:1px!important;
  overflow:hidden!important;
  clip-path:inset(50%)!important;
  white-space:nowrap!important;
}
body.vanilla-store.recipe-store--uniqlo-v3 .u-header .u-cart-count {
  position:absolute!important;
  top:0!important;
  right:-4px!important;
  min-width:15px!important;
  height:15px!important;
  padding:2px!important;
  font-size:10px!important;
  line-height:11px!important;
  background:#000!important;
  color:#fff6e7!important;
  border-radius:50%!important;
}

/* Medium desktop: move search to a working drawer icon, retain categories. */
@media (max-width:1180px) and (min-width:1025px) {
  body.vanilla-store.recipe-store--uniqlo-v3 .u-header .u-header__main {
    grid-template-columns:minmax(160px,205px) minmax(235px,1fr) max-content!important;
    gap:clamp(10px,2vw,22px)!important;
    padding-inline:22px!important;
  }
  body.vanilla-store.recipe-store--uniqlo-v3 .u-header .u-header__main > .u-v3-search {
    display:none!important;
  }
  body.vanilla-store.recipe-store--uniqlo-v3 .u-header .u-header__main > .u-actions {
    grid-column:3!important;
  }
  body.vanilla-store.recipe-store--uniqlo-v3 .u-header .u-actions > .vanilla-search-toggle {
    display:grid!important;
  }
}

/* Tablet and mobile: full-width one-row header with logo left and icons right. */
@media (max-width:1024px) {
  body.vanilla-store.recipe-store--uniqlo-v3 .u-header .u-header__main {
    display:grid!important;
    grid-template-columns:minmax(0,1fr) max-content!important;
    grid-template-rows:66px!important;
    gap:12px!important;
    height:66px!important;
    min-height:66px!important;
    padding:0 18px!important;
  }
  body.vanilla-store.recipe-store--uniqlo-v3 .u-header .u-header__main > .u-brand {
    grid-column:1!important;
    max-width:195px!important;
    min-width:0!important;
    justify-self:start!important;
  }
  body.vanilla-store.recipe-store--uniqlo-v3 .u-header .u-header__main > .u-departments,
  body.vanilla-store.recipe-store--uniqlo-v3 .u-header .u-header__main > .u-v3-search {
    display:none!important;
  }
  body.vanilla-store.recipe-store--uniqlo-v3 .u-header .u-header__main > .u-actions {
    grid-column:2!important;
    grid-row:1!important;
    min-width:0!important;
    gap:8px!important;
  }
  body.vanilla-store.recipe-store--uniqlo-v3 .u-header .u-actions > .u-menu-toggle,
  body.vanilla-store.recipe-store--uniqlo-v3 .u-header .u-actions > .vanilla-search-toggle {
    display:grid!important;
  }
  body.vanilla-store.recipe-store--uniqlo-v3 .u-header .u-actions > .u-v3-heart {
    display:none!important;
  }
  body.vanilla-store.recipe-store--uniqlo-v3 .u-header .u-v3-mobile-departments {
    display:flex!important;
    height:auto!important;
    min-height:42px!important;
    align-items:center!important;
    justify-content:center!important;
    gap:clamp(14px,4vw,40px)!important;
    padding:8px 14px!important;
    background:#fff6e7!important;
    border-top:1px solid rgba(0,0,0,.12)!important;
  }
  body.vanilla-store.recipe-store--uniqlo-v3 .u-header .u-v3-mobile-departments a {
    flex:0 0 auto!important;
    font-size:11px!important;
    font-weight:800!important;
    padding:7px 0!important;
    margin:0!important;
  }
  body.vanilla-store.recipe-store--uniqlo-v3 .u-header .vanilla-brand__logo {
    width:min(100%,190px)!important;
    max-width:190px!important;
    max-height:36px!important;
    height:auto!important;
  }
}
@media (max-width:480px) {
  body.vanilla-store.recipe-store--uniqlo-v3 .u-header .u-header__main {
    grid-template-rows:58px!important;
    min-height:58px!important;
    height:58px!important;
    padding:0 12px!important;
    gap:8px!important;
  }
  body.vanilla-store.recipe-store--uniqlo-v3 .u-header .vanilla-brand__logo {
    width:min(100%,150px)!important;
    max-width:150px!important;
  }
  body.vanilla-store.recipe-store--uniqlo-v3 .u-header .u-header__main > .u-actions {
    gap:3px!important;
  }
  body.vanilla-store.recipe-store--uniqlo-v3 .u-header .u-actions > :is(a,button) {
    width:31px!important;
    min-width:31px!important;
  }
  body.vanilla-store.recipe-store--uniqlo-v3 .u-header .u-v3-mobile-departments {
    justify-content:space-between!important;
    gap:8px!important;
    padding-inline:13px!important;
  }
}
