/* ─────────────────────────────────────────────────────────────────────
 * public/shared/forum.css
 *
 * Direction D ("Panosh Place") skin for the forums.voltronvault.com Discourse
 * CONTENT area: topic lists, sidebar, welcome banner, posts, buttons. Loaded
 * via the voltron theme head_tag AFTER the theme CSS so it wins, the same
 * mechanism nav.css uses for the shared nav.
 *
 * Edit here, push, merge -> live at voltronvault.com/shared/forum.css; bump
 * the ?v= token in the VOLTRON theme head_tag to flush the immutable CDN
 * cache, and in master theme 2's `?v=login1` if the login page must follow.
 *
 * Rewritten 2026-09-23. What it replaced: a gold-on-navy skin inherited from
 * the heman fork, still carrying "heman" in its own comments, and @font-face
 * blocks pointing at Univers and ITC Serif Gothic .ttf files that this site
 * deleted in the licensing sweep - so the forum was rendering in fallback
 * Inter with a palette from a different property.
 *
 * THE FONTS HERE ARE THE SITE'S THREE, SELF-HOSTED, ALL SIL OFL. Never add a
 * Monotype face to this file: /shared/* is outside src/ and every tokenisation
 * sweep and `grep Univers src/` misses it, which is how the dead references
 * survived here for a month after the rest of the site was cleaned.
 * ───────────────────────────────────────────────────────────────────── */

/* Self-hosted faces, absolute voltronvault.com URLs; /fonts ships ACAO: * */
@font-face{font-family:'Archivo Black';src:url('https://voltronvault.com/fonts/ArchivoBlack-Regular.woff2') format('woff2');font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:'Archivo';src:url('https://voltronvault.com/fonts/Archivo-Variable.woff2') format('woff2');font-weight:100 900;font-style:normal;font-display:swap}
@font-face{font-family:'Hanken Grotesk';src:url('https://voltronvault.com/fonts/HankenGrotesk-Variable.woff2') format('woff2');font-weight:100 900;font-style:normal;font-display:swap}

/* ── Theme accent + ink vars -> direction D. Recolours everything the theme
 *    paints via var(--tc-*): links, headers, welcome banner, buttons.
 *    `:root:root` and not `:root`: head_tag loads BEFORE the theme's compiled
 *    CSS, so a plain :root override loses the specificity tie. ── */
:root:root{
  --tc-floor:      #1E1B4E;   /* the field, the box interior */
  --tc-deep:       #14113A;
  --tc-ink:        #14113A;
  --tc-ink-2:      #14113A;
  --tc-ink-3:      #262159;
  --tc-ink-4:      #2E2968;
  --tc-ink-5:      #4A44A0;

  --tc-bone:       #FFFFFF;
  --tc-fg-2:       #CFCAEE;
  --tc-fg-3:       #B4AEDC;
  --tc-fg-4:       #8A83BC;

  /* Frame cyan is the accent. Token name kept as --tc-gold so a hub-wide
     sweep still lands on this site unchanged. */
  --tc-gold:       #4FC7E8;
  --tc-gold-hi:    #7FD9EF;
  --tc-gold-lo:    #2E8FAC;
  --tc-line-gold:  rgba(79,199,232,0.40);  /* 0.40, matching the apex header rule */
  --tc-line-gold-hi: rgba(79,199,232,0.58);

  --tc-amber:      #F5C518;
  --tc-red:        #FF7A70;
  --tc-red-hi:     #FF9A92;
  --tc-steel:      #B4AEDC;
  --tc-card-bg:    #262159;

  --vv-frame:      #4FC7E8;
  --vv-keyline:    #FFFFFF;
  --vv-panel:      #F7F4EC;
  --vv-panel-ink:  #171433;
  --vv-terra:      #CE5F2B;

  --tc-display:  'Archivo Black','Arial Black',system-ui,sans-serif;
  --tc-wordmark: 'Archivo Black','Arial Black',system-ui,sans-serif;
  --tc-ui:       'Archivo',system-ui,-apple-system,sans-serif;
  --tc-body:     'Hanken Grotesk',system-ui,-apple-system,sans-serif;
  --tc-mono:     'Archivo',system-ui,sans-serif;
}

