/* ==========================================================================
   Side cart coupon entry + checkout coupon fixes (Novamira sandbox)
   Loaded site-wide by novamira-side-cart-coupon.php. Uses the theme's
   design tokens (--bw-*) with fallbacks matching style.css :root values.
   ========================================================================== */

/* ---- Side cart: coupon block ---- */
.bw-sc-coupon {
  margin: 0 0 1rem;
}

.bw-sc-coupon-form {
  display: flex;
  gap: 0.5rem;
}

.bw-sc-coupon-input {
  flex: 1 1 auto;
  min-width: 0;
  background: var(--bw-paper, #202020);
  color: var(--bw-text, #f0ebe4);
  border: 2px solid var(--bw-border, rgba(255, 255, 255, 0.08));
  border-radius: var(--bw-radius-sm, 10px);
  padding: 0.55rem 0.85rem;
  font-family: var(--bw-font, inherit);
  font-size: 0.875rem;
  text-transform: uppercase;
  transition: border-color 0.2s ease, box-shadow 0.2s ease;
}

.bw-sc-coupon-input::placeholder {
  color: var(--bw-muted, rgba(240, 235, 228, 0.4));
  text-transform: none;
}

.bw-sc-coupon-input:focus {
  border-color: var(--bw-accent, #c46754);
  box-shadow: 0 0 0 3px rgba(196, 103, 84, 0.1);
  outline: none;
}

.bw-sc-coupon-apply {
  flex: 0 0 auto;
  padding: 0.55rem 1.1rem !important;
  font-size: 0.8125rem !important;
  font-weight: 700 !important;
  border-radius: var(--bw-radius-sm, 10px) !important;
  border: 0;
  cursor: pointer;
}

.bw-sc-coupon-form.is-busy .bw-sc-coupon-apply {
  opacity: 0.6;
  pointer-events: none;
}

/* Applied coupon chips */
.bw-sc-coupon-applied {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
  margin: 0 0 0.6rem;
}

.bw-sc-coupon-chip {
  display: inline-flex;
  align-items: center;
  gap: 0.45rem;
  background: var(--bw-accent-soft, rgba(196, 103, 84, 0.15));
  border: 1px solid var(--bw-accent, #c46754);
  color: var(--bw-text, #f0ebe4);
  border-radius: 999px;
  padding: 0.3rem 0.45rem 0.3rem 0.85rem;
  font-size: 0.75rem;
  font-weight: 700;
  letter-spacing: 0.05em;
  text-transform: uppercase;
}

.bw-sc-coupon-remove {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 18px;
  height: 18px;
  padding: 0;
  border: 0;
  border-radius: 50%;
  background: rgba(255, 255, 255, 0.12);
  color: var(--bw-text, #f0ebe4);
  cursor: pointer;
  transition: background 0.2s ease, color 0.2s ease;
}

.bw-sc-coupon-remove:hover {
  background: var(--bw-accent, #c46754);
  color: #fff;
}

/* Feedback message */
.bw-sc-coupon-msg {
  font-size: 0.75rem;
  line-height: 1.4;
  margin: 0.5rem 0 0;
  display: none;
}

.bw-sc-coupon-msg.is-error {
  display: block;
  color: #e07b6a;
}

.bw-sc-coupon-msg.is-success {
  display: block;
  color: var(--bw-green, #6db87d);
}

/* Discount line under the subtotal (rendered by the theme footer when > 0) */
.bw-sc-discount {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 0.25rem;
}

.bw-sc-discount span {
  font-size: 0.875rem;
  color: var(--bw-text-secondary, rgba(240, 235, 228, 0.65));
}

.bw-sc-discount strong {
  font-size: 0.9375rem;
  color: var(--bw-green, #6db87d);
}

/* ---- Cart + checkout blocks: coupon input readability ----
   The coupon panel input rendered as a white WC Blocks field while the
   floating "Enter code" label and (on checkout) the typed text stayed in the
   theme's light colours, so both were invisible on white. The theme's own
   .wc-block-cart rule also forces a white input with dark text but never
   styles the label. Unify every coupon input to the dark themed field used
   by the rest of the checkout. Selectors are kept at (or above) the theme
   rule's specificity, and this file loads after style.css, so these win. */
.wc-block-cart .wc-block-components-totals-coupon__input input,
.wp-block-woocommerce-checkout .wc-block-components-totals-coupon__input input,
.wc-block-components-sidebar .wc-block-components-totals-coupon__input input,
.wc-block-components-totals-coupon .wc-block-components-text-input input {
  background: var(--bw-bg, #141414) !important;
  color: #fff !important;
  border: 2px solid var(--bw-border, rgba(255, 255, 255, 0.08)) !important;
  border-radius: var(--bw-radius-sm, 10px) !important;
}

.wc-block-cart .wc-block-components-totals-coupon__input input:focus,
.wp-block-woocommerce-checkout .wc-block-components-totals-coupon__input input:focus,
.wc-block-components-sidebar .wc-block-components-totals-coupon__input input:focus,
.wc-block-components-totals-coupon .wc-block-components-text-input input:focus {
  border-color: var(--bw-accent, #c46754) !important;
  background: var(--bw-paper, #202020) !important;
  box-shadow: 0 0 0 3px rgba(196, 103, 84, 0.1) !important;
  outline: none;
}

/* The floating "Enter code" label (both resting and shrunk states) */
.wc-block-cart .wc-block-components-totals-coupon__input label,
.wp-block-woocommerce-checkout .wc-block-components-totals-coupon__input label,
.wc-block-components-sidebar .wc-block-components-totals-coupon__input label,
.wc-block-components-totals-coupon .wc-block-components-text-input label {
  color: var(--bw-muted, rgba(240, 235, 228, 0.4)) !important;
}

/* ---- Checkout + cart blocks: applied coupon chips ---- */
.wc-block-components-totals-discount__coupon-list {
  list-style: none;
  margin: 0 !important;
  padding: 0 !important;
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
}

.wc-block-components-totals-discount__coupon-list li {
  margin: 0 !important;
  padding: 0 !important;
}

.wc-block-components-totals-discount .wc-block-components-chip {
  display: inline-flex;
  align-items: center;
  gap: 0.45rem;
  background: var(--bw-accent-soft, rgba(196, 103, 84, 0.15)) !important;
  border: 1px solid var(--bw-accent, #c46754) !important;
  color: var(--bw-text, #f0ebe4) !important;
  border-radius: 999px !important;
  padding: 0.3rem 0.45rem 0.3rem 0.85rem !important;
  font-size: 0.75rem !important;
  font-weight: 700 !important;
  letter-spacing: 0.05em;
  text-transform: uppercase;
}

.wc-block-components-totals-discount .wc-block-components-chip__text {
  color: inherit !important;
}

.wc-block-components-totals-discount .wc-block-components-chip__remove {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 18px;
  height: 18px;
  padding: 0;
  border: 0;
  border-radius: 50%;
  background: rgba(255, 255, 255, 0.12);
  color: var(--bw-text, #f0ebe4);
  cursor: pointer;
  transition: background 0.2s ease, color 0.2s ease;
}

.wc-block-components-totals-discount .wc-block-components-chip__remove:hover {
  background: var(--bw-accent, #c46754);
  color: #fff;
}

.wc-block-components-totals-discount .wc-block-components-chip__remove-icon {
  fill: currentColor;
  width: 12px;
  height: 12px;
}

/* ---- Checkout order summary: consistent insets ----
   The theme aligns item rows and totals rows to a 1rem inset, but WC's own
   sidebar and totals-wrapper defaults add extra horizontal padding on some
   layers, so the "Add coupons" row sat deeper than the rows around it and
   the title band stopped short of the card edges. Zero the wrapper layers
   and give every row the same 1rem inset (mirrors the theme's cart fix). */
.wc-block-checkout__sidebar {
  padding: 0 !important;
}

.wc-block-checkout__sidebar .wc-block-components-totals-wrapper {
  padding-left: 0 !important;
  padding-right: 0 !important;
}

.wc-block-checkout__sidebar .wc-block-components-totals-item {
  padding-left: 1rem !important;
  padding-right: 1rem !important;
}

.wc-block-checkout__sidebar .wc-block-components-totals-footer-item {
  padding-top: 0.75rem !important;
  padding-bottom: 0.75rem !important;
}

.wc-block-checkout__sidebar .wp-block-woocommerce-checkout-order-summary-coupon-form-block {
  padding-left: 0 !important;
  padding-right: 0 !important;
}

.wc-block-checkout__sidebar .wc-block-components-totals-coupon .wc-block-components-panel__button {
  padding-left: 1rem !important;
  padding-right: 1rem !important;
}

.wc-block-checkout__sidebar .wc-block-components-totals-coupon__content {
  padding: 0 1rem 1rem !important;
}

.wc-block-checkout__sidebar .wc-block-components-order-summary-item__description p {
  margin: 0.25rem 0 0;
}

/* Vertical breathing room: the item list sat flush against the title band
   above and the divider below. */
.wc-block-checkout__sidebar .wp-block-woocommerce-checkout-order-summary-cart-items-block {
  padding-top: 0.625rem !important;
  padding-bottom: 0.875rem !important;
}

.wc-block-checkout__sidebar .wc-block-components-order-summary-item {
  padding-top: 0.875rem !important;
  padding-bottom: 0.875rem !important;
}

/* Remaining wrapper layers that can carry WC default horizontal padding,
   keeping the "Add coupons" row deeper than the rows around it. */
.wc-block-checkout__sidebar .wc-block-components-totals-coupon,
.wc-block-checkout__sidebar .wc-block-components-panel {
  padding-left: 0 !important;
  padding-right: 0 !important;
}
