/**
 * Styling untuk plugin Biteship Shipping resmi
 * - Sembunyikan field District yang tidak diperlukan
 * - Mempercantik tampilan dropdown City & Postcode
 * - Memperhalus tampilan section Shipping
 */

/* === SEMBUNYIKAN FIELD DISTRICT === */
/* Plugin Biteship menambahkan field District (kecamatan) sebagai dropdown */
/* Untuk toko buku, ini opsional dan bikin form panjang */
.woocommerce-billing-fields #billing_district_field,
.woocommerce-billing-fields #shipping_district_field,
#billing_district_field,
#shipping_district_field,
p[id$="_district_field"],
.form-row.billing_district,
.form-row.shipping_district {
	display: none !important;
}

/* === RAPIKAN DROPDOWN BITESHIP (City, Postcode) === */
.woocommerce-billing-fields .select2-container,
.woocommerce-shipping-fields .select2-container {
	width: 100% !important;
}

.woocommerce-billing-fields .select2-selection,
.woocommerce-shipping-fields .select2-selection,
.woocommerce-billing-fields select,
.woocommerce-shipping-fields select {
	min-height: 44px !important;
	border: 1.5px solid #cbd5e1 !important;
	border-radius: 8px !important;
	font-size: 14px !important;
	padding: 8px 12px !important;
	background: #fff !important;
	transition: border-color 0.2s ease;
}

.woocommerce-billing-fields .select2-selection__rendered,
.woocommerce-shipping-fields .select2-selection__rendered {
	line-height: 28px !important;
	padding: 0 !important;
	color: #1e293b !important;
	font-size: 14px !important;
}

.woocommerce-billing-fields .select2-selection__arrow,
.woocommerce-shipping-fields .select2-selection__arrow {
	height: 42px !important;
	right: 8px !important;
}

.woocommerce-billing-fields .select2-selection:focus,
.woocommerce-billing-fields .select2-container--focus .select2-selection,
.woocommerce-shipping-fields .select2-selection:focus,
.woocommerce-shipping-fields .select2-container--focus .select2-selection {
	border-color: #3b82f6 !important;
	box-shadow: 0 0 0 3px rgba(59, 130, 246, 0.1) !important;
	outline: none !important;
}

/* Hasil pencarian dropdown */
.select2-results__option {
	padding: 10px 14px !important;
	font-size: 13px !important;
	color: #1e293b !important;
}

.select2-results__option--highlighted {
	background: #eff6ff !important;
	color: #1e3a8a !important;
}

/* === RAPIKAN SECTION ORDER REVIEW === */
.woocommerce-checkout-review-order-table {
	border-radius: 10px !important;
	overflow: hidden;
	border: 1px solid #e2e8f0 !important;
}

.woocommerce-checkout-review-order-table th,
.woocommerce-checkout-review-order-table td {
	padding: 14px 16px !important;
	font-size: 14px !important;
}

.woocommerce-checkout-review-order-table .order-total .amount {
	color: #1e3a8a !important;
	font-size: 18px !important;
}

/* === STYLING SHIPPING METHOD === */
.shipping ul#shipping_method {
	margin: 0 !important;
	padding: 0 !important;
	list-style: none !important;
}

.shipping ul#shipping_method li {
	padding: 10px 12px !important;
	margin: 6px 0 !important;
	border: 1.5px solid #e2e8f0 !important;
	border-radius: 8px !important;
	background: #fff !important;
	transition: all 0.2s ease;
	display: flex;
	align-items: center;
	gap: 10px;
}

.shipping ul#shipping_method li:hover {
	border-color: #93c5fd !important;
	background: #f8fbff !important;
}

.shipping ul#shipping_method li input[type="radio"] {
	accent-color: #3b82f6 !important;
	width: 16px;
	height: 16px;
}

.shipping ul#shipping_method li input[type="radio"]:checked + label {
	color: #1e3a8a !important;
	font-weight: 600 !important;
}

.shipping ul#shipping_method label {
	font-size: 13px !important;
	margin: 0 !important;
	cursor: pointer;
	flex: 1;
}

.shipping ul#shipping_method .amount {
	color: #1e3a8a !important;
	font-weight: 600 !important;
}

/* === LABEL FIELD CHECKOUT === */
.woocommerce-billing-fields label,
.woocommerce-shipping-fields label,
.woocommerce-additional-fields label {
	font-size: 13px !important;
	font-weight: 500 !important;
	color: #475569 !important;
	margin-bottom: 6px !important;
	display: block !important;
}

.woocommerce-billing-fields .required,
.woocommerce-shipping-fields .required {
	color: #dc2626 !important;
	text-decoration: none !important;
}

/* === INPUT TEXT FIELD === */
.woocommerce-billing-fields input[type="text"],
.woocommerce-billing-fields input[type="email"],
.woocommerce-billing-fields input[type="tel"],
.woocommerce-shipping-fields input[type="text"],
.woocommerce-shipping-fields input[type="email"],
.woocommerce-shipping-fields input[type="tel"],
.woocommerce-additional-fields textarea {
	border: 1.5px solid #cbd5e1 !important;
	border-radius: 8px !important;
	padding: 10px 13px !important;
	font-size: 14px !important;
	width: 100% !important;
	box-sizing: border-box !important;
	background: #fff !important;
	transition: border-color 0.2s ease;
}

.woocommerce-billing-fields input:focus,
.woocommerce-shipping-fields input:focus,
.woocommerce-additional-fields textarea:focus {
	border-color: #3b82f6 !important;
	box-shadow: 0 0 0 3px rgba(59, 130, 246, 0.1) !important;
	outline: none !important;
}

/* === TOMBOL PLACE ORDER === */
#place_order {
	background: linear-gradient(135deg, #1e3a8a 0%, #3b82f6 100%) !important;
	color: #fff !important;
	border: none !important;
	border-radius: 10px !important;
	padding: 14px 28px !important;
	font-size: 15px !important;
	font-weight: 600 !important;
	width: 100% !important;
	margin-top: 12px !important;
	cursor: pointer;
	transition: transform 0.15s ease, box-shadow 0.15s ease;
	box-shadow: 0 4px 12px rgba(30, 58, 138, 0.2);
}

#place_order:hover {
	transform: translateY(-1px);
	box-shadow: 0 6px 16px rgba(30, 58, 138, 0.3);
}

/* === SECTION HEADING === */
.woocommerce-billing-fields h3,
.woocommerce-shipping-fields h3,
#order_review_heading,
.woocommerce-additional-fields h3 {
	font-size: 18px !important;
	font-weight: 600 !important;
	color: #1e3a8a !important;
	margin-bottom: 16px !important;
	padding-bottom: 10px !important;
	border-bottom: 2px solid #e2e8f0 !important;
}

/* === ROW SPACING === */
.woocommerce-billing-fields .form-row,
.woocommerce-shipping-fields .form-row {
	margin-bottom: 14px !important;
}

/* === RESPONSIVE: MOBILE === */
@media (max-width: 768px) {
	.woocommerce-billing-fields .select2-selection,
	.woocommerce-shipping-fields .select2-selection,
	.woocommerce-billing-fields select,
	.woocommerce-shipping-fields select,
	.woocommerce-billing-fields input,
	.woocommerce-shipping-fields input {
		font-size: 16px !important; /* cegah zoom iOS */
	}
}