/* Center align form and set max width */
.wpcf7 {
    max-width: 600px; /* Adjust this value as needed */
    margin: 0 auto; /* Center the form */
}

/* Style form labels */
.wpcf7-form label {
    font-weight: bold;
    color: #333;
    margin-bottom: 8px; /* Space between label and input field */
    display: block;
}

/* Style input fields */
.wpcf7-form input[type="text"],
.wpcf7-form input[type="email"],
.wpcf7-form textarea {
    width: 100%;
    padding: 10px;
    border-radius: 5px;
    border: 1px solid #ccc;
    margin-bottom: 15px; /* Space between input fields */
}

/* Style file upload fields */
.wpcf7-form input[type="file"] {
    padding: 5px;
    border-radius: 5px;
    border: 1px solid #ccc;
    margin-bottom: 15px;
}

/* Style submit button to match logo color */
.wpcf7-form input[type="submit"] {
    background-color: #23B085; /* Logo green color */
    color: white;
    padding: 10px 20px;
    border: none;
    border-radius: 5px;
    cursor: pointer;
    margin-top: 10px; /* Space above submit button */
}

.wpcf7-form input[type="submit"]:hover {
    background-color: #1e9874; /* Slightly darker green for hover effect */
}

.wc-block-cart__submit-button .wp-element-button {
    background-color: #FF7A33 !important; /* Change to your desired button color */
    color: #ffffff !important; /* Change to your desired text color */
    border: none !important;
    padding: 10px 20px !important;
    font-size: 16px !important;
    border-radius: 5px !important; /* Optional: round the edges */
    transition: background-color 0.3s ease !important;
}

.wc-block-cart__submit-button .wp-element-button:hover {
    background-color: #0088cc !important; /* Change to your desired hover color */
}

/* ====================== Tooltip Code Start ====================== */

/* Tooltip Container Styles */
.availability-tooltip {
    position: relative;
    display: inline-flex;
    align-items: center;
    gap: 0.5em; /* Space between icon and text */
    color: var(--color-gray-500); /* Green brand color */
    font-weight: bold;
    font-size: 1.1em; /* Adjust text size as needed */
    text-decoration: none;
	  /* Higher value to ensure it appears above everything z-index: 9998; */
}

.availability-tooltip i.bi-arrow-repeat {
    font-size: 33px;
		font:bold;
}

.availability-tooltip .bi-truck {
    font-size: 1.7em; /* Adjust icon size */
    vertical-align: middle; /* Align icon with text */
}

.availability-tooltip .bi-exclamation-triangle {
    font-size: 1.7em; /* Adjust icon size */
    vertical-align: middle; /* Align icon with text */
}

/* Tooltip Text Styles */
.tooltip-text {
    visibility: hidden;
    width: 300px; /* Tooltip width */
    background-color: #333; /* Tooltip background */
    color: #fff; /* Tooltip text color */
    font-size: 0.9em; /* Tooltip text size */
    text-align: left; /* Align tooltip text to the left */
    border-radius: 8px; /* Rounded corners */
    padding: 8px 10px; /* Equal padding for top-bottom (8px) and left-right (10px) */
    position: absolute;
    bottom: 130%; /* Position above the text */
    left: 50%;
    transform: translateX(-50%); /* Center tooltip horizontally */
    opacity: 0;
    transition: opacity 0.3s ease, visibility 0.3s ease;
    box-shadow: 0px 4px 6px rgba(0, 0, 0, 0.2); /* Subtle shadow */
	z-index: 1; /* z-index: 1; Higher value to ensure it appears above everything */
}

.tooltip-text strong {
    color: #23B085; /* Green color (Bootstrap's success green) */
}

.tooltip-text em {
    font-size: 0.85em; /* Adjust font size to be smaller */
  
  
}

.tooltip-text::after {
    content: "";
    position: absolute;
    top: 100%; /* Arrow pointing down */
    left: 50%;
    transform: translateX(-50%);
    border-width: 6px;
    border-style: solid;
    border-color: #333 transparent transparent transparent; /* Arrow matches tooltip background */
}

/* Tooltip Visibility */
.availability-tooltip:hover .tooltip-text {
    visibility: visible;
    opacity: 1;
}

/* Tooltip Content Styling */
.tooltip-content {
    display: inline; /* Ensure it behaves as text */
}

/* Target the tooltip icon and text but keep the text "Usually Available From: 4-6 Working Days" */
.hover-content-inner.wd-more-desc-inner .availability-tooltip .bi,
.hover-content-inner.wd-more-desc-inner .availability-tooltip .tooltip-text {
    display: none; /* Hide the icon and the tooltip text */
}

/* Ensure the main text remains visible */
.hover-content-inner.wd-more-desc-inner .availability-tooltip {
    display: inline; /* Keep the container visible */
    color: inherit; /* Optional: Inherit the text color from the parent styles */
}



/* Media Queries */
@media (max-width: 480px) {
    .tooltip-text {
        width: 90%; /* Fit within screen */
        left: 5%; /* Align to the left of the viewport */
        transform: none; /* Remove horizontal centering for mobile */
        bottom: 100%; /* Adjust to appear above the element */
    }

    .tooltip-text::after {
        left: 10%; /* Adjust arrow alignment */
        transform: none;
    }
}

/* ====================== Tooltip Code End ====================== */

.wc-block-components-product-metadata__description > p {
    display: none;
}

.stock.available-on-backorder.wd-style-default {
    display: none;
}

/* Hide the none working products count on main home page under catergory section */
body.page-id-15578 .wd-cat-count {
    display: none !important;
}

/* Stop bottom bars pushing the page content up */
body.woocommerce-demo-store .main-page-wrapper,
body .main-page-wrapper {
    padding-bottom: 0 !important;
}

/* Keep the bars visible but floating */
.woocommerce-store-notice.demo_store {
    position: fixed;
    bottom: 0;
    left: 0;
    right: 0;
    margin: 0;
}
