/**
 * Bulgarian Checkout Enhancements — refined styling layer (Pattern #1)
 *
 * Modernizes the look of the carrier-method tabs and the city/office picker
 * area without changing the bundle's DOM. Loaded AFTER the carried frontend
 * CSS so these rules win on specificity-equal cascades.
 *
 * Scoped under .woo-bg--enabled-shipping-buttons (added by BCE on body) so
 * nothing here leaks to other WooCommerce installs that don't use BCE.
 */

/* --- Tab strip: equal-height, modern cards, left-aligned --- */
.woo-bg--enabled-shipping-buttons .woo-bg--shipping-methods-tabs--titles {
	justify-content: flex-start;
	gap: 8px;
	margin-bottom: 14px;
}

.woo-bg--enabled-shipping-buttons .woo-bg--shipping-methods-tabs label {
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	gap: 6px;
	min-width: 140px;
	min-height: 70px;
	padding: 10px 14px;
	margin: 0;
	border: 1px solid #e2e2e2;
	border-radius: 8px;
	background: #fff;
	cursor: pointer;
	transition: border-color .15s ease, box-shadow .15s ease, background-color .15s ease;
	box-sizing: border-box;
}

.woo-bg--enabled-shipping-buttons .woo-bg--shipping-methods-tabs label:hover {
	border-color: #b9b9b9;
}

.woo-bg--enabled-shipping-buttons .woo-bg--shipping-methods-tabs label.active {
	border-color: #1d1d1d;
	box-shadow: 0 0 0 1px #1d1d1d inset;
	background: #fafafa;
}

/* Force consistent logo sizing across all tabs.
   The bundle places <img> inside <label> via the helper function. */
.woo-bg--enabled-shipping-buttons .woo-bg--shipping-methods-tabs label img {
	display: block;
	max-width: 80px;
	max-height: 22px;
	width: auto;
	height: auto;
	margin: 0;
	object-fit: contain;
}

/* Label text: sits ABOVE the logo. The bundle outputs a <span> that wraps
   text-then-image in DOM order; with column flex direction, that's exactly
   the visual order we want — label on top, logo below. */
.woo-bg--enabled-shipping-buttons .woo-bg--shipping-methods-tabs label span {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 6px;
	font-size: 15px;
	font-weight: 600;
	line-height: 1.25;
	color: #1d1d1d;
	text-align: center;
}

/* Hide the WC placeholder fragment that shows up before shipping is calculated.
   "Избери за калкулация" is technical noise — the user can't act on it from
   the tab label, the price line below already conveys the same state. */
.woo-bg--enabled-shipping-buttons .woo-bg--shipping-methods-tabs label .woocommerce-Price-amount {
	display: none;
}

/* --- City/office picker wrapper: tighter, less boxed-in look --- */
.woo-bg--enabled-city-state-field #woo-bg--city-state {
	margin-top: 4px;
}

/* --- Hide the empty courier tabs row when only one method exists --- */
.woo-bg--enabled-shipping-buttons .woo-bg--shipping-methods-tabs--titles:empty {
	display: none;
}

/* --- Compact mobile layout: stack tabs vertically below 480px --- */
@media (max-width: 480px) {
	.woo-bg--enabled-shipping-buttons .woo-bg--shipping-methods-tabs--titles {
		flex-direction: column;
		gap: 6px;
	}
	.woo-bg--enabled-shipping-buttons .woo-bg--shipping-methods-tabs label {
		width: 100%;
		min-width: 0;
	}
}