/* =========================================================
   JT SERVICE — Styles de l'espace admin
   Réutilise les variables définies dans style.css
   ========================================================= */

body.admin-body{
  background:var(--paper);
  min-height:100vh;
}

.admin-header{
  display:flex; align-items:center; justify-content:space-between;
  padding:16px 28px; background:var(--navy-deep); color:var(--white);
}
.admin-header .brand img{ height:34px; }
.admin-header .brand-name{ font-family:var(--font-display); font-weight:700; font-size:.98rem; }
.admin-header .brand-tag{ font-family:var(--font-mono); font-size:.62rem; color:rgba(255,255,255,.55); letter-spacing:.06em; text-transform:uppercase; }

.admin-wrap{ max-width:1000px; margin:0 auto; padding:40px 24px 80px; }

/* ---------- Écran de connexion ---------- */
.login-screen{
  min-height:100vh; display:flex; align-items:center; justify-content:center;
  padding:24px;
}
.login-card{
  width:100%; max-width:380px; background:var(--white);
  border:1px solid var(--line); border-radius:var(--radius-l);
  padding:2.4rem 2.2rem; text-align:center;
}
.login-card img{ height:44px; margin:0 auto 1.4rem; }
.login-card h1{ font-size:1.3rem; margin-bottom:.3em; }
.login-card p{ font-size:.88rem; margin-bottom:1.6rem; }
.login-card .field{ text-align:left; }
.login-card .btn{ width:100%; justify-content:center; margin-top:.4rem; }
.login-error{
  display:none; background:#FBEAEA; color:#B23A3A; font-size:.84rem;
  padding:.8em 1em; border-radius:var(--radius-s); margin-bottom:1.2rem; text-align:left;
}
.login-error.show{ display:block; }

/* ---------- Tableau de bord ---------- */
.admin-section{
  background:var(--white); border:1px solid var(--line); border-radius:var(--radius-l);
  padding:1.8rem 2rem; margin-bottom:2rem;
}
.admin-section h2{ font-size:1.15rem; margin-bottom:1.2rem; }
.admin-form .form-row{ display:grid; grid-template-columns:1fr 1fr; gap:1rem; }
.admin-form .field{ margin-bottom:1rem; }
.admin-form label{ display:block; font-family:var(--font-mono); font-size:.7rem; letter-spacing:.05em; text-transform:uppercase; color:var(--slate); margin-bottom:.4em; }
.admin-form input, .admin-form select, .admin-form textarea{
  width:100%; padding:.75em .9em; border:1px solid var(--line); border-radius:var(--radius-s);
  background:var(--paper); font-family:inherit; font-size:.92rem;
}
.admin-form textarea{ min-height:90px; resize:vertical; }
.admin-form .checkbox-row{ display:flex; align-items:center; gap:.6em; font-size:.9rem; margin:1rem 0 1.4rem; }
.admin-form .checkbox-row input{ width:auto; }
.admin-form-actions{ display:flex; gap:.8rem; align-items:center; }
.admin-form-actions .btn-cancel{
  background:none; border:1px solid var(--line); color:var(--slate);
  padding:.9em 1.4em; border-radius:999px; font-size:.9rem; display:none;
}
.form-msg{ font-size:.85rem; margin-top:.9rem; display:none; }
.form-msg.show{ display:block; }
.form-msg.ok{ color:#1F7A3F; }
.form-msg.err{ color:#B23A3A; }
.current-image-preview{ display:none; align-items:center; gap:.8rem; margin-bottom:1rem; font-size:.82rem; color:var(--slate); }
.current-image-preview.show{ display:flex; }
.current-image-preview img{ width:56px; height:56px; object-fit:cover; border-radius:8px; border:1px solid var(--line); }

/* ---------- Liste des réalisations ---------- */
.admin-list{ display:flex; flex-direction:column; gap:.9rem; }
.admin-row{
  display:flex; align-items:center; gap:1rem;
  border:1px solid var(--line); border-radius:var(--radius-m); padding:.8rem 1rem;
}
.admin-row .thumb{
  width:64px; height:48px; border-radius:8px; overflow:hidden; flex:none;
  background:var(--navy-deep); display:flex; align-items:center; justify-content:center;
}
.admin-row .thumb img{ width:100%; height:100%; object-fit:cover; display:block; }
.admin-row .thumb span{ font-family:var(--font-mono); font-size:.6rem; color:rgba(255,255,255,.5); }
.admin-row .meta{ flex:1; min-width:0; }
.admin-row .meta h4{ font-family:var(--font-display); font-size:.96rem; margin:0 0 .2em; }
.admin-row .meta .tags{ font-family:var(--font-mono); font-size:.72rem; color:var(--slate-light); display:flex; gap:.6em; flex-wrap:wrap; }
.status-pill{
  font-family:var(--font-mono); font-size:.65rem; letter-spacing:.03em; text-transform:uppercase;
  padding:.25em .6em; border-radius:999px;
}
.status-pill.published{ background:#EAF6EE; color:#1F7A3F; }
.status-pill.draft{ background:var(--paper-dim); color:var(--slate); }
.admin-row .row-actions{ display:flex; gap:.5rem; flex:none; }
.row-actions button{
  font-family:var(--font-mono); font-size:.72rem; padding:.5em .8em;
  border-radius:8px; border:1px solid var(--line); background:var(--white); color:var(--navy-ink);
}
.row-actions button:hover{ border-color:var(--navy-ink); }
.row-actions .btn-delete:hover{ border-color:#B23A3A; color:#B23A3A; }

.admin-empty{ color:var(--slate-light); font-family:var(--font-mono); font-size:.85rem; text-align:center; padding:2rem 0; }
.admin-logout{
  background:none; border:1px solid var(--line-light); color:var(--white);
  padding:.5em 1.1em; border-radius:999px; font-family:var(--font-mono); font-size:.78rem;
}

.config-warning{
  background:#FFF6E0; border:1px solid #E8CE8C; color:#7A5A12;
  padding:1.2rem 1.4rem; border-radius:var(--radius-m); font-size:.88rem; margin-bottom:2rem;
}
.config-warning code{ background:rgba(0,0,0,.06); padding:.1em .4em; border-radius:4px; }

@media (max-width:620px){
  .admin-form .form-row{ grid-template-columns:1fr; }
  .admin-row{ flex-wrap:wrap; }
  .admin-row .row-actions{ width:100%; justify-content:flex-end; }
}