/**
 * Theme Name: Les fooders
 * Theme URI:  https://elementor.com/hello-theme/?utm_source=wp-themes&utm_campaign=theme-uri&utm_medium=wp-dash
 * Description:
 * Author:     Quentin LAURENT
 * Author URI: https://quentinlaurent.fr
 * Template:   hello-elementor
 * Version:    1.0.0
 * License:    GNU General Public License v2 or later
 * License URI: https://www.gnu.org/licenses/gpl-2.0.html
 * Tags:       accessibility-ready, flexible-header, custom-colors, custom-menu, custom-logo, featured-images, rtl-language-support, threaded-comments, translation-ready
 * Text Domain: les-fooders
 * Generated by WPMasterToolKit
 * @link https://wordpress.org/plugins/wpmastertoolkit/
 */




/* ============================================
    Audience Toggle
    ============================================ */

.audience-toggle-wrapper {
    display: flex;
    justify-content: center;
    margin: 16px 0;
}

.audience-toggle {
    display: flex;
    align-items: center;
    background: rgb(251 241 223);
    border-radius: 50px;
    padding: 4px;
    gap: 2px;
}

.audience-toggle .toggle-btn {
    padding: 8px 20px;
    border-radius: 50px;
    font-family: "Lato", sans-serif;
    font-size: 14px;
    font-weight: 700;
    cursor: pointer;
    border: none;
    background: transparent;
    color: #76706D;
    box-shadow: none;
    text-decoration: none;
    display: inline-block;
    transition:
        background 0.25s ease,
        color 0.25s ease,
        box-shadow 0.25s ease;
}

.audience-toggle .toggle-btn--active {
    background: #f6681c;
    color: #fff;
    box-shadow: 0 2px 10px rgba(246, 104, 28, 0.3);
}

html:not(.elementor-html) body.audience-pro .section-part,body.audience-pro .btnmenu-part {
    display: none!important;
}

html:not(.elementor-html) body.audience-part .section-pro,body.audience-part .btnmenu-pro {
    display: none!important;
}

/* ============================================
    Boutons menu
    ============================================ */

.btnmenu a {
    border-radius: 50px !important;
    background: #f6681c !important;
    color: #fff !important;
    transition: opacity 0.2s ease !important;
}

.btnmenu a:hover {
    opacity: 0.85 !important;
}

.btnmenu-2 a{
    border-radius: 50px !important;
    background: transparent !important;
    color: #3d3330 !important;
    transition: background 0.2s ease, color 0.2s ease !important;
}

.btnmenu-2 a:hover {
    background: #f6681c !important;
    color: #fff !important;
}

.btn-mobile {
    display: none !important;
}

@media (max-width: 768px) {
    .btn-mobile {
        display: inline-block !important;
    }
}

.color-primary{
    color:var(--e-global-color-primary);
}
.color-secondary{
    color:var(--e-global-color-secondary);
}

/* ============================================
    Colonne sticky (reste collée tant que le conteneur est visible)
    ============================================ */

@media (min-width: 769px) {
    .lf-sticky-col {
        position: sticky !important;
        top: 110px !important;
        align-self: flex-start !important;
    }
}

/* ============================================
    Logo Ticker
    ============================================ */

.logo-ticker {
    overflow: hidden;
    width: 100%;
}

.logo-ticker__track {
    display: flex;
    width: max-content;
    align-items: center;
    animation: logo-ticker-scroll linear infinite;
}

.logo-ticker__item {
    flex-shrink: 0;
    display: flex;
    align-items: center;
}

.logo-ticker__item img {
    display: block;
    object-fit: contain;
    transition: filter 0.25s ease, opacity 0.25s ease;
}


@keyframes logo-ticker-scroll {
    from { transform: translateX(0); }
    to   { transform: translateX(-50%); }
}

/* ============================================
    Header sticky shadow
    ============================================ */

#top-bar.header-scrolled {
    box-shadow: 0 2px 12px rgba(0, 0, 0, 0.08);
}

#top-bar {
    transition: transform 0.5s ease;
}

#top-bar.hidden {
    transform: translateY(-100%);
}


@media (max-width: 768px) {
    .audience-toggle-wrapper {
        margin-bottom: 0;
        margin-top:5px;
    }
    .audience-toggle {
        width: 100%;
    }
    .audience-toggle .toggle-btn {
        padding: 6px 16px;
        font-size: 12px;
        width: 50%;
    }

    .btnmenu{
        margin: 0 10px 10px!important;
    }
}
