/**
 * checkout.css
 *
 * Note: .woocommerce-form-coupon-toggle is also unhooked via PHP
 * (remove_action woocommerce_before_checkout_form). The CSS rule
 * below is a belt-and-suspenders fallback.
 */
 * Theme overrides for the unified cart + checkout page.
 * Uses --p-* custom properties so dark-mode flips automatically.
 */

/* ── WC coupon toggle banner (also removed via PHP hook) ─────── */
.woocommerce-form-coupon-toggle { display: none !important; }

/* ── Notices wrapper — always in #ldr-swap, never overlapping header */
#ldr-swap .woocommerce-notices-wrapper {
  min-height: 0;
  margin-bottom: 0;
}

#ldr-swap .woocommerce-notices-wrapper:empty { display: none; }

/* ── Billing / shipping field grid ───────────────────────────── */
.woocommerce-billing-fields__field-wrapper,
.woocommerce-shipping-fields__field-wrapper {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 0.625rem 0.875rem;
}

@media (max-width: 640px) {
  .woocommerce-billing-fields__field-wrapper,
  .woocommerce-shipping-fields__field-wrapper {
    grid-template-columns: 1fr;
  }
}

.woocommerce-billing-fields__field-wrapper .form-row,
.woocommerce-shipping-fields__field-wrapper .form-row {
  margin: 0 !important;
  padding: 0 !important;
  float: none !important;
  clear: none !important;
  width: auto !important;
}

.form-row.form-row-wide {
  grid-column: 1 / -1;
}

/* ── Section headings ─────────────────────────────────────────── */
.woocommerce-billing-fields > h3,
.woocommerce-shipping-fields > h3 {
  font-family: "Cormorant Garamond", Georgia, serif;
  font-size: 1.375rem;
  font-weight: 500;
  color: var(--p-ink);
  margin: 0 0 1.125rem 0;
  padding-bottom: 0.875rem;
  border-bottom: 1px solid var(--p-line);
  letter-spacing: -0.01em;
}

.woocommerce-shipping-fields > h3 {
  margin-top: 1.75rem;
}

.woocommerce-shipping-fields h3 label {
  font-family: "Cormorant Garamond", Georgia, serif;
  font-size: 1.375rem;
  font-weight: 500;
  color: var(--p-ink);
  cursor: pointer;
  letter-spacing: -0.01em;
}

/* ── Field labels ─────────────────────────────────────────────── */
.woocommerce-checkout .form-row > label,
.woocommerce-checkout .form-row label:not(.woocommerce-form__label-for-checkbox) {
  font-family: "JetBrains Mono", monospace;
  font-size: 0.6875rem;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--p-inkMut);
  display: block;
  margin-bottom: 0.375rem;
  font-weight: 400;
  line-height: 1.4;
}

/* ── Text inputs ─────────────────────────────────────────────── */
.woocommerce-checkout .form-row .input-text,
.woocommerce-checkout .form-row input[type="text"],
.woocommerce-checkout .form-row input[type="email"],
.woocommerce-checkout .form-row input[type="tel"],
.woocommerce-checkout .form-row input[type="number"],
.woocommerce-checkout .form-row input[type="password"],
.woocommerce-checkout .form-row textarea {
  width: 100% !important;
  padding: 0.6875rem 0.875rem;
  background: var(--p-bg) !important;
  border: 1.5px solid var(--p-line) !important;
  border-radius: 0.625rem !important;
  color: var(--p-ink) !important;
  font-size: 0.9375rem;
  font-family: "Manrope", system-ui, sans-serif;
  outline: none !important;
  box-shadow: none !important;
  transition: border-color 0.18s;
  line-height: 1.4;
  -webkit-appearance: none;
  appearance: none;
}

.woocommerce-checkout .form-row .input-text:focus,
.woocommerce-checkout .form-row input:focus,
.woocommerce-checkout .form-row textarea:focus {
  border-color: var(--p-ink) !important;
  box-shadow: none !important;
}

/* ── Native select ───────────────────────────────────────────── */
.woocommerce-checkout .form-row select {
  width: 100% !important;
  padding: 0.6875rem 0.875rem;
  background: var(--p-bg) !important;
  border: 1.5px solid var(--p-line) !important;
  border-radius: 0.625rem !important;
  color: var(--p-ink) !important;
  font-size: 0.9375rem;
  font-family: inherit;
  outline: none !important;
  box-shadow: none !important;
  transition: border-color 0.18s;
  -webkit-appearance: none;
  appearance: none;
}

