/**
 * WooCommerce Custom Styles
 * Integrates WooCommerce forms with the CarMedia theme design
 */

/* ===== Checkout Form Styling ===== */
.woocommerce form .form-row {
	display: flex;
	gap: 16px;
	margin-bottom: 16px;
}

.woocommerce form .form-row.form-row-full {
	flex: 1 100%;
}

.woocommerce form .form-row.form-row-first {
	flex: 1;
}

.woocommerce form .form-row.form-row-last {
	flex: 1;
}

.woocommerce form .form-group,
.woocommerce-checkout .woocommerce-billing-fields .woocommerce-billing-fields__field-wrapper > p,
.woocommerce-checkout .woocommerce-shipping-fields .woocommerce-shipping-fields__field-wrapper > p {
	margin-bottom: 16px;
}

.woocommerce form label {
	display: block;
	font-weight: 600;
	font-size: 0.85rem;
	margin-bottom: 6px;
	color: var(--color-dark);
}

.woocommerce form input[type="text"],
.woocommerce form input[type="email"],
.woocommerce form input[type="tel"],
.woocommerce form input[type="password"],
.woocommerce form input[type="number"],
.woocommerce form select,
.woocommerce-input-wrapper {
    width: 100%;
    min-width: 0%;
}
.woocommerce form textarea {
	width: 100%;
	padding: 11px 14px;
	border: 1px solid var(--color-border);
	border-radius: 8px;
	font-family: var(--font);
	font-size: 0.9rem;
	transition: var(--transition);
	background: var(--color-white);
	color: var(--color-dark);
}

.woocommerce form input:focus,
.woocommerce form textarea:focus,
.woocommerce form select:focus {
	outline: none;
	border-color: var(--color-primary);
	box-shadow: 0 0 0 3px rgba(226, 16, 26, 0.12);
}

/* ===== Billing/Shipping Fields ===== */
.woocommerce-checkout .woocommerce-billing-fields,
.woocommerce-checkout .woocommerce-shipping-fields {
	background: var(--color-white);
	border: 1px solid var(--color-border);
	border-radius: var(--radius);
	padding: 26px;
	margin-bottom: 24px;
}

.woocommerce-checkout .woocommerce-billing-fields h3,
.woocommerce-checkout .woocommerce-shipping-fields h3 {
	font-size: 1.15rem;
	margin-bottom: 18px;
	color: var(--color-dark);
}

/* ===== Order Review / Payment ===== */
.woocommerce-checkout-review-order {
	background: var(--color-white);
	border: 1px solid var(--color-border);
	border-radius: var(--radius);
	padding: 26px;
	margin-bottom: 24px;
}

.woocommerce-checkout-review-order h3 {
	font-size: 1.15rem;
	margin-bottom: 18px;
	color: var(--color-dark);
}

.woocommerce-checkout-review-order-table {
	width: 100%;
	margin-bottom: 20px;
	border-collapse: collapse;
}

.woocommerce-checkout-review-order-table td,
.woocommerce-checkout-review-order-table th {
	padding: 10px 0;
	border-bottom: 1px dashed var(--color-border);
	text-align: left;
	font-size: 0.9rem;
}

.woocommerce-checkout-review-order-table th {
	font-weight: 600;
	color: var(--color-dark);
}

.woocommerce-checkout-review-order-table .order-total {
	font-size: 1.1rem;
	font-weight: 800;
	color: var(--color-primary);
	border-bottom: none;
}

.woocommerce-checkout-review-order-table .order-total td {
	border-bottom: none;
}

/* ===== Payment Methods ===== */
.woocommerce-checkout .payment-methods {
	background: var(--color-white);
	border: 1px solid var(--color-border);
	border-radius: var(--radius);
	padding: 26px;
	margin-bottom: 24px;
}

.woocommerce-checkout .payment-methods h3 {
	font-size: 1.15rem;
	margin-bottom: 18px;
	color: var(--color-dark);
}

.woocommerce-checkout .payment-methods ul {
	list-style: none;
	margin: 0;
	padding: 0;
}

.woocommerce-checkout .payment-methods li {
	margin-bottom: 12px;
	list-style: none;
}

.woocommerce-checkout .payment-methods .payment_method_label {
	display: flex;
	align-items: center;
	gap: 12px;
	border: 1px solid var(--color-border);
	border-radius: 10px;
	padding: 14px 16px;
	cursor: pointer;
	transition: var(--transition);
	font-weight: 500;
}

.woocommerce-checkout .payment-methods input[type="radio"]:checked + .payment_method_label {
	border-color: var(--color-primary);
	background: rgba(226, 16, 26, 0.05);
}

.woocommerce-checkout .payment-methods input[type="radio"] {
	margin: 0;
	cursor: pointer;
}

/* ===== Place Order Button ===== */
.woocommerce-checkout .place-order button.button {
	width: 100%;
	padding: 14px 28px;
	background: var(--color-primary);
	color: var(--color-white);
	border: 2px solid var(--color-primary);
	border-radius: 50px;
	font-weight: 600;
	font-size: 0.95rem;
	cursor: pointer;
	transition: var(--transition);
	margin-top: 30px;
}

.woocommerce-checkout .place-order button.button:hover {
	background: var(--color-primary-dark);
	border-color: var(--color-primary-dark);
	transform: translateY(-2px);
}

.woocommerce-checkout .place-order button.button:disabled {
	opacity: 0.6;
	cursor: not-allowed;
}

/* ===== Notices/Messages ===== */
.woocommerce-error,
.woocommerce-info,
.woocommerce-message {
	background: var(--color-light);
	border-left: 4px solid var(--color-primary);
	padding: 16px;
	border-radius: 8px;
	margin-bottom: 20px;
	font-size: 0.9rem;
}

.woocommerce-error {
	border-left-color: #dc2626;
	background: rgba(220, 38, 38, 0.08);
}

.woocommerce-message {
	border-left-color: #16a34a;
	background: rgba(22, 163, 74, 0.08);
}

/* ===== Responsive ===== */
@media (max-width: 768px) {
	.woocommerce form .form-row {
		flex-direction: column;
		gap: 0;
	}

	.woocommerce form .form-row.form-row-first,
	.woocommerce form .form-row.form-row-last {
		flex: 1 100%;
	}
}
