/* =====================================================================
   ONLINE ASSAULT  ·  phpBB 3.3 style (child of prosilver)
   ---------------------------------------------------------------------
   This file inherits ALL of prosilver's CSS, then overrides colours,
   fonts and key components to match the tactical-HUD web theme.
   Editing prosilver itself is never required.
   ===================================================================== */

/* --- Webfonts (must come before the prosilver import) --- */
@import url('https://fonts.googleapis.com/css2?family=Chakra+Petch:wght@400;500;600;700&family=Inter:wght@400;500;600&family=JetBrains+Mono:wght@400;500;700&display=swap');

/* --- Inherit everything from prosilver --- */
@import url("../../prosilver/theme/stylesheet.css");

/* =====================================================================
   DESIGN TOKENS
   ===================================================================== */
:root{
  --oa-blackout:#0a0d12;
  --oa-gunmetal:#11161f;
  --oa-gunmetal2:#161c27;
  --oa-trench:#222c3a;
  --oa-trench-lit:#2f3b4d;
  --oa-tracer:#ff6a2b;
  --oa-steel:#5aa7c9;
  --oa-text-hi:#eef2f8;
  --oa-text:#aeb8c7;
  --oa-text-mute:#6b7686;
  --oa-disp:'Chakra Petch',system-ui,sans-serif;
  --oa-body:'Inter',-apple-system,BlinkMacSystemFont,system-ui,sans-serif;
  --oa-mono:'JetBrains Mono',ui-monospace,monospace;
}

/* =====================================================================
   BASE
   ===================================================================== */
html{background:var(--oa-blackout);}
body.nojs, body{
  background:var(--oa-blackout) !important;
  color:var(--oa-text);
  font-family:var(--oa-body);
  background-image:
    linear-gradient(rgba(90,167,201,.03) 1px,transparent 1px),
    linear-gradient(90deg,rgba(90,167,201,.03) 1px,transparent 1px) !important;
  background-size:64px 64px !important;
  background-attachment:fixed !important;
}
#wrap{background:transparent;}
.wrapcentre,#page-body{color:var(--oa-text);}

a{color:var(--oa-steel);}
a:hover{color:var(--oa-tracer);}

h1,h2,h3{font-family:var(--oa-disp);color:var(--oa-text-hi);letter-spacing:-.01em;}
h2{text-transform:uppercase;}

/* selection */
::selection{background:var(--oa-tracer);color:#000;}

/* =====================================================================
   HEADER + SITE TITLE
   ===================================================================== */
#page-header .headerbar,
.headerbar{
  background:linear-gradient(180deg,var(--oa-gunmetal2),var(--oa-gunmetal)) !important;
  color:var(--oa-text-hi) !important;
  border:1px solid var(--oa-trench);
  border-bottom:2px solid var(--oa-tracer);
  border-radius:4px;
}
/* Header brand lockup: reticle mark + "OnlineAssault" wordmark, drawn entirely
   in CSS so it ALWAYS shows and matches the website — independent of the board's
   site-name setting, with no ACP logo upload and no template edits.
   To change the words or colours, edit the ::before / ::after rules below. */
#site-description .site_logo{display:none !important;}
#site-description h1{
  display:flex !important;
  align-items:center;
  font-size:0 !important;
  margin:0;
  min-height:48px;
  padding-left:60px;
  background:url("images/oa-mark.svg") left center no-repeat;
  background-size:48px 48px;
}
#site-description h1::before,
#site-description h1::after{
  font-family:var(--oa-disp);
  font-weight:700;
  font-size:26px !important;
  line-height:1;
  letter-spacing:.04em;
  text-transform:uppercase;
}
#site-description h1::before{content:"Online";color:var(--oa-text-hi);}
#site-description h1::after{content:"Assault";color:var(--oa-tracer);}
#site-description .site-description,
#site-description p{
  font-family:var(--oa-mono);
  font-size:12px;
  letter-spacing:.1em;
  text-transform:uppercase;
  color:var(--oa-text-mute) !important;
}

/* search box in header */
.search-header{background:var(--oa-blackout) !important;border:1px solid var(--oa-trench);}

/* =====================================================================
   NAVIGATION
   ===================================================================== */
