/* ==========================================================================
   HOCO REDESIGN — 55 CHECKOUT
   Restyle the WooCommerce/Woodmart checkout to match /test.
   Two-column on desktop (billing form + sticky order-review card),
   stacked on mobile. Rounded bordered field groups, brand "place order"
   button, clean Kashier payment list. RTL + responsive.
   Scoped under .woocommerce-checkout / form.checkout only.
   ========================================================================== */

/* page background + width -------------------------------------------------- */
.woocommerce-checkout .checkout.woocommerce-checkout{
  gap:26px;
  align-items:flex-start;
}

/* --- top notices: coupon / login toggles --------------------------------- */
.woocommerce-checkout .woocommerce-form-login-toggle,
.woocommerce-checkout .woocommerce-form-coupon-toggle{
  margin-bottom:18px;
}
.woocommerce-checkout .woocommerce-form-login-toggle .woocommerce-info,
.woocommerce-checkout .woocommerce-form-coupon-toggle .woocommerce-info,
.woocommerce-checkout .checkout_coupon.woocommerce-form-coupon,
.woocommerce-checkout .woocommerce-form-login{
  background:var(--hoco-surface);
  border:1px solid var(--hoco-line);
  border-top:3px solid var(--hoco-brand);
  border-radius:var(--hoco-radius);
  box-shadow:var(--hoco-shadow);
  padding:16px 18px;
}
.woocommerce-checkout .woocommerce-info a,
.woocommerce-checkout .showcoupon{
  color:var(--hoco-brand);
  font-weight:700;
}

/* ==========================================================================
   CUSTOMER DETAILS (billing / shipping) — carded field groups
   ========================================================================== */
.woocommerce-checkout #customer_details .woocommerce-billing-fields,
.woocommerce-checkout #customer_details .woocommerce-shipping-fields,
.woocommerce-checkout #customer_details .woocommerce-additional-fields,
.woocommerce-checkout #customer_details .woocommerce-account-fields{
  background:var(--hoco-surface);
  border:1px solid var(--hoco-line);
  border-radius:var(--hoco-radius);
  box-shadow:var(--hoco-shadow);
  padding:22px 24px;
  margin-bottom:22px;
}

/* group titles */
.woocommerce-checkout #customer_details h3,
.woocommerce-checkout #customer_details .woocommerce-billing-fields h3,
.woocommerce-checkout #customer_details .woocommerce-shipping-fields h3,
.woocommerce-checkout #customer_details .woocommerce-additional-fields h3{
  font-size:19px;
  font-weight:800;
  color:var(--hoco-ink);
  margin:0 0 18px;
  padding-bottom:12px;
  border-bottom:1px solid var(--hoco-line);
  display:flex;
  align-items:center;
}
.woocommerce-checkout #customer_details h3::before{
  content:"";
  display:inline-block;
  width:6px;height:20px;
  background:var(--hoco-brand);
  border-radius:3px;
  margin-inline-end:10px;
}
/* ship-to-different checkbox heading label stays inline */
.woocommerce-checkout #customer_details h3#ship-to-different-address label{
  font-weight:800;
  margin:0;
}
.woocommerce-checkout #customer_details h3#ship-to-different-address::before{
  content:none;
}

/* ---- fields ------------------------------------------------------------- */
.woocommerce-checkout .form-row label{
  display:block;
  font-weight:700;
  font-size:13.5px;
  color:var(--hoco-ink);
  margin-bottom:7px;
}
.woocommerce-checkout .form-row .required{
  color:var(--hoco-danger);
  text-decoration:none;
  border:0;
}
.woocommerce-checkout .form-row{
  margin-bottom:16px;
  padding:0;
}

.woocommerce-checkout form .form-row input.input-text,
.woocommerce-checkout form .form-row textarea,
.woocommerce-checkout form .form-row select,
.woocommerce-checkout #order_review input.input-text{
  width:100%;
  border:1.5px solid var(--hoco-line) !important;
  border-radius:var(--hoco-radius-sm) !important;
  background:#faf9fb;
  padding:12px 14px !important;
  font-family:inherit;
  font-size:15px;
  color:var(--hoco-ink);
  transition:border-color .18s, background .18s, box-shadow .18s;
}
.woocommerce-checkout form .form-row textarea{
  min-height:96px;
  line-height:1.6;
}
.woocommerce-checkout form .form-row input.input-text:focus,
.woocommerce-checkout form .form-row textarea:focus,
.woocommerce-checkout form .form-row select:focus{
  border-color:var(--hoco-brand) !important;
  background:#fff;
  box-shadow:0 0 0 3px rgba(84,4,87,.10);
  outline:0;
}
.woocommerce-checkout form .form-row.woocommerce-invalid input.input-text,
.woocommerce-checkout form .form-row.woocommerce-invalid select{
  border-color:var(--hoco-danger) !important;
}
.woocommerce-checkout form .form-row.woocommerce-validated input.input-text{
  border-color:var(--hoco-wa) !important;
}

