/* wumiku.lubalink.com/foro — foros de la comunidad (sobre wumiku.css) */
.forum-hero { position: relative; isolation: isolate; overflow: hidden; padding: clamp(48px, 7vw, 88px) 0 clamp(32px, 4vw, 48px); border-bottom: 1px solid var(--wk-line); }
.forum-hero__bg { position: absolute; inset: 0; z-index: -1; }
.forum-hero__bg img { width: 100%; height: 100%; object-fit: cover; object-position: 50% 30%; opacity: .35; }
.forum-hero__bg::after { content: ""; position: absolute; inset: 0; background: linear-gradient(90deg, var(--wk-night) 10%, rgba(7, 19, 24, .4)), linear-gradient(0deg, var(--wk-night), transparent 60%); }
.forum-hero h1 { font-family: var(--wk-font-display); font-weight: 600; font-size: clamp(34px, 4.6vw, 54px); margin: 14px 0 10px; }
.forum-who { color: var(--wk-muted); }
.forum-who a, .forum-who strong { color: var(--wk-teal-soft); }
.forum-body { padding-block: 32px 80px; }

.forum-crumbs { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; font-size: 14px; color: var(--wk-muted); margin-bottom: 18px; }
.forum-crumbs a { color: var(--wk-teal-soft); }
.forum-crumbs [aria-current] { color: var(--wk-ink); overflow-wrap: anywhere; }
.forum-head { display: flex; justify-content: space-between; align-items: flex-end; gap: 16px 24px; flex-wrap: wrap; margin-bottom: 24px; }
.forum-head > div:first-child { min-width: 0; flex: 1 1 320px; }
.forum-head h1 { font-family: var(--wk-font-display); font-weight: 600; font-size: clamp(28px, 3.6vw, 42px); overflow-wrap: anywhere; }
.forum-head p { color: var(--wk-muted); margin-top: 6px; display: flex; gap: 8px; align-items: center; flex-wrap: wrap; }
.forum-mod { display: flex; gap: 8px; }

