/**
 * Nova Commerce Suite - Sprint 1.5 Drawer Structure & Mobile UX.
 */

/* Give the expanded coupon controls room to breathe below the toggle. */
.ncd-coupon-box.is-open .ncd-coupon-form,
.ncd-coupon-form.is-visible {
  margin-top: 12px !important;
}

/* Keep the two intentional scroll regions stable and visually clear. */
.ncd-drawer__body,
.ncd-drawer__footer {
  scroll-behavior: smooth;
  scrollbar-color: color-mix(in srgb, var(--ncd-primary) 35%, transparent) transparent;
}

.ncd-drawer__body {
  flex-basis: 42% !important;
}

.ncd-drawer__footer {
  flex-basis: auto !important;
  background: var(--ncd-bg, #fff);
}

/* Prevent long product content from pushing actions out of alignment. */
.ncd-cart-item__content,
.ncd-recommendation__content {
  min-width: 0 !important;
}

.ncd-cart-item__title,
.ncd-recommendation__title {
  overflow-wrap: anywhere;
}

/* Strong, consistent keyboard focus without changing pointer styling. */
.ncd-drawer :where(button, a, input, [tabindex]):focus-visible {
  outline: 3px solid color-mix(in srgb, var(--ncd-gold) 72%, #fff) !important;
  outline-offset: 2px !important;
}

/* Avoid interaction while an AJAX mutation is in flight. */
.ncd-drawer.is-loading .ncd-cart-item,
.ncd-drawer.is-loading .ncd-coupon-box,
.ncd-drawer.is-loading .ncd-empty-cart {
  pointer-events: none;
}

@media (max-width: 480px) {
  .ncd-coupon-box.is-open .ncd-coupon-form,
  .ncd-coupon-form.is-visible {
    margin-top: 10px !important;
  }

  .ncd-drawer__body {
    flex-basis: 40% !important;
  }

  .ncd-drawer__footer {
    max-height: 61dvh !important;
  }
}

@media (max-width: 360px) {
  .ncd-coupon-form {
    grid-template-columns: minmax(0, 1fr) !important;
  }

  .ncd-coupon-submit {
    width: 100% !important;
  }
}

@media (prefers-reduced-motion: reduce) {
  .ncd-drawer__body,
  .ncd-drawer__footer {
    scroll-behavior: auto;
  }
}