/* TamirSet checkout mobile CTA + conflict patch v21.1
 * Load via @stack('late_styles') — AFTER public-shell-core.
 *
 * Conflicts resolved:
 * 1) shell hides .tmset-commerce-mobile-bar (visibility/pointer-events)
 * 2) polish-v19 forces .tmset-commerce-row { display:flex !important }
 *    which ignores remediation grid-column on the shipping note
 * 3) shared form-status ::before icon needs padding-inline-start:46px;
 *    a shorthand padding reset covers the first letters of the status
 */

@media (max-width: 1060px) {
  html[data-tmset-shell-css="v1"] body.tmset-has-commerce-page .tmset-commerce-mobile-bar,
  html[data-tmset-shell-css="v1"] body[data-tmset-page="checkout_page"] .tmset-commerce-mobile-bar,
  body.tmset-has-commerce-page .tmset-commerce-mobile-bar,
  .tmset-checkout-page .tmset-commerce-mobile-bar {
    display: grid !important;
    visibility: visible !important;
    opacity: 1 !important;
    pointer-events: auto !important;
    position: fixed !important;
    inset-inline: 10px !important;
    inset-block-end: calc(10px + env(safe-area-inset-bottom, 0px)) !important;
    z-index: 7800 !important;
    width: auto !important;
    max-width: calc(100vw - 20px) !important;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: center;
    gap: 10px;
    min-height: 64px;
    padding: 8px 10px !important;
    border-radius: 20px !important;
    background: #0b2239 !important;
    color: #fff !important;
    box-shadow: 0 18px 44px rgba(7, 23, 38, 0.28) !important;
    transform: none !important;
  }

  html[data-tmset-shell-css="v1"] body.tmset-has-commerce-page .tmset-commerce-mobile-bar [data-commerce-submit],
  .tmset-checkout-page .tmset-commerce-mobile-bar [data-commerce-submit] {
    display: inline-flex !important;
    visibility: visible !important;
    opacity: 1 !important;
    pointer-events: auto !important;
    align-items: center;
    justify-content: center;
    min-width: 148px;
    min-height: 48px;
    padding: 0 16px;
    border: 0;
    border-radius: 14px;
    background: #16a34a !important;
    color: #fff !important;
    font-weight: 800;
    font-size: 0.92rem;
    white-space: nowrap;
  }

  html[data-tmset-shell-css="v1"] body.tmset-has-commerce-page .tmset-commerce-mobile-bar span,
  html[data-tmset-shell-css="v1"] body.tmset-has-commerce-page .tmset-commerce-mobile-bar strong {
    color: #fff !important;
  }

  .tmset-checkout-page .tmset-commerce-summary .tmset-commerce-primary-btn {
    display: flex !important;
    visibility: visible !important;
    width: 100%;
    min-height: 48px;
    margin-top: 8px;
  }

  body.tmset-has-commerce-page main[data-tmset-main="checkout"],
  .tmset-checkout-page {
    padding-bottom: calc(96px + env(safe-area-inset-bottom, 0px)) !important;
  }

  html[data-tmset-shell-css="v1"] body.tmset-has-commerce-page .tmset-mobile-dock {
    display: none !important;
    visibility: hidden !important;
    pointer-events: none !important;
  }
}

body.tmset-checkout-complete .tmset-commerce-mobile-bar {
  display: none !important;
}

/* Shipping row: beat polish-v19 flex !important so the note gets its own line. */
body.tmset-checkout-polish-v19 .tmset-commerce-row[data-commerce-shipping-row],
.tmset-checkout-page .tmset-commerce-row[data-commerce-shipping-row],
.tmset-commerce-row[data-commerce-shipping-row] {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) max-content !important;
  align-items: start !important;
  justify-content: stretch !important;
  column-gap: 12px !important;
  row-gap: 6px !important;
}

.tmset-commerce-row[data-commerce-shipping-row] > span {
  min-width: 0;
  overflow-wrap: normal;
  word-break: keep-all;
}

.tmset-commerce-row[data-commerce-shipping-row] > strong {
  white-space: nowrap !important;
  flex: none;
}

.tmset-commerce-row[data-commerce-shipping-row] .tmset-checkout-shipping-note {
  grid-column: 1 / -1 !important;
  flex: 1 1 100%;
  width: 100%;
  max-width: 100%;
  color: #64748b;
  font-size: 0.74rem;
  line-height: 1.8;
  font-weight: 500;
  text-align: right;
  white-space: normal !important;
  overflow-wrap: break-word;
  word-break: normal;
}

/* Live status: keep icon gutter; do not use padding shorthand. */
.tmset-checkout-page [data-commerce-live-status]:empty {
  display: none !important;
}

.tmset-checkout-page [data-commerce-live-status]:not(:empty),
.tmset-checkout-page .tmset-commerce-message:not(:empty) {
  display: block !important;
  position: relative;
  white-space: normal !important;
  overflow: visible !important;
  text-overflow: unset !important;
  word-break: normal;
  overflow-wrap: break-word;
  max-width: 100%;
  line-height: 1.75;
  color: #065f46 !important;
  background: #ecfdf5 !important;
  border: 1px solid #a7f3d0 !important;
  border-radius: 16px;
  padding-block: 12px !important;
  padding-inline-end: 14px !important;
  padding-inline-start: 46px !important;
}

html[data-tmset-checkout-quote-state="pending"] .tmset-checkout-page [data-commerce-live-status]:not(:empty) {
  color: #92400e !important;
  background: #fffbeb !important;
  border-color: #fde68a !important;
}
