/*  phpBB3 Style Sheet
    --------------------------------------------------------------
	Style name:			prosilver (the default phpBB 3.3.x style)
	Based on style:
	Original author:	Tom Beddard ( http://www.subblue.com/ )
	Modified by:		phpBB Limited ( https://www.phpbb.com/ )
    --------------------------------------------------------------
*/

@import url("normalize.css?hash=48eb3f89");
@import url("base.css?hash=7c5543be");
@import url("utilities.css?hash=d8f72c42");
@import url("common.css?hash=843d5d5f");
@import url("links.css?hash=18286e16");
@import url("content.css?hash=d6d1338b");
@import url("buttons.css?hash=56f0d25f");
@import url("cp.css?hash=50d868ab");
@import url("forms.css?hash=9016b55c");
@import url("icons.css?hash=64da33ce");
@import url("colours.css?hash=fcb2f289");
@import url("responsive.css?hash=c9d32cba");
/* Smiley Battle — phpBB prosilver overrides */
/* Drop this into /forum/styles/prosilver/theme/ as a separate file (e.g. smiley-battle.css)
   and include it via custom HTML injection in the ACP, OR append to the bottom of
   stylesheet.css in your active style and re-purge the cache from the ACP. */

:root {
    --sb-yellow:      #ffd700;
    --sb-yellow-soft: rgba(255, 215, 0, 0.15);
    --sb-yellow-dim:  #c69500;
    --sb-dark:        #1a1a1a;
    --sb-bg:          #f8f7f3;
}

/* ---- Body / overall background ---- */
html, body {
    background: var(--sb-bg);
}

/* ---- Top header bar ---- */
.headerbar {
    background: var(--sb-dark) url('./images/site_logo.png') center 12px no-repeat !important;
    background-size: auto 60px !important;
    border-bottom: 4px solid var(--sb-yellow) !important;
    min-height: 90px;
    padding-bottom: 0;
}

/* Hide phpBB's default site description (we have the banner) */
.headerbar .site_logo,
.headerbar h1,
.headerbar #site_description {
    visibility: hidden;
    height: 0;
}

/* ---- Navigation tabs ---- */
.navbar {
    background: var(--sb-dark);
    border-top: 1px solid #333;
}
.navbar .linklist > li > a {
    color: #f0f0f0;
}
.navbar .linklist > li > a:hover {
    color: var(--sb-yellow);
}

/* ---- Forum category headers ---- */
.forabg,
.forumbg {
    background-color: var(--sb-yellow) !important;
    background-image: linear-gradient(180deg, #ffe54d 0%, var(--sb-yellow) 100%) !important;
    border-radius: 8px;
    overflow: hidden;
}
.forabg .header,
.forumbg .header {
    color: var(--sb-dark);
}
.forabg .header a,
.forumbg .header a {
    color: var(--sb-dark) !important;
}

/* ---- Links ---- */
a { color: var(--sb-yellow-dim); }
a:hover { color: var(--sb-yellow); }

/* ---- Buttons ---- */
.button {
    background: var(--sb-yellow) !important;
    border-color: var(--sb-yellow-dim) !important;
    color: var(--sb-dark) !important;
    border-radius: 6px;
}
.button:hover {
    background: #ffe54d !important;
}

/* ---- "Mark as read" and pagination ---- */
.pagination li.active span,
.pagination li a {
    border-radius: 4px;
}
.pagination li.active span {
    background: var(--sb-yellow);
    border-color: var(--sb-yellow-dim);
    color: var(--sb-dark);
}

/* ---- Post boxes ---- */
.post {
    border-radius: 6px;
}

/* ---- Footer ---- */
#page-footer {
    border-top: 3px solid var(--sb-yellow);
    background: var(--sb-dark);
    color: #c0c0c0;
    padding: 1rem 0;
    border-radius: 0;
}
#page-footer a { color: var(--sb-yellow); }

/* ---- Link back to main site (added via overall_footer_after.html) ---- */
.sb-backlink {
    text-align: center;
    padding: 0.75rem;
    background: var(--sb-dark);
    color: #f0f0f0;
}
.sb-backlink a {
    color: var(--sb-yellow);
    font-weight: 600;
}
/* Paintjob Rampage — phpBB prosilver overrides (dark theme, matches the main site) */
/* Drop this into /forum/styles/prosilver/theme/ as a separate file (e.g. smiley-battle.css)
   and include it via custom HTML injection in the ACP, OR append to the bottom of
   stylesheet.css in your active style and re-purge the cache from the ACP.
   The display font is pulled from the main site root (/fonts/); the forum shares the
   same domain, so the absolute path resolves without an extra upload. */

