/* ==========================================================================
   FORO — REDISEÑO (mismo lenguaje que index.html y comunidad.html)
   Capa sobre foro.css: re-mapea sus variables a la paleta editorial
   (negro cálido / papel crema en modo claro, naranja de marca como acento,
   Instrument Serif para títulos + Instrument Sans para texto) y reemplaza
   el aspecto "Reddit" por listas con líneas finas y tipografía protagonista.
   El color del colegio del usuario se conserva sólo como identidad (puntos, avatar).
   ========================================================================== */

/* ---------- Paleta: modo claro (papel) ---------- */
:root,
body.light-mode,
html.light-mode,
[data-theme="light"] {
  --fr-bg: #f3eee5;
  --fr-bg-2: #ebe4d8;
  --fr-bg-3: #e2dacb;
  --fr-ink: #171510;
  --fr-ink-2: #45403a;
  --fr-ink-3: #6f685e;
  --fr-line: rgba(23, 21, 16, 0.12);
  --fr-line-strong: rgba(23, 21, 16, 0.26);
  --fr-accent: #c4560a;
  --fr-accent-soft: rgba(196, 86, 10, 0.1);
  --fr-danger: #c2362c;
  --fr-header-bg: rgba(243, 238, 229, 0.88);
  --fr-overlay: rgba(23, 21, 16, 0.45);

  --foro-bg: var(--fr-bg);
  --foro-bg-secondary: var(--fr-bg-2);
  --foro-card: var(--fr-bg);
  --foro-card-elevated: var(--fr-bg-2);
  --foro-card-hover: var(--fr-bg-2);
  --foro-card-inner: var(--fr-bg-2);
  --foro-border: var(--fr-line);
  --foro-border-light: var(--fr-line);
  --foro-border-strong: var(--fr-line-strong);
  --foro-text: var(--fr-ink);
  --foro-text-secondary: var(--fr-ink-2);
  --foro-text-muted: var(--fr-ink-3);
  --foro-text-subtle: var(--fr-ink-3);
  --foro-pill-bg: var(--fr-bg-2);
  --foro-pill-hover: var(--fr-bg-3);
  --foro-cyan: var(--fr-accent);
  --reddit-orange: var(--fr-accent);
}

/* ---------- Paleta: modo oscuro (negro cálido, igual que la portada) ---------- */
body.page-foro.dark-mode,
html.dark-mode,
[data-theme="dark"] {
  --fr-bg: #0c0b0a;
  --fr-bg-2: #141311;
  --fr-bg-3: #1d1b18;
  --fr-ink: #f2ede4;
  --fr-ink-2: #bdb6aa;
  --fr-ink-3: #8a8379;
  --fr-line: rgba(242, 237, 228, 0.12);
  --fr-line-strong: rgba(242, 237, 228, 0.26);
  --fr-accent: #ff8a1f;
  --fr-accent-soft: rgba(255, 138, 31, 0.12);
  --fr-danger: #ff5a4e;
  --fr-header-bg: rgba(12, 11, 10, 0.86);
  --fr-overlay: rgba(0, 0, 0, 0.6);

  --foro-bg: var(--fr-bg);
  --foro-bg-secondary: var(--fr-bg-2);
  --foro-card: var(--fr-bg);
  --foro-card-elevated: var(--fr-bg-2);
  --foro-card-hover: var(--fr-bg-2);
  --foro-card-inner: var(--fr-bg-2);
  --foro-border: var(--fr-line);
  --foro-border-light: var(--fr-line);
  --foro-border-strong: var(--fr-line-strong);
  --foro-text: var(--fr-ink);
  --foro-text-secondary: var(--fr-ink-2);
  --foro-text-muted: var(--fr-ink-3);
  --foro-text-subtle: var(--fr-ink-3);
  --foro-pill-bg: var(--fr-bg-2);
  --foro-pill-hover: var(--fr-bg-3);
  --foro-cyan: var(--fr-accent);
  --reddit-orange: var(--fr-accent);
}

:root {
  --fr-serif: 'Instrument Serif', 'Times New Roman', serif;
  --fr-sans: 'Instrument Sans', system-ui, -apple-system, sans-serif;
  --fr-ease: cubic-bezier(0.2, 0.7, 0.2, 1);
  --foro-header-height: 64px;

  /* Variables de comunidad.css que usan los modales compartidos */
  --font-display: var(--fr-sans);
  --font-title: var(--fr-sans);
  --font-body: var(--fr-sans);
  --shadow-xs: none;
  --shadow-sm: none;
  --shadow-md: 0 20px 50px -24px rgba(0, 0, 0, 0.55);
  --shadow-lg: 0 30px 70px -24px rgba(0, 0, 0, 0.6);
  --shadow-xl: 0 30px 70px -24px rgba(0, 0, 0, 0.6);
}

