/* Toolly phpBB Theme — extends prosilver */
@import url("../../prosilver/theme/stylesheet.css");

/* ─── Prosilver Color Neutralization ─── */
/* Override ALL prosilver blue/gray palette with Toolly warm tones.
   Source colors: #536482, #368AD2, #12A3EB, #0076B1, #CADCEB,
   #E1EBF2, #DCDEE2, #4692BF, #333, #666, #999 */

body {
  color: var(--tl-ink) !important;
  background: var(--tl-bg) !important;
}

/* ── Text: blue-gray #536482 → warm ink ── */
.copyright, .stat-block, dl.details dt, dl.details dd,
.post .author, .rules, #information,
.post .notice, .post .postbody,
fieldset dl, fieldset.fields1 dl,
p.jumpbox-return,
table.table1 td,
.icon.icon-bluegray,
.tabs .tab > a,
.responsive-tab .responsive-tab-link:before { color: var(--tl-ink-2) !important; }

/* ── Text: #333 → ink ── */
table.table1 tbody th,
.postbody, .content, dl.faq dt,
.minitabs .activetab > a,
.panel-container table.table1 thead th,
label, dt label { color: var(--tl-ink) !important; }

/* ── Text: #666 / #999 → muted ink ── */
.attachbox, dl.file, dl.file dd,
dl.thumbnail dt, dl.thumbnail dd,
input.disabled, .top i,
.icon.icon-lightgray,
.phpbb_alert { color: var(--tl-ink-3) !important; }

/* ── Links: #368AD2 / #0076B1 → accent ── */
a:link, a:active, a:visited,
.postlink,
.jumpbox-cat-link,
.jumpbox-forum-link a,
.jumpbox-sub-link a,
.navigation a { color: var(--tl-accent) !important; }

a:hover,
.postlink:hover,
.jumpbox-cat-link:hover,
.arrow-left:hover, .arrow-right:hover { color: var(--tl-accent-2) !important; }

/* ── Postlink border ── */
.postlink { border-bottom-color: transparent !important; }

/* ── Header bars: prosilver gradients → flat bg ── */
.headerbar, .navbar,
.action-bar, .action-bar .pagination {
  background: none !important;
  background-color: var(--tl-bg-2) !important;
  background-image: none !important;
}

/* ── Panel headers (#CADCEB, #E1EBF2, #EEF5F9) ── */
.bg1, .bg2, .bg3,
ul.topiclist li.header dt, ul.topiclist li.header dd,
.forabg .header, .forumbg .header,
fieldset.fields2, .panel dl.faq,
.ucprowbg {
  background: var(--tl-bg-2) !important;
  background-image: none !important;
  color: var(--tl-ink-2) !important;
  border-color: var(--tl-line) !important;
}

/* ── Panel/card backgrounds ── */
.panel, .inner, .bg,
ul.topiclist li.row,
.post .postprofile, .post .postbody {
  background: var(--tl-panel) !important;
  color: var(--tl-ink) !important;
}

/* ── Tabs (#536482 / #CADCEB) ── */
#tabs li.activetab a, #minitabs li.activetab a,
.tabs .activetab > a {
  background: var(--tl-panel) !important;
  border-bottom-color: var(--tl-panel) !important;
  color: var(--tl-accent) !important;
}
.tabs .tab > a, .minitabs .tab > a {
  color: var(--tl-ink-3) !important;
  background: transparent !important;
}
.minitabs .tab > a { background: var(--tl-bg-2) !important; }

/* ── Pagination current (#4692BF, #368AD2) ── */
.pagination li.active span {
  background: var(--tl-accent) !important;
  border-color: var(--tl-accent) !important;
  color: #fff !important;
}
.pagination li a:hover {
  background: var(--tl-accent-soft) !important;
  color: var(--tl-accent) !important;
}

/* ── Primary buttons ── */
input[type="submit"], .button1,
input[type="submit"]:hover, .button1:hover {
  background: var(--tl-accent) !important;
  background-image: none !important;
  border-color: var(--tl-accent) !important;
  color: #fff !important;
}