/* ── Select2 (country / state dropdowns) ─────────────────────── */
.woocommerce-checkout .select2-container .select2-selection--single {
  height: auto !important;
  padding: 0.6875rem 0.875rem;
  background: var(--p-bg) !important;
  border: 1.5px solid var(--p-line) !important;
  border-radius: 0.625rem !important;
  outline: none !important;
  box-shadow: none !important;
  transition: border-color 0.18s;
}

.woocommerce-checkout .select2-container--open .select2-selection--single,
.woocommerce-checkout .select2-container .select2-selection--single:focus {
  border-color: var(--p-ink) !important;
}

.woocommerce-checkout .select2-selection__rendered {
  color: var(--p-ink) !important;
  font-size: 0.9375rem;
  line-height: 1.4 !important;
  padding: 0 !important;
}

.woocommerce-checkout .select2-selection__arrow {
  top: 50% !important;
  right: 0.875rem !important;
  transform: translateY(-50%);
  height: auto !important;
}

.woocommerce-checkout .select2-dropdown {
  background: var(--p-surface) !important;
  border: 1.5px solid var(--p-line) !important;
  border-radius: 0.75rem !important;
  box-shadow: 0 8px 24px color-mix(in oklch, var(--p-ink) 12%, transparent);
  overflow: hidden;
}

.woocommerce-checkout .select2-results__option {
  color: var(--p-ink);
  font-size: 0.9375rem;
  padding: 0.5rem 0.875rem;
}

.woocommerce-checkout .select2-results__option--highlighted,
.woocommerce-checkout .select2-results__option--highlighted[aria-selected] {
  background: color-mix(in oklch, var(--p-line) 80%, transparent) !important;
  color: var(--p-ink) !important;
}

.woocommerce-checkout .select2-search--dropdown .select2-search__field {
  background: var(--p-bg) !important;
  border: 1.5px solid var(--p-line) !important;
  border-radius: 0.5rem !important;
  color: var(--p-ink) !important;
  padding: 0.5rem 0.75rem;
  outline: none !important;
}

/* ── Required asterisk ───────────────────────────────────────── */
.woocommerce-checkout .required,
.woocommerce-checkout abbr[title="required"] {
  color: var(--p-sale);
  text-decoration: none;
  border-bottom: none;
}

/* ── Validation states ───────────────────────────────────────── */
.woocommerce-checkout .woocommerce-invalid .input-text,
.woocommerce-checkout .woocommerce-invalid input,
.woocommerce-checkout .woocommerce-invalid select {
  border-color: var(--p-sale) !important;
}

.woocommerce-checkout .woocommerce-invalid > label {
  color: var(--p-sale) !important;
}

/* ── Checkboxes ──────────────────────────────────────────────── */
.woocommerce-checkout .woocommerce-form__label-for-checkbox {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  font-size: 0.875rem;
  color: var(--p-ink);
  cursor: pointer;
  font-family: "Manrope", system-ui, sans-serif;
}

.woocommerce-checkout input[type="checkbox"] {
  accent-color: var(--p-ink);
  width: 1rem;
  height: 1rem;
  border-radius: 0.25rem;
  flex-shrink: 0;
}

/* ── Order review table ──────────────────────────────────────── */
.woocommerce-checkout-review-order-table {
  width: 100%;
  border-collapse: collapse;
  font-size: 0.875rem;
}

.woocommerce-checkout-review-order-table th,
.woocommerce-checkout-review-order-table td {
  padding: 0.6rem 0;
  color: var(--p-ink);
  vertical-align: middle;
  border-bottom: 1px solid var(--p-line);
}

.woocommerce-checkout-review-order-table thead th {
  font-family: "JetBrains Mono", monospace;
  font-size: 0.625rem;
  letter-spacing: 0.15em;
  text-transform: uppercase;
  color: var(--p-inkMut);
  font-weight: 400;
  padding-bottom: 0.75rem;
}

.woocommerce-checkout-review-order-table .product-name {
  font-weight: 500;
  color: var(--p-ink);
}

.woocommerce-checkout-review-order-table .product-name .product-quantity {
  color: var(--p-inkMut);
  font-weight: 400;
  font-size: 0.8125rem;
}

.woocommerce-checkout-review-order-table tfoot th {
  font-weight: 400;
  color: var(--p-inkMut);
  font-size: 0.8125rem;
}

.woocommerce-checkout-review-order-table tfoot td {
  font-weight: 500;
  text-align: right;
}