html { overflow-x: visible; }
body.page-foro {
  background: var(--fr-bg) !important;
  color: var(--fr-ink);
  font-family: var(--fr-sans) !important;
  font-size: 16px;
  -webkit-font-smoothing: antialiased;
  overflow-x: clip;
}
body.page-foro::before,
body.page-foro::after { display: none !important; }
body.page-foro ::selection { background: var(--fr-accent); color: var(--fr-bg); }
body.page-foro :focus-visible { outline: 1.5px solid var(--fr-accent); outline-offset: 3px; }
body.page-foro * { scrollbar-color: var(--fr-line-strong) transparent; }

.fr-visually-hidden {
  position: absolute !important;
  width: 1px; height: 1px;
  overflow: hidden;
  clip: rect(0 0 0 0);
  white-space: nowrap;
}

/* ==========================================================================
   HEADER
   ========================================================================== */
.fr-header {
  position: sticky;
  top: var(--admin-bar-height, 0px);
  z-index: 900;
  background: var(--fr-header-bg);
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
  border-bottom: 1px solid var(--fr-line);
}
.fr-header-inner {
  max-width: 1400px;
  margin: 0 auto;
  height: var(--foro-header-height);
  padding-inline: clamp(1rem, 3vw, 2rem);
  display: flex;
  align-items: center;
  gap: 1.25rem;
}
.fr-brand { display: flex; align-items: center; gap: 0.75rem; flex-shrink: 0; }
.fr-wordmark { font-weight: 700; font-size: 1.08rem; letter-spacing: -0.02em; color: var(--fr-ink); text-decoration: none; }
.fr-wordmark span { color: var(--fr-accent); }
.fr-section-name {
  font-family: var(--fr-serif);
  font-style: italic;
  font-size: 1.35rem;
  line-height: 1;
  color: var(--fr-ink-2);
  text-decoration: none;
  padding-left: 0.75rem;
  border-left: 1px solid var(--fr-line-strong);
}

.fr-icon-btn {
  display: inline-grid;
  place-items: center;
  width: 38px;
  height: 38px;
  flex-shrink: 0;
  border-radius: 999px;
  border: 1px solid transparent;
  background: none;
  color: var(--fr-ink-2);
  cursor: pointer;
  transition: border-color 0.2s ease, color 0.2s ease;
}
.fr-icon-btn:hover { border-color: var(--fr-line-strong); color: var(--fr-ink); }
.fr-icon-btn svg,
.fr-icon-btn .svg-icon {
  width: 18px;
  height: 18px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.8;
  stroke-linecap: round;
}

.fr-search {
  flex: 1;
  max-width: 520px;
  display: flex;
  align-items: center;
  gap: 0.55rem;
  margin-inline: auto;
  border-bottom: 1px solid var(--fr-line-strong);
  padding: 0.3rem 0;
  color: var(--fr-ink-3);
  transition: border-color 0.2s ease, color 0.2s ease;
}
.fr-search:focus-within { border-color: var(--fr-ink); color: var(--fr-ink); }
.fr-search svg { width: 17px; height: 17px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; flex-shrink: 0; }
.fr-search input {
  flex: 1;
  min-width: 0;
  background: none;
  border: 0;
  outline: none;
  color: var(--fr-ink);
  font: 400 0.95rem var(--fr-sans);
}
.fr-search input::placeholder { color: var(--fr-ink-3); }
.fr-search input::-webkit-search-cancel-button { display: none; }
.fr-search-clear { background: none; border: 0; color: var(--fr-ink-3); cursor: pointer; font-size: 0.85rem; }

.fr-actions { display: flex; align-items: center; gap: 0.75rem; flex-shrink: 0; }
.fr-nav { display: flex; gap: 1.25rem; margin-right: 0.25rem; font-size: 0.9rem; }
.fr-nav a { color: var(--fr-ink-2); text-decoration: none; transition: color 0.2s ease; }
.fr-nav a:hover { color: var(--fr-ink); }

