/* ===================================================================
   TCKSOFT.CO.UK — Legacy e107 Page Integration Layer
   Purpose: skins the classic e107 default markup (used by content.php,
   download.php, forum.php, autogallery.php, etc.) so those pages match
   the redesigned homepage, WITHOUT touching any HTML.
   Load order matters — this file must be linked in <head> AFTER:
     /style.css
     /e107_themes/exas_b07_09/style.css
     /e107_files/e107.css
     /e107_themes/exas_b07_09/nav_menu.css
   Add just before </head>:
   <link rel="stylesheet" href="/css/legacy-e107-integration.css">
   =================================================================== */

/* Re-declare tokens in case this file is loaded on a page where
   /style.css's :root block gets stripped by caching/minifying tools. */
:root{
  --navy:#0d1b2a;
  --navy2:#152a41;
  --accent:#ff6b3d;
  --accent2:#00c9a7;
  --paper:#f7f8fb;
  --ink:#1b2430;
  --muted:#6b7688;
  --border:#e4e7ee;
  --white:#ffffff;
  --radius:12px;
  --radius-lg:16px;
  --shadow-sm:0 1px 3px rgba(20,30,50,.04);
  --shadow-md:0 10px 26px rgba(20,30,50,.09);
  --shadow-header:0 2px 14px rgba(0,0,0,.15);
  --font-heading:'Space Grotesk', sans-serif;
  --font-body:'Inter', sans-serif;
  --max-width:1180px;
}

/* ---------- Base page reset (override e107 theme defaults) ---------- */
html, body{
  margin:0; padding:0;
  background:var(--paper) !important;
  color:var(--ink) !important;
  font-family:var(--font-body) !important;
  line-height:1.6;
}
#mainwrapper, .maintable, #topback, #top2back, #top3back{
  background:transparent !important;
  border:none !important;
  width:auto !important;
}
.maintable{max-width:var(--max-width); margin:0 auto !important;}

/* ---------- Top utility strip (#infoleft / #inforight) ---------- */
#top3back{
  background:var(--navy) !important;
  color:#cfd8e3 !important;
  font-size:.8rem;
  padding:6px 20px;
  display:flex; justify-content:space-between; flex-wrap:wrap; gap:8px;
}
#infoleft, #inforight{background:transparent !important; float:none !important;}
#top3back a{color:#cfd8e3 !important;}
#top3back a:hover{color:var(--accent2) !important;}

/* ---------- Header / nav (dropdownmenu, menuBar, menuButton) ---------- */
#topback{
  background:var(--navy2) !important;
  position:sticky; top:0; z-index:50;
  box-shadow:var(--shadow-header);
}
#dropdownmenu{background:transparent !important; padding:14px 20px;}
.menuBar{
  background:transparent !important;
  max-width:var(--max-width); margin:0 auto;
  display:flex !important; gap:6px; flex-wrap:wrap;
  white-space:normal !important;
}
a.menuButton{
  background:transparent !important;
  color:#dfe6f0 !important;
  font-weight:500 !important; font-size:.92rem !important;
  padding:9px 14px !important; border-radius:10px !important;
  border:none !important; transition:.2s;
  display:inline-block;
}
a.menuButton:hover{background:rgba(255,255,255,.08) !important; color:#fff !important;}

/* ---------- Two/three column body layout ---------- */
#maincontentnewsr{
  max-width:var(--max-width); margin:0 auto;
  padding:36px 20px 0;
  display:grid; grid-template-columns:260px 1fr; gap:26px; align-items:start;
}
#maincontent{grid-column:2; background:transparent !important;}
#sidebar{grid-column:1; background:transparent !important;}
@media (max-width:900px){
  #maincontentnewsr{grid-template-columns:1fr;}
  #maincontent, #sidebar{grid-column:1;}
}

/* ---------- Sidebar panels (captioncenter / menu3body) ---------- */
#sidebar .captioncenter,
#sidebar .caption{
  background:transparent !important; margin-top:20px;
}
#sidebar .captioncenter:first-of-type{margin-top:0;}
.captionpadder, .captionpadder1{
  font-family:var(--font-heading) !important;
  font-size:.9rem !important; text-transform:uppercase; letter-spacing:.06em;
  color:var(--navy2) !important; font-weight:700 !important;
  border-bottom:2px solid var(--accent2); padding:0 0 8px 0 !important;
  margin-bottom:0;
}
.menu3body{
  background:var(--white) !important;
  border:1px solid var(--border) !important;
  border-radius:0 0 var(--radius-lg) var(--radius-lg);
  box-shadow:var(--shadow-sm);
  margin-top:-1px;
}
.menu3body .padder{padding:16px !important; color:#454e5c;}
#sidebar .captioncenter{
  background:var(--white) !important;
  border:1px solid var(--border) !important;
  border-bottom:none !important;
  border-radius:var(--radius-lg) var(--radius-lg) 0 0;
  padding:14px 16px 0 !important;
}
#padderlinksleft{display:none;} /* empty legacy spacer */

/* ---------- Site tag / logo strip ---------- */
#maincontentlogo{margin-bottom:20px;}
#sitetag{
  font-family:var(--font-heading) !important;
  font-weight:700 !important; color:var(--navy2) !important;
  font-size:1.4rem !important; padding:8px 0;
}
#bannertop{display:none;}

/* ---------- Section caption ("Content Category : ...") ---------- */
#maincontentnewslcustom .caption,
#centerpaddernews .caption{
  background:transparent !important; border:none !important; margin-bottom:14px !important;
}
#centerpaddernews .captionpadder1{
  font-size:1.05rem !important; border-bottom:none !important; padding:0 !important;
  color:var(--navy2) !important;
}

/* ---------- Content / forum tables → cards ---------- */
table.fborder{
  width:100% !important;
  background:var(--white) !important;
  border:1px solid var(--border) !important;
  border-radius:var(--radius-lg) !important;
  border-collapse:separate !important;
  box-shadow:var(--shadow-sm);
  margin-bottom:20px !important;
  overflow:hidden;
  position:relative;
}
table.fborder:hover{box-shadow:var(--shadow-md);}
table.fborder tr td{border:none !important; padding:14px 20px !important;}

td.fcaption{
  background:transparent !important;
  font-family:var(--font-heading) !important;
}
td.fcaption a{
  font-size:1.12rem !important; font-weight:700 !important;
  color:var(--navy2) !important;
}
td.forumheader3{
  background:transparent !important;
  color:#454e5c !important; font-size:.95rem !important;
  border-top:1px dashed var(--border) !important;
}
td.forumheader3 img{width:15px; height:15px; vertical-align:middle; margin-right:4px;}
td.forumheader3 a{color:var(--muted) !important;}
td.forumheader3 a:hover{color:var(--accent) !important;}

/* ---------- Small text / render time / footer ---------- */
.smalltext{font-size:.85rem !important; color:var(--muted) !important;}

#footer{
  max-width:var(--max-width); margin:30px auto 0; padding:20px;
  border-top:1px solid var(--border);
}
#footer .smalltext{text-align:center !important;}
#footer a{color:var(--navy2) !important; font-weight:600;}
#footer a:hover{color:var(--accent) !important;}

/* ---------- Links, generic ---------- */
a{color:var(--navy2);}
a:hover{color:var(--accent);}
img{max-width:100%;}