/* ==============================================================================
Theme Name: Phlox Pro Child
Theme URI: http://phlox.pro/go/
Author: averta
Author URI: http://www.phlox.pro
Description: Phlox Pro Child Theme
Template: phlox-pro
Version: 1.0
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Tags: one-column,two-columns, three-columns, left-sidebar, right-sidebar
Text Domain: phlox-pro-child
================================================================================

/* Checkout Grid Layout */
.ms-checkout-wrapper {
  display: grid;
  grid-template-columns: 2fr 1fr;
  gap: 30px;
  max-width: 1100px;
  margin: 40px auto;
}

/* Left column sections */
.ms-checkout-section {
  background: #fff;
  padding: 25px;
  margin-bottom: 20px;
  border-radius: 12px;
  box-shadow: 0 3px 10px rgba(0,0,0,0.05);
}

/* Right column summary */
.ms-checkout-summary {
  background: #fff;
  padding: 25px;
  border-radius: 12px;
  box-shadow: 0 3px 10px rgba(0,0,0,0.05);
  position: sticky;
  top: 20px; /* keeps order summary visible while scrolling */
}

/* Headings */
.ms-checkout-section h3,
.ms-checkout-summary h3 {
  font-size: 20px;
  margin-bottom: 15px;
  font-weight: 600;
  border-bottom: 1px solid #eee;
  padding-bottom: 8px;
}

/* Inputs */
.woocommerce form .form-row input.input-text,
.woocommerce form .form-row textarea,
.woocommerce form .form-row select {
  width: 100%;
  padding: 12px;
  border: 1px solid #ddd;
  border-radius: 8px;
  font-size: 14px;
  transition: border-color 0.3s;
}

.woocommerce form .form-row input:focus,
.woocommerce form .form-row textarea:focus,
.woocommerce form .form-row select:focus {
  border-color: #3B82F6;
  outline: none;
}

/* Place Order Button */
.woocommerce #place_order {
  width: 100%;
  background: #3B82F6;
  color: #fff;
  padding: 15px;
  border-radius: 10px;
  font-size: 16px;
  font-weight: 600;
  transition: background 0.3s;
}

.woocommerce #place_order:hover {
  background: #2563EB;
}