/* DOS/CRT retro theme for muds.modem.xyz
 * Uses Perfect DOS VGA 437 Win font and classic DOS color palette.
 */

@font-face {
  font-family: 'Perfect DOS VGA 437 Win';
  font-display: swap;
  src: local('Perfect DOS VGA 437 Win'),
       url('./fonts/PerfectDOSVGA437Win.ttf') format('truetype');
  font-weight: normal;
  font-style: normal;
}

/* ── DOS Color Palette ─────────────────────────────────────────────────── */
:root {
  --dos-black: #0C0C0C;
  --dos-blue: #0000AA;
  --dos-green: #00AA00;
  --dos-cyan: #00AAAA;
  --dos-red: #AA0000;
  --dos-magenta: #AA00AA;
  --dos-brown: #AA5500;
  --dos-light-gray: #AAAAAA;
  --dos-dark-gray: #555555;
  --dos-bright-blue: #5555FF;
  --dos-bright-green: #55FF55;
  --dos-bright-cyan: #55FFFF;
  --dos-bright-red: #FF5555;
  --dos-bright-magenta: #FF55FF;
  --dos-bright-yellow: #FFFF55;
  --dos-white: #FFFFFF;
  --dos-font: 'Perfect DOS VGA 437 Win', 'Px IBM VGA8', 'IBM Plex Mono',
              'Courier New', monospace;
}

/* ── Global ────────────────────────────────────────────────────────────── */
body {
  font-family: var(--dos-font) !important;
  background-color: var(--dos-black) !important;
  color: var(--dos-light-gray) !important;
}

/* ── Sidebar ───────────────────────────────────────────────────────────── */
.wy-nav-side {
  background-color: var(--dos-black) !important;
  border-right: 2px solid var(--dos-dark-gray) !important;
}

.wy-side-nav-search {
  background-color: var(--dos-black) !important;
  border-bottom: 2px solid var(--dos-dark-gray) !important;
}

.wy-side-nav-search input[type="text"] {
  background-color: var(--dos-black) !important;
  color: var(--dos-bright-green) !important;
  border: 1px solid var(--dos-dark-gray) !important;
  font-family: var(--dos-font) !important;
}

/* Level 1: bright white text on very dark grey */
.wy-menu-vertical li.toctree-l1 > a {
  color: var(--dos-white) !important;
  background-color: #141414 !important;
  font-family: var(--dos-font) !important;
  border: none !important;
}

/* Level 2: light grey text on darker grey */
.wy-menu-vertical li.toctree-l2 > a {
  color: #CCCCCC !important;
  background-color: #111111 !important;
  font-family: var(--dos-font) !important;
  border: none !important;
}

/* Level 3: medium grey text on near-black */
.wy-menu-vertical li.toctree-l3 > a {
  color: #999999 !important;
  background-color: #0E0E0E !important;
  font-family: var(--dos-font) !important;
  border: none !important;
}

/* Current/active states */
.wy-menu-vertical li.toctree-l1.current > a {
  background-color: #1A1A1A !important;
  color: var(--dos-white) !important;
  border: none !important;
}

.wy-menu-vertical li.current > a {
  background-color: #1A1A1A !important;
  border: none !important;
}

.wy-menu-vertical li.current li.toctree-l2 > a {
  background-color: #111111 !important;
}

.wy-menu-vertical li.current li.toctree-l3 > a {
  background-color: #0E0E0E !important;
}

/* Hover states */
.wy-menu-vertical li.toctree-l1 > a:hover {
  background-color: #1E1E1E !important;
  color: var(--dos-white) !important;
}

.wy-menu-vertical li.toctree-l2 > a:hover {
  background-color: #181818 !important;
  color: #DDDDDD !important;
}

.wy-menu-vertical li.toctree-l3 > a:hover {
  background-color: #151515 !important;
  color: #AAAAAA !important;
}

.wy-side-nav-search > a {
  color: var(--dos-bright-green) !important;
  font-family: var(--dos-font) !important;
}

