:root {
  --bg-page: #f5f3ea;
  --bg-card: #fff;
  --bg-card-hover: #f8f8f8;
  --bg-elevated: #f7f5e6;
  --bg-dark: #16213e;
  --bg-topbar: #145578;
  --bg-input: #fff;
  --bg-highlight: #f0f7ff;
  --bg-sidebar: #fff;
  --bg-chatbox: #fff;
  --bg-topfront: #f7f5e6;
  --bg-accordion: #fff;
  --bg-progbox: #fff;
  --bg-nomeprog: #fff;
  --bg-adsinfo: #f8f8f8;
  --bg-sadinfo: #f8f8f8;
  --bg-code: #1a1a2e;
  --bg-code-btn: #d4a017;
  --bg-telelink: #4fa2cf;
  --bg-paginator: #ddd;
  --bg-button-default: #005;
  --bg-dm-toggle: #145578;

  --border-subtle: #e6e6fa;
  --border-default: #ccc;
  --border-accent: #ed5821;
  --border-side: #afb6bc;
  --border-card: #ccc;
  --border-gold: #d4a017;
  --border-hover: #0e3f5c;
  --border-paginator: #ccc;

  --text-primary: #145578;
  --text-muted: #888;
  --text-light: #fff;
  --text-inverse: #555;
  --text-link: #145578;
  --text-link-hover: #0e3f5c;
  --text-gold: #d4a017;
  --text-statbar: #888;
  --text-statbar-label: #fff;
  --text-label: #ed5821;
  --text-heading: #145578;
  --text-code-bg: #1a1a2e;
  --text-code: #fff;

  --accent-primary: #145578;
  --accent-primary-hover: #0e3f5c;
  --accent-orange: #ed5821;
  --accent-gold: #d4a017;
  --accent-gold-hover: #b8860b;
  --accent-new-badge: #e74c3c;

  --status-paying: #00d200;
  --status-notpaying: #ae0000;
  --status-problem: #ff5809;
  --status-waiting: #808040;

  --shadow-card: rgba(0,0,0,.15);
  --shadow-soft: rgba(0,0,0,.3);
  --outline-focus: #145578;
}

.dark-mode {
  --bg-page: #0d0d1a;
  --bg-card: #151528;
  --bg-card-hover: #1e1e38;
  --bg-elevated: #151528;
  --bg-dark: #151528;
  --bg-topbar: #111122;
  --bg-input: #151528;
  --bg-highlight: #1e1e38;
  --bg-sidebar: transparent;
  --bg-chatbox: #151528;
  --bg-topfront: #151528;
  --bg-accordion: #151528;
  --bg-progbox: transparent;
  --bg-nomeprog: #151528;
  --bg-adsinfo: #151528;
  --bg-sadinfo: #151528;
  --bg-code: #0a0a14;
  --bg-telelink: transparent;
  --bg-paginator: #151528;
  --bg-button-default: #1e1e38;
  --bg-dm-toggle: #d4a017;

  --border-subtle: #2a2a48;
  --border-default: #2a2a48;
  --border-accent: #2a2a48;
  --border-side: #2a2a48;
  --border-card: #2a2a48;
  --border-hover: #3a3a58;
  --border-paginator: #2a2a48;

  --text-primary: #e8e6e3;
  --text-muted: #6b6b88;
  --text-light: #e8e6e3;
  --text-inverse: #e8e6e3;
  --text-link: #74b9ff;
  --text-link-hover: #a0d0ff;
  --text-gold: #d4a017;
  --text-statbar: #9e9eb8;
  --text-statbar-label: #e8e6e3;
  --text-label: #e8e6e3;
  --text-heading: #e8e6e3;
  --text-code-bg: #0a0a14;
  --text-code: #e8e6e3;

  --accent-new-badge: #c0392b;

  --shadow-card: rgba(0,0,0,.3);
  --shadow-soft: rgba(0,0,0,.5);
}

body { background: var(--bg-page); }
a, body, div, form, input, p, table { color: var(--text-primary); }
a { color: var(--text-link); }
a:hover { color: var(--text-link-hover); }

