/* styles.css — « La Bibliothèque », variante Bleu pétrole */

:root{
  --bg:#efe7d8;
  --paper:#f7f2e6;
  --ink:#1e2420;
  --accent:#1f4b52;
  --accent2:#7a4a2b;
  --muted:#6f6a58;
  --line:#cfc3a8;
  --font-head:'Spectral', Georgia, serif;
  --font-body:'IBM Plex Sans', system-ui, sans-serif;
  --font-mono:'IBM Plex Mono', monospace;
}

*{box-sizing:border-box;}

body{
  margin:0;
  background:var(--bg);
  color:var(--ink);
  font-family:var(--font-body);
  line-height:1.65;
  min-height:100vh;
  display:flex;
  flex-direction:column;
}

a{color:var(--accent);}

.wrap{max-width:760px;margin:0 auto;padding:0 1.5rem;width:100%;}

/* --- header --- */
header.site-header{border-bottom:1px solid var(--line);padding:1.2rem 0;}
header.site-header .wrap{
  display:flex;flex-wrap:wrap;gap:1rem 2rem;
  align-items:baseline;justify-content:space-between;
}
.brand{
  font-family:var(--font-head);font-weight:600;font-size:1.15rem;
  color:var(--ink);text-decoration:none;letter-spacing:.01em;
}
nav.site-nav{display:flex;gap:0;flex-wrap:wrap;}
nav.site-nav a{
  font-family:var(--font-mono);font-size:.72rem;letter-spacing:.06em;
  text-transform:uppercase;color:var(--muted);text-decoration:none;
  padding:.3rem .7rem;border-bottom:2px solid transparent;
}
nav.site-nav a:hover, nav.site-nav a.active{color:var(--accent);border-bottom-color:var(--accent);}

/* --- main --- */
main{flex:1;padding:2.6rem 0 3rem;}

h1.page-title{font-family:var(--font-head);font-weight:600;font-size:1.7rem;margin:0 0 1.4rem;}

main p{max-width:62ch;}

.home-links{list-style:none;margin:1.5rem 0 0;padding:0;}
.home-links li{margin-bottom:.5rem;}
.home-links a{
  font-family:var(--font-mono);font-size:.85rem;letter-spacing:.04em;
  text-transform:uppercase;text-decoration:none;
}
.home-links a::before{content:"→ ";}

/* --- barre de tags (filtre cliquable) --- */
.tagbar{display:flex;flex-wrap:wrap;gap:.45rem;margin:0 0 1.6rem;}
.tagbar a{
  font-family:var(--font-mono);font-size:.68rem;text-transform:uppercase;
  letter-spacing:.03em;text-decoration:none;padding:.25rem .6rem;
  background:var(--paper);border:1px solid var(--line);color:var(--muted);
}
.tagbar a.active{background:var(--accent);color:var(--paper);border-color:var(--accent);}

/* --- tags en lecture seule (page d'un écrit) --- */
.tag-pill{
  font-family:var(--font-mono);font-size:.68rem;text-transform:uppercase;
  letter-spacing:.03em;padding:.2rem .55rem;background:var(--accent);
  color:var(--paper);margin:0 .3rem .3rem 0;display:inline-block;
}

/* --- liste des écrits --- */
.ecrit-item{padding-bottom:1.2rem;margin-bottom:1.2rem;border-bottom:1px dashed var(--line);}
.ecrit-item .call{font-family:var(--font-mono);font-size:.68rem;color:var(--accent2);}
.ecrit-item .titre{
  display:block;font-family:var(--font-head);font-weight:600;font-size:1.1rem;
  color:var(--ink);text-decoration:none;margin:.2rem 0 .3rem;
}
.ecrit-item .titre:hover{color:var(--accent);}
.ecrit-item .meta{font-family:var(--font-mono);font-size:.68rem;color:var(--muted);margin-bottom:.4rem;}
.ecrit-item .extrait{margin:0;}
.ecrit-vide{color:var(--muted);font-style:italic;}

/* --- un écrit complet --- */
.ecrit-full .titre{font-family:var(--font-head);font-weight:600;font-size:1.7rem;margin:0 0 .3rem;}
.ecrit-full .meta{font-family:var(--font-mono);font-size:.72rem;color:var(--muted);margin-bottom:.6rem;}
.ecrit-full .tags{margin-bottom:1.6rem;}
.ecrit-full .contenu :where(p, h2, h3){margin:0 0 1rem;}
.ecrit-full .contenu h2{font-family:var(--font-head);font-size:1.25rem;}