/* ---- Fonts (self-hosted on the main site, OFL) ---- */

@font-face {
    font-family: 'Baloo 2';
    font-style: normal;
    font-weight: 700;
    font-display: swap;
    src: url('/fonts/baloo2-700.woff2') format('woff2');
}
@font-face {
    font-family: 'Baloo 2';
    font-style: normal;
    font-weight: 800;
    font-display: swap;
    src: url('/fonts/baloo2-800.woff2') format('woff2');
}

:root {
    --sb-yellow:      #ffd700;
    --sb-yellow-soft: rgba(255, 215, 0, 0.15);
    --sb-yellow-hi:   #ffe54d;
    --sb-yellow-dim:  #c69500;
    --sb-link:        #ffce33;
    --sb-dark:        #1a1a1a;
    --sb-bg:          #23272d;
    --sb-bg-gray:     #2a2f36;
    --sb-panel:       #333944;
    --sb-panel-alt:   #2f343d;
    --sb-row-hover:   #3a414d;
    --sb-input:       #1f232a;
    --sb-border:      #3d434d;
    --sb-border-gold: #4a4434;
    --sb-text:        #e4e6ea;
    --sb-text-dim:    #b9bdc6;
    --sb-text-faint:  #8a8f98;
}

/* ---- Body / overall background ---- */
html, body {
    background: var(--sb-bg);
    color: var(--sb-text);
}
body {
    font-family: "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
}
#wrap, #page-header, #page-body, .page-body {
    background: transparent;
}

/* ---- Display font for headings + block titles ---- */
h1, h2, h3,
a.forumtitle, a.topictitle,
ul.topiclist li.header dt,
ul.topiclist li.header dd {
    font-family: "Baloo 2", "Segoe UI", "Trebuchet MS", sans-serif;
}
h1, h2, h3 { font-weight: 800; }

/* ---- Top header bar ---- */
.headerbar {
    background: var(--sb-dark) url('./images/site_logo.png') center 12px no-repeat !important;
    background-size: auto 60px !important;
    border-bottom: 4px solid var(--sb-yellow) !important;
    min-height: 90px;
    padding-bottom: 0;
}

/* Hide phpBB's default site description (we have the banner) */
.headerbar .site_logo,
.headerbar h1,
.headerbar #site_description {
    visibility: hidden;
    height: 0;
}

/* ---- Navigation bars ---- */
.navbar {
    background: var(--sb-dark);
    border: none;
    border-top: 1px solid #333;
    border-radius: 0;
}
.navbar .linklist > li > a,
.navbar .dropdown-trigger {
    color: #f0f0f0;
}
.navbar .linklist > li > a:hover {
    color: var(--sb-yellow);
}
.breadcrumbs .crumb a { color: var(--sb-link); }

/* ---- Forum / category blocks ---- */
.forabg,
.forumbg {
    background: var(--sb-panel) !important;
    border: 1px solid var(--sb-border) !important;
    border-radius: 10px;
    overflow: hidden;
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.3);
}
.forabg .inner,
.forumbg .inner {
    background: transparent;
}

/* Header rows = yellow accent (same as the site's news heading) */
.forabg li.header,
.forumbg li.header,
ul.topiclist li.header {
    background: linear-gradient(180deg, var(--sb-yellow-hi) 0%, var(--sb-yellow) 100%) !important;
}
.forabg li.header dl,
.forumbg li.header dl,
ul.topiclist li.header dl {
    background: transparent !important;
}
.forabg .header,
.forumbg .header,
ul.topiclist li.header dt,
ul.topiclist li.header dd,
.forabg .header a,
.forumbg .header a,
ul.topiclist li.header dt a {
    color: var(--sb-dark) !important;
    text-shadow: none !important;
}

/* ---- List rows ---- */
ul.topiclist li.row {
    background: var(--sb-panel);
}
ul.topiclist li.row:hover {
    background: var(--sb-row-hover);
}
ul.topiclist dd {
    border-left-color: var(--sb-border);
}
.bg1 { background-color: var(--sb-panel-alt) !important; }
.bg2 { background-color: var(--sb-panel) !important; }
.bg3 { background-color: var(--sb-bg-gray) !important; }

/* ---- Text colours ---- */
.content,
.postbody,
.post,
.panel,
.column1, .column2,
fieldset dl, fieldset dl dt, fieldset dl dd,
dl.details dt, dl.details dd,
td, th, p, .rules {
    color: var(--sb-text);
}
.row-item dd,
.topic-poster, .responsive-show,
.author, .lastpost, .posts, .topics, .views,
.online-list, .notification_text, time, .error {
    color: var(--sb-text-dim);
}
a.forumtitle, a.topictitle {
    color: var(--sb-link);
    font-weight: 700;
}
a.forumtitle:hover, a.topictitle:hover {
    color: var(--sb-yellow);
}
.postbody h3 a, .post .postbody h3 a {
    color: var(--sb-link);
}

