/* ─── Page header with grid pattern ─── */
.ann-page-header {
  position: relative;
  padding: 1.5rem 1.75rem;
  border-radius: 0;
  border: none;
  border-bottom: 1px solid #d1cbc0;
  overflow: hidden;
  margin: -1.5rem calc(-50vw + 50%) 1.5rem;
  padding-left: calc(50vw - 50%);
  padding-right: calc(50vw - 50%);
  background-color: #e8e4da;
  display: flex;
  align-items: center;
  gap: 1.25rem;
}
.ann-dots-canvas {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  pointer-events: none;
  opacity: .7;
}
.ann-page-header-icon {
  position: relative; z-index: 1;
  width: 64px; height: 64px; border-radius: 16px;
  background: #d1cbc078; border: 1px solid #d1cbc0;
  display: flex; align-items: center; justify-content: center;
  font-size: 1.6rem; color: #1a1a1a; flex-shrink: 0;
}
.ann-page-header-text { position: relative; z-index: 1; }
.ann-page-header-text h1 { font-size: 1.5rem; font-weight: 700; margin: 0 0 .2rem; color: var(--ss-text, #1a1a1a); }
.ann-page-header-text p { margin: 0; color: var(--ss-text-secondary, #6b7280); font-size: .88rem; }

/* ─── Breadcrumb ─── */
.ann-breadcrumb-wrap {
  border-bottom: 1px solid #d1cbc078;
  margin: -1.5rem calc(-50vw + 50%) 1.5rem;
  padding: 0 calc(50vw - 50%);
}
.ann-breadcrumb-inner { display: flex; align-items: center; justify-content: space-between; padding: 8px 0; }
.ann-breadcrumb { list-style: none; margin: 0; padding: 0; display: flex; align-items: center; font-size: .82rem; }
.ann-breadcrumb li { display: inline-flex; align-items: center; }
.ann-breadcrumb a { display: inline-flex; align-items: center; gap: 5px; color: var(--ss-text-muted, #8a8578); text-decoration: none; transition: color .2s; font-weight: 500; font-size: .95rem; }
.ann-breadcrumb a:hover { color: var(--ss-teal, #2a9d8f); }
.ann-breadcrumb-sep { color: #d1cbc0; margin: 0 8px; font-size: .65rem; }
.ann-breadcrumb-current { color: var(--ss-text, #1a1a1a); font-weight: 600; }
.ann-breadcrumb-stats { display: flex; align-items: center; gap: .75rem; }
.ann-bc-stat { font-size: .75rem; color: var(--ss-text-muted, #8a8578); display: inline-flex; align-items: center; gap: .3rem; }
.ann-bc-stat strong { color: var(--ss-text, #1a1a1a); font-weight: 700; }
.ann-bc-stat i { font-size: .7rem; }

/* ─── Annonces list (same as admin/care) ─── */
.ann-filters { display:flex; flex-wrap:wrap; gap:6px; margin-bottom:16px; }
.ann-filter-btn { border:1px solid #dee2e6; background:#fff; border-radius:20px; padding:4px 14px; font-size:.8rem; cursor:pointer; transition:all .2s; display:inline-flex; align-items:center; gap:5px; }
.ann-filter-btn:hover, .ann-filter-btn.active { color:#fff; border-color:transparent; }

.ann-list { display:flex; flex-direction:column; gap:12px; }
.ann-card {
    display:flex; gap:16px; background:#fff; border:1px solid #e9ecef; border-radius:10px;
    padding:16px; cursor:pointer; transition:all .2s; position:relative; overflow:hidden;
}
.ann-card:hover { border-color:var(--ss-teal, #2d4a43); box-shadow:0 2px 8px rgba(0,0,0,.06); }
.ann-card.pinned { border-left:3px solid var(--ss-teal, #2d4a43); }
.ann-card-img { width:120px; height:90px; border-radius:8px; object-fit:cover; flex-shrink:0; background:#f0eeea; }
.ann-card-img-placeholder {
    width:120px; height:90px; border-radius:8px; flex-shrink:0; background:#f0eeea;
    display:flex; align-items:center; justify-content:center; color:#adb5bd; font-size:1.5rem;
}
.ann-card-body { flex:1; min-width:0; }
.ann-card-title { font-weight:600; font-size:.95rem; margin-bottom:4px; }
.ann-card-desc { font-size:.82rem; color:#6c757d; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; margin-bottom:8px; }
.ann-card-meta { font-size:.72rem; color:#adb5bd; display:flex; gap:10px; align-items:center; }
.ann-card-cat { font-size:.68rem; padding:2px 8px; border-radius:10px; color:#fff; display:inline-flex; align-items:center; gap:3px; font-weight:600; }
.ann-card-pin { position:absolute; top:10px; right:12px; color:var(--ss-teal, #2d4a43); font-size:.85rem; }

/* ─── Read view ─── */
.ann-read-panel { background:#fff; border:1px solid #e9ecef; border-radius:10px; overflow:hidden; }
.ann-read-hero { width:100%; max-height:300px; object-fit:cover; display:block; }
.ann-read-content-wrap { padding:24px; }
.ann-read-content-wrap h1 { font-size:1.4rem; font-weight:700; margin-bottom:4px; }
.ann-read-meta { font-size:.78rem; color:#6c757d; margin-bottom:16px; padding-bottom:12px; border-bottom:1px solid #f0f0f0; }
.ann-read-body { font-size:.92rem; line-height:1.7; }
.ann-read-body h2 { font-size:1.15rem; font-weight:700; margin-top:20px; margin-bottom:8px; color:var(--ss-teal, #2d4a43); }
.ann-read-body h3 { font-size:1rem; font-weight:600; margin-top:16px; margin-bottom:6px; }
.ann-read-body img { max-width:100%; border-radius:6px; margin:8px 0; }
.ann-read-body blockquote { border-left:3px solid var(--ss-teal, #2d4a43); padding-left:12px; color:#6c757d; margin:12px 0; font-style:italic; }
.ann-read-body table { border-collapse:collapse; width:100%; margin:12px 0; border:1px solid #dee2e6; }
.ann-read-body table th { background:#f8f9fa; font-weight:600; font-size:.85rem; padding:10px 12px; border:1px solid #dee2e6; text-align:left; }
.ann-read-body table td { padding:10px 12px; border:1px solid #dee2e6; font-size:.88rem; vertical-align:top; }
.ann-read-body table tr:hover td { background:#fafaf7; }

.ann-empty { text-align:center; padding:60px 20px; color:#adb5bd; }
.ann-empty .bi { font-size:3rem; display:block; margin-bottom:12px; }

/* ─── Signature cursive ─── */
.ann-signature {
  margin-top: 2.5rem;
  padding-top: 1.5rem;
  text-align: right;
}
.ann-signature-line {
  width: 80px;
  height: 1px;
  background: #d1cbc0;
  margin-left: auto;
  margin-bottom: 1rem;
}
.ann-signature-name {
  font-family: 'Pacifico', cursive;
  font-size: 1.6rem;
  color: var(--ss-teal, #2a9d8f);
  line-height: 1.2;
}
.ann-signature-role {
  font-size: .78rem;
  color: var(--ss-text-muted, #8a8578);
  margin-top: .2rem;
  font-weight: 500;
}

.ann-ack-badge { display:inline-block; background:#fff3cd; color:#856404; padding:2px 8px; border-radius:10px; font-size:.7rem; font-weight:600; }
.ann-ack-required { background:#fff8e1; border:1px solid #ffe082; border-radius:8px; padding:14px; margin:14px 0; color:#7a5c00; font-size:.88rem; }
.ann-ack-confirmed { background:#d4edda; border:1px solid #a7d4b0; border-radius:8px; padding:10px 14px; margin:14px 0; color:#155724; font-size:.85rem; display:flex; align-items:center; gap:8px; }

@media(max-width:576px) {
    .ann-card { flex-direction:column; }
    .ann-card-img, .ann-card-img-placeholder { width:100%; height:140px; }
}