/* ── Secondary buttons ── */
.button2, input[type="reset"],
.button2:hover, input[type="reset"]:hover {
  background: var(--tl-panel-2) !important;
  background-image: none !important;
  border-color: var(--tl-line) !important;
  color: var(--tl-ink) !important;
}

/* ── Borders (#CADCEB, #B4C4D1, #D2D2D2, #DCDEE2) ── */
.forabg, .forumbg, .post, .panel,
fieldset, dl.details, table.table1,
fieldset.polls dl,
ul.topiclist li { border-color: var(--tl-line) !important; }

/* ── Zebra / alternating rows (#E1EBF2) ── */
li.row:hover, li.row-b:hover, .bg1:hover,
.even, .odd, li.row-b,
ul.zebra-list li:nth-child(even),
.jumpbox-forum-link, .jumpbox-sub-link {
  background: var(--tl-bg-2) !important;
}

/* ── Navigation breadcrumb (#333, #CADCEB gradient) ── */
.navigation a {
  background: none !important;
  background-image: none !important;
}

/* ── Input fields ── */
input, textarea, select {
  background: var(--tl-bg-2) !important;
  border-color: var(--tl-line) !important;
  color: var(--tl-ink) !important;
}

/* ── Horizontal rules ── */
hr, .content hr, .sep {
  border-color: var(--tl-line) !important;
  background: var(--tl-line) !important;
}

/* ── Thumbnail hover border (#368AD2) ── */
dl.thumbnail dt a:hover img {
  border-color: var(--tl-accent) !important;
}

/* ── Attach image border (#999) ── */
.attach-image img {
  border-color: var(--tl-line) !important;
}

/* ── Icon black #333 ── */
.icon.icon-black { color: var(--tl-ink) !important; }

/* ─── Design Tokens ─── */
:root {
  --tl-bg:        oklch(0.972 0.012 82);
  --tl-bg-2:      oklch(0.955 0.014 80);
  --tl-bg-3:      oklch(0.935 0.016 78);
  --tl-panel:     oklch(0.985 0.008 84);
  --tl-panel-2:   oklch(0.965 0.012 82);
  --tl-line:      oklch(0.89  0.014 78);
  --tl-line-2:    oklch(0.83  0.018 75);
  --tl-ink:       oklch(0.215 0.018 55);
  --tl-ink-2:     oklch(0.36  0.018 55);
  --tl-ink-3:     oklch(0.52  0.016 60);
  --tl-ink-4:     oklch(0.68  0.012 65);
  --tl-accent:    oklch(0.66  0.155 48);
  --tl-accent-2:  oklch(0.74  0.145 60);
  --tl-accent-soft: oklch(0.93 0.045 65);
  --tl-accent-ink: oklch(0.30 0.10 45);
  --tl-radius-s:  6px;
  --tl-radius:    10px;
  --tl-radius-l:  14px;
  --tl-radius-xl: 20px;
  --tl-shadow-1: 0 1px 0 oklch(1 0 0 / .6) inset, 0 1px 2px oklch(0.2 0.02 50 / .04);
  --tl-shadow-2: 0 1px 0 oklch(1 0 0 / .6) inset, 0 4px 18px -8px oklch(0.2 0.02 50 / .14);
  --tl-font-sans:  "Inter", ui-sans-serif, system-ui, -apple-system, sans-serif;
  --tl-font-serif: "Source Serif 4", "Iowan Old Style", Georgia, serif;
}

/* ─── Global Overrides ─── */
* { box-sizing: border-box; }

body {
  margin: 0;
  padding: 0;
  font-family: var(--tl-font-sans) !important;
  color: var(--tl-ink);
  background: var(--tl-bg) !important;
  font-size: 15px;
  line-height: 1.6;
  -webkit-font-smoothing: antialiased;
}

/* Hide prosilver's original header */
#page-header .headerbar,
#page-header .navbar {
  display: none !important;
}

