/*
Theme Name: Woodstock V4
Theme URI: http://awemedia.co
Author: Ken McMonigle
Author URI: https://awemedia.co
Description:
Version: 4.0
License: Commercial
License URI:
Tags:
Text Domain: woodstock
*/
:root {
    --ws4-black: #000000;
    --ws4-white: #FFFFFF;
    --ws4-light-gray: #8a8888;
    --ws4-dark-gray: #1d1d1e;
    --ws4-gray: #6f6f6f;
    --ws4-orange: #f7931e;
    --ws4-green: #008400;
    --ws4-white-header: #dfe0e1;
    --ws4-sidebar-gray: #2e2f30;
}
header{
    background-color: var(--ws4-black);
    color: var(--ws4-white);
}
.mobile-nav-btn {
    border: 1px solid #fff;
    background-color: transparent;
    padding: 0.375rem 0.75rem;
}

.page-item.active .page-link {
    background-color: #000;
    border-color: #000;
    color: #fff;
}
/* Make the icon white */
.navbar-toggler-icon {
    display: inline-block;
    width: 1.5em;
    height: 1.5em;
    vertical-align: middle;
    background: no-repeat center center;
    background-size: 100% 100%;
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3e%3cpath stroke='rgba%28255,255,255,1%29' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e");
}

/* Style the toggle button itself */
.mobile-nav-btn {
    border: 1px solid white;
    background-color: transparent;
    padding: 0.375rem 0.75rem;
    color: #fff;
}
.topnav {
    background-color: var(--ws4-orange);
    color: var(--ws4-white);
}
.topnav a {
    font-family: 'Poppins', sans-serif;
    color: var(--ws4-white);
    text-transform: uppercase;
    font-weight: bold;
    font-size: 1.2em;
}
.offcanvas {
    border-right: 1px solid  #444;
}
.offcanvas .nav-link,
.offcanvas .btn {
    color: #fff;
}
.offcanvas .btn-outline-dark {
    border-color: #fff;
    color: #fff;
}

.offcanvas .btn-outline-dark:hover {
    background-color: #fff;
    color: #000;
}
.offcanvas hr {
    border-color: rgba(255, 255, 255, 0.9) !important;
}
.btn-close {
    filter: invert(1);
}
.offcanvas-header {
    align-items: center;
}
.offcanvas-header .btn-close {
    margin-left: auto;
}
body {
    font-family: 'Poppins', sans-serif;
    background-color: var(--ws4-dark-gray);
}
footer {
    background-color: var(--ws4-dark-gray) !important;
    color: var(--ws4-white);
}
h1, h2, h3 {
    font-family: 'Poppins', sans-serif;
    font-weight: 800; /* Extra Bold for main headings */
    color: var(--ws4-white-header);
}

h4, h5, h6 {
    font-family: 'Oswald', sans-serif;
    font-weight: 600; /* Semibold for subheadings */
}
h2 {font-size: 2.5em;}
p {
    font-family: 'Poppins', sans-serif;
    font-weight: 300; /* Light for body text */
}
li {
    font-family: 'Poppins', sans-serif;
    font-weight: 500; /* Medium for body text */
}

