/* ====== Base ====== */
*{box-sizing:border-box}
html,body{margin:0;padding:0}
body{
  font-family: 'Montserrat', system-ui, -apple-system, Segoe UI, Roboto, sans-serif;
  background:#e0f2fe; color:#1f2937; line-height:1.6;
}
img{max-width:100%;height:auto;display:block}

/* ====== Containers ====== */
.container{max-width:1200px;margin:0 auto;padding:1rem}

/* ====== Buttons ====== */
.btn{background:#3b82f6;color:#fff;border:0;border-radius:.5rem;padding:.6rem 1rem;cursor:pointer;transition:.2s}
.btn:hover{background:#2563eb}
.btn-light{background:#dbeafe;color:#1f2937}
.btn-danger{background:#ef4444}
.btn-success{background:#22c55e;color:#fff}

/* ====== Cards / grids ====== */
.card{background:#fff;border:1px solid #dbeafe;border-radius:12px;box-shadow:0 8px 20px rgba(0,0,0,.06);padding:1rem}
.grid{display:grid;gap:1rem}
.grid-1{grid-template-columns:1fr}
.grid-2{grid-template-columns:repeat(2,1fr)}
.grid-3{grid-template-columns:repeat(3,1fr)}
@media (max-width:1024px){.grid-3{grid-template-columns:repeat(2,1fr)}}
@media (max-width:640px){.grid-2,.grid-3{grid-template-columns:1fr}}

/* ====== Navbar (desktop + mobile hamburger) ====== */
nav{
  background:#1d4ed8;
  color:#fff;
  position:sticky; top:0; z-index:1000;
}
.nav-inner{
  max-width:1200px;margin:0 auto;
  display:flex;align-items:center;justify-content:space-between;
  padding:.75rem 1rem
}
.brand{display:flex;align-items:center;gap:.6rem;color:#fff;text-decoration:none}
.brand img{height:42px;width:auto}
.brand span{font-weight:800;font-size:1.1rem;letter-spacing:.5px}

/* Menu desktop */
.menu{
  display:flex;
  gap:1rem;
  align-items:center;
}
.menu a{color:#fff;text-decoration:none;opacity:.95}
.menu a:hover{opacity:1;text-decoration:underline}

/* Bouton hamburger (mobile) */
.hamburger{display:none;background:transparent;border:0;cursor:pointer}
.hamburger svg{width:32px;height:32px;color:#fff}

/* Drawer gauche */
.drawer{
  position:fixed; inset:0 0 0 auto; width:min(80vw,320px);
  background:#fff; color:#111827;
  transform:translateX(-100%);
  transition:transform .25s ease;
  z-index:1001; padding:1rem;
  border-right:1px solid #bfdbfe;
}
.drawer.open{transform:translateX(0)}
.drawer a{display:block;padding:.75rem 0;color:#111827;text-decoration:none;border-bottom:1px solid #dbeafe}
.drawer a:hover{color:#1d4ed8}
.overlay{position:fixed;inset:0;background:rgba(0,0,0,.45);display:none;z-index:1000}
.overlay.show{display:block}

/* 📱 Mobile : cacher menu horizontal, montrer hamburger */
@media (max-width:900px){
  .menu{display:none;}
  .hamburger{display:block;}
}

/* 💻 Desktop : cacher drawer/hamburger */
@media (min-width:901px){
  .hamburger, .drawer, .overlay{display:none !important;}
}

/* ====== Forms ====== */
label{display:block;margin:.35rem 0 .25rem;font-weight:600}
input,select,textarea{
  width:100%;padding:.65rem .75rem;border:1px solid #e5e7eb;border-radius:.5rem;background:#fff
}
textarea{min-height:120px}

/* ====== Footer ====== */
footer{background:#dbeafe;margin-top:2rem}
.footer-grid{display:grid;gap:1.2rem;padding:1.25rem}
@media (min-width:768px){.footer-grid{grid-template-columns:repeat(3,1fr)}}
.footer-bottom{border-top:1px solid #bfdbfe;padding:1rem;text-align:center;color:#6b7280;font-size:.9rem}

/* ====== Helper ====== */
.center{text-align:center}
.mt-2{margin-top:.5rem}.mt-4{margin-top:1rem}.mt-6{margin-top:1.5rem}.mt-8{margin-top:2rem}
.mb-2{margin-bottom:.5rem}.mb-4{margin-bottom:1rem}.mb-6{margin-bottom:1.5rem}.mb-8{margin-bottom:2rem}
.flex{display:flex}.gap-1{gap:.25rem}.gap-2{gap:.5rem}.gap-3{gap:.75rem}.gap-4{gap:1rem}.items-center{align-items:center}.justify-center{justify-content:center}
.badge{display:inline-block;background:#dbeafe;color:#1e3a8a;border:1px solid #bfdbfe;border-radius:999px;padding:.15rem .6rem;font-size:.8rem;font-weight:700}
/* ====== Admin Page ====== */
.admin-layout { display:flex; min-height:100vh; }
.admin-menu {
  width:240px;
  background:#1d4ed8;
  color:#fff;
  padding:1rem;
  display:flex;
  flex-direction:column;
  gap:1rem;
}
.admin-menu button {
  background:#3b82f6;
  border:0;
  color:#fff;
  padding:.6rem;
  border-radius:6px;
  text-align:left;
  cursor:pointer;
}
.admin-menu button:hover { background:#2563eb; }
.admin-content {
  flex:1;
  background:#e0f2fe;
  padding:2rem;
  overflow-y:auto;
}
.admin-section { margin-bottom:2rem; }
textarea.admin-editor {
  width:100%;
  min-height:300px;
  border:1px solid #bfdbfe;
  border-radius:8px;
  padding:1rem;
  font-family:monospace;
}
.hidden { display:none; }
// === apply admin overrides from localStorage (client-side) ===
(function applyAdminOverrides(){
  try{
    const KEY_OVERRIDES = 'sd77_pages';
    const overrides = JSON.parse(localStorage.getItem(KEY_OVERRIDES) || '{}');
    const pageKey = document.body?.dataset?.page || null; // tes pages ont body data-page
    if(pageKey && overrides[pageKey]){
      const main = document.querySelector('main.container') || document.querySelector('main');
      if(main){
        main.innerHTML = overrides[pageKey];
        // Optional: re-run init functions if needed (reviews, maps...)
        if(typeof renderRecent === 'function') try{ renderRecent(); }catch(e){}
        if(typeof initReviewsPage === 'function') try{ initReviewsPage(); }catch(e){}
        if(typeof initAdmin === 'function') try{ initAdmin(); }catch(e){}
      }
    }
  }catch(e){ console.warn('admin override error', e); }
})();