@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@400;600;700&family=Open+Sans:wght@400;600&display=swap');

:root{
  --blue:#6EC1E4;
  --gold:#C9971E;
  --gold-dark:#9C7715;
  --cream:#FBF7EF;
  --ink:#242220;
  --gray:#5b5348;
  --footer:#4B4F55;
  --pink:#F2A0C6;
  --danger:#c0453a;
  --border:#e7e0d2;
}
*{ box-sizing:border-box; }
body{ margin:0; font-family:'Open Sans', Arial, sans-serif; background:var(--cream); color:var(--ink); }
h1,h2,h3{ font-family:'Poppins',sans-serif; margin:0; }
a{ color:inherit; }

.admin-topbar{ background:var(--footer); color:#fff; padding:14px 28px; display:flex; align-items:center; justify-content:space-between; }
.admin-topbar .brand{ display:flex; align-items:center; gap:10px; font-weight:700; }
.admin-topbar .brand img{ height:34px; }
.admin-topbar a.logout{ font-size:13px; color:#e7c9d8; text-decoration:underline; }

.admin-wrap{ max-width:1100px; margin:0 auto; padding:32px 24px; }

/* Favoris */
.fav-bar{ display:flex; align-items:center; flex-wrap:wrap; gap:10px; margin-bottom:34px; }
.fav-pill{ display:flex; align-items:center; gap:8px; background:#fff; border:1px solid var(--border); padding:8px 14px; border-radius:24px; font-size:13.5px; box-shadow:0 1px 4px rgba(0,0,0,0.04); }
.fav-pill a{ font-weight:600; }
.fav-pill .remove{ color:var(--danger); cursor:pointer; font-weight:700; opacity:0.6; }
.fav-pill .remove:hover{ opacity:1; }
.fav-add{ display:flex; align-items:center; justify-content:center; width:34px; height:34px; border-radius:50%; background:var(--gold); color:#fff; font-size:20px; font-weight:700; cursor:pointer; border:none; }
.fav-add:hover{ background:var(--gold-dark); }

.fav-form{ display:none; gap:8px; align-items:center; background:#fff; border:1px solid var(--border); padding:10px; border-radius:10px; margin-bottom:20px; }
.fav-form.open{ display:flex; }
.fav-form input{ padding:8px 10px; border:1px solid var(--border); border-radius:6px; font-size:13px; }
.fav-form button{ padding:8px 16px; border:none; border-radius:12px; background:var(--gold); color:#fff; font-weight:700; cursor:pointer; font-size:13px; }

/* Liste des pages */
.section-label{ font-size:12px; letter-spacing:1px; text-transform:uppercase; color:var(--gray); font-weight:700; margin:10px 0 14px; }
.page-list{ display:grid; grid-template-columns:repeat(auto-fill, minmax(220px,1fr)); gap:16px; }
.page-card{ background:#fff; border:1px solid var(--border); border-radius:10px; padding:20px; box-shadow:0 2px 10px rgba(40,30,10,0.05); transition:transform .1s; }
.page-card:hover{ transform:translateY(-2px); border-color:var(--gold); }
.page-card h3{ font-size:15px; margin-bottom:6px; }
.page-card span{ font-size:12px; color:var(--gray); }

/* Editeur de page */
.back-link{ display:inline-block; margin-bottom:18px; font-size:13.5px; color:var(--gray); }
.editor-title{ font-size:24px; margin-bottom:24px; }
.editor-section{ margin-bottom:38px; }
.field-grid{ display:grid; grid-template-columns:repeat(auto-fill, minmax(240px,1fr)); gap:18px; }

.image-field{ background:#fff; border:1px solid var(--border); border-radius:10px; padding:14px; }
.image-field img{ width:100%; height:130px; object-fit:cover; border-radius:6px; margin-bottom:10px; background:#eee; }
.image-field label{ font-size:12.5px; font-weight:700; display:block; margin-bottom:8px; }
.image-field input[type=file]{ font-size:12px; width:100%; }
.image-field .status{ font-size:11.5px; color:var(--gold-dark); margin-top:6px; min-height:14px; }

.link-field{ background:#fff; border:1px solid var(--border); border-radius:10px; padding:14px; }
.link-field label{ font-size:12.5px; font-weight:700; display:block; margin-bottom:8px; }
.link-field input[type=text]{ width:100%; padding:9px 10px; border:1px solid var(--border); border-radius:6px; font-size:13px; }
.link-field .status{ font-size:11.5px; color:var(--gold-dark); margin-top:6px; min-height:14px; }

.login-wrap{ max-width:380px; margin:90px auto; background:#fff; padding:36px; border-radius:12px; box-shadow:0 8px 30px rgba(0,0,0,0.08); }
.login-wrap h1{ font-size:22px; margin-bottom:22px; text-align:center; }
.login-wrap .field{ margin-bottom:16px; }
.login-wrap label{ font-size:12.5px; font-weight:700; display:block; margin-bottom:6px; }
.login-wrap input{ width:100%; padding:11px 12px; border:1px solid var(--border); border-radius:6px; font-size:14px; }
.login-wrap button{ width:100%; padding:12px; background:var(--gold); border:none; color:#fff; font-weight:700; border-radius:12px; margin-top:8px; cursor:pointer; }
.login-wrap .error{ background:#fbeaea; color:var(--danger); padding:10px 12px; border-radius:6px; font-size:13px; margin-bottom:16px; }
