/*
Theme Name: Car & Stay - Le Journal
Theme URI: https://www.car-and-stay.com/
Author: Car & Stay
Description: Thème de blog aux couleurs officielles de Car & Stay (Rent Your Way). Conçu pour prolonger le site principal : mêmes logo, couleurs, navigation et pied de page, afin que le visiteur ne ressente aucune rupture entre le site et le blog. Interface en français.
Version: 1.0.0
Requires at least: 5.5
Tested up to: 6.6
Requires PHP: 7.2
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: carstay
*/

/* =========================================================================
   Variables de couleurs — prélevées directement sur car-and-stay.com
   ========================================================================= */
:root{
    --cs-accent:#B2713A;        /* Cuivre / accent officiel */
    --cs-accent-dark:#8f5a2c;
    --cs-dark:#1D1D1B;          /* Noir de marque (texte / titres) */
    --cs-text:#1D1D1B;
    --cs-muted:#6b6b69;
    --cs-line:#e7e7e7;
    --cs-bg:#ffffff;            /* Fond principal */
    --cs-bg-soft:#F5F5F7;       /* Fond secondaire (cartes, alternances) */
    --cs-header-bg:#ffffff;     /* Fond du header (blanc, comme le site) */
    --cs-footer-a:#4e4e4e;      /* Dégradé du footer — départ */
    --cs-footer-b:#212121;      /* Dégradé du footer — fin */
    --cs-footer-text:#c9c9c9;
    --cs-max:1200px;
    --cs-radius:10px;
}

/* =========================================================================
   Base
   ========================================================================= */
*,*::before,*::after{box-sizing:border-box;}
html{-webkit-text-size-adjust:100%;}
body{
    margin:0;
    font-family:'Inter',-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,Helvetica,Arial,sans-serif;
    color:var(--cs-text);
    background:var(--cs-bg);
    line-height:1.65;
    font-size:17px;
    -webkit-font-smoothing:antialiased;
}
img{max-width:100%;height:auto;display:block;}
a{color:var(--cs-accent);text-decoration:none;transition:color .18s ease;}
a:hover{color:var(--cs-accent-dark);}
h1,h2,h3,h4,h5,h6{color:var(--cs-dark);line-height:1.2;font-weight:800;margin:0 0 .5em;}
h1{font-size:2.1rem;}
h2{font-size:1.6rem;}
h3{font-size:1.3rem;}
p{margin:0 0 1.2em;}
blockquote{
    margin:1.5em 0;padding:.6em 1.2em;border-left:4px solid var(--cs-accent);
    background:var(--cs-bg-soft);color:var(--cs-dark);font-style:italic;
}
code,pre{font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;background:var(--cs-bg-soft);}
pre{padding:1em;overflow:auto;border-radius:var(--cs-radius);}
code{padding:.15em .35em;border-radius:4px;font-size:.9em;}
hr{border:0;border-top:1px solid var(--cs-line);margin:2em 0;}