.navbar{
  background:var(--oa-gunmetal2) !important;
  border:1px solid var(--oa-trench);
  border-radius:4px;
}
ul.linklist{background:transparent !important;}
.navbar .linklist li a,
#nav-main a,
ul.linklist li a{
  color:var(--oa-text) !important;
  font-family:var(--oa-mono);
  font-size:13px;
}
#nav-main a:hover,
.navbar .linklist li a:hover{color:var(--oa-tracer) !important;background:transparent;}
.dropdown-contents{
  background:var(--oa-gunmetal) !important;
  border:1px solid var(--oa-trench-lit) !important;
  box-shadow:0 12px 40px -10px rgba(0,0,0,.7);
}
.dropdown .pointer-inner{border-color:transparent transparent var(--oa-gunmetal) !important;}
.dropdown .pointer{border-color:transparent transparent var(--oa-trench-lit) !important;}
.dropdown-contents a:hover,.dropdown li:hover{background:var(--oa-gunmetal2) !important;}

/* =====================================================================
   FORUM / CATEGORY BLOCKS
   ===================================================================== */
.forabg,.forumbg{
  background:var(--oa-gunmetal) !important;
  border:1px solid var(--oa-trench);
  border-radius:4px;
  padding:1px;
}
.forabg .header,.forumbg .header,
ul.topiclist li.header dl{
  background:linear-gradient(180deg,var(--oa-gunmetal2),var(--oa-gunmetal)) !important;
}
ul.topiclist li.header dt,
ul.topiclist li.header dd,
.forabg li.header dt,.forumbg li.header dt{
  font-family:var(--oa-mono);
  text-transform:uppercase;
  letter-spacing:.12em;
  font-size:11px;
  color:var(--oa-tracer) !important;
}
ul.topiclist li.row{background:var(--oa-gunmetal) !important;}
ul.topiclist li.row:hover{background:var(--oa-gunmetal2) !important;}
ul.topiclist dt,ul.topiclist dd{border:none;}
ul.topiclist li.row dl{border-bottom:1px solid var(--oa-trench);}
.forumbg .topiclist.two-long-columns .row dl,
li.row strong{color:var(--oa-text);}

a.forumtitle,a.topictitle{
  font-family:var(--oa-disp);
  font-weight:600;
  color:var(--oa-text-hi) !important;
}
a.forumtitle:hover,a.topictitle:hover{color:var(--oa-tracer) !important;}
.forumbg .row-item dt .list-inner,
.topic-poster,.responsive-show,.row-item .by,
dd.lastpost span,dd.posts,dd.topics,dd.views{color:var(--oa-text-mute) !important;}

/* unread indicators / read icons keep prosilver shapes but recolour link */
.row-item.forum_unread .icon,.row-item.topic_unread .icon{filter:hue-rotate(-15deg) saturate(1.2);}

/* =====================================================================
   PANELS / GENERIC CONTENT BOXES
   ===================================================================== */
.panel{
  background:var(--oa-gunmetal) !important;
  border:1px solid var(--oa-trench);
  border-radius:4px;
  color:var(--oa-text);
}
.panel h2,.panel h3{color:var(--oa-text-hi);}
.bg1{background:var(--oa-gunmetal) !important;}
.bg2{background:var(--oa-gunmetal2) !important;}
.bg3{background:var(--oa-gunmetal2) !important;}

/* =====================================================================
   POSTS (viewtopic)
   ===================================================================== */
.post{border-bottom:1px solid var(--oa-trench) !important;}
.post.bg1,.post.bg2{background:var(--oa-gunmetal) !important;}
.postprofile{
  background:var(--oa-gunmetal2) !important;
  border-left:1px solid var(--oa-trench) !important;
  color:var(--oa-text-mute) !important;
}
.postprofile .username,.postprofile .username-coloured,.postprofile strong{color:var(--oa-text-hi) !important;}
.postbody .content,.content{color:var(--oa-text) !important;}
.postbody h3,.postbody h3 a{color:var(--oa-text-hi) !important;font-family:var(--oa-disp);}
p.author{font-family:var(--oa-mono);font-size:12px;color:var(--oa-text-mute) !important;}
.signature{border-top:1px solid var(--oa-trench);color:var(--oa-text-mute);}
.postbody .codebox,.codebox{
  background:var(--oa-blackout) !important;
  border:1px solid var(--oa-trench) !important;
  color:var(--oa-text-hi);
}
.codebox p,.codebox p.rtl{background:var(--oa-gunmetal2) !important;color:var(--oa-text-mute) !important;}
blockquote{
  background:var(--oa-gunmetal2) !important;
  border:1px solid var(--oa-trench) !important;
  border-left:3px solid var(--oa-tracer) !important;
}

/* =====================================================================
   BUTTONS
   ===================================================================== */
