/* Recipe Clothing V3 site-wide action system.
 * Keeps action hierarchy consistent across catalogue, bag, checkout, account,
 * confirmation and content routes while preserving compact utility/icon controls.
 */
body.recipe-store--uniqlo-v3{
  --v3-button-height:52px;
  --v3-button-height-mobile:48px;
  --v3-button-radius:999px;
  --v3-button-bg:#000;
  --v3-button-bg-hover:#262626;
  --v3-button-text:#fff;
  --v3-button-border:#cfcfcf;
  --v3-button-secondary-bg:#fff;
  --v3-button-secondary-hover:#f5f5f5;
  --v3-button-disabled-bg:#e7e7e7;
  --v3-button-disabled-text:#8a8a8a;
  --v3-button-focus:#0068b7;
}

/* Primary commerce/action buttons. */
body.recipe-store--uniqlo-v3 :is(
  .v3-primary-button,
  .lux-button:not(.secondary),
  .checkout-submit,
  .review-form button[type="submit"]
){
  -webkit-appearance:none;
  appearance:none;
  box-sizing:border-box;
  min-height:var(--v3-button-height)!important;
  min-width:160px;
  padding:0 30px!important;
  border:1px solid var(--v3-button-bg)!important;
  border-radius:var(--v3-button-radius)!important;
  background:var(--v3-button-bg)!important;
  color:var(--v3-button-text)!important;
  display:inline-flex!important;
  align-items:center;
  justify-content:center;
  gap:8px;
  font:500 15px/1 Arial,"Helvetica Neue",Helvetica,sans-serif!important;
  letter-spacing:0!important;
  text-align:center;
  text-decoration:none!important;
  text-transform:none!important;
  white-space:nowrap;
  box-shadow:none!important;
  cursor:pointer;
  transition:background-color .16s ease,border-color .16s ease,color .16s ease,transform .12s ease;
}
body.recipe-store--uniqlo-v3 :is(
  .v3-primary-button,
  .lux-button:not(.secondary),
  .checkout-submit,
  .review-form button[type="submit"]
):hover{
  background:var(--v3-button-bg-hover)!important;
  border-color:var(--v3-button-bg-hover)!important;
  color:#fff!important;
}
body.recipe-store--uniqlo-v3 :is(
  .v3-primary-button,
  .lux-button:not(.secondary),
  .checkout-submit,
  .review-form button[type="submit"]
):active{
  transform:translateY(1px);
}

/* Secondary buttons share the same capsule geometry without competing with the CTA. */
body.recipe-store--uniqlo-v3 :is(
  .lux-button.secondary,
  .v3-bag-update,
  .account-print,
  .v3-filter-panel__footer button:first-child
){
  -webkit-appearance:none;
  appearance:none;
  box-sizing:border-box;
  min-height:var(--v3-button-height)!important;
  min-width:132px;
  padding:0 26px!important;
  border:1px solid var(--v3-button-border)!important;
  border-radius:var(--v3-button-radius)!important;
  background:var(--v3-button-secondary-bg)!important;
  color:#111!important;
  display:inline-flex!important;
  align-items:center;
  justify-content:center;
  gap:8px;
  font:500 14px/1 Arial,"Helvetica Neue",Helvetica,sans-serif!important;
  letter-spacing:0!important;
  text-align:center;
  text-decoration:none!important;
  text-transform:none!important;
  white-space:nowrap;
  box-shadow:none!important;
  cursor:pointer;
  transition:background-color .16s ease,border-color .16s ease,color .16s ease,transform .12s ease;
}
body.recipe-store--uniqlo-v3 :is(
  .lux-button.secondary,
  .v3-bag-update,
  .account-print,
  .v3-filter-panel__footer button:first-child
):hover{
  background:var(--v3-button-secondary-hover)!important;
  border-color:#9f9f9f!important;
}
body.recipe-store--uniqlo-v3 :is(
  .lux-button.secondary,
  .v3-bag-update,
  .account-print,
  .v3-filter-panel__footer button:first-child
):active{
  transform:translateY(1px);
}