.cs-container{width:100%;max-width:var(--cs-max);margin:0 auto;padding:0 20px;}
.screen-reader-text{
    border:0;clip:rect(1px,1px,1px,1px);clip-path:inset(50%);height:1px;width:1px;
    margin:-1px;overflow:hidden;padding:0;position:absolute;word-wrap:normal!important;
}
.skip-link{position:absolute;left:-9999px;top:0;background:var(--cs-dark);color:#fff;padding:10px 16px;z-index:1000;}
.skip-link:focus{left:8px;top:8px;color:#fff;}

/* =========================================================================
   Header — fidèle au site : logo, navigation, bouton téléphone, actif surligné.
   Conçu pour NE JAMAIS casser : largeurs bornées, wrap, pas de chevauchement.
   ========================================================================= */
.site-header{
    background:var(--cs-header-bg);
    border-bottom:1px solid var(--cs-line);
    position:sticky;top:0;z-index:500;
}
.header-inner{
    display:flex;align-items:center;justify-content:space-between;gap:16px;
    min-height:96px;padding-top:10px;padding-bottom:10px;flex-wrap:wrap;
}
/* Bouton téléphone (pilule claire, icône cuivre) */
.header-phone{
    display:inline-flex;align-items:center;gap:10px;
    background:var(--cs-bg-soft);color:var(--cs-dark);
    padding:12px 20px;border-radius:40px;font-weight:700;white-space:nowrap;
    flex:0 0 auto;
}
.header-phone:hover{color:var(--cs-dark);background:#ececef;}
.header-phone svg{width:20px;height:20px;fill:var(--cs-accent);flex:0 0 auto;}

/* Logo — borné en hauteur, largeur auto ; jamais débordant */
.site-branding{flex:1 1 auto;display:flex;justify-content:center;min-width:0;}
.site-branding .custom-logo,
.site-branding .cs-logo-img{max-height:60px;width:auto;}
.site-branding a{display:inline-flex;align-items:center;max-width:100%;}
/* Repli texte si aucun logo : borné et peut passer à la ligne */
.site-title-fallback{
    font-weight:800;font-size:1.5rem;color:var(--cs-dark);text-align:center;
    max-width:100%;overflow-wrap:anywhere;line-height:1.15;
}
.site-title-fallback .cs-baseline{display:block;font-size:.6rem;letter-spacing:.25em;
    text-transform:uppercase;color:var(--cs-accent);font-weight:600;margin-top:2px;}

/* Bouton menu (hamburger) — visible sur mobile uniquement */
.menu-toggle{
    display:none;align-items:center;gap:8px;flex:0 0 auto;
    background:none;border:0;cursor:pointer;color:var(--cs-dark);
    font-family:inherit;font-weight:700;font-size:.8rem;letter-spacing:.15em;text-transform:uppercase;
    padding:8px;
}
.menu-toggle .bars{display:inline-block;width:26px;height:16px;position:relative;}
.menu-toggle .bars span{position:absolute;left:0;width:100%;height:2px;background:var(--cs-dark);border-radius:2px;}
.menu-toggle .bars span:nth-child(1){top:0;}
.menu-toggle .bars span:nth-child(2){top:7px;}
.menu-toggle .bars span:nth-child(3){top:14px;}

/* Barre de navigation principale */
.main-navigation{flex-basis:100%;order:3;}
.main-navigation ul{
    list-style:none;margin:0;padding:8px 0 4px;
    display:flex;flex-wrap:wrap;justify-content:center;gap:6px 26px;
}
.main-navigation a{
    display:inline-block;color:var(--cs-dark);font-weight:600;font-size:.98rem;
    padding:6px 2px;border-bottom:2px solid transparent;white-space:nowrap;
}
.main-navigation a:hover{color:var(--cs-accent);}
/* Onglet actif surligné (comme le site : cuivre + soulignement) */
.main-navigation .current-menu-item > a,
.main-navigation a.is-active{
    color:var(--cs-accent);border-bottom-color:var(--cs-accent);
}

@media (max-width:1024px){
    .header-inner{min-height:76px;}
    .menu-toggle{display:inline-flex;}
    .main-navigation{display:none;}
    .main-navigation.is-open{display:block;}
    .main-navigation ul{flex-direction:column;align-items:stretch;justify-content:flex-start;gap:0;padding:8px 0 14px;}
    .main-navigation li{border-top:1px solid var(--cs-line);}
    .main-navigation a{display:block;padding:12px 4px;border-bottom:0;}
    .main-navigation .current-menu-item > a,
    .main-navigation a.is-active{border-left:3px solid var(--cs-accent);padding-left:10px;}
}
@media (max-width:600px){
    .header-phone span{display:none;} /* garde l'icône, gagne de la place */
    .header-phone{padding:12px;}
}

/* =========================================================================
   Contenu principal / mise en page
   ========================================================================= */
.site-content{padding:40px 0 60px;}
.content-area{display:flex;gap:44px;align-items:flex-start;}
.primary{flex:1 1 auto;min-width:0;}
.sidebar{flex:0 0 300px;}
@media (max-width:900px){
    .content-area{flex-direction:column;}
    .sidebar{flex:1 1 auto;width:100%;}
}

.page-header{margin-bottom:28px;}
.page-title{font-size:2rem;}
.page-title .cs-thin{color:var(--cs-accent);}
.archive-description{color:var(--cs-muted);}

/* Liste d'articles */
.post-card{
    background:#fff;border:1px solid var(--cs-line);border-radius:var(--cs-radius);
    overflow:hidden;margin-bottom:30px;transition:box-shadow .2s ease,transform .2s ease;
}
.post-card:hover{box-shadow:0 14px 34px rgba(29,29,27,.10);transform:translateY(-2px);}
.post-card .thumb{display:block;aspect-ratio:16/9;overflow:hidden;background:var(--cs-bg-soft);}
.post-card .thumb img{width:100%;height:100%;object-fit:cover;}
.post-card .card-body{padding:22px 26px 26px;}
.post-card .entry-title{font-size:1.4rem;margin-bottom:.3em;}
.post-card .entry-title a{color:var(--cs-dark);}
.post-card .entry-title a:hover{color:var(--cs-accent);}
.entry-meta{font-size:.85rem;color:var(--cs-muted);margin-bottom:12px;display:flex;flex-wrap:wrap;gap:6px 16px;}
.entry-meta a{color:var(--cs-muted);}
.entry-meta a:hover{color:var(--cs-accent);}
.entry-excerpt{color:#3a3a38;}
.read-more{display:inline-block;margin-top:10px;font-weight:700;color:var(--cs-accent);}
.read-more::after{content:" \2192";}

/* Article seul */
.single-post-header{margin-bottom:26px;}
.single .entry-title{font-size:2.3rem;}
.post-thumbnail-single{margin:0 0 28px;border-radius:var(--cs-radius);overflow:hidden;}
.entry-content{font-size:1.05rem;}
.entry-content img{border-radius:var(--cs-radius);margin:1.2em 0;}
.entry-content h2,.entry-content h3{margin-top:1.6em;}
.entry-content a{text-decoration:underline;}
.entry-footer{margin-top:34px;padding-top:20px;border-top:1px solid var(--cs-line);
    font-size:.9rem;color:var(--cs-muted);display:flex;flex-wrap:wrap;gap:10px 20px;}
.tag-links a,.cat-links a{
    display:inline-block;background:var(--cs-bg-soft);padding:4px 12px;border-radius:30px;
    margin:0 6px 6px 0;font-size:.82rem;color:var(--cs-dark);
}
.tag-links a:hover,.cat-links a:hover{background:var(--cs-accent);color:#fff;}

/* Navigation entre articles / pagination */
.cs-pagination{margin:34px 0 0;}
.cs-pagination .nav-links{display:flex;flex-wrap:wrap;gap:8px;justify-content:center;}
.cs-pagination .page-numbers{
    display:inline-block;padding:9px 15px;border:1px solid var(--cs-line);border-radius:8px;
    color:var(--cs-dark);font-weight:600;
}
.cs-pagination .page-numbers.current{background:var(--cs-accent);border-color:var(--cs-accent);color:#fff;}
.cs-pagination a.page-numbers:hover{border-color:var(--cs-accent);color:var(--cs-accent);}
.post-navigation{margin-top:36px;display:flex;justify-content:space-between;gap:20px;flex-wrap:wrap;}
.post-navigation .nav-previous,.post-navigation .nav-next{max-width:48%;}
.post-navigation a{font-weight:700;color:var(--cs-dark);}
.post-navigation a:hover{color:var(--cs-accent);}
.post-navigation .cs-nav-sub{display:block;font-size:.75rem;text-transform:uppercase;letter-spacing:.1em;color:var(--cs-muted);}

/* =========================================================================
   Boutons
   ========================================================================= */
.cs-btn{
    display:inline-block;background:var(--cs-accent);color:#fff;font-weight:700;
    padding:12px 26px;border-radius:40px;border:2px solid var(--cs-accent);cursor:pointer;
}
.cs-btn:hover{background:var(--cs-accent-dark);border-color:var(--cs-accent-dark);color:#fff;}
.cs-btn-ghost{background:transparent;color:var(--cs-dark);border-color:var(--cs-dark);}
.cs-btn-ghost:hover{background:var(--cs-dark);color:#fff;}

/* =========================================================================
   Sidebar / widgets
   ========================================================================= */
.widget{margin-bottom:34px;}
.widget-title{
    font-size:1.05rem;text-transform:uppercase;letter-spacing:.06em;
    padding-bottom:10px;margin-bottom:16px;border-bottom:2px solid var(--cs-accent);
}
.widget ul{list-style:none;margin:0;padding:0;}
.widget ul li{padding:8px 0;border-bottom:1px solid var(--cs-line);}
.widget ul li a{color:var(--cs-dark);}
.widget ul li a:hover{color:var(--cs-accent);}

/* Formulaire de recherche */
.search-form{display:flex;gap:8px;}
.search-form .search-field{
    flex:1 1 auto;min-width:0;padding:12px 14px;border:1px solid var(--cs-line);
    border-radius:8px;font-family:inherit;font-size:.95rem;
}
.search-form .search-field:focus{outline:none;border-color:var(--cs-accent);}
.search-form .search-submit{
    flex:0 0 auto;background:var(--cs-accent);color:#fff;border:0;border-radius:8px;
    padding:0 18px;font-weight:700;cursor:pointer;
}
.search-form .search-submit:hover{background:var(--cs-accent-dark);}

/* =========================================================================
   Commentaires
   ========================================================================= */
.comments-area{margin-top:44px;padding-top:24px;border-top:1px solid var(--cs-line);}
.comment-list{list-style:none;margin:0;padding:0;}
.comment-list li{margin:0 0 20px;}
.comment-body{background:var(--cs-bg-soft);border-radius:var(--cs-radius);padding:18px 20px;}
.comment-list .children{list-style:none;margin:16px 0 0 26px;padding:0;}
.comment-author{font-weight:700;color:var(--cs-dark);}
.comment-author img{border-radius:50%;margin-right:10px;vertical-align:middle;}
.comment-metadata{font-size:.8rem;color:var(--cs-muted);}
.comment-respond{margin-top:24px;}
.comment-form input[type=text],
.comment-form input[type=email],
.comment-form input[type=url],
.comment-form textarea{
    width:100%;padding:12px 14px;border:1px solid var(--cs-line);border-radius:8px;
    font-family:inherit;font-size:1rem;margin-top:4px;
}
.comment-form textarea:focus,.comment-form input:focus{outline:none;border-color:var(--cs-accent);}
.comment-form p{margin-bottom:14px;}
.form-submit .submit{
    background:var(--cs-accent);color:#fff;border:0;border-radius:40px;padding:12px 30px;
    font-weight:700;cursor:pointer;
}
.form-submit .submit:hover{background:var(--cs-accent-dark);}

/* =========================================================================
   404 / états vides
   ========================================================================= */
.cs-notice{
    background:var(--cs-bg-soft);border-radius:var(--cs-radius);padding:48px 30px;text-align:center;
}
.error-404 .error-code{font-size:5rem;font-weight:800;color:var(--cs-accent);line-height:1;margin-bottom:.1em;}

/* =========================================================================
   Footer — reproduit le pied de page du site (dégradé, 3 zones, crédit)
   ========================================================================= */
.site-footer{
    background:linear-gradient(90deg,var(--cs-footer-a) 0%,var(--cs-footer-b) 100%);
    color:var(--cs-footer-text);margin-top:20px;
}
.footer-main{
    display:grid;grid-template-columns:1fr auto 1fr;gap:40px;align-items:start;
    padding:56px 0 46px;
}
.footer-col-links ul{list-style:none;margin:0;padding:0;}
.footer-col-links li{margin:0 0 16px;}
.footer-col-links a{color:#f2f2f2;font-weight:500;}
.footer-col-links a:hover{color:var(--cs-accent);}

.footer-col-center{text-align:center;display:flex;flex-direction:column;align-items:center;gap:18px;}
.footer-logo img{max-height:64px;width:auto;margin:0 auto;}
.footer-phone{
    display:inline-flex;align-items:center;gap:10px;background:#fff;color:var(--cs-dark);
    padding:12px 22px;border-radius:40px;font-weight:700;white-space:nowrap;
}
.footer-phone:hover{color:var(--cs-dark);background:#f0f0f0;}
.footer-phone svg{width:20px;height:20px;fill:var(--cs-accent);}
.footer-address{color:#e2e2e2;font-size:.95rem;line-height:1.5;margin:0;}

.footer-col-social{text-align:right;}
.footer-col-social .follow-label{color:#f2f2f2;margin:0 0 18px;font-size:1.05rem;}
.footer-social-link{display:inline-flex;align-items:center;gap:10px;color:#fff;font-weight:700;margin:0 0 16px;justify-content:flex-end;width:100%;}
.footer-social-link:hover{color:var(--cs-accent);}
.footer-social-link svg{width:22px;height:22px;fill:currentColor;flex:0 0 auto;}

.footer-credit{
    background:rgba(0,0,0,.28);text-align:center;padding:14px 0;font-size:.85rem;color:#cfcfcf;
}
.footer-credit a{color:#e6e6e6;}
.footer-credit a:hover{color:var(--cs-accent);}

@media (max-width:900px){
    .footer-main{grid-template-columns:1fr;text-align:center;gap:34px;}
    .footer-col-social{text-align:center;}
    .footer-social-link{justify-content:center;}
    .footer-col-center{order:-1;}
}

/* Bouton retour en haut */
.cs-top{
    position:fixed;right:22px;bottom:22px;width:46px;height:46px;border-radius:50%;
    background:var(--cs-dark);color:#fff;display:none;align-items:center;justify-content:center;
    z-index:600;border:0;cursor:pointer;opacity:.92;
}
.cs-top:hover{background:var(--cs-accent);}
.cs-top.show{display:flex;}
.cs-top svg{width:20px;height:20px;fill:#fff;}

/* Alignements des images WordPress */
.alignleft{float:left;margin:.4em 1.4em 1em 0;}
.alignright{float:right;margin:.4em 0 1em 1.4em;}
.aligncenter{margin-left:auto;margin-right:auto;}
.wp-caption-text{font-size:.85rem;color:var(--cs-muted);text-align:center;}
.sticky .entry-title::before{content:"\2605 ";color:var(--cs-accent);}