/* ==========================================================================
   ZRXOA shared theme
   Replicates the look & feel of the current zrxoa.org (XenForo) forum:
   light-gray page, white content "cards", grass-green banner & links,
   purple accents, clean system sans-serif type.
   Applied across the legacy static pages. Uses !important in places to win
   over the legacy inline/presentational color attributes baked into the HTML.
   ========================================================================== */

:root {
  --zrx-green:        #2f9e2e;  /* primary links / forum titles            */
  --zrx-green-dark:   #1d6b1d;  /* link hover / dark accents               */
  --zrx-green-bright: #46b32b;  /* primary buttons                         */
  --zrx-banner-top:   #41b026;  /* banner gradient (top)                   */
  --zrx-banner-bot:   #2f8b1d;  /* banner gradient (bottom)                */
  --zrx-topbar:       #15601c;  /* dark forest-green top strip             */
  --zrx-purple:       #8e3cc4;  /* secondary accent (buttons / icons)      */
  --zrx-bg:           #e7e9ec;  /* page background                         */
  --zrx-card:         #ffffff;  /* content card background                 */
  --zrx-border:       #d6d8db;  /* card / table borders                    */
  --zrx-text:         #2b2b2b;  /* body text                               */
  --zrx-muted:        #7c7f83;  /* meta text (dates, counts, footer)       */
  --zrx-sans: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto,
              Helvetica, Arial, sans-serif;
}

/* ---- page shell -------------------------------------------------------- */
body {
  background: var(--zrx-bg) !important;
  color: var(--zrx-text) !important;
  font-family: var(--zrx-sans) !important;
  font-size: 15px;
  line-height: 1.5;
  margin: 0 !important;
  padding: 16px;
}

p, td, th, li, span, div, center {
  font-family: var(--zrx-sans);
}
p, td, li {
  color: var(--zrx-text);
  font-size: 14px;
  line-height: 1.5;
  font-weight: 400;
}

/* ---- links (forum green) ---------------------------------------------- */
a {
  color: var(--zrx-green) !important;
  text-decoration: none;
  font-weight: 600;
}
a:hover {
  color: var(--zrx-green-dark) !important;
  text-decoration: underline;
}

/* ---- headings ---------------------------------------------------------- */
h1, h2, h3, h4, h5, h6 {
  font-family: var(--zrx-sans);
  color: var(--zrx-text);
  font-weight: 700;
  font-style: normal !important;
  line-height: 1.25;
}
h1 { font-size: 28px; }
h2 { font-size: 22px; }
h3 { font-size: 18px; color: var(--zrx-green); }
h4 { font-size: 16px; color: var(--zrx-green); }

/* ---- banner (legacy #table1 template) ---------------------------------- */
#table1 {
  background: linear-gradient(180deg, var(--zrx-banner-top), var(--zrx-banner-bot)) !important;
  border: none !important;
  border-top: 5px solid var(--zrx-topbar) !important;
  border-radius: 10px;
  box-shadow: 0 1px 3px rgba(0, 0, 0, .18);
  margin-bottom: 16px;
}
#table1 td { color: #fff; border: none !important; }
#table1 .hdr,
#table1 h1 { color: #fff !important; font-style: italic; }
#table1 h2 {
  color: rgba(255, 255, 255, .93) !important;
  font-size: 16px;
  font-weight: 600;
}

/* banner navigation links */
a.hdlk {
  color: #fff !important;
  font-weight: 700;
  font-size: 15px;
}
a.hdlk:hover { color: #eaffea !important; text-decoration: underline; }
a.dir { color: #fff !important; }
a.dir:hover { color: #eaffea !important; }

/* ---- content tables rendered as white "cards" -------------------------- */
table[border]:not([border="0"]):not(#table1) {
  background: var(--zrx-card) !important;
  border: 1px solid var(--zrx-border) !important;
  border-collapse: separate;
  border-radius: 8px;
  box-shadow: 0 1px 2px rgba(0, 0, 0, .08);
}
table[border]:not([border="0"]):not(#table1) td,
table[border]:not([border="0"]):not(#table1) th {
  border-color: var(--zrx-border) !important;
}

/* ---- misc -------------------------------------------------------------- */
p.foot, .foot {
  color: var(--zrx-muted) !important;
  font-size: 12px;
  font-weight: 400;
}
hr {
  border: none;
  border-top: 1px solid var(--zrx-border);
  height: 0;
}
/* keep large photos from forcing horizontal scroll, without overriding the
   width/height attributes the legacy fixed-layout (and broken-image) pages
   rely on */
img { max-width: 100%; }

/* button-ish links (e.g. anything the legacy pages render as a control) */
.button, input[type="submit"], input[type="button"], button {
  background: var(--zrx-green-bright);
  color: #fff !important;
  border: none;
  border-radius: 6px;
  padding: 8px 14px;
  font-weight: 700;
  font-family: var(--zrx-sans);
  cursor: pointer;
}