.fr-btn-create {
  min-height: 38px;
  padding: 0 1.1rem;
  border: 0;
  border-radius: 999px;
  background: var(--fr-ink);
  color: var(--fr-bg);
  font: 600 0.88rem var(--fr-sans);
  cursor: pointer;
  transition: background-color 0.2s ease;
}
.fr-btn-create:hover { background: var(--fr-accent); color: #fff; }

.fr-btn-login {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  min-height: 38px;
  padding: 0 1rem;
  border: 1px solid var(--fr-line-strong);
  border-radius: 999px;
  background: none;
  color: var(--fr-ink);
  font: 500 0.88rem var(--fr-sans);
  cursor: pointer;
  transition: border-color 0.2s ease;
}
.fr-btn-login:hover { border-color: var(--fr-ink); }

.fr-user-profile {
  align-items: center;
  gap: 0.55rem;
  padding: 0.2rem 0.3rem 0.2rem 0.2rem;
  border: 1px solid var(--fr-line);
  border-radius: 999px;
}
.fr-user-profile .user-avatar-img { width: 30px; height: 30px; border-radius: 50%; object-fit: cover; }
.fr-user-profile .user-profile-info { display: flex; flex-direction: column; line-height: 1.15; }
.fr-user-profile .user-profile-name { font-size: 0.82rem; font-weight: 600; color: var(--fr-ink); }
.fr-user-profile .user-profile-school-badge { display: inline-flex; align-items: center; gap: 0.3rem; font-size: 0.72rem; }
.fr-user-profile .user-profile-school-badge .user-school-name { color: var(--fr-ink-3) !important; font-weight: 500 !important; }
.fr-user-profile .btn-logout {
  width: 26px; height: 26px;
  border: 0;
  border-radius: 50%;
  background: none;
  color: var(--fr-ink-3);
  cursor: pointer;
}
.fr-user-profile .btn-logout:hover { color: var(--fr-ink); background: var(--fr-bg-2); }

.fr-mobile-search { display: none; }

/* ==========================================================================
   LAYOUT
   ========================================================================== */
.foro-main-layout { padding: 0 clamp(1rem, 3vw, 2rem) 5rem !important; }
.foro-layout-container { gap: clamp(1.5rem, 3vw, 3rem) !important; }

.left-sidebar-sticky,
.foro-desktop-sidebar {
  top: calc(var(--foro-header-height) + var(--admin-bar-height, 0px) + 1.5rem) !important;
}
.left-sidebar-sticky { padding-top: 2rem; }
.foro-desktop-sidebar { padding-top: 2rem; }

/* ---------- Encabezado del feed ---------- */
.fr-intro { padding: 2.5rem 0 1.5rem; }
.fr-kicker {
  font-size: 0.75rem;
  font-weight: 600;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--fr-ink-3);
}
.fr-title {
  margin-top: 0.75rem;
  font-family: var(--fr-serif);
  font-weight: 400;
  font-size: clamp(2.6rem, 5.5vw, 4.4rem);
  line-height: 0.95;
  letter-spacing: -0.03em;
  color: var(--fr-ink);
}
.fr-title em,
.fr-footer em { font-style: italic; color: var(--fr-accent); }

/* ==========================================================================
   SIDEBAR IZQUIERDO
   ========================================================================== */
.left-nav-section { border: 0 !important; padding: 0 0 1.5rem !important; background: none !important; }
.left-nav-heading,
.left-nav-heading-row .left-nav-heading {
  display: block;
  padding: 0 0 0.6rem !important;
  margin-bottom: 0.25rem;
  border-bottom: 1px solid var(--fr-line);
  font-size: 0.72rem !important;
  font-weight: 600 !important;
  letter-spacing: 0.14em !important;
  color: var(--fr-ink-3) !important;
}
.left-nav-heading-row { border-bottom: 1px solid var(--fr-line); margin-bottom: 0.25rem; }
.left-nav-heading-row .left-nav-heading { border: 0; margin: 0; }

.left-nav-item,
.channel-chip,
.sidebar-school-chip {
  display: flex !important;
  align-items: center;
  gap: 0.6rem;
  width: 100%;
  padding: 0.55rem 0 0.55rem 0.75rem !important;
  border: 0 !important;
  border-left: 2px solid transparent !important;
  border-radius: 0 !important;
  background: none !important;
  box-shadow: none !important;
  color: var(--fr-ink-2) !important;
  font: 500 0.92rem var(--fr-sans) !important;
  text-align: left;
  cursor: pointer;
  transition: color 0.2s ease, border-color 0.2s ease;
}
.left-nav-item:hover,
.channel-chip:hover,
.sidebar-school-chip:hover { color: var(--fr-ink) !important; }
.left-nav-item.active,
.channel-chip.active,
.sidebar-school-chip.active {
  color: var(--fr-ink) !important;
  border-left-color: var(--fr-accent) !important;
  font-weight: 600 !important;
}
.left-nav-item .nav-icon,
.channel-chip .channel-icon { opacity: 0.7; }
.left-nav-count {
  margin-left: auto;
  background: none !important;
  color: var(--fr-ink-3) !important;
  font-size: 0.78rem !important;
  font-variant-numeric: tabular-nums;
}
.left-nav-link-subtle { color: var(--fr-ink-3) !important; font-size: 0.88rem; text-decoration: none; }
.left-nav-link-subtle:hover { color: var(--fr-ink) !important; }

