/*
Theme Name: Flavor Maurice
Theme URI: https://ile-maurice.com
Description: Thème léger et rapide pour Ile-Maurice.Com
Author: Ile-Maurice.Com
Version: 1.0
Text Domain: flavor-maurice
*/

/* === Reset === */
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
img{max-width:100%;height:auto;display:block}
a{color:#0d6eaa;text-decoration:none}
a:hover{text-decoration:underline}
ul,ol{padding-left:1.5em}

/* === Base === */
body{
    font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;
    font-size:17px;line-height:1.7;color:#333;background:#fff;
    -webkit-font-smoothing:antialiased;
}

/* === Layout === */
.site-container{max-width:1100px;margin:0 auto;padding:0 30px}
.page-content{padding:40px 0 60px}
.single .site-container{max-width:800px}

/* === Header === */
.site-header{
    background:#fff;border-bottom:1px solid #eee;
    position:sticky;top:0;z-index:100;
}
.header-inner{
    display:flex;align-items:center;justify-content:space-between;
    max-width:1200px;margin:0 auto;padding:12px 30px;
}
.site-logo img{max-height:55px;width:auto}
.site-logo a{display:block;text-decoration:none}

/* === Navigation === */
.main-nav ul{list-style:none;display:flex;gap:5px;padding:0;margin:0}
.main-nav a{
    display:block;padding:8px 16px;color:#444;font-size:15px;font-weight:500;
    border-radius:4px;transition:color .2s,background .2s;text-decoration:none;
}
.main-nav a:hover,.main-nav .current-menu-item>a{color:#0d6eaa;background:#f0f7fc}
.nav-toggle{display:none;background:none;border:none;cursor:pointer;padding:8px}
.nav-toggle span{display:block;width:24px;height:2px;background:#333;margin:5px 0;transition:all .3s}
.nav-toggle.active span:nth-child(1){transform:rotate(45deg) translate(5px,5px)}
.nav-toggle.active span:nth-child(2){opacity:0}
.nav-toggle.active span:nth-child(3){transform:rotate(-45deg) translate(5px,-5px)}

/* === Content === */
.entry-content{margin-top:10px}
.entry-content p{margin-bottom:1em}
.entry-content h1{font-size:2em;font-weight:700;color:#1a1a1a;margin-bottom:15px;line-height:1.3}
.entry-content h2{font-size:1.5em;font-weight:600;color:#1a1a1a;margin:40px 0 20px;line-height:1.3}
.entry-content h3{font-size:1.2em;font-weight:600;color:#333;margin:30px 0 15px;line-height:1.4}
.entry-content ul,.entry-content ol{margin-bottom:1em}
.entry-content li{margin-bottom:.4em}
.entry-content blockquote{border-left:4px solid #0d6eaa;padding:15px 20px;margin:20px 0;background:#f9f9f9;font-style:italic}
.entry-content hr{border:0;border-top:1px solid #eee;margin:30px 0}

/* === Cards grid (homepage) === */
.entry-content div[style*="flex-wrap"]{display:flex!important;flex-wrap:wrap!important;gap:20px!important;justify-content:center!important}
.entry-content div[style*="flex: 1 1 280px"]{
    flex:1 1 280px!important;max-width:350px!important;
    border-radius:8px!important;transition:transform .2s,box-shadow .2s;
}
.entry-content div[style*="flex: 1 1 280px"]:hover{transform:translateY(-3px);box-shadow:0 4px 15px rgba(0,0,0,.1)}

/* === Tables === */
.entry-content table{width:100%;border-collapse:collapse;margin:25px 0;font-size:.95em}
.entry-content table th{background:#0d6eaa;color:#fff;padding:12px 15px;text-align:left;font-weight:600}
.entry-content table td{padding:10px 15px;border-bottom:1px solid #eee}
.entry-content table tr:nth-child(even) td{background:#f8f9fa}
.table-wrap{overflow-x:auto;-webkit-overflow-scrolling:touch}

/* === Images === */
.entry-content img{border-radius:6px;margin:15px 0}
.wp-caption{max-width:100%}
.wp-caption-text{font-size:.85em;color:#777;margin-top:5px;text-align:center}

/* === Forms (WPForms compat) === */
.wpforms-container .wpforms-field{margin-bottom:15px}
.wpforms-container input[type="text"],
.wpforms-container input[type="email"],
.wpforms-container select,
.wpforms-container textarea{
    width:100%;padding:10px 14px;border:1px solid #ddd;border-radius:5px;
    font-size:16px;font-family:inherit;transition:border-color .2s;
}
.wpforms-container input:focus,
.wpforms-container select:focus,
.wpforms-container textarea:focus{border-color:#0d6eaa;outline:none}
.wpforms-container .wpforms-submit{
    background:#0d6eaa;color:#fff;border:none;padding:12px 30px;
    font-size:16px;border-radius:5px;cursor:pointer;font-weight:500;transition:background .2s;
}
.wpforms-container .wpforms-submit:hover{background:#095a8c}

/* === Page title === */
.page-title{font-size:2em;font-weight:700;color:#1a1a1a;margin-bottom:20px}
.post-meta{font-size:.9em;color:#777;margin-bottom:25px}
.post-meta a{color:#0d6eaa}

/* === Blog listing === */
.post-card{border-bottom:1px solid #eee;padding:25px 0}
.post-card:last-child{border-bottom:none}
.post-card h2{font-size:1.4em;margin:0 0 8px}
.post-card h2 a{color:#1a1a1a;text-decoration:none}
.post-card h2 a:hover{color:#0d6eaa}
.post-card .excerpt{color:#555;margin:8px 0 12px}
.post-card .read-more{font-weight:500;font-size:.95em}

/* === Pagination === */
.pagination{display:flex;justify-content:center;gap:8px;margin:40px 0 20px}
.pagination a,.pagination span{padding:8px 14px;border:1px solid #ddd;border-radius:4px;font-size:.95em}
.pagination .current{background:#0d6eaa;color:#fff;border-color:#0d6eaa}
.pagination a:hover{background:#f5f5f5;text-decoration:none}

/* === Footer === */
.site-footer{background:#fafafa;border-top:1px solid #eee;padding:25px 0;margin-top:40px;text-align:center;font-size:.9em;color:#777}
.site-footer a{color:#555;text-decoration:none}
.site-footer a:hover{color:#0d6eaa;text-decoration:underline}

/* === Back to top === */
.back-to-top{
    position:fixed;bottom:20px;right:20px;width:40px;height:40px;
    background:#0d6eaa;color:#fff;border:none;border-radius:50%;
    font-size:20px;cursor:pointer;opacity:0;visibility:hidden;
    transition:opacity .3s,visibility .3s;display:flex;align-items:center;justify-content:center;
    text-decoration:none;z-index:90;
}
.back-to-top.visible{opacity:1;visibility:visible}

/* === 404 === */
.page-404{text-align:center;padding:80px 20px}
.page-404 h1{font-size:4em;color:#ddd;margin-bottom:10px}
.page-404 p{font-size:1.1em;color:#666}

/* === Hero Image === */
.hero-image{width:100vw;position:relative;left:50%;right:50%;margin-left:-50vw;margin-right:-50vw;margin-top:-40px;overflow:hidden}
.hero-image img{width:100%;height:650px;object-fit:cover;object-position:center 65%;display:block}
@media(max-width:768px){.hero-image img{height:250px}}

/* === Hide homepage title === */
body.home .page-title{display:none}

/* === Responsive: Tablet === */
@media(max-width:1024px){
    .header-inner{padding:10px 20px}
    .main-nav a{padding:8px 12px;font-size:14px}
    .site-container{padding:0 20px}
}

/* === Responsive: Mobile === */
@media(max-width:768px){
    .nav-toggle{display:block}
    .main-nav{
        display:none;position:absolute;top:100%;left:0;right:0;
        background:#fff;border-bottom:1px solid #eee;box-shadow:0 4px 12px rgba(0,0,0,.08);
    }
    .main-nav.open{display:block}
    .main-nav ul{flex-direction:column;padding:10px 0}
    .main-nav a{padding:12px 30px;border-radius:0}
    .main-nav a:hover{background:#f5f5f5}
    .site-container{padding:0 15px}
    .page-content{padding:25px 0 40px}
    .entry-content h1{font-size:1.6em}
    .entry-content h2{font-size:1.3em;margin-top:30px}
    .entry-content h3{font-size:1.1em}
    .entry-content div[style*="flex: 1 1 280px"]{flex:1 1 100%!important;max-width:100%!important}
    .page-title{font-size:1.6em}
    .single .site-container{padding:0 15px}
}