/* FREE SHIPPING BADGE - FRONTEND STYLESHEET (1.3) */

:root {
	--fsb-bg: #27ae60;
	--fsb-text-color: #ffffff;
	--fsb-border-color: #27ae60;
	--fsb-border-width: 1px;
	--fsb-border-style: solid;
	--fsb-radius: 2px;
	--fsb-font-family: inherit;
	--fsb-font-size: 14px;
	--fsb-font-weight: 600;
	--fsb-font-style: normal;
	--fsb-text-transform: none;
	--fsb-letter-spacing: 0px;
	--fsb-icon-size: 1em;
	--fsb-icon-color: currentColor;
	--fsb-shadow: none;
	--fsb-opacity: 1;
	--fsb-image-offset: 10px;
	--fsb-mt: 5px;
	--fsb-mb: 0px;
	--fsb-pt: 4px;
	--fsb-pb: 4px;
	--fsb-pl: 10px;
	--fsb-pr: 10px;
}

/* MAIN BADGE ELEMENT (works for below-price and for image corner position) */
fsb_badge,
.fsb_badge {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	text-align: center;
	box-sizing: border-box;
	text-decoration: none;
	width: fit-content;
	max-width: 100%;
	margin: var(--fsb-mt, 5px) 0 var(--fsb-mb, 0px);
	padding: var(--fsb-pt, 4px) var(--fsb-pr, 10px) var(--fsb-pb, 4px) var(--fsb-pl, 10px);
	background-color: var(--fsb-bg, #27ae60);
	color: var(--fsb-text-color, #ffffff);
	border: var(--fsb-border-width, 1px) var(--fsb-border-style, solid) var(--fsb-border-color, #27ae60);
	border-radius: var(--fsb-radius, 2px);
	box-shadow: var(--fsb-shadow, none);
	opacity: var(--fsb-opacity, 1);
	font-family: var(--fsb-font-family, inherit);
	font-size: var(--fsb-font-size, 14px);
	font-weight: var(--fsb-font-weight, 600);
	font-style: var(--fsb-font-style, normal);
	letter-spacing: var(--fsb-letter-spacing, 0);
	text-transform: var(--fsb-text-transform, none);
	line-height: 1.6;
	vertical-align: middle;
}

/* BADGE TEXT + ICON */
.fsb_badge .fsb_badge_text {
	order: 1;
	display: inline-block;
	line-height: 1.3;
}

.fsb_badge .fsb_badge_icon {
	order: 0;
	margin-right: .45em;
	font-size: var(--fsb-icon-size, 1em);
	color: var(--fsb-icon-color, currentColor);
}

.fsb_badge.fsb-icon-pos-right .fsb_badge_icon {
	order: 2;
	margin-right: 0;
	margin-left: .45em;
}

/* BADGE LOOK VARIANTS */
.fsb_badge.fsb-style-solid {
	background-image: none;
}

.fsb_badge.fsb-style-outline {
	background-color: transparent;
	background-image: none;
	color: var(--fsb-border-color, #27ae60);
}

.fsb_badge.fsb-style-soft {
	background-image: none;
	background-color: var(--fsb-bg, #27ae60);
	background-color: color-mix(in srgb, var(--fsb-bg, #27ae60) 18%, transparent);
}

.fsb_badge.fsb-style-gradient {
	background-color: var(--fsb-bg, #27ae60);
	background-image: linear-gradient(135deg,
		color-mix(in srgb, var(--fsb-bg, #27ae60) 60%, #000000) 0%,
		var(--fsb-bg, #27ae60) 60%,
		color-mix(in srgb, var(--fsb-bg, #27ae60) 75%, #ffffff) 100%);
}

/* POSITION: BELOW THE PRODUCT PRICE */
.fsb_badge_view_single {
	width: fit-content;
}

.fsb_badge_view_shop {
	width: 100%;
}

/* POSITION: ON THE PRODUCT IMAGE (corner overlay) */
.fsb_badge.fsb_badge_image {
	position: absolute;
	margin: 0 !important;
	width: fit-content;
	max-width: calc(100% - 2 * var(--fsb-image-offset, 10px));
	z-index: 92;
}

.fsb_badge.fsb-corner-top_left {
	top: var(--fsb-image-offset, 10px);
	left: var(--fsb-image-offset, 10px);
}

.fsb_badge.fsb-corner-top_right {
	top: var(--fsb-image-offset, 10px);
	right: var(--fsb-image-offset, 10px);
}

.fsb_badge.fsb-corner-bottom_left {
	bottom: var(--fsb-image-offset, 10px);
	left: var(--fsb-image-offset, 10px);
}

.fsb_badge.fsb-corner-bottom_right {
	bottom: var(--fsb-image-offset, 10px);
	right: var(--fsb-image-offset, 10px);
}

/* Anchors for corner overlay badges (safe, common positioning in WooCommerce layouts) */
ul.products li.product,
ul.products .product {
	position: relative;
}

.woocommerce-product-gallery__image {
	position: relative;
}

/* RESPONSIVE: tablet and mobile font sizes from plugin settings (auto fallback when empty) */
@media screen and (max-width: 768px) {

	.fsb_badge {
		font-size: var(--fsb-font-size-tablet, var(--fsb-font-size, 14px));
	}

	.fsb_badge .fsb_badge_icon {
		font-size: var(--fsb-icon-size-tablet, var(--fsb-icon-size, 1em));
	}

}

@media screen and (max-width: 420px) {

	.fsb_badge {
		font-size: var(--fsb-font-size-mobile, var(--fsb-font-size, 14px));
	}

	.fsb_badge .fsb_badge_icon {
		font-size: var(--fsb-icon-size-mobile, var(--fsb-icon-size, 1em));
	}

}

/* LEGACY SUPPORT (old plugin versions styles) */
.fsb_badge_view_empty {
	display: none;
}