/*
 * trk — "secure channel" dark theme  (v2, full rebuild)
 * Calm, high-contrast dark UI for an anonymity-network forum.
 * Self-hosted fonts only — NO third-party requests (anonymity requirement).
 *
 * Structure: inherits prosilver's base CSS via @import below (layout, grid,
 * responsive). This file only re-skins color + type + a single signature.
 */

/* ─── prosilver structural base (layout only; colours.css is NOT loaded for
       this style, so we own every color) ─── */
@import url("../../prosilver/theme/stylesheet.css");

/* ─── self-hosted fonts (no Google Fonts) ─── */
@font-face{font-family:"Archivo Black";font-style:normal;font-weight:400;font-display:swap;
  src:url("./fonts/archivo-black.woff2") format("woff2");}
@font-face{font-family:"JetBrains Mono";font-style:normal;font-weight:400;font-display:swap;
  src:url("./fonts/jetbrains-mono.woff2") format("woff2");}
@font-face{font-family:"JetBrains Mono";font-style:normal;font-weight:700;font-display:swap;
  src:url("./fonts/jetbrains-mono-bold.woff2") format("woff2");}

:root{
  --bg:#0c0e13; --surface:#13161e; --surface-2:#1a1e28; --surface-3:#222734;
  --border:#252b37; --border-2:#343c4b;
  --text:#e8edf4; --text-dim:#9aa6b6; --text-faint:#6a7585;
  --accent:#f0a330; --accent-bright:#ffbb4d; --accent-soft:rgba(240,163,48,.12);
  --ok:#3fb950; --danger:#f0533f;
  --mono:"JetBrains Mono",ui-monospace,"Cascadia Code",Consolas,monospace;
  --display:"Archivo Black","Arial Black",sans-serif;
  --body:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,system-ui,"Helvetica Neue",Arial,sans-serif;
}

/* ════════ substrate ════════ */
html,body{background:var(--bg)!important;color:var(--text);overflow-x:hidden;}
body{font-family:var(--body);background-image:none!important;font-size:15px;line-height:1.5;}
#wrap{width:85%;max-width:85%;margin:22px auto 56px;padding:0 18px;background:transparent!important;
  border:0!important;box-shadow:none!important;}
a,a:link{color:var(--accent);text-decoration:none;transition:color .12s ease;}
a:visited{color:var(--accent);}
a:hover{color:var(--accent-bright);text-decoration:none;}
hr{border-color:var(--border)!important;}

/* ════════ header ════════ */
#page-header{margin-bottom:18px;}
#page-header .headerbar,.headerbar{background:linear-gradient(180deg,var(--surface-2),var(--surface))!important;
  color:var(--text)!important;border:1px solid var(--border)!important;border-radius:10px!important;
  box-shadow:0 1px 0 rgba(255,255,255,.02) inset;padding:22px 24px!important;}
#site-description h1{font-family:var(--display)!important;color:var(--text)!important;
  text-transform:lowercase;letter-spacing:-.02em;font-size:30px;margin:0;}
#site-description .site_logo{background-image:url("./images/site_logo.svg")!important;
  background-size:contain;background-repeat:no-repeat;width:128px;height:52px;}
#site-description p.site-description{font-family:var(--mono)!important;color:var(--text-dim)!important;
  text-transform:uppercase;letter-spacing:.18em;font-size:11px;margin-top:6px;}
/* signature: secure-channel status dot in the header */
#site-description p.site-description::before{content:"●";color:var(--ok);font-size:9px;
  margin-right:8px;vertical-align:middle;animation:trk-pulse 2.4s ease-in-out infinite;}
@keyframes trk-pulse{0%,100%{opacity:1}50%{opacity:.35}}
@media(prefers-reduced-motion:reduce){#site-description p.site-description::before{animation:none}}
.search-header .inputbox,.search-header input{background:var(--surface-3)!important;}

/* ════════ navigation ════════ */
.navbar,#nav-main{background:var(--surface)!important;border:1px solid var(--border)!important;
  border-radius:10px!important;}
.navbar{padding:2px 10px!important;}
#nav-main a,.navbar a{font-family:var(--mono)!important;color:var(--text-dim)!important;
  text-transform:uppercase;letter-spacing:.05em;font-size:11.5px;border-radius:6px;}
#nav-main a:hover,.navbar a:hover{color:var(--text)!important;background:var(--surface-3)!important;}
#nav-main li.active-subsection>a{color:var(--accent)!important;background:var(--accent-soft)!important;}

/* ════════ panels / forum + topic lists ════════ */
.forabg,.forumbg{background:var(--surface)!important;border:1px solid var(--border)!important;
  border-radius:10px!important;box-shadow:none!important;padding:0!important;margin-bottom:16px;overflow:hidden;}
