/* ==========================================================
   Frequently Bought Together — Tabs styling
   Add to child theme's style.css (or enqueue as a separate file)
   ========================================================== */

/* --- Tab navigation --- */
.pls-fbt-main-product {
	margin-bottom: 18px;
	padding-bottom: 14px;
	border-bottom: 2px solid #ececec;
}
 
.pls-fbt-main-product .pls-fbt-product-item {
	padding: 0;
	border-bottom: none;
}
 
.pls-fbt-this-item-badge {
	display: inline-block;
	margin-left: 8px;
	padding: 2px 8px;
	font-size: 11px;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 0.03em;
	color: #fff;
	background: #0c2340; /* navy, matches your theme */
	border-radius: 3px;
	vertical-align: middle;
}
 
/* --- Merged-into-main-button mode ---
   The "This item" row still exists in the HTML (so the total price math
   stays correct automatically), it's just not shown to the customer.
   The old "Add Selected to Cart" button is hidden since the main
   Add to Cart button now handles everything (see fbt-merge-addtocart.js). */
.pls-fbt-main-product {
	display: none;
}
.pls-fbt-items-button{
    display: none;
}

.woocommerce .pls-fbt-tabs .pls-tabs-list {
	display: flex;
	flex-wrap: wrap;
	list-style: none;
	margin: 0 0 20px;
	padding: 0;
	gap: 0px;
    margin-bottom: -2px !important;
}

.pls-fbt-tabs .pls-tabs-list li.pls-tab-link {
	display: inline-block;
	padding: 20px 36px;
	margin: 0;
	cursor: pointer;
	font-weight: 600;
	color: #0c2340; /* navy, matches your checkboxes/text */
	transition: color 0.15s ease;
    background-color: #f8f8f8;
    border-radius: 10px 10px 0 0;
    border: 1px solid #E7E7E7;
}

.pls-fbt-tabs .pls-tabs-list li.pls-tab-link:hover {
	color: #000; /* muted yellow on hover */
}

.pls-fbt-tabs .pls-tabs-list li.pls-tab-link.pls-tab-active {
	color: #000;
	background-color: #fff;
	border-bottom: 2px solid transparent;
}

/* --- Tab panels --- */
.pls-fbt-tabs .pls-tab-content-wrap {
	display: none;
}

.pls-fbt-tabs .pls-tab-content-wrap.pls-tab-active {
	display: block;
	animation: pls-fbt-fade 0.15s ease;
}

@keyframes pls-fbt-fade {
	from { opacity: 0; }
	to   { opacity: 1; }
}

/* --- Optional: tidy up spacing between product items inside a panel --- */
.pls-fbt-tabs .pls-fbt-product-items {
	display: flex;
	flex-direction: column;
}

.pls-fbt-tabs .pls-fbt-product-item {
	padding: 14px 0;
	border-bottom: 1px solid #ececec;
}

.pls-fbt-tabs .pls-fbt-product-item:last-child {
	border-bottom: none;
}

/* --- Responsive: stack tab labels on very small screens if needed --- */
@media (max-width: 480px) {
	.pls-fbt-tabs .pls-tabs-list {
		gap: 0;
	}
	.pls-fbt-tabs .pls-tabs-list li.pls-tab-link {
		padding: 8px 12px;
		font-size: 14px;
	}
}