/* QA-036: editor actions remain available during long mobile forms. */
@media (max-width: 760px) {
  .admin .design-workspace > header {
    position: sticky;
    top: 0;
    z-index: 80;
    min-height: calc(68px + env(safe-area-inset-top, 0px));
    padding: calc(10px + env(safe-area-inset-top, 0px)) calc(12px + env(safe-area-inset-right, 0px)) 10px calc(68px + env(safe-area-inset-left, 0px));
    gap: 8px;
    align-items: center;
    background: #f4fbff;
    color: var(--admin-navy, #0b1120);
    border-bottom: 1px solid #d7e5ed;
    box-shadow: 0 8px 20px rgba(15, 23, 42, .09);
  }
  .admin .design-workspace > header > div:first-child { min-width: 0; }
  .admin .design-workspace > header h1 { color: var(--admin-navy, #0b1120); font-size: 16px; white-space: nowrap; }
  .admin .design-workspace > header small { color: #64748b; font-size: 9px; }
  .admin .design-workspace > header > div:last-child {
    display: grid;
    align-self: center;
    justify-items: stretch;
    flex: 0 0 clamp(112px, 32vw, 150px);
    gap: 5px;
  }
  .admin .design-workspace > header button {
    width: 100%;
    min-height: 30px;
    margin: 0;
    padding: 6px 8px;
    font-size: 11px;
    line-height: 1.1;
  }
}

@media (max-width: 350px) {
  .admin .design-workspace > header h1 { font-size: 15px; }
  .admin .design-workspace > header small { font-size: 8px; }
}

/* QA-037: settings keep using the existing tenant shippingSettings object. */
.payment-storefront-info,
.institutional-policy-settings {
  border: 1px solid var(--admin-border, #d7e5ed);
  border-radius: 14px;
  background: #f8fbfd;
  padding: 18px;
}
.payment-storefront-info {
  position: relative;
  margin-top: 24px;
  padding: 24px;
  overflow: hidden;
  background: linear-gradient(135deg, #f7fcff 0%, #eef8fe 100%);
  border-color: #b9dced;
  box-shadow: 0 10px 26px rgba(14, 165, 233, .08);
}
.payment-storefront-info::before {
  content: "";
  position: absolute;
  inset: 0 auto 0 0;
  width: 5px;
  background: linear-gradient(180deg, var(--admin-blue, #0ea5e9), #22c7dd);
}
.payment-storefront-info > small {
  color: var(--admin-blue-dark, #0879b2);
  letter-spacing: 1.1px;
  font-size: 10px;
  font-weight: 800;
}
.payment-storefront-info h3,
.institutional-policy-settings h3 { margin: 4px 0 6px; }
.payment-storefront-info h3 { color: #10233b; font-size: 21px; }
.payment-storefront-info p { color: #64748b; margin: 0 0 18px; }
.payment-storefront-info label {
  display: block;
  max-width: 520px;
  margin: 10px 0;
  color: #172033;
  font-weight: 700;
}
.payment-storefront-info label.check,
.institutional-policy-settings label.check { display: flex; align-items: center; gap: 9px; }
.payment-storefront-info label.check {
  min-height: 46px;
  padding: 11px 14px;
  background: rgba(255, 255, 255, .82);
  border: 1px solid #d5e8f2;
  border-radius: 10px;
}
.payment-storefront-info input[type="checkbox"],
.institutional-policy-settings input[type="checkbox"] { width: 17px; height: 17px; margin: 0; accent-color: var(--admin-blue, #0ea5e9); }
.payment-storefront-info select {
  display: block;
  width: min(100%, 520px);
  min-height: 44px;
  margin-top: 8px;
  padding: 10px 38px 10px 12px;
  color: #172033;
  background-color: #fff;
  border: 1px solid #bfd6e3;
  border-radius: 10px;
  font: inherit;
}
.payment-storefront-info select:focus {
  outline: none;
  border-color: var(--admin-blue, #0ea5e9);
  box-shadow: 0 0 0 3px rgba(14, 165, 233, .14);
}
.institutional-policy-settings { margin: 12px 0 16px; }
.institutional-days-control { display: flex; align-items: center; gap: 8px; }
.institutional-days-control input { max-width: 130px; }
.institutional-days-control span { color: #64748b; }

@media (max-width: 600px) {
  .payment-storefront-info { padding: 20px 16px 18px 20px; }
  .payment-storefront-info h3 { font-size: 18px; }
}

/* Align the two delivery price controls on the same baseline. */
.shipping-workspace .product-benefits-admin .shipping-editor-grid > label:not(.check) {
  grid-template-rows: 17px 49px auto;
  align-content: start;
  gap: 7px;
}
.shipping-workspace .product-benefits-admin .shipping-editor-grid > label:not(.check) > input {
  height: 49px;
  margin: 0 !important;
}

/* QA-038: every public product search uses the shared .search-box component. */
.store-shell .search-box form {
  width: clamp(190px, 22vw, 330px);
  height: 44px;
  border: 1px solid color-mix(in srgb, var(--ink) 55%, transparent);
  border-radius: 999px;
  background: color-mix(in srgb, var(--surface) 18%, transparent);
  color: var(--ink);
  padding-left: 5px;
  transition: border-color .18s, box-shadow .18s, background .18s;
}
.store-shell .search-box form:focus-within {
  border-color: var(--brand);
  background: color-mix(in srgb, var(--surface) 32%, transparent);
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--brand) 22%, transparent);
}
.store-shell .search-box input {
  color: var(--ink);
  padding: 10px 8px 10px 12px;
}
.store-shell .search-box input::placeholder {
  color: color-mix(in srgb, var(--ink) 72%, transparent);
  opacity: 1;
}
.store-shell .search-box form > button {
  width: 42px;
  min-width: 42px;
  height: 42px;
  padding: 10px;
  color: var(--ink);
  background: transparent;
  border-radius: 999px;
  overflow: visible;
}
.store-shell .search-box form > button:hover { background: color-mix(in srgb, var(--ink) 9%, transparent); }
.store-shell .search-box form > button svg { width: 21px; height: 21px; display: block; }

@media (max-width: 700px) {
  .store-shell .search-box,
  .store-shell .search-box form { width: 100%; }
  .store-shell .search-box form { min-height: 46px; }
}