/**
 * Bongoto — Checkout Only
 * File: assets/css/checkout.css
 */

/* ================= Font FIX (bring back theme's original font) ================= */
/* Force checkout content to use site's BODY font, but keep icon fonts intact */
body.woocommerce-checkout .woocommerce,
body.woocommerce-checkout .woocommerce *{
  font-family: inherit;
}

/* Keep icon fonts safe */
body.woocommerce-checkout .dashicons,
body.woocommerce-checkout .dashicons:before,
body.woocommerce-checkout .dashicons-before:before{
  font-family: "dashicons" !important;
}

/* Font Awesome safety (if used) */
body.woocommerce-checkout .fa,
body.woocommerce-checkout .fas,
body.woocommerce-checkout .far,
body.woocommerce-checkout .fal,
body.woocommerce-checkout .fab{
  font-family: var(--fa-style-family, inherit) !important;
}

/* ================= Spacing ================= */

body.woocommerce-checkout .site-main,
body.woocommerce-checkout .content-area,
body.woocommerce-checkout .site-content{
  padding-top: 18px !important; /* gap below the header */
  margin-top: 0 !important;
}

/* Wider checkout container (reduce side whitespace) */
body.woocommerce-checkout .woocommerce form.checkout{
  max-width: 1320px;
  width: calc(100% - 32px);
  margin: 0 auto;
}

/* Card look */
body.woocommerce-checkout #customer_details,
body.woocommerce-checkout #order_review{
  background: #fff;
  border: 1px solid rgba(0,0,0,.08);
  border-radius: 14px;
  padding: 18px;
}

/* Inputs */
body.woocommerce-checkout input[type="text"],
body.woocommerce-checkout input[type="email"],
body.woocommerce-checkout input[type="tel"],
body.woocommerce-checkout input[type="password"],
body.woocommerce-checkout select,
body.woocommerce-checkout textarea{
  height: 46px;
  border-radius: 10px;
  padding: 10px 12px;
  border: 1px solid rgba(0,0,0,.18);
  background: #fff;
  box-shadow: none;
  font-family: inherit; /* stays with theme font */
}
body.woocommerce-checkout textarea{
  height: auto;
  min-height: 110px;
}
body.woocommerce-checkout input:focus,
body.woocommerce-checkout select:focus,
body.woocommerce-checkout textarea:focus{
  outline: none;
  border-color: rgba(0,0,0,.35);
}

/* Headings */
body.woocommerce-checkout h3{
  margin: 0 0 14px 0;
}

/* Notices */
body.woocommerce-checkout .woocommerce-error,
body.woocommerce-checkout .woocommerce-message,
body.woocommerce-checkout .woocommerce-info{
  border-radius: 12px;
}

/* Coupon toggle (clean + icon remove + checkbox align) */
body.woocommerce-checkout .woocommerce-form-coupon-toggle .woocommerce-info{
  border-radius: 12px;
  border: 1px dashed rgba(0,0,0,.18);
  padding: 12px 14px !important;
  display: flex;
  align-items: center;
  gap: 10px;
  line-height: 1.4;
}
body.woocommerce-checkout .woocommerce-form-coupon-toggle .woocommerce-info::before{
  content: none !important;
  display: none !important;
}
body.woocommerce-checkout .woocommerce-form-coupon-toggle .woocommerce-info input[type="checkbox"]{
  margin: 0;
  position: relative;
  top: 0;
  flex: 0 0 auto;
}
body.woocommerce-checkout .woocommerce-form-coupon-toggle .woocommerce-info input[type="checkbox"]:focus{
  outline: none;
  box-shadow: none;
}

/* Order table */
body.woocommerce-checkout .woocommerce-checkout-review-order-table{
  border-radius: 12px;
  overflow: hidden;
}
body.woocommerce-checkout .woocommerce-checkout-review-order-table th,
body.woocommerce-checkout .woocommerce-checkout-review-order-table td{
  padding: 12px 10px;
}
body.woocommerce-checkout .woocommerce-checkout-review-order-table tfoot th,
body.woocommerce-checkout .woocommerce-checkout-review-order-table tfoot td{
  font-weight: 700;
}

/* Payment area */
body.woocommerce-checkout #payment{
  background: transparent;
}
body.woocommerce-checkout .wc_payment_method{
  margin: 0 0 12px 0;
}
body.woocommerce-checkout .payment_box{
  border-radius: 12px;
  padding: 14px;
}

/* Place order */
body.woocommerce-checkout #place_order{
  width: 100%;
  padding: 14px 18px;
  border-radius: 12px;
  font-size: 16px;
  font-weight: 700;
}

/* Desktop: Left (Customer) + Right (Order), no wrapping */
@media (min-width: 992px){

  /* hide default heading, inject inside right card */
  #order_review_heading{ display: none !important; }

  form.woocommerce-checkout{
    display: flex !important;
    /* Allow validation notices to occupy full width row (prevents "new left column" shift) */
    flex-wrap: wrap !important;
    gap: 3% !important;
    align-items: flex-start;
  }

  /* Woo validation errors/notices: keep as a top notice (full width) */
  form.woocommerce-checkout > .woocommerce-NoticeGroup,
  form.woocommerce-checkout > .woocommerce-notices-wrapper,
  form.woocommerce-checkout > ul.woocommerce-error,
  form.woocommerce-checkout > .woocommerce-error,
  form.woocommerce-checkout > .woocommerce-message,
  form.woocommerce-checkout > .woocommerce-info{
    flex: 0 0 100% !important;
    max-width: 100% !important;
    order: -1;
    margin: 0 0 16px 0;
  }

  /* If notices are printed inside customer details, force full width there too */
  #customer_details .woocommerce-NoticeGroup,
  #customer_details .woocommerce-notices-wrapper,
  #customer_details ul.woocommerce-error,
  #customer_details .woocommerce-error,
  #customer_details .woocommerce-message,
  #customer_details .woocommerce-info{
    width: 100% !important;
    max-width: 100% !important;
    margin-bottom: 16px;
  }


  #customer_details{
    flex: 0 0 55% !important;
    max-width: 55% !important;
  }

  #order_review{
    flex: 0 0 42% !important;
    max-width: 42% !important;
    margin-left: auto !important;
    position: sticky;
    top: 110px;
  }

  #order_review::before{
    content: "Your order";
    display: block;
    font-size: 20px;
    font-weight: 700;
    margin: 0 0 12px 0;
  }

  /* Stack Billing + Additional info */
  #customer_details .col2-set{ display: block !important; }
  #customer_details .col-1,
  #customer_details .col-2{
    float: none !important;
    width: 100% !important;
    max-width: 100% !important;
  }
  #customer_details .col-2{ margin-top: 22px; }
}

/* Mobile */
@media (max-width: 991px){
  body.woocommerce-checkout #customer_details,
  body.woocommerce-checkout #order_review{
    padding: 16px;
  }
  body.woocommerce-checkout #order_review{
    position: static;
    top: auto;
  }
}


/* Bongoto Customizer checkout button */
.woocommerce #payment #place_order, .woocommerce-page #payment #place_order{background:var(--bt-color-checkout) !important;border-color:var(--bt-color-checkout) !important;}