/* ---- Post profile column ---- */
.postprofile {
    background: var(--sb-bg-gray);
    border-color: var(--sb-border);
    color: var(--sb-text-dim);
}
.postprofile strong { color: var(--sb-text); }
.postprofile a { color: var(--sb-link); }

/* ---- Generic panels (UCP, FAQ, memberlist, posting) ---- */
.panel {
    background-color: var(--sb-panel);
    color: var(--sb-text);
    border-radius: 8px;
}
.panel a { color: var(--sb-link); }
.cp-mini, .mini, fieldset.polls, blockquote, .stat-block {
    background: var(--sb-bg-gray);
    color: var(--sb-text);
    border-color: var(--sb-border);
}
.codebox {
    background: var(--sb-input);
    border-color: var(--sb-border);
    color: var(--sb-text);
}
.codebox p { border-bottom-color: var(--sb-border); color: var(--sb-text-dim); }
.codebox code { color: var(--sb-text); }

/* ---- Tables (memberlist, ACP-like listings) ---- */
table.table1 thead th { color: var(--sb-yellow); }
table.table1 tbody tr { background: var(--sb-panel); }
table.table1 tbody tr:hover { background: var(--sb-row-hover); }
table.table1 td {
    color: var(--sb-text);
    border-color: var(--sb-border);
}

/* ---- Form fields ---- */
.inputbox, textarea, select {
    background-color: var(--sb-input) !important;
    color: var(--sb-text) !important;
    border: 1px solid var(--sb-border) !important;
}
.inputbox:focus, textarea:focus, select:focus {
    border-color: var(--sb-yellow) !important;
    box-shadow: 0 0 0 2px var(--sb-yellow-soft);
}
fieldset.fields1, fieldset.fields2 { background: transparent; }

/* ---- Links ---- */
a { color: var(--sb-link); }
a:hover { color: var(--sb-yellow); }

/* ---- Buttons ---- */
.button {
    background: var(--sb-yellow) !important;
    border-color: var(--sb-yellow-dim) !important;
    color: var(--sb-dark) !important;
    border-radius: 6px;
}
.button:hover {
    background: var(--sb-yellow-hi) !important;
    color: var(--sb-dark) !important;
}
.button .icon, .button svg { color: var(--sb-dark) !important; }
.button.button-secondary {
    background: var(--sb-bg-gray) !important;
    border-color: var(--sb-border) !important;
    color: var(--sb-text) !important;
}
.button.button-secondary:hover { background: var(--sb-row-hover) !important; }

/* ---- Pagination ---- */
.pagination li a,
.pagination li span {
    background: var(--sb-bg-gray);
    border: 1px solid var(--sb-border);
    color: var(--sb-text);
    border-radius: 4px;
}
.pagination li a:hover {
    background: var(--sb-row-hover);
    color: var(--sb-yellow);
}
.pagination li.active span {
    background: var(--sb-yellow);
    border-color: var(--sb-yellow-dim);
    color: var(--sb-dark);
}

/* ---- Dropdown menus / notifications ---- */
.dropdown-contents {
    background: var(--sb-panel);
    border-color: var(--sb-border);
    color: var(--sb-text);
}
.dropdown .pointer-inner { border-bottom-color: var(--sb-panel); }
.dropdown .pointer { border-bottom-color: var(--sb-border); }
.dropdown-contents a { color: var(--sb-link); }
.dropdown-contents li:hover { background: var(--sb-row-hover); }
.notification_list ul li {
    background: var(--sb-panel);
    border-color: var(--sb-border);
}
.notification_list p.notification-title { color: var(--sb-text); }

/* ---- Post boxes ---- */
.post {
    border-radius: 6px;
}

/* ---- Footer ---- */
#page-footer {
    border-top: 3px solid var(--sb-yellow);
    background: var(--sb-dark);
    color: var(--sb-text-dim);
    padding: 1rem 0;
    border-radius: 0;
}
#page-footer a { color: var(--sb-yellow); }
.copyright { color: var(--sb-text-faint); }

/* ---- Link back to main site (added via overall_footer_after.html) ---- */
.sb-backlink {
    text-align: center;
    padding: 0.75rem;
    background: var(--sb-dark);
    color: #f0f0f0;
}
.sb-backlink a {
    color: var(--sb-yellow);
    font-weight: 600;
}
