/* ==========================================================================
   MiningCrypto.Online — dark theme
   Active when <html data-theme="dark"> (set by js/theme.js).
   Only colours change here; layout stays in hosting.css / pool.css.
   Accents keep the Flathost palette: green #2cc76a · blue #2db6d8 · red #f45c57
   ========================================================================== */

html[data-theme="dark"] {
  --bg: #12181d;          /* page */
  --surface: #1a2229;     /* cards, tiles, inputs */
  --surface-2: #202b34;   /* card headers, table heads (Flathost navy) */
  --line: #2b3741;        /* borders */
  --text: #c9d1d6;        /* body text */
  --text-strong: #f1f4f5; /* headings, figures */
  --muted: #8794a0;       /* labels, secondary text */
  color-scheme: dark;
}

html[data-theme="dark"] body { background: var(--bg); color: var(--text); }
html[data-theme="dark"] h1,
html[data-theme="dark"] h2,
html[data-theme="dark"] h3,
html[data-theme="dark"] h4,
html[data-theme="dark"] h5 { color: var(--text-strong); }
html[data-theme="dark"] p,
html[data-theme="dark"] address { color: var(--muted); }
html[data-theme="dark"] .PageHead h3 { color: var(--muted); }
html[data-theme="dark"] .lead { color: var(--text); }
html[data-theme="dark"] a { color: #3ddc7f; }
html[data-theme="dark"] a:hover,
html[data-theme="dark"] a:focus { color: #6be89f; }
html[data-theme="dark"] .text-muted { color: var(--muted); }
html[data-theme="dark"] .text-success { color: #3ddc7f; }
html[data-theme="dark"] .text-warning { color: #f0b34a; }
html[data-theme="dark"] .text-danger { color: #ff7a75; }
html[data-theme="dark"] hr { border-color: var(--line); }

/* Buttons keep white text on the brand colours. */
html[data-theme="dark"] .btn-success,
html[data-theme="dark"] .btn-primary,
html[data-theme="dark"] .btn-danger,
html[data-theme="dark"] .navbar .nav > li > a,
html[data-theme="dark"] .footerlinks ul li a,
html[data-theme="dark"] .brand-text { color: #fff; }
html[data-theme="dark"] .navbar .nav > .active > a { color: #2cc76a; }

/* Header, hero and footer are already dark; just deepen them a touch. */
html[data-theme="dark"] .navbar { background: #161d23; }
html[data-theme="dark"] .pool-strip { background: #161d23; border-bottom: 1px solid var(--line); }
html[data-theme="dark"] .jumbotron.masthead,
html[data-theme="dark"] .footer { background-color: #161d23; }
html[data-theme="dark"] .footer h1,
html[data-theme="dark"] .footer p,
html[data-theme="dark"] .footerlinks ul li { color: var(--text); }
html[data-theme="dark"] .footerlinks p { color: #68737b; }
html[data-theme="dark"] .domain { background: #1a2229; border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); }

/* Feature blocks */
html[data-theme="dark"] .img-thumbnail { background: transparent; }

/* Coin cards */
html[data-theme="dark"] .PlanPricing .planName { background: var(--surface-2); }
html[data-theme="dark"] .PlanPricing .planName p { color: var(--muted); }
html[data-theme="dark"] .PlanPricing .planFeatures { background: var(--surface); }
html[data-theme="dark"] .coin-grid .planFeatures ul li { border-bottom-color: var(--line); }
html[data-theme="dark"] .coin-grid .planFeatures .k { color: var(--muted); }
html[data-theme="dark"] .coin-grid .planFeatures .v { color: var(--text-strong); }
html[data-theme="dark"] .price.coin-badge img { background: #fff; }

/* Filter pills + plain buttons */
html[data-theme="dark"] .btn-default {
  background: var(--surface);
  border-color: var(--line);
  color: var(--text);
  text-shadow: none;
}
html[data-theme="dark"] .btn-default:hover,
html[data-theme="dark"] .btn-default:focus { background: var(--surface-2); border-color: var(--line); color: #fff; }
html[data-theme="dark"] .coin-filter .btn { color: var(--muted); }
html[data-theme="dark"] .coin-filter .btn.active,
html[data-theme="dark"] .coin-filter .btn.active:hover { background: #2cc76a; border-color: #25ad5b; color: #fff; }
html[data-theme="dark"] .coin-filter .btn .badge { background: rgba(255, 255, 255, 0.12); color: inherit; }

/* Stat tiles */
html[data-theme="dark"] .stat-tile { background: var(--surface); }
html[data-theme="dark"] .stat-tile span,
html[data-theme="dark"] .stat-tile em { color: var(--muted); }
html[data-theme="dark"] .stat-tile strong { color: var(--text-strong); }
html[data-theme="dark"] .stat-tile strong.text-success { color: #3ddc7f; }
html[data-theme="dark"] .stat-tile strong.text-warning { color: #f0b34a; }
html[data-theme="dark"] .stat-tile strong.text-danger { color: #ff7a75; }

/* Tables */
html[data-theme="dark"] .table { color: var(--text); }
html[data-theme="dark"] .table-bordered,
html[data-theme="dark"] .table-bordered > thead > tr > th,
html[data-theme="dark"] .table-bordered > tbody > tr > td { border-color: var(--line); }
html[data-theme="dark"] .table-expanded > thead > tr > th { background: var(--surface-2); border-color: var(--line); color: #fff; }
html[data-theme="dark"] .table-expanded > tbody > tr > td { background: var(--surface); color: var(--text); }
html[data-theme="dark"] .table-expanded > tbody > tr:nth-child(even) > td { background: #1e2830; }
html[data-theme="dark"] .table-expanded > tbody > tr > td strong { color: var(--text-strong); }
html[data-theme="dark"] .table-expanded > tbody > tr > td.text-muted { color: var(--muted); }
html[data-theme="dark"] .table-expanded > tbody > tr > td.text-success { color: #3ddc7f; }
html[data-theme="dark"] .table-expanded > tbody > tr > td.text-warning { color: #f0b34a; }
html[data-theme="dark"] .table-expanded > tbody > tr > td.text-danger { color: #ff7a75; }
html[data-theme="dark"] .table-responsive { border-color: var(--line); }
html[data-theme="dark"] .progress { background: var(--line); }

/* Tabs */
html[data-theme="dark"] .nav-tabs { border-bottom-color: var(--line); }
html[data-theme="dark"] .pool-tabs > li > a { color: var(--muted); }
html[data-theme="dark"] .pool-tabs > li > a:hover { background: var(--surface); border-color: var(--line) var(--line) transparent; }
html[data-theme="dark"] .pool-tabs > li.active > a,
html[data-theme="dark"] .pool-tabs > li.active > a:hover,
html[data-theme="dark"] .pool-tabs > li.active > a:focus {
  background: var(--bg);
  border-color: #2cc76a var(--line) transparent;
  color: var(--text-strong);
}
html[data-theme="dark"] .pool-tabs .badge { background: #3a4854; color: #fff; }

/* Forms */
html[data-theme="dark"] .form-control {
  background: var(--surface);
  border-color: var(--line);
  color: var(--text-strong);
  box-shadow: none;
}
html[data-theme="dark"] .form-control:focus { border-color: #2cc76a; box-shadow: 0 0 0 2px rgba(44, 199, 106, 0.25); }
html[data-theme="dark"] .form-control::placeholder { color: #6f7c88; }
html[data-theme="dark"] select.form-control option { background: var(--surface); color: var(--text-strong); }
html[data-theme="dark"] .gen-form label { color: var(--muted); }
html[data-theme="dark"] .gen-output { background: #0c1115; border: 1px solid var(--line); }
html[data-theme="dark"] .domain .lookup-coin select { background: var(--surface-2); color: #fff; }
html[data-theme="dark"] #hosts-list li { color: var(--muted); }
html[data-theme="dark"] #hosts-list li strong { color: var(--text-strong); }

/* Dashboard */
html[data-theme="dark"] .dash-address { background: var(--surface); color: var(--text-strong); }
html[data-theme="dark"] .payout-progress p { color: var(--text-strong); }
html[data-theme="dark"] .payout-progress .progress { background: var(--surface); }

/* Dialog */
html[data-theme="dark"] .modal-content { background: var(--surface); border-color: var(--line); }
html[data-theme="dark"] .modal-header { border-bottom-color: var(--line); }
html[data-theme="dark"] .modal-content .form-control { background: var(--bg); }
html[data-theme="dark"] .close { color: #fff; text-shadow: none; opacity: 0.6; }

/* Alerts */
html[data-theme="dark"] .alert-info { background: #14303a; border-color: #1f4a59; color: #a9def0; }
html[data-theme="dark"] .alert-warning { background: #3a2f14; border-color: #5a4a1f; color: #f3d590; }
html[data-theme="dark"] .alert-danger { background: #3a1b1a; border-color: #5c2a28; color: #ffb3b0; }
html[data-theme="dark"] .alert a { color: inherit; text-decoration: underline; }