/* ── Discourse's own colour-scheme vars. Overriding these recolours most
 *    native elements without touching the admin colour palette. ── */
:root:root{
  --secondary:            #1E1B4E;   /* page / panel background */
  --secondary-rgb:        30,27,78;
  --secondary-very-high:  #4A44A0;
  --secondary-high:       #3A3480;
  --secondary-medium:     #2E2968;
  --secondary-low:        #262159;
  --secondary-very-low:   #221D52;

  --primary:              #FFFFFF;   /* body text */
  --primary-rgb:          255,255,255;
  --primary-very-low:     #241F57;
  --primary-low:          #2E2968;
  --primary-low-mid:      #6A63AE;
  --primary-medium:       #8A83BC;
  --primary-high:         #CFCAEE;

  --tertiary:             #4FC7E8;   /* links + active accents */
  --tertiary-rgb:         79,199,232;
  --tertiary-low:         #243A72;
  --tertiary-medium:      #3E9FBC;
  --tertiary-high:        #7FD9EF;
  --tertiary-hover:       #7FD9EF;

  --quaternary:           #F5C518;   /* secondary links, the CTA yellow */
  --quaternary-rgb:       245,197,24;
  --highlight:            #F5C518;
  --highlight-low:        rgba(245,197,24,0.12);
  --highlight-medium:     rgba(245,197,24,0.25);
  --highlight-high:       #FFD75A;

  --header_background:    #14113A;
  --header_primary:       #FFFFFF;
  --love:                 #E03127;
  --danger:               #E03127;
  --success:              #2F9E4F;
}

/* ── Structural chrome. Cyan is the accent and the rule; the lion colours
 *    are categorical and never decoration. ── */
.sidebar-section-header-text{
  color: var(--tc-fg-3) !important;
  font-family: var(--tc-ui) !important;
  font-weight: 700; letter-spacing: .14em; text-transform: uppercase;
}
.sidebar-section-link.active,
.sidebar-section-link:hover{ color: var(--tc-gold); }

/* The box is printed, not lit: square corners everywhere. */
.btn, .topic-list-item, .category-list-item, .welcome-banner,
.sidebar-section-link, input, textarea, select{ border-radius: 0 !important; }

.welcome-banner{
  background: var(--tc-deep);
  border: 4px solid var(--vv-keyline);
  border-left: 9px solid var(--vv-terra);
}
.welcome-banner__title{
  font-family: var(--tc-wordmark) !important;
  text-transform: uppercase; letter-spacing: -.02em;
  color: var(--tc-bone) !important;
}

.nav-pills > li > a.active{ color: var(--tc-gold); }

.topic-list, .category-list, .latest-topic-list,
.topic-list-item, .category-list-item{ background: transparent; }

/* Primary button: D's yellow fill with dark ink. Flat, no gradient. */
.btn-primary{
  background: var(--tc-amber) !important;
  border: 0 !important;
  color: #171433 !important;
  font-family: var(--tc-display) !important;
  text-transform: uppercase; letter-spacing: .06em;
}
.btn-primary:hover{ background: #FFD75A !important; }

/* Secondary: the 2px cyan outline. */
.btn-default{
  background: transparent !important;
  border: 2px solid var(--tc-gold) !important;
  color: var(--tc-bone) !important;
}

/* Every image inside the forum takes the white keyline, as on the site. */
.cooked img:not(.emoji):not(.avatar){ border: 4px solid var(--vv-keyline); }

body, .cooked, .topic-body{ font-family: var(--tc-body); }
h1,h2,h3,.title,.topic-title{
  font-family: var(--tc-display);
  text-transform: uppercase; letter-spacing: -.02em;
}