a {
    text-decoration: none;
    color: var(--ws4-white);
}
a:hover {
    color: var(--ws4-orange);
}
button, .btn {
    font-family: 'Poppins', sans-serif;
    font-weight: 800; /* Extra Bold for CTAs */
    font-size: 1.125rem;
}
.product-card {
    background-color: var(--ws4-black);
    color: var(--ws4-white);
}
.product-card a {
    font-family: 'Poppins', sans-serif;
    color: var(--ws4-light-gray);
}
.product-price {
    font-family: 'Poppins', sans-serif;
    font-weight: 800; /* Extra Bold for prices */
    font-size: 1.75rem;
}
.header-cart {
    font-family: 'Poppins', sans-serif;
    font-weight: 800; /* Extra Bold for cart */
    font-size: 1.5rem;
    background-color: var(--ws4-green);
    color: var(--ws4-white);
    width: 335px;
}
.btn-cart {
    background-color: var(--ws4-green);
    border: 1px solid var(--ws4-green);
}
.bg-orange {
    background-color: var(--ws4-orange)!important;
}
.bg-green {
    background-color: var(--ws4-green)!important;
}
.bg-sidebar-grey {
    background-color: var(--ws4-sidebar-gray);
}
.fc-orange {
    color: var(--ws4-orange);
}
.fc-green {
    color: var(--ws4-green);
}
.trstar {
    color: var(--ws4-green);
    font-size: 0.85em;
    padding-bottom: 1px;
}
.navbar {
    padding: 0;!important;
}
.footer-title {
    font-family: 'Poppins', sans-serif;
    font-weight: 500;
    font-size: 1.2rem;
}
.see-all {
    font-family: 'Poppins', sans-serif;
    font-weight: 100; /* Extra Bold for see all */
    font-size: 1.1rem;
}
.footer-nav ul li a {
    color: var( --ws4-white);
}
.footer-nav ul li a:hover {
    color: var( --ws4-orange);
}
.copyright-text {
    font-size: 1em;
    color: #6f7070;
}
.navbar .dropdown-toggle::after{color:black;}
.dropdown:hover>.dropdown-menu {display: block;}
.dropdown>.dropdown-toggle:active {/*Without this, clicking will make it sticky*/pointer-events: none;}
.dropdown-menu {width: 100% !important;}


/* Ensure the mega menu spans the entire width of the screen */
.topnav .dropdown-menu {
    width: 100vw; /* Full viewport width */
    position: absolute;
    left: 0; /* Align to the left of the screen */
    right: 0;
    top: 100%; /* Drop it below the nav item */
    display: none;
    padding: 20px 0;
    background-color: var(--ws4-orange);
    box-shadow: 0 8px 16px rgba(0, 0, 0, 0.1);
    z-index: 1050; /* Ensure it stays on top */
}

.topnav .dropdown:hover .dropdown-menu {
    display: block; /* Show the mega menu on hover */
}

/* Flex layout for dropdown content */
.topnav .dropdown-menu .container {
    display: flex;
    justify-content: space-between; /* Distribute columns across the container */
    padding: 0 15px;
}

/* Each column inside the mega menu */
.topnav .dropdown-menu .col {
    flex: 1; /* Each column takes up equal space */
    padding: 0 20px; /* Add padding for spacing */
}

/* Style for column headings (e.g., 'Acoustic Guitars') */
.topnav .dropdown-menu h6 {
    font-weight: 600;
    color: var(--ws4-white);
    font-size: 1.1rem;
}

/* Style for links inside the mega menu */
.topnav .dropdown-menu a {
    color: var(--ws4-white);
    text-decoration: none;
    display: block;
    padding: 5px 0;
}

/* Hover effect for links inside the mega menu */
.topnav .dropdown-menu a:hover {
    color: var(--ws4-light-gray);
}
/* Custom CSS for Mega Menu */
.mega-menu {
    position: static !important;
}

.mega-menu .dropdown-menu {
    width: 100%;
    left: 0;
    right: 0;
    padding: 20px;
}

.mega-menu-column {
    min-width: 200px;
}

/* Add some spacing and styling */
.mega-menu .dropdown-menu h5 {
    margin-bottom: 15px;
    font-weight: 600;
}

.mega-menu .dropdown-item {
    padding: 8px 15px;
}

/* Optional hover effect */
.mega-menu .dropdown-menu:hover {
    display: block;
}