.sidebar-schools-search-wrap,
.sidebar-school-search-input {
  background: none !important;
  border: 0 !important;
  border-bottom: 1px solid var(--fr-line-strong) !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  color: var(--fr-ink) !important;
}
.btn-clear-school-filter { background: none !important; border: 0 !important; color: var(--fr-accent) !important; }

/* ==========================================================================
   FEED
   ========================================================================== */
/* Caja "crear publicación": una línea para escribir */
.reddit-create-post-card {
  background: none !important;
  border: 0 !important;
  border-block: 1px solid var(--fr-line) !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  padding: 0.9rem 0 !important;
  margin-bottom: 0.5rem !important;
}
.reddit-create-input-trigger {
  background: none !important;
  border: 0 !important;
  color: var(--fr-ink-3) !important;
  font: 400 1rem var(--fr-sans) !important;
  text-align: left;
}
.reddit-create-input-trigger:hover { color: var(--fr-ink) !important; }
.reddit-create-avatar { border-radius: 50%; }

.forum-feed-filter-bar,
.feed-filter-chip {
  background: none !important;
  border-color: var(--fr-line) !important;
  box-shadow: none !important;
  color: var(--fr-ink-2) !important;
}
.feed-filter-chip { border: 1px solid var(--fr-line-strong) !important; border-radius: 999px !important; }
.btn-feed-clear-all { background: none !important; border: 0 !important; color: var(--fr-accent) !important; }

/* ---------- Tarjeta de debate: fila editorial con línea inferior ---------- */
.threads-container { gap: 0 !important; }
.thread-card,
.thread-card.reddit-feed-card {
  background: none !important;
  border: 0 !important;
  border-bottom: 1px solid var(--fr-line) !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  padding: 1.5rem 0 !important;
  margin: 0 !important;
  cursor: pointer;
  transition: none;
}
.thread-card::before,
.thread-card::after { display: none !important; }
.thread-card:hover { background: none !important; }
/* Los fijados se distinguen por la etiqueta "Fijado", sin fondo degradado */
body.page-foro .thread-card.reddit-feed-card.is-pinned,
body.page-foro .thread-card.is-pinned {
  background: none !important;
  border-top: 0 !important;
  border-left: 0 !important;
  box-shadow: none !important;
}

.reddit-post-gutter { display: none !important; }
.reddit-post-main { padding: 0 !important; }

.thread-card-header { margin-bottom: 0.5rem !important; }
.thread-community-meta,
.reddit-post-community-badge {
  gap: 0.45rem;
  font-size: 0.78rem !important;
  color: var(--fr-ink-3) !important;
}
.community-name {
  color: var(--fr-ink-2) !important;
  font-weight: 600 !important;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  font-size: 0.72rem !important;
}
.thread-card-author-name,
.thread-time { color: var(--fr-ink-3) !important; font-size: 0.8rem !important; }
.meta-dot { color: var(--fr-line-strong) !important; }
.pinned-badge {
  background: none !important;
  border: 0 !important;
  padding: 0 !important;
  color: var(--fr-accent) !important;
  font-weight: 600 !important;
  font-size: 0.72rem !important;
  letter-spacing: 0.1em;
  text-transform: uppercase;
}

.thread-title {
  font-family: var(--fr-serif) !important;
  font-weight: 400 !important;
  font-size: clamp(1.55rem, 2.6vw, 2.1rem) !important;
  line-height: 1.08 !important;
  letter-spacing: -0.015em !important;
  color: var(--fr-ink) !important;
  margin: 0.2rem 0 0.55rem !important;
  transition: color 0.2s ease;
}
.thread-card:hover .thread-title { text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: 5px; }

.thread-flairs-row { margin-bottom: 0.55rem !important; }
.thread-school-badge,
.thread-channel-pill {
  display: inline-flex;
  align-items: center;
  gap: 0.4rem;
  background: none !important;
  border: 0 !important;
  padding: 0 !important;
  font-size: 0.82rem !important;
}
.thread-school-badge .school-badge-name { color: var(--fr-ink-2) !important; font-weight: 600 !important; }