.forabg .inner,.forumbg .inner{background:transparent!important;}
/* section header rows */
li.header dl,li.header,.forabg li.header dt,.forumbg li.header dt,
ul.topiclist li.header dt,ul.topiclist li.header dd{background:var(--surface-2)!important;
  color:var(--text-dim)!important;font-family:var(--mono)!important;text-transform:uppercase;
  letter-spacing:.14em;font-size:11px;border:0!important;}
ul.topiclist li.header{border-bottom:1px solid var(--border)!important;}
li.header dt .list-inner{padding-top:11px!important;padding-bottom:11px!important;}
/* signature: category header marker */
li.header dt a::before,li.header dt .list-inner>a::before{content:"// ";color:var(--accent);font-weight:700;}

/* rows */
ul.topiclist li.row{background:var(--surface)!important;border-bottom:1px solid var(--border)!important;
  transition:background .12s ease;}
ul.topiclist li.row:last-child{border-bottom:0!important;}
ul.topiclist li.row dl{background:transparent!important;}
ul.topiclist li.row:hover{background:var(--surface-2)!important;}
/* signature: amber signal bar on the left edge, lit on hover/unread */
ul.topiclist li.row .list-inner{border-left:2px solid transparent!important;
  margin-left:0;padding-left:14px!important;transition:border-color .12s ease;}
ul.topiclist li.row:hover .list-inner{border-left-color:var(--accent)!important;}
.row-item.forum_unread .list-inner,li.row.forum_unread .list-inner{border-left-color:var(--accent)!important;}

a.forumtitle,a.topictitle{font-family:var(--mono)!important;color:var(--text)!important;
  font-weight:700;font-size:15px;letter-spacing:.005em;}
a.forumtitle:hover,a.topictitle:hover{color:var(--accent)!important;}
.forabg .row-item dt .list-inner>.forumtitle{display:inline-block;}
.topic-poster,.responsive-hide,.row .responsive-hide,.row time,.row .username,
ul.topiclist dd.lastpost>span,ul.topiclist dd.posts,ul.topiclist dd.topics{
  color:var(--text-faint)!important;font-family:var(--mono)!important;font-size:11px;}
ul.topiclist dd{border-left:1px solid var(--border)!important;}
.row-item dt .list-inner{color:var(--text-dim);}

/* ════════ post / topic view ════════ */
h2.topic-title,h2,h3{font-family:var(--mono)!important;color:var(--text);font-weight:700;letter-spacing:.005em;}
h2.topic-title a{color:var(--text)!important;}
.post{background:var(--surface)!important;border:1px solid var(--border)!important;
  border-radius:10px!important;box-shadow:none!important;margin-bottom:14px;}
.post .postbody{color:var(--text);}
.postprofile{background:var(--surface-2)!important;border:0!important;border-right:1px solid var(--border)!important;
  border-radius:0!important;color:var(--text-dim)!important;}
.postprofile .username,.postprofile .username-coloured{font-family:var(--mono)!important;font-weight:700;}
.postprofile dd,.post .author{color:var(--text-faint)!important;font-family:var(--mono)!important;font-size:11px;}
.post .author{text-transform:none;letter-spacing:0;}
/* readable long-form body */
.postbody .content{font-family:var(--body)!important;font-size:16px!important;line-height:1.7!important;
  color:var(--text);letter-spacing:normal;}
.postbody .content p{margin:0 0 1em!important;}
.postbody .content h2,.postbody .content h3{font-family:var(--mono)!important;color:var(--text);}
.postbody .content a{text-decoration:underline;text-underline-offset:2px;}
.postbody .content img{max-width:100%;border:1px solid var(--border);border-radius:6px;}
blockquote{background:var(--surface-2)!important;border:0!important;border-left:3px solid var(--accent)!important;
  border-radius:0 6px 6px 0!important;color:var(--text-dim)!important;}
code,.codebox{background:#0a0c11!important;color:#d6deea!important;border:1px solid var(--border)!important;
  border-radius:6px!important;font-family:var(--mono)!important;}
.codebox p{background:var(--surface-2)!important;color:var(--text-dim)!important;border-bottom:1px solid var(--border)!important;
  font-family:var(--mono)!important;text-transform:uppercase;letter-spacing:.1em;font-size:10px;}

/* ════════ forms / buttons ════════ */
input,textarea,select,.inputbox{background:var(--surface-3)!important;color:var(--text)!important;
  border:1px solid var(--border-2)!important;border-radius:7px!important;font-family:var(--body)!important;}
input:focus,textarea:focus,.inputbox:focus{border-color:var(--accent)!important;
  box-shadow:0 0 0 3px var(--accent-soft)!important;background:var(--surface-3)!important;outline:0;}
::placeholder{color:var(--text-faint)!important;}
.button,a.button,input.button1,input.button2,button.button{background:var(--surface-3)!important;
  color:var(--text)!important;border:1px solid var(--border-2)!important;border-radius:7px!important;
  font-family:var(--mono)!important;text-transform:uppercase;letter-spacing:.04em;font-size:12px;
  background-image:none!important;text-shadow:none!important;transition:all .12s ease;}