/* --- lectures (aucun lien) --- */
.lecture-item{display:flex;gap:.9rem;padding:.7rem 0;border-bottom:1px dashed var(--line);align-items:flex-start;}
.lecture-item .call{font-family:var(--font-mono);font-size:.68rem;color:var(--accent2);}
.lecture-item .titre{font-family:var(--font-head);font-weight:600;font-size:1rem;}
.lecture-item .auteur{font-family:var(--font-mono);font-size:.7rem;color:var(--muted);}
.lecture-item .avis{margin:.3rem 0 0;font-style:italic;}
.lecture-item .lecture-body{flex:1;min-width:0;}
.lecture-item .cover{
  flex:0 0 56px;width:56px;height:84px;object-fit:cover;
  border:1px solid var(--line);background:var(--paper);
}
.lecture-item .cover-fallback{
  display:flex;align-items:center;justify-content:center;
  background:var(--accent);
}
.lecture-item .cover-fallback span{font-family:var(--font-head);font-weight:600;font-size:1.15rem;color:var(--paper);}

/* --- média (vidéos, articles, posts) --- */
.badge{
  font-family:var(--font-mono);font-size:.62rem;text-transform:uppercase;letter-spacing:.04em;
  padding:.15rem .45rem;display:inline-block;
}
.badge-video{background:var(--accent);color:var(--paper);}
.badge-article{background:var(--accent2);color:var(--paper);}
.badge-post{background:transparent;color:var(--muted);border:1px solid var(--line);}

.media-item{padding:.9rem 0;border-bottom:1px dashed var(--line);}
.media-item .meta-row{display:flex;align-items:center;gap:.5rem;margin-bottom:.25rem;}
.media-item .date{font-family:var(--font-mono);font-size:.68rem;color:var(--accent2);}
.media-item .media-link{color:var(--ink);text-decoration:none;}
.media-item .media-link:hover{color:var(--accent);}
.media-item .titre{font-family:var(--font-head);font-weight:600;font-size:1.05rem;display:block;margin:.1rem 0 .3rem;}
.media-item .resume{margin:0;max-width:58ch;}

/* --- fiche (à propos) --- */
.eyebrow{
  font-family:var(--font-mono);font-size:.65rem;text-transform:uppercase;
  letter-spacing:.08em;color:var(--accent2);margin:0 0 .8rem;
}
.fiche{border-top:1px solid var(--line);margin-top:1.2rem;}
.fiche .frow{display:flex;gap:.8rem;padding:.55rem 0;border-bottom:1px dashed var(--line);font-size:.9rem;}
.fiche .flabel{
  font-family:var(--font-mono);font-size:.68rem;text-transform:uppercase;
  letter-spacing:.05em;color:var(--accent);flex:0 0 100px;
}

/* --- formulaires (admin, login) --- */
.form-group{margin-bottom:1.2rem;}
.form-group label{
  display:block;font-family:var(--font-mono);font-size:.75rem;text-transform:uppercase;
  letter-spacing:.04em;color:var(--muted);margin-bottom:.35rem;
}
.form-group input[type="text"],
.form-group input[type="password"],
.form-group input[type="date"],
.form-group textarea{
  width:100%;padding:.65rem .7rem;background:var(--paper);border:1px solid var(--line);
  color:var(--ink);font-family:var(--font-body);font-size:.95rem;
}
.form-group textarea{min-height:220px;resize:vertical;}
.editor-toolbar{display:flex;gap:.35rem;margin-bottom:.4rem;}
.editor-btn{
  font-family:var(--font-mono);font-size:.72rem;text-transform:uppercase;
  background:var(--paper);border:1px solid var(--line);color:var(--muted);
  padding:.3rem .6rem;cursor:pointer;
}
.editor-btn:hover{color:var(--accent);border-color:var(--accent);}
.checkbox-row{display:flex;flex-wrap:wrap;gap:.6rem 1.2rem;}
.checkbox-row label{
  display:flex;align-items:center;gap:.4rem;font-family:var(--font-body);
  font-size:.85rem;text-transform:none;letter-spacing:0;color:var(--ink);
}
.btn{
  font-family:var(--font-mono);font-size:.78rem;text-transform:uppercase;letter-spacing:.05em;
  background:var(--accent);color:var(--paper);border:none;padding:.65rem 1.2rem;cursor:pointer;
}
.btn:hover{background:#173a40;}
.btn-danger{background:var(--accent2);}
.btn-danger:hover{background:#623a22;}
.msg-error{background:#f3e0da;border-left:3px solid var(--accent2);padding:.8rem 1rem;margin-bottom:1.2rem;color:#5a2c1a;}
.msg-ok{background:#e2e8de;border-left:3px solid var(--accent);padding:.8rem 1rem;margin-bottom:1.2rem;color:var(--accent);}

.admin-list{margin-top:1rem;}
.admin-list .row{
  display:flex;justify-content:space-between;align-items:center;gap:1rem;
  padding:.6rem 0;border-bottom:1px dashed var(--line);font-size:.88rem;
}
.admin-list .row .actions{display:flex;gap:.6rem;align-items:center;font-family:var(--font-mono);font-size:.72rem;text-transform:uppercase;}

/* --- footer --- */
footer.site-footer{
  border-top:1px solid var(--line);padding:1.2rem 0;
  font-family:var(--font-mono);font-size:.72rem;color:var(--muted);
}

@media (max-width:600px){
  header.site-header .wrap{flex-direction:column;align-items:flex-start;}
}