#nav-toggle .navbar-toggler-icon {
    background-image: url("data:image/svg+xml;charset=utf8,%3Csvg viewBox='0 0 32 32' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath stroke='red' stroke-width='3' stroke-linecap='round' stroke-miterlimit='10' d='M4 8h24M4 16h24M4 24h24'/%3E%3C/svg%3E");
    margin-right: 25px;
}
.btn-primary {
    background-color: var(--ws4-orange);
    border-color: var(--ws4-orange);
    color: var(--ws4-black);
}
.btn-primary:hover {
    background-color: var(--ws4-green);
    border-color: var(--ws4-green);
    color: var(--ws4-black);
}
.btn-alt-primary {
    background-color: var(--ws4-green)!important;
    color: var(--ws4-white)!important;
    text-decoration: none!important;
}
.btn-alt-primary:hover {
    background-color: var(--ws4-orange) !important;
    color: var(--ws4-white)!important;
}
.btn-alt-secondary {
    background-color: var(--ws4-orange) !important;
    color: var(--ws4-white)!important;
}
.btn-alt-secondary:hover {
    background-color: var(--ws4-green)!important;
    color: var(--ws4-white)!important;
}
.btn-secondary {
    background-color: var(--ws4-black)!important;
    color: var(--ws4-white)!important;
    border: 1px solid var(--ws4-black) !important;
}

.svg-flag-icon {
    max-height: 35px;  /* Set the maximum height */
    width: auto;       /* Keep the aspect ratio intact */
}
ul.navbar-products {
    list-style: none;
    padding: 0;
    margin: 0;
    padding-bottom: 7px;
    font-size: 0.8em;
}
.topnav .dropdown-menu a.navbar-products-main-cat {
    color: var(--ws4-black);
    text-decoration: none;
    text-transform: uppercase;
    font-weight: bold;
}
.topnav .dropdown-menu a.navbar-products-sub-cat {
    color: var(--ws4-black);
    text-decoration: none;
    text-transform: capitalize;
    font-weight: 500!important;
}
.topnav .dropdown-menu a.navbar-products-main-cat:hover,
.topnav .dropdown-menu a.navbar-products-sub-cat:hover{
    color: #FFFFCC;
    background-color: var(--ws4-orange) !important;
}
.text-underline {
    margin-bottom: 10px;
    text-decoration: underline;
}
.currency-select-wrapper {
    position: relative!important;
    /*display: inline-block!important;*/
    background-color: transparent!important;
}

.currency-select {
    color: #fff;
    background: transparent;
    border: none;
    outline: none;
    padding-right: 12px;
    cursor: pointer;
    font-family: Poppins, sans-serif;
    font-size: 1em;
    -webkit-appearance: none;
    appearance: none;
    border-bottom: 1px solid white;
}
/* Style for the options */
.currency-select option {
    background-color: #111;
    color: #fff;
    padding: 8px;
}
/* Remove the after pseudo-element and use an actual element instead */
.arrow-down {
    position: absolute;
    right: 0;
    top: 50%;
    transform: translateY(-50%);
    pointer-events: none;
    font-size: 8px;
    color: #fff;
}

.search-input-custom {
    background-color: #dedede!important;
}
.search-btn-custom {
    background-color: #dedede !important;
    border-left: 1px solid #000 !important;
    border-top: 1px solid #ccc;
    border-right: 1px solid #ccc;
    border-bottom: 1px solid #ccc;
    color: #000 !important;
}

.search-btn-custom i {
    color: #000 !important;
}

.sidebar-brand-list a:hover {
    color: var(--ws4-orange); /* Bootstrap primary or your own highlight */
    text-decoration: underline;
}
/* Positioning already handled by Bootstrap utility classes */
.card-img-wrapper {
    position: relative;
}

.product-badge {
    position: absolute;
    top: 10px;
    left: 10px;
    z-index: 10;
    padding: 0.4rem 0.6rem;
    font-size: 1.1rem;
    font-weight: 600;
    text-transform: uppercase;
    border-radius: 0;
}

.badge-offset {
    top: 40px; /* Stagger second badge below SOLD */
}

/* Base badge styles (overrides Bootstrap colors if needed) */
.badge {
    font-family: 'Oswald', sans-serif;
    font-size: 1.2rem;
    padding: 0.35em 0.6em;
    text-transform: uppercase;
    letter-spacing: 0.05em;
}

/* Optional: style for SOLD badge */
.badge-sold {
    background-color: var(--ws4-orange);
    color: #fff;
}