.button,a.button,input.button,button.button,
.button1,.button2,a.button1,a.button2,input.button1,input.button2{
  background:var(--oa-gunmetal2) !important;
  border:1px solid var(--oa-trench-lit) !important;
  color:var(--oa-text-hi) !important;
  font-family:var(--oa-disp) !important;
  font-weight:600;
  text-transform:uppercase;
  letter-spacing:.05em;
  border-radius:4px;
  text-shadow:none !important;
}
.button:hover,a.button:hover,input.button:hover,button.button:hover,
.button1:hover,a.button1:hover{
  border-color:var(--oa-tracer) !important;
  color:var(--oa-tracer) !important;
  background:var(--oa-gunmetal) !important;
}
.button.button-primary,a.button-primary,.button-primary,
input[type=submit].button1{
  background:var(--oa-tracer) !important;
  border-color:var(--oa-tracer) !important;
  color:#0a0d12 !important;
}
.button.button-primary:hover,a.button-primary:hover,input[type=submit].button1:hover{
  filter:brightness(1.08);
  color:#0a0d12 !important;
}
.button .icon,.button-icon-only{color:inherit !important;}

/* =====================================================================
   FORMS
   ===================================================================== */
input,textarea,select,
input.inputbox,textarea.inputbox,select.inputbox,
.inputbox{
  background:var(--oa-blackout) !important;
  border:1px solid var(--oa-trench) !important;
  color:var(--oa-text-hi) !important;
}
input:focus,textarea:focus,select:focus,.inputbox:focus{
  border-color:var(--oa-tracer) !important;
  box-shadow:0 0 0 1px var(--oa-tracer) !important;
  outline:none;
}
fieldset.fields1,fieldset.fields2{background:transparent;}
dl.fields1 dt,dl.fields2 dt{color:var(--oa-text);}

/* =====================================================================
   PAGINATION
   ===================================================================== */
.pagination li a,.pagination li span{
  background:var(--oa-gunmetal2) !important;
  border:1px solid var(--oa-trench) !important;
  color:var(--oa-text) !important;
}
.pagination li.active span,.pagination li a:hover{
  background:var(--oa-tracer) !important;
  border-color:var(--oa-tracer) !important;
  color:#0a0d12 !important;
}

/* =====================================================================
   TABLES (memberlist, etc.)
   ===================================================================== */
table.table1{background:transparent;}
table.table1 thead th{
  background:var(--oa-gunmetal2) !important;
  color:var(--oa-tracer) !important;
  font-family:var(--oa-mono);
  text-transform:uppercase;
  letter-spacing:.1em;
  font-size:11px;
  border-bottom:1px solid var(--oa-trench);
}
table.table1 tbody td{border-color:var(--oa-trench) !important;color:var(--oa-text);}
table.table1 tbody tr{background:var(--oa-gunmetal) !important;}
table.table1 tbody tr:hover{background:var(--oa-gunmetal2) !important;}

/* =====================================================================
   TABS (UCP / MCP)
   ===================================================================== */
#tabs .tab > a,#minitabs .tab > a{
  background:var(--oa-gunmetal2) !important;
  color:var(--oa-text) !important;
  border:1px solid var(--oa-trench);
  border-bottom:none;
}
#tabs .activetab > a,#minitabs .activetab > a{
  background:var(--oa-gunmetal) !important;
  color:var(--oa-tracer) !important;
  border-top:2px solid var(--oa-tracer) !important;
}
#cp-menu .cp-menu,.cp-main .panel{background:var(--oa-gunmetal) !important;}
#navigation a{background:var(--oa-gunmetal2) !important;color:var(--oa-text) !important;border:1px solid var(--oa-trench);}
#navigation #active-subsection a{background:var(--oa-gunmetal) !important;color:var(--oa-tracer) !important;}

/* =====================================================================
   NOTICES / MESSAGES
   ===================================================================== */
.rules,.notice{background:var(--oa-gunmetal2) !important;border:1px solid var(--oa-trench) !important;color:var(--oa-text);}
.error,.message strong.error{color:var(--oa-tracer) !important;}

/* =====================================================================
   FOOTER
   ===================================================================== */
#page-footer{margin-top:24px;}
#page-footer .copyright,.copyright{
  font-family:var(--oa-mono);
  font-size:11px;
  letter-spacing:.06em;
  color:var(--oa-text-mute) !important;
}
#page-footer a{color:var(--oa-steel) !important;}
#page-footer a:hover{color:var(--oa-tracer) !important;}

/* =====================================================================
   MISC ACCENTS
   ===================================================================== */
.icon-notification .badge,.badge{background:var(--oa-tracer) !important;color:#0a0d12 !important;}
hr{border-color:var(--oa-trench) !important;}
.icon.fa,.fa{color:inherit;}