/*
Theme Name: Enfrance Theme
Theme URI: https://enfrance.biz
Template: generatepress
Author: Philippe
Description: Un theme pour les sites enfrance.biz
Tags: two-columns,three-columns,one-column,right-sidebar,left-sidebar,footer-widgets,blog,e-commerce,flexible-header,full-width-template,buddypress,custom-header,custom-background,custom-menu,custom-colors,sticky-post,threaded-comments,translation-ready,rtl-language-support,featured-images,theme-options
Version: 3.5.1.1733676917
Updated: 2024-12-08 17:55:17

*/

/* =================================
   CHARTE GRAPHIQUE LYON
   Thème enfant GeneratePress
   ================================= */

:root {
    --lyon-or: #C9A962;
    --lyon-rouge: #B85450;
    --lyon-rose: #E89B9B;
    --lyon-bleu: #4A6FA5;
    --lyon-vert: #6B8E5C;
    --lyon-gris: #2C3E50;
    --lyon-blanc: #F9F7F3;
    --lyon-gris-clair: #E5E0D8;
}

/* --- TYPOGRAPHIE --- */
h1, h2, h3, h4, h5, h6 {
    color: var(--lyon-or);
    font-weight: 700;
}

h1 { font-size: 2.5rem; }
h2 { font-size: 2rem; }
h3 { font-size: 1.75rem; }

/* Texte principal */
body, p {
    color: var(--lyon-gris);
    line-height: 1.6;
}

/* --- LIENS --- */
a {
    color: var(--lyon-bleu);
    text-decoration: none;
    transition: color 0.3s ease;
}

a:hover {
    color: var(--lyon-rouge);
    text-decoration: underline;
}

/* --- BOUTONS --- */
.button, 
.wp-block-button__link,
input[type="submit"] {
    background-color: var(--lyon-or);
    color: #FFFFFF !important;
    border: none;
    padding: 12px 24px;
    border-radius: 4px;
    font-weight: 600;
    transition: all 0.3s ease;
}

.button:hover, 
.wp-block-button__link:hover,
input[type="submit"]:hover {
    background-color: var(--lyon-rouge);
    color: #FFFFFF !important;
    transform: translateY(-2px);
    box-shadow: 0 4px 8px rgba(0,0,0,0.1);
}

/* --- ARRIÈRE-PLANS --- */
body {
    background-color: var(--lyon-blanc);
}

/* En-tête */
.site-header {
    background-color: #FFFFFF;
    border-bottom: 3px solid var(--lyon-or);
}

/* Footer */
.site-footer {
    background-color: var(--lyon-gris);
    color: #FFFFFF;
}

.site-footer a {
    color: var(--lyon-or);
}

/* --- CATÉGORIES D'ARTICLES --- */
.category-les-monuments-a-lyon {
    border-left: 4px solid var(--lyon-or);
}

.category-sites-lyonnais {
    border-left: 4px solid var(--lyon-vert);
}

.category-autour-de-lyon {
    border-left: 4px solid var(--lyon-bleu);
}

.category-culture-et-traditions-lyonnaises {
    border-left: 4px solid var(--lyon-rose);
}

.category-actualites-a-lyon {
    border-left: 4px solid var(--lyon-rouge);
}

/* --- MENU DE NAVIGATION --- */
.main-navigation {
    background-color: #FFFFFF;
}

.main-navigation .main-nav ul li a {
    color: var(--lyon-gris);
    font-weight: 600;
}

.main-navigation .main-nav ul li a:hover {
    color: var(--lyon-or);
    background-color: var(--lyon-blanc);
}

.main-navigation .main-nav ul li.current-menu-item > a {
    color: var(--lyon-or);
}

/* --- CARTES D'ARTICLES --- */
.inside-article {
    background-color: #FFFFFF;
    border: 1px solid var(--lyon-gris-clair);
    border-radius: 8px;
    transition: transform 0.3s ease;
}

.inside-article:hover {
    transform: translateY(-5px);
    box-shadow: 0 10px 20px rgba(0,0,0,0.1);
}

/* --- BADGES ET ÉTIQUETTES --- */
.badge-lyon {
    background-color: var(--lyon-rose);
    color: #FFFFFF;
    padding: 4px 12px;
    border-radius: 20px;
    font-size: 0.85rem;
    font-weight: 600;
}

/* --- SÉPARATEURS --- */
hr {
    border: none;
    border-top: 2px solid var(--lyon-gris-clair);
    margin: 40px 0;
}

/* --- IMAGES --- */
img {
    border-radius: 4px;
}

/* --- TABLEAUX --- */
table {
    border: 1px solid var(--lyon-gris-clair);
}

th {
    background-color: var(--lyon-or);
    color: #FFFFFF;
}

/* --- FORMULAIRES --- */
input[type="text"],
input[type="email"],
textarea {
    border: 2px solid var(--lyon-gris-clair);
    border-radius: 4px;
    padding: 10px;
}

input[type="text"]:focus,
input[type="email"]:focus,
textarea:focus {
    border-color: var(--lyon-bleu);
    outline: none;
}

/* --- SIDEBAR : autorisée (même règle que Toulouse/Bordeaux) --- */
.no-sidebar .site-content .content-area,
.no-sidebar .inside-article,
.no-sidebar .entry-content {
    max-width: 850px !important;
    margin: 0 auto !important;
    float: none !important;
}

.right-sidebar .site-content .content-area,
.left-sidebar .site-content .content-area {
    margin: 0 !important;
    float: none !important;
}

/* --- NAVIGATION : pas de bouton MENU sur desktop, hamburger uniquement sur mobile --- */
.main-navigation .menu-toggle,
.mobile-menu-control-wrapper .menu-toggle {
    display: none !important;
}

.main-navigation .main-nav {
    display: block !important;
}

@media (max-width: 768px) {
    .main-navigation .menu-toggle,
    .mobile-menu-control-wrapper .menu-toggle {
        display: inline-flex !important;
        background-color: var(--lyon-or) !important;
        color: #fff !important;
        border: none !important;
        border-radius: 8px !important;
        padding: 10px 20px !important;
        font-weight: 700 !important;
        align-items: center !important;
        gap: 8px;
    }
    .main-navigation:not(.toggled) .main-nav {
        display: none !important;
    }
    .main-navigation.toggled .main-nav {
        display: block !important;
    }
    .site-content {
        flex-direction: column !important;
    }
    .site-content .content-area,
    .site-content .sidebar {
        width: 100% !important;
    }
}

/* --- MOBILE --- */
@media (max-width: 768px) {
    h1 { font-size: 2rem; }
    h2 { font-size: 1.75rem; }
    h3 { font-size: 1.5rem; }
    
    .button, 
    .wp-block-button__link {
        padding: 10px 20px;
        font-size: 0.95rem;
    }
}