:focus-visible { outline: 2px solid var(--outline-focus); outline-offset: 2px; }
a:focus-visible, button:focus-visible, input:focus-visible, select:focus-visible, textarea:focus-visible { outline: 2px solid var(--outline-focus); outline-offset: 2px; }
.dark-mode :focus-visible { outline-color: #74b9ff; }

.statbar { text-align: center; padding: 10px; background: var(--bg-dark); border-radius: 4px; margin-bottom: 15px; }
.statbar span { color: var(--text-statbar); }
.statbar span b { color: var(--text-statbar-label); }
.statbar .label-total { color: var(--text-muted); }

.gold-card { text-decoration: none; display: block; background: var(--bg-code); border-radius: 8px; border: 2px solid var(--border-gold); overflow: hidden; }
.gold-card-img-wrap { position: relative; width: 100%; aspect-ratio: 16/9; overflow: hidden; background: var(--bg-code); }
.gold-card-body { padding: 10px 12px; text-align: center; }
.gold-card-title { color: var(--text-gold); font-weight: 700; font-size: 15px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.gold-card-meta { margin-top: 4px; display: flex; align-items: center; justify-content: center; gap: 8px; }
.gold-card-rating { color: var(--text-muted); font-size: 11px; }

#page404 { text-align: center; padding: 80px 20px; }
#page404 h1 { color: var(--text-gold); font-size: 48px; margin-bottom: 20px; }
#page404 h2 { color: var(--text-muted); font-size: 24px; margin-bottom: 10px; }
#page404 p { color: var(--text-muted); margin-bottom: 20px; }
#page404 a { color: var(--text-gold); font-size: 16px; }
#page404 input[type="text"] { padding: 8px 12px; font-size: 14px; border: 1px solid var(--border-default); background: var(--bg-input); color: var(--text-primary); border-radius: 4px; width: 250px; }
#page404 button { padding: 8px 16px; font-size: 14px; background: var(--accent-gold); color: var(--text-light); border: none; border-radius: 4px; cursor: pointer; }
#page404 form { margin-bottom: 24px; }

div.topbackbig { background: var(--bg-topbar); }
div.topfront { background-color: var(--bg-topfront); border-color: var(--accent-orange); }
div.center { background-color: var(--bg-card); border-color: var(--accent-orange); }
div.leftside, div.rightside { border-color: var(--border-side); background: var(--bg-sidebar); }
input.searchinput { border-color: var(--accent-orange); color: var(--text-inverse); }
.chatbox { background: var(--bg-chatbox); }
.sadinfo, .adsinfo { background: var(--bg-sadinfo); border-color: var(--border-card); }
.sadinfo .sticky, .adsinfo .sticky { background: var(--bg-card); color: var(--text-primary); }
.telelink { background-color: var(--bg-telelink); }
.telelink a { color: var(--text-light); }

.dark-mode .telelink a { color: var(--text-link); }
.dark-mode .telelink { background: transparent; }

.dark-mode a { color: var(--text-link); }
.dark-mode a:hover { color: var(--text-link-hover); }
.dark-mode p, .dark-mode b, .dark-mode strong { color: var(--text-primary); }
.dark-mode h1, .dark-mode h2, .dark-mode h3, .dark-mode h4 { color: var(--text-heading); }
.dark-mode small, .dark-mode .fontsmall { color: var(--text-muted); }
.dark-mode hr { border-color: var(--border-default); }
.dark-mode ol, .dark-mode li { color: var(--text-primary); }
.dark-mode ol a, .dark-mode li a { color: var(--text-link); }
.dark-mode ol a:hover, .dark-mode li a:hover { color: var(--text-link-hover); }
.dark-mode .alert { color: var(--text-muted); }
.dark-mode .centered2 p, .dark-mode .centered2 a { color: var(--text-muted); }

.dark-mode .topfront { background: var(--bg-topfront); border-color: var(--border-default); }
.dark-mode .topback, .dark-mode .topbackbig { background: var(--bg-topbar); }
.dark-mode .leftside, .dark-mode .rightside { background: var(--bg-sidebar); }
.dark-mode .center { background: transparent; }
.dark-mode .slide_body { background: transparent; }
.dark-mode .sadinfo, .dark-mode .adsinfo { background: var(--bg-sadinfo); border-color: var(--border-default); }
.dark-mode .sadinfo .sticky, .dark-mode .adsinfo .sticky { background: var(--bg-elevated); color: var(--text-primary); }

.dark-mode .statbar { background: var(--bg-dark) !important; }
.dark-mode .statbar span { color: var(--text-statbar) !important; }
.dark-mode .statbar span b { color: var(--text-statbar-label) !important; }

.dark-mode input.searchinput { background: var(--bg-input); color: var(--text-primary); border-color: var(--border-default); }
.dark-mode input.searchinput::placeholder { color: var(--text-muted); }

.dark-mode .menu, .dark-mode .menu a { color: var(--text-link); }
.dark-mode .menu a:hover { color: var(--text-link-hover); }
.dark-mode #nav-toggle { color: var(--text-link); }

.dark-mode .end { background: var(--bg-topbar); border-color: var(--border-default); }

.dark-mode .mline { background: var(--bg-card); border-color: var(--border-default); }
.dark-mode .mline:hover { background: var(--bg-card-hover); }
.dark-mode .mline .programname { color: var(--text-link); }
.dark-mode .mline .dettagli .date { color: var(--text-muted); }

.dark-mode .sort-options span { color: var(--text-muted); }
.dark-mode .sort-options a { background: var(--bg-card); border-color: var(--border-default); color: var(--text-link); }
.dark-mode .sort-options a:hover { background: var(--bg-card-hover); }
.dark-mode .sort-options a.active { background: var(--accent-primary); border-color: var(--accent-primary); color: var(--text-light); }

.dark-mode .gold-card { background: var(--bg-card); border-color: var(--border-gold); }
.dark-mode .gold-card div[style*="background:#0f0f1a"] { background: var(--bg-code) !important; }

.dark-mode .new-badge { background: var(--accent-new-badge); }

.dark-mode #hyip-box { background: var(--bg-card); border-color: var(--border-default); }
.dark-mode .hyip-item { border-color: var(--border-default); }
.dark-mode .hyip-item:hover, .dark-mode .hyip-item.active { background: var(--bg-card-hover); }
.dark-mode .hyip-domain { color: var(--text-link); }

.dark-mode .telelink a { color: var(--text-link); }
.dark-mode .telelink a:hover { color: var(--text-link-hover); }

.dark-mode .chatbox { background: var(--bg-chatbox); border-color: var(--border-default); }

.dark-mode #bottomnav ul.bottomnav li a { color: var(--text-link); }
.dark-mode #bottomnav ul.bottomnav li a:hover { color: var(--text-link-hover); }

.dark-mode #dm-label { color: var(--text-primary); }

.dark-mode a.ubm-banner:empty { background: var(--bg-topbar); border-color: var(--border-default); }
.dark-mode a.ubm-banner:empty::after { color: var(--text-muted); }

.dark-mode .screenshot-wrap img { border-color: var(--border-default); }
.dark-mode .gold-screenshot img { border-color: var(--border-gold); }

.dark-mode td, .dark-mode th { border-color: var(--border-default); }
.dark-mode th { background: var(--bg-topbar); color: var(--text-primary); }
.dark-mode tr:hover td { background: var(--bg-card-hover); }
.dark-mode td a { color: var(--text-link); }

.dark-mode .paginator a { background: var(--bg-paginator); border-color: var(--border-paginator); color: var(--text-link); }
.dark-mode .paginator a:hover { background: var(--bg-card-hover); }
.dark-mode .paginator strong { background: var(--accent-primary); border-color: var(--accent-primary); }

.dark-mode #page404 h2 { color: var(--text-heading); }
.dark-mode #page404 p { color: var(--text-muted); }
.dark-mode #page404 a { color: var(--text-gold); }

.dark-mode ::-webkit-scrollbar { width: 10px; }
.dark-mode ::-webkit-scrollbar-track { background: var(--bg-topbar); }
.dark-mode ::-webkit-scrollbar-thumb { background: var(--border-default); border-radius: 5px; }
.dark-mode ::-webkit-scrollbar-thumb:hover { background: var(--border-hover); }

.dark-mode .goldrot { background: transparent; }

.dark-mode .orange textarea { background: var(--bg-input); color: var(--text-primary); border-color: var(--border-default); }

.dark-mode .vote-count { color: var(--text-muted); }

.dark-mode .stickyg { background: var(--bg-card-hover); color: var(--text-primary); }

.dark-mode .detailcontainer .sadinfo { background: var(--bg-sadinfo); }

#dark-toggle { background: var(--bg-dm-toggle); }
.dark-mode #dark-toggle { background: var(--bg-dm-toggle); color: var(--bg-topbar); border-color: var(--accent-gold-hover); }
.dark-mode #dark-toggle:hover { background: var(--accent-gold-hover); }

@media(max-width:768px) {
  .dark-mode .menu { color: var(--text-link); }
}
