/* === Fix Sticky Checkout Steps cho Flatsome === */
body.woocommerce-checkout #checkout-steps {
  position: sticky !important;
  top: 120px !important; /* Khoảng trống cho header Flatsome */
  z-index: 9999 !important;
  background: #fff !important;
  border-bottom: 1px solid #eee;
  padding: 15px;
  margin-bottom: 20px;
  transition: all 0.2s ease;
}

/* Layout hiển thị các bước */
.checkout-steps ul {
  display: flex;
  justify-content: center;
  gap: 30px;
  list-style: none;
  margin: 0;
  padding: 0;
}

.checkout-steps .step-item {
  padding: 5px 5px;
  border-radius: 30px;
  background: #f1f1f1;
  font-weight: 600;
  cursor: pointer;
  transition: all .3s;
}



/* Bắt buộc: loại bỏ overflow từ cha Flatsome */
body.woocommerce-checkout #wrapper,
body.woocommerce-checkout #main,
body.woocommerce-checkout #content,
body.woocommerce-checkout .section {
  overflow: visible !important;
}

/*.checkout-steps .step-item.completed {
  background: #1976bf;
  color: #fff;
}
.field-error {
  border: 2px solid #e74c3c !important;
  background-color: #fff6f6;
}*/

/*sdss*/
.checkout-steps .step-item.completed {
  background: #1976bf;
  color: #fff;
  transition: all 0.3s ease;
}

.checkout-steps .step-item.active {
  background: #edc700;
  color: #fff;
}

.field-error {
  border-color: #e74c3c !important;
  background: #fff0f0;
  transition: all 0.3s ease;
}
.field-error:focus {
  outline: 2px solid #e74c3c;
  background: #fff;
}