/* Adjust body for fixed topbar */
#wrap {
  padding-top: 56px;
  max-width: 1200px;
  margin: 0 auto;
}

/* ─── Toolly Topbar ─── */
.tl-topbar {
  position: fixed; top: 0; left: 0; right: 0; z-index: 100;
  height: 56px;
  display: flex; align-items: center; gap: 20px;
  padding: 0 24px;
  background: var(--tl-panel);
  backdrop-filter: blur(20px) saturate(160%);
  -webkit-backdrop-filter: blur(20px) saturate(160%);
  border-bottom: 1px solid var(--tl-line);
}

.tl-brand {
  display: flex; align-items: center; gap: 10px;
  text-decoration: none; color: inherit; flex-shrink: 0;
}
.tl-brand-mark {
  width: 28px; height: 28px; border-radius: 8px;
  background: linear-gradient(140deg, var(--tl-accent), var(--tl-accent-2));
  display: grid; place-items: center;
  color: white;
  font-family: var(--tl-font-serif); font-style: italic; font-weight: 600; font-size: 16px;
  box-shadow: 0 1px 0 rgba(255,255,255,.3) inset, 0 2px 6px oklch(0.4 0.1 50 / .25);
}
.tl-brand-name {
  font-family: var(--tl-font-serif);
  font-size: 18px; font-weight: 600; letter-spacing: -0.015em;
}

/* Search */
.tl-search { flex: 1; max-width: 400px; }
.tl-search form {
  display: flex; align-items: center;
  background: var(--tl-bg-2);
  border: 1px solid var(--tl-line);
  border-radius: var(--tl-radius);
  height: 34px; padding: 0 12px;
  transition: border-color .15s;
}
.tl-search form:focus-within { border-color: var(--tl-accent); }
.tl-search input {
  flex: 1; border: 0; outline: 0; background: transparent;
  font-family: inherit; font-size: 13px; color: var(--tl-ink);
}
.tl-search input::placeholder { color: var(--tl-ink-4); }
.tl-search button {
  border: 0; background: transparent; color: var(--tl-ink-4);
  cursor: pointer; font-size: 14px; display: flex; align-items: center;
}

/* Nav links */
.tl-nav {
  display: flex; align-items: center; gap: 4px; margin-left: auto;
}
.tl-nav-link {
  font-size: 13px; font-weight: 500; color: var(--tl-ink-2);
  text-decoration: none; padding: 6px 10px; border-radius: 7px;
  transition: background .12s, color .12s;
  display: inline-flex; align-items: center; gap: 5px;
}
.tl-nav-link:hover { background: var(--tl-bg-2); color: var(--tl-ink); }
.tl-nav-accent { color: var(--tl-accent) !important; font-weight: 600 !important; }
.tl-nav-active {
  background: var(--tl-accent-soft); color: var(--tl-accent-ink) !important;
  font-weight: 600 !important;
}
.tl-nav-cta {
  background: var(--tl-accent); color: white !important; font-weight: 600;
  padding: 6px 14px; box-shadow: 0 1px 0 rgba(255,255,255,.2) inset;
}
.tl-nav-cta:hover { filter: brightness(1.05); background: var(--tl-accent); }
.tl-nav-cta-outline {
  color: var(--tl-accent) !important; font-weight: 600 !important;
  border: 1px solid var(--tl-line-2);
  border-radius: 7px; font-size: 11px !important;
  letter-spacing: 0.05em;
}
.tl-nav-cta-outline:hover {
  background: var(--tl-accent-soft); border-color: var(--tl-accent);
}

/* User link */
.tl-nav-user {
  display: inline-flex; align-items: center; gap: 5px;
}