/* select2 (country / state) match the inputs */
.woocommerce-checkout .select2-container--default .select2-selection--single{
  height:auto !important;
  border:1.5px solid var(--hoco-line) !important;
  border-radius:var(--hoco-radius-sm) !important;
  background:#faf9fb;
  padding:6px 6px;
}
.woocommerce-checkout .select2-container--default .select2-selection--single .select2-selection__rendered{
  line-height:32px;
  color:var(--hoco-ink);
  padding-inline-start:8px;
}
.woocommerce-checkout .select2-container--default .select2-selection--single .select2-selection__arrow{
  height:44px;
}
.woocommerce-checkout .select2-container--open .select2-selection--single{
  border-color:var(--hoco-brand) !important;
  box-shadow:0 0 0 3px rgba(84,4,87,.10);
}

/* ==========================================================================
   ORDER REVIEW — sticky card
   ========================================================================== */
.woocommerce-checkout .checkout-order-review,
.woocommerce-checkout #order_review{
  position:relative;
}
.woocommerce-checkout .checkout-order-review{
  position:sticky;
  top:96px;
  background:var(--hoco-surface);
  border:1px solid var(--hoco-line);
  border-radius:var(--hoco-radius);
  box-shadow:var(--hoco-shadow);
  padding:22px 22px 24px;
}
.woocommerce-checkout #order_review_heading{
  font-size:20px;
  font-weight:800;
  color:var(--hoco-ink);
  margin:0 0 18px;
  padding-bottom:14px;
  border-bottom:1px solid var(--hoco-line);
}

/* order table */
.woocommerce-checkout #order_review .shop_table{
  width:100%;
  border:0;
  margin:0;
  background:transparent;
}
.woocommerce-checkout #order_review .shop_table thead th{
  border:0;
  border-bottom:1px solid var(--hoco-line);
  padding:0 0 12px;
  font-size:13px;
  font-weight:700;
  color:var(--hoco-muted);
  text-transform:uppercase;
  letter-spacing:.02em;
}
.woocommerce-checkout #order_review .shop_table tbody td,
.woocommerce-checkout #order_review .shop_table tbody th{
  border:0;
  border-bottom:1px dashed var(--hoco-line);
  padding:14px 0;
  vertical-align:top;
  font-size:14.5px;
}
.woocommerce-checkout #order_review .shop_table td.product-name{
  color:var(--hoco-ink);
  font-weight:600;
  line-height:1.5;
}
.woocommerce-checkout #order_review .shop_table .product-quantity{
  color:var(--hoco-muted);
  font-weight:700;
}
.woocommerce-checkout #order_review .shop_table td.product-total{
  text-align:end;
  white-space:nowrap;
  font-weight:800;
  color:var(--hoco-price);
}

/* totals footer */
.woocommerce-checkout #order_review .shop_table tfoot th,
.woocommerce-checkout #order_review .shop_table tfoot td{
  border:0;
  border-bottom:1px solid var(--hoco-line);
  padding:12px 0;
  font-size:14.5px;
}
.woocommerce-checkout #order_review .shop_table tfoot th{
  font-weight:600;
  color:var(--hoco-muted);
  text-align:start;
}
.woocommerce-checkout #order_review .shop_table tfoot td{
  text-align:end;
  font-weight:700;
  color:var(--hoco-ink);
}
.woocommerce-checkout #order_review .shop_table tfoot .order-total th,
.woocommerce-checkout #order_review .shop_table tfoot .order-total td{
  border-bottom:0;
  padding-top:16px;
  font-size:16px;
}
.woocommerce-checkout #order_review .shop_table tfoot .order-total th{
  font-weight:800;
  color:var(--hoco-ink);
}
.woocommerce-checkout #order_review .shop_table tfoot .order-total td,
.woocommerce-checkout #order_review .shop_table tfoot .order-total .amount{
  font-size:20px;
  font-weight:800;
  color:var(--hoco-price);
}