/* Optional: style for ONLINE ONLY badge */
.badge-online-only {
    background-color: var(--ws4-green);
    color: #FFF;
}

.product-badge-large {
    font-size: 2.5rem;
    padding: 0.75rem 1.5rem;
    margin: 0.75rem 0 0 0.75rem;

}
.mobile-jump-menu {
    background-color: var(--ws4-black);
    color: var(--ws4-white);
}
.active-link {
    color: var(--ws4-orange) !important;
}
.ws-sidebar-title {
    font-family: 'Oswald', sans-serif;
    font-weight: 800; /* Extra Bold for sidebar titles */
    font-size: 1.2rem;
    color: var(--ws4-white);
}
.brand-card-title {
    color: var(--ws4-white)!important;
}
.brand-card-title:hover,
.brand-card-seemore:hover
{
    color: var(--ws4-orange)!important;
}
.brand-card-excerpt {
    font-family: 'Poppins', sans-serif;
    font-weight: normal;
    font-size: 0.8rem;
    color: var(--ws4-white);
}
.product-card .card-title {
    color: var(--ws4-light-gray)!important;
    font-family: 'Oswald', sans-serif;
    font-weight: 500; /* Semibold for product titles */
    font-size: 1.1rem;
    line-height: 1.2;
    margin-bottom: 0.25rem;
    /* Optional: Adjust the height to fit your design */
    /* white-space: nowrap; */
    /* overflow: hidden; */
    /* text-overflow: ellipsis; */
}
.product-card .card-title:hover {
    color: var(--ws4-orange)!important;
}
.product-card .product-price {
    font-family: 'Poppins', sans-serif;
    font-weight: 600;
    font-size: 1.1rem;
    color: #fff;
}
.product-card .card-body {
    padding: 1rem;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}
.sidebar-categories {
    padding: 1rem;
    border-radius: 6px;
}

.category-list,
.child-category-list {
    list-style: none;
    margin: 0;
    padding: 0;
}

.parent-category > a {
    font-size: 0.9rem;
    font-weight: bold;
    color: #FFF;
    text-transform: uppercase;
}

.child-category-list li a {
    font-weight: 100!important;
    font-size: 0.9rem;
    color: #FFF;
}
.breadcrumb-trail {
    font-size: 0.9rem;
}

.breadcrumb-link {
    color: #82888a !important;
    text-decoration: none;
    font-weight: 500 !important;
}

.breadcrumb-link:hover {
    text-decoration: underline;
}
.ws-tabs {
    background-color: #111!important; /* dark background */
    color: #fff; /* white text */
    border: 1px solid var(--ws4-orange);
    margin: 0;
    transition: all 0.2s ease-in-out;
    padding: 10px;
}
.ws-tabs:hover {
    background-color: #333;
}
.ws-tabs.active {
    background-color: var(--ws4-orange); /* active page background */
    color: black;
}
.breadcrumb-current {
    color: #82888a !important;
    font-weight: bold;
}

.pagination .page-item .page-link {
    background-color: #222; /* dark background */
    color: #fff; /* white text */
    border: 1px solid var(--ws4-orange);
    margin: 0;
    transition: all 0.2s ease-in-out;
}

.pagination .page-item .page-link:hover {
    background-color: #333;
}

.pagination .page-item.active .page-link {
    background-color: var(--ws4-orange); /* active page background */
    color: black;
}
.pagination .page-item .bookend {
    background-color: #000; /* dark background */
    color: #fff; /* white text */
    border: 1px solid var(--ws4-orange);
    margin: 0;
    transition: all 0.2s ease-in-out;
}
.divider {
    margin: 0 0.4rem;
    color: #888;
}
.cms-content,
.woo-content {
    padding: 1rem;
    color: var(--ws4-white);
    font-weight: 300!important;
}
.cms-content a {
    color: var(--ws4-orange) !important;
    text-decoration: underline !important;
}
.cms-content li {
    font-family: 'Poppins', sans-serif;
    font-weight: 300!important; /* Medium for body text */
}
.cms-content p strong {
    font-family: 'Poppins', sans-serif;
    font-weight: 600!important; /* Medium for body text */
}
.sortby-select {
    appearance: none;
    -webkit-appearance: none;
    -moz-appearance: none;
    background-color: #2a2a2a;
    color: white;
    border: none;
    padding: 12px 40px 12px 20px;
    font-size: 16px;
    border-radius: 4px;
    cursor: pointer;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'%3E%3C/polyline%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: right 12px center;
    background-size: 20px;
    min-width: 200px;
}