.thread-excerpt {
  color: var(--fr-ink-2) !important;
  font-size: 0.97rem !important;
  line-height: 1.55 !important;
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

/* Barra de acciones: contadores sobrios */
.reddit-action-bar,
.thread-card-footer { gap: 0.5rem !important; margin-top: 0.9rem !important; }
.reddit-vote-capsule,
.reddit-action-pill,
.reddit-pill-btn {
  background: none !important;
  border: 1px solid var(--fr-line) !important;
  border-radius: 999px !important;
  box-shadow: none !important;
  color: var(--fr-ink-2) !important;
  font: 500 0.82rem var(--fr-sans) !important;
  transition: border-color 0.2s ease, color 0.2s ease;
}
.reddit-action-pill:hover,
.reddit-pill-btn:hover,
.reddit-vote-capsule:hover { border-color: var(--fr-line-strong) !important; color: var(--fr-ink) !important; background: none !important; }
.vote-count,
.vote-number,
.gutter-vote-count,
.reddit-comment-vote-count {
  color: var(--fr-ink) !important;
  font-weight: 600 !important;
  font-variant-numeric: tabular-nums;
  opacity: 1 !important;
}
.btn-vote-arrow,
.reddit-vote-arrow-btn,
.reddit-comment-vote-arrow { background: none !important; color: var(--fr-ink-3) !important; }
.btn-vote-arrow:hover,
.reddit-vote-arrow-btn:hover,
.reddit-comment-vote-arrow:hover { color: var(--fr-accent) !important; }
.reddit-vote-capsule.voted { border-color: var(--fr-accent) !important; }
.reddit-vote-capsule.voted .vote-count,
.reddit-vote-capsule.voted .btn-vote-up,
.voted .vote-number { color: var(--fr-accent) !important; }

.reddit-more-dots-btn,
.btn-report-thread-sm,
.reddit-more-options-btn { background: none !important; border: 0 !important; color: var(--fr-ink-3) !important; }
.reddit-more-dots-btn:hover,
.reddit-more-options-btn:hover { color: var(--fr-ink) !important; }

/* Moderación en tarjetas (sólo admin) */
.thread-admin-bar { gap: 0.35rem; }
.btn-mod-action {
  background: none !important;
  border: 1px solid var(--fr-line-strong) !important;
  border-radius: 999px !important;
  color: var(--fr-ink-2) !important;
}
.btn-mod-action:hover { color: var(--fr-accent) !important; border-color: var(--fr-accent) !important; }
.btn-mod-del:hover,
.btn-mod-sanction:hover { color: var(--fr-danger) !important; border-color: var(--fr-danger) !important; }
.btn-mod-pin.pinned-active { color: var(--fr-accent) !important; border-color: var(--fr-accent) !important; }

/* Cargar más */
#btn-load-more-threads,
.btn-load-more,
[class*="load-more"] {
  background: none !important;
  border: 1px solid var(--fr-line-strong) !important;
  border-radius: 999px !important;
  color: var(--fr-ink) !important;
  box-shadow: none !important;
}

/* ==========================================================================
   SIDEBAR DERECHO (widgets)
   ========================================================================== */
.sidebar-reddit-card {
  background: none !important;
  border: 0 !important;
  border-top: 1px solid var(--fr-line-strong) !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  padding: 1.1rem 0 1.5rem !important;
}
.reddit-card-hero-strip { display: none !important; }
.reddit-card-header {
  background: none !important;
  border: 0 !important;
  padding: 0 0 0.75rem !important;
  font-size: 0.72rem !important;
  font-weight: 600 !important;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--fr-ink-3) !important;
}
.reddit-card-icon { display: none !important; }
.reddit-card-content { padding: 0 !important; }
.reddit-card-desc { color: var(--fr-ink-2) !important; font-size: 0.92rem; }
.card-stat-num {
  font-family: var(--fr-serif) !important;
  font-weight: 400 !important;
  font-size: 2.2rem !important;
  line-height: 1 !important;
  color: var(--fr-ink) !important;
}
.card-stat-label { color: var(--fr-ink-3) !important; font-size: 0.75rem !important; }
.top-colegio-item {
  background: none !important;
  border: 0 !important;
  border-bottom: 1px solid var(--fr-line) !important;
  border-radius: 0 !important;
  padding: 0.6rem 0 !important;
}
.rules-list-numbered li { color: var(--fr-ink-2) !important; border-color: var(--fr-line) !important; }
.rules-list-numbered li::marker,
.rules-list-numbered li::before { color: var(--fr-accent) !important; background: none !important; }

