/* ============================================================================
   GigaPeta skin for SMF 2.1.x  —  gigapeta.css
   ----------------------------------------------------------------------------
   CSS-only reskin. Maps the SMF 2.1 default theme onto GigaPeta design tokens
   (same palette/radii/fonts as the main site, new/css/modern.css).

   LOAD ORDER: this file MUST be loaded AFTER the default theme's css/index.css,
   so these rules win the cascade. See ops/forum-theme/README.md for how to
   wire it as an upgrade-safe child theme (do NOT edit Themes/default/*).

   Single light theme by design — the main site is light-only.
   First pass: colors verified against SMF 2.1.8 default index.css selectors;
   fine spacing to be confirmed on the live private preview (no local SMF here).
   ============================================================================ */

:root{
  --gp-accent:#2fa84f;      --gp-accent-dark:#1f8a3c;   --gp-accent-soft:#e7f6ec;
  --gp-accent-ring:rgba(47,168,79,.35);
  --gp-bg:#eef5f0;          --gp-surface:#fff;          --gp-surface-2:#f6faf7;
  --gp-text:#1b2620;        --gp-muted:#6a7b71;
  --gp-border:#e2ebe5;      --gp-border-strong:#cfe0d5;
  --gp-danger:#c0392b;      --gp-danger-soft:#fdecea;   --gp-danger-bd:#f3c9c2;
  --gp-radius:14px;         --gp-radius-sm:10px;        --gp-radius-xs:7px;
  --gp-shadow:0 1px 2px rgba(16,40,28,.05),0 2px 8px rgba(16,40,28,.05);
}

/* ---- base ---------------------------------------------------------------- */
body{
  background:var(--gp-bg);
  color:var(--gp-text);
  font-family:system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;
}
a, a:visited{ color:var(--gp-accent-dark); }
a:hover{ color:var(--gp-accent); }
hr{ background:var(--gp-border); box-shadow:none; }

/* main content frame */
#wrapper{
  background:var(--gp-surface);
  border:1px solid var(--gp-border);
  border-radius:var(--gp-radius);
  box-shadow:var(--gp-shadow);
}

/* ---- top bar / main menu (.dropmenu) ------------------------------------- */
.dropmenu > li > a, #top_info > li > a{
  color:var(--gp-text);
  font-weight:600;
  border-radius:var(--gp-radius-xs);
  text-shadow:none;
}
.dropmenu > li > a:hover{
  background:var(--gp-accent-soft);
  color:var(--gp-accent-dark);
  text-decoration:none;
  text-shadow:none;
}
/* active / open / focused menu item -> solid GigaPeta pill */
.dropmenu > li:hover > a, .dropmenu > li > a:focus,
.dropmenu > li.active > a, .dropmenu > li > a.active,
#top_info > li:hover > a, #top_info > li > a:focus, #top_info > li > a.open{
  background:var(--gp-accent);
  border:1px solid var(--gp-accent);
  color:#fff;
  box-shadow:none;
  text-shadow:none;
}
/* submenus */
.dropmenu ul{
  background:var(--gp-surface);
  border:1px solid var(--gp-border);
  border-radius:var(--gp-radius-sm);
  box-shadow:var(--gp-shadow);
}
.dropmenu ul a{ color:var(--gp-text); }
.dropmenu ul a:hover{ background:var(--gp-accent-soft); color:var(--gp-accent-dark); }