.sortby-select:hover {
    background-color: #333;
}

.sortby-select:focus {
    outline: none;
    box-shadow: 0 0 0 3px rgba(255, 255, 255, 0.1);
}

.sortby-select option {
    background-color: #2a2a2a;
    color: white;
    padding: 10px;
}

/* Styling the scroll to top button */
#scrollToTopBtn {
    position: fixed;
    bottom: 20px;
    right: 20px;
    width: 50px;
    height: 50px;
    background-color: #444;
    border: none;
    border-radius: 50%;
    border-color: white!important;
    color: white;
    display: none;
    justify-content: center;
    align-items: center;
    cursor: pointer;
    font-size: 18px;
    z-index: 1000;
    transition: background 0.3s ease;
}
#scrollToTopBtn:hover {
    background-color: #333;
}

.relevanssi-live-search-results { background-color: #444444!important;.relevanssi-live-ajax-search-spinner{ color: orange;}}
.rlv-has-spinner {width: 56px;height: 56px;border: 8px solid #FF7F00;border-right-color: transparent;border-radius: 50%;position: relative;animation: loader-rotate 1s linear infinite;margin: 1em auto;}
.rlv-has-spinner::after {content: "";width: 8px;height: 8px;background: #FF7F00;border-radius: 50%;position: absolute;top: -1px;left: 33px;}

.woocommerce-error, .woocommerce-info, .woocommerce-message {
    padding: 1em 2em 1em 3.5em;
    margin: 0 0 2em;
    position: relative;
    background-color: #222;
    color: #fff;
    border-top: 3px solid var(--ws4-orange);
    list-style: none outside;
    width: auto;
    word-wrap: break-word;
}
.woocommerce-info::before {
    color: var(--ws4-orange);
}
.review-link {
    position: relative;
    top: 1px;
}
/* allow mega‐menu main titles to wrap/hyphenate */
.topnav .navbar-products-main-cat {
    white-space: normal !important;    /* let the text wrap onto multiple lines */
    word-break: break-word;            /* break long words if needed */
    hyphens: auto;                     /* enable soft hyphenation in supported browsers */
}

/* Responsive adjustments */
@media (max-width: 1024px) {
    .mega-menu-column {
        min-width: 100px !important;     /* shrink columns a bit more */
        font-size: 0.85em !important;     /* optionally reduce text size */
    }
}

@media (max-width: 1293px) {
    ul.navbar-products {
        padding: 0!important;
        margin: 0!important;
        font-size: 0.9em!important;
    }
    .nav-link{
        padding: 0!important;
        margin: 0!important;
        padding: 10px 0 !important;
        font-size: 0.9em!important;
    }
    .topnav .dropdown-menu a.navbar-products-main-cat,
    .topnav .dropdown-menu a.navbar-products-sub-cat{
        font-size: 0.9em!important;
    }
    .mega-menu-column {
        min-width: 150px!important;  /*Adjust the width of each column */
    }
}
@media (max-width: 1024px) {
    .mega-menu-column {
        min-width: 120px!important;  /*Adjust the width of each column */
        font-size: 0.875em!important;
    }
}
/* Hide desktop navbar on mobile */
@media (max-width: 991px) {
    h2 {
        font-size: 2em!important;
    }
    .desktop-nav {
        display: none !important;
    }
}

/* Hide mobile nav button on desktop */
@media (min-width: 992px) {
    .mobile-nav-btn {
        display: none !important;
    }
}