/* ==========================================================================
   PÁGINA DE DEBATE
   ========================================================================== */
.thread-page-nav-bar { background: none !important; border: 0 !important; padding: 2rem 0 1rem !important; }
.btn-thread-nav-back {
  background: none !important;
  border: 0 !important;
  border-bottom: 1px solid var(--fr-line-strong) !important;
  border-radius: 0 !important;
  padding: 0 0 2px !important;
  color: var(--fr-ink-2) !important;
  font: 500 0.9rem var(--fr-sans) !important;
}
.btn-thread-nav-back:hover { color: var(--fr-ink) !important; border-color: var(--fr-ink) !important; }
.kbd-back-key { display: none !important; }

.reddit-post-page-card {
  background: none !important;
  border: 0 !important;
  border-bottom: 1px solid var(--fr-line-strong) !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  padding: 0 0 1.75rem !important;
}
.reddit-title-text {
  font-family: var(--fr-serif) !important;
  font-weight: 400 !important;
  font-size: clamp(2.2rem, 4.8vw, 3.6rem) !important;
  line-height: 1 !important;
  letter-spacing: -0.025em !important;
  color: var(--fr-ink) !important;
  text-wrap: balance;
}
.reddit-community-title { color: var(--fr-ink-2) !important; font-weight: 600 !important; letter-spacing: 0.06em; text-transform: uppercase; font-size: 0.75rem !important; }
.reddit-author-handle,
.reddit-time-ago { color: var(--fr-ink-3) !important; }
.reddit-flair-tag,
.reddit-school-tag {
  background: none !important;
  border: 1px solid var(--fr-line-strong) !important;
  border-radius: 999px !important;
  color: var(--fr-ink-2) !important;
}
.reddit-body-content {
  color: var(--fr-ink-2) !important;
  font-size: 1.08rem !important;
  line-height: 1.7 !important;
}

