/**
 * Theme Name: Cerato Child
 * Description: This is a child theme of Cerato
 * Author: ZooTemplate
 * Author URI: http://zootemplate.com
 * Template: cerato
 * Version: 2.2.18
 */

/* Remove default list styling and ensure tabs cover full width with equal distribution */
.custom-price-tabs .tabs {
    list-style-type: none; /* Removes bullet points */
    margin: 0;
    padding: 0;
    display: flex;
    background-color: black; /* Tab headers background color */
    justify-content: space-between; /* Distributes the tabs evenly */
}

.custom-price-tabs .tabs li {
    list-style-type: none; /* Ensures no bullet points on the list items */
}

.custom-price-tabs .tabs li::before {
    content: none; /* Removes pseudo-element added bullets */
}

/* Style the tab links */
.custom-price-tabs .tab-link {
    padding: 10px 0;
    cursor: pointer;
    background-color: black; /* Tab headers background color */
    color: white; /* Tab headers text color */
    flex: 1; /* Each tab takes up equal space */
    text-align: center; /* Centers the text inside the tabs */
    border: none; /* Removes border */
    transition: background-color 0.3s; /* Smooth transition for background color */
    margin: 0; /* Remove any default margins */
}

/* Hover and active state for tab links */
.custom-price-tabs .tab-link:hover,
.custom-price-tabs .tab-link.current {
    background-color: #DE4E1C; /* Background color for hover and active state */
}

/* Style the tab content with a consistent height */
.custom-price-tabs .tab-content {
    display: none; /* Hidden by default */
    padding: 10px;
    min-height: 100px; /* Adjust this value as needed to suit your content */
}

/* Show the current tab content */
.custom-price-tabs .current {
    display: block; /* Only the current tab content is visible */
}

/* Style the contact us button */
.contact-us-button {
    display: inline-block;
    padding: 10px 20px;
    background-color: #DE4E1C; /* Button background color */
    color: white;
    text-decoration: none;
    margin-top: 10px;
    transition: background-color 0.3s; /* Smooth transition for background color */
}

/* Hover state for the contact us button */
.contact-us-button:hover {
    background-color: darken(#DE4E1C, 10%); /* Darken the color slightly on hover */
    /* If you're not using a pre-processor, replace 'darken(#DE4E1C, 10%)' with a specific darker hex color */
}