/* =========================================================
   OLDCHAINSAW — ÉCHANGES · Site public
   Version 3.1.1 — socle sombre OLDCHAINSAW
   ========================================================= */

/* Le module prolonge naturellement la zone noire de fin de fiche. */
.moduletable:has(.oc-exchanges),
.card:has(.oc-exchanges),
.mod-custom:has(.oc-exchanges),
[class*="module"]:has(> .oc-exchanges) {
  background:#0f100e !important;
  color:#eee6d7;
  border:0 !important;
  box-shadow:none !important;
  margin-top:0 !important;
  margin-bottom:0 !important;
}

/* Titre Joomla du module : petit repère orange, pas un second grand titre. */
.moduletable:has(.oc-exchanges) > h3,
.moduletable:has(.oc-exchanges) > .moduletable-heading,
.card:has(.oc-exchanges) > .card-header,
[class*="module"]:has(> .oc-exchanges) > h3 {
  max-width:1180px;
  margin:0 auto !important;
  padding:2.25rem 1.25rem .25rem !important;
  background:#0f100e !important;
  border:0 !important;
  color:#df6417 !important;
  font-family:inherit !important;
  font-size:.78rem !important;
  line-height:1.2 !important;
  font-weight:800 !important;
  letter-spacing:.14em !important;
  text-transform:uppercase !important;
}

.oc-exchanges {
  --oc-bg:#0f100e;
  --oc-panel:#151613;
  --oc-panel-2:#1a1b17;
  --oc-cream:#eee6d7;
  --oc-muted:#b9b09f;
  --oc-orange:#df6417;
  --oc-orange-hover:#f17422;
  --oc-line:#3c3a33;
  --oc-field:#10110f;

  box-sizing:border-box;
  max-width:none;
  margin:0;
  padding:2.1rem max(1.25rem, calc((100% - 1180px)/2)) 4.5rem;
  background:var(--oc-bg);
  color:var(--oc-cream);
}

/* Présentation : volontairement noire, sans carte crème. */
.oc-exchanges__head {
  position:relative;
  max-width:1180px;
  margin:0 auto 1.4rem;
  padding:1.7rem 0 1.85rem;
  background:transparent;
  border-top:1px solid var(--oc-line);
  border-bottom:1px solid var(--oc-line);
  border-radius:0;
  overflow:visible;
}
.oc-exchanges__head:after { display:none; }

.oc-exchanges__eyebrow,
.oc-exchanges__form-kicker {
  margin:0 0 .65rem;
  color:var(--oc-orange);
  font-size:.74rem;
  line-height:1.35;
  font-weight:800;
  letter-spacing:.14em;
  text-transform:uppercase;
}

.oc-exchanges h2 {
  margin:.1rem 0 .9rem;
  color:var(--oc-cream);
  font-family:Georgia,'Times New Roman',serif;
  font-size:clamp(2rem,4vw,3.15rem);
  line-height:1.04;
  font-weight:600;
}

.oc-exchanges__head p:not(.oc-exchanges__eyebrow) {
  max-width:880px;
  margin:.45rem 0;
  color:var(--oc-muted);
  line-height:1.7;
}

/* Formulaire sombre. */
.oc-exchanges__form-card {
  max-width:1180px;
  box-sizing:border-box;
  margin:0 auto;
  padding:1.75rem 1.9rem 2rem;
  background:var(--oc-panel);
  border:1px solid var(--oc-line);
  border-radius:14px;
  box-shadow:none;
}

.oc-exchanges__form-card h3,
.oc-exchanges__threads h3 {
  margin:.1rem 0 .4rem;
  color:var(--oc-cream);
  font-family:Georgia,'Times New Roman',serif;
  font-size:1.45rem;
}

.oc-exchanges__form-lead {
  margin:0 0 1.15rem;
  color:var(--oc-muted);
}

.oc-exchange-grid {
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:1.1rem;
}

.oc-exchange-form label {
  display:block;
  margin:.9rem 0 .38rem;
  color:var(--oc-cream);
  font-size:.92rem;
  font-weight:750;
}