/* Dropdown */
.tl-dropdown { position: relative; }
.tl-dropdown-menu {
  display: none;
  position: absolute; top: calc(100% + 6px); left: 50%; transform: translateX(-50%);
  min-width: 180px;
  background: var(--tl-panel);
  backdrop-filter: blur(20px) saturate(160%);
  -webkit-backdrop-filter: blur(20px) saturate(160%);
  border: 1px solid var(--tl-line);
  border-radius: 10px; padding: 6px;
  box-shadow: 0 8px 24px oklch(0 0 0 / .12);
  z-index: 200;
  flex-direction: column; gap: 1px;
}
.tl-dropdown.open .tl-dropdown-menu { display: flex; }
.tl-dropdown-menu a {
  font-size: 12px; font-weight: 500; color: var(--tl-ink-2);
  text-decoration: none; padding: 7px 12px; border-radius: 7px;
  white-space: nowrap;
  transition: background .12s, color .12s;
}
.tl-dropdown-menu a:hover { background: var(--tl-bg-2); color: var(--tl-ink); }
.tl-sep { height: 1px; background: var(--tl-line); margin: 4px 0; }
.tl-logout { color: #e53935 !important; }

/* Badge */
.tl-badge {
  display: inline-flex; align-items: center; justify-content: center;
  min-width: 18px; height: 18px; border-radius: 9px;
  background: var(--tl-accent); color: white;
  font-size: 10px; font-weight: 700; padding: 0 5px;
}

/* Icon button */
.tl-icon-btn {
  width: 32px; height: 32px; display: grid; place-items: center;
  border-radius: 8px; border: 1px solid transparent;
  background: transparent; color: var(--tl-ink-2); cursor: pointer;
  transition: background .15s, border-color .15s;
  position: relative;
}
.tl-icon-btn:hover { background: var(--tl-bg-2); border-color: var(--tl-line); }

/* Hamburger */
.tl-hamburger {
  display: none;
  width: 36px; height: 36px; place-items: center;
  border-radius: 8px; border: 1px solid var(--tl-line);
  background: transparent; color: var(--tl-ink-2); cursor: pointer;
  margin-left: auto;
}
.tl-mobile-theme { display: none; }

/* Mobile nav */
.tl-mobile-nav {
  display: none;
  position: fixed; top: 56px; left: 0; right: 0; z-index: 99;
  background: var(--tl-panel);
  backdrop-filter: blur(20px) saturate(160%);
  -webkit-backdrop-filter: blur(20px) saturate(160%);
  border-bottom: 1px solid var(--tl-line);
  padding: 12px 16px 16px;
  flex-direction: column; gap: 4px;
}
.tl-mobile-nav.open { display: flex; }
.tl-mobile-nav a {
  font-size: 14px; font-weight: 500; color: var(--tl-ink-2);
  text-decoration: none; padding: 10px 14px; border-radius: 8px;
  transition: background .12s, color .12s;
}
.tl-mobile-nav a:hover { background: var(--tl-bg-2); color: var(--tl-ink); }

@media (max-width: 768px) {
  .tl-nav { display: none; }
  .tl-search { max-width: none; min-width: 0; }
  .tl-topbar { gap: 10px; overflow: hidden; }
  .tl-hamburger { display: grid; flex-shrink: 0; }
  .tl-mobile-theme { flex-shrink: 0; }
}

/* ─── Breadcrumbs ─── */
.tl-breadcrumb-bar {
  padding: 12px 0;
  border-bottom: 1px solid var(--tl-line);
  margin-bottom: 20px;
}
.tl-crumbs {
  list-style: none; margin: 0; padding: 0;
  display: flex; align-items: center; gap: 4px;
  font-size: 13px;
}
.tl-crumbs li::after {
  content: "/"; color: var(--tl-ink-4); margin-left: 8px;
}
.tl-crumbs li:last-child::after { content: none; }
.tl-crumbs a {
  color: var(--tl-ink-3); text-decoration: none;
  transition: color .12s;
}
.tl-crumbs a:hover { color: var(--tl-accent); }

/* ─── phpBB Content Overrides ─── */

/* Forum list panels */
.forabg, .forumbg {
  background: var(--tl-panel) !important;
  border: 1px solid var(--tl-line) !important;
  border-radius: var(--tl-radius-l) !important;
  margin-bottom: 12px !important;
  overflow: hidden;
  box-shadow: var(--tl-shadow-1);
}
.forabg:hover, .forumbg:hover {
  border-color: var(--tl-line-2) !important;
  box-shadow: var(--tl-shadow-2);
}

/* Header rows */
.forabg .header, .forumbg .header {
  background: var(--tl-bg-2) !important;
  border-bottom: 1px solid var(--tl-line) !important;
  color: var(--tl-ink-2) !important;
}
.forabg .header dt, .forumbg .header dt,
.forabg .header dd, .forumbg .header dd {
  color: var(--tl-ink-3) !important;
  font-family: var(--tl-font-sans) !important;
  font-size: 11px !important;
  font-weight: 600 !important;
  text-transform: uppercase !important;
  letter-spacing: 0.05em !important;
}

/* Forum rows */
li.row {
  border-top: 1px solid var(--tl-line) !important;
  background: transparent !important;
}
li.row:first-child { border-top: none !important; }
li.row .inner { padding: 14px 10px !important; }

/* Forum title links */
a.forumtitle {
  font-family: var(--tl-font-serif) !important;
  font-size: 16px !important;
  font-weight: 600 !important;
  color: var(--tl-ink) !important;
  letter-spacing: -0.015em;
}
a.forumtitle:hover { color: var(--tl-accent) !important; }

/* Topic title links */
a.topictitle {
  font-family: var(--tl-font-serif) !important;
  font-size: 15px !important;
  font-weight: 600 !important;
  color: var(--tl-ink) !important;
}
a.topictitle:hover { color: var(--tl-accent) !important; }

/* Forum descriptions */
.forabg .list-inner .forum-desc,
.forabg .list-inner span {
  color: var(--tl-ink-3) !important;
  font-size: 13px !important;
}

/* Stats (topics, posts counts) */
dd.topics, dd.posts, dd.views, dd.lastpost {
  color: var(--tl-ink-3) !important;
  font-size: 12px !important;
}
dd.lastpost span {
  color: var(--tl-ink-4) !important;
  font-size: 11px !important;
}

/* Links global */
a { color: var(--tl-accent); }
a:hover { color: var(--tl-accent-2); }

/* Buttons */
.button, .button1, .button2, input[type="submit"] {
  font-family: var(--tl-font-sans) !important;
  border-radius: var(--tl-radius) !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  transition: filter .15s, transform .05s !important;
}
input[type="submit"],
.button1 {
  background: var(--tl-accent) !important;
  color: white !important;
  border: none !important;
  padding: 8px 20px !important;
}
input[type="submit"]:hover,
.button1:hover {
  filter: brightness(1.06);
}
.button2 {
  background: var(--tl-panel) !important;
  color: var(--tl-ink) !important;
  border: 1px solid var(--tl-line) !important;
}

/* Post containers */
.post {
  background: var(--tl-panel) !important;
  border: 1px solid var(--tl-line) !important;
  border-radius: var(--tl-radius-l) !important;
  margin-bottom: 12px !important;
}
.post .inner { padding: 20px !important; }
.post .postbody .content {
  color: var(--tl-ink-2) !important;
  font-size: 14px !important;
  line-height: 1.7 !important;
}

/* Post author panel */
.post .postprofile {
  border-left: 1px solid var(--tl-line) !important;
  background: var(--tl-bg-2) !important;
}
.post .postprofile .profile-rank { color: var(--tl-ink-3) !important; }

/* Pagination */
.pagination a, .pagination strong {
  border-radius: var(--tl-radius-s) !important;
}
.pagination a {
  color: var(--tl-ink-2) !important;
  border: 1px solid var(--tl-line) !important;
}
.pagination .page-current {
  background: var(--tl-accent) !important;
  color: white !important;
  border: 1px solid var(--tl-accent) !important;
}

/* Quick-reply / Posting */
#postform .panel, .panel {
  background: var(--tl-panel) !important;
  border: 1px solid var(--tl-line) !important;
  border-radius: var(--tl-radius-l) !important;
}