.woocommerce-checkout-review-order-table tfoot .order-total th,
.woocommerce-checkout-review-order-table tfoot .order-total td {
  font-family: "Cormorant Garamond", Georgia, serif;
  font-size: 1.375rem;
  font-weight: 500;
  border-bottom: none;
  padding-top: 0.875rem;
  color: var(--p-ink);
}

/* ── Payment methods ─────────────────────────────────────────── */
.woocommerce-checkout-payment {
  margin-top: 1.25rem;
}

.woocommerce-checkout-payment .payment_methods {
  list-style: none;
  padding: 0;
  margin: 0 0 1rem 0;
  border: 1.5px solid var(--p-line);
  border-radius: 0.75rem;
  overflow: hidden;
}

.woocommerce-checkout-payment .payment_methods > li {
  padding: 0.875rem 1rem;
  border-bottom: 1px solid var(--p-line);
}

.woocommerce-checkout-payment .payment_methods > li:last-child {
  border-bottom: none;
}

.woocommerce-checkout-payment .payment_methods input[type="radio"] {
  accent-color: var(--p-ink);
  width: 1rem;
  height: 1rem;
  flex-shrink: 0;
}

.woocommerce-checkout-payment .payment_methods label {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  font-size: 0.9375rem;
  color: var(--p-ink);
  cursor: pointer;
  font-weight: 500;
}

.woocommerce-checkout-payment .payment_methods img {
  max-height: 1.375rem;
  vertical-align: middle;
  opacity: 0.85;
}

.woocommerce-checkout-payment .payment_box {
  background: var(--p-bg);
  border-radius: 0.5rem;
  padding: 0.75rem 1rem;
  margin-top: 0.75rem;
  font-size: 0.875rem;
  color: var(--p-inkMut);
  line-height: 1.55;
}

.woocommerce-checkout-payment .payment_box p {
  margin: 0;
}

/* ── Place order button ──────────────────────────────────────── */
#place_order {
  display: block;
  width: 100% !important;
  height: 3.5rem;
  background: var(--p-ink) !important;
  color: var(--p-bg) !important;
  border: none !important;
  border-radius: 0.75rem !important;
  font-size: 0.9375rem;
  font-weight: 600;
  letter-spacing: 0.04em;
  cursor: pointer;
  transition: background 0.2s, transform 0.2s;
  box-shadow: 0 10px 30px -12px color-mix(in oklch, var(--p-ink) 50%, transparent) !important;
  font-family: "Manrope", system-ui, sans-serif;
}

#place_order:hover {
  background: var(--p-primary) !important;
  transform: translateY(-1px);
}

/* ── WC notices inside checkout ──────────────────────────────── */
.woocommerce-checkout .woocommerce-NoticeGroup .woocommerce-error {
  list-style: none;
  padding: 0.875rem 1rem;
  margin: 0 0 1.25rem 0;
  background: color-mix(in oklch, var(--p-sale) 8%, var(--p-surface));
  border: 1.5px solid color-mix(in oklch, var(--p-sale) 30%, var(--p-line));
  border-radius: 0.75rem;
  color: var(--p-ink);
  font-size: 0.875rem;
}

/* ── Additional info / order notes ──────────────────────────── */
.woocommerce-additional-fields__field-wrapper .form-row {
  margin: 0 !important;
}

/* ── Hide the WC order review table in the checkout sidebar
      (we render manual totals above it; WC AJAX can still update
       the hidden table for fragment compatibility) ────────────── */
#order_review .woocommerce-checkout-review-order-table {
  display: none !important;
}

/* ── Order-pay: payment section inside form-pay.php ─────────── */
#order_review .wc_payment_methods { margin-bottom: 1rem; }

/* ── Thankyou: order meta grid borders ──────────────────────── */
.woocommerce-order .grid > div { border-color: var(--p-line); }

/* ── Thankyou: item meta (variation labels) ──────────────────── */
.woocommerce-order .wc-item-meta { margin: 0.25rem 0 0; }
.woocommerce-order .wc-item-meta li { font-size: 0.6875rem; color: var(--p-inkMut); }

/* ── Terms and conditions ────────────────────────────────────── */
.woocommerce-terms-and-conditions-wrapper {
  font-size: 0.8125rem;
  color: var(--p-inkMut);
  margin-top: 0.75rem;
  line-height: 1.5;
}

.woocommerce-terms-and-conditions-wrapper a {
  color: var(--p-ink);
  text-decoration: underline;
  text-underline-offset: 2px;
}
