/* =====================================================================
   calendar.css — Vue annuelle (compacte, aperçu du volume) +
   mois en détail (fil d'aperçus : photo + texte complet, sans clic).
   ===================================================================== */

/* ---------- Vue annuelle : mini-calendriers ultra-compacts ----------
   - pas de jours de semaine, marges minimales
   - le NUMÉRO du jour est entouré/coloré quand il y a une publication
   - un compteur par mois donne le volume d'un coup d'œil */
.year-grid{
  display:grid; gap:8px;
  grid-template-columns:repeat(3,1fr);              /* petit mobile : 3 */
}
@media(min-width:430px){ .year-grid{ grid-template-columns:repeat(4,1fr); } }
@media(min-width:720px){ .year-grid{ grid-template-columns:repeat(6,1fr); } } /* 2 lignes de 6 */

.mini{
  background:var(--surface); border:1px solid var(--line); border-radius:9px;
  padding:5px 5px 4px; box-shadow:var(--shadow-1);
  cursor:pointer;                       /* cliquer = aller au mois (pas d'accès aux posts) */
}
.mini:active{ transform:scale(.98); }
.mini__day{ pointer-events:none; }      /* les jours ne sont pas cliquables individuellement */
.mini.is-current{ border-color:var(--primary); box-shadow:0 0 0 1.5px var(--primary-soft); }
.mini__title{
  display:flex; align-items:center; justify-content:space-between; gap:4px;
  font-size:10.5px; font-weight:700; text-transform:capitalize; margin-bottom:3px;
}
.mini__count{
  flex:none; font-size:9px; font-weight:800; color:#fff; background:var(--primary);
  min-width:15px; height:15px; padding:0 4px; border-radius:999px;
  display:inline-grid; place-items:center;
}
.mini__grid{ display:grid; grid-template-columns:repeat(7,1fr); gap:1px; }
.mini__day{
  font-size:9px; line-height:1; aspect-ratio:1/1; display:grid; place-items:center;
  color:var(--muted); border-radius:50%;
}
.mini__day.is-out{ visibility:hidden; }
.mini__day.has-posts{ color:#fff; font-weight:800; text-shadow:0 1px 1px rgba(0,0,0,.22); }
.mini__day.is-today{ outline:1.5px solid var(--primary); outline-offset:-1.5px; }
.mini__day.is-today:not(.has-posts){ color:var(--primary); font-weight:800; }

/* ---------- Mois en détail : fil d'aperçus ---------- */
.month-list{ display:flex; flex-direction:column; gap:24px; }
@media(min-width:860px){ .month-list{ max-width:820px; margin-left:auto; margin-right:auto; } }

.month__head{ display:flex; align-items:baseline; justify-content:space-between; gap:10px; margin-bottom:10px; }
.month__name{ font-size:16px; font-weight:800; text-transform:capitalize; display:flex; align-items:center; gap:8px; }
.month__count{ font-size:12px; color:var(--muted); }

/* Mois passés : cachés par défaut, révélés en cliquant un mini-calendrier passé.
   Légèrement estompés + petite étiquette « passé » pour les distinguer. */
.month--past{ opacity:.72; }
.month__past-tag{
  font-size:10px; font-weight:800; text-transform:uppercase; letter-spacing:.04em;
  color:var(--muted); background:var(--line); border-radius:999px; padding:2px 8px;
}

.agenda{ display:flex; flex-direction:column; gap:10px; }

/* Une publication = un aperçu complet (photo + texte), non uniforme */
.pcard{
  position:relative; display:flex; gap:12px;
  background:var(--surface); border:1px solid var(--line);
  border-left:4px solid var(--c, #ccc); border-radius:14px;
  padding:10px; box-shadow:var(--shadow-1); cursor:pointer;
}
.pcard:active{ transform:scale(.995); }
.pcard--ro{ cursor:default; }                 /* carte en consultation (lecture seule) */
.pcard--ro:active{ transform:none; }
.pcard__img{ width:104px; height:104px; flex:none; border-radius:10px; object-fit:cover; background:var(--bg); }
.pcard__imgwrap{ position:relative; flex:none; align-self:flex-start; }
.pcard__count{ position:absolute; right:6px; bottom:6px; background:rgba(18,22,33,.72); color:#fff; font-size:11px; font-weight:800; padding:2px 7px; border-radius:999px; pointer-events:none; }
.pcard__body{ flex:1; min-width:0; }
.pcard__chips{ display:flex; gap:6px; align-items:center; flex-wrap:wrap; margin-bottom:6px; padding-right:38px; }
.pcard__date{ font-size:12px; font-weight:800; color:var(--ink); }
.pcard__pub{ font-size:11px; font-weight:700; color:var(--ok); }
.pcard__warn{ font-size:11px; font-weight:800; color:var(--wait); background:var(--wait-bg); border-radius:999px; padding:2px 8px; }
.pcard__valid{ font-size:11px; font-weight:800; color:var(--ok); background:var(--ok-bg); border:1px solid var(--ok-line); border-radius:999px; padding:2px 6px 2px 8px; display:inline-flex; align-items:center; gap:5px; }
.pcard__valid-x{ border:none; background:transparent; cursor:pointer; padding:0; margin:0; color:var(--danger); font-weight:900; font-size:12px; line-height:1; width:18px; height:18px; display:inline-grid; place-items:center; border-radius:50%; }
.pcard__valid-x:hover{ background:rgba(192,57,43,.14); }
.pcard__valid-x:active{ transform:scale(.9); }
.pcard__tovalid{ font-size:11px; font-weight:800; color:var(--wait); background:var(--wait-bg); border:1px solid var(--wait-line); border-radius:999px; padding:2px 8px; }
.pcard__await{ margin-top:10px; font-size:12.5px; font-weight:700; color:var(--wait); background:var(--wait-bg); border:1px dashed var(--wait-line); border-radius:10px; padding:8px 10px; text-align:center; }
.pcard__await--refused{ color:var(--danger-dark); background:var(--danger-bg); border-color:var(--danger-line); }
/* Pastille « ❌ Refusé » + petit bouton ⓘ (voir la raison) */
.pcard__refused{ font-size:11px; font-weight:800; color:var(--danger-dark); background:var(--danger-bg); border:1px solid var(--danger-line); border-radius:999px; padding:2px 6px 2px 8px; display:inline-flex; align-items:center; gap:5px; }
.pcard__refused-i{ border:none; background:transparent; cursor:pointer; padding:0; margin:0; color:var(--danger-dark); font-weight:900; font-size:12px; line-height:1; width:18px; height:18px; display:inline-grid; place-items:center; border-radius:50%; }
.pcard__refused-i:hover{ background:rgba(192,57,43,.14); }
.pcard__refused-i:active{ transform:scale(.9); }
/* Bloc d'affichage de la raison du refus (lecture seule) */
.refusal-reason{ white-space:pre-wrap; background:var(--bg); border:1px solid var(--line); border-radius:10px; padding:12px; font-size:14px; line-height:1.5; color:var(--ink); }
/* Raison du refus affichée en rouge directement sous le texte de l'article (carte) */
.pcard__refusal-reason{ margin-top:6px; font-size:12.5px; line-height:1.45; color:var(--danger-dark); white-space:pre-wrap; }
.pcard__refusal-reason__lbl{ font-weight:800; }

/* Pastille « en attente de validation » dans le header (gauche du 🔒), pour les NON valideurs */
.hdr-pending{
  display:inline-flex; align-items:center; gap:5px; height:var(--tap); padding:0 10px;
  border-radius:12px; border:1px solid var(--wait-line); background:var(--wait-bg); color:var(--wait);
  font-size:12.5px; font-weight:800; white-space:nowrap;
}
.hdr-pending[hidden]{ display:none; }   /* sinon la classe écrase l'attribut hidden */
.hdr-pending b{ font-size:14px; }
@media (max-width:520px){ .hdr-pending__lbl{ display:none; } }   /* mobile : « 🕓 3 » seul */

/* Panneau Notifications : résumé (lignes cliquables) → liste de cartes (style « mois en détail ») */
.notif-head{ font-size:14px; font-weight:800; color:var(--ink); margin-bottom:12px; }
.notif-list{ display:flex; flex-direction:column; gap:10px; }
.notif-row{
  width:100%; display:flex; align-items:center; gap:10px; padding:14px; margin-bottom:10px;
  border:1px solid var(--line); border-radius:12px; background:var(--surface); cursor:pointer;
  text-align:left; font-size:14px; font-weight:700; color:var(--ink);
}
.notif-row:active{ transform:scale(.99); }
.notif-row.is-empty{ opacity:.55; cursor:default; }
.notif-row__ico{ font-size:20px; flex:none; }
.notif-row__txt{ flex:1; min-width:0; }
.notif-row__chev{ font-size:22px; color:var(--muted); flex:none; }
.notif-back{ border:none; background:transparent; color:var(--primary); font-weight:700; font-size:13.5px; cursor:pointer; padding:0 0 10px; }

/* Éditeur : ligne de label avec outils (emoji / règles) + barre d'emojis */
.field__labelrow{ display:flex; align-items:center; justify-content:space-between; gap:8px; margin-bottom:6px; }
.field__tools{ display:flex; align-items:center; gap:8px; flex-wrap:wrap; }
.minibtn{
  font-size:12.5px; font-weight:700; color:var(--primary); background:transparent;
  border:1px solid var(--line); border-radius:999px; padding:4px 10px; cursor:pointer;
  text-decoration:none; display:inline-flex; align-items:center; gap:4px; white-space:nowrap;
}
.minibtn:active{ transform:scale(.97); }
.emojibar{
  display:flex; flex-wrap:wrap; gap:4px; margin-bottom:8px; padding:8px;
  border:1px solid var(--line); border-radius:10px; background:var(--surface);
}
.emojibar__btn{
  font-size:20px; line-height:1; width:34px; height:34px; border:none; background:transparent;
  cursor:pointer; border-radius:8px; padding:0;
}
.emojibar__btn:active{ transform:scale(.9); }

/* Bouton de validation (rôle valideur) */
.valbtn{
  flex:1; min-height:40px; border:none; border-radius:10px; color:#fff;
  font-weight:800; font-size:13px; cursor:pointer; padding:0 12px;
  display:flex; align-items:center; justify-content:center; gap:6px; background:var(--primary);
}
.valbtn:active{ transform:scale(.98); }
.valbtn[disabled]{ opacity:.6; cursor:default; }
.valbtn--off{ background:#fff; color:var(--primary); border:1px solid var(--primary-soft); }
.valbtn--refuse{ background:#fff; color:var(--danger); border:1px solid var(--danger-line); }

/* Bouton de publication (utilisé aussi par la validation : .pcard__publish = conteneur flex) */
.pcard__publish{ display:flex; gap:8px; margin-top:10px; }
.pubbtn{
  flex:1; min-height:40px; border:none; border-radius:10px; color:#fff;
  font-weight:800; font-size:13px; cursor:pointer; padding:0 10px;
  display:flex; align-items:center; justify-content:center; gap:6px;
}
.pubbtn:active{ transform:scale(.98); }
.pubbtn[disabled]{ opacity:.6; cursor:default; }

/* Zone publication : statut « Publié : [pictos] » + bouton UNIQUE */
.pcard__pubzone{ margin-top:10px; }
.pcard__pubstatus{ display:flex; align-items:center; gap:8px; flex-wrap:wrap; margin-bottom:8px; }
.pcard__publabel{ font-size:12.5px; font-weight:800; color:var(--ink); }
.pubbtn--all{ width:100%; background:linear-gradient(90deg,#1877F2 0%,#B5279B 60%,#F58529 100%); }

/* Picto par réseau : vert/✓ si OK, rouge/✗ si échec, gris si pas encore fait */
.pubpicto{ display:inline-flex; align-items:center; gap:3px; padding:3px 8px; border-radius:999px; background:#EEF0F3; color:#AEB4BE; }
.pubpicto__ico{ display:inline-grid; place-items:center; }
.pubpicto__ico svg{ width:15px; height:15px; display:block; }
.pubpicto__mark{ font-size:11px; font-weight:900; line-height:1; }
.pubpicto.is-ok.pubpicto--facebook{ background:#E7F0FE; color:#1877F2; }
.pubpicto.is-ok.pubpicto--instagram{ background:#FBE9F3; color:#C13584; }
.pubpicto.is-ok .pubpicto__mark{ color:var(--ok); }
.pubpicto.is-fail{ background:var(--danger-bg); color:var(--danger); }
.pubpicto.is-fail .pubpicto__mark{ color:var(--danger); }
.pubpicto.is-pending{ background:#EEF0F3; color:#AEB4BE; }
.pcard__text{ font-size:13px; line-height:1.5; white-space:pre-wrap; color:var(--ink); }
.pcard__move{
  position:absolute; top:8px; right:8px; width:32px; height:32px; border-radius:9px;
  border:1px solid var(--line); background:var(--surface); cursor:pointer;
  font-size:15px; display:grid; place-items:center;
}
.pcard__move:active{ transform:scale(.94); }
.pcard.flash{ animation:flash 1.4s ease; }
@keyframes flash{ 0%,100%{ box-shadow:var(--shadow-1); } 25%{ box-shadow:0 0 0 3px var(--primary-soft); } }

.month-empty{ text-align:center; color:var(--muted); font-size:13px; padding:14px; border:1px dashed var(--line-strong); border-radius:12px; }
.add-month{
  width:100%; margin-top:4px; height:46px; border-radius:12px; cursor:pointer;
  border:1px dashed var(--line-strong); background:transparent; color:var(--muted); font-weight:700; font-size:13.5px;
}
.add-month:active{ transform:scale(.99); }

@media(min-width:680px){
  .pcard__img{ width:140px; height:140px; }
  .pcard__text{ font-size:14px; }
}