/* Input fields */
input[type="text"], input[type="password"], input[type="email"],
input[type="url"], input[type="search"], textarea, select {
  background: var(--tl-bg-2) !important;
  border: 1px solid var(--tl-line) !important;
  border-radius: var(--tl-radius) !important;
  color: var(--tl-ink) !important;
  font-family: var(--tl-font-sans) !important;
  transition: border-color .15s !important;
}
input[type="text"]:focus, input[type="password"]:focus, input[type="email"]:focus,
input[type="url"]:focus, input[type="search"]:focus, textarea:focus, select:focus {
  border-color: var(--tl-accent) !important;
  outline: none !important;
}

/* Tab bar */
#tabs { border-bottom: 1px solid var(--tl-line) !important; }
#tabs li a {
  color: var(--tl-ink-3) !important;
  border-radius: var(--tl-radius-s) var(--tl-radius-s) 0 0 !important;
}
#tabs li.activetab a {
  background: var(--tl-panel) !important;
  color: var(--tl-accent) !important;
  border: 1px solid var(--tl-line) !important;
  border-bottom-color: transparent !important;
}

/* Login panel — hide inline quick-login on index */
.login-forums .login-box, .login_box {
  background: var(--tl-panel) !important;
  border: 1px solid var(--tl-line) !important;
  border-radius: var(--tl-radius-l) !important;
}
/* Hide quick-login box on forum index (use topbar login instead) */
#page-body .login-box,
.quick-login {
  display: none !important;
}
/* Hide board statistics bar on index */
.stat-block {
  display: none !important;
}