.button:hover,a.button:hover,input.button1:hover,input.button2:hover{
  border-color:var(--accent)!important;color:var(--accent)!important;background:var(--surface-2)!important;}
input.button1,.button.button-primary{background:var(--accent)!important;color:#1a1205!important;
  border-color:var(--accent)!important;font-weight:700;}
input.button1:hover,.button.button-primary:hover{background:var(--accent-bright)!important;color:#1a1205!important;}

/* ════════ pagination / dropdowns / misc chrome ════════ */
.pagination li a,.pagination li span{background:var(--surface)!important;color:var(--text-dim)!important;
  border:1px solid var(--border)!important;border-radius:6px!important;font-family:var(--mono)!important;}
.pagination li.active span{background:var(--accent)!important;color:#1a1205!important;border-color:var(--accent)!important;}
.dropdown-contents,.dropdown{background:var(--surface-2)!important;border:1px solid var(--border-2)!important;
  border-radius:8px!important;box-shadow:0 8px 24px rgba(0,0,0,.4)!important;}
.dropdown-contents li:hover,.dropdown-contents a:hover{background:var(--surface-3)!important;}
.action-bar{background:transparent!important;}
.notification_text,.notifications a:hover{color:var(--text)!important;}

/* alerts */
.rules{background:var(--surface-2)!important;border:1px solid var(--border)!important;border-radius:8px!important;color:var(--text-dim)!important;}
.error,.alert_text{color:var(--danger)!important;}
.successbox{border-left:3px solid var(--ok)!important;}

/* footer */
.copyright{color:var(--text-faint)!important;font-family:var(--mono)!important;font-size:11px;
  text-transform:uppercase;letter-spacing:.06em;padding-top:18px;}

/* keep FontAwesome icons intact (mono override mustn't eat them) */
.fa,.fas,.far,.fab,i.icon,i[class^="fa-"],i[class*=" fa-"]{font-family:"FontAwesome"!important;font-style:normal!important;}

/* fluid media never overflows */
#wrap img,#wrap .codebox,#wrap pre,#wrap table{max-width:100%;}
#wrap pre,#wrap .codebox{overflow-x:auto;}

/* ════════ dark-mode color hardening — override prosilver colours.css (light theme) ════════
   colours.css is loaded and sets dark text (#333) + black on :target posts + light panel/row
   backgrounds. These rules force readable contrast on every reading surface. */
body,.postbody,.content,.post .content,.post:target .content,
.content p,.content li,.content dd,.content dt,.content td,.content blockquote,
#message-box,.notification_text,dl.faq dd,.panel,.panel .content{color:var(--text)!important;}
.content a,.postbody .content a{color:var(--accent)!important;}
.content h2,.content h3,.panel h2,.postbody h3 a{color:var(--text)!important;border-bottom-color:var(--border)!important;}
.post:target h3 a,.post h3 a.first-unread{color:var(--accent)!important;}
/* convert leftover light backgrounds to dark surfaces */
.panel{background:var(--surface)!important;}
.bg1{background:var(--surface)!important;}
.bg2{background:var(--surface-2)!important;}
.bg3{background:var(--surface-3)!important;}
/* tasteful dark highlight for the jumped-to (#pXX) post instead of the old light flash */
.post:target{background:var(--accent-soft)!important;box-shadow:inset 3px 0 0 var(--accent)!important;}
/* keep post text at a comfortable reading measure even on the wider page */
.postbody .content{max-width:78ch;}

/* ════════ index footer: spread the online / birthdays / statistics blocks into a
   compact row of cards instead of tall stacked blocks ════════ */
.stat-block{display:inline-block!important;vertical-align:top;width:31.5%!important;
  box-sizing:border-box;margin:0 1% 14px 0!important;padding:14px 16px!important;
  background:var(--surface)!important;border:1px solid var(--border)!important;border-radius:10px!important;}
.stat-block h3{margin:0 0 8px!important;padding-bottom:6px;font-family:var(--mono)!important;
  font-size:12px!important;text-transform:uppercase;letter-spacing:.1em;color:var(--text-dim)!important;
  border-bottom:1px solid var(--border)!important;}
.stat-block p,.stat-block ul,.stat-block li{margin:0!important;font-size:12.5px!important;color:var(--text-dim)!important;}
.stat-block .username,.stat-block .username-coloured{font-family:var(--mono)!important;}
@media(max-width:782px){.stat-block{display:block!important;width:100%!important;margin-right:0!important;}}

/* ════════ responsive ════════ */
@media(max-width:782px){
  #wrap{width:auto;max-width:100%;margin:0 auto;padding:0 10px;}
  #site-description h1{font-size:24px;}
  .headerbar{padding:18px 16px!important;}
}