.wy-side-nav-search .wy-dropdown > a {
  color: var(--dos-light-gray) !important;
}

/* ── Main Content ──────────────────────────────────────────────────────── */
.wy-nav-content-wrap {
  background-color: var(--dos-black) !important;
}

.wy-nav-content {
  background-color: var(--dos-black) !important;
  color: var(--dos-light-gray) !important;
  max-width: none !important;
  margin-left: 1em !important;
  margin-right: 1em !important;
}

.rst-content {
  font-family: var(--dos-font) !important;
}

/* ── Headings ──────────────────────────────────────────────────────────── */
h1, h2, h3, h4, h5, h6,
.rst-content h1, .rst-content h2, .rst-content h3,
.rst-content h4, .rst-content h5, .rst-content h6 {
  color: var(--dos-green) !important;
  font-family: var(--dos-font) !important;
  border-bottom: none !important;
}

/* Blinking cursor after h1 */
.rst-content h1::after {
  content: '_';
  animation: blink 1s step-end infinite;
  color: var(--dos-green);
}

@keyframes blink {
  50% { opacity: 0; }
}

/* ── Links ─────────────────────────────────────────────────────────────── */
a, a:visited,
.rst-content a, .rst-content a:visited {
  color: var(--dos-bright-blue) !important;
  text-decoration: none !important;
}

a:hover, .rst-content a:hover {
  color: var(--dos-bright-magenta) !important;
  text-decoration: underline !important;
}

/* ── Breadcrumbs ───────────────────────────────────────────────────────── */
.wy-breadcrumbs {
  color: var(--dos-dark-gray) !important;
}

.wy-breadcrumbs a {
  color: var(--dos-bright-blue) !important;
}

.wy-breadcrumbs-aside a {
  color: var(--dos-dark-gray) !important;
}

/* ── Tables ────────────────────────────────────────────────────────────── */
table, .rst-content table.docutils,
.rst-content table.field-list {
  border-collapse: collapse !important;
  border: 2px solid var(--dos-dark-gray) !important;
  font-family: var(--dos-font) !important;
}

table.sphinx-datatable {
  width: auto !important;
}

th, .rst-content table.docutils th,
.rst-content table.field-list th {
  background-color: var(--dos-blue) !important;
  color: var(--dos-bright-cyan) !important;
  border: 1px solid var(--dos-dark-gray) !important;
  padding: 0.3em 0.6em !important;
  font-family: var(--dos-font) !important;
}

td, .rst-content table.docutils td,
.rst-content table.field-list td {
  background-color: var(--dos-black) !important;
  color: var(--dos-light-gray) !important;
  border: 1px solid var(--dos-dark-gray) !important;
  padding: 0.3em 0.6em !important;
  font-family: var(--dos-font) !important;
}

tr:nth-child(even) td {
  background-color: #111111 !important;
}

/* DataTables sorting arrows */
table.dataTable thead .sorting::after,
table.dataTable thead .sorting_asc::after,
table.dataTable thead .sorting_desc::after {
  color: var(--dos-bright-yellow) !important;
}

/* DataTables search/filter */
.dataTables_wrapper .dataTables_filter input {
  background-color: var(--dos-black) !important;
  color: var(--dos-bright-green) !important;
  border: 1px solid var(--dos-dark-gray) !important;
  font-family: var(--dos-font) !important;
}

.dataTables_wrapper .dataTables_filter label {
  color: var(--dos-light-gray) !important;
}

/* ── Code Blocks ───────────────────────────────────────────────────────── */
code, pre, .rst-content code, .rst-content pre,
.rst-content tt {
  font-family: var(--dos-font) !important;
  background-color: var(--dos-black) !important;
  color: var(--dos-bright-yellow) !important;
  border: 1px solid var(--dos-dark-gray) !important;
}

.highlight {
  background-color: var(--dos-black) !important;
  border: 1px solid var(--dos-dark-gray) !important;
}

