/* AquaFlow V34.2.23 — Delivery form UI exact
   Physical stylesheet loaded last so iPhone/Safari cannot revive an older
   delivery-dialog layout from cache. */

@media (max-width: 760px) {
  body #delivery-dialog.aquaflow-delivery-dialog {
    --df-border: #cfe0ed;
    --df-ink: #112f4d;
    --df-muted: #6f859a;
    --df-blue: #0878ef;
    --df-soft-blue: #eef7ff;
    background: #f4f8fb !important;
  }

  body #delivery-dialog.aquaflow-delivery-dialog .delivery-enterprise-head {
    min-height: 78px !important;
    padding: calc(10px + env(safe-area-inset-top)) 14px 10px !important;
    background: rgba(255,255,255,.99) !important;
    border-bottom: 1px solid #d8e5ef !important;
    box-shadow: 0 3px 14px rgba(20,54,79,.045) !important;
  }
  body #delivery-dialog.aquaflow-delivery-dialog .delivery-enterprise-head small {
    font-size: 10px !important;
    letter-spacing: .15em !important;
  }
  body #delivery-dialog.aquaflow-delivery-dialog .delivery-enterprise-head h2 {
    margin-top: 3px !important;
    font-size: 23px !important;
    line-height: 1.05 !important;
    letter-spacing: -.035em !important;
  }
  body #delivery-dialog.aquaflow-delivery-dialog .delivery-enterprise-head .icon-btn {
    width: 45px !important;
    height: 45px !important;
    min-width: 45px !important;
    flex-basis: 45px !important;
    border: 2px solid #b6daf4 !important;
    border-radius: 14px !important;
    outline: 3px solid #e0f0fc !important;
    outline-offset: 2px !important;
    background: #f8fbfe !important;
    color: #526c82 !important;
    font-size: 26px !important;
  }

  body #delivery-dialog.aquaflow-delivery-dialog .delivery-form-scroll {
    gap: 10px !important;
    padding: 10px 11px 14px !important;
    background: #f4f8fb !important;
    scrollbar-gutter: auto !important;
  }

  /* Quick-delivery context: mirror the approved enterprise callout. */
  body #delivery-dialog.aquaflow-delivery-dialog .delivery-order-context:not(.is-hidden) {
    position: relative !important;
    display: grid !important;
    grid-template-columns: 42px minmax(0,1fr) !important;
    grid-template-rows: auto auto auto !important;
    column-gap: 10px !important;
    row-gap: 2px !important;
    min-height: 92px !important;
    margin: 0 !important;
    padding: 12px 12px !important;
    border: 1px solid #bfe0fa !important;
    border-radius: 17px !important;
    background: linear-gradient(135deg,#eef8ff 0%,#f6fbff 100%) !important;
    color: var(--df-ink) !important;
    box-shadow: none !important;
  }
  body #delivery-dialog.aquaflow-delivery-dialog .delivery-order-context:not(.is-hidden)::before {
    content: "▰" !important;
    grid-column: 1 !important;
    grid-row: 1 / span 3 !important;
    display: grid !important;
    place-items: center !important;
    align-self: center !important;
    width: 42px !important;
    height: 42px !important;
    border-radius: 12px !important;
    background: #dff0ff !important;
    color: #1688f5 !important;
    font-size: 21px !important;
    line-height: 1 !important;
  }
  body #delivery-dialog.aquaflow-delivery-dialog .delivery-order-context:not(.is-hidden) > span {
    grid-column: 2 !important;
    grid-row: 1 !important;
    color: #0878ef !important;
    font-size: 9.5px !important;
    font-weight: 950 !important;
    letter-spacing: .12em !important;
    line-height: 1.15 !important;
  }
  body #delivery-dialog.aquaflow-delivery-dialog .delivery-order-context:not(.is-hidden) > strong {
    grid-column: 2 !important;
    grid-row: 2 !important;
    color: #143451 !important;
    font-size: 13.5px !important;
    font-weight: 900 !important;
    line-height: 1.25 !important;
  }
  body #delivery-dialog.aquaflow-delivery-dialog .delivery-order-context:not(.is-hidden) > small {
    grid-column: 2 !important;
    grid-row: 3 !important;
    color: #657f96 !important;
    font-size: 10px !important;
    font-weight: 600 !important;
    line-height: 1.35 !important;
  }

  body #delivery-dialog.aquaflow-delivery-dialog .delivery-step-card {
    gap: 9px !important;
    padding: 10px !important;
    border: 1px solid var(--df-border) !important;
    border-radius: 17px !important;
    background: #fff !important;
    box-shadow: 0 4px 14px rgba(27,68,102,.035) !important;
  }
  body #delivery-dialog.aquaflow-delivery-dialog .delivery-step-head {
    gap: 9px !important;
    padding-bottom: 8px !important;
    border-bottom: 1px solid #e3edf4 !important;
  }
  body #delivery-dialog.aquaflow-delivery-dialog .delivery-step-head > span {
    width: 31px !important;
    height: 31px !important;
    flex-basis: 31px !important;
    border-radius: 10px !important;
    background: #eaf5ff !important;
    color: #0878ef !important;
    font-size: 11px !important;
    font-weight: 950 !important;
  }
  body #delivery-dialog.aquaflow-delivery-dialog .delivery-step-head strong {
    color: #163550 !important;
    font-size: 14.5px !important;
    line-height: 1.15 !important;
  }
  body #delivery-dialog.aquaflow-delivery-dialog .delivery-step-head small {
    color: #71879b !important;
    font-size: 9.8px !important;
    line-height: 1.25 !important;
  }

  body #delivery-dialog.aquaflow-delivery-dialog .delivery-step-card label,
  body #delivery-dialog.aquaflow-delivery-dialog .delivery-note-field {
    gap: 5px !important;
    color: #294861 !important;
    font-size: 11.5px !important;
    font-weight: 850 !important;
  }
  body #delivery-dialog.aquaflow-delivery-dialog .delivery-step-card :is(input:not([type="hidden"]),select:not(.delivery-customer-hidden),textarea),
  body #delivery-dialog.aquaflow-delivery-dialog .delivery-note-field input {
    box-sizing: border-box !important;
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
    height: 48px !important;
    min-height: 48px !important;
    padding-inline: 10px !important;
    border: 1px solid #bfd6e7 !important;
    border-radius: 13px !important;
    background: #fff !important;
    color: #132f4a !important;
    font-size: 16px !important;
    font-weight: 800 !important;
    box-shadow: none !important;
  }

  body #delivery-dialog.aquaflow-delivery-dialog .delivery-customer-stage .delivery-customer-picker-compact .delivery-customer-search-box {
    height: 48px !important;
    min-height: 48px !important;
    border: 1px solid #bfd6e7 !important;
    border-radius: 13px !important;
    background: #fff !important;
  }
  body #delivery-dialog.aquaflow-delivery-dialog .delivery-customer-stage .delivery-customer-picker-compact .delivery-customer-search-box input {
    height: 46px !important;
    min-height: 46px !important;
    border: 0 !important;
    background: transparent !important;
  }

  /* Date + time: equal columns, no overlap on iPhone. */
  body #delivery-dialog.aquaflow-delivery-dialog .transaction-datetime {
    display: grid !important;
    grid-template-columns: repeat(2,minmax(0,1fr)) !important;
    gap: 8px !important;
    width: 100% !important;
    min-width: 0 !important;
    align-items: end !important;
  }
  body #delivery-dialog.aquaflow-delivery-dialog .transaction-datetime > label {
    min-width: 0 !important;
    max-width: 100% !important;
    overflow: hidden !important;
  }
  body #delivery-dialog.aquaflow-delivery-dialog #delivery-date,
  body #delivery-dialog.aquaflow-delivery-dialog #delivery-time {
    box-sizing: border-box !important;
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
    inline-size: 100% !important;
    min-inline-size: 0 !important;
    max-inline-size: 100% !important;
    overflow: hidden !important;
  }
  body #delivery-dialog.aquaflow-delivery-dialog #delivery-date {
    padding-inline: 9px 7px !important;
    font-size: 14.5px !important;
    letter-spacing: -.16px !important;
  }
  body #delivery-dialog.aquaflow-delivery-dialog #delivery-time {
    padding-inline: 9px !important;
    font-size: 16px !important;
    text-align: left !important;
  }
  body #delivery-dialog.aquaflow-delivery-dialog #delivery-date::-webkit-date-and-time-value,
  body #delivery-dialog.aquaflow-delivery-dialog #delivery-time::-webkit-date-and-time-value {
    min-width: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    text-align: left !important;
  }

  /* 02 — exact 2-column alignment: returned bottle field = delivered bottle field. */
  body #delivery-dialog.aquaflow-delivery-dialog .delivery-primary-quantity,
  body #delivery-dialog.aquaflow-delivery-dialog .delivery-return-row,
  body #delivery-dialog.aquaflow-delivery-dialog .delivery-assignment-row {
    display: grid !important;
    grid-template-columns: repeat(2,minmax(0,1fr)) !important;
    gap: 8px !important;
    width: 100% !important;
    min-width: 0 !important;
  }
  body #delivery-dialog.aquaflow-delivery-dialog .delivery-return-row > label,
  body #delivery-dialog.aquaflow-delivery-dialog .delivery-return-row .bottle-company-preview {
    min-width: 0 !important;
    max-width: 100% !important;
  }
  body #delivery-dialog.aquaflow-delivery-dialog #delivery-returned-bottles {
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
    padding-inline: 9px !important;
  }
  body #delivery-dialog.aquaflow-delivery-dialog #delivery-returned-bottles::placeholder,
  body #delivery-dialog.aquaflow-delivery-dialog #bottle-quantity::placeholder {
    font-size: 14px !important;
    font-weight: 700 !important;
    letter-spacing: -.1px !important;
    opacity: .72 !important;
  }
  body #delivery-dialog.aquaflow-delivery-dialog .delivery-return-row .bottle-company-preview {
    box-sizing: border-box !important;
    min-height: 48px !important;
    height: 48px !important;
    padding: 7px 9px !important;
    border-radius: 13px !important;
    background: #edf6fc !important;
    color: #667f95 !important;
    font-size: 9.2px !important;
  }
  body #delivery-dialog.aquaflow-delivery-dialog .delivery-return-row .bottle-company-preview strong {
    font-size: 11px !important;
  }

  /* 03 — four equal compact exception chips. */
  body #delivery-dialog.aquaflow-delivery-dialog .delivery-extra-stage .delivery-option-strip {
    display: grid !important;
    grid-template-columns: repeat(4,minmax(0,1fr)) !important;
    gap: 6px !important;
  }
  body #delivery-dialog.aquaflow-delivery-dialog .delivery-extra-stage .delivery-option-chip {
    min-width: 0 !important;
    min-height: 42px !important;
    padding: 0 4px !important;
    border-radius: 11px !important;
    font-size: 9.8px !important;
    white-space: nowrap !important;
  }

  /* Fixed bottom actions match the approved mockup and stay clear of Home indicator. */
  body #delivery-dialog.aquaflow-delivery-dialog .workflow-fixed-actions {
    grid-template-columns: minmax(0,.82fr) minmax(0,1.45fr) !important;
    gap: 9px !important;
    min-height: 76px !important;
    padding: 9px 11px max(10px,env(safe-area-inset-bottom)) !important;
    border-top: 1px solid #d6e4ef !important;
    background: rgba(255,255,255,.995) !important;
    box-shadow: 0 -8px 24px rgba(20,54,79,.08) !important;
  }
  body #delivery-dialog.aquaflow-delivery-dialog .workflow-fixed-actions .btn {
    height: 52px !important;
    min-height: 52px !important;
    border-radius: 14px !important;
    font-size: 14.5px !important;
    font-weight: 900 !important;
  }
}

@media (max-width: 390px) {
  body #delivery-dialog.aquaflow-delivery-dialog .delivery-form-scroll {
    padding-inline: 9px !important;
  }
  body #delivery-dialog.aquaflow-delivery-dialog .transaction-datetime,
  body #delivery-dialog.aquaflow-delivery-dialog .delivery-primary-quantity,
  body #delivery-dialog.aquaflow-delivery-dialog .delivery-return-row,
  body #delivery-dialog.aquaflow-delivery-dialog .delivery-assignment-row {
    gap: 6px !important;
  }
  body #delivery-dialog.aquaflow-delivery-dialog #delivery-date {
    font-size: 13.5px !important;
    padding-inline: 7px 5px !important;
  }
  body #delivery-dialog.aquaflow-delivery-dialog #delivery-time {
    font-size: 15px !important;
    padding-inline: 7px !important;
  }
  body #delivery-dialog.aquaflow-delivery-dialog .delivery-extra-stage .delivery-option-strip {
    gap: 4px !important;
  }
  body #delivery-dialog.aquaflow-delivery-dialog .delivery-extra-stage .delivery-option-chip {
    min-height: 40px !important;
    padding-inline: 2px !important;
    font-size: 9.1px !important;
  }
}
