.foro-btn,
.foro-intro__cta {
  display:         inline-flex;
  align-items:     center;
  justify-content: center;
  min-height:      3rem;
  padding:         var(--space-3) var(--space-8);
  color:           var(--nexo-cream);
  font-family:     var(--font-heading);
  font-size:       var(--fs-sm);
  font-weight:     var(--fw-semibold);
}

/* CTA de página (navegación) en el accent; submit de formulario en morado,
   igual que los formularios del tema (cuenta / industria-form). */
.foro-intro__cta { background: var(--section-accent, var(--nexo-red)); }
.foro-btn        { background: var(--nexo-purple); }

/* ===========================================================================
   Lista (template-foro.php)
   =========================================================================== */
.foro-page {
  position:   relative;
  background: var(--nexo-bg);
  color:      var(--nexo-dark);
}

.foro-page__body {
  padding-block: clamp(var(--space-12), 8vh, var(--space-24));
}

.foro-intro {
  display:          flex;
  flex-wrap:        wrap;
  align-items:      center;
  justify-content:  space-between;
  gap:              var(--space-6);
  margin-block-end: clamp(var(--space-8), 5vh, var(--space-12));
}

.foro-intro__lead {
  flex:        1 1 28ch;
  max-width:   52ch;
  font-family: var(--font-heading);
  font-size:   var(--fs-lg);
  line-height: var(--lh-snug);
}

.foro-intro__cta { flex: 0 0 auto; }

.foro-cats {
  display:          flex;
  flex-wrap:        wrap;
  gap:              var(--space-3) var(--space-4);
  margin-block-end: clamp(var(--space-16), 9vh, var(--space-24));
}

.foro-cats__chip {
  display:       inline-flex;
  align-items:   center;
  gap:           var(--space-2);
  padding:       var(--space-2) var(--space-5);
  border:        2px solid var(--nexo-dark);
  border-radius: 999px;
  font-family:   var(--font-heading);
  font-size:     var(--fs-sm);
  font-weight:   var(--fw-semibold);
  color:         var(--nexo-dark);
  transition:    background var(--duration-fast) ease, color var(--duration-fast) ease;
}

.foro-cats__chip:hover {
  background: var(--nexo-dark);
  color:      var(--nexo-cream);
}