/* ANSI banner rendering (via ansi2html) */
pre.ansi-banner {
  background-color: var(--dos-black) !important;
  color: var(--dos-white) !important;
  font-family: var(--dos-font) !important;
  border: 1px solid var(--dos-dark-gray) !important;
  padding: 0.6em 0.8em;
  overflow-x: auto;
  white-space: pre;
  line-height: 1.2;
}

.highlight pre {
  border: none !important;
}

/* ── Admonitions ───────────────────────────────────────────────────────── */
.rst-content .admonition,
.rst-content .note, .rst-content .warning,
.rst-content .tip, .rst-content .important {
  background-color: var(--dos-black) !important;
  border: 2px solid var(--dos-dark-gray) !important;
}

.rst-content .admonition-title {
  background-color: var(--dos-blue) !important;
  color: var(--dos-bright-cyan) !important;
}

.rst-content .admonition p {
  color: var(--dos-light-gray) !important;
}

/* ── Figures ───────────────────────────────────────────────────────────── */
.rst-content .figure .caption,
.rst-content figure figcaption p {
  color: var(--dos-dark-gray) !important;
  font-style: normal !important;
}

/* ── Footer ────────────────────────────────────────────────────────────── */
footer, .rst-footer-buttons {
  color: var(--dos-dark-gray) !important;
}

footer a {
  color: var(--dos-bright-blue) !important;
}

/* ── Sidebar scrollbar ─────────────────────────────────────────────────── */
.wy-side-scroll {
  overflow-y: scroll !important;
  scrollbar-width: thin;
  scrollbar-color: var(--dos-dark-gray) var(--dos-black);
}

.wy-side-scroll::-webkit-scrollbar {
  width: 10px;
}

.wy-side-scroll::-webkit-scrollbar-track {
  background: #111111;
}

.wy-side-scroll::-webkit-scrollbar-thumb {
  background: var(--dos-dark-gray);
  border: 1px solid #111111;
}

.wy-side-scroll::-webkit-scrollbar-thumb:hover {
  background: var(--dos-light-gray);
}

/* ── Scrollbar (Webkit) ────────────────────────────────────────────────── */
::-webkit-scrollbar {
  width: 12px;
  height: 12px;
}

::-webkit-scrollbar-track {
  background: var(--dos-black);
}

::-webkit-scrollbar-thumb {
  background: var(--dos-dark-gray);
  border: 1px solid var(--dos-black);
}

::-webkit-scrollbar-thumb:hover {
  background: var(--dos-light-gray);
}

/* ── Protocol support colored cells ────────────────────────────────────── */
.proto-yes {
  color: var(--dos-bright-green) !important;
}

.proto-no {
  color: var(--dos-dark-gray) !important;
}

.proto-negotiated {
  color: var(--dos-bright-cyan) !important;
}

/* ── Telnet links and copy buttons ─────────────────────────────────────── */
a[href^="telnet://"],
.telnet-link {
  color: var(--dos-bright-cyan) !important;
  font-family: var(--dos-font) !important;
}

a[href^="telnet://"]:hover,
.telnet-link:hover {
  color: var(--dos-bright-magenta) !important;
}

.mud-connect {
  margin: 0.5em 0 1em 0;
}

.copy-btn {
  display: inline-block;
  background: none;
  border: 1px solid var(--dos-dark-gray);
  color: var(--dos-light-gray);
  cursor: pointer;
  padding: 1px 5px;
  margin-left: 6px;
  font-family: var(--dos-font);
  font-size: 0.85em;
  vertical-align: middle;
  line-height: 1;
}

.copy-btn:hover {
  border-color: var(--dos-bright-cyan);
  color: var(--dos-bright-cyan);
}

.copy-icon {
  pointer-events: none;
}

/* ── Score color class overrides for dark theme ────────────────────────── */
[class^="score-"], [class*=" score-"] {
  display: block;
  padding: 0.2em 0.4em;
  color: var(--dos-black) !important;
  font-weight: bold;
}