/* Le cahier de doléances (/doleances/, /en/grievances/). */
.dol-wrap { max-width: 820px; padding-block: 34px 40px; }
.dol-wrap h1 { font-size: clamp(2rem, 4.6vw, 3rem); margin-bottom: 8px; }
.dol-wrap h1 em { color: var(--rouge); font-style: normal; }
.dol-intro { font-size: 1.02rem; color: var(--body); margin-bottom: 18px; }
.dol-meta { font-size: 0.82rem; color: var(--muted); margin-bottom: 6px; }
.dol-list { list-style: none; margin: 0; padding: 0; border-top: 1px solid var(--line); }
.dol-item { display: grid; grid-template-columns: 2rem 1fr auto; align-items: center; gap: 12px; padding: 12px 0; border-bottom: 1px solid var(--line); }
.dol-rank { font-weight: 800; color: var(--muted); font-variant-numeric: tabular-nums; text-align: center; }
.dol-text strong { display: block; font-size: 1rem; color: var(--ink); }
.dol-text span { display: block; font-size: 0.84rem; color: var(--muted); line-height: 1.4; }
.dol-vote { display: grid; grid-template-columns: auto auto; grid-template-rows: auto auto; column-gap: 7px; align-items: center; min-width: 118px; padding: 8px 12px; border: 1px solid var(--line); border-radius: 10px; background: #fff; font: inherit; cursor: pointer; text-align: left; }
.dol-vote:hover { border-color: var(--rouge); }
.dol-vote:focus-visible { outline: 2px solid var(--focus); outline-offset: 2px; }
.dol-arrow { grid-row: 1 / 3; font-size: 1rem; color: var(--rouge); }
.dol-count { font-weight: 800; font-size: 0.92rem; color: var(--ink); }
.dol-label { font-size: 0.72rem; color: var(--muted); }
.dol-item.is-voted .dol-vote { background: var(--rouge); border-color: var(--rouge); }
.dol-item.is-voted .dol-arrow, .dol-item.is-voted .dol-count, .dol-item.is-voted .dol-label { color: #fff; }
.dol-state { padding: 18px 0; color: var(--muted); }
.dol-rule { margin-top: 10px; font-size: 0.8rem; }
.dol-propose { margin-top: 28px; }
.dol-propose h2 { font-size: 1.3rem; margin-bottom: 10px; }
.dol-propose form { padding: 18px; display: grid; gap: 6px; }
.dol-propose input, .dol-propose textarea { width: 100%; }
.dol-propose textarea { min-height: 70px; }
.dol-actions { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 6px; }
.btn-ghost { min-height: 44px; padding: 10px 16px; border-radius: 8px; border: 1px solid var(--bleu); background: #fff; color: var(--bleu); font: inherit; font-weight: 650; cursor: pointer; }
/* Phones: text left, a compact ▲/count button right (label hidden). */
@media (max-width: 560px) {
  .dol-item { grid-template-columns: 1.1rem 1fr 58px; gap: 10px; padding: 11px 0; }
  .dol-rank { font-size: 0.8rem; }
  .dol-text strong { font-size: 0.95rem; }
  .dol-text span { font-size: 0.8rem; }
  .dol-vote { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 1px; min-width: 0; width: 58px; min-height: 56px; padding: 6px 4px; text-align: center; }
  .dol-arrow { font-size: 0.95rem; }
  .dol-count { font-size: 0.78rem; }
  .dol-label { display: none; }
}

/* ---- For / against (26 Sep 2026): two buttons per line, theme chips, sort. ---- */
.dol-bar { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 14px; margin-bottom: 10px; }
.dol-chips { display: flex; gap: 6px; overflow-x: auto; scrollbar-width: none; flex: 1 1 100%; padding-bottom: 2px; }
.dol-chips::-webkit-scrollbar { display: none; }
.dol-chip { flex: none; min-height: 34px; padding: 6px 12px; border: 1px solid var(--line); border-radius: 999px; background: #fff; color: var(--ink); font: inherit; font-size: 0.8rem; font-weight: 650; cursor: pointer; white-space: nowrap; }
.dol-chip span { color: var(--muted); font-weight: 500; margin-left: 2px; }
.dol-chip[aria-pressed='true'] { background: var(--ink); border-color: var(--ink); color: #fff; }
.dol-chip[aria-pressed='true'] span { color: #c9cddb; }
.dol-sort { font-size: 0.8rem; color: var(--muted); }
.dol-sort select { margin-left: 6px; min-height: 34px; border-radius: 8px; border: 1px solid var(--line); background: #fff; font: inherit; font-size: 0.82rem; padding: 4px 8px; }
.dol-item { grid-template-columns: 1fr auto; }
.dol-text em { display: inline-block; margin-top: 4px; font-style: normal; font-size: 0.7rem; font-weight: 650; letter-spacing: 0.04em; text-transform: uppercase; color: var(--muted); }
.dol-votes { display: flex; gap: 6px; }
.dol-votes .dol-vote { min-width: 104px; }
.dol-pro .dol-arrow { color: #1f7a4d; }
.dol-con .dol-arrow { color: var(--rouge); }
.dol-pro:hover { border-color: #1f7a4d; }
.dol-pro[aria-pressed='true'] { background: #1f7a4d; border-color: #1f7a4d; }
.dol-con[aria-pressed='true'] { background: var(--rouge); border-color: var(--rouge); }
.dol-vote[aria-pressed='true'] .dol-arrow, .dol-vote[aria-pressed='true'] .dol-count, .dol-vote[aria-pressed='true'] .dol-label { color: #fff; }
.dol-item.is-voted .dol-vote { background: #fff; border-color: var(--line); }
@media (max-width: 560px) {
  .dol-item { grid-template-columns: 1fr auto; gap: 10px; }
  .dol-votes { flex-direction: column; gap: 4px; }
  .dol-votes .dol-vote { width: 58px; min-width: 0; min-height: 42px; flex-direction: row; gap: 4px; padding: 4px; }
  .dol-rank { display: none; }
}