.oc-exchange-form input,
.oc-exchange-form select,
.oc-exchange-form textarea {
  box-sizing:border-box;
  width:100%;
  padding:.82rem .9rem;
  border:1px solid #4a473f;
  border-radius:8px;
  background:var(--oc-field);
  color:var(--oc-cream);
  caret-color:var(--oc-orange);
  transition:border-color .18s,box-shadow .18s,background .18s;
}

.oc-exchange-form input::placeholder,
.oc-exchange-form textarea::placeholder { color:#817a6e; }

.oc-exchange-form select { color:var(--oc-cream); }
.oc-exchange-form select option { background:#151613; color:var(--oc-cream); }

.oc-exchange-form input:focus,
.oc-exchange-form select:focus,
.oc-exchange-form textarea:focus {
  outline:0;
  border-color:var(--oc-orange);
  background:#131410;
  box-shadow:0 0 0 3px rgba(223,100,23,.14);
}

.oc-exchange-form textarea { resize:vertical; min-height:145px; }
.oc-exchange-form small { display:block; margin-top:.4rem; color:#928a7c; }

.oc-exchanges__submit {
  display:flex;
  align-items:center;
  gap:1rem;
  flex-wrap:wrap;
  margin-top:1.3rem;
}

.oc-exchange-form button {
  padding:.82rem 1.2rem;
  border:1px solid var(--oc-orange);
  border-radius:7px;
  background:var(--oc-orange);
  color:#fff8ed;
  font-weight:800;
  letter-spacing:.025em;
  cursor:pointer;
  transition:transform .15s,background .15s,border-color .15s;
}
.oc-exchange-form button:hover {
  transform:translateY(-1px);
  background:var(--oc-orange-hover);
  border-color:var(--oc-orange-hover);
}
.oc-exchange-form button span { padding-left:.35rem; }
.oc-exchanges__moderation { max-width:500px; margin:0; color:#928a7c; font-size:.84rem; }

/* Échanges publiés. */
.oc-exchanges__threads {
  max-width:1180px;
  margin:2.4rem auto 0;
  padding-top:.4rem;
}
.oc-thread {
  position:relative;
  margin:1rem 0;
  padding:1.35rem 1.45rem;
  background:var(--oc-panel-2);
  border:1px solid var(--oc-line);
  border-radius:12px;
  box-shadow:none;
  color:var(--oc-cream);
}
.oc-thread__meta { display:flex; gap:.65rem; align-items:center; flex-wrap:wrap; margin-bottom:.7rem; }
.oc-thread__meta strong { color:var(--oc-cream); font-size:1.02rem; }
.oc-badge {
  display:inline-block;
  padding:.22rem .62rem;
  border:1px solid rgba(223,100,23,.45);
  border-radius:999px;
  background:rgba(223,100,23,.09);
  color:#f18a49;
  font-size:.75rem;
  font-weight:750;
}
.oc-thread>p { margin:.5rem 0; color:#d2c9ba; line-height:1.65; }
.oc-reply {
  margin-top:1.1rem;
  padding:1rem 1.15rem;
  border-left:4px solid var(--oc-orange);
  border-radius:0 8px 8px 0;
  background:#11120f;
}
.oc-reply strong { color:var(--oc-orange); font-size:.72rem; letter-spacing:.12em; }
.oc-reply p { margin:.5rem 0 0; color:#d8d0c2; line-height:1.65; }

@media (max-width:700px) {
  .oc-exchanges { padding:1.5rem .8rem 3rem; }
  .oc-exchanges__head { padding:1.35rem 0 1.5rem; }
  .oc-exchanges__form-card { padding:1.35rem; }
  .oc-exchange-grid { grid-template-columns:1fr; }
  .oc-exchanges__submit { align-items:flex-start; flex-direction:column; }
  .moduletable:has(.oc-exchanges) > h3,
  .moduletable:has(.oc-exchanges) > .moduletable-heading,
  .card:has(.oc-exchanges) > .card-header,
  [class*="module"]:has(> .oc-exchanges) > h3 { padding-left:.8rem !important; padding-right:.8rem !important; }
}