/* unread/new count bubbles */
.amt, .unread_count{ background:var(--gp-danger); color:#fff; }

/* ---- category bars (div.cat_bar) ----------------------------------------- */
div.cat_bar{
  background:var(--gp-accent);
  background:linear-gradient(180deg,#34b457,var(--gp-accent));
  border-bottom:1px solid var(--gp-accent-dark);
  border-radius:var(--gp-radius) var(--gp-radius) 0 0;
  box-shadow:none;
  text-shadow:none;
}
.cat_bar.collapsed, .cat_bar.cat_bar_round{ border-radius:var(--gp-radius); }
.cat_bar h3, .cat_bar h3 a, .cat_bar .desc, .cat_bar .desc a{ color:#fff; }
.cat_bar h3 a:hover, .cat_bar .desc a:hover{ color:#fff; text-decoration:underline; }

/* ---- title bars (replace the orange default accent) ---------------------- */
.title_bar{
  background:var(--gp-surface-2);
  color:var(--gp-text);
  border:1px solid var(--gp-border);
  border-top:2px solid var(--gp-accent);
  border-bottom:1px solid var(--gp-border);
  border-radius:var(--gp-radius-sm) var(--gp-radius-sm) 0 0;
}
.title_bar h3, .title_bar h4, .title_bar .titlebg{ color:var(--gp-text); }

/* ---- content rows / frames ----------------------------------------------- */
.windowbg{
  background:var(--gp-surface);
  color:var(--gp-text);
  border-color:var(--gp-border);
}
.roundframe{
  background:var(--gp-surface);
  border:1px solid var(--gp-border);
  border-radius:var(--gp-radius);
  box-shadow:var(--gp-shadow);
}
.bg, .approvebg{ background:var(--gp-surface-2); }

/* ---- buttons ------------------------------------------------------------- */
.button, .quickbuttons > li > a, .inline_mod_check, input[type=submit], button{
  background:var(--gp-accent);
  color:#fff;
  border:1px solid var(--gp-accent);
  border-radius:var(--gp-radius-xs);
  box-shadow:none;
  text-transform:none;
  font-weight:600;
}
.button:hover, .button:focus,
.quickbuttons > li:hover > a, .quickbuttons > li > a:focus,
input[type=submit]:hover, button:hover{
  background:var(--gp-accent-dark);
  color:#fff;
  border-color:var(--gp-accent-dark);
  box-shadow:none;
  text-decoration:none;
}
/* active/primary pager page */
.pagelinks .current, .pagelinks strong{ background:var(--gp-accent); color:#fff; border-radius:var(--gp-radius-xs); }

/* ---- form fields --------------------------------------------------------- */
input, select, textarea{
  border:1px solid var(--gp-border-strong);
  border-radius:var(--gp-radius-xs);
  background:var(--gp-surface-2);
  color:var(--gp-text);
}
input:focus, select:focus, textarea:focus{
  outline:none;
  border-color:var(--gp-accent);
  box-shadow:0 0 0 3px var(--gp-accent-ring);
  background:var(--gp-surface);
}

/* ---- board index columns ------------------------------------------------- */
.board_icon, .info, .board_stats, .lastpost{ color:var(--gp-muted); }
.boardindex_table .board_stats p{ border-left:1px solid var(--gp-border); }
.board_description{ color:var(--gp-muted); }
.children a{ color:var(--gp-accent-dark); font-weight:600; }

/* ---- posts / quotes ------------------------------------------------------ */
#forumposts .cat_bar{ /* topic subject bar on a message page */
  background:linear-gradient(180deg,#34b457,var(--gp-accent));
}
.poster, .postarea .poster{ color:var(--gp-text); }
.poster h4 a, .poster .name a{ color:var(--gp-accent-dark); font-weight:700; }
blockquote, .bbc_standard_quote, .bbc_alternate_quote{
  background:var(--gp-surface-2);
  border:1px solid var(--gp-border);
  border-left:3px solid var(--gp-accent);
  border-radius:0 var(--gp-radius-xs) var(--gp-radius-xs) 0;
  color:var(--gp-muted);
}
cite, .quoteheader, .codeheader{ color:var(--gp-accent-dark); }

/* ---- tables -------------------------------------------------------------- */
.table_grid, .table_grid td, .table_grid th{ border-color:var(--gp-border); }
.table_grid thead th, .generic_list thead th{ background:var(--gp-surface-2); color:var(--gp-text); }

/* ---- notices ------------------------------------------------------------- */
.infobox, .information{ background:var(--gp-accent-soft); border:1px solid var(--gp-border-strong); color:var(--gp-text); }
.errorbox, .noticebox.alert{ background:var(--gp-danger-soft); border:1px solid var(--gp-danger-bd); color:var(--gp-danger); }
.successbox{ background:var(--gp-accent-soft); border:1px solid var(--gp-border-strong); color:var(--gp-accent-dark); }

/* ---- footer -------------------------------------------------------------- */
#footer{ color:var(--gp-muted); }
#footer a{ color:var(--gp-accent-dark); }

/* ============================================================================
   Live-preview polish (pass 1) — selectors confirmed against the SMF 2.1.8
   default index.css after Codex wired the skin on the private preview. Fixes
   his feedback: the forum title stayed brown and some old gradients survived.
   Each rule mirrors the default's own selector, so load order (this file after
   index.css) decides the cascade. See ops/codex/CHANNEL.md 2026-11-03.
   ============================================================================ */

/* forum title link: default #a85400 brown -> GigaPeta accent (index.css 1157) */
h1.forumtitle a, h1.forumtitle a:visited{ color:var(--gp-accent-dark); text-shadow:none; }
h1.forumtitle a:hover{ color:var(--gp-accent); }
h1.forumtitle{
  font-family:system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;
}

/* the default paints a shared #e2e9f3->#fff gradient on the top bar, popups and
   section frames (index.css 3934-3951) — flatten it to GigaPeta surfaces */
#top_section{
  background:var(--gp-surface);
  background-image:none;
  border-bottom:1px solid var(--gp-border);
  box-shadow:var(--gp-shadow);
}
#inner_section, .popup_window, .popup_container, .popup_content,
.navigate_section ul, .up_contain, .post_options ul{
  background:var(--gp-surface);
  background-image:none;
}
/* quickbuttons <li> carried the same gradient behind the links */
.quickbuttons > li, .quickbuttons li ul{ background:transparent; background-image:none; }

/* active top-menu pill: default orange gradient (index.css 763) + orange hover (779) */
.dropmenu a.active{
  background:var(--gp-accent);
  background-image:none;
  border-color:var(--gp-accent);
  color:#fff;
  text-shadow:none;
}
.dropmenu li a.active:hover, .dropmenu li:hover a.active{
  background:var(--gp-accent-dark);
  background-image:none;
  border-color:var(--gp-accent-dark);
  color:#fff;
  box-shadow:none;
  text-shadow:none;
}

/* active .button: default blue #557ea0 (index.css 1041/1048) */
.button.active, .button.active:hover, .button.active:focus{
  background:var(--gp-accent);
  background-image:none;
  border:1px solid var(--gp-accent);
  color:#fff;
  box-shadow:none;
  text-shadow:none;
}

/* "new posts" badge: default orange->brown gradient (index.css 237) */
.new_posts, a.new_posts{ background:var(--gp-accent); background-image:none; opacity:1; }

/* ============================================================================
   Live-render polish (pass 2) — verified in-browser against the live forum
   (forum.gigapeta.info) after Codex's 2026-11-03 cutover, which confirmed the
   skin loads as a separate gigapeta.css AFTER the minified default.
   Board- and topic-subject links kept SMF's default brown #a85400: the default
   paints them via `.info .subject` (specificity 0,2,0), which outranks the
   generic `a, a:visited` rule above. Mirror that exact selector so load order
   decides and the accent wins. Everything else on index/board/topic already
   renders green (last-post links, poster names, buttons, pager, in-post links).
   ============================================================================ */
.info .subject, .info .subject:visited{ color:var(--gp-accent-dark); }
.info .subject:hover{ color:var(--gp-accent); }

/* Hide the stock "simplemachines forum" logo (img#smflogo, Themes/default/
   images/smflogo.svg) from the header — the GigaPeta forum title stands on its
   own. The required "Powered by SMF" copyright stays in the footer, untouched;
   only the decorative header logo image is hidden. */
#smflogo{ display:none; }

/* ============================================================================
   Live-render polish (pass 3) — verified in-browser against the live forum
   (board / login / signup / search). Two default leftovers:
   ============================================================================ */

/* Up/Down ("Вверх"/"Вниз") and page-section buttons: default `.pagesection
   .button` (specificity 0,2,0) sets color #334466, outranking the generic
   `.button{color:#fff}` above -> blue text on the green button. Restore white. */
.pagesection .button, .pagesection .button:visited, .pagesection .button:hover{ color:#fff; }

/* Top login/register button active state: the default paints
   `.dropmenu a.active, #top_info a.active` with an orange gradient. Pass 1
   neutralized only the `.dropmenu` half; the `#top_info` login/signup pill kept
   the orange gradient on its active page. Mirror the `#top_info` half to accent. */
#top_info a.active{
  background:var(--gp-accent);
  background-image:none;
  border-color:var(--gp-accent);
  color:#fff;
  text-shadow:none;
}