/* Filter apply follows the primary action system but keeps its panel layout. */
body.recipe-store--uniqlo-v3 .v3-filter-panel__footer button:last-child{
  min-height:var(--v3-button-height)!important;
  border:1px solid #000!important;
  border-radius:var(--v3-button-radius)!important;
  background:#000!important;
  color:#fff!important;
  font:500 14px/1 Arial,"Helvetica Neue",Helvetica,sans-serif!important;
  cursor:pointer;
}
body.recipe-store--uniqlo-v3 .v3-filter-panel__footer button:last-child:hover{background:#262626!important;border-color:#262626!important}

/* Tertiary actions remain light, but use a consistent interaction treatment. */
body.recipe-store--uniqlo-v3 :is(.v3-secondary-link,.account-link-button){
  border:0!important;
  background:transparent!important;
  color:#111!important;
  padding:4px 0!important;
  border-radius:0!important;
  font:500 13px/1.35 Arial,"Helvetica Neue",Helvetica,sans-serif!important;
  text-decoration:underline!important;
  text-decoration-thickness:1px!important;
  text-underline-offset:4px!important;
  box-shadow:none!important;
  cursor:pointer;
}
body.recipe-store--uniqlo-v3 .account-link-button.danger{color:#b00020!important}

/* Shared focus and disabled states. */
body.recipe-store--uniqlo-v3 :is(
  .v3-primary-button,
  .lux-button,
  .checkout-submit,
  .review-form button[type="submit"],
  .v3-bag-update,
  .account-print,
  .v3-filter-panel__footer button,
  .v3-secondary-link,
  .account-link-button
):focus-visible{
  outline:2px solid var(--v3-button-focus)!important;
  outline-offset:3px!important;
}
body.recipe-store--uniqlo-v3 :is(
  .v3-primary-button,
  .lux-button,
  .checkout-submit,
  .review-form button[type="submit"],
  .v3-bag-update,
  .account-print,
  .v3-filter-panel__footer button
):is(:disabled,[aria-disabled="true"]){
  border-color:var(--v3-button-disabled-bg)!important;
  background:var(--v3-button-disabled-bg)!important;
  color:var(--v3-button-disabled-text)!important;
  cursor:not-allowed!important;
  pointer-events:none;
  transform:none!important;
}

/* Full-width actions where the surrounding layout is a dedicated action column. */
body.recipe-store--uniqlo-v3 :is(
  .v3-bag-summary,
  .v3-bag-empty,
  .account-form,
  .payment-forward,
  .thank-you
) > .v3-primary-button,
body.recipe-store--uniqlo-v3 .v3-bag-summary .v3-primary-button,
body.recipe-store--uniqlo-v3 .v3-bag-empty .v3-primary-button,
body.recipe-store--uniqlo-v3 .account-form > .lux-button,
body.recipe-store--uniqlo-v3 .payment-forward .lux-button{
  width:100%;
}
body.recipe-store--uniqlo-v3 .checkout-submit{width:100%!important}

/* Keep small icon/disclosure controls out of the CTA system. */
body.recipe-store--uniqlo-v3 :is(
  .u-action,
  .u-menu-toggle,
  .u-drawer__close,
  .u-v3-search button,
  .u-drawer__search button,
  .v3-plp__filter-button,
  .checkout-mobile-summary-toggle,
  .u3p-share,
  .u3p-qty button
){
  text-transform:none;
}

/* Mobile department links are navigation, so none is forced into a selected-tab state. */
@media(max-width:760px){
  body.recipe-store--uniqlo-v3 .u-v3-mobile-departments a:first-child{
    border-bottom-color:transparent!important;
  }
}

@media(max-width:640px){
  body.recipe-store--uniqlo-v3{
    --v3-button-height:var(--v3-button-height-mobile);
  }
  body.recipe-store--uniqlo-v3 :is(
    .v3-primary-button,
    .lux-button:not(.secondary),
    .checkout-submit,
    .review-form button[type="submit"]
  ){
    min-height:var(--v3-button-height-mobile)!important;
    padding-inline:22px!important;
    font-size:14px!important;
  }
  body.recipe-store--uniqlo-v3 :is(
    .lux-button.secondary,
    .v3-bag-update,
    .account-print
  ){
    min-height:var(--v3-button-height-mobile)!important;
    padding-inline:20px!important;
  }
  body.recipe-store--uniqlo-v3 .v3-bag-update,
  body.recipe-store--uniqlo-v3 .account-form > .lux-button,
  body.recipe-store--uniqlo-v3 .payment-forward .lux-button,
  body.recipe-store--uniqlo-v3 .thank-you > .lux-button{
    width:100%!important;
  }
}

@media(prefers-reduced-motion:reduce){
  body.recipe-store--uniqlo-v3 :is(
    .v3-primary-button,
    .lux-button,
    .checkout-submit,
    .review-form button[type="submit"],
    .v3-bag-update,
    .account-print,
    .v3-filter-panel__footer button
  ){
    transition:none!important;
  }
}