/* ==========================================================================
   PAYMENT METHODS (Kashier, COD, ...) — clean list
   ========================================================================== */
.woocommerce-checkout #payment{
  background:transparent;
  border:0;
  border-radius:0;
  margin-top:20px;
}
.woocommerce-checkout #payment ul.payment_methods{
  border:0;
  padding:0;
  margin:0 0 18px;
  list-style:none;
  display:flex;
  flex-direction:column;
  gap:10px;
}
.woocommerce-checkout #payment ul.payment_methods li.wc_payment_method{
  position:relative;
  background:#faf9fb;
  border:1.5px solid var(--hoco-line);
  border-radius:var(--hoco-radius-sm);
  padding:14px 16px;
  margin:0;
  transition:border-color .18s, background .18s, box-shadow .18s;
}
.woocommerce-checkout #payment ul.payment_methods li.wc_payment_method:hover{
  border-color:#d9c4dd;
}
/* selected method */
.woocommerce-checkout #payment ul.payment_methods li.wc_payment_method:has(> input:checked){
  border-color:var(--hoco-brand);
  background:#fff;
  box-shadow:0 0 0 3px rgba(84,4,87,.08);
}
.woocommerce-checkout #payment ul.payment_methods li input[type=radio]{
  position:absolute;
  inset-inline-start:16px;
  top:18px;
  width:18px;height:18px;
  accent-color:var(--hoco-brand);
  margin:0;
}
.woocommerce-checkout #payment ul.payment_methods li label{
  display:flex;
  align-items:center;
  gap:8px;
  font-weight:700;
  font-size:15px;
  color:var(--hoco-ink);
  margin:0;
  padding-inline-start:30px;
  cursor:pointer;
  min-height:20px;
}
.woocommerce-checkout #payment ul.payment_methods li label img{
  display:inline-block;
  max-height:26px;
  width:auto;
  margin-inline-start:auto;
}
/* payment description box */
.woocommerce-checkout #payment .payment_box{
  background:transparent;
  border:0;
  margin:12px 0 2px;
  padding:12px 14px 2px;
  font-size:13.5px;
  color:var(--hoco-muted);
  line-height:1.6;
}
.woocommerce-checkout #payment .payment_box::before{
  display:none;
}
.woocommerce-checkout #payment .payment_box p:last-child{margin-bottom:0}

/* place order button */
.woocommerce-checkout #payment .place-order{
  padding:0;
  margin:0;
}
.woocommerce-checkout #payment #place_order,
.woocommerce-checkout #payment .place-order .button{
  width:100%;
  display:block;
  background:var(--hoco-brand) !important;
  color:#fff !important;
  border:0 !important;
  border-radius:var(--hoco-radius-sm) !important;
  padding:16px 22px !important;
  font-family:inherit;
  font-weight:800 !important;
  font-size:17px !important;
  line-height:1.2 !important;
  cursor:pointer;
  transition:background .2s, transform .1s, box-shadow .2s;
  box-shadow:0 6px 18px rgba(84,4,87,.28);
}
.woocommerce-checkout #payment #place_order:hover,
.woocommerce-checkout #payment .place-order .button:hover{
  background:var(--hoco-brand-dark) !important;
  box-shadow:0 8px 22px rgba(84,4,87,.34);
}
.woocommerce-checkout #payment #place_order:active{
  transform:translateY(1px);
}

/* terms / privacy row */
.woocommerce-checkout #payment .woocommerce-terms-and-conditions-wrapper{
  margin-bottom:16px;
  font-size:13.5px;
  color:var(--hoco-muted);
}
.woocommerce-checkout #payment .woocommerce-privacy-policy-text{
  font-size:13px;
  color:var(--hoco-muted);
  line-height:1.6;
}

/* ==========================================================================
   RESPONSIVE
   ========================================================================== */
@media (max-width:1024px){
  .woocommerce-checkout .checkout-order-review{
    position:static;
    margin-top:8px;
  }
}
@media (max-width:768px){
  .woocommerce-checkout #customer_details .woocommerce-billing-fields,
  .woocommerce-checkout #customer_details .woocommerce-shipping-fields,
  .woocommerce-checkout #customer_details .woocommerce-additional-fields,
  .woocommerce-checkout .checkout-order-review{
    padding:18px 16px;
  }
  .woocommerce-checkout #order_review_heading{font-size:18px}
  .woocommerce-checkout #payment #place_order{font-size:16px;padding:15px 18px !important}
}