.foro-cats__chip--cyan   { --cat: var(--nexo-cyan);   }
.foro-cats__chip--green  { --cat: #29E5A0;            }
.foro-cats__chip--yellow { --cat: var(--nexo-yellow); }

.foro-cats__chip::before {
  content:       "";
  width:         .55rem;
  height:        .55rem;
  border-radius: 50%;
  background:    var(--cat, var(--nexo-dark));
}

.foro-cats__count {
  font-size:   var(--fs-xs);
  font-weight: var(--fw-bold);
}

.foro-section {
  scroll-margin-top: var(--space-12);
}

.foro-section--cyan   { --cat: var(--nexo-cyan);   }
.foro-section--green  { --cat: #29E5A0;            }
.foro-section--yellow { --cat: var(--nexo-yellow); }

.foro-section + .foro-section {
  margin-block-start: clamp(var(--space-16), 9vh, var(--space-24));
}

.foro-section__head {
  display:           flex;
  align-items:       center;
  gap:               var(--space-3);
  margin-block-end:  var(--space-8);
  padding-block-end: var(--space-3);
  border-block-end:  3px solid var(--cat, var(--nexo-dark));
}

.foro-section__title {
  display:        inline-flex;
  align-items:    center;
  gap:            var(--space-3);
  font-family:    var(--font-heading);
  font-size:      var(--fs-3xl);
  font-weight:    var(--fw-bold);
  line-height:    var(--lh-tight);
  letter-spacing: -0.01em;
}

/* Marca de color de la categoría, junto al título. */
.foro-section__title::before {
  content:       "";
  width:         0.85rem;
  height:        0.85rem;
  flex-shrink:   0;
  background:    var(--cat, var(--nexo-dark));
  transform:     rotate(45deg);
}

.foro-section__count {
  font-size: var(--fs-sm);
  color:     color-mix(in srgb, var(--nexo-dark) 60%, transparent);
}

.foro-threads {
  display:        flex;
  flex-direction: column;
}

.foro-thread {
  display:               grid;
  grid-template-columns: auto 1fr auto;
  gap:                   var(--space-5);
  align-items:           start;
  padding-block:         var(--space-6);
  border-block-end:      1px solid rgba(21, 7, 31, 0.12);
  transition:            background var(--duration-fast) ease;
}

.foro-thread:hover {
  background: rgba(21, 7, 31, 0.03);
}

.foro-thread__avatar,
.foro-post__avatar {
  display:         inline-flex;
  align-items:     center;
  justify-content: center;
  flex-shrink:     0;
  width:           3rem;
  height:          3rem;
  border-radius:   50%;
  background:      var(--nexo-dark);
  color:           var(--nexo-cream);
  font-family:     var(--font-heading);
  font-size:       var(--fs-sm);
  font-weight:     var(--fw-bold);
  letter-spacing:  0.02em;
}

/* En la lista el avatar toma el color de la categoría (texto oscuro). */
.foro-section .foro-thread__avatar {
  background: var(--cat, var(--nexo-dark));
  color:      var(--nexo-dark);
}

.foro-thread__main { min-width: 0; }

.foro-thread__title {
  font-family: var(--font-heading);
  font-size:   var(--fs-xl);
  font-weight: var(--fw-bold);
  line-height: var(--lh-tight);
}

.foro-thread__title a { transition: color var(--duration-fast) ease; }
.foro-thread__title a:hover { color: var(--section-accent, var(--nexo-red)); }

.foro-thread__excerpt {
  margin-block-start: var(--space-2);
  max-width:          64ch;
  font-size:          var(--fs-base);
  line-height:        var(--lh-base);
  color:              color-mix(in srgb, var(--nexo-dark) 80%, transparent);

  display:            -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow:           hidden;
}

.foro-thread__meta {
  margin-block-start: var(--space-3);
  display:            flex;
  align-items:        center;
  gap:                var(--space-2);
  font-size:          var(--fs-sm);
  color:              color-mix(in srgb, var(--nexo-dark) 60%, transparent);
}

.foro-thread__author {
  font-weight: var(--fw-semibold);
  color:       var(--nexo-dark);
}

.foro-thread__stats {
  display:        flex;
  flex-direction: column;
  align-items:    flex-end;
  gap:            var(--space-1);
  text-align:     right;
  white-space:    nowrap;
}

.foro-thread__stat {
  font-size: var(--fs-sm);
  color:     color-mix(in srgb, var(--nexo-dark) 60%, transparent);
}

.foro-thread__stat b {
  font-family: var(--font-heading);
  font-weight: var(--fw-bold);
  color:       var(--nexo-dark);
}

/* ===========================================================================
   Interna de tema + crear tema (template-foro-tema.php / template-foro-crear.php)
   =========================================================================== */
.foro-tema { color: var(--nexo-dark); background: var(--nexo-bg); }

.foro-tema__header {
  position:      relative;
  overflow:      hidden;
  background:    var(--section-accent, var(--nexo-red));
  color:         var(--nexo-dark);
  padding-block: calc(var(--nav-height, 72px) + clamp(2.5rem, 6vh, 4rem)) clamp(3rem, 8vh, 5rem);
}

.foro-tema__header .container { max-width: 56rem; }

.foro-tema .breadcrumb {
  font-family:      var(--font-heading);
  font-size:        var(--fs-xs);
  font-weight:      var(--fw-semibold);
  color:            var(--nexo-dark);
  margin-block-end: var(--space-6);
}

.foro-tema .breadcrumb a { color: var(--nexo-dark); opacity: .65; transition: opacity .15s; }
.foro-tema .breadcrumb a:hover { opacity: 1; text-decoration: underline; text-underline-offset: 3px; }

.foro-tema .section-label {
  display:          inline-block;
  margin-block-end: var(--space-5);
  padding:          .35rem .8rem;
  background:       var(--nexo-dark);
  color:            var(--nexo-cream);
  font-family:      var(--font-heading);
  font-size:        var(--fs-xs);
  font-weight:      var(--fw-bold);
  letter-spacing:   .08em;
  text-transform:   uppercase;
}

.foro-tema .section-title {
  max-width:      26ch;
  margin:         0;
  color:          var(--nexo-dark);
  font-family:    var(--font-heading);
  font-size:      clamp(2rem, 4.6vw, 3.2rem);
  font-weight:    var(--fw-bold);
  line-height:    var(--lh-tight);
  letter-spacing: -0.015em;
}

.foro-tema__meta,
.foro-tema__lead {
  margin-block-start: var(--space-6);
  font-family:        var(--font-heading);
  color:              var(--nexo-dark);
}

.foro-tema__meta {
  display:     flex;
  flex-wrap:   wrap;
  align-items: center;
  gap:         var(--space-3);
  font-size:   var(--fs-sm);
  font-weight: var(--fw-medium);
}

.foro-tema__by { font-weight: var(--fw-bold); }
.foro-tema .dot { opacity: .45; }

.foro-tema__lead {
  max-width:   52ch;
  font-size:   var(--fs-md);
  font-weight: var(--fw-regular);
  line-height: var(--lh-snug);
}

.foro-tema__body { padding-block: clamp(2.5rem, 6vh, 4rem) clamp(3rem, 8vh, 5rem); }
.foro-tema__body .container { max-width: 48rem; }

/* ── Publicación (inicial + respuestas) ─────────────────────────────────── */
.foro-post {
  display:               grid;
  grid-template-columns: auto 1fr;
  gap:                   var(--space-4);
  align-items:           start;
  padding-block:         var(--space-6);
}

.foro-post + .foro-post { border-block-start: 1px solid rgba(21, 7, 31, 0.12); }

.foro-post--op {
  padding:           clamp(var(--space-5), 3vw, var(--space-8));
  background:        var(--nexo-white);
  box-shadow:        inset 0 0 0 1px rgba(21, 7, 31, 0.10);
  margin-block-end:  clamp(var(--space-8), 5vh, var(--space-12));
}

.foro-post__main { min-width: 0; }

.foro-post__head {
  display:          flex;
  flex-wrap:        wrap;
  align-items:      center;
  gap:              var(--space-2);
  margin-block-end: var(--space-3);
  font-family:      var(--font-heading);
  font-size:        var(--fs-sm);
  color:            color-mix(in srgb, var(--nexo-dark) 60%, transparent);
}

.foro-post__author { font-weight: var(--fw-bold); color: var(--nexo-dark); }

.foro-post__badge {
  padding:        .1rem .5rem;
  background:     var(--section-accent, var(--nexo-red));
  color:          var(--nexo-dark);
  font-size:      var(--fs-xs);
  font-weight:    var(--fw-bold);
  letter-spacing: .04em;
  text-transform: uppercase;
}

.foro-post__text { font-size: var(--fs-md); line-height: var(--lh-relaxed); color: var(--nexo-dark); }
.foro-post__text p { margin: 0; }
.foro-post__text p + p { margin-block-start: 1em; }

.foro-tema__replies-title {
  margin-block:     clamp(var(--space-4), 3vh, var(--space-6)) var(--space-2);
  font-family:      var(--font-heading);
  font-size:        var(--fs-xl);
  font-weight:      var(--fw-bold);
  color:            var(--nexo-dark);
}

.foro-replies { margin-block-end: clamp(var(--space-8), 5vh, var(--space-12)); }

/* ── Caja de respuesta ──────────────────────────────────────────────────── */
.foro-reply {
  display:            flex;
  flex-direction:     column;
  gap:                var(--space-3);
  padding-block-start: var(--space-8);
  border-block-start: 2px solid var(--nexo-dark);
}

.foro-reply__label,
.foro-field__label {
  display:        block;
  font-family:    var(--font-heading);
  font-size:      var(--fs-sm);
  font-weight:    var(--fw-bold);
  text-transform: uppercase;
  letter-spacing: .05em;
  color:          var(--nexo-dark);
}

.foro-reply__input,
.foro-field__input {
  width:          100%;
  padding:        1.05rem 1rem;
  font-family:    var(--font-heading);
  font-size:      var(--fs-base);
  color:          var(--nexo-dark);
  background:     var(--nexo-yellow);
  border:         0;
  border-radius:  0;
  outline:        2px solid transparent;
  outline-offset: -2px;
  transition:     outline-color .15s;
}

.foro-reply__input::placeholder,
.foro-field__input::placeholder { color: color-mix(in srgb, var(--nexo-dark) 50%, transparent); }

.foro-reply__input:focus,
.foro-field__input:focus { outline-color: var(--nexo-dark); }

.foro-reply__input,
.foro-field__textarea { resize: vertical; min-height: 7rem; line-height: var(--lh-normal); }

.foro-reply__actions,
.foro-form__actions {
  display:     flex;
  flex-wrap:   wrap;
  align-items: center;
  gap:         var(--space-4);
}

.foro-reply__note {
  font-size: var(--fs-xs);
  color:     color-mix(in srgb, var(--nexo-dark) 50%, transparent);
}

/* ── Formulario de crear tema ───────────────────────────────────────────── */
.foro-form {
  display:        flex;
  flex-direction: column;
  gap:            clamp(var(--space-5), 3vh, var(--space-6));
  max-width:      40rem;
}

.foro-field {
  display:        flex;
  flex-direction: column;
  gap:            var(--space-2);
}

.foro-field__select {
  appearance:          none;
  -webkit-appearance:  none;
  background-image:    linear-gradient(45deg, transparent 50%, var(--nexo-dark) 50%), linear-gradient(135deg, var(--nexo-dark) 50%, transparent 50%);
  background-position: calc(100% - 1.25rem) 1.15rem, calc(100% - 0.9rem) 1.15rem;
  background-size:     0.4rem 0.4rem, 0.4rem 0.4rem;
  background-repeat:   no-repeat;
  padding-inline-end:  var(--space-12);
}

.foro-form__cancel {
  font-family:           var(--font-heading);
  font-size:             var(--fs-sm);
  font-weight:           var(--fw-semibold);
  color:                 var(--nexo-dark);
  text-decoration:       underline;
  text-underline-offset: 3px;
  opacity:               .7;
  transition:            opacity var(--duration-fast) ease;
}

.foro-form__cancel:hover { opacity: 1; }

/* ===========================================================================
   Responsive
   =========================================================================== */
@media (max-width: 640px) {
  .foro-thread {
    grid-template-columns: auto 1fr;
    gap: var(--space-4);
  }

  .foro-thread__stats {
    grid-column: 2;
    flex-direction: row;
    align-items: center;
    gap: var(--space-4);
    margin-block-start: var(--space-2);
    text-align: left;
  }
}