/* Code blocks */
.codebox code {
  font-family: "JetBrains Mono", ui-monospace, "SF Mono", Menlo, monospace !important;
  font-size: 13px !important;
  background: var(--tl-bg-3) !important;
  border-radius: var(--tl-radius) !important;
}

/* Quotes */
blockquote {
  background: var(--tl-bg-2) !important;
  border-left: 4px solid var(--tl-accent) !important;
  border-radius: 0 var(--tl-radius) var(--tl-radius) 0 !important;
  padding: 16px 20px !important;
}
blockquote cite {
  color: var(--tl-ink-3) !important;
  font-size: 12px !important;
}

/* Category header */
h2.forum-title {
  font-family: var(--tl-font-serif) !important;
  color: var(--tl-ink) !important;
}

/* Page body spacing */
.page-body { padding: 0 24px 40px; }

/* ─── Toolly Footer ─── */
.tl-footer {
  padding: 56px 24px; border-top: 1px solid var(--tl-line);
  background: var(--tl-bg-2);
}
.tl-footer-inner {
  max-width: 1200px; margin: 0 auto;
  display: flex; flex-direction: column; align-items: center; gap: 20px;
}
.tl-footer-brand {
  font-family: var(--tl-font-serif); font-size: 20px; font-weight: 600;
  letter-spacing: -0.015em; color: var(--tl-ink-2);
}
.tl-footer-tagline { font-size: 13px; color: var(--tl-ink-3); margin: -12px 0 0; }
.tl-footer-nav { display: flex; gap: 24px; }
.tl-footer-nav a {
  font-size: 13px; color: var(--tl-ink-3); text-decoration: none;
  transition: color .12s;
}
.tl-footer-nav a:hover { color: var(--tl-ink); }
.tl-footer-biz { text-align: center; margin-top: 4px; }
.tl-footer-biz p { font-size: 12px; color: var(--tl-ink-4); margin: 2px 0; }
.tl-footer-copy { font-size: 12px; color: var(--tl-ink-4); }

/* Hide prosilver copyright (keep phpBB credit in footer via override) */
.copyright { display: none !important; }

/* ─── Responsive ─── */
@media (max-width: 768px) {
  .page-body { padding: 0 12px 30px; }
  #wrap { padding-top: 56px; }
  .tl-footer { padding: 40px 16px; }
  .tl-footer-nav { flex-wrap: wrap; justify-content: center; gap: 16px; }
}