/* Compositor */
.reddit-join-bar,
.reddit-composer-box,
.reddit-expanded-composer {
  background: none !important;
  border: 1px solid var(--fr-line-strong) !important;
  border-radius: 14px !important;
  box-shadow: none !important;
}
.reddit-join-bar:hover { border-color: var(--fr-ink) !important; }
.reddit-join-placeholder { color: var(--fr-ink-3) !important; }
.reddit-composer-textarea,
.reddit-inline-textarea {
  background: none !important;
  color: var(--fr-ink) !important;
  font: 400 1rem var(--fr-sans) !important;
}
.reddit-btn-comment {
  background: var(--fr-ink) !important;
  color: var(--fr-bg) !important;
  border: 0 !important;
  border-radius: 999px !important;
  font-weight: 600 !important;
}
.reddit-btn-comment:hover { background: var(--fr-accent) !important; color: #fff !important; }
.reddit-btn-cancel { background: none !important; border: 0 !important; color: var(--fr-ink-2) !important; }
.btn-reply-format { background: none !important; border: 0 !important; color: var(--fr-ink-3) !important; }
.btn-reply-format:hover { color: var(--fr-ink) !important; }

/* Orden y búsqueda de comentarios */
.reddit-comments-controls-bar {
  background: none !important;
  border: 0 !important;
  border-bottom: 1px solid var(--fr-line) !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  padding: 1.25rem 0 0.75rem !important;
}
.reddit-sort-label { color: var(--fr-ink-3) !important; }
.reddit-sort-select-btn { background: none !important; border: 0 !important; color: var(--fr-ink) !important; font-weight: 600 !important; }
.reddit-sort-popup-menu {
  background: var(--fr-bg-2) !important;
  border: 1px solid var(--fr-line-strong) !important;
  border-radius: 12px !important;
  box-shadow: var(--shadow-lg) !important;
}
.reddit-sort-option { background: none !important; color: var(--fr-ink-2) !important; }
.reddit-sort-option.active,
.reddit-sort-option:hover { color: var(--fr-ink) !important; background: var(--fr-bg-3) !important; }
.reddit-comments-search-wrap { background: none !important; border: 0 !important; border-bottom: 1px solid var(--fr-line-strong) !important; border-radius: 0 !important; }
.reddit-comments-search-field { background: none !important; color: var(--fr-ink) !important; }

/* Árbol de comentarios */
.reddit-comment-block { background: none !important; }
.reddit-comment-author { color: var(--fr-ink) !important; font-weight: 600 !important; }
.reddit-comment-time { color: var(--fr-ink-3) !important; }
.reddit-comment-text { color: var(--fr-ink-2) !important; font-size: 1rem !important; line-height: 1.6 !important; }
.reddit-comment-school-chip,
.reddit-author-role-flair {
  background: none !important;
  border: 0 !important;
  padding: 0 !important;
  color: var(--fr-ink-3) !important;
  font-size: 0.75rem !important;
}
.reddit-op-badge {
  background: none !important;
  border: 0 !important;
  color: var(--fr-accent) !important;
  font-weight: 700 !important;
  letter-spacing: 0.08em;
}
.reddit-thread-line { background: var(--fr-line) !important; }
.reddit-thread-line-container:hover .reddit-thread-line { background: var(--fr-line-strong) !important; }
.reddit-comment-action-btn {
  background: none !important;
  border: 0 !important;
  color: var(--fr-ink-3) !important;
  font: 500 0.8rem var(--fr-sans) !important;
}
.reddit-comment-action-btn:hover { color: var(--fr-ink) !important; }
.btn-reply-mod-del:hover,
.btn-reply-mod-sanction:hover { color: var(--fr-danger) !important; }
.reddit-comment-collapse-btn { background: none !important; color: var(--fr-ink-3) !important; border-color: var(--fr-line-strong) !important; }

/* ==========================================================================
   MODALES (crear debate, login, onboarding, compartir, reportar, perfil)
   ========================================================================== */
.topic-modal-overlay,
.auth-modal-overlay,
.profile-modal-overlay,
.share-modal-overlay,
.report-modal-overlay {
  background: var(--fr-overlay) !important;
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
}
.topic-modal,
.auth-modal,
.topic-modal-overlay > div,
.auth-modal-overlay > div,
.share-modal-overlay > div,
.report-modal-overlay > div {
  background: var(--fr-bg) !important;
  border: 1px solid var(--fr-line-strong) !important;
  border-radius: 18px !important;
  box-shadow: var(--shadow-lg) !important;
  color: var(--fr-ink);
}
.topic-modal-overlay h2,
.topic-modal-overlay h3,
.auth-modal-overlay h2,
.auth-modal-overlay h3,
.share-modal-overlay h3,
.report-modal-overlay h3,
.profile-modal-overlay h2 {
  font-family: var(--fr-serif) !important;
  font-weight: 400 !important;
  font-size: clamp(1.8rem, 3.5vw, 2.3rem) !important;
  line-height: 1.05 !important;
  letter-spacing: -0.015em;
  color: var(--fr-ink) !important;
}
.topic-form-input,
.topic-form-textarea,
.topic-form-select,
.auth-modal-overlay input,
.auth-modal-overlay select,
.report-modal-overlay textarea,
.report-modal-overlay select {
  background: var(--fr-bg-2) !important;
  border: 1px solid var(--fr-line) !important;
  border-radius: 10px !important;
  box-shadow: none !important;
  color: var(--fr-ink) !important;
  font-family: var(--fr-sans) !important;
}
.topic-form-input:focus,
.topic-form-textarea:focus,
.topic-form-select:focus,
.auth-modal-overlay input:focus,
.report-modal-overlay textarea:focus { border-color: var(--fr-ink) !important; outline: none; }
.topic-form-label { color: var(--fr-ink-3) !important; font-size: 0.75rem !important; letter-spacing: 0.1em; text-transform: uppercase; font-weight: 600 !important; }

.btn-submit-topic,
.btn-submit-onboarding,
.btn-submit-report,
.topic-modal-overlay button[type="submit"],
.auth-modal-overlay button[type="submit"],
.report-modal-overlay button[type="submit"] {
  background: var(--fr-ink) !important;
  color: var(--fr-bg) !important;
  border: 0 !important;
  border-radius: 999px !important;
  box-shadow: none !important;
  font-weight: 600 !important;
}
.topic-modal-overlay button[type="submit"]:hover,
.auth-modal-overlay button[type="submit"]:hover,
.report-modal-overlay button[type="submit"]:hover { background: var(--fr-accent) !important; color: #fff !important; }

/* Perfil de usuario */
.reddit-modal-overlay > div,
.profile-modal-overlay > div {
  background: var(--fr-bg) !important;
  border: 1px solid var(--fr-line-strong) !important;
  border-radius: 18px !important;
  box-shadow: var(--shadow-lg) !important;
}
#profile-user-name {
  font-family: var(--fr-serif) !important;
  font-weight: 400 !important;
  font-size: clamp(2rem, 4vw, 2.8rem) !important;
  letter-spacing: -0.02em;
  color: var(--fr-ink) !important;
}

/* Menú flotante "tres puntitos" y toast */
.more-dropdown-menu,
[id*="more-dropdown"] {
  background: var(--fr-bg-2) !important;
  border: 1px solid var(--fr-line-strong) !important;
  border-radius: 12px !important;
  box-shadow: var(--shadow-lg) !important;
}
.toast-notification {
  background: var(--fr-ink) !important;
  color: var(--fr-bg) !important;
  border: 0 !important;
  border-radius: 999px !important;
  box-shadow: var(--shadow-lg) !important;
  font-family: var(--fr-sans) !important;
}

/* FAB móvil */
.btn-fab-topic {
  background: var(--fr-ink) !important;
  color: var(--fr-bg) !important;
  border: 0 !important;
  border-radius: 999px !important;
  box-shadow: 0 16px 40px -12px rgba(0, 0, 0, 0.6) !important;
  font-family: var(--fr-sans) !important;
  font-weight: 600 !important;
}

/* ==========================================================================
   FOOTER
   ========================================================================== */
.fr-footer {
  margin-top: 4rem;
  border-top: 1px solid var(--fr-line);
  overflow: hidden;
}
.fr-footer-inner { max-width: 1400px; margin: 0 auto; padding: 2.5rem clamp(1rem, 3vw, 2rem) 1.75rem; }
.fr-footer-top { display: flex; justify-content: space-between; flex-wrap: wrap; gap: 2rem 4rem; }
.fr-footer-note { max-width: 26rem; color: var(--fr-ink-3); font-size: 0.9rem; }
.fr-footer-links { display: grid; grid-template-columns: repeat(2, auto); gap: 0.6rem 3rem; font-size: 0.92rem; }
.fr-footer-links a,
.fr-footer-mod {
  color: var(--fr-ink-2);
  text-decoration: none;
  background: none;
  border: 0;
  padding: 0;
  font: inherit;
  text-align: left;
  cursor: pointer;
  transition: color 0.2s ease;
}
.fr-footer-links a:hover,
.fr-footer-mod:hover { color: var(--fr-ink); }
.fr-footer-mark {
  margin-top: clamp(3rem, 6vw, 4.5rem);
  font-family: var(--fr-serif);
  font-style: italic;
  font-size: clamp(4.5rem, 19vw, 16rem);
  line-height: 0.8;
  letter-spacing: -0.04em;
  color: var(--fr-bg-2);
  -webkit-text-stroke: 1px var(--fr-line-strong);
  white-space: nowrap;
  user-select: none;
}
.fr-footer-legal { margin-top: 1.25rem; font-size: 0.8rem; color: var(--fr-ink-3); }

/* ==========================================================================
   RESPONSIVE
   ========================================================================== */
@media (max-width: 1200px) {
  .fr-nav { display: none; }
}

/* Bug previo: entre 769 y 1024 px la grilla reservaba 290 px para una
   barra lateral oculta y quedaba una columna vacía a la derecha. */
@media (max-width: 1024px) {
  .foro-layout-container { grid-template-columns: minmax(0, 1fr) !important; }
  .foro-desktop-sidebar { display: none !important; }
  .foro-left-sidebar {
    background: var(--fr-bg) !important;
    border-right: 1px solid var(--fr-line) !important;
    padding: 1.5rem 1.25rem 2rem !important;
  }
  .left-sidebar-sticky { padding-top: 0; }
  .sidebar-drawer-backdrop.active { background: var(--fr-overlay) !important; }
}

@media (max-width: 760px) {
  .fr-header { background: var(--fr-bg); backdrop-filter: none; -webkit-backdrop-filter: none; }
  .fr-header-inner { gap: 0.6rem; }
  .fr-header-inner > .fr-search { display: none; }
  .fr-section-name { display: none; }
  .fr-btn-create { display: none; }
  .fr-user-profile .user-profile-info { display: none; }
  .fr-btn-login span { display: none; }
  .fr-btn-login { width: 38px; padding: 0; justify-content: center; }
  .fr-actions { margin-left: auto; gap: 0.4rem; }
  .fr-mobile-search {
    display: block;
    padding: 0 1rem 0.6rem;
  }
  .fr-mobile-search .fr-search { max-width: none; }

  .foro-main-layout { padding-inline: 1rem !important; }
  .fr-intro { padding-top: 1.75rem; }
  .thread-card { padding: 1.25rem 0 !important; }
  .fr-footer-links { grid-template-columns: 1fr 1fr; gap: 0.6rem 1.5rem; }
}