/* ═══════════════════════════════════════════════════════
   Horizon Humanité Manager — Frontend CSS v1.0.5
   Palette : bleu #0072FF · violet #8224E3
   ═══════════════════════════════════════════════════════ */

:root {
  --hhm-primary:   #8224E3;
  --hhm-blue:      #0072FF;
  --hhm-violet:    #8224E3;
  --hhm-gradient:  linear-gradient(135deg, #0072FF 0%, #8224E3 100%);
  --hhm-bg:        #f8f9ff;
  --hhm-card-bg:   #fff;
  --hhm-border:    #e5e7eb;
  --hhm-text:      #111827;
  --hhm-text2:     #374151;
  --hhm-muted:     #6b7280;
  --hhm-radius:    12px;
  --hhm-shadow:    0 2px 16px rgba(0,0,0,.07);
  --hhm-shadow-lg: 0 8px 32px rgba(0,0,0,.12);
}

.hhm-wrap { font-family:inherit; }

/* ── Toolbar liste ────────────────────────────────────── */
.hhm-causes-toolbar { display:flex; align-items:center; gap:16px; flex-wrap:wrap; margin-bottom:28px; }
.hhm-search-form { display:flex; align-items:center; border:1.5px solid var(--hhm-border); border-radius:10px; overflow:hidden; box-shadow:var(--hhm-shadow); }
.hhm-search-input { border:none; padding:10px 16px; font-size:14px; outline:none; min-width:240px; background:#fff; }
.hhm-search-btn { background:var(--hhm-gradient); color:#fff; border:none; padding:10px 16px; cursor:pointer; font-size:16px; }

.hhm-cat-filters { display:flex; gap:8px; flex-wrap:wrap; }
.hhm-cat-pill { display:inline-flex; align-items:center; gap:5px; padding:6px 14px; border:1.5px solid var(--hhm-border); border-radius:20px; text-decoration:none; font-size:13px; font-weight:600; color:var(--hhm-text2); transition:all .15s; background:#fff; }
.hhm-cat-pill.active, .hhm-cat-pill:hover { box-shadow:0 2px 10px rgba(0,114,255,.2); }
.hhm-pill-count { background:rgba(0,0,0,.1); border-radius:10px; padding:0 6px; font-size:11px; }

.hhm-layout-toggle { display:flex; gap:4px; margin-left:auto; }
.hhm-layout-btn { border:1.5px solid var(--hhm-border); background:#fff; width:36px; height:36px; border-radius:8px; cursor:pointer; font-size:16px; transition:all .12s; }
.hhm-layout-btn.active { background:var(--hhm-gradient); color:#fff; border-color:transparent; }
.hhm-results-bar { font-size:13px; color:var(--hhm-muted); margin-bottom:16px; }

/* ── Grille causes ────────────────────────────────────── */
/* v1.14.20 — gap configurable via variable CSS (réglage admin + shortcode override) */
.hhm-causes-grid { display:grid; gap: var(--hhm-cards-gap, 24px); }
.hhm-cols-1 { grid-template-columns:1fr; }
.hhm-cols-2 { grid-template-columns:repeat(2,1fr); }
.hhm-cols-3 { grid-template-columns:repeat(3,1fr); }
.hhm-cols-4 { grid-template-columns:repeat(4,1fr); }
.hhm-cols-5 { grid-template-columns:repeat(5,1fr); }
.hhm-cols-6 { grid-template-columns:repeat(6,1fr); }
/* v1.9.0 — Mode auto : grille intelligente qui s'adapte (min 260px par carte) */
.hhm-cols-auto { grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); }

/* Responsive : dégrade gracieusement le nombre de colonnes selon écran */
@media (max-width: 1200px) {
    .hhm-cols-6 { grid-template-columns:repeat(4,1fr); }
    .hhm-cols-5 { grid-template-columns:repeat(4,1fr); }
}
@media (max-width: 980px) {
    .hhm-cols-6, .hhm-cols-5, .hhm-cols-4 { grid-template-columns:repeat(3,1fr); }
}
@media (max-width: 760px) {
    .hhm-cols-6, .hhm-cols-5, .hhm-cols-4, .hhm-cols-3 { grid-template-columns:repeat(2,1fr); gap:16px; }
}
@media (max-width: 480px) {
    .hhm-cols-6, .hhm-cols-5, .hhm-cols-4, .hhm-cols-3, .hhm-cols-2 { grid-template-columns:1fr; gap:14px; }
}
.hhm-layout-list .hhm-cause-card { flex-direction:row; }
.hhm-layout-list .hhm-card-img-wrap { width:240px; min-width:240px; }
.hhm-layout-list { grid-template-columns:1fr; }

/* ── Carte cause ──────────────────────────────────────── */
.hhm-cause-card {
  background:var(--hhm-card-bg); border-radius:var(--hhm-radius);
  box-shadow:var(--hhm-shadow); overflow:hidden; display:flex; flex-direction:column;
  transition:transform .2s, box-shadow .2s;
}
.hhm-cause-card:hover { transform:translateY(-5px); box-shadow:var(--hhm-shadow-lg); }

.hhm-card-img-wrap { position:relative; overflow:hidden; aspect-ratio:16/10; flex-shrink:0; }
.hhm-card-img { width:100%; height:100%; object-fit:cover; display:block; transition:transform .35s; }
.hhm-cause-card:hover .hhm-card-img { transform:scale(1.05); }
.hhm-card-img-placeholder { width:100%; aspect-ratio:16/10; display:flex; align-items:center; justify-content:center; background:linear-gradient(135deg, #f0f4ff, #f5f0ff); }

.hhm-card-cat-badge { position:absolute; top:12px; left:12px; background:var(--hhm-gradient); color:#fff; font-size:11px; font-weight:700; padding:4px 11px; border-radius:20px; }
.hhm-card-status-badge { position:absolute; top:12px; right:12px; color:#fff; font-size:11px; font-weight:700; padding:4px 11px; border-radius:20px; }
.hhm-badge-completed { background:#059669; }
.hhm-badge-featured { background:#f59e0b; }

.hhm-card-donate-btn {
  position:absolute; bottom:-50px; left:0; right:0;
  background:var(--hhm-gradient); color:#fff; text-align:center;
  padding:13px; font-weight:700; font-size:13px; text-decoration:none;
  transition:bottom .22s ease;
}
.hhm-cause-card:hover .hhm-card-donate-btn { bottom:0; }

.hhm-card-body { padding:20px; flex:1; display:flex; flex-direction:column; }
.hhm-card-title { font-size:17px; font-weight:700; margin:0 0 8px; line-height:1.35; }
.hhm-card-title a { text-decoration:none; color:var(--hhm-text); transition:color .12s; }
.hhm-card-title a:hover { color:var(--hhm-blue); }
.hhm-card-excerpt { font-size:13px; color:var(--hhm-muted); line-height:1.6; margin-bottom:14px; flex:1; }

/* ── Barre progression ────────────────────────────────── */
.hhm-progress-wrap { margin-bottom:14px; }
.hhm-progress-track { height:7px; background:#f0f0f8; border-radius:10px; position:relative; overflow:visible; }
.hhm-progress-fill { height:100%; border-radius:10px; background:var(--hhm-gradient); position:relative; transition:width .7s ease; }
.hhm-progress-pct {
  position:absolute; right:0; top:-26px;
  background:var(--hhm-gradient); color:#fff;
  font-size:10px; font-weight:700; padding:2px 7px; border-radius:8px;
  white-space:nowrap;
}

.hhm-card-stats { display:flex; gap:14px; flex-wrap:wrap; margin-bottom:14px; }
.hhm-stat { display:flex; flex-direction:column; }
.hhm-stat-label { font-size:10px; text-transform:uppercase; letter-spacing:.06em; color:var(--hhm-muted); font-weight:600; }
.hhm-stat-value { font-size:14px; font-weight:700; color:var(--hhm-text); }

.hhm-card-btn { display:inline-flex; align-items:center; background:var(--hhm-gradient); color:#fff; padding:10px 20px; border-radius:24px; font-weight:700; font-size:13px; text-decoration:none; margin-top:auto; align-self:flex-start; transition:opacity .12s, transform .12s; }
.hhm-card-btn:hover { opacity:.9; transform:translateX(2px); color:#fff; }

/* ── Pagination ───────────────────────────────────────── */
.hhm-pagination { display:flex; justify-content:center; gap:8px; margin-top:32px; }
.hhm-page-btn { border:1.5px solid var(--hhm-border); border-radius:9px; padding:8px 14px; text-decoration:none; font-size:14px; color:var(--hhm-text); background:#fff; transition:all .12s; }
.hhm-page-btn.active { background:var(--hhm-gradient); color:#fff; border-color:transparent; }
.hhm-page-btn:hover:not(.active) { border-color:var(--hhm-blue); color:var(--hhm-blue); }

/* ── Empty ────────────────────────────────────────────── */
.hhm-empty { text-align:center; padding:60px 24px; }
.hhm-empty-icon { font-size:52px; margin-bottom:14px; }
.hhm-error { color:#dc2626; font-size:14px; padding:12px; background:#fee2e2; border-radius:8px; }

/* ══════════════════════════════════════════════════════
   SINGLE PAGE CAUSE
   ══════════════════════════════════════════════════════ */

/* Hero */
.hhm-single-hero { min-height:var(--hhm-hero-height, 420px); background-size:cover; background-position:center center; background-repeat:no-repeat; position:relative; display:flex; align-items:flex-end; }
.hhm-single-hero-overlay { position:absolute; inset:0; background:linear-gradient(to top, rgba(0,0,0,.72) 0%, rgba(0,0,0,.05) 60%); }
.hhm-single-hero-content { position:relative; z-index:1; padding:36px 40px; max-width:800px; }
.hhm-single-cat { display:inline-block; background:var(--hhm-gradient); color:#fff; font-size:12px; font-weight:700; padding:5px 14px; border-radius:20px; margin-bottom:12px; }
.hhm-single-title { color:#fff; font-size:36px; font-weight:800; margin:0; text-shadow:0 2px 12px rgba(0,0,0,.4); line-height:1.2; }

/* Bandeau sticky */
.hhm-sticky-banner {
  position:sticky; top:0; z-index:200;
  background:rgba(10,10,30,.88);
  backdrop-filter:blur(12px);
  -webkit-backdrop-filter:blur(12px);
  padding:0 24px;
  box-shadow:0 2px 20px rgba(0,0,0,.2);
}
.hhm-sticky-inner {
  display:flex; align-items:center; gap:28px; flex-wrap:nowrap;
  max-width:1100px; margin:0 auto; height:64px; overflow:hidden;
}
.hhm-sticky-kpi { display:flex; flex-direction:column; gap:1px; flex-shrink:0; }
.hhm-sticky-kpi-label { font-size:9px; text-transform:uppercase; letter-spacing:.07em; color:rgba(255,255,255,.55); font-weight:600; }
.hhm-sticky-kpi-value { font-size:14px; font-weight:700; color:#fff; white-space:nowrap; }
.hhm-kpi-big { flex-shrink:0; }
.hhm-kpi-big .hhm-sticky-kpi-value-big { font-size:26px; font-weight:800; background:var(--hhm-gradient); -webkit-background-clip:text; -webkit-text-fill-color:transparent; background-clip:text; line-height:1; }
.hhm-kpi-big .hhm-sticky-kpi-label { color:rgba(255,255,255,.55); }
.hhm-sticky-sep { width:1px; height:32px; background:rgba(255,255,255,.15); flex-shrink:0; }
.hhm-sticky-donate-btn {
  margin-left:auto; flex-shrink:0;
  background:var(--hhm-gradient); color:#fff;
  padding:10px 22px; border-radius:24px; font-weight:700;
  text-decoration:none; font-size:13px; white-space:nowrap;
  box-shadow:0 4px 14px rgba(130,36,227,.35);
  transition:transform .12s, box-shadow .12s;
}
.hhm-sticky-donate-btn:hover { transform:translateY(-1px); box-shadow:0 6px 20px rgba(130,36,227,.45); color:#fff; }

/* Layout image + citation */
.hhm-single-main { max-width:1060px; margin:0 auto; padding:0 24px 56px; }
.hhm-single-layout { display:grid; grid-template-columns:3fr 2fr; border-radius:var(--hhm-radius); overflow:hidden; margin:32px 0; box-shadow:var(--hhm-shadow-lg); }
.hhm-single-img-wrap { position:relative; }
.hhm-single-img { width:100%; height:380px; object-fit:cover; display:block; }
.hhm-single-progress-bar { height:8px; background:#e5e7eb; }
.hhm-single-progress-fill { height:100%; background:var(--hhm-gradient); position:relative; transition:width .7s; }
.hhm-single-pct-badge { position:absolute; right:8px; top:-18px; background:var(--hhm-gradient); color:#fff; font-size:11px; font-weight:700; padding:3px 9px; border-radius:8px; }
.hhm-single-quote { display:flex; flex-direction:column; justify-content:center; align-items:center; padding:40px 32px; background:var(--hhm-gradient); color:#fff; text-align:center; }
.hhm-quote-mark { font-size:72px; font-weight:900; line-height:.7; opacity:.4; font-family:Georgia,serif; }
.hhm-single-quote blockquote { font-size:20px; font-weight:700; line-height:1.5; margin:16px 0; font-style:italic; }
.hhm-single-quote cite { font-size:11px; font-weight:700; letter-spacing:.12em; text-transform:uppercase; opacity:.7; }

/* Onglets */
.hhm-tabs { display:flex; gap:0; border-bottom:2px solid var(--hhm-border); margin:32px 0 24px; }
.hhm-tab { padding:12px 22px; font-weight:600; font-size:14px; text-decoration:none; color:var(--hhm-muted); border-bottom:2px solid transparent; margin-bottom:-2px; transition:all .13s; }
.hhm-tab:hover { color:var(--hhm-blue); }
.hhm-tab.active { color:var(--hhm-blue); border-bottom-color:var(--hhm-blue); }
.hhm-tab-count { display:inline-flex; align-items:center; justify-content:center; background:var(--hhm-gradient); color:#fff; border-radius:10px; font-size:10px; padding:0 6px; min-width:18px; margin-left:5px; }
.hhm-tab-content { animation:hhm-fadein .22s; }
.hhm-tab-title { font-size:15px; font-weight:700; text-transform:uppercase; letter-spacing:.06em; margin-bottom:16px; color:var(--hhm-text); }

/* Documents */
.hhm-doc-row { display:flex; align-items:center; gap:12px; padding:13px 16px; border:1.5px solid var(--hhm-border); border-radius:10px; margin-bottom:8px; background:#fff; transition:border-color .12s; }
.hhm-doc-row:hover { border-color:var(--hhm-blue); }
.hhm-doc-icon { font-size:22px; }
.hhm-doc-type { font-size:11px; font-weight:700; background:#f3f4f6; padding:2px 7px; border-radius:5px; text-transform:uppercase; }
.hhm-doc-title { flex:1; font-weight:500; color:var(--hhm-text); }
.hhm-doc-access { font-size:11px; font-weight:700; border:1px solid currentColor; padding:2px 8px; border-radius:5px; }
.hhm-access-public  { color:#059669; }
.hhm-access-private { color:#dc2626; }
.hhm-access-donors  { color:var(--hhm-blue); }
.hhm-doc-dl { color:var(--hhm-blue); text-decoration:none; font-weight:600; font-size:13px; }

/* Donateurs */
.hhm-donors-grid { display:grid; grid-template-columns:repeat(2,1fr); gap:12px; margin-bottom:28px; }
.hhm-donor-card { display:flex; align-items:center; gap:12px; padding:14px 16px; border:1.5px solid var(--hhm-border); border-radius:10px; background:#fff; transition:border-color .12s, box-shadow .12s; }
.hhm-donor-card:hover { border-color:var(--hhm-violet); box-shadow:0 2px 12px rgba(130,36,227,.1); }
.hhm-donor-av { width:48px; height:48px; border-radius:50%; object-fit:cover; flex-shrink:0; border:2px solid var(--hhm-border); }
.hhm-donor-info { flex:1; min-width:0; }
.hhm-donor-info strong { font-size:14px; display:block; color:var(--hhm-text); }
.hhm-donor-msg { font-size:12px; color:var(--hhm-muted); margin:2px 0 0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.hhm-donor-amount { font-size:16px; font-weight:800; flex-shrink:0; background:var(--hhm-gradient); -webkit-background-clip:text; -webkit-text-fill-color:transparent; background-clip:text; }

/* Galerie */
.hhm-gallery { display:grid; grid-template-columns:repeat(4,1fr); gap:8px; margin-top:16px; }
.hhm-gallery-item img { width:100%; aspect-ratio:1; object-fit:cover; border-radius:8px; transition:transform .2s; }
.hhm-gallery-item:hover img { transform:scale(1.04); }

/* Carte */
.hhm-map-wrap { width:100%; height:400px; border-radius:var(--hhm-radius); overflow:hidden; box-shadow:var(--hhm-shadow); }

/* Partage */
.hhm-share-section { margin-top:44px; padding-top:28px; border-top:1px solid var(--hhm-border); }
.hhm-share-section h3 { font-size:15px; font-weight:700; margin:0 0 12px; }
.hhm-share-btns { display:flex; gap:10px; flex-wrap:wrap; }
.hhm-share-btn { padding:10px 18px; border-radius:9px; font-weight:600; font-size:13px; cursor:pointer; text-decoration:none; border:none; transition:opacity .12s, transform .12s; }
.hhm-share-btn:hover { opacity:.88; transform:translateY(-1px); }
.hhm-share-fb   { background:#1877f2; color:#fff; }
.hhm-share-tw   { background:#1da1f2; color:#fff; }
.hhm-share-wa   { background:#25d366; color:#fff; }
.hhm-share-copy { background:#f3f4f6; color:var(--hhm-text); }

/* ══════════════════════════════════════════════════════
   FORMULAIRE DE DON
   ══════════════════════════════════════════════════════ */
#hhm-donate { scroll-margin-top:80px; }
.hhm-donate-form-wrap { background:#fff; border:1.5px solid var(--hhm-border); border-radius:var(--hhm-radius); padding:32px; max-width:780px; box-shadow:var(--hhm-shadow); }
.hhm-donate-title { font-size:20px; font-weight:800; text-transform:uppercase; letter-spacing:.06em; margin:0 0 8px; color:var(--hhm-text); }
.hhm-donate-subtitle { font-size:14px; color:#6b7280; margin:0 0 20px; line-height:1.5; font-style:italic; }

.hhm-step-header { display:flex; align-items:center; gap:12px; margin-bottom:22px; }
.hhm-step-num { width:30px; height:30px; border-radius:50%; background:var(--hhm-gradient); color:#fff; display:flex; align-items:center; justify-content:center; font-weight:700; font-size:13px; flex-shrink:0; }
.hhm-step-label { font-weight:700; font-size:15px; color:var(--hhm-text); }
.hhm-back-btn { background:none; border:none; color:var(--hhm-muted); cursor:pointer; font-size:13px; padding:0; margin-right:auto; }

.hhm-preset-amounts { display:grid; grid-template-columns:repeat(4,1fr); gap:8px; margin-bottom:12px; }
.hhm-preset-btn { border:1.5px solid var(--hhm-border); background:#fff; border-radius:9px; padding:13px 8px; font-size:15px; font-weight:700; cursor:pointer; transition:all .13s; color:var(--hhm-text); }
.hhm-preset-btn:hover { border-color:var(--hhm-blue); color:var(--hhm-blue); }
.hhm-preset-btn.selected { border-color:var(--hhm-violet); color:var(--hhm-violet); background:rgba(130,36,227,.06); }

.hhm-amount-input { width:100%; border:1.5px solid var(--hhm-border); border-radius:9px; padding:13px 16px; font-size:16px; box-sizing:border-box; transition:border-color .12s; }
.hhm-amount-input:focus { outline:none; border-color:var(--hhm-blue); box-shadow:0 0 0 3px rgba(0,114,255,.1); }
.hhm-min-notice { font-size:12px; color:var(--hhm-muted); display:block; margin:4px 0 16px; }

.hhm-frequency-wrap { margin-bottom:22px; }
.hhm-freq-label { display:block; font-size:12px; font-weight:700; text-transform:uppercase; letter-spacing:.05em; color:var(--hhm-muted); margin-bottom:9px; }
.hhm-freq-btns { display:flex; gap:8px; flex-wrap:wrap; }
.hhm-freq-btn { border:1.5px solid var(--hhm-border); background:#fff; border-radius:20px; padding:7px 16px; font-size:13px; cursor:pointer; font-weight:600; transition:all .12s; color:var(--hhm-text2); }
.hhm-freq-btn.active { background:var(--hhm-gradient); color:#fff; border-color:transparent; box-shadow:0 2px 10px rgba(130,36,227,.3); }

/* v1.12.63 : boutons donate avec dégradé HHM + hover plus marqué */
.hhm-next-step-btn, .hhm-submit-btn {
    width: 100%;
    padding: 14px;
    border: none;
    border-radius: 10px;
    background: var(--hhm-gradient, linear-gradient(135deg, #0072FF 0%, #8224E3 100%));
    color: #ffffff;
    font-size: 16px;
    font-weight: 700;
    cursor: pointer;
    margin-top: 16px;
    transition: filter .15s ease, transform .15s ease, box-shadow .15s ease;
    box-shadow: 0 4px 16px rgba(130, 36, 227, .25);
    letter-spacing: .01em;
}
.hhm-next-step-btn:hover, .hhm-submit-btn:hover {
    filter: brightness(1.08);
    transform: translateY(-2px);
    box-shadow: 0 8px 24px rgba(130, 36, 227, .4);
}
.hhm-next-step-btn:active, .hhm-submit-btn:active {
    transform: translateY(0);
}

.hhm-amount-summary { font-size:15px; margin-bottom:22px; padding:13px 18px; background:#f8f9ff; border-radius:10px; border-left:3px solid var(--hhm-blue); }
.hhm-freq-badge { background:var(--hhm-gradient); color:#fff; font-size:11px; padding:2px 9px; border-radius:10px; margin-left:8px; vertical-align:middle; }

.hhm-guest-info { display:flex; flex-direction:column; gap:10px; margin-bottom:12px; }
.hhm-field-row { display:grid; grid-template-columns:1fr 1fr; gap:10px; }
.hhm-guest-info input, #hhm-message {
  width:100%; border:1.5px solid var(--hhm-border); border-radius:9px;
  padding:11px 14px; font-size:14px; box-sizing:border-box; font-family:inherit;
  transition:border-color .12s;
}
.hhm-guest-info input:focus, #hhm-message:focus { outline:none; border-color:var(--hhm-blue); }
#hhm-message { resize:vertical; min-height:80px; display:block; margin-bottom:12px; }

.hhm-honor-toggle, .hhm-anon-label, .hhm-newsletter-label, .hhm-terms-label { font-size:13px; color:var(--hhm-text2); margin-bottom:10px; display:block; cursor:pointer; }
.hhm-honor-fields { display:flex; flex-direction:column; gap:8px; margin-bottom:12px; padding:14px; background:#f9fafb; border-radius:10px; }
.hhm-honor-fields input { border:1.5px solid var(--hhm-border); border-radius:9px; padding:10px 14px; font-size:14px; box-sizing:border-box; width:100%; }

.hhm-gateway-tabs { display:flex; gap:8px; margin:18px 0 14px; flex-wrap:wrap; }
.hhm-gw-tab { border:1.5px solid var(--hhm-border); background:#fff; border-radius:9px; padding:10px 18px; font-size:14px; font-weight:600; cursor:pointer; transition:all .12s; color:var(--hhm-text2); }
.hhm-gw-tab.active { border-color:var(--hhm-violet); color:var(--hhm-violet); background:rgba(130,36,227,.05); }

.hhm-stripe-input { border:1.5px solid var(--hhm-border); border-radius:9px; padding:14px; margin-bottom:6px; transition:border-color .12s; }
.hhm-stripe-input:focus-within { border-color:var(--hhm-blue); }
.hhm-error-msg { color:#dc2626; font-size:13px; min-height:20px; margin-bottom:8px; }
.hhm-offline-instructions { background:#fef9c3; border:1px solid #fcd34d; border-radius:10px; padding:16px; font-size:14px; line-height:1.7; }
.hhm-donate-feedback { padding:16px; border-radius:10px; text-align:center; font-weight:600; margin-top:12px; }
.hhm-donate-feedback.success { background:#d1fae5; color:#065f46; border:1px solid #6ee7b7; }
.hhm-donate-feedback.error   { background:#fee2e2; color:#991b1b; border:1px solid #fca5a5; }

/* ══════════════════════════════════════════════════════
   PAGE MERCI
   ══════════════════════════════════════════════════════ */
.hhm-thankyou-wrap { max-width:700px; margin:0 auto; font-family:inherit; }
.hhm-ty-header { padding:52px 36px; text-align:center; border-radius:var(--hhm-radius) var(--hhm-radius) 0 0; background:var(--hhm-gradient); color:#fff; }
.hhm-ty-icon { font-size:60px; margin-bottom:14px; }
.hhm-ty-title { font-size:32px; font-weight:800; margin:0 0 12px; color:#fff; }
.hhm-ty-subtitle { font-size:15px; opacity:.9; margin:0; line-height:1.7; }
.hhm-ty-content { background:#fff; border:1.5px solid var(--hhm-border); border-top:none; border-radius:0 0 var(--hhm-radius) var(--hhm-radius); padding:32px; box-shadow:var(--hhm-shadow); }
.hhm-ty-details { display:flex; flex-direction:column; gap:16px; margin-bottom:24px; }
.hhm-ty-ref { display:flex; flex-direction:column; background:#f8f9ff; border-radius:10px; padding:14px 18px; border-left:3px solid var(--hhm-blue); }
.hhm-ty-ref strong { font-size:18px; font-family:monospace; margin-top:4px; color:var(--hhm-text); }
.hhm-ty-share { text-align:center; padding:22px 0; border-top:1px solid var(--hhm-border); border-bottom:1px solid var(--hhm-border); margin-bottom:22px; }
.hhm-ty-actions { display:flex; gap:12px; justify-content:center; flex-wrap:wrap; }

/* ── Animation ────────────────────────────────────────── */
@keyframes hhm-fadein { from { opacity:0; transform:translateY(10px); } to { opacity:1; transform:none; } }

/* ── Responsive ───────────────────────────────────────── */
@media (max-width:900px) {
  .hhm-single-layout { grid-template-columns:1fr; }
  .hhm-single-quote { min-height:200px; }
  .hhm-donors-grid { grid-template-columns:1fr; }
  .hhm-sticky-inner { gap:16px; }
  .hhm-kpi-big .hhm-sticky-kpi-value-big { font-size:20px; }
}
@media (max-width:768px) {
  .hhm-cols-3, .hhm-cols-4 { grid-template-columns:repeat(2,1fr); }
  .hhm-preset-amounts { grid-template-columns:repeat(2,1fr); }
  .hhm-single-title { font-size:26px; }
  .hhm-sticky-donate-btn { display:none; }
}
@media (max-width:480px) {
  .hhm-cols-2, .hhm-cols-3, .hhm-cols-4 { grid-template-columns:1fr; }
  .hhm-field-row { grid-template-columns:1fr; }
  .hhm-gallery { grid-template-columns:repeat(2,1fr); }
  .hhm-single-hero-content { padding:24px; }
}

/* ═══════════════════════════════════════════════════════
   HHM — Layout cause mode carte HDM ([hhm_cause_layout]) v1.1.1
   ═══════════════════════════════════════════════════════ */
/* v1.10.1 : pas de max-width forcé → respecte le conteneur WPBakery parent (row, container) */
.hhm-cl { width:100%; margin:0; padding:8px 0 40px; --hhm-gradient:linear-gradient(135deg,#0072FF 0%,#8224E3 100%); }
/* v1.10.1 : gap réduit (24px → 16px) pour rapprocher les colonnes */
.hhm-cl-row { display:grid; gap:16px; align-items:start; }

/* ── Carte gauche : hauteur fixe, 3 zones flex ── */
.hhm-cl-card {
  background: var(--hhm-layout-card-bg, #fff); border:1px solid var(--hhm-layout-card-border, var(--hhm-border,#e5e7eb)); border-radius: var(--hhm-layout-card-radius, 18px);
  box-shadow: var(--hhm-layout-card-shadow, 0 4px 24px rgba(0,0,0,.06)); display:flex; flex-direction:column;
  overflow:hidden;
}
.hhm-cl-top { flex:0 0 auto; position:relative; }
.hhm-cl-bottom { flex:0 0 auto; }
.hhm-cl-scroll {
  flex:1 1 auto; overflow-y:auto; overflow-x:hidden; padding:20px 24px;
  background: var(--hhm-layout-desc-bg, transparent);
  scrollbar-width:thin; scrollbar-color:var(--hhm-cause-color,#8224E3) #eee;
}
.hhm-cl-scroll::-webkit-scrollbar { width:8px; }
.hhm-cl-scroll::-webkit-scrollbar-track { background:#f1f1f4; border-radius:8px; }
.hhm-cl-scroll::-webkit-scrollbar-thumb { background:var(--hhm-cause-color,#8224E3); border-radius:8px; }

/* ── Image hero + KPIs en overlay ── */
.hhm-cl-hero { position:relative; width:100%; overflow:hidden; background: var(--hhm-layout-hero-fallback-bg, #000); min-height: var(--hhm-layout-hero-height, auto); }
.hhm-cl-hero img { width:100%; height:100%; object-fit:cover; display:block; }
.hhm-cl-hero-overlay {
  position:absolute; inset:0; display:flex; flex-direction:column; justify-content:flex-end;
  background:linear-gradient(to top, rgba(0,0,0,.80) 0%, rgba(0,0,0,.48) 30%, rgba(0,0,0,0) 62%);
  padding:18px 22px;
}
.hhm-cl-kpis { display:flex; flex-wrap:wrap; gap:22px; width:100%; }
.hhm-cl-kpi { display:flex; flex-direction:column; gap:1px; }
.hhm-cl-kpi-label { font-size:10px; font-weight:700; color:rgba(255,255,255,.75); text-transform:uppercase; letter-spacing:.06em; }
.hhm-cl-kpi-value { font-size:18px; font-weight:800; color:#fff; line-height:1.2; text-shadow:0 1px 3px rgba(0,0,0,.4); }

/* ── Barre de progression (dans l'overlay sur l'image) ── */
.hhm-cl-progress { height:9px; background:rgba(255,255,255,.28); border-radius:99px; overflow:hidden; margin-top:12px; }
.hhm-cl-progress-bar { height:100%; border-radius:99px; transition:width .6s ease; min-width:3px; background: var(--hhm-layout-progress-bar, var(--hhm-gradient)); box-shadow:0 0 8px rgba(255,255,255,.35); }

/* ── Bloc coloré : citation + onglets réunis (pleine largeur, collé à l'image) ── */
.hhm-cl-block { margin:0; border-radius:0; overflow:hidden; }
.hhm-cl-block.is-gradient { background: var(--hhm-layout-quote-bg, var(--hhm-gradient)); }

/* ── Citation (dans le bloc) ── */
.hhm-cl-quote { position:relative; padding:24px 28px 12px; margin:0; border:none; overflow:hidden; }
.hhm-cl-quote, .hhm-cl-quote * { color: var(--hhm-layout-quote-text, #fff) !important; }
.hhm-cl-quote-mark {
  position:absolute; top:-30px; right:18px;
  font-size:160px; line-height:1; font-family:Georgia,serif;
  color: var(--hhm-layout-quote-marks, rgba(255,255,255,.15)) !important;
  pointer-events:none; user-select:none;
  z-index:0;
}
.hhm-cl-quote-text {
  position:relative; z-index:1;
  font-size: var(--hhm-layout-quote-size, 18px); line-height:1.6; font-style:italic; font-weight:600;
  margin:0 0 10px;
}
.hhm-cl-quote-author {
  position:relative; z-index:1;
  display:block; text-align:right;
  font-size: var(--hhm-layout-quote-author-size, 13px); font-weight:700; letter-spacing:.04em; text-transform:uppercase;
  color: var(--hhm-layout-quote-author-color, rgba(255,255,255,.9)) !important; font-style:normal;
}

/* ── Onglets (dans le bloc, sur fond foncé) ── */
.hhm-cl-tabs-nav { display:flex; flex-wrap:wrap; gap:2px; padding:6px 16px 0; border-top:1px solid rgba(255,255,255,.2); }
.hhm-cl-tab { background:none; border:none; padding:11px 14px; font-size: var(--hhm-layout-tab-size, 14px); font-weight:700; color: var(--hhm-layout-tab-inactive, rgba(255,255,255,.65)); cursor:pointer; border-bottom:3px solid transparent; margin-bottom:-1px; transition:color .15s,border-color .15s; display:inline-flex; align-items:center; gap:6px; white-space:nowrap; }
.hhm-cl-tab:hover { color: var(--hhm-layout-tab-active, #fff); }
.hhm-cl-tab.is-active { color: var(--hhm-layout-tab-active, #fff); border-bottom-color: var(--hhm-layout-tab-active, #fff); }
.hhm-cl-tab-badge { background:rgba(255,255,255,.25); color:#fff; font-size:10px; font-weight:700; padding:1px 6px; border-radius:10px; }

/* ── Panels ── */
.hhm-cl-scroll { min-height: 200px; }
.hhm-cl-panel { display:none; font-family:Arial,Helvetica,sans-serif; font-size: var(--hhm-layout-desc-size, 16px); line-height: var(--hhm-layout-desc-lh, 1.75); color: var(--hhm-layout-desc-color, #111); }
.hhm-cl-panel.is-active { display:block; }
.hhm-cl-panel p { margin:0 0 14px; color: var(--hhm-layout-desc-color, #111); }
.hhm-cl-panel a { color: var(--hhm-layout-link, #8224E3); }
.hhm-cl-panel a:hover { color: var(--hhm-layout-link-hover, #6d28d9); }
.hhm-cl-empty { color:var(--hhm-muted,#6b7280); font-style:italic; text-align:center; padding:30px 10px; margin:0; }

/* Documents */
.hhm-cl-docs, .hhm-cl-updates { list-style:none; margin:0; padding:0; }
.hhm-cl-doc { display:flex; align-items:center; gap:12px; padding:12px 14px; border:1px solid var(--hhm-border,#e5e7eb); border-radius:10px; margin-bottom:8px; transition:border-color .15s, box-shadow .15s; }
.hhm-cl-doc:hover { border-color:var(--hhm-cause-color,#8224E3); box-shadow:0 2px 8px rgba(130,36,227,.08); }
.hhm-cl-doc-ico { font-size:22px; line-height:1; }
.hhm-cl-doc-info { flex:1; display:flex; flex-direction:column; gap:2px; min-width:0; }
.hhm-cl-doc-name { font-weight:600; color:var(--hhm-text,#111827); }
.hhm-cl-doc-meta { font-size:11px; color:var(--hhm-muted,#6b7280); text-transform:uppercase; letter-spacing:.04em; font-weight:600; }
/* v1.12.22 : bouton aperçu en dégradé bleu→violet avec texte blanc lisible */
.hhm-cl-doc-btn {
    background: linear-gradient(135deg, #0072FF, var(--hhm-cause-color,#8224E3));
    color: #ffffff !important;
    border: none;
    text-decoration: none;
    padding: 8px 16px;
    border-radius: 7px;
    font-size: 13px;
    font-weight: 700;
    cursor: pointer;
    transition: filter .15s, transform .15s, box-shadow .15s;
    white-space: nowrap;
    line-height: 1.2;
}
.hhm-cl-doc-btn:hover { filter:brightness(1.08); transform:translateY(-1px); box-shadow:0 4px 12px rgba(0,114,255,.25); color:#fff !important; }
.hhm-cl-doc-btn:focus { outline:2px solid var(--hhm-cause-color,#8224E3); outline-offset:2px; }
.hhm-cl-doc-private { background:#374151; color:#fff; padding:6px 12px; border-radius:7px; font-size:12px; font-weight:600; }

/* v1.12.22 : Modale de prévisualisation des documents */
.hhm-doc-preview-modal {
    position: fixed; inset: 0;
    z-index: 2147483647;
    display: flex; align-items: center; justify-content: center;
    padding: 20px;
}
.hhm-doc-preview-modal[hidden] { display: none; }
.hhm-doc-preview-backdrop {
    position: absolute; inset: 0;
    background: rgba(0,0,0,.75);
    backdrop-filter: blur(2px);
    cursor: pointer;
}
.hhm-doc-preview-dialog {
    position: relative;
    width: 100%;
    max-width: 1100px;
    height: 90vh;
    max-height: 900px;
    background: #1f2937;
    border-radius: 12px;
    box-shadow: 0 20px 60px rgba(0,0,0,.5);
    display: flex; flex-direction: column;
    overflow: hidden;
    animation: hhm-doc-preview-in .25s cubic-bezier(.16,1,.3,1);
}
@keyframes hhm-doc-preview-in {
    from { opacity:0; transform:scale(.96); }
    to { opacity:1; transform:none; }
}
.hhm-doc-preview-head {
    display: flex; align-items: center; justify-content: space-between;
    padding: 14px 20px;
    background: linear-gradient(135deg, #0072FF, #8224E3);
    color: #fff;
    flex-shrink: 0;
}
.hhm-doc-preview-title {
    margin: 0; font-size: 15px; font-weight: 700;
    color: #ffffff !important;
    overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
    flex: 1; min-width: 0; padding-right: 16px;
}
.hhm-doc-preview-actions { display:flex; align-items:center; gap:10px; flex-shrink:0; }
.hhm-doc-preview-download {
    background: rgba(255,255,255,.18);
    color: #fff !important;
    padding: 6px 14px;
    border-radius: 6px;
    font-size: 13px;
    font-weight: 600;
    text-decoration: none;
    transition: background .15s;
    white-space: nowrap;
}
.hhm-doc-preview-download:hover { background: rgba(255,255,255,.28); color:#fff !important; }
.hhm-doc-preview-close-btn {
    background: transparent; border: none; color: #fff;
    font-size: 18px; cursor: pointer;
    width: 32px; height: 32px;
    border-radius: 6px;
    display: inline-flex; align-items: center; justify-content: center;
    transition: background .15s;
}
.hhm-doc-preview-close-btn:hover { background: rgba(255,255,255,.18); }
.hhm-doc-preview-body {
    flex: 1; min-height: 0;
    overflow: auto;
    background: #2d3748;
    display: flex; align-items: center; justify-content: center;
    position: relative;
}
.hhm-doc-preview-body iframe { width:100%; height:100%; border:0; background:#fff; display:block; }
.hhm-doc-preview-body img { max-width:100%; max-height:100%; object-fit:contain; display:block; }
.hhm-doc-preview-body video, .hhm-doc-preview-body audio { max-width:100%; max-height:100%; }
.hhm-doc-preview-fallback {
    text-align: center; color: #e5e7eb; padding: 40px 20px;
}
.hhm-doc-preview-fallback .icon { font-size: 64px; margin-bottom: 16px; }
.hhm-doc-preview-fallback h4 { color: #fff; margin: 0 0 8px; font-size: 18px; }
.hhm-doc-preview-fallback p { color: #9ca3af; margin: 0 0 20px; font-size: 14px; }
.hhm-doc-preview-fallback a {
    background: linear-gradient(135deg, #0072FF, #8224E3);
    color: #fff !important;
    padding: 10px 22px;
    border-radius: 7px;
    text-decoration: none;
    font-weight: 600;
    font-size: 14px;
    display: inline-block;
}
.hhm-doc-preview-loading {
    color: #9ca3af; font-size: 14px;
    text-align: center; padding: 40px;
}
.hhm-doc-preview-loading::before {
    content: "";
    display: inline-block;
    width: 28px; height: 28px;
    border: 3px solid rgba(255,255,255,.15);
    border-top-color: #fff;
    border-radius: 50%;
    animation: hhm-spin .8s linear infinite;
    margin-bottom: 14px;
}
@keyframes hhm-spin { to { transform: rotate(360deg); } }

@media (max-width: 720px) {
    .hhm-doc-preview-modal { padding: 0; }
    .hhm-doc-preview-dialog { height: 100vh; max-height: none; border-radius: 0; }
    .hhm-doc-preview-title { font-size: 13px; }
    .hhm-doc-preview-download { padding: 5px 10px; font-size: 12px; }
    .hhm-cl-doc-meta { font-size: 10px; }
}

/* v1.12.23 : PDF.js viewer */
.hhm-pdf-viewer {
    width: 100%; height: 100%;
    display: flex; flex-direction: column;
    background: #4b5563;
}
.hhm-pdf-toolbar {
    flex-shrink: 0;
    display: flex; align-items: center; justify-content: space-between;
    gap: 16px;
    background: #374151;
    padding: 8px 14px;
    border-bottom: 1px solid #1f2937;
}
.hhm-pdf-tool-group {
    display: flex; align-items: center; gap: 6px;
}
.hhm-pdf-btn {
    background: rgba(255,255,255,.1);
    color: #ffffff !important;
    border: none;
    width: 32px; height: 32px;
    border-radius: 6px;
    font-size: 16px;
    cursor: pointer;
    display: inline-flex; align-items: center; justify-content: center;
    transition: background .15s, transform .15s;
    line-height: 1;
    font-weight: 700;
}
.hhm-pdf-btn:hover { background: rgba(255,255,255,.22); transform: translateY(-1px); }
.hhm-pdf-btn:active { transform: translateY(0); }
.hhm-pdf-page-info, .hhm-pdf-zoom-info {
    color: #ffffff;
    font-size: 13px;
    font-weight: 600;
    padding: 0 8px;
    min-width: 50px;
    text-align: center;
    font-variant-numeric: tabular-nums;
}
.hhm-pdf-pages {
    flex: 1; min-height: 0;
    overflow: auto;
    padding: 20px;
    display: flex; flex-direction: column; align-items: center;
    gap: 16px;
    background: #4b5563;
}
.hhm-pdf-page {
    display: block;
    box-shadow: 0 4px 16px rgba(0,0,0,.4);
    max-width: 100%;
    height: auto;
    background: #ffffff;
}

@media (max-width: 720px) {
    .hhm-pdf-toolbar { padding: 6px 8px; gap: 8px; }
    .hhm-pdf-btn { width: 28px; height: 28px; font-size: 14px; }
    .hhm-pdf-page-info, .hhm-pdf-zoom-info { font-size: 12px; padding: 0 4px; min-width: auto; }
    .hhm-pdf-pages { padding: 10px; gap: 10px; }
}

/* Actualités */
.hhm-cl-update { border-left:3px solid var(--hhm-cause-color,#8224E3); padding:2px 0 14px 16px; margin-bottom:8px; }
.hhm-cl-update-date { font-size:12px; font-weight:700; color:var(--hhm-muted,#6b7280); text-transform:uppercase; letter-spacing:.04em; }
.hhm-cl-update-title { font-size:16px; font-weight:700; color:var(--hhm-text,#111827); margin:2px 0 4px; }

/* Carte */
.hhm-cl-map { height:340px; border-radius:12px; overflow:hidden; background:#eef; }

/* ── Bottom : partage + bouton don ── */
.hhm-cl-bottom { border-top:1px solid var(--hhm-layout-form-border, var(--hhm-border,#e5e7eb)); padding:14px 24px; background: var(--hhm-layout-form-bg, #fafafb); }

/* Ligne actions : partage à gauche + like à droite */
.hhm-cl-actions { display:flex; align-items:center; justify-content:space-between; gap:14px; margin-bottom:20px; flex-wrap:wrap; }
.hhm-cl-share { display:flex; align-items:center; gap:6px; flex-wrap:wrap; }
.hhm-cl-share-label { font-size:13px; font-weight:700; color:var(--hhm-muted,#6b7280); margin-right:4px; }

/* Boutons partage en style texte (logo + label) — v1.12.61 : hover inversé moderne */
.hhm-cl-share-btn {
  display:inline-flex; align-items:center; gap:6px; padding:6px 12px;
  border-radius:8px; text-decoration:none; font-size:13px; font-weight:600;
  color:var(--share-c, #555); background:color-mix(in srgb, var(--share-c) 12%, transparent);
  transition:background .15s ease, color .15s ease, transform .12s ease, box-shadow .15s ease;
  border: 1.5px solid transparent;
  cursor: pointer;
  font-family: inherit;
  line-height: 1.2;
}
.hhm-cl-share-btn:hover {
  background: var(--share-c, #555);
  color: #ffffff !important;
  transform: translateY(-2px);
  box-shadow: 0 4px 12px rgba(0, 0, 0, .12);
}
.hhm-cl-share-btn .hhm-cl-ico { width:14px; height:14px; }

/* Fallback navigateurs sans color-mix : fond gris translucide */
@supports not (background: color-mix(in srgb, red, blue)) {
  .hhm-cl-share-btn { background:rgba(0,0,0,.06); color:var(--share-c, #444); }
  .hhm-cl-share-btn:hover { background: var(--share-c, #555); color:#fff !important; }
}

/* Bouton like cœur */
.hhm-cl-like {
  display:inline-flex; align-items:center; gap:6px; padding:6px 14px;
  border:1.5px solid #e5e7eb; background:#fff; color:#6b7280;
  border-radius:99px; cursor:pointer; font-size:13px; font-weight:700;
  transition:all .18s ease;
}
.hhm-cl-like .hhm-cl-ico { width:16px; height:16px; transition:transform .2s; }
.hhm-cl-like:hover { border-color:#ef4444; color:#ef4444; }
.hhm-cl-like:hover .hhm-cl-ico { transform:scale(1.15); }
.hhm-cl-like.is-liked { background:#fef2f2; border-color:#ef4444; color:#ef4444; }
.hhm-cl-like.is-liked .hhm-cl-ico { fill:#ef4444; stroke:#ef4444; }
.hhm-cl-like.is-busy { opacity:.6; pointer-events:none; }
.hhm-cl-like-count { font-variant-numeric:tabular-nums; min-width:14px; text-align:left; }

.hhm-cl-donate-btn { width:100%; border:none; cursor:pointer; background: var(--hhm-layout-donate-btn-bg, var(--hhm-gradient)); color: var(--hhm-layout-donate-btn-tx, #fff); font-size:15px; font-weight:800; padding:11px 14px; border-radius:10px; transition:filter .15s,transform .1s; box-shadow:0 4px 14px rgba(80,60,200,.30); }
.hhm-cl-donate-btn:hover { filter:brightness(1.08); transform:translateY(-1px); }

/* Badge catégorie en overlay image */
.hhm-cl-cat-badge {
  position:absolute; top:14px; left:14px; z-index:2;
  display:inline-flex; align-items:center; gap:6px;
  padding:5px 11px; border-radius:99px;
  font-size:12px; font-weight:700; letter-spacing:.02em;
  box-shadow:0 2px 8px rgba(0,0,0,.18);
}
.hhm-cl-cat-badge.is-dark { color:#fff; }
.hhm-cl-cat-badge.is-light { color:#111; }
.hhm-cl-cat-ico { font-size:14px; line-height:1; }

/* Icônes SVG (onglets, partage, like) */
.hhm-cl-ico { width:16px; height:16px; flex-shrink:0; display:inline-block; vertical-align:middle; }
.hhm-cl-tab { gap:7px; }
.hhm-cl-tab .hhm-cl-ico { width:15px; height:15px; }

/* ── Colonne droite : commentaires ── */
.hhm-cl-comments { background:#fff; border:1px solid var(--hhm-border,#e5e7eb); border-radius:18px; overflow:hidden; display:flex; flex-direction:column; box-shadow:0 4px 24px rgba(0,0,0,.06); }
.hhm-cl-comments-head { background:#f4f0fe; border-bottom:1px solid #e5d9fb; padding:14px 18px; display:flex; align-items:center; gap:8px; flex:0 0 auto; }
.hhm-cl-comments-title { font-size:14px; font-weight:700; color:var(--hhm-cause-color,#8224E3); display:inline-flex; align-items:center; gap:6px; }
.hhm-cl-comments-title .hhm-cl-ico { width:16px; height:16px; }
.hhm-cl-comments-count { background:var(--hhm-cause-color,#8224E3); color:#fff; font-size:11px; font-weight:700; padding:2px 8px; border-radius:10px; margin-left:auto; }

/* Tri */
.hhm-cl-comments-sort { display:flex; align-items:center; gap:4px; padding:8px 14px; border-bottom:1px solid #f0f0f4; background:#fafafb; font-size:12px; flex:0 0 auto; flex-wrap:wrap; }
.hhm-cl-sort-label { font-size:11px; font-weight:700; color:#6b7280; text-transform:uppercase; letter-spacing:.04em; margin-right:4px; }
.hhm-cl-sort-btn { background:none; border:1px solid transparent; color:#6b7280; font-size:12px; font-weight:600; padding:3px 8px; border-radius:6px; cursor:pointer; transition:all .15s; }
.hhm-cl-sort-btn:hover { color:var(--hhm-cause-color,#8224E3); }
.hhm-cl-sort-btn.is-active { background:var(--hhm-cause-color,#8224E3); color:#fff; border-color:var(--hhm-cause-color,#8224E3); }

/* Body scrollable */
.hhm-cl-comments-body { padding:14px 14px; flex:1 1 auto; overflow-y:auto; }
.hhm-cl-comments-empty { color:var(--hhm-muted,#6b7280); font-style:italic; text-align:center; margin:0; padding:30px 0; }

/* v1.12.29 : bulles commentaires apaisées — racine rose très pâle (allégé), réponse bleu pâle */
.hhm-cmt {
  display:flex; gap:10px; padding:10px 12px; margin-bottom:8px;
  background:#FEF7FB; /* rose très pâle — allégé v1.12.29 */
  border-left:3px solid #F9A8D4; /* rose accent doux — allégé v1.12.29 */
  border-radius:8px;
}
.hhm-cmt:last-child { margin-bottom:0; }
.hhm-cmt-avatar { flex-shrink:0; width:40px; height:40px; }
.hhm-cmt-avatar-img, .hhm-cmt-avatar img { width:40px !important; height:40px !important; border-radius:50%; display:block; }
.hhm-cmt-avatar-initials { width:40px; height:40px; border-radius:50%; display:inline-flex; align-items:center; justify-content:center; color:#fff; font-weight:700; font-size:13px; letter-spacing:.5px; }
.hhm-cmt-body { flex:1; min-width:0; }
.hhm-cmt-head { display:flex; align-items:baseline; gap:8px; flex-wrap:wrap; margin-bottom:2px; }
/* v1.12.26 : nom de l'auteur en bleu charte (équilibre design avec le violet ailleurs) */
.hhm-cmt-author { font-size:13px; font-weight:700; color:#0072FF; }
.hhm-cmt-date { font-size:11px; color:#9ca3af; }
/* v1.12.26 : contenu commentaire en gris très foncé (plus lisible que #374151) */
.hhm-cmt-content { font-size:13.5px; line-height:1.5; color:#1f2937; word-wrap:break-word; }
.hhm-cmt-content p { margin:0 0 6px; color:#1f2937; }
.hhm-cmt-content p:last-child { margin-bottom:0; }

/* Actions */
.hhm-cmt-actions { display:flex; align-items:center; gap:2px; margin-top:6px; flex-wrap:wrap; }
.hhm-cmt-act { display:inline-flex; align-items:center; gap:3px; background:none; border:none; color:#9ca3af; font-size:11px; font-weight:600; padding:3px 6px; border-radius:5px; cursor:pointer; transition:all .15s; }
/* v1.12.27 : hover des actions en bleu (cohérent avec nom user bleu) au lieu de violet */
.hhm-cmt-act:hover { color:#0072FF; background:rgba(255,255,255,.7); }
.hhm-cmt-act.is-active { color:#0072FF; background:rgba(255,255,255,.85); }
.hhm-cmt-act.is-busy { opacity:.5; pointer-events:none; }
.hhm-cmt-act .hhm-cl-ico { width:13px; height:13px; }
.hhm-cmt-report:hover { color:#f59e0b; }
.hhm-cmt-delete:hover { color:#ef4444; }

/* Réponses imbriquées — bulles bleues pâles, décalage léger */
.hhm-cmt-replies { margin-left:24px; margin-bottom:8px; }
.hhm-cmt-replies .hhm-cmt {
  background:#EFF6FF; /* bleu très pâle */
  border-left:3px solid #0072FF;
  padding:8px 12px;
}
.hhm-cmt.is-reply .hhm-cmt-avatar { width:32px; height:32px; }
.hhm-cmt.is-reply .hhm-cmt-avatar-img, .hhm-cmt.is-reply .hhm-cmt-avatar img { width:32px !important; height:32px !important; }
.hhm-cmt.is-reply .hhm-cmt-avatar-initials { width:32px; height:32px; font-size:11px; }
.hhm-cmt.is-reply .hhm-cmt-act:hover { color:#0072FF; }
.hhm-cmt.is-reply .hhm-cmt-act.is-active { color:#0072FF; }

/* Charger plus */
.hhm-cl-comments-more { padding:10px 14px; text-align:center; border-top:1px solid #f0f0f4; flex:0 0 auto; }
.hhm-cl-comments-more[hidden] { display:none; }
.hhm-cl-load-more { background:none; border:1px solid var(--hhm-cause-color,#8224E3); color:var(--hhm-cause-color,#8224E3); font-size:12px; font-weight:700; padding:6px 14px; border-radius:99px; cursor:pointer; transition:all .15s; }
.hhm-cl-load-more:hover { background:var(--hhm-cause-color,#8224E3); color:#fff; }

/* Formulaire */
.hhm-cl-comments-form { padding:12px 14px; border-top:1px solid #dbeafe; background:#f0f6ff; flex:0 0 auto; }
.hhm-cl-form-row { display:flex; gap:6px; margin-bottom:6px; }
.hhm-cl-form-row input { flex:1; min-width:0; padding:7px 10px; border:1px solid #d1d5db; border-radius:6px; font-size:12px; }
.hhm-cl-form-as { font-size:12px; color:#6b7280; margin-bottom:6px; }
.hhm-cl-comments-form textarea { width:100%; padding:8px 10px; border:1px solid #d1d5db; border-radius:6px; font-size:13px; resize:vertical; font-family:inherit; min-height:60px; }
.hhm-cl-form-foot { display:flex; align-items:center; justify-content:space-between; gap:8px; margin-top:6px; }
.hhm-cl-char-count { font-size:11px; color:#9ca3af; font-variant-numeric:tabular-nums; }
.hhm-cl-char-count.is-warn { color:#ef4444; font-weight:700; }
.hhm-cl-publish-btn { background:var(--hhm-gradient); color:#fff; border:none; font-size:13px; font-weight:700; padding:7px 18px; border-radius:6px; cursor:pointer; transition:filter .15s; }
.hhm-cl-publish-btn:hover { filter:brightness(1.08); }
.hhm-cl-publish-btn:disabled { opacity:.5; cursor:not-allowed; }
.hhm-cl-form-msg { font-size:12px; padding:6px 8px; border-radius:5px; margin-top:6px; }
.hhm-cl-form-msg.is-success { background:#d1fae5; color:#065f46; }
.hhm-cl-form-msg.is-error { background:#fee2e2; color:#991b1b; }
.hhm-cl-form-msg[hidden] { display:none; }
.hhm-cl-reply-indicator { font-size:12px; color:#6b7280; padding:6px 8px; background:#eff6ff; border-radius:5px; margin-bottom:6px; display:flex; align-items:center; gap:8px; }
.hhm-cl-reply-cancel { background:none; border:none; color:#0072FF; font-size:11px; font-weight:600; cursor:pointer; margin-left:auto; }
.hhm-cl-comments-closed { padding:24px 14px; text-align:center; color:#6b7280; font-size:13px; font-style:italic; }

/* ── Accordéons : 4ème zone FIXE dans la carte (entre scroll et bottom) ── */
.hhm-cl-accordions-zone {
  flex:0 0 auto;
  padding:12px 16px 8px;
  border-top:1px solid #f0f0f4;
  background:#fff;
  max-height:40%; /* sécurité : si beaucoup d'accordéons dépliés, ne dépasse pas */
  overflow-y:auto;
}
.hhm-cl-accordions-zone:empty { display:none; } /* si render_accordions retourne '' */
.hhm-cl-accordions { display:flex; flex-direction:column; gap:8px; }
.hhm-cl-acc {
  border:1px solid transparent; border-radius:10px; overflow:hidden;
  background: var(--hhm-layout-acc-header-bg, #fff); transition:box-shadow .18s ease;
}
/* Thèmes pastels légers (définitions consolidées en v1.14.12 plus bas) */
.hhm-cl-acc.theme-amber   { background:#fffbeb; border-color:#fde68a; }
.hhm-cl-acc.is-open { box-shadow:0 2px 6px rgba(0,0,0,.05); }

.hhm-cl-acc-head {
  width:100%; display:flex; align-items:center; gap:10px;
  padding:11px 16px; border:none; background:transparent;
  cursor:pointer; text-align:left;
  font-size:14.5px; font-weight:600; color: var(--hhm-layout-acc-header-color, var(--hhm-layout-title-color, #1f2937));
  transition:background .12s;
}
.hhm-cl-acc-head:hover { background:rgba(0,0,0,.02); }
.hhm-cl-acc-icon { font-size:16px; flex-shrink:0; line-height:1; }
.hhm-cl-acc-title { flex:1; }
.hhm-cl-acc-chevron {
  flex-shrink:0; color:#9ca3af;
  transition:transform .25s ease;
  display:inline-flex; align-items:center;
}
.hhm-cl-acc-chevron svg { width:16px; height:16px; }
.hhm-cl-acc.is-open .hhm-cl-acc-chevron { transform:rotate(180deg); color:#4b5563; }

.hhm-cl-acc-body {
  max-height:0; overflow:hidden;
  transition:max-height .35s ease;
}
.hhm-cl-acc.is-open .hhm-cl-acc-body { max-height:2400px; }
.hhm-cl-acc-inner {
  padding:4px 16px 14px;
  font-family:Arial,Helvetica,sans-serif; font-size:14px; line-height:1.65;
  background: var(--hhm-layout-acc-body-bg, transparent);
  color: var(--hhm-layout-acc-body-color, #111827); /* v1.12.25 : noir profond par défaut (le style inline des span TinyMCE prime naturellement) */
}
.hhm-cl-acc-inner p { margin:0 0 10px; color: var(--hhm-layout-acc-body-color, #111827); }
.hhm-cl-acc-inner p:last-child { margin-bottom:0; }
.hhm-cl-acc-inner h4 { font-size:14px; font-weight:700; margin:12px 0 4px; color: var(--hhm-layout-title-color, #111827); }
.hhm-cl-acc-inner ul, .hhm-cl-acc-inner ol { margin:6px 0 10px; padding-left:20px; }
.hhm-cl-acc-inner li { margin-bottom:3px; }
.hhm-cl-acc-inner a { color:#0072FF; text-decoration:underline; }
.hhm-cl-acc-inner code { background:rgba(0,0,0,.06); padding:1px 6px; border-radius:4px; font-size:13px; }

/* ── Responsive ── */
@media (max-width:900px){
  .hhm-cl-row { grid-template-columns:1fr !important; }
  .hhm-cl-card { height:auto !important; max-height:80vh; }
  .hhm-cl-comments { height:auto !important; max-height:60vh; }
  .hhm-cl-kpi-value { font-size:16px; }
}

/* ═══════════════════════════════════════════════════════════════════════════
   Bandeau donateurs (préfixe hhm-db- pour éviter toute collision)
   ═══════════════════════════════════════════════════════════════════════════ */
.hhm-db-banner {
    margin: 18px 0 0 0;
    padding: 18px 22px;
    background: linear-gradient(135deg, #faf5ff 0%, #eff6ff 100%);
    border: 1px solid #e9d5ff;
    border-radius: 14px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 24px;
    flex-wrap: wrap;
    box-shadow: 0 1px 3px rgba(130, 36, 227, .04);
    position: relative;
}
.hhm-db-avatars {
    display: flex;
    gap: 18px;
    flex-wrap: wrap;
    align-items: flex-start;
}
.hhm-db-card {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 6px;
    min-width: 64px;
}
.hhm-db-avatar {
    width: 52px;
    height: 52px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: 700;
    font-size: 16px;
    overflow: hidden;
    border: 3px solid #fff;
    box-shadow: 0 2px 6px rgba(0,0,0,.08);
    transition: transform .15s ease;
}
.hhm-db-card:hover .hhm-db-avatar {
    transform: translateY(-2px) scale(1.05);
    box-shadow: 0 4px 10px rgba(130, 36, 227, .15);
}
.hhm-db-avatar img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    border-radius: 50%;
}
.hhm-db-initials {
    font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
    letter-spacing: -.02em;
}
.hhm-db-anon-icon {
    font-size: 24px;
    opacity: .55;
    filter: grayscale(1);
}
.hhm-db-name {
    font-size: 12px;
    font-weight: 600;
    color: #4b5563;
    max-width: 80px;
    text-align: center;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.hhm-db-count {
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    gap: 2px;
    margin-left: auto;
    text-align: right;
}
.hhm-db-count-num {
    font-size: 28px;
    font-weight: 800;
    color: #8224E3;
    line-height: 1;
}
.hhm-db-count-label {
    font-size: 13px;
    color: #6b7280;
    font-weight: 500;
    max-width: 200px;
    line-height: 1.4;
}
.hhm-db-banner.is-demo {
    border: 1px dashed #fbbf24;
    background: linear-gradient(135deg, #fffbeb 0%, #fff7ed 100%);
}
.hhm-db-demo-badge {
    position: absolute;
    top: -10px;
    left: 16px;
    background: #f59e0b;
    color: #fff;
    font-size: 11px;
    font-weight: 700;
    padding: 3px 10px;
    border-radius: 999px;
    letter-spacing: .04em;
    box-shadow: 0 2px 6px rgba(245, 158, 11, .3);
    text-transform: uppercase;
}
@media (max-width: 700px) {
    .hhm-db-banner { flex-direction: column; align-items: center; padding: 16px; gap: 14px; }
    .hhm-db-avatars { justify-content: center; gap: 12px; }
    .hhm-db-avatar { width: 46px; height: 46px; font-size: 14px; }
    .hhm-db-name { font-size: 11px; max-width: 70px; }
    .hhm-db-count { align-items: center; text-align: center; margin-left: 0; }
    .hhm-db-count-num { font-size: 24px; }
}

/* ═══════════════════════════════════════════════════════════════════════════
   Bandeau donateurs en OVERLAY sur l'image hero (sous barre progression)
   Fond translucide foncé pour contraster avec l'image
   ═══════════════════════════════════════════════════════════════════════════ */
.hhm-db-banner.hhm-db-overlay {
    margin: 12px 0 0 0;
    padding: 10px 14px;
    background: var(--hhm-donors-banner-bg, rgba(0, 0, 0, 0.30));
    backdrop-filter: blur(var(--hhm-donors-banner-blur, 0px));
    -webkit-backdrop-filter: blur(var(--hhm-donors-banner-blur, 0px));
    border: 1px solid rgba(255, 255, 255, 0.18);
    border-radius: 12px;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.2);
    display: flex;
    align-items: center;
    gap: 14px;
    flex-wrap: wrap;
}

/* Avatars : taille réduite et bordure blanche pour ressortir sur fond foncé */
.hhm-db-banner.hhm-db-overlay .hhm-db-avatars {
    display: flex;
    gap: 10px;
    flex-wrap: wrap;
    align-items: flex-start;
}
.hhm-db-banner.hhm-db-overlay .hhm-db-card {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 4px;
    min-width: 52px;
}
.hhm-db-banner.hhm-db-overlay .hhm-db-avatar {
    width: 38px;
    height: 38px;
    font-size: 13px;
    border: 2px solid rgba(255, 255, 255, 0.9);
}
.hhm-db-banner.hhm-db-overlay .hhm-db-name {
    font-size: 11px;
    color: #fff;
    font-weight: 600;
    text-shadow: 0 1px 2px rgba(0, 0, 0, 0.5);
    max-width: 68px;
}

/* Compteur à droite, texte clair */
.hhm-db-banner.hhm-db-overlay .hhm-db-count {
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    gap: 1px;
    margin-left: auto;
    text-align: right;
}
.hhm-db-banner.hhm-db-overlay .hhm-db-count-num {
    font-size: 22px;
    font-weight: 800;
    color: #fff;
    line-height: 1;
    text-shadow: 0 1px 3px rgba(0, 0, 0, 0.4);
}
.hhm-db-banner.hhm-db-overlay .hhm-db-count-label {
    font-size: 11px;
    color: rgba(255, 255, 255, 0.85);
    font-weight: 500;
    max-width: 160px;
    line-height: 1.3;
    text-shadow: 0 1px 2px rgba(0, 0, 0, 0.5);
}

/* Mode démo : garder le fond noir, seul le badge 🎭 signale la démo */
.hhm-db-banner.hhm-db-overlay.is-demo {
    /* fond identique au mode normal — seul le badge change */
}

/* Responsive */
@media (max-width: 700px) {
    .hhm-db-banner.hhm-db-overlay {
        flex-direction: column;
        align-items: center;
        padding: 10px;
        gap: 10px;
    }
    .hhm-db-banner.hhm-db-overlay .hhm-db-avatars { justify-content: center; }
    .hhm-db-banner.hhm-db-overlay .hhm-db-count { align-items: center; text-align: center; margin-left: 0; }
}

/* ═══════════════════════════════════════════════════════════════════════════
   v1.9.0 — Annuaire des causes [hhm_annuaire]
   Préfixe .hhm-ann- pour ne pas collisionner avec .hhm-cause-card de [hhm_causes]
   ═══════════════════════════════════════════════════════════════════════════ */
/* v1.12.30 : retrait max-width 1280px — laisse le conteneur parent (WPBakery row, etc.) décider de la largeur */
.hhm-ann-wrap { width: 100%; margin: 0; }

/* Bandeau filtres */
.hhm-ann-filters { background: #fff; border: 1px solid var(--hhm-border, #e5e7eb); border-radius: 14px; padding: 16px 18px; margin-bottom: 20px; box-shadow: 0 1px 3px rgba(0,0,0,.03); }

/* v1.9.3 : Bandeau status = flex avec onglets à gauche + CTA "Créer votre cause" à droite */
.hhm-ann-status-bar {
    display: flex;
    align-items: stretch;
    gap: 12px;
    margin: 0 0 18px;
    flex-wrap: wrap;
}
.hhm-ann-status-bar .hhm-ann-status-tabs {
    flex: 1;
    margin-bottom: 0;
    min-width: 0;
}

/* Onglets statut — v1.9.2 : bandeau dégradé bleu→violet, texte blanc */
.hhm-ann-status-tabs {
    display: flex;
    flex-wrap: wrap;
    gap: 0;
    background: var(--hhm-gradient, linear-gradient(135deg, #0072FF 0%, #8224E3 100%));
    border-radius: 12px;
    padding: 6px;
    margin: 0 0 18px;
    box-shadow: 0 4px 16px rgba(130, 36, 227, .15);
}
.hhm-ann-tab {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 9px 18px;
    font-size: 14px;
    font-weight: 600;
    color: rgba(255, 255, 255, .85);
    text-decoration: none;
    border-radius: 8px;
    transition: all .15s ease;
    border: none;
}
.hhm-ann-tab:hover {
    background: rgba(255, 255, 255, .12);
    color: #fff;
}
.hhm-ann-tab.is-active {
    background: rgba(255, 255, 255, .95);
    color: var(--hhm-primary, #8224E3);
    box-shadow: 0 2px 6px rgba(0, 0, 0, .12);
}

/* v1.9.3 : Bouton "Créer votre cause" — pastille blanche à texte violet à droite du bandeau */
.hhm-ann-create-btn {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 10px 20px;
    background: #ffffff;
    color: var(--hhm-primary, #8224E3);
    text-decoration: none;
    border: none; /* v1.12.84 : retire la bordure native du <button> */
    border-radius: 10px;
    font-size: 14px;
    font-weight: 700;
    font-family: inherit;
    letter-spacing: .01em;
    box-shadow: 0 4px 12px rgba(130, 36, 227, .18);
    transition: transform .12s ease, box-shadow .12s ease, filter .12s ease;
    white-space: nowrap;
    cursor: pointer;
}
.hhm-ann-create-btn:focus { outline: none; box-shadow: 0 4px 12px rgba(130, 36, 227, .18), 0 0 0 3px rgba(130, 36, 227, .15); }
.hhm-ann-create-btn:hover {
    transform: translateY(-1px);
    box-shadow: 0 6px 18px rgba(130, 36, 227, .28);
    filter: brightness(1.04);
    color: var(--hhm-primary, #8224E3);
}
.hhm-ann-create-btn span {
    font-size: 18px;
    line-height: 1;
    font-weight: 700;
}

/* Ligne filtres */
.hhm-ann-filter-row { display: flex; flex-wrap: wrap; gap: 10px; align-items: center; }
.hhm-ann-select { padding: 8px 12px; border: 1.5px solid var(--hhm-border, #e5e7eb); border-radius: 8px; background: #fff; font-size: 14px; color: #374151; cursor: pointer; font-family: inherit; min-width: 160px; }
.hhm-ann-select:hover { border-color: var(--hhm-primary, #8224E3); }
.hhm-ann-select:focus { outline: none; border-color: var(--hhm-primary, #8224E3); box-shadow: 0 0 0 3px rgba(130, 36, 227, .12); }

.hhm-ann-search { display: flex; align-items: stretch; border: 1.5px solid var(--hhm-border, #e5e7eb); border-radius: 8px; overflow: hidden; flex: 1; min-width: 200px; max-width: 320px; }
.hhm-ann-search-input { flex: 1; border: none; padding: 8px 12px; font-size: 14px; outline: none; font-family: inherit; }
.hhm-ann-search-btn { background: var(--hhm-gradient, linear-gradient(135deg, #0072FF, #8224E3)); color: #fff; border: none; padding: 0 14px; cursor: pointer; font-size: 16px; }

/* Toggle vue */
.hhm-ann-view-toggle { display: inline-flex; margin-left: auto; border: 1.5px solid var(--hhm-border, #e5e7eb); border-radius: 8px; overflow: hidden; }
.hhm-ann-view-btn { display: inline-flex; align-items: center; justify-content: center; width: 38px; height: 38px; background: #fff; color: #6b7280; text-decoration: none; font-size: 16px; transition: all .12s; border-right: 1px solid var(--hhm-border, #e5e7eb); }
.hhm-ann-view-btn:last-child { border-right: none; }
.hhm-ann-view-btn:hover { background: #faf5ff; color: var(--hhm-primary, #8224E3); }
.hhm-ann-view-btn.is-active { background: var(--hhm-gradient, linear-gradient(135deg, #0072FF, #8224E3)); color: #fff; }

/* Compteur résultats */
.hhm-ann-meta { font-size: 14px; color: #6b7280; margin-bottom: 16px; padding: 0 4px; }
.hhm-ann-meta-sub { margin-left: 6px; color: #9ca3af; }
.hhm-ann-meta strong { color: var(--hhm-primary, #8224E3); }

/* Vide */
.hhm-ann-empty { text-align: center; padding: 60px 20px; color: #6b7280; }
.hhm-ann-empty-icon { font-size: 48px; margin-bottom: 12px; opacity: .5; }
.hhm-ann-empty p { margin: 0 0 16px; font-size: 16px; }
.hhm-ann-empty-reset { display: inline-block; padding: 8px 18px; background: var(--hhm-gradient); color: #fff; border-radius: 8px; text-decoration: none; font-size: 14px; font-weight: 600; }

/* ─── Vues : Grille / Liste / Mosaïque ────────────────────────────────── */
.hhm-ann-cards { display: grid; gap: var(--hhm-cards-gap, 20px); }

/* Vue Grille (par défaut, 3-4 colonnes responsive) */
.hhm-ann-view-grid { grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); }

/* ═══════════════════════════════════════════════════════════════════════
   v1.12.55 — Mode LISTE : carte universelle 3 colonnes (.hhm-card-list)
   Une seule carte, identique quel que soit le layout sélectionné en grille.
   Structure : Image (1) | Contenu principal (2) | Bandeau dégradé HHM (3)
   ═══════════════════════════════════════════════════════════════════════ */

/* Container : 1 colonne, cartes empilées */
.hhm-ann-view-list { grid-template-columns: 1fr; }

/* La carte liste — overrides toute structure de carte grid */
.hhm-card-list {
    display: grid;
    grid-template-columns: 280px 1fr 280px;
    gap: 0;
    background: #ffffff;
    border: 1px solid var(--hhm-ann-border, #e5e7eb);
    border-radius: 12px;
    overflow: hidden;
    transition: transform .15s ease, box-shadow .15s ease;
    min-height: 240px;
}
.hhm-card-list:hover {
    transform: translateY(-2px);
    box-shadow: 0 10px 28px rgba(0,0,0,.08);
}

/* ─── COLONNE 1 — Image plein ───────────────────────────────────────── */
.hhm-card-list-img-wrap {
    position: relative;
    display: block;
    overflow: hidden;
    background: #f3f4f6;
    text-decoration: none;
}
.hhm-card-list-img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
    transition: transform .4s ease;
}
.hhm-card-list:hover .hhm-card-list-img {
    transform: scale(1.04);
}
.hhm-card-list-img-placeholder {
    width: 100%;
    height: 100%;
    min-height: 240px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 56px;
    background: linear-gradient(135deg, #EFF6FF 0%, #F5F3FF 100%);
    color: #c084fc;
}
/* Badge catégorie top-left de l'image */
.hhm-card-list-cat {
    position: absolute;
    top: 12px;
    left: 12px;
    color: #ffffff;
    font-size: 11px;
    font-weight: 700;
    padding: 5px 12px;
    border-radius: 99px;
    text-transform: uppercase;
    letter-spacing: .04em;
    box-shadow: 0 2px 8px rgba(0,0,0,.18);
    z-index: 2;
}

/* ─── COLONNE 2 — Contenu principal ──────────────────────────────────── */
.hhm-card-list-main {
    padding: 22px 24px 20px;
    display: flex;
    flex-direction: column;
    gap: 10px;
    min-width: 0; /* permet ellipsis interne */
    justify-content: center;
}

.hhm-card-list-title {
    font-size: 19px;
    font-weight: 800;
    line-height: 1.3;
    margin: 0;
    font-family: Arial, Helvetica, sans-serif;
}
.hhm-card-list-title a {
    color: #111827;
    text-decoration: none;
    background-image: linear-gradient(135deg, #0072FF 0%, #8224E3 100%);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    transition: -webkit-text-fill-color .15s, color .15s;
}
.hhm-card-list-title a:hover {
    color: #8224E3;
    -webkit-text-fill-color: #8224E3;
    background-image: none;
}

.hhm-card-list-excerpt {
    font-size: 16px;
    line-height: 1.6;
    color: #374151;
    margin: 0;
    font-family: Arial, Helvetica, sans-serif;
    display: -webkit-box;
    -webkit-line-clamp: 6;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

/* Barre de progression avec % à droite */
.hhm-card-list-progress-wrap {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-top: 4px;
}
.hhm-card-list-progress {
    flex: 1;
    height: 8px;
    background: #f3f4f6;
    border-radius: 99px;
    overflow: hidden;
}
.hhm-card-list-progress-bar {
    height: 100%;
    border-radius: 99px;
    transition: width .6s ease;
    background: var(--hhm-ann-progress, linear-gradient(90deg, #0072FF, #8224E3));
    min-width: 4px;
}
.hhm-card-list-pct {
    font-size: 15px;
    font-weight: 800;
    color: #0072FF;
    font-variant-numeric: tabular-nums;
    min-width: 42px;
    text-align: right;
}

/* Stats inline horizontales */
.hhm-card-list-stats {
    display: flex;
    flex-wrap: wrap;
    gap: 18px;
    margin-top: 4px;
}
.hhm-card-list-stat {
    display: flex;
    flex-direction: column;
    gap: 1px;
}
.hhm-card-list-stat-label {
    font-size: 12px;
    color: #6b7280;
    text-transform: uppercase;
    letter-spacing: .06em;
    font-weight: 700;
}
.hhm-card-list-stat strong {
    font-size: 18px;
    font-weight: 800;
    font-variant-numeric: tabular-nums;
    font-family: Arial, Helvetica, sans-serif;
}
.hhm-card-list-stat-raised { color: #8224E3; }
.hhm-card-list-stat-goal   { color: #6B1FB8; }
.hhm-card-list-stat-donors { color: #0072FF; }

/* Meta : auteur · durée */
.hhm-card-list-meta {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 8px;
    font-size: 13px;
    color: #6b7280;
    margin-top: 6px;
    padding-top: 10px;
    border-top: 1px solid #f3f4f6;
}
.hhm-card-list-meta-prefix {
    font-style: italic;
    color: #9ca3af;
}
.hhm-card-list-meta-author strong {
    color: #374151;
    font-weight: 700;
}
.hhm-card-list-meta-sep {
    color: #d1d5db;
    font-weight: 700;
}
.hhm-card-list-meta-time {
    font-weight: 600;
}

/* ─── COLONNE 3 — Bandeau dégradé HHM avec message + CTA ──────────────── */
.hhm-card-list-aside {
    background: linear-gradient(135deg, #0072FF 0%, #8224E3 100%);
    padding: 24px 22px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    gap: 18px;
    text-align: center;
    position: relative;
    overflow: hidden;
}
/* Petite décoration discrète : cercle blanc transparent en arrière-plan */
.hhm-card-list-aside::before {
    content: '';
    position: absolute;
    top: -40px;
    right: -40px;
    width: 140px;
    height: 140px;
    border-radius: 50%;
    background: rgba(255, 255, 255, .08);
    pointer-events: none;
}
.hhm-card-list-aside::after {
    content: '';
    position: absolute;
    bottom: -30px;
    left: -30px;
    width: 100px;
    height: 100px;
    border-radius: 50%;
    background: rgba(255, 255, 255, .06);
    pointer-events: none;
}

.hhm-card-list-message {
    color: #ffffff;
    font-size: 17px;
    line-height: 1.55;
    font-weight: 700;
    margin: 0;
    font-family: Arial, Helvetica, sans-serif;
    text-shadow: 0 1px 2px rgba(0, 0, 0, .15);
    position: relative;
    z-index: 1;
}

.hhm-card-list-cta {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    padding: 9px 16px;
    background: #ffffff;
    color: #8224E3 !important;
    text-decoration: none;
    border-radius: 99px;
    font-size: 12px;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: .04em;
    transition: transform .15s ease, box-shadow .15s ease, color .15s ease;
    box-shadow: 0 4px 14px rgba(0, 0, 0, .15);
    position: relative;
    z-index: 1;
    font-family: Arial, Helvetica, sans-serif;
}
.hhm-card-list-cta:hover {
    transform: translateY(-2px);
    box-shadow: 0 8px 22px rgba(0, 0, 0, .22);
    color: #0072FF !important;
}
.hhm-card-list-cta span {
    font-size: 13px;
    transition: transform .15s;
}
.hhm-card-list-cta:hover span {
    transform: translateX(4px);
}

/* ─── RESPONSIVE ────────────────────────────────────────────────────── */
/* Tablette : 2 colonnes (image + contenu/aside empilés à droite) */
@media (max-width: 980px) {
    .hhm-card-list {
        grid-template-columns: 220px 1fr;
        grid-template-rows: auto auto;
    }
    .hhm-card-list-img-wrap {
        grid-row: 1 / 3;
    }
    .hhm-card-list-aside {
        padding: 18px 20px;
    }
}

/* Mobile : 1 colonne (image dessus, contenu, aside dessous) */
@media (max-width: 640px) {
    .hhm-card-list {
        grid-template-columns: 1fr;
        grid-template-rows: auto auto auto;
        min-height: 0;
    }
    .hhm-card-list-img-wrap {
        grid-row: auto;
        height: 200px;
    }
    .hhm-card-list-aside {
        padding: 20px;
    }
    .hhm-card-list-main {
        padding: 18px 20px;
    }
    .hhm-card-list-title { font-size: 17px; }
    .hhm-card-list-excerpt { -webkit-line-clamp: 4; }
}

/* ═══════════════════════════════════════════════════════════════════════ */


/* ─── Carte commune (grille/liste/mosaïque partagent base) ─────────────── */
/* v1.12.32 : variables CSS pilotées depuis les réglages admin (color pickers annuaire) */
/* v1.12.44 : on ne définit AUCUN défaut ici — les variables ne sont définies que via
   le style inline généré par PHP quand l'admin choisit une couleur. Sinon, les
   fallbacks dans var(--hhm-ann-X, fallback) sont utilisés (différents selon layout). */
.hhm-ann-wrap {
    --hhm-ann-border: #e5e7eb;
}

/* v1.12.40 : Hauteur des cartes (transverse à tous les layouts) */
/* COMPACT — dense, image plus petite, padding réduit */
.hhm-ann-height-compact .hhm-ann-card-img-wrap,
.hhm-ann-height-compact .hhm-card-anneau-img-wrap,
.hhm-ann-height-compact .hhm-card-vague-img-wrap { aspect-ratio: 16/8; }
.hhm-ann-height-compact .hhm-ann-card-body,
.hhm-ann-height-compact .hhm-card-vague-body { padding: 12px 14px 14px; }
.hhm-ann-height-compact .hhm-card-anneau-body { padding: 42px 14px 14px; }
.hhm-ann-height-compact .hhm-card-fullbg { aspect-ratio: 4/5; }
.hhm-ann-height-compact .hhm-ann-card-title,
.hhm-ann-height-compact .hhm-card-fullbg-title { font-size: 14px; }
.hhm-ann-height-compact .hhm-ann-card-excerpt,
.hhm-ann-height-compact .hhm-card-fullbg-excerpt { font-size: 12.5px; }

/* CONFORTABLE — défaut actuel, ne change rien */

/* SPACIEUX — image grande, padding généreux, texte plus aéré */
.hhm-ann-height-spacieux .hhm-ann-card-img-wrap,
.hhm-ann-height-spacieux .hhm-card-anneau-img-wrap,
.hhm-ann-height-spacieux .hhm-card-vague-img-wrap { aspect-ratio: 4/3; }
.hhm-ann-height-spacieux .hhm-ann-card-body,
.hhm-ann-height-spacieux .hhm-card-vague-body { padding: 24px 22px 22px; }
.hhm-ann-height-spacieux .hhm-card-anneau-body { padding: 56px 22px 22px; }
.hhm-ann-height-spacieux .hhm-card-fullbg { aspect-ratio: 3/5; }
.hhm-ann-height-spacieux .hhm-ann-card-title,
.hhm-ann-height-spacieux .hhm-card-fullbg-title { font-size: 18px; }
.hhm-ann-height-spacieux .hhm-ann-card-excerpt,
.hhm-ann-height-spacieux .hhm-card-fullbg-excerpt { font-size: 14.5px; line-height: 1.6; }
.hhm-ann-height-spacieux .hhm-card-fullbg-content { padding: 26px 22px 22px; gap: 10px; }

/* Quand l'admin renseigne une couleur unie pour progression/cta, on l'utilise comme background-color
   (les CSS variables custom sont des couleurs unies, le fallback reste le dégradé) */

.hhm-ann-card { background: #fff; border: 1px solid var(--hhm-ann-border, #e5e7eb); border-radius: 12px; overflow: hidden; transition: transform .15s ease, box-shadow .15s ease; }
.hhm-ann-card:hover { transform: translateY(-2px); box-shadow: 0 8px 24px rgba(0,0,0,.08); }

.hhm-ann-card-img-wrap { position: relative; display: block; aspect-ratio: 16/9; background: #f3f4f6; overflow: hidden; }
.hhm-ann-card-img { width: 100%; height: 100%; object-fit: cover; transition: transform .3s ease; }
.hhm-ann-card:hover .hhm-ann-card-img { transform: scale(1.04); }
.hhm-ann-card-img-placeholder { width: 100%; height: 100%; display: flex; align-items: center; justify-content: center; font-size: 40px; color: #d1d5db; }
.hhm-ann-card-cat { position: absolute; top: 12px; left: 12px; color: #fff; padding: 4px 10px; border-radius: 99px; font-size: 11px; font-weight: 700; box-shadow: 0 2px 6px rgba(0,0,0,.2); }

.hhm-ann-card-body { padding: 16px 18px; }
/* v1.12.30 : titre noir + hover dégradé bleu→violet via background-clip text */
/* v1.12.32 : couleur titre personnalisable via --hhm-ann-title */
/* v1.12.38 : INVERSION — dégradé par défaut, violet au hover (sur tous les layouts) */
/* v1.12.41 : fix — quand --hhm-ann-title est définie, on l'utilise comme couleur unie (override du dégradé) */

/* v1.12.56 : Auteur de la cause sur les cartes (style discret universel) */
.hhm-ann-card-author {
    font-size: 11px;
    color: #6b7280;
    text-transform: uppercase;
    letter-spacing: .08em;
    font-weight: 600;
    margin: 0 0 6px;
    font-family: Arial, Helvetica, sans-serif;
    line-height: 1.2;
}
.hhm-ann-card-author strong {
    color: #374151;
    font-weight: 700;
    letter-spacing: .04em;
    text-transform: none;
}

.hhm-ann-card-title { font-size: 16px; font-weight: 700; margin: 0 0 8px; line-height: 1.3; }
.hhm-ann-card-title a {
    text-decoration: none;
    transition: color .15s, -webkit-text-fill-color .15s;
    /* Par défaut : dégradé bleu→violet via background-clip */
    color: var(--hhm-ann-title, transparent);
    background-image: var(--hhm-ann-title-bg, linear-gradient(135deg, #0072FF 0%, #8224E3 100%));
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: var(--hhm-ann-title-fill, transparent);
}
.hhm-ann-card-title a:hover {
    color: var(--hhm-ann-title-hover, #8224E3);
    background-image: none;
    -webkit-text-fill-color: var(--hhm-ann-title-hover, #8224E3);
}
/* v1.12.30 : description en noir profond pour bonne lisibilité */
/* v1.12.32 : couleur description personnalisable */
.hhm-ann-card-excerpt { font-size: 13.5px; color: var(--hhm-ann-excerpt, #111827); margin: 0 0 12px; line-height: 1.5; display: -webkit-box; -webkit-box-orient: vertical; overflow: hidden; }

.hhm-ann-card-progress { height: 6px; background: #f3f4f6; border-radius: 99px; overflow: hidden; margin: 10px 0 10px; }
/* v1.9.2 : barre en dégradé bleu→violet (au lieu de couleur catégorie) */
/* v1.12.32 : couleur personnalisable — si --hhm-ann-progress = couleur unie, l'override fonctionne */
.hhm-ann-card-progress-bar { height: 100%; border-radius: 99px; transition: width .6s ease; min-width: 2px; background: var(--hhm-ann-progress, var(--hhm-gradient, linear-gradient(135deg, #0072FF 0%, #8224E3 100%))); }

.hhm-ann-card-stats { display: flex; justify-content: space-between; gap: 10px; margin-top: 8px; }
.hhm-ann-card-stat { display: flex; flex-direction: column; gap: 1px; font-size: 12px; color: #6b7280; }
.hhm-ann-card-stat strong { font-size: 15px; font-weight: 800; color: var(--hhm-text, #111827); }
.hhm-ann-card-stat-right { text-align: right; }
.hhm-ann-card-stat-right strong { color: var(--hhm-primary, #8224E3); }

.hhm-ann-card-time { margin-top: 10px; padding-top: 10px; border-top: 1px solid #f3f4f6; font-size: 12px; color: #6b7280; font-weight: 600; }

/* v1.9.2 : Bouton "Faire un don" en dégradé bleu→violet */
/* v1.12.32 : couleur personnalisable via --hhm-ann-cta */
.hhm-ann-card-cta {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    margin-top: 14px;
    padding: 10px 16px;
    background: var(--hhm-ann-cta, var(--hhm-gradient, linear-gradient(135deg, #0072FF 0%, #8224E3 100%)));
    color: #fff;
    text-decoration: none;
    border-radius: 8px;
    font-size: 14px;
    font-weight: 700;
    transition: transform .12s ease, box-shadow .12s ease, filter .12s ease;
    box-shadow: 0 3px 10px rgba(130, 36, 227, .25);
}
.hhm-ann-card-cta:hover {
    transform: translateY(-1px);
    box-shadow: 0 5px 14px rgba(130, 36, 227, .35);
    filter: brightness(1.05);
    color: #fff;
}
.hhm-ann-card-cta span { font-size: 16px; transition: transform .15s; }
.hhm-ann-card-cta:hover span { transform: translateX(3px); }

/* ═══════════════════════════════════════════════════════════════════════
   v1.12.52 — Layout : Badge ancré + médias
   ═══════════════════════════════════════════════════════════════════════ */

.hhm-card-badge {
    display: flex;
    flex-direction: column;
    height: 100%;
    overflow: visible !important; /* badge doit déborder */
}

.hhm-card-badge-img-wrap {
    position: relative;
    display: block;
    aspect-ratio: 16/9;
    background: #f3f4f6;
    overflow: visible !important;
    border-radius: 12px 12px 0 0;
}
.hhm-card-badge-img-wrap .hhm-ann-card-img,
.hhm-card-badge-img-wrap .hhm-ann-card-img-placeholder {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
    border-radius: 12px 12px 0 0;
    transition: transform .4s ease;
}
.hhm-card-badge:hover .hhm-card-badge-img-wrap .hhm-ann-card-img {
    transform: scale(1.04);
}

/* Compteur médias top-right glassmorphism */
.hhm-card-badge-media {
    position: absolute;
    top: 12px;
    right: 12px;
    z-index: 3;
    display: flex;
    gap: 6px;
    flex-wrap: wrap;
}
.hhm-card-badge-media-item {
    background: rgba(0, 0, 0, .55);
    color: #ffffff;
    font-size: 11px;
    font-weight: 700;
    padding: 5px 10px;
    border-radius: 99px;
    backdrop-filter: blur(6px);
    -webkit-backdrop-filter: blur(6px);
    letter-spacing: .02em;
    box-shadow: 0 2px 6px rgba(0,0,0,.15);
}

/* Badge ancré centré horizontalement chevauchant le body */
/* v1.12.53 : centré (left:50% + translateX) + bordure blanche plus fine (3px → 2px) */
.hhm-card-badge-anchor {
    position: absolute;
    bottom: -22px;
    left: 50%;
    transform: translateX(-50%);
    z-index: 4;
    display: inline-flex;
    align-items: baseline;
    gap: 6px;
    padding: 10px 16px;
    background: var(--hhm-ann-cta, linear-gradient(135deg, #0072FF 0%, #8224E3 100%));
    color: #ffffff;
    border-radius: 99px;
    box-shadow: 0 6px 18px rgba(130, 36, 227, .35);
    border: 2px solid #ffffff;
    font-family: Arial, Helvetica, sans-serif;
    white-space: nowrap;
}
.hhm-card-badge-pct {
    font-size: 18px;
    font-weight: 800;
    line-height: 1;
    font-variant-numeric: tabular-nums;
    color: #ffffff;
}
.hhm-card-badge-label {
    font-size: 9px;
    font-weight: 800;
    letter-spacing: .12em;
    text-transform: uppercase;
    line-height: 1;
    color: rgba(255,255,255,.95);
}

/* Body : padding-top suffisant pour ne pas chevaucher le badge ancré */
.hhm-card-badge-body {
    flex: 1 1 auto;
    padding: 30px 20px 18px;
    display: flex;
    flex-direction: column;
}

/* Catégorie discrète "par [cat]" */
.hhm-card-badge-cat {
    display: flex;
    align-items: center;
    gap: 6px;
    font-size: 11px;
    color: #6b7280;
    font-weight: 600;
    margin-bottom: 8px;
    text-transform: lowercase;
}
.hhm-card-badge-cat-prefix {
    color: #9ca3af;
    font-style: italic;
}
.hhm-card-badge-cat-dot {
    width: 6px;
    height: 6px;
    border-radius: 50%;
}
.hhm-card-badge-cat-name {
    color: #374151;
    font-weight: 700;
}

/* Stats inline simple */
.hhm-card-badge-stats {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 12px;
    margin: 10px 0 6px;
    font-family: Arial, Helvetica, sans-serif;
    font-size: 13px;
}
.hhm-card-badge-stats strong {
    font-weight: 800;
    font-variant-numeric: tabular-nums;
}
.hhm-card-badge-stats small {
    color: #6b7280;
    font-size: 11px;
    font-weight: 600;
}
.hhm-card-badge-stat-raised strong { color: #0072FF; }
.hhm-card-badge-stat-goal strong   { color: #8224E3; }

.hhm-card-badge-progress {
    margin: 4px 0 12px !important;
    height: 6px !important;
}

.hhm-card-badge-time {
    font-size: 12px;
    color: #6b7280;
    font-weight: 600;
    margin-bottom: 12px;
}

.hhm-card-badge-cta {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    margin-top: auto;
    padding: 11px 18px;
    background: var(--hhm-ann-cta, var(--hhm-gradient, linear-gradient(135deg, #0072FF 0%, #8224E3 100%)));
    color: #ffffff !important;
    text-decoration: none;
    border-radius: 8px;
    font-size: 13px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .04em;
    transition: transform .12s ease, box-shadow .12s ease, filter .12s ease;
    box-shadow: 0 3px 10px rgba(130, 36, 227, .25);
}
.hhm-card-badge-cta:hover {
    transform: translateY(-1px);
    box-shadow: 0 5px 14px rgba(130, 36, 227, .35);
    filter: brightness(1.05);
    color: #ffffff !important;
}
.hhm-card-badge-cta span {
    font-size: 15px;
    transition: transform .15s;
}
.hhm-card-badge-cta:hover span {
    transform: translateX(3px);
}

/* ═══════════════════════════════════════════════════════════════════════ */


   ═══════════════════════════════════════════════════════════════════════ */

.hhm-card-popular {
    display: flex;
    flex-direction: column;
    height: 100%;
}

.hhm-card-popular-img-wrap {
    position: relative;
    display: block;
    aspect-ratio: 16/10;
    background: #f3f4f6;
    overflow: hidden;
}
.hhm-card-popular-img-wrap .hhm-ann-card-img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform .4s ease;
}
.hhm-card-popular:hover .hhm-card-popular-img-wrap .hhm-ann-card-img {
    transform: scale(1.03);
}

/* Tag catégorie style "subtle" top-left */
.hhm-card-popular-tag {
    position: absolute;
    top: 12px;
    left: 12px;
    color: #ffffff;
    font-size: 11px;
    font-weight: 700;
    padding: 5px 12px;
    border-radius: 6px;
    text-transform: uppercase;
    letter-spacing: .04em;
    box-shadow: 0 2px 8px rgba(0,0,0,.15);
    z-index: 2;
}

/* Body : titre + description */
.hhm-card-popular-body {
    flex: 1 1 auto;
    padding: 18px 20px 16px;
    display: flex;
    flex-direction: column;
}
.hhm-card-popular-excerpt {
    margin-bottom: 0 !important;
}

/* Bandeau pied teinté regroupant tout */
/* v1.12.50 : bleu clair plus visible (#EFF6FF = blue-50 Tailwind) au lieu du gris bleuté */
/* v1.12.51 : bleu plus léger encore (#F5F9FF = entre blue-50 et white) */
.hhm-card-popular-footer {
    padding: 16px 20px 18px;
    background: #F5F9FF;
    border-top: 1px solid #E5EEFB;
    display: flex;
    flex-direction: column;
    gap: 12px;
}

/* Stats horizontales avec séparateurs verticaux */
.hhm-card-popular-stats {
    display: flex;
    gap: 0;
}
.hhm-card-popular-stat {
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: 2px;
    text-align: center;
    padding: 0 4px;
    min-width: 0;
}
/* Séparateurs verticaux entre les stats — v1.12.50 : bleu pâle assorti au fond */
.hhm-card-popular-stat + .hhm-card-popular-stat {
    border-left: 1px solid #BFDBFE;
}
.hhm-card-popular-stat strong {
    font-size: 16px;
    font-weight: 800;
    line-height: 1.1;
    font-variant-numeric: tabular-nums;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    color: #111827;
}
.hhm-card-popular-stat span {
    font-size: 10px;
    font-weight: 700;
    color: #6b7280;
    text-transform: uppercase;
    letter-spacing: .06em;
}
/* Couleurs charte sur les valeurs */
.hhm-card-popular-stat-pct    { color: #0072FF !important; }
.hhm-card-popular-stat-raised { color: #8224E3 !important; }
.hhm-card-popular-stat-donors { color: #6B1FB8 !important; }

/* Barre de progression dans le pied teinté */
.hhm-card-popular-progress {
    height: 5px !important;
    margin: 0 !important;
    background: #ffffff !important; /* fond blanc pour ressortir sur bleu pâle */
}

/* Temps restant */
.hhm-card-popular-time {
    font-size: 12px;
    color: #6b7280;
    font-weight: 600;
    text-align: center;
}

/* CTA pill pleine largeur arrondi */
.hhm-card-popular-cta {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    padding: 11px 18px;
    background: var(--hhm-ann-cta, var(--hhm-gradient, linear-gradient(135deg, #0072FF 0%, #8224E3 100%)));
    color: #ffffff !important;
    text-decoration: none;
    border-radius: 99px; /* pill complet */
    font-size: 13px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .04em;
    box-shadow: 0 3px 10px rgba(130, 36, 227, .22);
    transition: transform .15s ease, box-shadow .15s ease, filter .15s ease;
}
.hhm-card-popular-cta:hover {
    transform: translateY(-1px);
    box-shadow: 0 6px 16px rgba(130, 36, 227, .32);
    filter: brightness(1.05);
    color: #ffffff !important;
}
.hhm-card-popular-cta span {
    font-size: 15px;
    transition: transform .15s;
}
.hhm-card-popular-cta:hover span {
    transform: translateX(4px);
}

/* ═══════════════════════════════════════════════════════════════════════ */


   ═══════════════════════════════════════════════════════════════════════ */

.hhm-card-edito {
    display: flex;
    flex-direction: column;
    height: 100%;
    background: #fdfdfb; /* blanc cassé, papier */
}

.hhm-card-edito-img-wrap {
    position: relative;
    display: block;
    aspect-ratio: 16/10;
    background: #f3f4f6;
    overflow: hidden;
}
.hhm-card-edito-img-wrap .hhm-ann-card-img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform .4s ease;
    filter: contrast(1.02) saturate(.95);
}
.hhm-card-edito:hover .hhm-card-edito-img-wrap .hhm-ann-card-img {
    transform: scale(1.03);
    filter: contrast(1.05) saturate(1);
}

/* v1.12.47 : Ruban configurable — 3 positions
   La couleur de fond est appliquée en style inline depuis le PHP */
.hhm-card-edito-ribbon {
    position: absolute;
    color: #ffffff;
    font-size: 10px;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: .12em;
    box-shadow: 0 2px 8px rgba(0,0,0,.18);
    z-index: 3;
    font-family: Arial, Helvetica, sans-serif;
}
/* Position 1 : Haut-droite diagonal */
.hhm-card-edito-ribbon-top-right {
    top: 18px;
    right: -34px;
    transform: rotate(45deg);
    width: 150px;
    text-align: center;
    padding: 5px 0;
}
/* Position 2 : Haut-gauche diagonal */
.hhm-card-edito-ribbon-top-left {
    top: 18px;
    left: -34px;
    transform: rotate(-45deg);
    width: 150px;
    text-align: center;
    padding: 5px 0;
}
/* Position 3 : Bandeau horizontal top */
.hhm-card-edito-ribbon-banner {
    top: 0;
    left: 0;
    right: 0;
    width: 100%;
    text-align: center;
    padding: 8px 12px;
    transform: none;
}

.hhm-card-edito-body {
    flex: 1 1 auto;
    padding: 20px 22px 22px;
    display: flex;
    flex-direction: column;
    /* v1.12.46 : tout le body en sans-serif (sauf titre qui garde serif) */
    font-family: Arial, Helvetica, sans-serif;
}

.hhm-card-edito-rubrique {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 11px;
    font-weight: 700;
    color: #6b7280;
    text-transform: uppercase;
    letter-spacing: .12em;
    margin-bottom: 10px;
    font-family: Arial, Helvetica, sans-serif;
    flex-wrap: wrap;
}
/* v1.12.54 : auteur "par X" style discret après catégorie */
.hhm-card-edito-rubrique-author {
    text-transform: none;
    letter-spacing: 0;
    color: #9ca3af;
    font-weight: 600;
    font-style: italic;
    margin-left: auto;
}
.hhm-card-edito-rubrique-dot {
    width: 8px;
    height: 8px;
    border-radius: 50%;
    flex-shrink: 0;
}

/* Le titre garde son serif Georgia (touche magazine) */
.hhm-card-edito-title {
    font-family: Georgia, 'Times New Roman', serif !important;
    font-size: 20px !important;
    font-weight: 700 !important;
    line-height: 1.25 !important;
    margin: 0 0 14px !important;
}
.hhm-card-edito-title a {
    font-family: inherit;
}

.hhm-card-edito-divider {
    height: 2px;
    width: 40px;
    background: linear-gradient(90deg, #0072FF, #8224E3);
    margin: 0 0 14px;
    border-radius: 2px;
}

/* v1.12.46 : description en sans-serif (Arial) au lieu de Georgia */
.hhm-card-edito-excerpt {
    font-size: 14px !important;
    line-height: 1.6 !important;
    color: #374151 !important;
    margin: 0 0 18px !important;
    font-family: Arial, Helvetica, sans-serif !important;
}

/* v1.12.46 : Stats — chiffres réduits + sans-serif pour éviter le débordement sur 2 lignes */
.hhm-card-edito-stats {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    gap: 12px;
    padding: 14px 0;
    border-top: 1px solid #e5e7eb;
    border-bottom: 1px solid #e5e7eb;
    margin-bottom: 14px;
}
.hhm-card-edito-stat {
    display: flex;
    flex-direction: column;
    gap: 3px;
    text-align: center;
    min-width: 0; /* permet au texte de tronquer si nécessaire */
}
.hhm-card-edito-stat strong {
    font-size: 14px;
    font-weight: 800;
    color: #111827; /* défaut, override par classes spécifiques ci-dessous */
    font-family: Arial, Helvetica, sans-serif; /* v1.12.46 : sans-serif pour compacité */
    font-variant-numeric: tabular-nums;
    line-height: 1.2;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
/* v1.12.48 : couleurs par défaut sur les valeurs (bleu pour %, violet pour montants) */
.hhm-card-edito-stat-pct strong    { color: #0072FF; }
.hhm-card-edito-stat-raised strong { color: #8224E3; }
.hhm-card-edito-stat-goal strong   { color: #6B1FB8; }
.hhm-card-edito-stat span {
    font-size: 10px;
    font-weight: 700;
    color: #6b7280;
    text-transform: uppercase;
    letter-spacing: .08em;
    font-family: Arial, Helvetica, sans-serif;
}

/* v1.12.46 : barre plus épaisse (3px → 8px) */
.hhm-card-edito-progress {
    height: 8px !important;
    margin: 0 0 16px !important;
}

/* v1.12.46 : durée plus grosse + sans-serif */
.hhm-card-edito-time {
    font-size: 13px;
    color: #374151;
    font-weight: 600;
    margin-bottom: 16px;
    font-family: Arial, Helvetica, sans-serif;
    font-style: normal;
}

/* v1.12.46 : CTA inversé — par défaut DÉGRADÉ bleu→violet + texte blanc, hover passe en violet uni */
.hhm-card-edito-cta {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    margin-top: auto;
    padding: 13px 18px;
    background: var(--hhm-ann-cta, linear-gradient(135deg, #0072FF 0%, #8224E3 100%));
    border: 2px solid transparent;
    color: #ffffff !important;
    text-decoration: none;
    border-radius: 0;
    font-size: 12px;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: .12em;
    transition: background .25s ease, color .2s ease, transform .15s ease;
    font-family: Arial, Helvetica, sans-serif;
    box-shadow: 0 3px 10px rgba(130, 36, 227, .25);
}
.hhm-card-edito-cta:hover {
    background: var(--hhm-ann-title-hover, #8224E3);
    color: #ffffff !important;
    filter: brightness(1.05);
}
.hhm-card-edito-cta span {
    font-size: 15px;
    transition: transform .15s;
}
.hhm-card-edito-cta:hover span {
    transform: translateX(4px);
}

/* ═══════════════════════════════════════════════════════════════════════ */

/* ═══════════════════════════════════════════════════════════════════════
   v1.12.39 — Layout : Plein-cadre sombre
   ═══════════════════════════════════════════════════════════════════════ */

.hhm-card-fullbg {
    position: relative;
    aspect-ratio: 3/4; /* portrait immersif */
    border-radius: 12px;
    overflow: hidden;
    background: #111827;
    height: auto !important;
    transition: transform .25s ease, box-shadow .25s ease;
}
.hhm-card-fullbg:hover {
    transform: translateY(-3px);
    box-shadow: 0 14px 40px rgba(0,0,0,.35);
}

/* Le lien englobe toute la carte → carte cliquable partout */
.hhm-card-fullbg-link {
    position: absolute;
    inset: 0;
    text-decoration: none;
    color: inherit;
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
}

/* Image plein cadre */
.hhm-card-fullbg-img-wrap {
    position: absolute;
    inset: 0;
    overflow: hidden;
    z-index: 1;
}
.hhm-card-fullbg-img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
    transition: transform .6s ease;
}
.hhm-card-fullbg:hover .hhm-card-fullbg-img {
    transform: scale(1.06);
}
.hhm-card-fullbg-img-placeholder {
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 64px;
    background: linear-gradient(135deg, #0072FF 0%, #8224E3 100%);
    color: rgba(255,255,255,.5);
}

/* Overlay dégradé : transparent en haut, noir vers le bas pour lisibilité */
.hhm-card-fullbg-overlay {
    position: absolute;
    inset: 0;
    background: linear-gradient(
        to bottom,
        rgba(0,0,0,.15) 0%,
        rgba(0,0,0,.25) 35%,
        rgba(0,0,0,.78) 75%,
        rgba(0,0,0,.92) 100%
    );
    z-index: 2;
    transition: background .25s ease;
}
.hhm-card-fullbg:hover .hhm-card-fullbg-overlay {
    background: linear-gradient(
        to bottom,
        rgba(0,0,0,.08) 0%,
        rgba(0,0,0,.18) 35%,
        rgba(0,0,0,.72) 75%,
        rgba(0,0,0,.88) 100%
    );
}

/* Badge catégorie top-left (différent des autres layouts) */
.hhm-card-fullbg-cat {
    position: absolute;
    top: 14px;
    left: 14px;
    color: #fff;
    font-size: 11px;
    font-weight: 700;
    padding: 5px 12px;
    border-radius: 99px;
    text-transform: uppercase;
    letter-spacing: .04em;
    box-shadow: 0 2px 8px rgba(0,0,0,.25);
    z-index: 4;
    backdrop-filter: blur(4px);
}

/* Contenu en overlay sur l'image */
.hhm-card-fullbg-content {
    position: relative;
    z-index: 3;
    padding: 20px 18px 18px;
    color: #ffffff;
    display: flex;
    flex-direction: column;
    gap: 8px;
    margin-top: auto; /* pousse tout vers le bas */
}

.hhm-card-fullbg-time {
    font-size: 12px;
    font-weight: 600;
    color: rgba(255,255,255,.85);
    background: rgba(255,255,255,.12);
    padding: 4px 10px;
    border-radius: 99px;
    align-self: flex-start;
    backdrop-filter: blur(4px);
    margin-bottom: 4px;
}

/* v1.12.42 : le titre est un <h3> à l'intérieur d'un <a class="hhm-card-fullbg-link">
   Le thème WordPress peut injecter des règles "a h3" qui prennent le dessus.
   On utilise donc des sélecteurs très spécifiques + !important pour assurer la priorité. */
.hhm-ann-wrap .hhm-card-fullbg .hhm-card-fullbg-link .hhm-card-fullbg-title,
.hhm-card-fullbg-link .hhm-card-fullbg-title {
    font-size: 18px;
    font-weight: 800;
    line-height: 1.25;
    margin: 0;
    /* v1.12.41 : blanc par défaut (lisible sur fond sombre), configurable via --hhm-ann-title */
    /* v1.12.42 : !important pour gagner contre le CSS du thème */
    color: var(--hhm-ann-title, #ffffff) !important;
    -webkit-text-fill-color: var(--hhm-ann-title, #ffffff) !important;
    /* drop-shadow noire pour décoller du fond + contraste */
    text-shadow: 0 1px 3px rgba(0,0,0,.55);
    background: none !important;
    background-image: none !important;
}

.hhm-card-fullbg-link .hhm-card-fullbg-excerpt {
    font-size: 12.5px;
    color: var(--hhm-ann-excerpt, rgba(255,255,255,.85)) !important;
    line-height: 1.5;
    margin: 0;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-shadow: 0 1px 2px rgba(0,0,0,.25);
}

/* Barre de progression avec % en ligne */
.hhm-card-fullbg-progress-wrap {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-top: 4px;
}
.hhm-card-fullbg-progress {
    flex: 1;
    height: 6px;
    background: rgba(255,255,255,.2);
    border-radius: 99px;
    overflow: hidden;
}
.hhm-card-fullbg-progress-bar {
    height: 100%;
    border-radius: 99px;
    transition: width .6s ease;
    background: var(--hhm-ann-progress, linear-gradient(90deg, #0072FF, #8224E3));
    min-width: 2px;
}
.hhm-card-fullbg-pct {
    font-size: 13px;
    font-weight: 800;
    color: #ffffff;
    font-variant-numeric: tabular-nums;
    text-shadow: 0 1px 2px rgba(0,0,0,.3);
    min-width: 36px;
    text-align: right;
}

/* Stats inline : Collecté · Objectif */
.hhm-card-fullbg-stats {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 12px;
    color: rgba(255,255,255,.92);
    flex-wrap: wrap;
}
.hhm-card-fullbg-stats strong {
    color: #ffffff;
    font-weight: 800;
}
.hhm-card-fullbg-stats-sep {
    color: rgba(255,255,255,.4);
    font-weight: 700;
}

/* CTA : bouton semi-transparent avec dégradé au hover */
.hhm-card-fullbg-cta {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    margin-top: 10px;
    padding: 10px 16px;
    background: rgba(255,255,255,.15);
    border: 1px solid rgba(255,255,255,.3);
    color: #ffffff !important;
    text-decoration: none;
    border-radius: 8px;
    font-size: 13px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .04em;
    transition: background .2s ease, border-color .2s ease, transform .15s ease;
    backdrop-filter: blur(4px);
}
.hhm-card-fullbg:hover .hhm-card-fullbg-cta {
    background: var(--hhm-ann-cta, linear-gradient(135deg, #0072FF, #8224E3));
    border-color: transparent;
    box-shadow: 0 6px 18px rgba(130,36,227,.4);
}
.hhm-card-fullbg-cta span {
    font-size: 15px;
    transition: transform .15s;
}
.hhm-card-fullbg:hover .hhm-card-fullbg-cta span {
    transform: translateX(3px);
}

/* v1.12.54 : anciennes règles mode liste spécifiques retirées
   → tout est désormais géré par le bloc universel en haut du fichier */
/* ═══════════════════════════════════════════════════════════════════════ */

.hhm-card-anneau {
    display: flex;
    flex-direction: column;
    height: 100%;
    position: relative;
    overflow: visible !important; /* anneau doit pouvoir déborder */
}

.hhm-card-anneau-img-wrap {
    position: relative;
    display: block;
    aspect-ratio: 16/10;
    background: #f3f4f6;
    overflow: visible !important; /* v1.12.36 : permettre à l'anneau de déborder en bas */
    border-radius: 12px 12px 0 0;
}
/* Image cropée à l'intérieur du wrap (l'image reste contenue, mais l'anneau déborde) */
.hhm-card-anneau-img-wrap > img,
.hhm-card-anneau-img-wrap > div.hhm-ann-card-img-placeholder {
    width: 100%;
    height: 100%;
    object-fit: cover;
    border-radius: 12px 12px 0 0;
    transition: transform .3s ease;
}
.hhm-card-anneau-img-wrap > img {
    display: block;
}
.hhm-card-anneau:hover .hhm-card-anneau-img-wrap > img {
    transform: scale(1.04);
}

/* Pour ne pas que le hover overflow l'anneau aussi, on contraint le zoom via mask alternatif :
   en pratique, on accepte que l'image elle-même soit clip-path via le wrap parent */

/* Badge catégorie top-right */
.hhm-card-anneau-cat {
    position: absolute;
    top: 12px;
    right: 12px;
    color: #fff;
    font-size: 11px;
    font-weight: 700;
    padding: 5px 12px;
    border-radius: 99px;
    text-transform: uppercase;
    letter-spacing: .04em;
    box-shadow: 0 2px 8px rgba(0,0,0,.18);
    z-index: 2;
}

/* v1.12.37 : Anneau centré horizontalement (left:50% + translateX(-50%)) */
.hhm-card-anneau-ring {
    position: absolute;
    bottom: -38px;
    left: 50%;
    transform: translateX(-50%);
    width: 76px;
    height: 76px;
    z-index: 5;
    background: #ffffff;
    border-radius: 50%;
    box-shadow: 0 4px 14px rgba(0,0,0,.12);
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 4px;
}
.hhm-card-anneau-ring svg {
    position: absolute;
    inset: 4px;
    width: calc(100% - 8px);
    height: calc(100% - 8px);
}
.hhm-card-anneau-pct {
    position: relative;
    z-index: 1;
    font-size: 17px;
    font-weight: 800;
    color: #111827;
    line-height: 1;
    font-variant-numeric: tabular-nums;
}

/* v1.12.36 : padding-top du body réduit (50→48) — l'anneau déborde de seulement 38px sous l'image
   et le titre commence proprement à la suite avec un petit espace */
.hhm-card-anneau-body {
    flex: 1 1 auto;
    padding: 48px 18px 18px;
    background: #ffffff;
    display: flex;
    flex-direction: column;
}

/* v1.12.37 : titre reprend le style générique (noir + hover dégradé bleu→violet) — overrides précédents retirés */
.hhm-card-anneau-body .hhm-ann-card-title {
    margin: 0 0 8px;
}

/* Stats Collecté / Objectif sur 2 colonnes */
.hhm-card-anneau-stats {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 12px;
    margin: 12px 0 4px;
    padding: 12px;
    background: #f9fafb;
    border-radius: 10px;
}
.hhm-card-anneau-stat {
    display: flex;
    flex-direction: column;
    gap: 2px;
}
/* v1.12.37 : labels "Collecté" / "Objectif" en bleu charte (configurable via --hhm-ann-stat-label) */
.hhm-card-anneau-stat-label {
    font-size: 11px;
    font-weight: 700;
    color: var(--hhm-ann-stat-label, #0072FF);
    text-transform: uppercase;
    letter-spacing: .04em;
}
/* v1.12.37 : valeurs (chiffres) reviennent en noir profond (configurable via --hhm-ann-stat-value) */
.hhm-card-anneau-stat-value {
    font-size: 15px;
    font-weight: 800;
    color: var(--hhm-ann-stat-value, #111827);
}

/* Le temps restant pousse le CTA en bas */
.hhm-card-anneau-body .hhm-ann-card-time {
    margin-top: auto;
    padding-top: 10px;
    border-top: 1px solid #f3f4f6;
}

/* CTA classique en bas, pleine largeur, padding fin */
.hhm-card-anneau-cta {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    margin-top: 14px;
    padding: 10px 16px;
    background: var(--hhm-ann-cta, var(--hhm-gradient, linear-gradient(135deg, #0072FF 0%, #8224E3 100%)));
    color: #ffffff !important;
    text-decoration: none;
    border-radius: 8px;
    font-size: 13px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .04em;
    transition: transform .12s ease, box-shadow .12s ease, filter .12s ease;
    box-shadow: 0 3px 10px rgba(130, 36, 227, .25);
}
.hhm-card-anneau-cta:hover {
    transform: translateY(-1px);
    box-shadow: 0 5px 14px rgba(130, 36, 227, .35);
    filter: brightness(1.05);
    color: #ffffff !important;
}
.hhm-card-anneau-cta span {
    font-size: 15px;
    transition: transform .15s;
}
.hhm-card-anneau-cta:hover span {
    transform: translateX(3px);
}

/* v1.12.54 : règles view-list anneau retirées → géré par le bloc universel */
/* ═══════════════════════════════════════════════════════════════════════ */

/* ═══════════════════════════════════════════════════════════════════════
   v1.12.33 — Layout : Vague colorée
   ═══════════════════════════════════════════════════════════════════════ */

.hhm-card-vague {
    display: flex;
    flex-direction: column;
    height: 100%;
    overflow: visible !important; /* le CTA doit pouvoir déborder du conteneur */
    position: relative;
}

/* Wrap image légèrement plus grand qu'en classique */
.hhm-card-vague-img-wrap {
    position: relative;
    display: block;
    aspect-ratio: 16/10;
    background: #f3f4f6;
    overflow: hidden;
    border-radius: 12px 12px 0 0;
}
.hhm-card-vague-img-wrap .hhm-ann-card-img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform .3s ease;
}
.hhm-card-vague:hover .hhm-card-vague-img-wrap .hhm-ann-card-img {
    transform: scale(1.04);
}

/* Badge catégorie top-right (différent du classique en bottom-left) */
.hhm-card-vague-cat {
    position: absolute;
    top: 12px;
    right: 12px;
    color: #fff;
    font-size: 11px;
    font-weight: 700;
    padding: 5px 12px;
    border-radius: 99px;
    text-transform: uppercase;
    letter-spacing: .04em;
    box-shadow: 0 2px 8px rgba(0,0,0,.18);
    z-index: 2;
}

/* SVG vague — pleine largeur, bas de l'image */
.hhm-card-vague-svg {
    position: absolute;
    bottom: -1px; /* anti-fuite 1px */
    left: 0;
    width: 100%;
    height: 50px;
    display: block;
    z-index: 1;
}

/* Body part haut, remonte sur l'image via la vague (margin-top négatif) */
.hhm-card-vague-body {
    flex: 1 1 auto;
    position: relative;
    padding: 18px 18px 16px;
    background: #ffffff;
    display: flex;
    flex-direction: column;
}

/* CTA pill chevauchant la vague (gros bouton flottant) */
.hhm-card-vague-cta {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    align-self: center; /* centré horizontalement dans le body */
    margin-top: 14px;
    padding: 8px 22px; /* v1.12.34 : padding vertical réduit (était 11px) */
    background: var(--hhm-ann-cta, var(--hhm-gradient, linear-gradient(135deg, #0072FF 0%, #8224E3 100%)));
    color: #ffffff !important;
    text-decoration: none;
    border-radius: 99px;
    font-size: 13px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .04em;
    box-shadow: 0 4px 12px rgba(130, 36, 227, .28);
    transition: transform .15s ease, box-shadow .15s ease, filter .15s ease;
}
.hhm-card-vague-cta:hover {
    transform: translateY(-2px);
    box-shadow: 0 8px 20px rgba(130, 36, 227, .38);
    filter: brightness(1.08);
    color: #ffffff !important;
}
.hhm-card-vague-cta span {
    font-size: 15px;
    transition: transform .15s;
}
.hhm-card-vague-cta:hover span {
    transform: translateX(3px);
}

/* v1.12.34 : titre pleine largeur (CTA n'est plus en absolu) */
.hhm-card-vague-body .hhm-ann-card-title {
    margin-top: 4px;
}

/* Le temps restant garde un petit espace avant le CTA */
.hhm-card-vague-body .hhm-ann-card-time {
    margin-top: 10px;
}

/* v1.12.54 : règles view-list vague retirées → géré par le bloc universel */

/* ═══════════════════════════════════════════════════════════════════════
   v1.12.31 — Layout : Liséré + bouton pleine largeur
   v1.12.32 — utilisation de --hhm-ann-cta (configurable depuis l'admin)
   ═══════════════════════════════════════════════════════════════════════ */

/* Carte : structure verticale full-height pour caler le bouton tout en bas */
.hhm-card-lisere-bouton {
    display: flex;
    flex-direction: column;
    height: 100%;
}

/* Liséré haut — 4px en dégradé bleu→violet (ou couleur via --hhm-ann-cta) */
.hhm-card-lb-lisere {
    height: 4px;
    width: 100%;
    flex-shrink: 0;
    background: var(--hhm-ann-cta, var(--hhm-gradient, linear-gradient(135deg, #0072FF 0%, #8224E3 100%)));
}

/* Image : pas de border-radius haut (le liséré occupe déjà cet espace) */
.hhm-card-lb-img-wrap {
    /* hérite de .hhm-ann-card-img-wrap */
}

/* Body grow pour pousser le CTA en bas */
.hhm-card-lb-body {
    flex: 1 1 auto;
    display: flex;
    flex-direction: column;
}
/* Le temps restant doit "pousser" naturellement vers le bas */
.hhm-card-lb-body .hhm-ann-card-time {
    margin-top: auto;
}

/* CTA pleine largeur en pied, ZÉRO marges, ZÉRO border-radius (épouse la carte) */
.hhm-card-lb-cta {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    margin: 0;
    padding: 14px 16px;
    background: var(--hhm-ann-cta, var(--hhm-gradient, linear-gradient(135deg, #0072FF 0%, #8224E3 100%)));
    color: #ffffff !important;
    text-decoration: none;
    border-radius: 0;
    font-size: 14px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .04em;
    transition: filter .15s ease, transform .15s ease;
    box-shadow: none;
}
.hhm-card-lb-cta:hover {
    filter: brightness(1.08);
    color: #ffffff !important;
    transform: none;
}
.hhm-card-lb-cta span {
    font-size: 16px;
    transition: transform .15s;
}
.hhm-card-lb-cta:hover span {
    transform: translateX(4px);
}

/* v1.12.54 : règles view-list liséré-bouton retirées → géré par le bloc universel */

/* ═══════════════════════════════════════════════════════════════════════ */

/* ─── Pagination ─────────────────────────────────────────────────────── */
.hhm-ann-pagination { display: flex; justify-content: center; align-items: center; gap: 6px; margin-top: 32px; flex-wrap: wrap; }
.hhm-ann-page { display: inline-flex; align-items: center; justify-content: center; min-width: 36px; height: 36px; padding: 0 10px; background: #fff; border: 1px solid var(--hhm-border, #e5e7eb); border-radius: 8px; color: #374151; text-decoration: none; font-weight: 600; font-size: 14px; transition: all .12s; }
.hhm-ann-page:hover { border-color: var(--hhm-primary, #8224E3); color: var(--hhm-primary, #8224E3); }
.hhm-ann-page.is-current { background: var(--hhm-gradient, linear-gradient(135deg, #0072FF, #8224E3)); color: #fff; border-color: transparent; }
.hhm-ann-page-dots { color: #9ca3af; padding: 0 4px; }

/* Responsive */
@media (max-width: 760px) {
    .hhm-ann-filter-row { flex-direction: column; align-items: stretch; }
    .hhm-ann-select, .hhm-ann-search { width: 100%; max-width: none; min-width: 0; }
    .hhm-ann-view-toggle { margin-left: 0; }
    .hhm-ann-view-list .hhm-ann-card { grid-template-columns: 1fr; }
    .hhm-ann-view-list .hhm-ann-card-img-wrap { aspect-ratio: 16/9; height: auto; min-height: 0; }
}

/* ═══════════════════════════════════════════════════════════════════════════
   v1.10.0 — Colonne centrale page single (Sondage / Actualités / Paliers)
   Préfixe .hhm-cl-mcard-* pour ne pas collisionner avec autres cartes
   ═══════════════════════════════════════════════════════════════════════════ */

/* Container colonne centrale : hauteur identique à la carte principale, scroll interne */
.hhm-cl-middle {
    display: flex;
    flex-direction: column;
    gap: 12px;
    overflow-y: auto;
    overflow-x: hidden;
    padding-right: 4px; /* place pour scrollbar */
    /* Scrollbar discrète */
    scrollbar-width: thin;
    scrollbar-color: var(--hhm-primary, #8224E3) #f1f1f4;
}
.hhm-cl-middle::-webkit-scrollbar { width: 6px; }
.hhm-cl-middle::-webkit-scrollbar-track { background: #f1f1f4; border-radius: 8px; }
.hhm-cl-middle::-webkit-scrollbar-thumb { background: var(--hhm-primary, #8224E3); border-radius: 8px; opacity: .5; }

/* Carte générique de la colonne centrale */
.hhm-cl-mcard {
    background: #fff;
    border: 1px solid var(--hhm-border, #e5e7eb);
    border-radius: 12px;
    overflow: hidden;
    box-shadow: 0 1px 3px rgba(0, 0, 0, .03);
    flex-shrink: 0;
}
/* La 3ème carte (paliers) prend l'espace restant et défile en interne */
.hhm-cl-mcard-rewards {
    flex: 1 1 auto;
    min-height: 200px;
    display: flex;
    flex-direction: column;
}
.hhm-cl-mcard-rewards .hhm-cl-mcard-body {
    flex: 1;
    overflow-y: auto;
}

/* En-tête de carte */
.hhm-cl-mcard-head {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 12px 16px;
    background: linear-gradient(135deg, rgba(0, 114, 255, .06) 0%, rgba(130, 36, 227, .06) 100%);
    border-bottom: 1px solid var(--hhm-border, #f3f4f6);
}
.hhm-cl-mcard-icon {
    font-size: 18px;
    line-height: 1;
}
.hhm-cl-mcard-title {
    margin: 0 !important;
    font-size: 14px !important;
    font-weight: 700 !important;
    color: var(--hhm-cause-color, #8224E3) !important;
    text-transform: none !important;
    letter-spacing: 0 !important;
    display: inline-flex !important;
    align-items: center;
    gap: 6px;
    line-height: 1.3 !important;
}

/* Corps de carte */
.hhm-cl-mcard-body {
    padding: 14px 16px;
    color: #374151;
    font-size: 13px;
    line-height: 1.5;
}
.hhm-cl-mcard-placeholder {
    margin: 0;
    color: #9ca3af;
    font-size: 12.5px;
    font-style: italic;
    text-align: center;
    padding: 16px 8px;
}

/* Responsive : à partir de 1100px down → la colonne centrale passe sous la carte principale */
@media (max-width: 1200px) {
    .hhm-cl-row.has-middle {
        grid-template-columns: 7fr 3fr !important; /* on retombe sur 2 colonnes : left + comments */
    }
    .hhm-cl-middle {
        grid-column: 1 / -1; /* prend toute la largeur */
        height: auto !important;
        max-height: 800px;
        margin-top: 20px;
        order: 2; /* après la carte gauche */
    }
    .hhm-cl-row.has-middle > .hhm-cl-side { order: 3; }
}
@media (max-width: 760px) {
    .hhm-cl-row.has-middle {
        grid-template-columns: 1fr !important;
    }
    .hhm-cl-middle { max-height: 600px; }
}

/* ═══════════════════════════════════════════════════════════════════════════
   v1.10.3 — Sondage (carte colonne centrale)
   ═══════════════════════════════════════════════════════════════════════════ */
.hhm-cl-mcard-meta {
    margin-left: auto;
    font-size: 11px;
    font-weight: 600;
    color: #6b7280;
    background: rgba(130, 36, 227, .08);
    padding: 3px 8px;
    border-radius: 99px;
}
.hhm-poll-question {
    font-size: 14px;
    font-weight: 700;
    color: #1f2937;
    margin: 0 0 12px;
    line-height: 1.4;
}

/* Formulaire vote */
.hhm-poll-form { display: flex; flex-direction: column; gap: 6px; }
.hhm-poll-option {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 9px 12px;
    border: 1.5px solid #e5e7eb;
    border-radius: 8px;
    cursor: pointer;
    transition: all .15s;
    font-size: 13px;
}
.hhm-poll-option:hover { border-color: var(--hhm-primary, #8224E3); background: rgba(130, 36, 227, .04); }
.hhm-poll-option input[type="radio"] { margin: 0; accent-color: var(--hhm-primary, #8224E3); cursor: pointer; }
.hhm-poll-option input[type="radio"]:checked + .hhm-poll-option-label { font-weight: 700; color: var(--hhm-primary, #8224E3); }
.hhm-poll-option-label { flex: 1; line-height: 1.3; }

.hhm-poll-vote-btn {
    margin-top: 10px;
    padding: 10px 14px;
    background: var(--hhm-gradient, linear-gradient(135deg, #0072FF, #8224E3));
    color: #fff;
    border: none;
    border-radius: 8px;
    font-size: 13px;
    font-weight: 700;
    cursor: pointer;
    transition: transform .12s, filter .12s, opacity .12s;
}
.hhm-poll-vote-btn:hover:not(:disabled) { filter: brightness(1.05); transform: translateY(-1px); }
.hhm-poll-vote-btn:disabled { opacity: .4; cursor: not-allowed; }

.hhm-poll-msg { margin: 8px 0 0; font-size: 12px; min-height: 1em; }
.hhm-poll-msg.is-error { color: #991b1b; }
.hhm-poll-msg.is-success { color: #065f46; }

/* Résultats */
.hhm-poll-results { display: flex; flex-direction: column; gap: 6px; }
.hhm-poll-result {
    position: relative;
    padding: 10px 12px;
    background: #f9fafb;
    border-radius: 8px;
    overflow: hidden;
    font-size: 13px;
}
.hhm-poll-result-bar {
    position: absolute;
    inset: 0 auto 0 0;
    background: linear-gradient(90deg, rgba(0,114,255,.12), rgba(130,36,227,.16));
    transition: width .6s ease;
    z-index: 0;
    border-radius: 8px;
}
.hhm-poll-result-label {
    position: relative;
    z-index: 1;
    font-weight: 600;
    color: #1f2937;
}
.hhm-poll-result-pct {
    position: relative;
    z-index: 1;
    float: right;
    font-weight: 700;
    color: var(--hhm-primary, #8224E3);
}

.hhm-poll-locked .hhm-poll-option-locked {
    background: #f9fafb;
    border-style: dashed;
    cursor: default;
}
.hhm-poll-locked .hhm-poll-option-locked:hover { background: #f9fafb; border-color: #e5e7eb; }

.hhm-poll-meta {
    margin: 10px 0 0;
    font-size: 11.5px;
    color: #6b7280;
    text-align: center;
}
.hhm-poll-meta a { color: var(--hhm-primary, #8224E3); font-weight: 600; }
.hhm-poll-end-date {
    margin: 8px 0 0;
    font-size: 11px;
    color: #9ca3af;
    text-align: right;
}

/* ═══════════════════════════════════════════════════════════════════════════
   v1.11.5 — Paliers / Contreparties (carte 3 colonne centrale)
   ═══════════════════════════════════════════════════════════════════════════ */

/* Pastilles filtres tags */
/* v1.13.7 — Tags paliers : scroll horizontal + ombres dégradées si débordement */
.hhm-rwd-tags {
    display: flex;
    flex-wrap: nowrap;
    gap: 6px;
    padding: 10px 14px;
    border-bottom: 1px solid #f3f4f6;
    background: linear-gradient(135deg, rgba(0,114,255,.025), rgba(130,36,227,.035));
    overflow-x: auto;
    overflow-y: hidden;
    scrollbar-width: thin;
    scrollbar-color: rgba(130, 36, 227, .25) transparent;
    /* Ombre dégradée à droite pour signaler "scroll possible" */
    -webkit-mask-image: linear-gradient(to right, #000 calc(100% - 24px), transparent 100%);
            mask-image: linear-gradient(to right, #000 calc(100% - 24px), transparent 100%);
    scroll-behavior: smooth;
    scroll-snap-type: x proximity;
}
/* Webkit scrollbar discrète */
.hhm-rwd-tags::-webkit-scrollbar { height: 4px; }
.hhm-rwd-tags::-webkit-scrollbar-track { background: transparent; }
.hhm-rwd-tags::-webkit-scrollbar-thumb { background: rgba(130, 36, 227, .25); border-radius: 99px; }
.hhm-rwd-tags::-webkit-scrollbar-thumb:hover { background: rgba(130, 36, 227, .45); }

/* Si scroll en cours côté gauche : ombre des deux côtés (classe ajoutée par JS) */
.hhm-rwd-tags.is-scrolled {
    -webkit-mask-image: linear-gradient(to right, transparent 0%, #000 24px, #000 calc(100% - 24px), transparent 100%);
            mask-image: linear-gradient(to right, transparent 0%, #000 24px, #000 calc(100% - 24px), transparent 100%);
}
/* Si scroll arrivé à droite : ombre seulement à gauche */
.hhm-rwd-tags.is-end {
    -webkit-mask-image: linear-gradient(to right, transparent 0%, #000 24px, #000 100%);
            mask-image: linear-gradient(to right, transparent 0%, #000 24px, #000 100%);
}
/* Si peu de tags (pas de débordement) : pas d'ombres */
.hhm-rwd-tags.no-overflow {
    -webkit-mask-image: none;
            mask-image: none;
    flex-wrap: wrap;
    overflow: visible;
}

.hhm-rwd-tag {
    font-size: 12px;
    padding: 5px 12px;
    background: transparent;
    border: 1px solid #e5e7eb;
    border-radius: 99px;
    cursor: pointer;
    color: #6b7280;
    font-weight: 500;
    transition: all .15s;
    font-family: inherit;
    flex-shrink: 0; /* essentiel pour qu'ils ne se compressent pas en mode scroll */
    scroll-snap-align: start;
    white-space: nowrap;
}
.hhm-rwd-tag:hover {
    border-color: var(--hhm-primary, #8224E3);
    color: var(--hhm-primary, #8224E3);
}
.hhm-rwd-tag.is-active {
    background: var(--hhm-gradient, linear-gradient(135deg, #0072FF, #8224E3));
    color: #fff;
    border-color: transparent;
}
.hhm-rwd-tag-count { opacity: .75; font-size: 11px; }

/* Liste paliers : trait fin de démarcation */
.hhm-rwd-list {
    padding: 0;
    display: flex;
    flex-direction: column;
}
.hhm-rwd {
    position: relative;
    padding: 16px 14px 14px;
    border-bottom: 1px solid #f1f3f5;
    transition: background .15s;
}
.hhm-rwd:last-child { border-bottom: 0; }
.hhm-rwd:hover { background: rgba(130, 36, 227, .015); }
.hhm-rwd.is-soldout { opacity: .65; }
.hhm-rwd.is-featured::before {
    content: '';
    position: absolute;
    inset: 0 auto 0 0;
    width: 3px;
    background: var(--hhm-gradient, linear-gradient(180deg, #0072FF, #8224E3));
}
.hhm-rwd[hidden] { display: none; }

/* Badges */
.hhm-rwd-badges {
    display: flex;
    flex-wrap: wrap;
    gap: 4px;
    margin: 0 0 10px;
    z-index: 2;
}
.hhm-rwd-vertical .hhm-rwd-badges {
    /* Mode vertical : badges en absolu sur l'image (haut-droite) */
    position: absolute;
    top: 26px;
    right: 14px;
    max-width: 55%;
    justify-content: flex-end;
    margin: 0;
}
.hhm-rwd-badge {
    font-size: 10px;
    padding: 3px 8px;
    border-radius: 99px;
    font-weight: 600;
    white-space: nowrap;
    line-height: 1.3;
}
.hhm-rwd-badge-manual {
    background: rgba(130, 36, 227, .12);
    color: #26215C;
}
.hhm-rwd-featured-flag {
    position: absolute;
    top: 14px;
    left: 14px;
    font-size: 14px;
    z-index: 3;
    background: rgba(255,255,255,.95);
    border-radius: 99px;
    padding: 2px 5px;
    line-height: 1;
}

/* Layout interne — Mode HORIZONTAL */
.hhm-rwd-horizontal .hhm-rwd-inner {
    display: flex;
    gap: 12px;
    align-items: flex-start;
}
.hhm-rwd-horizontal .hhm-rwd-media {
    width: 72px;
    height: 72px;
    flex-shrink: 0;
    border-radius: 8px;
    overflow: hidden;
    background: #f3f4f6;
    display: flex;
    align-items: center;
    justify-content: center;
}
.hhm-rwd-horizontal .hhm-rwd-media img { width: 100%; height: 100%; object-fit: cover; display: block; }
.hhm-rwd-horizontal .hhm-rwd-media-placeholder { font-size: 28px; color: #9ca3af; }
.hhm-rwd-horizontal .hhm-rwd-content { flex: 1; min-width: 0; }

/* Layout interne — Mode VERTICAL (style Ulule) */
.hhm-rwd-vertical .hhm-rwd-inner { display: block; }
.hhm-rwd-vertical .hhm-rwd-media {
    width: 100%;
    height: 140px;
    margin-bottom: 10px;
    border-radius: 8px;
    overflow: hidden;
    background: #f3f4f6;
    display: flex;
    align-items: center;
    justify-content: center;
}
.hhm-rwd-vertical .hhm-rwd-media img { width: 100%; height: 100%; object-fit: cover; display: block; }
.hhm-rwd-vertical .hhm-rwd-media-placeholder { font-size: 44px; color: #9ca3af; }

/* Titre + Montant */
.hhm-rwd-title {
    margin: 0 0 3px;
    font-size: 17px;
    font-weight: 600;
    color: #1f2937;
    line-height: 1.25;
}
.hhm-rwd-amount {
    margin: 0 0 8px;
    font-size: 15px;
    font-weight: 600;
    color: #1f2937;
    line-height: 1.2;
}
.hhm-rwd-currency { font-size: .85em; opacity: .85; margin-left: 2px; }

/* Description tronquée 3 lignes */
.hhm-rwd-desc {
    margin: 0 0 8px;
    font-size: 13px;
    color: #4b5563;
    line-height: 1.5;
    position: relative;
}
.hhm-rwd-desc[data-collapsed="1"] .hhm-rwd-desc-inner {
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
}
.hhm-rwd-desc[data-collapsed="0"] .hhm-rwd-desc-inner { display: block; }
.hhm-rwd-desc-inner p:first-child { margin-top: 0; }
.hhm-rwd-desc-inner p:last-child { margin-bottom: 0; }
.hhm-rwd-desc-inner ul, .hhm-rwd-desc-inner ol { margin: 6px 0; padding-left: 18px; }
.hhm-rwd-desc-inner li { margin: 2px 0; }
.hhm-rwd-readmore {
    background: transparent;
    border: none;
    padding: 0;
    margin-top: 4px;
    font-size: 12px;
    font-weight: 600;
    color: var(--hhm-primary, #8224E3);
    cursor: pointer;
    font-family: inherit;
}
.hhm-rwd-readmore:hover { text-decoration: underline; }
.hhm-rwd-desc[data-collapsed="0"] .hhm-rwd-readmore::before { content: '↑ '; }
.hhm-rwd-desc[data-collapsed="0"] .hhm-rwd-readmore { }

/* Métadonnées */
.hhm-rwd-meta {
    list-style: none;
    margin: 0 0 10px;
    padding: 0;
    display: flex;
    flex-wrap: wrap;
    gap: 6px 14px;
    font-size: 11.5px;
    color: #6b7280;
}
.hhm-rwd-meta li {
    margin: 0;
    padding: 0;
    line-height: 1.4;
    display: inline-flex;
    align-items: center;
    gap: 4px;
}
.hhm-rwd-meta li span[aria-hidden] {
    display: inline-block;
    font-size: 12px;
    line-height: 1;
    flex-shrink: 0;
}

/* FAQ palier */
.hhm-rwd-faq {
    margin: 0 0 10px;
    border: 1px solid #f3f4f6;
    border-radius: 6px;
    background: #fafafa;
}
.hhm-rwd-faq summary {
    padding: 7px 10px;
    cursor: pointer;
    font-size: 12px;
    font-weight: 600;
    color: #6b7280;
    list-style: none;
}
.hhm-rwd-faq summary::-webkit-details-marker { display: none; }
.hhm-rwd-faq summary::before { content: '❓ '; }
.hhm-rwd-faq[open] summary::before { content: '▼ '; }
.hhm-rwd-faq-body {
    padding: 0 10px 10px;
    font-size: 12px;
    color: #4b5563;
    line-height: 1.5;
}

/* CTA bouton "Choisir ce palier" */
.hhm-rwd-cta {
    display: block;
    width: 100%;
    margin-top: 4px;
    padding: 9px 12px;
    background: var(--hhm-gradient, linear-gradient(135deg, #0072FF, #8224E3));
    color: #fff;
    border: none;
    border-radius: 8px;
    font-size: 13px;
    font-weight: 600;
    cursor: pointer;
    transition: filter .12s, transform .12s;
    font-family: inherit;
}
.hhm-rwd-cta:hover:not(:disabled) { filter: brightness(1.07); transform: translateY(-1px); }
.hhm-rwd-cta:disabled { opacity: .5; cursor: not-allowed; background: #9ca3af; }

/* Densités */
.hhm-rwd-density-compact .hhm-rwd-desc,
.hhm-rwd-density-compact .hhm-rwd-faq { display: none; }
.hhm-rwd-density-hyper { padding: 10px 14px; }
.hhm-rwd-density-hyper .hhm-rwd-horizontal .hhm-rwd-media { width: 48px; height: 48px; }
.hhm-rwd-density-hyper .hhm-rwd-title { font-size: 14px; }

/* Bouton "Tout replier" */
.hhm-rwd-collapse-all {
    margin: 8px 14px 12px;
    padding: 6px 12px;
    background: transparent;
    border: 1px dashed #d1d5db;
    border-radius: 6px;
    font-size: 11.5px;
    color: #6b7280;
    cursor: pointer;
    font-family: inherit;
    align-self: flex-start;
}
.hhm-rwd-collapse-all:hover { border-color: var(--hhm-primary, #8224E3); color: var(--hhm-primary, #8224E3); }

/* Mode vertical : moins de paliers visibles → padding plus généreux */
.hhm-rwd-vertical { padding: 18px 16px 16px; }

/* ═══════════════════════════════════════════════════════════════════════════
   v1.11.7 — Modale don unifiée
   ═══════════════════════════════════════════════════════════════════════════ */
/* v1.11.10 — z-index max + isolation : la modale doit toujours être au-dessus du footer thème */
.hhm-don-modal {
    position: fixed;
    inset: 0;
    z-index: 2147483647; /* max int 32-bit : impossible d'être surclassé */
    display: flex;
    align-items: flex-start;
    justify-content: center;
    padding: 10vh 16px 4vh;
    overflow-y: auto;
    isolation: isolate; /* nouveau contexte d'empilement propre */
}
.hhm-don-modal[hidden] { display: none; }
.hhm-don-modal-backdrop {
    position: fixed;
    inset: 0;
    background: rgba(15, 23, 42, .55);
    backdrop-filter: blur(2px);
    z-index: 0;
}
.hhm-don-modal-dialog {
    position: relative;
    background: #fff;
    width: 100%;
    max-width: 520px;
    border-radius: 14px;
    box-shadow: 0 24px 64px rgba(0,0,0,.25), 0 0 0 1px rgba(255,255,255,.04);
    overflow: hidden;
    display: flex;
    flex-direction: column;
    z-index: 1;
    max-height: 92vh;
}
/* v1.11.9 : le <form> englobe body+footer → doit s'étendre + permettre body scrollable */
.hhm-don-form {
    display: flex;
    flex-direction: column;
    flex: 1 1 auto;
    min-height: 0;
    overflow: hidden;
}
.hhm-don-modal-head {
    padding: 14px 18px;
    background: linear-gradient(135deg, #0072FF, #8224E3);
    color: #fff;
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-shrink: 0;
}
.hhm-don-modal-title {
    margin: 0;
    font-size: 16px;
    font-weight: 700;
    color: #fff !important; /* v1.11.8 : force blanc contre thèmes qui surchargent */
    line-height: 1.2;
}
.hhm-don-modal-title span { color: #fff !important; }
.hhm-don-modal-close {
    background: rgba(255,255,255,.18);
    border: none;
    color: #fff;
    cursor: pointer;
    font-size: 16px;
    width: 30px;
    height: 30px;
    border-radius: 99px;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: background .15s;
}
.hhm-don-modal-close:hover { background: rgba(255,255,255,.32); }
.hhm-don-modal-body {
    padding: 16px 20px;
    overflow-y: auto;
    flex: 1 1 auto;
    min-height: 0; /* v1.11.9 : permet le scroll interne (flex children) */
}
.hhm-don-modal-foot {
    padding: 12px 20px;
    border-top: 1px solid #e5e7eb;
    display: flex;
    gap: 10px;
    background: #fafafa;
    flex-shrink: 0;
}

/* Sections */
.hhm-don-section {
    border: none;
    padding: 0;
    margin: 0 0 14px;
}
.hhm-don-section input[type=text],
.hhm-don-section input[type=email],
.hhm-don-section input[type=tel],
.hhm-don-section input[type=date],
.hhm-don-section input[type=number],
.hhm-don-section select,
.hhm-don-section textarea {
    width: 100%;
    border: 1.5px solid #e5e7eb;
    border-radius: 7px;
    padding: 9px 12px;
    font-size: 14px;
    box-sizing: border-box;
    font-family: inherit;
    background: #fff;
    color: #1f2937;
    margin-bottom: 6px;
}
.hhm-don-section input:focus,
.hhm-don-section select:focus,
.hhm-don-section textarea:focus {
    outline: none;
    border-color: var(--hhm-primary, #8224E3);
    box-shadow: 0 0 0 3px rgba(130, 36, 227, .12);
}
.hhm-don-legend {
    font-size: 11px;
    font-weight: 700;
    color: #6b7280;
    text-transform: uppercase;
    letter-spacing: .04em;
    margin: 0 0 8px;
    padding: 0;
    line-height: 1.2;
}
.hhm-don-optional { font-weight: 500; color: #9ca3af; text-transform: none; }
.hhm-don-grid-2 { display: grid; grid-template-columns: 1fr 1fr; gap: 6px; margin-bottom: 6px; }
.hhm-don-grid-3 { display: grid; grid-template-columns: 80px 1fr 1fr; gap: 6px; margin-bottom: 6px; }

/* Sélecteur paliers */
.hhm-don-rewards-list { display: flex; flex-direction: column; gap: 6px; }
.hhm-don-reward-opt {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 10px 12px;
    border: 1.5px solid #e5e7eb;
    border-radius: 8px;
    cursor: pointer;
    transition: all .15s;
}
.hhm-don-reward-opt:hover:not(.is-soldout) {
    border-color: var(--hhm-primary, #8224E3);
    background: rgba(130, 36, 227, .03);
}
.hhm-don-reward-opt.is-selected {
    border-color: var(--hhm-primary, #8224E3);
    background: rgba(130, 36, 227, .06);
    box-shadow: 0 0 0 1px rgba(130, 36, 227, .25) inset;
}
.hhm-don-reward-opt.is-soldout { opacity: .5; cursor: not-allowed; }
.hhm-don-reward-opt input[type=radio] { margin: 0; accent-color: var(--hhm-primary, #8224E3); cursor: pointer; flex-shrink: 0; }
.hhm-don-reward-opt-body { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 1px; }
.hhm-don-reward-opt-title { font-size: 13px; font-weight: 600; color: #1f2937; line-height: 1.3; }
.hhm-don-reward-opt-sub { font-size: 11.5px; color: #6b7280; }
.hhm-don-reward-opt-count { font-size: 11px; color: #9ca3af; }

/* Montant */
.hhm-don-amount-wrap { display: flex; flex-direction: column; gap: 8px; }
.hhm-don-suggested { display: flex; flex-wrap: wrap; gap: 6px; }
.hhm-don-suggested-btn {
    padding: 7px 14px;
    background: #fff;
    border: 1.5px solid #e5e7eb;
    border-radius: 7px;
    font-size: 13px;
    font-weight: 600;
    cursor: pointer;
    color: #1f2937;
    transition: all .15s;
    font-family: inherit;
}
.hhm-don-suggested-btn:hover {
    border-color: var(--hhm-primary, #8224E3);
    color: var(--hhm-primary, #8224E3);
}
.hhm-don-suggested-btn.is-active {
    background: var(--hhm-gradient, linear-gradient(135deg, #0072FF, #8224E3));
    color: #fff;
    border-color: transparent;
}
.hhm-don-amount-input { position: relative; }
.hhm-don-amount-input input {
    font-size: 18px !important;
    font-weight: 600 !important;
    padding-right: 32px !important;
}
.hhm-don-amount-currency {
    position: absolute;
    right: 12px;
    top: 50%;
    transform: translateY(-50%);
    font-size: 16px;
    font-weight: 600;
    color: #6b7280;
    pointer-events: none;
}
.hhm-don-delivery-hint {
    margin: 0;
    padding: 8px 12px;
    background: rgba(0, 114, 255, .08);
    border-radius: 6px;
    font-size: 12px;
    color: #185FA5;
    line-height: 1.4;
}
.hhm-don-delivery-hint[hidden] { display: none; }

/* Accordéon "Plus d'options" */
.hhm-don-more {
    margin-bottom: 14px;
    border: 1px solid #e5e7eb;
    border-radius: 8px;
    overflow: hidden;
}
.hhm-don-more summary {
    padding: 11px 14px;
    cursor: pointer;
    font-size: 13px;
    font-weight: 600;
    color: #4b5563;
    background: #fafafa;
    list-style: none;
    transition: background .15s;
}
.hhm-don-more summary::-webkit-details-marker { display: none; }
.hhm-don-more summary:hover { background: #f3f4f6; }
.hhm-don-more[open] summary { border-bottom: 1px solid #e5e7eb; }
.hhm-don-more-body { padding: 14px; }
.hhm-don-more-body .hhm-don-section { margin-bottom: 12px; }
.hhm-don-more-body .hhm-don-section:last-child { margin-bottom: 0; }

/* Checkboxes / radios */
.hhm-don-check {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 13px;
    color: #4b5563;
    cursor: pointer;
    line-height: 1.4;
    margin-bottom: 6px;
}
.hhm-don-check input { margin: 0; accent-color: var(--hhm-primary, #8224E3); cursor: pointer; flex-shrink: 0; }
.hhm-don-radio-row { display: flex; gap: 16px; margin-bottom: 8px; }
.hhm-don-radio-row label { display: inline-flex; align-items: center; gap: 6px; font-size: 13px; color: #4b5563; cursor: pointer; }

/* Modes paiement */
.hhm-don-pay-methods { display: flex; flex-direction: column; gap: 6px; }
.hhm-don-pay-method {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 9px 12px;
    border: 1.5px solid #e5e7eb;
    border-radius: 8px;
    cursor: pointer;
    font-size: 13px;
    transition: all .12s;
}
.hhm-don-pay-method:hover { border-color: var(--hhm-primary, #8224E3); }
.hhm-don-pay-method input { margin: 0; accent-color: var(--hhm-primary, #8224E3); }
.hhm-don-pay-method:has(input:checked) {
    border-color: var(--hhm-primary, #8224E3);
    background: rgba(130, 36, 227, .04);
}

/* CGU */
.hhm-don-cgu { margin: 10px 0; padding: 10px; background: #fafafa; border-radius: 6px; }
.hhm-don-cgu .hhm-don-check { margin-bottom: 0; color: #374151; }

/* Erreur */
.hhm-don-error {
    margin-top: 10px;
    padding: 10px 12px;
    background: #fee2e2;
    border-left: 3px solid #dc2626;
    color: #991b1b;
    border-radius: 6px;
    font-size: 13px;
    line-height: 1.4;
}

/* Boutons footer */
.hhm-don-btn-cancel {
    padding: 10px 18px;
    background: #fff;
    border: 1.5px solid #e5e7eb;
    border-radius: 8px;
    font-size: 13px;
    color: #4b5563;
    cursor: pointer;
    font-family: inherit;
    font-weight: 500;
}
.hhm-don-btn-cancel:hover { border-color: #9ca3af; }
.hhm-don-btn-submit {
    flex: 1;
    padding: 11px 18px;
    background: linear-gradient(135deg, #0072FF, #8224E3);
    color: #fff;
    border: none;
    border-radius: 8px;
    font-size: 14px;
    font-weight: 700;
    cursor: pointer;
    font-family: inherit;
    transition: filter .12s, transform .12s;
}
.hhm-don-btn-submit:hover:not(:disabled) { filter: brightness(1.08); transform: translateY(-1px); }
.hhm-don-btn-submit:disabled { opacity: .6; cursor: not-allowed; }

/* Succès */
.hhm-don-success { text-align: center; padding: 30px 20px; }
.hhm-don-success-icon {
    font-size: 36px;
    width: 64px;
    height: 64px;
    line-height: 64px;
    background: linear-gradient(135deg, #10b981, #059669);
    color: #fff;
    border-radius: 99px;
    margin: 0 auto 14px;
    font-weight: 700;
}
.hhm-don-success h3 { margin: 0 0 8px; font-size: 18px; color: #1f2937; }
.hhm-don-success p { margin: 0; color: #6b7280; font-size: 14px; }

/* Responsive */
@media (max-width: 640px) {
    .hhm-don-modal { padding: 5vh 0 0; align-items: stretch; }
    .hhm-don-modal-dialog { max-width: 100%; max-height: 95vh; border-radius: 12px 12px 0 0; }
    .hhm-don-grid-3 { grid-template-columns: 70px 1fr 1fr; }
}

/* ═══════════════════════════════════════════════════════════════════════════
   v1.12.1 — Événements + Actualités frontend (panels onglets)
   ═══════════════════════════════════════════════════════════════════════════ */

/* Actualités */
.hhm-cl-updates {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: 16px;
}
.hhm-cl-update {
    display: flex;
    gap: 14px;
    padding: 14px;
    border: 1px solid #f1f3f5;
    border-radius: 10px;
    background: #fff;
    transition: box-shadow .15s, border-color .15s;
}
.hhm-cl-update:hover {
    box-shadow: 0 4px 14px rgba(130, 36, 227, .08);
    border-color: #e9d5ff;
}
.hhm-cl-update-img {
    flex-shrink: 0;
    width: 140px;
    height: 100px;
    border-radius: 8px;
    overflow: hidden;
    background: #f3f4f6;
}
.hhm-cl-update-img img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}
.hhm-cl-update-body {
    flex: 1;
    min-width: 0;
}
.hhm-cl-update-date {
    font-size: 11.5px;
    color: #6b7280;
    text-transform: uppercase;
    letter-spacing: .05em;
    font-weight: 600;
    margin-bottom: 4px;
}
.hhm-cl-update-title {
    font-size: 16px;
    font-weight: 700;
    color: #1f2937;
    margin-bottom: 6px;
    line-height: 1.3;
}
.hhm-cl-update-excerpt {
    font-size: 13px;
    color: #4b5563;
    margin-bottom: 6px;
    font-style: italic;
}
.hhm-cl-update-text {
    font-size: 13px;
    color: #4b5563;
    line-height: 1.55;
}
.hhm-cl-update-text p:first-child { margin-top: 0; }
.hhm-cl-update-text p:last-child { margin-bottom: 0; }

/* Événements */
.hhm-cl-events-section-title {
    font-size: 13px;
    font-weight: 700;
    color: #1f2937;
    text-transform: uppercase;
    letter-spacing: .05em;
    margin: 18px 0 10px;
    padding-bottom: 6px;
    border-bottom: 2px solid var(--hhm-primary, #8224E3);
    display: inline-block;
}
.hhm-cl-events-section-title:first-child { margin-top: 0; }
.hhm-cl-events-section-past {
    color: #9ca3af;
    border-color: #d1d5db;
}
.hhm-cl-events {
    list-style: none;
    margin: 0 0 16px;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: 14px;
}
.hhm-cl-event {
    display: flex;
    gap: 14px;
    padding: 14px;
    border: 1px solid #f1f3f5;
    border-radius: 10px;
    background: #fff;
    transition: box-shadow .15s, border-color .15s;
}
.hhm-cl-event:hover {
    box-shadow: 0 4px 14px rgba(0, 114, 255, .08);
    border-color: #bfdbfe;
}
.hhm-cl-event.is-ongoing {
    border-color: #dc2626;
    background: #fef2f2;
}
.hhm-cl-event.is-past {
    opacity: .65;
    background: #fafafa;
}
.hhm-cl-event-img {
    flex-shrink: 0;
    width: 120px;
    height: 90px;
    border-radius: 8px;
    overflow: hidden;
    background: linear-gradient(135deg, rgba(0,114,255,.08), rgba(130,36,227,.08));
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 36px;
    color: #9ca3af;
}
.hhm-cl-event-img img { width: 100%; height: 100%; object-fit: cover; display: block; }
.hhm-cl-event-img-empty { font-size: 32px; }
.hhm-cl-event-body { flex: 1; min-width: 0; }
.hhm-cl-event-date {
    font-size: 12px;
    color: var(--hhm-primary, #8224E3);
    font-weight: 600;
    margin-bottom: 4px;
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
}
.hhm-cl-event-badge-live {
    background: #dc2626;
    color: #fff;
    padding: 2px 8px;
    border-radius: 99px;
    font-size: 10px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .04em;
    animation: hhm-pulse 1.5s ease-in-out infinite;
}
@keyframes hhm-pulse {
    0%, 100% { opacity: 1; }
    50% { opacity: .65; }
}
.hhm-cl-event-title {
    font-size: 16px;
    font-weight: 700;
    color: #1f2937;
    margin: 0 0 6px;
    line-height: 1.3;
}
.hhm-cl-event-location {
    font-size: 12.5px;
    color: #6b7280;
    margin-bottom: 6px;
}
.hhm-cl-event-excerpt,
.hhm-cl-event-desc {
    font-size: 13px;
    color: #4b5563;
    line-height: 1.5;
    margin-bottom: 8px;
}
.hhm-cl-event-desc p:first-child { margin-top: 0; }
.hhm-cl-event-desc p:last-child { margin-bottom: 0; }
.hhm-cl-event-places {
    font-size: 12px;
    color: #4b5563;
    margin-bottom: 8px;
    font-weight: 600;
}
.hhm-cl-event-cta {
    display: inline-block;
    margin-top: 4px;
    padding: 8px 14px;
    background: var(--hhm-gradient, linear-gradient(135deg, #0072FF, #8224E3));
    color: #fff;
    text-decoration: none;
    border-radius: 6px;
    font-size: 12.5px;
    font-weight: 600;
    transition: filter .12s, transform .12s;
}
.hhm-cl-event-cta:hover {
    filter: brightness(1.08);
    transform: translateY(-1px);
    color: #fff;
}

/* Responsive */
@media (max-width: 640px) {
    .hhm-cl-update,
    .hhm-cl-event { flex-direction: column; }
    .hhm-cl-update-img,
    .hhm-cl-event-img { width: 100%; height: 160px; }
}

/* ═══════════════════════════════════════════════════════════════════════════
   v1.12.2 — Carte 2 "Activité récente" (colonne centrale)
   ═══════════════════════════════════════════════════════════════════════════ */

/* Bloc Prochain événement */
.hhm-cl-act-event {
    padding: 12px;
    margin: 0 12px 12px;
    border-radius: 10px;
    background: linear-gradient(135deg, rgba(0, 114, 255, .07), rgba(59, 130, 246, .12));
    border: 1px solid rgba(0, 114, 255, .2);
    transition: transform .15s, box-shadow .15s;
}
.hhm-cl-act-event:hover {
    transform: translateY(-2px);
    box-shadow: 0 6px 18px rgba(0, 114, 255, .15);
    border-color: rgba(0, 114, 255, .35);
}
.hhm-cl-act-event-label {
    font-size: 10.5px;
    font-weight: 700;
    color: #0072FF;
    text-transform: uppercase;
    letter-spacing: .06em;
    margin-bottom: 8px;
}
.hhm-cl-act-event.is-ongoing {
    background: linear-gradient(135deg, rgba(220, 38, 38, .07), rgba(239, 68, 68, .12));
    border-color: rgba(220, 38, 38, .25);
    animation: hhm-act-pulse 2s ease-in-out infinite;
}
@keyframes hhm-act-pulse {
    0%, 100% { box-shadow: 0 0 0 0 rgba(220, 38, 38, 0); }
    50%      { box-shadow: 0 0 0 4px rgba(220, 38, 38, .12); }
}
.hhm-cl-act-event-label {
    font-size: 10.5px;
    font-weight: 700;
    color: var(--hhm-primary, #8224E3);
    text-transform: uppercase;
    letter-spacing: .06em;
    margin-bottom: 8px;
}
.hhm-cl-act-event.is-ongoing .hhm-cl-act-event-label { color: #dc2626; }
.hhm-cl-act-event-img {
    width: 100%;
    height: 90px;
    border-radius: 6px;
    overflow: hidden;
    margin-bottom: 8px;
    background: #f3f4f6;
}
.hhm-cl-act-event-img img { width: 100%; height: 100%; object-fit: cover; display: block; }
.hhm-cl-act-event-date {
    font-size: 11.5px;
    color: #6b7280;
    font-weight: 600;
    margin-bottom: 3px;
    text-transform: uppercase;
    letter-spacing: .03em;
}
.hhm-cl-act-event-title {
    font-size: 14px;
    font-weight: 700;
    color: #1f2937;
    margin: 0 0 4px;
    line-height: 1.3;
}
.hhm-cl-act-event-loc {
    font-size: 11.5px;
    color: #6b7280;
}

/* Séparateur entre événement et actus */
.hhm-cl-act-divider {
    height: 1px;
    background: linear-gradient(90deg, transparent, #e5e7eb 30%, #e5e7eb 70%, transparent);
    margin: 0 16px 12px;
}

/* Liste des 2 dernières actualités */
.hhm-cl-act-updates {
    list-style: none;
    margin: 0;
    padding: 0 12px 12px;
    display: flex;
    flex-direction: column;
    gap: 8px;
}
.hhm-cl-act-update {
    display: flex;
    gap: 10px;
    padding: 8px;
    border-radius: 8px;
    transition: background .15s, transform .15s;
    align-items: center;
}
.hhm-cl-act-update:hover {
    background: rgba(0, 114, 255, .06);
    transform: translateX(2px);
}
.hhm-cl-act-update-img {
    flex-shrink: 0;
    width: 48px;
    height: 48px;
    border-radius: 6px;
    overflow: hidden;
    background: #f3f4f6;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 18px;
    color: #9ca3af;
}
.hhm-cl-act-update-img img { width: 100%; height: 100%; object-fit: cover; display: block; }
.hhm-cl-act-update-body {
    flex: 1;
    min-width: 0;
}
.hhm-cl-act-update-date {
    font-size: 10.5px;
    color: #9ca3af;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: .04em;
    margin-bottom: 2px;
}
.hhm-cl-act-update-title {
    font-size: 12.5px;
    font-weight: 600;
    color: #1f2937;
    line-height: 1.35;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

/* ═══════════════════════════════════════════════════════════════════════
   v1.12.59 — Partage social (cartes + page single)
   ═══════════════════════════════════════════════════════════════════════ */

/* Couleurs par réseau (utilisées pour les fonds au hover) */
.hhm-share-link-facebook { --share-color: #1877F2; }
.hhm-share-link-twitter  { --share-color: #000000; }
.hhm-share-link-linkedin { --share-color: #0A66C2; }
.hhm-share-link-whatsapp { --share-color: #25D366; }
.hhm-share-link-copy     { --share-color: #6b7280; }

/* ─── Mode card-grid : bouton trigger + popover ──────────────────── */
/* v1.12.60 : SCOPÉ uniquement aux wraps image des cartes pour éviter
   tout positionnement parasite sur d'autres conteneurs */
.hhm-ann-card-img-wrap .hhm-share-grid,
.hhm-card-lb-img-wrap .hhm-share-grid,
.hhm-card-anneau-img-wrap .hhm-share-grid,
.hhm-card-vague-img-wrap .hhm-share-grid,
.hhm-card-popular-img-wrap .hhm-share-grid,
.hhm-card-badge-img-wrap .hhm-share-grid,
.hhm-card-edito-img-wrap .hhm-share-grid,
.hhm-card-fullbg-img-wrap .hhm-share-grid {
    position: absolute;
    top: 10px;
    right: 10px;
    z-index: 5;
    font-family: Arial, Helvetica, sans-serif;
}
/* v1.12.60 : trigger plus petit (32 → 28) + couleurs configurables admin */
.hhm-share-trigger {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 28px;
    height: 28px;
    padding: 0;
    background: var(--hhm-share-bg, rgba(0, 0, 0, .55));
    color: var(--hhm-share-icon, #ffffff);
    border: none;
    border-radius: 50%;
    cursor: pointer;
    backdrop-filter: blur(6px);
    -webkit-backdrop-filter: blur(6px);
    transition: background .15s ease, transform .15s ease;
    box-shadow: 0 2px 8px rgba(0, 0, 0, .15);
}
.hhm-share-trigger svg {
    width: 14px;
    height: 14px;
}
.hhm-share-trigger:hover {
    background: var(--hhm-share-bg-hover, rgba(130, 36, 227, .9));
    color: var(--hhm-share-icon, #ffffff);
    transform: scale(1.08);
}
.hhm-share-popover {
    position: absolute;
    top: 100%;
    right: 0;
    margin-top: 6px;
    display: flex;
    gap: 4px;
    padding: 6px;
    background: #ffffff;
    border-radius: 10px;
    box-shadow: 0 8px 24px rgba(0, 0, 0, .18);
    opacity: 0;
    visibility: hidden;
    transform: translateY(-6px);
    transition: opacity .18s ease, visibility 0s linear .18s, transform .18s ease;
    pointer-events: none;
}
.hhm-share-grid.is-open .hhm-share-popover {
    opacity: 1;
    visibility: visible;
    transform: translateY(0);
    transition: opacity .18s ease, visibility 0s linear 0s, transform .18s ease;
    pointer-events: auto;
}
.hhm-share-grid .hhm-share-link {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 32px;
    height: 32px;
    background: transparent;
    color: var(--share-color, #6b7280);
    border: none;
    border-radius: 6px;
    cursor: pointer;
    text-decoration: none;
    transition: background .15s ease, color .15s ease;
    padding: 0;
}
.hhm-share-grid .hhm-share-link:hover {
    background: var(--share-color, #6b7280);
    color: #ffffff;
}

/* ─── Mode card-list : icônes inline ──────────────────────────────── */
.hhm-share-list {
    display: flex;
    align-items: center;
    gap: 6px;
    margin-top: 8px;
    padding-top: 8px;
    border-top: 1px solid #f3f4f6;
    font-family: Arial, Helvetica, sans-serif;
}
.hhm-share-list .hhm-share-label {
    font-size: 11px;
    color: #6b7280;
    text-transform: uppercase;
    letter-spacing: .04em;
    font-weight: 600;
    margin-right: 4px;
}
.hhm-share-list .hhm-share-link {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 28px;
    height: 28px;
    background: #f3f4f6;
    color: var(--share-color, #6b7280);
    border: none;
    border-radius: 6px;
    cursor: pointer;
    text-decoration: none;
    transition: background .15s ease, color .15s ease, transform .12s ease;
    padding: 0;
}
.hhm-share-list .hhm-share-link:hover {
    background: var(--share-color, #6b7280);
    color: #ffffff;
    transform: translateY(-1px);
}

/* ─── Mode single : barre dédiée bien visible ────────────────────── */
.hhm-share-single {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 14px;
    margin: 18px 0;
    padding: 14px 18px;
    background: #F5F9FF;
    border: 1px solid #E5EEFB;
    border-radius: 10px;
    font-family: Arial, Helvetica, sans-serif;
}
.hhm-share-single .hhm-share-label {
    font-size: 14px;
    font-weight: 700;
    color: #374151;
}
.hhm-share-single .hhm-share-row {
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
}
.hhm-share-single .hhm-share-link {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    padding: 8px 14px;
    background: #ffffff;
    color: var(--share-color, #6b7280);
    border: 1.5px solid var(--share-color, #e5e7eb);
    border-radius: 8px;
    cursor: pointer;
    text-decoration: none;
    font-size: 13px;
    font-weight: 700;
    transition: background .15s ease, color .15s ease, transform .12s ease;
}
.hhm-share-single .hhm-share-link:hover {
    background: var(--share-color, #6b7280);
    color: #ffffff !important;
    transform: translateY(-2px);
    box-shadow: 0 4px 12px rgba(0, 0, 0, .1);
}
.hhm-share-link-text {
    line-height: 1;
}

/* ─── Toast "Lien copié !" ───────────────────────────────────────── */
.hhm-share-toast {
    position: fixed;
    bottom: 20px;
    left: 50%;
    transform: translateX(-50%) translateY(60px);
    z-index: 2147483647;
    background: #111827;
    color: #ffffff;
    padding: 10px 20px;
    border-radius: 99px;
    font-size: 14px;
    font-weight: 600;
    box-shadow: 0 10px 30px rgba(0, 0, 0, .25);
    opacity: 0;
    transition: opacity .2s ease, transform .2s ease;
    pointer-events: none;
    font-family: Arial, Helvetica, sans-serif;
}
.hhm-share-toast.is-visible {
    opacity: 1;
    transform: translateX(-50%) translateY(0);
}

/* Responsive : sur mobile, barre single plus compacte */
@media (max-width: 640px) {
    .hhm-share-single { padding: 12px 14px; gap: 10px; }
    .hhm-share-single .hhm-share-link { padding: 7px 12px; font-size: 12px; }
}

/* ═══════════════════════════════════════════════════════════════════════
   v1.12.62/69 — Carrousel causes ([hhm_causes display="carousel"])
   v1.12.69 : approche "rétrécir les cartes" — au lieu de bouger les flèches,
   on ajoute un padding intérieur à chaque .swiper-slide. La carte à l'intérieur
   devient visuellement plus petite, donc s'éloigne des flèches. Approche
   simple, robuste, fonctionne avec loop=true.
   ═══════════════════════════════════════════════════════════════════════ */

.hhm-causes-carousel {
    position: relative;
    /* v1.12.73 : la pagination est DEHORS du .swiper maintenant, plus besoin de padding-bottom */
    padding: 0;
    --swiper-navigation-sides-offset: 10px;
    --swiper-navigation-size: 44px;
}
.hhm-causes-carousel .swiper-wrapper {
    align-items: stretch;
}
.hhm-causes-carousel .swiper-slide {
    height: auto;
    display: flex;
    /* v1.12.69/70 : padding intérieur sur chaque slide pour rétrécir visuellement la carte */
    box-sizing: border-box;
    padding-left: var(--hhm-carousel-slide-pad, 35px);
    padding-right: var(--hhm-carousel-slide-pad, 35px);
}
/* v1.14.24 — En mode "has-fixed-slides" (slide_width défini), le padding interne n'a plus de sens :
   le "gap" Swiper s'occupe déjà de l'espacement. On force à 0 (sauf override explicite par shortcode pad="X"). */
.hhm-causes-carousel.has-fixed-slides .swiper-slide {
    padding-left: var(--hhm-fixed-slide-pad, 0px) !important;
    padding-right: var(--hhm-fixed-slide-pad, 0px) !important;
}
.hhm-causes-carousel .swiper-slide > article {
    width: 100%;
}

/* Flèches navigation — positionnées par Swiper via --swiper-navigation-sides-offset */
.hhm-causes-carousel .hhm-carousel-arrow {
    width: 44px;
    height: 44px;
    border-radius: 50%;
    background: #ffffff;
    color: var(--hhm-carousel-arrow, #8224E3);
    border: none;
    box-shadow: 0 4px 14px rgba(130, 36, 227, .25);
    font-size: 26px;
    font-weight: 700;
    line-height: 1;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: transform .15s ease, background .15s ease, color .15s ease, box-shadow .15s ease;
    padding: 0;
    z-index: 10;
}
.hhm-causes-carousel .hhm-carousel-arrow:hover {
    background: linear-gradient(135deg, #0072FF 0%, #8224E3 100%);
    color: #ffffff;
    box-shadow: 0 6px 20px rgba(130, 36, 227, .4);
    transform: scale(1.08);
}
.hhm-causes-carousel .hhm-carousel-arrow.swiper-button-disabled {
    opacity: 0.35;
    cursor: not-allowed;
}
/* Désactiver les pseudos par défaut de Swiper (pour conserver nos chevrons ‹ ›) */
.hhm-causes-carousel .swiper-button-prev::after,
.hhm-causes-carousel .swiper-button-next::after {
    display: none !important;
}

/* Pagination dots — v1.12.77 : EN DEHORS du .swiper, bullets générés MANUELLEMENT avec STYLE INLINE en JS */
.hhm-causes .hhm-carousel-dots,
.hhm-causes .swiper-pagination.hhm-carousel-dots {
    position: static !important;
    display: block !important;
    width: 100% !important;
    text-align: center !important;
    margin-top: 20px !important;
    padding: 0 !important;
    line-height: 1 !important;
}
.hhm-causes .swiper-pagination.swiper-pagination-lock {
    display: block !important;
}
/* Note v1.12.77 : tous les styles des bullets sont appliqués en INLINE par le JS pour
   bypass tous les CSS hérités du thème WordPress/pixfort qui peuvent les masquer.
   On garde ici seulement les variantes de style (square, bar) car elles utilisent des attributs. */
.hhm-causes .hhm-carousel-dots[data-dot-style="bar"] .swiper-pagination-bullet-active {
    width: calc(var(--hhm-carousel-dot-size, 10px) * 3) !important;
    border-radius: 99px !important;
    transform: scale(1) !important;
}
.hhm-causes .hhm-carousel-dots[data-dot-style="square"] .swiper-pagination-bullet {
    border-radius: 4px !important;
}

/* État vide */
.hhm-causes-empty {
    text-align: center;
    padding: 40px 20px;
    color: #6b7280;
    font-size: 14px;
    background: #f9fafb;
    border-radius: 10px;
}

/* Container .hhm-causes-grid : grille classique reprend les styles d'annuaire */
.hhm-causes-grid .hhm-ann-cards {
    display: grid;
    gap: 22px;
}
.hhm-causes-grid .hhm-ann-cards:not([style]) {
    grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
}

/* Responsive : sur mobile, flèches plus petites + padding slide réduit */
@media (max-width: 640px) {
    .hhm-causes-carousel {
        --swiper-navigation-size: 36px;
    }
    .hhm-causes-carousel .swiper-slide {
        padding-left: var(--hhm-carousel-slide-pad-mobile, 12px);
        padding-right: var(--hhm-carousel-slide-pad-mobile, 12px);
    }
    .hhm-causes-carousel .hhm-carousel-arrow {
        width: 36px;
        height: 36px;
        font-size: 22px;
    }
}

/* ═══════════════════════════════════════════════════════════════════════
   v1.12.79 — Phase 3.2 Sprint 1 : Édition frontend des causes
   ═══════════════════════════════════════════════════════════════════════ */

/* Bouton "Modifier" en haut à droite du hero (ou du card si pas d'image) */
.hhm-cl-edit-btn {
    position: absolute;
    top: 12px;
    right: 12px;
    z-index: 10;
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 8px 14px;
    border: none;
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.95);
    color: #8224E3;
    font-size: 13px;
    font-weight: 700;
    font-family: inherit;
    cursor: pointer;
    box-shadow: 0 4px 14px rgba(0, 0, 0, 0.18);
    transition: all .15s ease;
    backdrop-filter: blur(8px);
}
.hhm-cl-edit-btn:hover {
    background: linear-gradient(135deg, #0072FF 0%, #8224E3 100%);
    color: #fff;
    transform: translateY(-2px);
    box-shadow: 0 6px 20px rgba(130, 36, 227, 0.4);
}
.hhm-cl-edit-btn svg { display: block; }

/* Modal d'édition */
.hhm-edit-modal {
    position: fixed !important;
    inset: 0 !important;
    z-index: 2147483647 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    padding: 24px !important;
    box-sizing: border-box !important;
}
.hhm-edit-modal[hidden] { display: none !important; }
.hhm-edit-modal-backdrop {
    position: absolute;
    inset: 0;
    background: rgba(15, 23, 42, 0.7);
    backdrop-filter: blur(4px);
    cursor: pointer;
}
.hhm-edit-modal-dialog {
    position: relative;
    width: 100%;
    max-width: 760px;
    max-height: calc(100vh - 48px);
    background: #ffffff;
    border-radius: 16px;
    box-shadow: 0 25px 50px rgba(0, 0, 0, 0.3);
    display: flex;
    flex-direction: column;
    overflow: hidden;
    animation: hhm-edit-slide-in .25s ease;
}
@keyframes hhm-edit-slide-in {
    from { opacity: 0; transform: translateY(20px) scale(0.98); }
    to   { opacity: 1; transform: translateY(0) scale(1); }
}
body.hhm-edit-modal-open { overflow: hidden; }

.hhm-edit-modal-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 20px 24px;
    background: linear-gradient(135deg, #0072FF 0%, #8224E3 100%);
    color: #fff;
}
.hhm-edit-modal-head h2 {
    margin: 0 !important;
    font-size: 18px !important;
    font-weight: 800 !important;
    display: flex !important;
    align-items: center !important;
    gap: 10px !important;
    color: #ffffff !important;
    text-shadow: 0 1px 2px rgba(0, 0, 0, 0.2);
}
.hhm-edit-modal-head h2 svg { color: #ffffff !important; }
.hhm-edit-modal-close {
    width: 36px;
    height: 36px;
    border: none;
    border-radius: 50%;
    background: rgba(255, 255, 255, 0.2);
    color: #fff;
    font-size: 24px;
    line-height: 1;
    cursor: pointer;
    transition: background .15s ease;
}
.hhm-edit-modal-close:hover { background: rgba(255, 255, 255, 0.35); }

.hhm-edit-modal-body {
    padding: 20px 24px;
    overflow-y: auto;
    flex: 1;
}
.hhm-edit-modal-foot {
    display: flex;
    justify-content: flex-end;
    gap: 12px;
    padding: 16px 24px;
    border-top: 1px solid #e5e7eb;
    background: #f9fafb;
}

/* Onglets d'édition */
.hhm-edit-tabs {
    display: flex;
    gap: 4px;
    border-bottom: 2px solid #e5e7eb;
    margin-bottom: 20px;
    flex-wrap: wrap;
}
.hhm-edit-tab {
    padding: 10px 18px;
    border: none;
    background: transparent;
    color: #6b7280;
    font-size: 14px;
    font-weight: 600;
    cursor: pointer;
    border-bottom: 3px solid transparent;
    margin-bottom: -2px;
    transition: all .15s ease;
}
.hhm-edit-tab:hover { color: #1f2937; }
.hhm-edit-tab.is-active {
    color: #8224E3;
    border-bottom-color: #8224E3;
}

.hhm-edit-panel { display: none; }
.hhm-edit-panel.is-active { display: block; animation: hhm-edit-fade-in .2s ease; }
@keyframes hhm-edit-fade-in {
    from { opacity: 0; }
    to   { opacity: 1; }
}

/* Champs */
.hhm-edit-field {
    margin-bottom: 18px;
}
.hhm-edit-field label {
    display: block;
    margin-bottom: 6px;
    font-size: 13px;
    font-weight: 600;
    color: #374151;
}
.hhm-edit-field .hhm-req { color: #dc2626; }
.hhm-edit-field input[type="text"],
.hhm-edit-field input[type="number"],
.hhm-edit-field input[type="datetime-local"],
.hhm-edit-field select,
.hhm-edit-field textarea {
    width: 100%;
    padding: 10px 12px;
    border: 1px solid #d1d5db;
    border-radius: 8px;
    font-size: 14px;
    font-family: inherit;
    background: #fff;
    box-sizing: border-box;
    transition: border-color .15s ease, box-shadow .15s ease;
}
.hhm-edit-field input:focus,
.hhm-edit-field select:focus,
.hhm-edit-field textarea:focus {
    outline: none;
    border-color: #8224E3;
    box-shadow: 0 0 0 3px rgba(130, 36, 227, 0.1);
}
.hhm-edit-field textarea {
    resize: vertical;
    min-height: 80px;
    font-family: inherit;
}
.hhm-edit-field small {
    display: block;
    margin-top: 4px;
    font-size: 12px;
    color: #6b7280;
}
.hhm-edit-field input[type="checkbox"] {
    margin-right: 6px;
    vertical-align: middle;
}
.hhm-edit-field-color input[type="color"] {
    width: 60px;
    height: 36px;
    padding: 2px;
    border: 1px solid #d1d5db;
    border-radius: 8px;
    cursor: pointer;
}

.hhm-edit-grid-2 {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 16px;
}
@media (max-width: 600px) {
    .hhm-edit-grid-2 { grid-template-columns: 1fr; gap: 0; }
}

/* Image picker */
.hhm-edit-image-picker {
    border: 2px dashed #d1d5db;
    border-radius: 10px;
    padding: 14px;
    background: #f9fafb;
}
.hhm-edit-image-preview {
    min-height: 120px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 6px;
    overflow: hidden;
    background: #fff;
    margin-bottom: 10px;
    border: 1px solid #e5e7eb;
}
.hhm-edit-image-preview img {
    max-width: 100%;
    max-height: 200px;
    object-fit: contain;
}
.hhm-edit-image-empty {
    color: #9ca3af;
    font-size: 13px;
    font-style: italic;
}
.hhm-edit-image-actions {
    display: flex;
    gap: 8px;
    justify-content: center;
}

/* Boutons */
.hhm-edit-btn-secondary,
.hhm-edit-btn-clear,
.hhm-edit-btn-cancel,
.hhm-edit-btn-save {
    padding: 8px 16px;
    border: none;
    border-radius: 8px;
    font-size: 14px;
    font-weight: 600;
    cursor: pointer;
    transition: all .15s ease;
    font-family: inherit;
}
.hhm-edit-btn-secondary {
    background: #f3f4f6;
    color: #374151;
    border: 1px solid #d1d5db;
}
.hhm-edit-btn-secondary:hover { background: #e5e7eb; }
.hhm-edit-btn-clear {
    background: transparent;
    color: #dc2626;
    border: 1px solid #fecaca;
}
.hhm-edit-btn-clear:hover { background: #fee2e2; }
.hhm-edit-btn-cancel {
    background: #f3f4f6;
    color: #374151;
    border: 1px solid #d1d5db;
}
.hhm-edit-btn-cancel:hover { background: #e5e7eb; }
.hhm-edit-btn-save {
    background: linear-gradient(135deg, #0072FF 0%, #8224E3 100%);
    color: #fff;
    padding: 10px 24px;
    box-shadow: 0 4px 14px rgba(130, 36, 227, 0.25);
}
.hhm-edit-btn-save:hover:not(:disabled) {
    transform: translateY(-1px);
    box-shadow: 0 6px 20px rgba(130, 36, 227, 0.35);
    filter: brightness(1.08);
}
.hhm-edit-btn-save:disabled {
    opacity: 0.7;
    cursor: not-allowed;
}

/* Feedback messages */
.hhm-edit-feedback {
    padding: 12px 16px;
    border-radius: 8px;
    margin-top: 16px;
    font-size: 14px;
    font-weight: 600;
}
.hhm-edit-feedback.is-success {
    background: #d1fae5;
    color: #065f46;
    border-left: 4px solid #10b981;
}
.hhm-edit-feedback.is-error {
    background: #fee2e2;
    color: #991b1b;
    border-left: 4px solid #dc2626;
}

/* Responsive modal */
@media (max-width: 640px) {
    .hhm-edit-modal { padding: 12px; }
    .hhm-edit-modal-dialog { max-height: calc(100vh - 24px); border-radius: 12px; }
    .hhm-edit-modal-head { padding: 16px 18px; }
    .hhm-edit-modal-body { padding: 16px 18px; }
    .hhm-edit-modal-foot { padding: 12px 18px; }
    .hhm-edit-tab { padding: 8px 12px; font-size: 13px; }
}

/* v1.12.81 — Sections visuelles dans le formulaire d'édition */
.hhm-edit-section-ico {
    display: inline-block;
    margin-right: 4px;
    font-size: 1em;
    vertical-align: middle;
}
.hhm-edit-section {
    background: linear-gradient(135deg, rgba(0, 114, 255, 0.04) 0%, rgba(130, 36, 227, 0.04) 100%);
    border-left: 4px solid #8224E3;
    border-radius: 10px;
    padding: 16px 18px;
    margin: 8px 0 22px;
}
.hhm-edit-section h4 {
    margin: 0 0 6px;
    font-size: 15px;
    font-weight: 700;
    color: #1f2937;
    display: flex;
    align-items: center;
    gap: 6px;
}
.hhm-edit-section-desc {
    margin: 0 0 14px;
    font-size: 12px;
    color: #6b7280;
    font-style: italic;
}
.hhm-edit-section-quote { border-left-color: #8224E3; }

/* TinyMCE intégré dans la modal — ajustements */
.hhm-edit-modal .wp-editor-wrap {
    border: 1px solid #d1d5db;
    border-radius: 8px;
    overflow: hidden;
    background: #fff;
}
.hhm-edit-modal .mce-tinymce {
    border: none !important;
    box-shadow: none !important;
}
.hhm-edit-modal .mce-toolbar-grp {
    background: #f9fafb !important;
    border-bottom: 1px solid #e5e7eb !important;
}
.hhm-edit-modal .mce-edit-area iframe {
    background: #fff !important;
}
/* Tous les éléments flottants TinyMCE (popovers, menus, dropdowns, sélecteurs) — au-dessus de la modal */
.mce-floatpanel,
.mce-menu,
.mce-popover,
.mce-tooltip,
.mce-window,
.mce-container.mce-menu {
    z-index: 2147483647 !important;
}

/* v1.12.84 — Bouton supprimer dans le footer modal d'édition */
.hhm-edit-foot-spacer { flex: 1; }
.hhm-edit-btn-delete {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 8px 14px;
    border: 1px solid #fecaca;
    border-radius: 8px;
    background: #fff;
    color: #dc2626;
    font-size: 13px;
    font-weight: 600;
    cursor: pointer;
    font-family: inherit;
    transition: all .15s ease;
}
.hhm-edit-btn-delete:hover {
    background: #fee2e2;
    border-color: #fca5a5;
    transform: translateY(-1px);
}
.hhm-edit-btn-delete:disabled {
    opacity: 0.5;
    cursor: not-allowed;
    transform: none;
}

/* v1.12.87 — Quand le WP Media picker est ouvert :
   - Baisser le z-index de la modal HHM sous celui du picker
   - Masquer le backdrop pour qu'un clic à côté ne ferme PAS la modal HHM */
.hhm-edit-modal.hhm-picker-open {
    z-index: 999 !important;
}
.hhm-edit-modal.hhm-picker-open .hhm-edit-modal-backdrop {
    display: none !important;
}

/* ═══════════════════════════════════════════════════════════════════
   v1.13.0 — SPRINT 2 : ÉDITION FRONTEND SONDAGE
   Boutons CRUD (créer/modifier/supprimer) + modal + bandeau timer
   ═══════════════════════════════════════════════════════════════════ */

/* ── Actions inline dans le header de la card sondage ── */
.hhm-poll-actions { display: inline-flex; gap: 4px; margin-left: auto; }
.hhm-poll-btn-icon {
    background: transparent;
    border: 1px solid transparent;
    border-radius: 6px;
    padding: 4px 8px;
    font-size: 14px;
    cursor: pointer;
    transition: all .15s ease;
    line-height: 1;
}
.hhm-poll-btn-icon:hover {
    background: rgba(130, 36, 227, .08);
    border-color: rgba(130, 36, 227, .2);
}
.hhm-poll-btn-icon.hhm-poll-btn-danger:hover {
    background: rgba(220, 38, 38, .08);
    border-color: rgba(220, 38, 38, .25);
}

/* ── Bouton "Créer un sondage" (état vide) ── */
.hhm-poll-create { display: flex; flex-direction: column; align-items: center; gap: 10px; padding: 12px 0; }
.hhm-poll-create .hhm-cl-mcard-placeholder { margin: 0; color: #6b7280; font-size: 13px; }
.hhm-poll-btn-create {
    background: linear-gradient(135deg, #8224E3, #0072FF);
    color: #fff;
    border: 0;
    border-radius: 999px;
    padding: 10px 22px;
    font-size: 14px;
    font-weight: 600;
    cursor: pointer;
    box-shadow: 0 4px 14px rgba(130, 36, 227, .25);
    transition: transform .15s ease, box-shadow .15s ease;
}
.hhm-poll-btn-create:hover { transform: translateY(-1px); box-shadow: 0 6px 18px rgba(130, 36, 227, .35); }
.hhm-poll-create-hint { color: #6b7280; font-size: 11px; text-align: center; line-height: 1.4; }

/* ── Bandeau fenêtre d'édition de 5 minutes ── */
.hhm-poll-edit-window {
    margin: 8px 12px 0;
    padding: 8px 12px;
    background: linear-gradient(135deg, #fef3c7, #fde68a);
    border-left: 3px solid #f59e0b;
    border-radius: 8px;
    font-size: 12px;
    color: #78350f;
    display: flex;
    align-items: center;
    gap: 6px;
    flex-wrap: wrap;
}
.hhm-poll-edit-window strong { font-variant-numeric: tabular-nums; font-size: 13px; }
.hhm-poll-edit-window small { color: #92400e; font-size: 11px; opacity: .85; }

/* ═══════════════════════════════════════════════════════════════════
   MODAL D'ÉDITION SONDAGE (frontend)
   ═══════════════════════════════════════════════════════════════════ */

.hhm-poll-modal { position: fixed; inset: 0; z-index: 2147483647; }
.hhm-poll-modal[hidden] { display: none !important; }
.hhm-poll-modal-backdrop {
    position: absolute; inset: 0;
    background: rgba(15, 23, 42, .6);
    backdrop-filter: blur(2px);
    animation: hhmPollFadeIn .2s ease;
}
.hhm-poll-modal-content {
    position: relative;
    max-width: 580px;
    width: calc(100% - 32px);
    max-height: calc(100vh - 64px);
    margin: 32px auto;
    background: #fff;
    border-radius: 16px;
    box-shadow: 0 20px 60px rgba(0, 0, 0, .3);
    overflow: hidden;
    display: flex;
    flex-direction: column;
    animation: hhmPollSlideIn .25s ease;
}
@keyframes hhmPollFadeIn { from { opacity: 0; } to { opacity: 1; } }
@keyframes hhmPollSlideIn { from { transform: translateY(20px); opacity: 0; } to { transform: translateY(0); opacity: 1; } }

.hhm-poll-modal-head {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 16px 20px;
    background: linear-gradient(135deg, #8224E3, #0072FF);
    color: #fff;
}
.hhm-poll-modal-head h2 { margin: 0; font-size: 18px; font-weight: 700; flex: 1; }
.hhm-poll-modal-close {
    background: rgba(255, 255, 255, .2);
    border: 0;
    color: #fff;
    width: 32px; height: 32px;
    border-radius: 50%;
    cursor: pointer;
    font-size: 14px;
    transition: background .15s ease;
}
.hhm-poll-modal-close:hover { background: rgba(255, 255, 255, .35); }

.hhm-poll-modal-body { padding: 20px; overflow-y: auto; flex: 1; }
.hhm-poll-modal-foot {
    display: flex;
    justify-content: flex-end;
    gap: 10px;
    padding: 14px 20px;
    background: #f9fafb;
    border-top: 1px solid #e5e7eb;
}

/* ── Champs du formulaire ── */
.hhm-poll-field { margin-bottom: 16px; }
.hhm-poll-field > label {
    display: block;
    font-weight: 600;
    margin-bottom: 6px;
    font-size: 13px;
    color: #374151;
}
.hhm-poll-field > label small { font-weight: 400; color: #6b7280; }
.hhm-poll-field input[type="text"] {
    width: 100%;
    padding: 9px 12px;
    border: 1px solid #d1d5db;
    border-radius: 8px;
    font-size: 14px;
    transition: border-color .15s ease;
    box-sizing: border-box;
}
.hhm-poll-field input[type="text"]:focus {
    outline: none;
    border-color: #8224E3;
    box-shadow: 0 0 0 3px rgba(130, 36, 227, .12);
}
.hhm-req { color: #dc2626; }

/* ── Options du sondage (ajout/retrait dynamique) ── */
.hhm-poll-options-list { display: flex; flex-direction: column; gap: 6px; }
.hhm-poll-option-row { display: flex; gap: 8px; align-items: center; }
.hhm-poll-option-row input[type="text"] { flex: 1; }
.hhm-poll-option-remove {
    background: transparent;
    border: 1px solid #fca5a5;
    color: #dc2626;
    width: 32px; height: 32px;
    border-radius: 8px;
    cursor: pointer;
    font-size: 12px;
    transition: all .15s ease;
    flex-shrink: 0;
}
.hhm-poll-option-remove:hover { background: #fef2f2; border-color: #dc2626; }
.hhm-poll-option-remove[disabled] { opacity: .3; cursor: not-allowed; }
.hhm-poll-option-add {
    margin-top: 8px;
    background: transparent;
    border: 1px dashed #8224E3;
    color: #8224E3;
    padding: 8px 14px;
    border-radius: 8px;
    font-size: 13px;
    cursor: pointer;
    transition: all .15s ease;
}
.hhm-poll-option-add:hover { background: rgba(130, 36, 227, .06); border-style: solid; }
.hhm-poll-option-add[disabled] { opacity: .4; cursor: not-allowed; }

/* ── Durée du sondage (radio en grille) ── */
.hhm-poll-duration-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 8px; }
.hhm-poll-duration-opt {
    cursor: pointer;
    position: relative;
}
.hhm-poll-duration-opt input[type="radio"] {
    position: absolute; opacity: 0; pointer-events: none;
}
.hhm-poll-duration-opt span {
    display: block;
    text-align: center;
    padding: 10px 6px;
    border: 1.5px solid #e5e7eb;
    border-radius: 8px;
    font-size: 13px;
    font-weight: 600;
    transition: all .15s ease;
}
.hhm-poll-duration-opt:hover span { border-color: #c4b5fd; }
.hhm-poll-duration-opt input[type="radio"]:checked + span {
    border-color: #8224E3;
    background: linear-gradient(135deg, rgba(130, 36, 227, .08), rgba(0, 114, 255, .08));
    color: #8224E3;
}

/* ── Checkbox "autoriser invités" ── */
.hhm-poll-checkbox-line {
    display: flex !important;
    align-items: flex-start;
    gap: 8px;
    font-weight: 400 !important;
    margin: 0 !important;
    cursor: pointer;
}
.hhm-poll-checkbox-line input { margin-top: 3px; }
.hhm-poll-checkbox-line span { font-size: 13px; color: #374151; }

/* ── Note d'info "5 minutes" ── */
.hhm-poll-modal-info {
    background: #eff6ff;
    border-left: 3px solid #0ea5e9;
    padding: 10px 14px;
    border-radius: 8px;
    font-size: 12px;
    color: #0c4a6e;
    margin: 16px 0;
    line-height: 1.5;
}

/* ── Message d'erreur/succès dans la modal ── */
.hhm-poll-msg-box {
    padding: 10px 14px;
    border-radius: 8px;
    font-size: 13px;
    margin-bottom: 10px;
}
.hhm-poll-msg-box.hhm-poll-msg-error { background: #fef2f2; border-left: 3px solid #dc2626; color: #991b1b; }
.hhm-poll-msg-box.hhm-poll-msg-success { background: #ecfdf5; border-left: 3px solid #10b981; color: #065f46; }

/* ── Boutons primaire / outline (réutilisation si déjà définis ailleurs) ── */
.hhm-poll-modal-foot .hhm-btn-primary {
    background: linear-gradient(135deg, #8224E3, #0072FF);
    color: #fff;
    border: 0;
    padding: 10px 20px;
    border-radius: 8px;
    font-weight: 600;
    cursor: pointer;
    font-size: 14px;
    transition: transform .15s ease, box-shadow .15s ease;
}
.hhm-poll-modal-foot .hhm-btn-primary:hover { transform: translateY(-1px); box-shadow: 0 6px 18px rgba(130, 36, 227, .35); }
.hhm-poll-modal-foot .hhm-btn-primary[disabled] { opacity: .6; cursor: not-allowed; transform: none; box-shadow: none; }

.hhm-poll-modal-foot .hhm-btn-outline {
    background: #fff;
    color: #6b7280;
    border: 1px solid #d1d5db;
    padding: 10px 20px;
    border-radius: 8px;
    font-weight: 600;
    cursor: pointer;
    font-size: 14px;
    transition: all .15s ease;
}
.hhm-poll-modal-foot .hhm-btn-outline:hover { background: #f9fafb; border-color: #9ca3af; }

/* ── Responsive mobile ── */
@media (max-width: 580px) {
    .hhm-poll-modal-content { margin: 16px auto; width: calc(100% - 24px); max-height: calc(100vh - 32px); border-radius: 12px; }
    .hhm-poll-modal-head { padding: 14px 16px; }
    .hhm-poll-modal-head h2 { font-size: 16px; }
    .hhm-poll-modal-body { padding: 16px; }
    .hhm-poll-duration-grid { grid-template-columns: repeat(2, 1fr); }
}

/* ── v1.13.1 : bouton 🚩 Signaler + modal signalement ── */
.hhm-poll-btn-report:hover { background: rgba(220, 38, 38, .08); border-color: rgba(220, 38, 38, .25); }

.hhm-poll-reasons { display: flex; flex-direction: column; gap: 6px; }
.hhm-poll-reason-opt {
    display: flex !important;
    align-items: center;
    gap: 10px;
    padding: 9px 12px;
    border: 1.5px solid #e5e7eb;
    border-radius: 8px;
    cursor: pointer;
    font-weight: 400 !important;
    margin: 0 !important;
    transition: all .15s ease;
    font-size: 13px;
}
.hhm-poll-reason-opt:hover { border-color: #fca5a5; background: #fef2f2; }
.hhm-poll-reason-opt input[type="radio"] { margin: 0; accent-color: #dc2626; cursor: pointer; }
.hhm-poll-reason-opt input[type="radio"]:checked + span { font-weight: 600; color: #dc2626; }
.hhm-poll-reason-opt:has(input:checked) {
    border-color: #dc2626;
    background: linear-gradient(135deg, rgba(220, 38, 38, .06), rgba(245, 158, 11, .06));
}

/* ── v1.13.2 — Corrections UX modal poll ── */

/* Position : utiliser flexbox + padding-top pour éviter de tomber sur le menu sticky du site */
.hhm-poll-modal {
    display: flex;
    align-items: flex-start;
    justify-content: center;
    padding: 100px 16px 40px;
    overflow-y: auto;
}
.hhm-poll-modal[hidden] { display: none !important; }
.hhm-poll-modal-content {
    margin: 0;
    max-height: calc(100vh - 140px);
}

/* Titre toujours en blanc sur tous les headers de modal (incluant le rouge/orange signaler) */
.hhm-poll-modal-head h2 { color: #fff !important; }
.hhm-poll-modal-head .hhm-poll-modal-close { color: #fff !important; }

/* Responsive mobile : moins de padding-top sur les petits écrans */
@media (max-width: 580px) {
    .hhm-poll-modal { padding: 70px 12px 20px; }
    .hhm-poll-modal-content { max-height: calc(100vh - 100px); }
}

/* ═══════════════════════════════════════════════════════════════════
   v1.13.3 — Édition frontend Actualités + Événements
   ═══════════════════════════════════════════════════════════════════ */

/* Bouton ➕ Ajouter dans le header de la card Activité */
.hhm-news-actions { position: relative; margin-left: auto; }
.hhm-news-btn-add {
    background: #f3f4f6;
    color: #6b7280;
    border: 1px solid #e5e7eb;
    width: 26px; height: 26px;
    border-radius: 50%;
    font-size: 16px;
    font-weight: 600;
    cursor: pointer;
    transition: all .15s ease;
    line-height: 1;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0;
}
.hhm-news-btn-add:hover {
    background: linear-gradient(135deg, #8224E3, #0072FF);
    color: #fff;
    border-color: transparent;
    transform: scale(1.05);
}
.hhm-news-add-menu {
    position: absolute;
    top: 100%;
    right: 0;
    margin-top: 6px;
    background: #fff;
    border: 1px solid #e5e7eb;
    border-radius: 8px;
    box-shadow: 0 8px 24px rgba(0, 0, 0, .12);
    overflow: hidden;
    z-index: 100;
    min-width: 180px;
}
.hhm-news-add-menu[hidden] { display: none !important; }
.hhm-news-add-menu button {
    display: block;
    width: 100%;
    padding: 10px 14px;
    background: transparent;
    border: 0;
    text-align: left;
    cursor: pointer;
    font-size: 13px;
    color: #374151;
    transition: background .12s ease;
}
.hhm-news-add-menu button:hover { background: linear-gradient(135deg, rgba(130, 36, 227, .06), rgba(0, 114, 255, .06)); color: #8224E3; }

/* Boutons d'action sur chaque item (event/update) */
.hhm-cl-act-event, .hhm-cl-act-update { position: relative; }
.hhm-act-item-actions {
    position: absolute;
    top: 6px; right: 6px;
    display: flex;
    gap: 4px;
    opacity: 0;
    transition: opacity .15s ease;
    z-index: 5;
}
.hhm-cl-act-event:hover .hhm-act-item-actions,
.hhm-cl-act-update:hover .hhm-act-item-actions { opacity: 1; }
@media (hover: none) {
    .hhm-act-item-actions { opacity: 1; } /* mobile : toujours visible */
}
.hhm-act-btn-icon {
    background: rgba(255, 255, 255, .95);
    border: 1px solid rgba(0, 0, 0, .08);
    border-radius: 6px;
    padding: 3px 6px;
    font-size: 11px;
    cursor: pointer;
    line-height: 1;
    box-shadow: 0 1px 3px rgba(0, 0, 0, .06);
    transition: all .12s ease;
}
.hhm-act-btn-icon:hover { background: #fff; transform: scale(1.05); }
.hhm-act-btn-icon.hhm-act-btn-danger:hover { background: #fef2f2; border-color: #dc2626; }

/* Prévisualisation image dans modals Update/Event */
.hhm-news-image-wrap { display: flex; flex-direction: column; gap: 8px; }
.hhm-news-image-preview {
    width: 100%;
    aspect-ratio: 16/9;
    background: #f3f4f6;
    border-radius: 8px;
    overflow: hidden;
    display: none;
    background-size: cover;
    background-position: center;
    border: 1px solid #e5e7eb;
}
.hhm-news-image-preview.has-image { display: block; }

/* ── v1.13.6 : Boutons d'édition sur chaque palier ── */
.hhm-rwd { position: relative; }
.hhm-rwd-item-actions {
    position: absolute;
    top: 8px; right: 8px;
    display: flex;
    gap: 4px;
    opacity: 0;
    transition: opacity .15s ease;
    z-index: 5;
}
.hhm-rwd:hover .hhm-rwd-item-actions { opacity: 1; }
@media (hover: none) {
    .hhm-rwd-item-actions { opacity: 1; }
}
.hhm-poll-field select {
    width: 100%;
    padding: 9px 12px;
    border: 1px solid #d1d5db;
    border-radius: 8px;
    font-size: 14px;
    background: #fff;
    cursor: pointer;
    font-family: inherit;
    box-sizing: border-box;
}
.hhm-poll-field input[type="date"],
.hhm-poll-field input[type="number"] {
    width: 100%;
    padding: 9px 12px;
    border: 1px solid #d1d5db;
    border-radius: 8px;
    font-size: 14px;
    font-family: inherit;
    box-sizing: border-box;
}

/* ── v1.13.9 : Boutons CRUD documents ── */
.hhm-cl-docs-header {
    display: flex;
    align-items: center;
    padding: 8px 0 12px;
    border-bottom: 1px solid #f3f4f6;
    margin-bottom: 8px;
}
.hhm-cl-doc { position: relative; }
.hhm-cl-doc-actions {
    margin-left: 8px;
    position: static;
    flex-shrink: 0;
}
@media (hover: hover) {
    .hhm-cl-doc-actions { opacity: 0; transition: opacity .15s ease; }
    .hhm-cl-doc:hover .hhm-cl-doc-actions { opacity: 1; }
}

/* ── v1.13.10 : Drag & drop frontend des paliers ── */
.hhm-rwd-drag-handle {
    cursor: grab;
    user-select: none;
    color: #9ca3af;
    font-size: 14px;
    padding: 4px 6px;
    border-radius: 4px;
    background: rgba(255,255,255,.85);
    line-height: 1;
    letter-spacing: -2px;
    font-weight: bold;
    border: 1px solid rgba(0,0,0,.06);
    transition: all .12s ease;
    display: inline-flex;
    align-items: center;
}
.hhm-rwd-drag-handle:hover { color: #8224E3; background: #fff; }
.hhm-rwd-drag-handle:active { cursor: grabbing; }

/* État pendant le drag */
.hhm-rwd.is-dragging {
    opacity: .4;
    transform: scale(.98);
    transition: opacity .15s, transform .15s;
}
/* Cible de drop (survol) */
.hhm-rwd.is-drop-target {
    box-shadow: 0 0 0 2px #8224E3, 0 0 0 4px rgba(130, 36, 227, .15);
    transition: box-shadow .12s ease;
}
/* Container en mode tri actif */
.hhm-rwd-list[data-rewards-sortable].is-sorting {
    cursor: grabbing;
}
/* Petit feedback sur la card body pendant le tri (subtil) */
[data-rewards-sortable] { transition: background .15s; }
[data-rewards-sortable].is-sorting { background: rgba(130, 36, 227, .02); }

/* Toast de confirmation après sauvegarde de l'ordre */
.hhm-toast {
    position: fixed;
    bottom: 24px;
    left: 50%;
    transform: translateX(-50%) translateY(100px);
    background: linear-gradient(135deg, #8224E3, #0072FF);
    color: #fff;
    padding: 12px 22px;
    border-radius: 999px;
    font-size: 13px;
    font-weight: 600;
    box-shadow: 0 8px 24px rgba(130, 36, 227, .25);
    z-index: 2147483647;
    opacity: 0;
    transition: opacity .25s ease, transform .25s ease;
    pointer-events: none;
}
.hhm-toast.is-visible {
    opacity: 1;
    transform: translateX(-50%) translateY(0);
}

/* ═══════════════════════════════════════════════════════════════════
   v1.14.0 — Accordéons custom : édition frontend
   ═══════════════════════════════════════════════════════════════════ */

/* Header de la zone accordéons (label + bouton +) */
.hhm-cl-accordions-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0 0 8px;
    margin-bottom: 8px;
    border-bottom: 1px dashed #e5e7eb;
}
.hhm-cl-accordions-label {
    font-size: 12px;
    text-transform: uppercase;
    letter-spacing: .5px;
    color: #6b7280;
    font-weight: 600;
}

/* Wrapper sortable */
.hhm-cl-accordions-sortable {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

/* Actions sur un accordéon (drag + edit + delete) */
.hhm-cl-acc { position: relative; }
.hhm-cl-acc-actions {
    position: absolute;
    top: 50%;
    right: 40px;  /* libère la place du chevron à droite */
    transform: translateY(-50%);
    display: flex;
    gap: 4px;
    align-items: center;
    z-index: 5;
    opacity: 0;
    transition: opacity .15s ease;
    pointer-events: none;
}
.hhm-cl-acc:hover .hhm-cl-acc-actions {
    opacity: 1;
    pointer-events: auto;
}
@media (hover: none) {
    .hhm-cl-acc-actions { opacity: 1; pointer-events: auto; }
}
.hhm-cl-acc.is-open .hhm-cl-acc-actions { opacity: 1; pointer-events: auto; }
/* v1.14.4 — Chevron toujours visible (plus de masquage au hover) */

/* États drag&drop */
.hhm-cl-acc[draggable="true"] { cursor: default; }
.hhm-cl-acc.is-dragging {
    opacity: .4;
    transform: scale(.98);
}
.hhm-cl-accordions-sortable.is-sorting {
    background: rgba(130, 36, 227, .02);
    border-radius: 8px;
}

/* Modal accordéon : grille de couleurs de thème */
.hhm-acc-theme-grid {
    display: flex;
    gap: 10px;
    align-items: center;
    flex-wrap: wrap;
    padding: 8px 0;
}
.hhm-acc-theme-opt {
    cursor: pointer;
    position: relative;
}
.hhm-acc-theme-opt input { display: none; }
.hhm-acc-theme-dot {
    display: block;
    width: 28px;
    height: 28px;
    border-radius: 50%;
    border: 3px solid transparent;
    transition: all .15s ease;
}
.hhm-acc-theme-opt:hover .hhm-acc-theme-dot {
    transform: scale(1.1);
}
.hhm-acc-theme-opt input:checked + .hhm-acc-theme-dot {
    border-color: #111827;
    box-shadow: 0 0 0 2px rgba(0,0,0,.05);
}

/* Thèmes pour les accordéons (étend les existants) */
.hhm-cl-acc.theme-violet  { border-left: 3px solid #8224E3; background:#faf5ff; }
.hhm-cl-acc.theme-orange  { border-left: 3px solid #f59e0b; background:#fff7ed; }
.hhm-cl-acc.theme-red     { border-left: 3px solid #dc2626; background:#fef2f2; }
/* v1.14.10 — Harmonisation : tous les thèmes ont la même bordure left 3px */
.hhm-cl-acc.theme-blue    { border-left: 3px solid #0072FF; background:#eff6ff; }
.hhm-cl-acc.theme-green   { border-left: 3px solid #10b981; background:#ecfdf5; }
.hhm-cl-acc.theme-neutral { border-left: 3px solid #9ca3af; background:#f9fafb; }
/* v1.14.12 — Nouveau thème indigo (pour les jalons, distinct du violet équipe) */
.hhm-cl-acc.theme-indigo  { border-left: 3px solid #6366f1; background:#eef2ff; }

/* ═══════════════════════════════════════════════════════════════════
   v1.14.1 — Équipe & Porteur (bloc + modale)
   ═══════════════════════════════════════════════════════════════════ */

/* Icône d'édition à côté du chevron (sur l'header accordéon) */
.hhm-cl-acc-edit-trigger {
    margin-left: auto;
    margin-right: 8px;
    cursor: pointer;
    font-size: 14px;
    padding: 4px 8px;
    border-radius: 6px;
    background: rgba(255,255,255,.5);
    border: 1px solid rgba(0,0,0,.08);
    transition: all .12s ease;
    line-height: 1;
}
.hhm-cl-acc-edit-trigger:hover {
    background: #fff;
    transform: scale(1.05);
}

/* ── Bloc Organisation porteuse ── */
.hhm-team-org {
    display: flex;
    gap: 16px;
    align-items: flex-start;
    padding: 14px;
    background: linear-gradient(135deg, rgba(130, 36, 227, .04), rgba(0, 114, 255, .04));
    border-radius: 10px;
    margin-bottom: 16px;
}
.hhm-team-org-logo {
    flex: 0 0 80px;
    width: 80px;
    height: 80px;
    border-radius: 10px;
    overflow: hidden;
    background: #fff;
    border: 1px solid rgba(0,0,0,.08);
    display: flex;
    align-items: center;
    justify-content: center;
    box-shadow: 0 2px 8px rgba(0,0,0,.04);
}
.hhm-team-org-logo img { width: 100%; height: 100%; object-fit: contain; padding: 6px; }
.hhm-team-org-logo-empty { font-size: 36px; opacity: .35; }
.hhm-team-org-info { flex: 1; min-width: 0; }
.hhm-team-org-label {
    font-size: 11px;
    text-transform: uppercase;
    letter-spacing: .5px;
    color: #8224E3;
    font-weight: 700;
    margin-bottom: 4px;
}
.hhm-team-org-name {
    margin: 0 0 6px;
    font-size: 16px;
    font-weight: 700;
    color: #111827;
}
.hhm-team-org-rna {
    font-size: 12px;
    color: #6b7280;
    margin-bottom: 8px;
    font-family: ui-monospace, monospace;
}
.hhm-team-org-contact {
    display: flex;
    gap: 12px;
    flex-wrap: wrap;
}
.hhm-team-org-contact a {
    font-size: 13px;
    text-decoration: none;
    color: #4b5563;
    padding: 4px 8px;
    background: rgba(255,255,255,.7);
    border-radius: 6px;
    border: 1px solid rgba(0,0,0,.06);
    transition: all .12s ease;
}
.hhm-team-org-contact a:hover {
    color: #8224E3;
    border-color: #8224E3;
    background: #fff;
}

/* ── Grille des membres (affichage) ── */
.hhm-team-members-label {
    font-size: 11px;
    text-transform: uppercase;
    letter-spacing: .5px;
    color: #6b7280;
    font-weight: 700;
    margin: 0 0 10px;
}
.hhm-team-members-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
    gap: 12px;
}
.hhm-team-member {
    display: flex;
    gap: 12px;
    padding: 12px;
    background: #fff;
    border-radius: 10px;
    border: 1px solid rgba(0,0,0,.06);
    transition: box-shadow .15s, transform .15s;
}
.hhm-team-member:hover {
    box-shadow: 0 4px 12px rgba(0,0,0,.06);
    transform: translateY(-1px);
}
.hhm-team-member-photo {
    flex: 0 0 60px;
    width: 60px;
    height: 60px;
    border-radius: 50%;
    overflow: hidden;
    background: linear-gradient(135deg, rgba(130, 36, 227, .08), rgba(0, 114, 255, .08));
    display: flex;
    align-items: center;
    justify-content: center;
}
.hhm-team-member-photo img { width: 100%; height: 100%; object-fit: cover; }
.hhm-team-member-photo-empty { font-size: 28px; opacity: .35; }
.hhm-team-member-info { flex: 1; min-width: 0; }
.hhm-team-member-name {
    margin: 0;
    font-size: 14px;
    font-weight: 700;
    color: #111827;
}
.hhm-team-member-role {
    font-size: 12px;
    color: #8224E3;
    margin-top: 2px;
    font-weight: 500;
}
.hhm-team-member-bio {
    font-size: 12px;
    color: #4b5563;
    margin-top: 6px;
    line-height: 1.4;
}

/* ── Modale Équipe : onglets ── */
.hhm-team-tabs {
    display: flex;
    border-bottom: 2px solid #e5e7eb;
    padding: 0 24px;
    background: #fafafa;
}
.hhm-team-tab {
    background: transparent;
    border: 0;
    padding: 14px 18px;
    font-size: 14px;
    font-weight: 600;
    color: #6b7280;
    cursor: pointer;
    border-bottom: 2px solid transparent;
    margin-bottom: -2px;
    transition: all .12s ease;
    font-family: inherit;
    display: inline-flex;
    align-items: center;
    gap: 8px;
}
.hhm-team-tab:hover { color: #8224E3; }
.hhm-team-tab.is-active {
    color: #8224E3;
    border-bottom-color: #8224E3;
}
.hhm-team-tab-count {
    background: rgba(130, 36, 227, .12);
    color: #8224E3;
    font-size: 11px;
    font-weight: 700;
    padding: 2px 8px;
    border-radius: 99px;
    min-width: 18px;
    text-align: center;
}
.hhm-team-pane { display: none; }
.hhm-team-pane.is-active { display: block; }

/* ── Modale Équipe : liste des membres (édition) ── */
.hhm-team-members-toolbar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 14px;
    flex-wrap: wrap;
}
.hhm-team-members-list {
    display: flex;
    flex-direction: column;
    gap: 6px;
}
.hhm-team-member-row {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 10px;
    background: #fff;
    border: 1px solid #e5e7eb;
    border-radius: 8px;
    transition: box-shadow .12s, opacity .12s;
}
.hhm-team-member-row:hover { box-shadow: 0 2px 8px rgba(0,0,0,.06); }
.hhm-team-member-row.is-dragging { opacity: .4; }
.hhm-team-member-row-photo {
    width: 40px; height: 40px;
    border-radius: 50%;
    background-size: cover;
    background-position: center;
    background-color: rgba(130, 36, 227, .08);
    flex-shrink: 0;
    display: flex;
    align-items: center;
    justify-content: center;
}
.hhm-team-member-row-photo-empty { font-size: 18px; opacity: .4; }
.hhm-team-member-row-info { flex: 1; min-width: 0; }
.hhm-team-member-row-info strong { display: block; font-size: 13px; color: #111827; }
.hhm-team-member-row-info small { display: block; font-size: 11px; margin-top: 1px; }
.hhm-team-member-row-actions { display: flex; gap: 4px; }

@media (max-width: 580px) {
    .hhm-team-org { flex-direction: column; align-items: center; text-align: center; }
    .hhm-team-org-contact { justify-content: center; }
    .hhm-team-tabs { padding: 0 12px; overflow-x: auto; }
}

/* ═══════════════════════════════════════════════════════════════════
   v1.14.2 — Partenaires & Soutiens
   ═══════════════════════════════════════════════════════════════════ */
.hhm-partners-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 12px;
}
.hhm-partner-card {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 10px;
    padding: 16px 12px;
    background: #fff;
    border-radius: 10px;
    border: 1px solid rgba(0,0,0,.06);
    text-decoration: none;
    color: inherit;
    transition: all .15s ease;
    position: relative;
    text-align: center;
}
a.hhm-partner-card:hover {
    border-color: #f59e0b;
    box-shadow: 0 4px 16px rgba(245, 158, 11, .12);
    transform: translateY(-2px);
}
.hhm-partner-logo {
    width: 80px;
    height: 80px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: #fafafa;
    border-radius: 8px;
    overflow: hidden;
    flex-shrink: 0;
}
.hhm-partner-logo img {
    max-width: 100%;
    max-height: 100%;
    width: auto;
    height: auto;
    object-fit: contain;
    padding: 6px;
}
.hhm-partner-logo-empty {
    font-size: 36px;
    opacity: .35;
}
.hhm-partner-name {
    font-size: 13px;
    font-weight: 700;
    color: #111827;
    line-height: 1.3;
}
.hhm-partner-desc {
    font-size: 11px;
    color: #6b7280;
    margin-top: 3px;
    line-height: 1.3;
}
.hhm-partner-link-icon {
    position: absolute;
    top: 6px;
    right: 8px;
    font-size: 12px;
    color: #f59e0b;
    opacity: 0;
    transition: opacity .15s;
}
a.hhm-partner-card:hover .hhm-partner-link-icon { opacity: 1; }

/* ── v1.14.3 : Boutons d'édition inline sur cards Équipe/Partenaires ── */
.hhm-team-member { position: relative; }
.hhm-team-member-actions {
    position: absolute;
    top: 8px; right: 8px;
    display: flex;
    gap: 4px;
    opacity: 0;
    transition: opacity .15s ease;
}
.hhm-team-member:hover .hhm-team-member-actions { opacity: 1; }
@media (hover: none) {
    .hhm-team-member-actions { opacity: 1; }
}

.hhm-partner-card.is-editable {
    cursor: default;
}
.hhm-partner-actions {
    position: absolute;
    top: 8px;
    right: 8px;
    display: flex;
    gap: 4px;
    opacity: 0;
    transition: opacity .15s ease;
    z-index: 5;
}
.hhm-partner-card:hover .hhm-partner-actions { opacity: 1; }
@media (hover: none) {
    .hhm-partner-actions { opacity: 1; }
}
.hhm-partner-visit {
    display: inline-block;
    font-size: 11px;
    margin-top: 6px;
    color: #f59e0b;
    text-decoration: none;
    padding: 3px 8px;
    border-radius: 99px;
    background: rgba(245, 158, 11, .1);
    transition: all .12s ease;
}
.hhm-partner-visit:hover {
    background: #f59e0b;
    color: #fff;
}

/* ═══════════════════════════════════════════════════════════════════
   v1.14.4 — Système "Lire la suite" + Modal Fiche profil (réutilisable)
   ═══════════════════════════════════════════════════════════════════ */

/* Troncature texte 2 lignes */
.hhm-text-clamp {
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
    line-clamp: 2;
}

.hhm-text-read-more {
    background: transparent;
    border: 0;
    color: #8224E3;
    font-size: 11px;
    font-weight: 600;
    cursor: pointer;
    padding: 2px 0;
    margin-top: 2px;
    font-family: inherit;
    transition: color .12s;
}
.hhm-text-read-more:hover { color: #0072FF; text-decoration: underline; }
.hhm-text-read-more[hidden] { display: none !important; }

/* Modal Fiche profil (générique, peut servir membres / partenaires / autres) */
.hhm-profile-modal {
    z-index: 2147483647 !important; /* max z-index pour passer au-dessus du footer */
}
.hhm-profile-modal .hhm-poll-modal-content {
    padding: 0;
    overflow: hidden;
    position: relative;
    z-index: 1;
}
.hhm-profile-modal-close {
    position: absolute;
    top: 12px;
    right: 12px;
    z-index: 10;
    background: rgba(255,255,255,.95);
    border: 1px solid rgba(0,0,0,.1);
    width: 32px; height: 32px;
    border-radius: 50%;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 14px;
    color: #6b7280;
    transition: all .12s;
    box-shadow: 0 2px 6px rgba(0,0,0,.06);
}
.hhm-profile-modal-close:hover {
    background: #fff;
    color: #111827;
    transform: scale(1.05);
}
.hhm-profile-modal-body {
    text-align: center;
    padding: 36px 28px 28px;
}
.hhm-profile-modal-photo {
    width: 110px;
    height: 110px;
    border-radius: 50%;
    margin: 0 auto 16px;
    background-size: cover;
    background-position: center;
    background-color: rgba(130, 36, 227, .08);
    border: 4px solid #fff;
    box-shadow: 0 4px 16px rgba(0, 0, 0, .08);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 44px;
    color: rgba(130, 36, 227, .35);
}
.hhm-profile-modal-photo.has-photo {
    background-color: transparent;
}
.hhm-profile-modal-name {
    margin: 0 0 4px;
    font-size: 22px;
    font-weight: 700;
    color: #111827;
}
.hhm-profile-modal-role {
    font-size: 14px;
    color: #8224E3;
    font-weight: 600;
    margin-bottom: 18px;
}
.hhm-profile-modal-role:empty { display: none; }
.hhm-profile-modal-bio {
    font-size: 14px;
    line-height: 1.6;
    color: #4b5563;
    text-align: left;
    white-space: pre-wrap;
}
.hhm-profile-modal-bio:empty { display: none; }

/* La bio sur les cards : limiter à 2 lignes max */
.hhm-team-member-bio {
    font-size: 12px;
    color: #4b5563;
    margin-top: 6px;
    line-height: 1.4;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

/* ═══════════════════════════════════════════════════════════════════
   v1.14.8 — Section "Reçu fiscal" dans modale Org porteuse
   ═══════════════════════════════════════════════════════════════════ */
.hhm-team-org-receipt-section {
    margin-top: 24px;
    padding: 16px;
    background: #fafafa;
    border-radius: 10px;
    border: 1px dashed #d1d5db;
}
.hhm-team-org-receipt-header {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-bottom: 14px;
    padding-bottom: 10px;
    border-bottom: 1px solid #e5e7eb;
}
.hhm-team-org-sig-preview {
    background-color: #fff !important;
    border: 1px dashed #d1d5db !important;
    min-height: 80px;
    background-size: contain !important;
    background-repeat: no-repeat !important;
    background-position: center !important;
}

/* Badge "Émet ses propres reçus fiscaux" */
.hhm-team-org-receipt-badge {
    display: inline-block;
    margin-top: 8px;
    padding: 3px 10px;
    background: rgba(16, 185, 129, .12);
    color: #059669;
    font-size: 11px;
    font-weight: 700;
    border-radius: 99px;
    border: 1px solid rgba(16, 185, 129, .25);
}

/* ═══════════════════════════════════════════════════════════════════
   v1.14.9 — Hiérarchie z-index modales (toujours au-dessus du footer)
   ═══════════════════════════════════════════════════════════════════ */
.hhm-poll-modal,
.hhm-news-modal,
.hhm-profile-modal {
    z-index: 999990 !important; /* modales principales */
}
/* Sous-modales (s'ouvrent par-dessus une modale parente) */
.hhm-poll-modal[data-team-member-modal],
.hhm-poll-modal[data-partner-modal],
.hhm-profile-modal {
    z-index: 999999 !important;
}

/* ═══════════════════════════════════════════════════════════════════
   v1.14.9 — Transparence Budget : barres + modale
   ═══════════════════════════════════════════════════════════════════ */
.hhm-budget-info {
    background: linear-gradient(135deg, rgba(0, 114, 255, .04), rgba(16, 185, 129, .04));
    padding: 12px 16px;
    border-radius: 10px;
}
.hhm-budget-totals {
    display: flex;
    gap: 24px;
    flex-wrap: wrap;
}
.hhm-budget-total-item {
    display: flex;
    flex-direction: column;
}
.hhm-budget-total-label {
    font-size: 11px;
    text-transform: uppercase;
    letter-spacing: .5px;
    color: #6b7280;
    font-weight: 600;
}
.hhm-budget-total-value {
    font-size: 20px;
    font-weight: 700;
    color: #111827;
}

.hhm-budget-bars {
    display: flex;
    flex-direction: column;
    gap: 12px;
}
.hhm-budget-bar {
    background: #fff;
    border-radius: 10px;
    padding: 10px 12px;
    border: 1px solid rgba(0,0,0,.06);
    transition: transform .12s, box-shadow .12s;
}
.hhm-budget-bar:hover {
    transform: translateY(-1px);
    box-shadow: 0 2px 8px rgba(0,0,0,.06);
}
.hhm-budget-bar-head {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 6px;
}
.hhm-budget-bar-icon { font-size: 16px; }
.hhm-budget-bar-label {
    flex: 1;
    font-weight: 700;
    font-size: 13px;
    color: #111827;
}
.hhm-budget-bar-pct {
    font-weight: 700;
    font-size: 14px;
    color: var(--budget-color, #8224E3);
    font-variant-numeric: tabular-nums;
}
.hhm-budget-bar-track {
    height: 10px;
    background: rgba(0,0,0,.05);
    border-radius: 99px;
    overflow: hidden;
    position: relative;
}
.hhm-budget-bar-fill {
    height: 100%;
    background: var(--budget-color, #8224E3);
    border-radius: 99px;
    transition: width .6s cubic-bezier(.4,0,.2,1);
}
.hhm-budget-bar-meta {
    display: flex;
    justify-content: space-between;
    margin-top: 6px;
    font-size: 11px;
    color: #6b7280;
    gap: 12px;
    flex-wrap: wrap;
}
.hhm-budget-bar-desc { flex: 1; min-width: 120px; }
.hhm-budget-bar-amount { font-weight: 600; color: #4b5563; font-variant-numeric: tabular-nums; white-space: nowrap; }
.hhm-budget-bar-raised {
    color: #10b981;
    font-weight: 500;
    margin-left: 4px;
}

.hhm-budget-warning {
    background: rgba(245, 158, 11, .1);
    border: 1px solid rgba(245, 158, 11, .3);
    border-radius: 8px;
    padding: 8px 12px;
    margin-top: 12px;
    font-size: 12px;
    color: #92400e;
    text-align: center;
}

/* Total pill dans la modale */
.hhm-budget-total-pill {
    font-size: 13px;
    color: #6b7280;
    background: #fafafa;
    padding: 8px 14px;
    border-radius: 99px;
    border: 1px solid #e5e7eb;
}
.hhm-budget-total-pill [data-budget-total-value] {
    font-weight: 700;
    color: #dc2626;
}
.hhm-budget-total-pill [data-budget-total-value].is-valid {
    color: #10b981;
}

/* Palette de couleurs dans la sous-modale */
.hhm-budget-color-grid {
    display: flex;
    gap: 10px;
    flex-wrap: wrap;
    padding: 6px 0;
}
.hhm-budget-color-opt {
    cursor: pointer;
    position: relative;
}
.hhm-budget-color-opt input { display: none; }
.hhm-budget-color-dot {
    display: block;
    width: 30px;
    height: 30px;
    border-radius: 50%;
    border: 3px solid transparent;
    transition: all .15s ease;
}
.hhm-budget-color-opt:hover .hhm-budget-color-dot { transform: scale(1.1); }
.hhm-budget-color-opt input:checked + .hhm-budget-color-dot {
    border-color: #111827;
    box-shadow: 0 0 0 2px rgba(0,0,0,.05);
}

/* ─── v1.14.10 : Adaptation affichage budget (montant € principal) ─── */
.hhm-budget-bar-amount-main {
    font-weight: 700;
    font-size: 15px;
    color: var(--budget-color, #8224E3);
    font-variant-numeric: tabular-nums;
    white-space: nowrap;
}
.hhm-budget-bar-pct {
    font-size: 11px;
    color: #6b7280;
    font-weight: 600;
    font-variant-numeric: tabular-nums;
}
.hhm-budget-total-pill [data-budget-total-value] {
    color: #0072FF;
}

/* ═══════════════════════════════════════════════════════════════════
   v1.14.11 — Timeline Jalons
   v1.14.18 — Fix mordage gauche : repositionnement des dots dans le step
   ═══════════════════════════════════════════════════════════════════ */
.hhm-timeline {
    position: relative;
    padding: 10px 0;
    margin: 8px 0;
}
.hhm-timeline-track {
    position: absolute;
    left: 26px;
    top: 24px;
    bottom: 24px;
    width: 2px;
    background: linear-gradient(180deg, #e5e7eb, #d1d5db);
    z-index: 1;
}
.hhm-timeline-step {
    position: relative;
    padding-left: 62px;
    margin-bottom: 16px;
    z-index: 2;
}
.hhm-timeline-step:last-child { margin-bottom: 0; }
.hhm-timeline-step-dot {
    position: absolute;
    left: 8px;
    top: 0;
    width: 36px;
    height: 36px;
    border-radius: 50%;
    background: var(--ms-color, #9ca3af);
    display: flex;
    align-items: center;
    justify-content: center;
    box-shadow: 0 0 0 3px #fff, 0 0 0 5px var(--ms-color, #9ca3af);
    z-index: 3;
}
.hhm-timeline-step-icon {
    font-size: 16px;
    color: #fff;
    filter: drop-shadow(0 1px 1px rgba(0,0,0,.2));
}
.hhm-timeline-step.status-completed .hhm-timeline-step-dot::after {
    content: '✓';
    position: absolute;
    bottom: -2px;
    right: -2px;
    width: 18px;
    height: 18px;
    background: #fff;
    color: #10b981;
    border-radius: 50%;
    font-size: 12px;
    font-weight: 900;
    display: flex;
    align-items: center;
    justify-content: center;
    box-shadow: 0 1px 3px rgba(0,0,0,.15);
}
.hhm-timeline-step.status-in_progress .hhm-timeline-step-dot {
    animation: hhm-ms-pulse 2s ease-in-out infinite;
}
@keyframes hhm-ms-pulse {
    0%, 100% { box-shadow: 0 0 0 4px #fff, 0 0 0 6px var(--ms-color); }
    50%      { box-shadow: 0 0 0 4px #fff, 0 0 0 10px rgba(245, 158, 11, .25); }
}

.hhm-timeline-step-card {
    background: #fff;
    border: 1px solid rgba(0,0,0,.06);
    border-left: 3px solid var(--ms-color, #9ca3af);
    border-radius: 10px;
    padding: 12px 14px;
    transition: transform .12s, box-shadow .12s;
}
.hhm-timeline-step-card:hover {
    transform: translateY(-1px);
    box-shadow: 0 4px 12px rgba(0,0,0,.06);
}
.hhm-timeline-step-status {
    font-size: 10px;
    text-transform: uppercase;
    letter-spacing: .8px;
    color: var(--ms-color, #9ca3af);
    font-weight: 700;
    margin-bottom: 4px;
}
.hhm-timeline-step-title {
    margin: 0 0 4px;
    font-size: 14px;
    font-weight: 700;
    color: #111827;
}
.hhm-timeline-step-date {
    font-size: 12px;
    color: #6b7280;
    margin-bottom: 6px;
}
.hhm-timeline-step-desc {
    font-size: 12px;
    color: #4b5563;
    line-height: 1.5;
}

/* Modale : sélecteur de statut (radio pills) */
.hhm-milestone-status-grid {
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
    padding: 4px 0;
}
.hhm-milestone-status-opt {
    cursor: pointer;
    flex: 1;
    min-width: 100px;
}
.hhm-milestone-status-opt input { display: none; }
.hhm-milestone-status-pill {
    display: flex;
    align-items: center;
    gap: 6px;
    padding: 8px 12px;
    border: 2px solid #e5e7eb;
    border-radius: 99px;
    font-size: 13px;
    color: #4b5563;
    transition: all .15s ease;
    justify-content: center;
}
.hhm-milestone-status-dot {
    width: 10px;
    height: 10px;
    border-radius: 50%;
    background: var(--ms-status-color, #9ca3af);
}
.hhm-milestone-status-opt:hover .hhm-milestone-status-pill {
    border-color: var(--ms-status-color);
}
.hhm-milestone-status-opt input:checked + .hhm-milestone-status-pill {
    border-color: var(--ms-status-color);
    background: var(--ms-status-color);
    color: #fff;
    font-weight: 600;
}
.hhm-milestone-status-opt input:checked + .hhm-milestone-status-pill .hhm-milestone-status-dot {
    background: #fff;
}

/* ═══════════════════════════════════════════════════════════════════
   v1.14.12 — Ajustements UX Jalons
   ═══════════════════════════════════════════════════════════════════ */

/* Scrollbar timeline si > 5 jalons (max-height ~480px) */
.hhm-timeline {
    max-height: 480px;
    overflow-y: auto;
    padding-right: 8px;
}
.hhm-timeline::-webkit-scrollbar { width: 8px; }
.hhm-timeline::-webkit-scrollbar-track { background: transparent; }
.hhm-timeline::-webkit-scrollbar-thumb {
    background: rgba(99, 102, 241, .35);
    border-radius: 99px;
}
.hhm-timeline::-webkit-scrollbar-thumb:hover {
    background: rgba(99, 102, 241, .55);
}

/* Description jalon : police légèrement plus grande (12px → 13.5px) */
.hhm-timeline-step-desc {
    font-size: 13.5px;
    line-height: 1.55;
}

/* Grille d'icônes (sélecteur) */
.hhm-milestone-icon-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(44px, 1fr));
    gap: 6px;
    padding: 8px;
    background: #fafafa;
    border-radius: 8px;
    border: 1px solid #e5e7eb;
}
.hhm-milestone-icon-opt {
    background: #fff;
    border: 2px solid transparent;
    border-radius: 8px;
    padding: 6px;
    font-size: 18px;
    cursor: pointer;
    transition: all .12s ease;
    line-height: 1;
    aspect-ratio: 1;
    display: flex;
    align-items: center;
    justify-content: center;
}
.hhm-milestone-icon-opt:hover {
    border-color: rgba(99, 102, 241, .35);
    transform: scale(1.1);
}
.hhm-milestone-icon-opt.is-selected {
    border-color: #6366f1;
    background: #eef2ff;
    box-shadow: 0 0 0 2px rgba(99, 102, 241, .15);
}

/* Bouton "+" intégré comme dernier point de la timeline (visible owner) */
.hhm-timeline-add-step {
    position: relative;
    padding-left: 62px;
    margin-top: 8px;
    z-index: 2;
}
.hhm-timeline-add-btn {
    position: relative;
    display: flex;
    align-items: center;
    gap: 10px;
    background: linear-gradient(135deg, #6366f1, #8224E3);
    color: #fff;
    border: 0;
    padding: 12px 20px;
    border-radius: 12px;
    font-size: 14px;
    font-weight: 600;
    cursor: pointer;
    font-family: inherit;
    box-shadow: 0 4px 12px rgba(99, 102, 241, .25);
    transition: all .18s ease;
}
.hhm-timeline-add-btn:hover {
    transform: translateY(-2px);
    box-shadow: 0 8px 20px rgba(99, 102, 241, .35);
}
.hhm-timeline-add-btn:active {
    transform: translateY(0);
}
.hhm-timeline-add-dot {
    position: absolute;
    left: 8px;
    top: 50%;
    transform: translateY(-50%);
    width: 36px;
    height: 36px;
    border-radius: 50%;
    background: #fff;
    border: 2px dashed #6366f1;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #6366f1;
    font-size: 20px;
    font-weight: 300;
    line-height: 1;
    transition: all .18s ease;
}
.hhm-timeline-add-step:hover .hhm-timeline-add-dot {
    border-style: solid;
    background: #eef2ff;
    transform: translateY(-50%) scale(1.05);
}

/* ═══════════════════════════════════════════════════════════════════
   v1.14.13 — Bouton "Annuaire" (retour à la liste des causes)
   ═══════════════════════════════════════════════════════════════════ */
.hhm-cl-directory-btn {
    position: absolute;
    top: 12px;
    left: 12px;
    z-index: 10;
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 8px 14px;
    border: none;
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.95);
    color: #4b5563;
    font-size: 13px;
    font-weight: 700;
    font-family: inherit;
    text-decoration: none;
    cursor: pointer;
    box-shadow: 0 4px 14px rgba(0, 0, 0, 0.18);
    transition: all .15s ease;
    backdrop-filter: blur(8px);
}
.hhm-cl-directory-btn:hover {
    background: #fff;
    color: #8224E3;
    transform: translateY(-2px);
    box-shadow: 0 6px 20px rgba(130, 36, 227, 0.3);
    text-decoration: none;
}
.hhm-cl-directory-btn svg { display: block; }

@media (max-width: 480px) {
    .hhm-cl-directory-btn span { display: none; }
    .hhm-cl-directory-btn { padding: 8px 10px; }
}

/* v1.14.17 — Bouton "Ajouter un jalon" stylé dans la modale (cohérent avec celui de la timeline) */
/* v1.14.18 — Spécificité élevée pour battre les overrides du thème + modale */
.hhm-poll-modal .hhm-btn-add-milestone,
button.hhm-btn-add-milestone {
    background: linear-gradient(135deg, #6366f1, #8224E3) !important;
    color: #fff !important;
    border: 0 !important;
    padding: 10px 18px !important;
    border-radius: 10px !important;
    font-size: 14px !important;
    font-weight: 600 !important;
    cursor: pointer !important;
    font-family: inherit !important;
    box-shadow: 0 4px 12px rgba(99, 102, 241, .25) !important;
    transition: all .18s ease !important;
    text-transform: none !important;
    letter-spacing: normal !important;
    line-height: 1.4 !important;
    height: auto !important;
    width: auto !important;
    min-width: 0 !important;
}
.hhm-poll-modal .hhm-btn-add-milestone:hover,
button.hhm-btn-add-milestone:hover {
    transform: translateY(-2px) !important;
    box-shadow: 0 8px 20px rgba(99, 102, 241, .35) !important;
    background: linear-gradient(135deg, #6366f1, #8224E3) !important;
    color: #fff !important;
}
.hhm-poll-modal .hhm-btn-add-milestone:active,
button.hhm-btn-add-milestone:active {
    transform: translateY(0) !important;
}

/* ═══════════════════════════════════════════════════════════════════
   v1.14.20 — Forçage Arial sur tous les éléments des cards
   (le thème Essentials/pixfort impose sa propre police via "inherit",
    on neutralise pour avoir Arial partout dans la grille de causes)
   ═══════════════════════════════════════════════════════════════════ */
.hhm-causes-grid,
.hhm-causes-grid *,
.hhm-cause-card,
.hhm-cause-card *,
.hhm-card-title,
.hhm-card-excerpt,
.hhm-card-cat-badge,
.hhm-card-status-badge,
.hhm-card-stats,
.hhm-card-stats *,
.hhm-card-donate-btn,
.hhm-card-author,
.hhm-card-amount,
.hhm-card-goal,
.hhm-card-percentage,
.hhm-card-progress-label,
/* Variants */
.hhm-card-lb-title, .hhm-card-lb-excerpt, .hhm-card-lb-btn,
.hhm-card-vague-title, .hhm-card-vague-excerpt, .hhm-card-vague-btn,
.hhm-card-anneau-title, .hhm-card-anneau-excerpt,
.hhm-card-edito-title, .hhm-card-edito-excerpt, .hhm-card-edito-btn,
.hhm-card-fullbg-title, .hhm-card-fullbg-excerpt, .hhm-card-fullbg-btn,
.hhm-card-popular-title, .hhm-card-popular-excerpt, .hhm-card-popular-btn,
.hhm-card-badge-title, .hhm-card-badge-excerpt, .hhm-card-badge-btn {
    font-family: Arial, Helvetica, sans-serif !important;
}

/* ═══════════════════════════════════════════════════════════════════
   v1.14.21 — Mode "largeur fixe" pour carousel (slidesPerView: auto)
   ═══════════════════════════════════════════════════════════════════ */
.hhm-causes-carousel.has-fixed-slides .swiper-slide {
    width: var(--hhm-slide-width, 300px) !important;
    flex-shrink: 0;
}

/* ═══════════════════════════════════════════════════════════════════
   v1.14.21 — Police Arial NUCLÉAIRE sur les cards (tous variants)
   Le thème Essentials/pixfort applique sa police via des sélecteurs
   très spécifiques ; on les bat avec un sélecteur universel sur le
   container des cartes + !important.
   ═══════════════════════════════════════════════════════════════════ */
.hhm-causes-carousel,
.hhm-causes-carousel *,
.hhm-causes-grid,
.hhm-causes-grid *,
.hhm-ann-cards,
.hhm-ann-cards *,
[class*="hhm-card-"],
[class*="hhm-card-"] *,
.hhm-cause-card,
.hhm-cause-card *,
.hhm-cause-card-classique,
.hhm-cause-card-classique *,
.hhm-cause-card-lisere-bouton,
.hhm-cause-card-lisere-bouton *,
.hhm-cause-card-vague-coloree,
.hhm-cause-card-vague-coloree *,
.hhm-cause-card-anneau-chevauchant,
.hhm-cause-card-anneau-chevauchant *,
.hhm-cause-card-editorial,
.hhm-cause-card-editorial *,
.hhm-cause-card-plein-cadre-sombre,
.hhm-cause-card-plein-cadre-sombre *,
.hhm-cause-card-popular,
.hhm-cause-card-popular *,
.hhm-cause-card-badge-medias,
.hhm-cause-card-badge-medias * {
    font-family: Arial, Helvetica, sans-serif !important;
}

/* Garde les emojis natifs */
.hhm-causes-carousel .hhm-card-img-placeholder span,
.hhm-causes-grid .hhm-card-img-placeholder span,
.hhm-ann-cards .hhm-card-img-placeholder span {
    font-family: "Apple Color Emoji", "Segoe UI Emoji", "Noto Color Emoji", sans-serif !important;
}

/* ═══════════════════════════════════════════════════════════════════
   v1.14.22 — Mode "card_width" : largeur min des cartes en grille
   Fait comme l'annuaire : cartes serrées + espace vide à droite si
   peu de cartes (au lieu de s'étirer pour remplir la largeur).
   ═══════════════════════════════════════════════════════════════════ */
.hhm-causes-grid.has-card-min-width {
    grid-template-columns: repeat(auto-fill, minmax(var(--hhm-card-min-width, 280px), 1fr)) !important;
    justify-content: start;
}

/* Sur mobile : forcer 1 colonne pour les très petits écrans */
@media (max-width: 480px) {
    .hhm-causes-grid.has-card-min-width {
        grid-template-columns: 1fr !important;
    }
}

/* ═══════════════════════════════════════════════════════════════════
   v1.14.23 — Tailles de police agrandies sur les cartes
   (extrait + montants collecté/objectif)
   ═══════════════════════════════════════════════════════════════════ */

/* Extrait : 13px → 14.5px + line-height légèrement augmenté */
.hhm-causes-grid .hhm-card-excerpt,
.hhm-causes-carousel .hhm-card-excerpt,
.hhm-ann-cards .hhm-card-excerpt,
[class*="hhm-card-"] .hhm-card-excerpt {
    font-size: 14.5px !important;
    line-height: 1.65 !important;
}

/* Stats (montants collecté/objectif) : 14px → 16px */
.hhm-causes-grid .hhm-stat-value,
.hhm-causes-carousel .hhm-stat-value,
.hhm-ann-cards .hhm-stat-value,
[class*="hhm-card-"] .hhm-stat-value {
    font-size: 16px !important;
}

/* Labels stats (Collecté / Objectif) : 10px → 11.5px */
.hhm-causes-grid .hhm-stat-label,
.hhm-causes-carousel .hhm-stat-label,
.hhm-ann-cards .hhm-stat-label,
[class*="hhm-card-"] .hhm-stat-label {
    font-size: 11.5px !important;
}

/* Pour les variants spécifiques qui ont leurs propres classes amount/goal */
.hhm-card-amount, .hhm-card-amount * { font-size: 16px !important; font-weight: 700 !important; }
.hhm-card-goal, .hhm-card-goal * { font-size: 14.5px !important; }
.hhm-card-raised, .hhm-card-raised * { font-size: 16px !important; font-weight: 700 !important; }

/* ═══════════════════════════════════════════════════════════════════
   v1.14.25 — Flèches navigation en DEHORS des cartes
   (en mode has-fixed-slides, on ajoute un padding latéral au conteneur
    pour laisser de la place aux flèches, qui se positionnent dans cet espace)
   ═══════════════════════════════════════════════════════════════════ */

/* Conteneur du carousel : padding latéral pour accueillir les flèches */
.hhm-causes-carousel.has-fixed-slides {
    padding-left: 56px;
    padding-right: 56px;
    position: relative;
}

/* Flèches : positionnées DANS le padding (donc en dehors des cartes) */
.hhm-causes-carousel.has-fixed-slides .swiper-button-prev {
    left: 6px !important;
    right: auto !important;
}
.hhm-causes-carousel.has-fixed-slides .swiper-button-next {
    right: 6px !important;
    left: auto !important;
}

/* Sur mobile : réduire le padding pour ne pas trop perdre d'espace */
@media (max-width: 640px) {
    .hhm-causes-carousel.has-fixed-slides {
        padding-left: 44px;
        padding-right: 44px;
    }
    .hhm-causes-carousel.has-fixed-slides .swiper-button-prev { left: 2px !important; }
    .hhm-causes-carousel.has-fixed-slides .swiper-button-next { right: 2px !important; }
}

/* ═══════════════════════════════════════════════════════════════════
   v1.14.25 — Extrait carte légèrement plus grand encore
   ═══════════════════════════════════════════════════════════════════ */
.hhm-causes-grid .hhm-card-excerpt,
.hhm-causes-carousel .hhm-card-excerpt,
.hhm-ann-cards .hhm-card-excerpt,
[class*="hhm-card-"] .hhm-card-excerpt,
.hhm-causes-grid .hhm-ann-card-excerpt,
.hhm-causes-carousel .hhm-ann-card-excerpt,
.hhm-ann-cards .hhm-ann-card-excerpt,
[class*="hhm-card-"] .hhm-ann-card-excerpt {
    font-size: 15px !important;
    line-height: 1.6 !important;
}