/* Listas de categorías y de hilos */
.forum-cats, .forum-threads { display: grid; border-top: 1px solid var(--wk-line); }
.forum-cats[aria-busy="true"], .forum-threads[aria-busy="true"], .forum-posts[aria-busy="true"] { min-height: 200px; background: linear-gradient(90deg, transparent, rgba(154, 245, 242, .04), transparent) 0 0 / 200% 100%; animation: forum-load 1.4s linear infinite; }
@keyframes forum-load { to { background-position: -200% 0; } }
.forum-cat, .forum-thread { display: grid; grid-template-columns: minmax(0, 1fr) 90px 90px minmax(0, 240px); gap: 16px; align-items: center; padding: 20px 16px; border-bottom: 1px solid var(--wk-line); transition: background .2s; }
.forum-thread { grid-template-columns: minmax(0, 1fr) 110px minmax(0, 180px); }
.forum-cat:hover, .forum-thread:hover { background: rgba(67, 229, 224, .04); }
.forum-cat h2, .forum-thread h2 { font-family: var(--wk-font-display); font-size: 19px; font-weight: 600; display: flex; gap: 8px; align-items: center; flex-wrap: wrap; }
.forum-cat h2 a:hover, .forum-thread h2 a:hover { color: var(--wk-teal-soft); }
.forum-cat p { color: var(--wk-muted); font-size: 15px; margin-top: 2px; }
.forum-cat--official h2::before { content: ""; width: 8px; height: 8px; border-radius: 50%; background: var(--wk-gold); box-shadow: 0 0 10px var(--wk-gold); }
.forum-thread small, .forum-cat small { color: var(--wk-muted); font-size: 13px; }
.forum-thread.is-pinned { background: rgba(255, 204, 77, .04); }
.forum-cat__count { display: grid; justify-items: center; text-align: center; }
.forum-cat__count strong { font-family: var(--wk-font-display); font-size: 20px; font-variant-numeric: tabular-nums; }
.forum-cat__last { display: grid; gap: 2px; min-width: 0; font-size: 14px; }
.forum-cat__last a { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: var(--wk-ink); }
.forum-cat__last a:hover { color: var(--wk-teal-soft); }
.forum-flag { display: inline-block; font-family: var(--wk-font); font-size: 11px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; padding: 2px 8px; border-radius: 999px; color: #2A1E00; background: var(--wk-gold); }
.forum-flag--locked { color: var(--wk-ink); background: rgba(255, 255, 255, .12); }
.forum-badge { display: inline-block; font-size: 11px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; padding: 1px 7px; border-radius: 999px; color: #04201F; background: var(--wk-teal); vertical-align: 1px; }
.forum-empty, .forum-login { padding: 28px 16px; color: var(--wk-muted); display: flex; gap: 14px; align-items: center; flex-wrap: wrap; }
@media (max-width: 760px) {
  .forum-cat, .forum-thread { grid-template-columns: minmax(0, 1fr) auto; }
  .forum-cat .forum-cat__count:nth-of-type(3), .forum-cat__last { grid-column: 1 / -1; }
  .forum-cat .forum-cat__count:nth-of-type(3) { display: none; }
  .forum-thread .forum-cat__last { display: none; }
}

/* Páginas */
.forum-pages { display: flex; gap: 6px; flex-wrap: wrap; margin: 18px 0; }
.forum-pages:empty { display: none; }
.forum-pages a, .forum-pages span { min-width: 38px; height: 38px; padding: 0 10px; display: grid; place-items: center; border-radius: 10px; font-weight: 600; font-size: 14px; box-shadow: inset 0 0 0 1px var(--wk-line); }
.forum-pages a:hover { box-shadow: inset 0 0 0 1px var(--wk-teal); }
.forum-pages [aria-current] { background: var(--wk-teal); color: #04201F; box-shadow: none; }
.forum-pages .gap { box-shadow: none; }

/* Mensajes */
.forum-posts { display: grid; gap: 14px; }
.forum-post { border-radius: 16px; background: var(--wk-deep); box-shadow: inset 0 0 0 1px var(--wk-line); overflow: hidden; scroll-margin-top: 130px; }
.forum-post--staff { box-shadow: inset 3px 0 0 var(--wk-teal), inset 0 0 0 1px var(--wk-line); }
.forum-post:target { box-shadow: inset 0 0 0 2px var(--wk-teal); }
.forum-post__who { display: flex; gap: 12px; align-items: center; padding: 14px 18px; border-bottom: 1px solid var(--wk-line); }
.forum-post__who > div { display: grid; min-width: 0; flex: 1; }
.forum-post__who strong { font-family: var(--wk-font-display); font-weight: 600; overflow-wrap: anywhere; }
.forum-post__who small { color: var(--wk-muted); font-size: 13px; }
.forum-post__n { color: var(--wk-muted); font-size: 13px; }
.forum-avatar { flex: none; width: 38px; height: 38px; border-radius: 50%; display: grid; place-items: center; font-family: var(--wk-font-display); font-weight: 600; color: #04201F; background: linear-gradient(135deg, var(--wk-teal-soft), var(--wk-teal)); }
.forum-post__body { padding: 16px 18px; display: grid; gap: 12px; color: #DCE7EA; overflow-wrap: anywhere; min-width: 0; }
.forum-post__body a { color: var(--wk-teal-soft); text-decoration: underline; }
.forum-post__body blockquote { margin: 0; padding: 8px 14px; border-left: 3px solid var(--wk-teal); background: rgba(67, 229, 224, .06); border-radius: 0 8px 8px 0; color: var(--wk-muted); }
.forum-deleted { color: var(--wk-muted); font-style: italic; }
.forum-post__tools { display: flex; gap: 6px; padding: 0 12px 12px; }
.forum-post__tools button { font-size: 13px; color: var(--wk-muted); padding: 6px 10px; border-radius: 8px; }
.forum-post__tools button:hover { color: var(--wk-ink); background: rgba(255, 255, 255, .06); }
.forum-post__tools button[data-sure="1"] { color: #FF9DA6; }

/* Escribir */
.forum-reply { margin-top: 24px; }
.forum-form { display: grid; gap: 8px; padding: 20px; border-radius: 16px; background: var(--wk-deep); box-shadow: inset 0 0 0 1px var(--wk-line); }
.forum-post__body .forum-form { padding: 0; background: none; box-shadow: none; }
.forum-form label { font-weight: 700; font-size: 14px; }
.forum-form input, .forum-form textarea { font: inherit; color: var(--wk-ink); background: var(--wk-night); border: 0; border-radius: 10px; padding: 12px 14px; box-shadow: inset 0 0 0 1px var(--wk-line); min-width: 0; width: 100%; }
.forum-form textarea { resize: vertical; line-height: 1.55; }
.forum-form input:focus-visible, .forum-form textarea:focus-visible { outline: 2px solid var(--wk-teal); outline-offset: 0; }
.forum-hint { font-size: 13px; color: var(--wk-muted); }
.forum-error { color: #FF9DA6; font-size: 14px; }
.forum-form__actions { display: flex; gap: 10px; flex-wrap: wrap; }
.forum-form .lb-btn:disabled { opacity: .6; cursor: wait; }
