/**
 * CSS for the custom product tabs to match the design.
 */

.custom-product-tabs-wrapper {
    clear: both;
    margin-bottom: 40px;
}

/* Tab Navigation */
.custom-tabs-nav {
    display: flex;
    list-style: none;
    margin: 0 0 30px 0;
    padding: 0;
    gap: 10px; /* Adds space between tab buttons */
}

.custom-tabs-nav li {
    margin: 0;
}

.custom-tabs-nav li a {
    display: block;
    padding: 12px 25px;
    text-decoration: none;
    font-weight: 600;
    font-size: 14px;
    text-transform: uppercase;
    border-radius: 8px;
    transition: all 0.3s ease;
    background-color: #f0ede5; /* Beige background for inactive tabs */
    color: #49a7e5; /* Dark green text for inactive tabs */
}

/* Active Tab Style */
.custom-tabs-nav li.active a {
    background-color: #49a7e5; /* Dark green background */
    color: #fff;
}

.custom-tabs-nav li a:hover {
    opacity: 0.9;
}

/* Tab Content Panes */
.custom-tabs-content {
    padding: 0;
}

.custom-tab-pane {
    display: none;
    animation: fadeIn 0.5s;
}

.custom-tab-pane.active {
    display: block;
}

/* We don't need the H2 titles from the template parts */
.custom-tab-pane h2 {
    display: none;
}

/* Styling for the tables */
.product-spec-table, .product-nutrition-table, .product-packaging-table {
    width: 100%;
    border-collapse: collapse;
    border: none;
}

.product-spec-table thead th, .product-nutrition-table thead th, .product-packaging-table thead th {
    text-align: left;
    padding-bottom: 10px;
    color: #4ba8e5;
    font-weight: 700;
    font-size: 13px;
    text-transform: uppercase;
    border: none !important;
}

.product-spec-table tbody tr, .product-nutrition-table tbody tr, .product-packaging-table tbody tr {
    border-bottom: 1px solid #e0e0e0;
}

.product-spec-table tbody tr:last-child, .product-nutrition-table tbody tr:last-child, .product-packaging-table tbody tr:last-child {
    border-bottom: none;
}

.woocommerce table.shop_attributes tr:nth-child(even) td, .woocommerce table.shop_attributes tr:nth-child(even) th
{
    background:unset !important;
}
.product-spec-table tbody th,
.product-spec-table tbody td,
.product-nutrition-table tbody th,
.product-nutrition-table tbody td,
.product-packaging-table tbody th,
.product-packaging-table tbody td {
    padding: 25px 15px;
    border: none !important;
    vertical-align: middle;
}

.product-spec-table tbody th, .product-nutrition-table tbody th, .product-packaging-table tbody th {
    font-weight: 700;
    color: #0a4729;
    width: 25%;
    font-size: 20px;
    line-height: 24px;
}

.product-spec-table tbody td, .product-nutrition-table tbody td, .product-packaging-table tbody td {
    color: #555;
    font-size: 16px;
    font-weight: 400;
    line-height: 20px;
}

/* Style for child items */
.product-nutrition-table .child-nutrient th,
.product-spec-table .child-spec th,
.product-packaging-table .child-packaging th {
    padding-left: 40px !important;
    font-weight: 400;
}


@media (max-width: 768px) {
    .product-spec-table tbody th, .product-nutrition-table tbody th, .product-packaging-table tbody th {
        font-size: 12px;
    }
    .product-spec-table tbody td, .product-nutrition-table tbody td, .product-packaging-table tbody td {
        font-size: 14px;
    }
}


@keyframes fadeIn {
    from { opacity: 0; }
    to { opacity: 1; }
}

/* Accordion Styles */
.custom-tab-accordion-header {
    display: none; /* Hidden by default */
}

/* Responsive Styles for Tablet and Mobile */
@media (max-width: 991px) {
    /* Hide desktop tab navigation */
    .custom-tabs-nav {
        display: none;
    }

    /* Show accordion headers */
    .custom-tab-accordion-header {
        display: block;
        padding: 15px 20px;
        background-color: #f0ede5;
        border-bottom: 1px solid #e0e0e0;
        cursor: pointer;
        transition: background-color 0.3s ease;
    }
    .custom-tab-accordion-header>a{
        color: #000;
    }

    .custom-tab-accordion-header a {
        color: #4ca7e6;
        font-weight: 600;
        font-size: 16px;
        text-decoration: none;
        display: block;
        position: relative;
    }
	
	.custom-tab-accordion-header a::after {
		content: '+';
		position: absolute;
		right: 0;
		top: 50%;
		transform: translateY(-50%);
		font-size: 24px;
		font-weight: 400;
	}

    .custom-tab-pane.active .custom-tab-accordion-header a::after {
        content: '−';
    }

    /* Style for active accordion header */
    .custom-tab-pane.active .custom-tab-accordion-header {
                background-color: #4ba8e5;
    }

    .custom-tab-pane.active .custom-tab-accordion-header a {
        color: #fff;
    }

    /* All panes are displayed as blocks */
    .custom-tab-pane {
        display: block !important; /* Override inline style */
        margin-bottom: 5px;
    }

    /* Content of the accordion is hidden by default */
    .custom-tab-content-inner {
        display: none;
        padding: 20px;
        border: 1px solid #e0e0e0;
        border-top: none;
    }

    /* Show content for the active pane */
    .custom-tab-pane.active .custom-tab-content-inner {
        display: block;
    }
}