﻿/* =============================================================================
   Theme. Dark is the DEFAULT. Light = the normal Bootstrap look (no overrides needed).
   <html data-theme="dark|light"> is set by a tiny inline script in the layout <head>
   (before first paint, so there is no light flash) and toggled from the navbar.
   Plain CSS on purpose (not compiled from .less).
   ========================================================================== */

[data-theme="dark"] {
  color-scheme: dark; /* dark native scrollbars, form controls, etc. */

  --bg: #16181a;
  --surface: #202326;
  --surface-2: #2a2e32;
  --border: #3a3f45;
  --text: #dfe2e5;
  --muted: #9aa1a8;
  --link: #6cb2eb;
  --link-hover: #9ccbf3;
  --hover-bg: #2a2e32;
}

[data-theme="dark"] body { background-color: var(--bg); color: var(--text); }
[data-theme="dark"] a { color: var(--link); }
[data-theme="dark"] a:hover, [data-theme="dark"] a:focus { color: var(--link-hover); }
[data-theme="dark"] hr { border-top-color: var(--border); }
[data-theme="dark"] .text-muted, [data-theme="dark"] small, [data-theme="dark"] .help-block { color: var(--muted); }
[data-theme="dark"] .text-primary { color: var(--link); }
[data-theme="dark"] .text-danger { color: #ff8a80; }
[data-theme="dark"] .text-success { color: #7bd88f; }
[data-theme="dark"] .text-warning { color: #f0c36d; }

/* Navbar (inverse is already dark; just blend it in) */
[data-theme="dark"] .navbar-inverse { background-color: #101214; border-color: var(--border); }

/* Forms */
[data-theme="dark"] .form-control { background-color: var(--surface); color: var(--text); border-color: var(--border); box-shadow: none; }
[data-theme="dark"] .form-control:focus { border-color: #4a90c8; box-shadow: 0 0 0 2px rgba(74, 144, 200, .35); }
[data-theme="dark"] .form-control::placeholder { color: var(--muted); }
[data-theme="dark"] .form-control[disabled], [data-theme="dark"] .form-control[readonly] { background-color: var(--surface-2); }
[data-theme="dark"] .input-group-addon { background-color: var(--surface-2); color: var(--text); border-color: var(--border); }
[data-theme="dark"] label { color: var(--text); }

/* Buttons */
[data-theme="dark"] .btn-default { background-color: var(--surface-2); color: var(--text); border-color: var(--border); }
[data-theme="dark"] .btn-default:hover, [data-theme="dark"] .btn-default:focus, [data-theme="dark"] .btn-default:active { background-color: #363b40; color: #fff; border-color: #4a5058; }
[data-theme="dark"] .btn[disabled], [data-theme="dark"] .btn.disabled { opacity: .45; }

/* Tables / lists / panels */
[data-theme="dark"] .table > thead > tr > th,
[data-theme="dark"] .table > tbody > tr > th,
[data-theme="dark"] .table > tbody > tr > td { border-color: var(--border); }
[data-theme="dark"] .table-striped > tbody > tr:nth-of-type(odd) { background-color: var(--surface); }
[data-theme="dark"] .table-hover > tbody > tr:hover { background-color: var(--surface-2); }
[data-theme="dark"] .well, [data-theme="dark"] .panel, [data-theme="dark"] .list-group-item { background-color: var(--surface); border-color: var(--border); color: var(--text); }
[data-theme="dark"] .dropdown-menu { background-color: var(--surface); border-color: var(--border); }
[data-theme="dark"] .dropdown-menu > li > a { color: var(--text); }
[data-theme="dark"] .dropdown-menu > li > a:hover { background-color: var(--surface-2); color: #fff; }

/* Progress */
[data-theme="dark"] .progress { background-color: var(--surface-2); box-shadow: none; }

/* Modals (bootbox) */
[data-theme="dark"] .modal-content { background-color: var(--surface); color: var(--text); border-color: var(--border); }
[data-theme="dark"] .modal-header, [data-theme="dark"] .modal-footer { border-color: var(--border); }
[data-theme="dark"] .close { color: var(--text); text-shadow: none; opacity: .7; }
[data-theme="dark"] .close:hover { color: #fff; opacity: 1; }

/* Alerts */
[data-theme="dark"] .alert-danger  { background-color: #3a2225; border-color: #6b3036; color: #f5b5b0; }
[data-theme="dark"] .alert-warning { background-color: #3a3220; border-color: #6b5a2a; color: #f0d58c; }
[data-theme="dark"] .alert-success { background-color: #1f3326; border-color: #2f5a3a; color: #a5e0b3; }
[data-theme="dark"] .alert-info    { background-color: #1f3140; border-color: #2f5670; color: #a8d4f0; }

/* Home page tiles */
[data-theme="dark"] .action-list ul li:hover { background-color: var(--hover-bg); }

/* Downloads list (Downloads.css hard-codes a light-theme link colour) */
[data-theme="dark"] .downloads-list ul li a { color: var(--link); }
[data-theme="dark"] .downloads-list ul li:hover { background-color: #2f6ea3; }
[data-theme="dark"] .downloads-list ul li:hover a { color: #fff; }

/* Upload drop zone */
[data-theme="dark"] .upload-dropzone { border-color: var(--border); color: var(--muted); background-color: var(--surface); }
[data-theme="dark"] .upload-dropzone:hover,
[data-theme="dark"] .upload-dropzone.dragover,
[data-theme="dark"] .upload-dropzone:focus { border-color: var(--link); color: var(--link); }

/* Navbar theme toggle */
#themeToggle i { width: 1em; text-align: center; }
