/* ================================================================
   Athelis Forum v2.0 — CSS principal
   Palette : crème #FAF6EF · bordeaux #8B1A1A · or #C9A84C
   Surcharges !important contre le thème NewsBlogger
   ================================================================ */

:root {
  --af-bordeaux:  #8B1A1A;
  --af-bordeaux2: #B03030;
  --af-or:        #C9A84C;
  --af-creme:     #FAF6EF;
  --af-creme2:    #EFE9DE;
  --af-texte:     #2C2014;
  --af-texte2:    #6B5B45;
  --af-border:    #D8CEBB;
  --af-white:     #FFFFFF;
  --af-radius:    6px;
  --af-shadow:    0 2px 10px rgba(44,32,20,.09);
  --af-max:       940px;
  --af-font:      Arial, Helvetica, sans-serif;
}

/* ── Reset thème ── */
.af-wrap,
.af-wrap * {
  box-sizing: border-box;
}
.af-wrap {
  font-family: var(--af-font) !important;
  color: var(--af-texte) !important;
  max-width: var(--af-max);
  margin: 0 auto;
  padding: 0 16px 60px;
  background: var(--af-creme);
}
/* Forcer couleurs liens — NewsBlogger les rend blancs dans certains contextes */
.af-wrap a { color: var(--af-bordeaux) !important; text-decoration: none !important; }
.af-wrap a:hover { color: var(--af-bordeaux2) !important; text-decoration: underline !important; }
.af-wrap h1, .af-wrap h2, .af-wrap h3 {
  color: var(--af-texte) !important;
  background: transparent !important;
}

/* ── Boutons ── */
.af-btn {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 9px 20px;
  border-radius: var(--af-radius);
  font-family: var(--af-font);
  font-size: 14px;
  font-weight: 600;
  text-decoration: none !important;
  cursor: pointer;
  border: 2px solid transparent;
  transition: all .18s;
  line-height: 1.3;
}
.af-btn--primary {
  background: var(--af-bordeaux) !important;
  color: #fff !important;
  border-color: var(--af-bordeaux) !important;
}
.af-btn--primary:hover {
  background: var(--af-bordeaux2) !important;
  border-color: var(--af-bordeaux2) !important;
  text-decoration: none !important;
}
.af-btn--outline {
  background: transparent !important;
  color: var(--af-bordeaux) !important;
  border-color: var(--af-bordeaux) !important;
}
.af-btn--outline:hover {
  background: var(--af-bordeaux) !important;
  color: #fff !important;
  text-decoration: none !important;
}
.af-btn--sm { padding: 5px 12px; font-size: 13px; }

