/* Compact manual quantity purchase surface, sharing the regular checkout. */
.ir-storefront-v1 .ir-storefront-package.ir-storefront-custom-quantity,
.ir-storefront-v1 .ir-storefront-package.ir-storefront-custom-quantity:hover {
  display:flex;
  flex-direction:row;
  align-items:center;
  justify-content:space-between;
  gap:16px;
  min-height:0;
  margin-top:12px;
  padding:11px 13px;
  border:1px dashed var(--network-border);
  border-radius:13px;
  background:var(--network-soft);
  box-shadow:none;
  transform:none;
  text-align:right;
}

.ir-storefront-custom-quantity__entry {
  min-width:0;
  flex:1;
  display:flex;
  align-items:center;
  flex-wrap:wrap;
  gap:8px 10px;
}

.ir-storefront-custom-quantity__entry label {
  color:var(--sf-text);
  font-size:11px;
  font-weight:850;
  white-space:nowrap;
}

.ir-storefront-custom-quantity__entry input {
  width:clamp(120px,22%,190px);
  min-height:39px;
  padding:5px 10px;
  border:1px solid var(--sf-line);
  border-radius:9px;
  background:var(--sf-surface);
  color:var(--sf-text);
  font:inherit;
  font-size:13px;
  direction:ltr;
  text-align:center;
}

.ir-storefront-custom-quantity__entry input:focus {
  outline:2px solid var(--network-primary);
  outline-offset:1px;
}

.ir-storefront-custom-quantity__entry small {
  color:var(--sf-muted);
  font-size:10px;
}

.ir-storefront-v1 .ir-storefront-custom-quantity button {
  width:auto;
  flex:0 0 155px;
  min-height:39px;
  margin:0;
}

html.dark .ir-storefront-v1 .ir-storefront-package.ir-storefront-custom-quantity {
  background:color-mix(in srgb,var(--network-primary) 8%,#131f31);
  border-color:var(--network-border);
}

@media (max-width:700px) {
  .ir-storefront-v1 .ir-storefront-package.ir-storefront-custom-quantity,
  .ir-storefront-v1 .ir-storefront-package.ir-storefront-custom-quantity:hover {
    display:flex!important;
    flex-direction:column!important;
    align-items:stretch!important;
    gap:10px!important;
    height:auto!important;
    min-height:0!important;
    padding:12px!important;
    margin-top:11px;
    border:1px dashed var(--network-border)!important;
    border-radius:13px!important;
    background:var(--network-soft)!important;
    transform:none!important;
    box-shadow:none!important;
  }

  .ir-storefront-custom-quantity__entry {
    display:grid;
    grid-template-columns:110px minmax(0,1fr);
    gap:8px;
    align-items:center;
  }

  .ir-storefront-custom-quantity__entry input {
    width:100%;
    min-width:0;
  }

  .ir-storefront-custom-quantity__entry small {
    grid-column:1/-1;
  }

  .ir-storefront-v1 .ir-storefront-custom-quantity button {
    flex:0 0 auto!important;
    width:100%!important;
    min-height:40px!important;
  }
}
