@import url('https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@500;600;700&display=swap');

/* ===================================================================
   MZNX - Checkout redesign v2 (DESIGN SKIN ONLY - data stays dynamic).
   Scoped to the WooCommerce checkout. Delete this whole block to revert.
   =================================================================== */

/* 0) Hide the floating 3D graphics (coin + crystal) */
.elementor-element-fb53567,
.elementor-element-b82b790 { display: none !important; }

/* 1) HEADING "Checkout" - compact, premium, tighter top gap */
.woocommerce-page .elementor-heading-title{
  font-family: 'Space Grotesk', sans-serif !important;
  font-size: 34px !important;
  font-weight: 700 !important;
  letter-spacing: -1px !important;
  line-height: 1.1 !important;
}
.elementor-element-9441c75 { margin-top: -85px !important; }
.elementor-element-9441c75 .elementor-heading-title::after{
  content: "Secure checkout - instant access delivered to your email after payment";
  display: block; margin-top: 12px;
  font-family: 'Inter', sans-serif; font-size: 15px; font-weight: 400;
  color: #9990b0; letter-spacing: .2px;
}

/* 2) Inputs - modern, tappable, visible borders */
.woocommerce-checkout .input-text,
.woocommerce-checkout textarea,
.woocommerce-checkout select {
  background: #16121f !important;
  border: 1px solid rgba(255,255,255,.10) !important;
  border-radius: 12px !important;
  color: #fff !important;
  padding: 14px 16px !important;
  font-size: 15px !important;
  min-height: 52px !important;
  box-shadow: none !important;
  transition: border-color .15s, box-shadow .15s, background .15s !important;
}
.woocommerce-checkout .input-text::placeholder { color: #6b6480 !important; opacity: 1 !important; }
.woocommerce-checkout .input-text:focus,
.woocommerce-checkout textarea:focus {
  border-color: #8b5cf6 !important;
  background: #1b1528 !important;
  box-shadow: 0 0 0 3px rgba(139,92,246,.22) !important;
  outline: none !important;
}

/* 3) Labels */
.woocommerce-checkout .form-row label {
  color: #cdc6e0 !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  letter-spacing: .2px !important;
  margin-bottom: 8px !important;
  display: inline-block !important;
}
.woocommerce-checkout .required { color: #8b5cf6 !important; border: 0 !important; text-decoration: none !important; }
.woocommerce-checkout .optional { color: #6b6480 !important; }

/* 4) Country / State (select2) - match inputs */
.woocommerce-checkout .select2-container--default .select2-selection--single {
  background: #16121f !important;
  border: 1px solid rgba(255,255,255,.10) !important;
  border-radius: 12px !important;
  height: 52px !important;
}
.woocommerce-checkout .select2-container--default .select2-selection--single .select2-selection__rendered {
  color: #fff !important; line-height: 52px !important; padding-left: 16px !important;
}
.woocommerce-checkout .select2-container--default .select2-selection--single .select2-selection__arrow { height: 50px !important; }
.select2-dropdown { background: #16121f !important; border: 1px solid rgba(139,92,246,.30) !important; color: #fff !important; }

/* 5) Field spacing */
.woocommerce-checkout .form-row { margin-bottom: 16px !important; }

/* 6) CARDS - premium glass (order card + billing column; NOT column-end to avoid card-in-card) */
.e-checkout__order_review,
.e-checkout__column-start {
  background: rgba(255,255,255,.03) !important;
  border: 1px solid rgba(139,92,246,.22) !important;
  border-radius: 20px !important;
  padding: 30px !important;
  box-shadow: 0 24px 60px -34px rgba(0,0,0,.75) !important;
}

/* 7) ORDER SUMMARY table - premium, tabular numbers */
.woocommerce-checkout-review-order-table { font-variant-numeric: tabular-nums !important; width: 100% !important; }
.woocommerce-checkout-review-order-table td,
.woocommerce-checkout-review-order-table th { border: 0 !important; padding: 13px 0 !important; }
.woocommerce-checkout-review-order-table thead th {
  color: #6c6484 !important; font-weight: 600 !important; font-size: 12px !important;
  text-transform: uppercase; letter-spacing: 1px;
}
.woocommerce-checkout-review-order-table .cart-subtotal th,
.woocommerce-checkout-review-order-table .cart-subtotal td { color: #9990b0 !important; font-weight: 400 !important; }
.woocommerce-checkout-review-order-table .order-total { border-top: 1px solid rgba(255,255,255,.08) !important; }
.woocommerce-checkout-review-order-table .order-total th { font-size: 15px !important; font-weight: 600 !important; }
.woocommerce-checkout-review-order-table .order-total .amount {
  font-family: 'Space Grotesk', sans-serif !important;
  font-size: 26px !important; font-weight: 700 !important; color: #fff !important;
}

/* 8) Place-order button - premium gradient */
#place_order {
  background: linear-gradient(135deg,#9061ff,#6d28d9) !important;
  border: 0 !important;
  border-radius: 12px !important;
  padding: 18px 24px !important;
  font-size: 16px !important;
  font-weight: 700 !important;
  letter-spacing: .3px !important;
  width: 100% !important;
  color: #fff !important;
  box-shadow: 0 12px 30px -8px rgba(139,92,246,.55) !important;
  transition: transform .12s, box-shadow .12s, filter .12s !important;
}
#place_order:hover {
  transform: translateY(-2px) !important;
  filter: brightness(1.07) !important;
  box-shadow: 0 18px 40px -8px rgba(139,92,246,.70) !important;
}

/* 9) Coupon / promo toggle - tidy */
.woocommerce-form-coupon-toggle .woocommerce-info {
  background: #16121f !important;
  border: 1px solid rgba(255,255,255,.08) !important;
  border-radius: 12px !important;
  color: #cdc6e0 !important;
  padding: 14px 16px !important;
}
.checkout_coupon .input-text { margin-bottom: 12px !important; }
.checkout_coupon .button {
  background: rgba(139,92,246,.14) !important; color: #a78bfa !important;
  border: 1px solid rgba(139,92,246,.30) !important; border-radius: 10px !important;
}

/* 10) Soften the error / notice block */
.woocommerce-error {
  background: rgba(239,68,68,.08) !important;
  border: 1px solid rgba(239,68,68,.35) !important;
  border-radius: 12px !important;
  color: #fecaca !important;
  padding: 16px 18px !important;
  box-shadow: none !important;
}
.woocommerce-error li { color: #fecaca !important; }
.woocommerce-error strong { color: #fff !important; }
.woocommerce-message {
  background: rgba(139,92,246,.08) !important;
  border: 1px solid rgba(139,92,246,.30) !important;
  border-radius: 12px !important;
  color: #e9e4f7 !important;
}

/* 11) Paysera block - dark native select + softer box */
.woocommerce-checkout #payment select,
.woocommerce-checkout .payment_box select,
.woocommerce-checkout .wc_payment_method select,
.woocommerce-checkout .payment_methods select {
  background: #16121f !important; color: #fff !important;
  border: 1px solid rgba(255,255,255,.12) !important; border-radius: 10px !important;
  min-height: 44px !important; padding: 8px 12px !important; font-size: 14px !important;
}
.woocommerce-checkout #payment .payment_box { background: rgba(255,255,255,.02) !important; border-radius: 12px !important; }