/* ── Hero ── */
.af-hero {
  background: linear-gradient(135deg, var(--af-bordeaux) 0%, #5a0f0f 100%);
  border-top: 4px solid var(--af-or);
  color: #fff;
  text-align: center;
  padding: 36px 24px 28px;
  border-radius: 0 0 var(--af-radius) var(--af-radius);
  margin-bottom: 24px;
}
.af-hero__icon { font-size: 42px; line-height: 1; margin-bottom: 10px; }
.af-hero__title {
  font-size: 26px;
  font-weight: 700;
  color: #fff !important;
  margin: 0 0 8px;
  font-family: Georgia, serif !important;
}
.af-hero__sub { color: rgba(255,255,255,.8); margin: 0 0 20px; font-size: 15px; }
.af-hero__counts { display: flex; justify-content: center; gap: 32px; }
.af-hero__count { display: flex; flex-direction: column; }
.af-hero__count b { font-size: 28px; color: var(--af-or); }
.af-hero__count span { font-size: 12px; color: rgba(255,255,255,.7); }

/* ── Recherche ── */
.af-search {
  display: flex;
  gap: 8px;
  margin-bottom: 24px;
}
.af-search__input {
  flex: 1;
  padding: 10px 14px;
  border: 2px solid var(--af-border);
  border-radius: var(--af-radius);
  font-size: 14px;
  background: #fff;
  color: var(--af-texte);
}
.af-search__input:focus {
  outline: none;
  border-color: var(--af-bordeaux);
}

/* ── Encarts types de messages ── */
.af-types-info {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 14px;
  margin-bottom: 28px;
}
.af-type-card {
  background: var(--af-white);
  border: 1px solid var(--af-border);
  border-radius: var(--af-radius);
  padding: 16px;
}
.af-type-card__icon { font-size: 28px; display: block; margin-bottom: 6px; }
.af-type-card strong { display: block; color: var(--af-bordeaux) !important; font-size: 15px; margin-bottom: 6px; }
.af-type-card p { font-size: 13px; color: var(--af-texte2); margin: 0 0 6px; }
.af-type-card small { font-size: 12px; color: var(--af-texte2); }

/* ── Titre de section ── */
.af-section-title {
  font-size: 17px !important;
  font-weight: 700 !important;
  color: var(--af-texte) !important;
  border-bottom: 2px solid var(--af-border);
  padding-bottom: 8px;
  margin: 0 0 14px !important;
}

/* ── Tableau des collections ── */
.af-collections-table { background: var(--af-white); border: 1px solid var(--af-border); border-radius: var(--af-radius); overflow: hidden; }
.af-collections-table__head,
.af-collections-table__row {
  display: grid;
  grid-template-columns: 1fr 70px 70px 160px 90px;
  align-items: center;
  padding: 10px 14px;
  gap: 10px;
}
.af-collections-table__head {
  background: var(--af-creme2);
  font-size: 12px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .04em;
  color: var(--af-texte2) !important;
}
.af-collections-table__row {
  border-top: 1px solid var(--af-border);
  transition: background .15s;
}
.af-collections-table__row:hover { background: var(--af-creme); }
.af-col-info { display: flex; align-items: center; gap: 12px; }
.af-col-icon { font-size: 22px; flex-shrink: 0; }
.af-col-name { font-weight: 600; color: var(--af-bordeaux) !important; font-size: 15px; }
.af-col-desc { font-size: 12px; color: var(--af-texte2); margin: 2px 0 0; }
.af-col-stat { text-align: center; font-size: 15px; font-weight: 600; color: var(--af-texte); }
.af-col-last { font-size: 13px; }
.af-col-last a { color: var(--af-texte2) !important; font-size: 12px; }
.af-col-last a:hover { color: var(--af-bordeaux) !important; }
.af-col-last time { display: block; font-size: 11px; color: var(--af-texte2); }

/* ── Messages récents ── */
.af-recent-msgs { display: flex; flex-direction: column; gap: 10px; margin-top: 8px; }
.af-recent-msg {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  background: var(--af-white);
  border: 1px solid var(--af-border);
  border-radius: var(--af-radius);
  padding: 12px;
  transition: background .15s;
}
.af-recent-msg:hover { background: var(--af-creme); }
.af-recent-msg__body { flex: 1; min-width: 0; }
.af-recent-msg__top { font-size: 13px; display: flex; align-items: center; gap: 6px; flex-wrap: wrap; }
.af-recent-msg__top a { color: var(--af-bordeaux) !important; font-weight: 600; }
.af-recent-msg__text { font-size: 13px; color: var(--af-texte2); margin: 4px 0 0; }
.af-recent-msg__meta { font-size: 12px; display: block; margin-top: 4px; }
.af-badge-annonce { background: #fff3cd; color: #856404; font-size: 11px; padding: 1px 5px; border-radius: 3px; }

/* ── Disclaimer ── */
.af-disclaimer {
  margin-top: 32px;
  padding: 14px 18px;
  background: #fff3cd;
  border: 1px solid #ffc107;
  border-radius: var(--af-radius);
  font-size: 13px;
  color: #856404;
}

/* ── Breadcrumb ── */
.af-breadcrumb {
  font-size: 13px;
  color: var(--af-texte2);
  margin-bottom: 16px;
  display: flex;
  align-items: center;
  gap: 6px;
  flex-wrap: wrap;
}
.af-breadcrumb a { color: var(--af-bordeaux) !important; }
.af-breadcrumb a:hover { text-decoration: underline !important; }

/* ── En-tête collection ── */
.af-col-header {
  display: flex;
  align-items: center;
  gap: 16px;
  background: var(--af-white);
  border: 1px solid var(--af-border);
  border-radius: var(--af-radius);
  padding: 16px;
  margin-bottom: 20px;
}
.af-col-big-icon { font-size: 40px; flex-shrink: 0; }
.af-page-title { font-size: 22px !important; font-weight: 700 !important; margin: 0 0 4px !important; color: var(--af-bordeaux) !important; }

/* ── Liste sujets ── */
.af-sujets-list { background: var(--af-white); border: 1px solid var(--af-border); border-radius: var(--af-radius); overflow: hidden; }
.af-sujets-list__head {
  display: grid;
  grid-template-columns: 1fr 80px 150px;
  padding: 8px 14px;
  background: var(--af-creme2);
  font-size: 12px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .04em;
  color: var(--af-texte2) !important;
  gap: 10px;
}
.af-sujet-row {
  display: grid;
  grid-template-columns: 65px 1fr 80px 150px;
  align-items: center;
  gap: 10px;
  padding: 10px 14px;
  border-top: 1px solid var(--af-border);
  transition: background .15s;
}
.af-sujet-row:hover { background: var(--af-creme); }
.af-sujet-row--active .af-sujet-row__msgs b { color: var(--af-bordeaux); }
.af-sujet-row__cover img,
.af-sujet-row__cover .af-cover-placeholder {
  width: 55px;
  height: 75px;
  object-fit: cover;
  border-radius: 3px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: var(--af-creme2);
  font-size: 22px;
  color: var(--af-texte2);
}
.af-sujet-row__info { display: flex; flex-direction: column; gap: 3px; }
.af-sujet-row__title {
  font-weight: 600 !important;
  font-size: 14px !important;
  color: var(--af-bordeaux) !important;
  line-height: 1.35;
}
.af-sujet-row__title:hover { text-decoration: underline !important; }
.af-sujet-row__author { font-size: 12px; color: var(--af-texte2); }
.af-num { font-size: 11px; color: var(--af-texte2); background: var(--af-creme2); padding: 1px 5px; border-radius: 3px; }
.af-sujet-row__msgs { text-align: center; }
.af-sujet-row__msgs b { font-size: 16px; display: block; }
.af-sujet-row__msgs small { font-size: 11px; color: var(--af-texte2); }
.af-sujet-row__last { font-size: 12px; }
.af-sujet-row__last time { display: block; color: var(--af-texte2); }
.af-sujet-row__last span { font-size: 11px; color: var(--af-texte2); }

/* ── Pagination ── */
.af-pagination { margin-top: 20px; display: flex; gap: 6px; flex-wrap: wrap; }
.af-pagination .page-numbers {
  padding: 6px 12px;
  border: 1px solid var(--af-border);
  border-radius: var(--af-radius);
  font-size: 13px;
  color: var(--af-bordeaux) !important;
  background: var(--af-white);
}
.af-pagination .current {
  background: var(--af-bordeaux) !important;
  color: #fff !important;
  border-color: var(--af-bordeaux) !important;
}

/* ── Fiche sujet ── */
.af-sujet-card {
  display: flex;
  gap: 20px;
  background: var(--af-white);
  border: 1px solid var(--af-border);
  border-radius: var(--af-radius);
  padding: 20px;
  margin-bottom: 24px;
}
.af-sujet-card__cover img { width: 180px; height: auto; border-radius: 4px; box-shadow: var(--af-shadow); }
.af-sujet-card__body { flex: 1; }
.af-sujet-card__title { font-size: 22px !important; font-weight: 700 !important; color: var(--af-bordeaux) !important; margin: 0 0 8px !important; }
.af-sujet-card__author { color: var(--af-texte2); margin: 0 0 8px; font-size: 15px; }
.af-sujet-card__desc { font-size: 14px; color: var(--af-texte2); margin-top: 10px; }
.af-sujet-card__desc a { color: var(--af-bordeaux) !important; }

/* ── Onglets ── */
.af-tabs {
  display: flex;
  border-bottom: 2px solid var(--af-border);
  margin-bottom: 18px;
  gap: 4px;
}
.af-tab {
  padding: 10px 20px;
  font-size: 14px;
  font-weight: 600;
  color: var(--af-texte2) !important;
  border: 1px solid transparent;
  border-bottom: none;
  border-radius: var(--af-radius) var(--af-radius) 0 0;
  cursor: pointer;
  background: var(--af-creme2);
  text-decoration: none !important;
  transition: all .15s;
}
.af-tab:hover { color: var(--af-bordeaux) !important; background: var(--af-creme); }
.af-tab--active {
  background: var(--af-white) !important;
  color: var(--af-bordeaux) !important;
  border-color: var(--af-border);
  margin-bottom: -2px;
  padding-bottom: 12px;
}
.af-tab-count {
  background: var(--af-bordeaux);
  color: #fff;
  font-size: 11px;
  padding: 1px 6px;
  border-radius: 10px;
  margin-left: 4px;
}

/* ── Messages individuels ── */
.af-message {
  background: var(--af-white) !important;
  border: 1px solid var(--af-border);
  border-radius: var(--af-radius);
  padding: 14px;
  margin-bottom: 10px;
  position: relative;
}
.af-message--annonce {
  border-left: 4px solid #e67e22;
  background: #fffaf0 !important;
}
.af-message--commentaire {
  border-left: 4px solid var(--af-bordeaux);
}
.af-message__header {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-bottom: 10px;
}
.af-message__meta { flex: 1; display: flex; flex-direction: column; gap: 2px; }
.af-message__author { font-weight: 600; font-size: 14px; color: var(--af-texte) !important; }
.af-message__date { font-size: 12px; color: var(--af-texte2); }
.af-msg-type { font-size: 11px; padding: 2px 6px; border-radius: 3px; width: fit-content; }
.af-msg-type--commentaire { background: #e8f4fd; color: #1a6ca8; }
.af-msg-type--annonce { background: #fff3cd; color: #856404; }
.af-message__content {
  font-size: 14px;
  line-height: 1.65;
  color: var(--af-texte);
  word-wrap: break-word;
}
.af-message__content a { color: var(--af-bordeaux) !important; }
.af-delete-msg {
  position: absolute;
  top: 10px;
  right: 10px;
  background: none;
  border: 1px solid #ddd;
  border-radius: 4px;
  cursor: pointer;
  font-size: 12px;
  color: #999;
  padding: 2px 6px;
  line-height: 1;
  transition: all .15s;
}
.af-delete-msg:hover { background: #fee; color: #c00; border-color: #c00; }

/* ── Avatars ── */
.af-avatar-sm { border-radius: 50%; flex-shrink: 0; }
img.af-avatar-sm { width: 36px !important; height: 36px !important; }

/* ── Zones info formulaire ── */
.af-annonce-info,
.af-commentaire-info {
  padding: 10px 14px;
  border-radius: var(--af-radius);
  font-size: 13px;
  margin-bottom: 12px;
}
.af-annonce-info { background: #fff3cd; color: #856404; border: 1px solid #ffc107; }
.af-commentaire-info { background: #e8f4fd; color: #1a6ca8; border: 1px solid #bee3f8; }

/* ── Formulaire message ── */
.af-form-section {
  margin-top: 30px;
  padding-top: 20px;
  border-top: 2px solid var(--af-border);
}
.af-form-title { font-size: 17px !important; font-weight: 700 !important; color: var(--af-texte) !important; margin: 0 0 12px !important; }
.af-msg-textarea {
  width: 100%;
  min-height: 110px;
  padding: 12px;
  border: 2px solid var(--af-border);
  border-radius: var(--af-radius);
  font-family: var(--af-font);
  font-size: 14px;
  resize: vertical;
  color: var(--af-texte);
  background: var(--af-white);
  transition: border-color .15s;
}
.af-msg-textarea:focus { outline: none; border-color: var(--af-bordeaux); }
.af-msg-form__foot {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-top: 8px;
}
.af-char-count { font-size: 12px; color: var(--af-texte2); }
.af-msg-form__feedback {
  margin-top: 8px;
  font-size: 13px;
  min-height: 18px;
}
.af-msg-form__feedback.success { color: #276749; }
.af-msg-form__feedback.error   { color: #c00; }

/* ── Login prompt ── */
.af-login-prompt {
  text-align: center;
  padding: 30px;
  background: var(--af-white);
  border: 1px solid var(--af-border);
  border-radius: var(--af-radius);
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 12px;
}
.af-login-prompt__icon { font-size: 36px; }
.af-login-prompt p { font-size: 15px; color: var(--af-texte2); margin: 0; }

/* ── Vide ── */
.af-empty {
  text-align: center;
  padding: 40px 20px;
  color: var(--af-texte2);
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 10px;
}
.af-empty span { font-size: 40px; }
.af-empty p { margin: 0; font-size: 15px; }

/* ── Utilitaires ── */
.af-muted { color: var(--af-texte2) !important; }

/* ── Responsive ── */
@media (max-width: 700px) {
  .af-hero__counts { gap: 20px; }
  .af-types-info { grid-template-columns: 1fr; }
  .af-collections-table__head { display: none; }
  .af-collections-table__row {
    grid-template-columns: 1fr auto;
    grid-template-rows: auto auto;
  }
  .af-col-last, .af-col-stat:last-of-type { display: none; }
  .af-sujets-list__head { display: none; }
  .af-sujet-row { grid-template-columns: 55px 1fr; grid-template-rows: auto auto; }
  .af-sujet-row__msgs, .af-sujet-row__last { grid-column: 2; }
  .af-sujet-card { flex-direction: column; }
  .af-sujet-card__cover img { width: 120px; }
  .af-tabs { flex-direction: column; border-bottom: none; }
  .af-tab { border-radius: var(--af-radius); border: 1px solid var(--af-border); }
  .af-tab--active { margin-bottom: 0; padding-bottom: 10px; }
}