/*
 * Win95 - the Hemschke skin, carried over from the old DEV console.
 *
 * Not a repaint: the whole chrome changes. Panels and buttons are bevelled with
 * the four-inset box-shadow trick (light top-left, black bottom-right), fields
 * are sunken, the topbar is the navy-to-azure title bar, and nothing keeps a
 * rounded corner. Teal desktop behind it all.
 */

[data-brand="win95"] {
  --bg: #008080;
  --surface: #c0c0c0;
  --surface-2: #d4d0c8;
  --primary: #000080;
  --primary-ink: #ffffff;
  --secondary: #808080;
  --accent: #800000;
  --fg: #000000;
  --flag: #800080;
  --muted: #404040;
  --line: #808080;
  --shadow: 2px 2px 0 #000;
  --font: Tahoma, "MS Sans Serif", "Segoe UI", sans-serif;
  --mono: "Lucida Console", "Courier New", monospace;
  --radius: 0;
  --field: #ffffff;
}

[data-brand="win95"].plus-grid::before,
[data-brand="win95"] .plus-grid::before {
  background-color: #008080;
  background-image: none;
}

[data-brand="win95"] .mark {
  background: #c0c0c0;
  color: #000;
  border: 0;
  border-radius: 0;
  font-size: 0;
  box-shadow: inset -1px -1px 0 #000, inset 1px 1px 0 #fff, inset -2px -2px 0 #808080, inset 2px 2px 0 #dfdfdf;
}

[data-brand="win95"] .mark::after {
  content: "95";
  font-size: 16px;
  font-weight: 700;
  font-family: Tahoma, sans-serif;
}

[data-brand="win95"] .brand h1 {
  font-size: 16px;
  letter-spacing: 0;
  text-transform: none;
  font-weight: 700;
}

[data-brand="win95"] .brand-sub {
  letter-spacing: 0.04em;
}

[data-brand="win95"] .topbar {
  background: linear-gradient(90deg, #000080, #1084d0);
  border-bottom: 2px solid #000;
  color: #fff;
}

[data-brand="win95"] .topbar .brand h1,
[data-brand="win95"] .topbar .brand-sub,
[data-brand="win95"] .live-chip {
  color: #fff;
}

[data-brand="win95"] .nav {
  background: #c0c0c0;
  border-right: 2px solid #404040;
}

[data-brand="win95"] .nav a {
  color: #000;
  text-transform: none;
  letter-spacing: 0;
  border-radius: 0;
}

[data-brand="win95"] .card,
[data-brand="win95"] .connect-card,
[data-brand="win95"] .modal,
[data-brand="win95"] .menu,
[data-brand="win95"] .server-tab {
  background: #c0c0c0;
  color: #000;
  border: 0;
  border-radius: 0;
  box-shadow: inset -1px -1px 0 #000, inset 1px 1px 0 #fff, inset -2px -2px 0 #808080, inset 2px 2px 0 #dfdfdf;
}

[data-brand="win95"] .btn,
[data-brand="win95"] .pill,
[data-brand="win95"] .gold-pill {
  background: #c0c0c0;
  color: #000;
  border: 0;
  border-radius: 0;
  box-shadow: inset -1px -1px 0 #000, inset 1px 1px 0 #fff, inset -2px -2px 0 #808080, inset 2px 2px 0 #dfdfdf;
}

[data-brand="win95"] .btn:active,
[data-brand="win95"] .pill.active {
  box-shadow: inset 1px 1px 0 #000, inset -1px -1px 0 #fff, inset 2px 2px 0 #808080, inset -2px -2px 0 #dfdfdf;
}

[data-brand="win95"] .btn-primary,
[data-brand="win95"] .btn-gold,
[data-brand="win95"] .gold-pill,
[data-brand="win95"] .nav a.active,
[data-brand="win95"] .nav a:hover,
[data-brand="win95"] .pill.active,
[data-brand="win95"] .server-tab.active {
  background: #000080;
  color: #fff;
  border: 0;
}

[data-brand="win95"] .btn-gold:hover {
  background: #000080;
  color: #fff;
}

[data-brand="win95"] .btn-danger {
  background: #800000;
  color: #fff;
}

[data-brand="win95"] .ctrl,
[data-brand="win95"] .field input:not([type="checkbox"]),
[data-brand="win95"] .field select,
[data-brand="win95"] .field textarea,
[data-brand="win95"] .score {
  background: #fff;
  color: #000;
  border: 0;
  border-radius: 0;
  box-shadow: inset 1px 1px 0 #000, inset -1px -1px 0 #fff, inset 2px 2px 0 #808080;
}

[data-brand="win95"] .table-wrap {
  background: #fff;
  border: 0;
  border-radius: 0;
  box-shadow: inset 1px 1px 0 #000, inset -1px -1px 0 #fff;
}

/* Classic navy selection bar in dropdown lists. */
[data-brand="win95"] .combo-opt {
  border-radius: 0;
}

[data-brand="win95"] .combo-opt.active,
[data-brand="win95"] .combo-opt:hover {
  background: var(--primary);
  color: var(--primary-ink);
}

[data-brand="win95"] .combo-opt.active .combo-detail,
[data-brand="win95"] .combo-opt:hover .combo-detail {
  color: inherit;
}

/* The console's own radii would fight the bevels, so the skin squares every
   corner and puts the mark back - the shared rules hide it. */
[data-brand="win95"] * {
  border-radius: 0 !important;
}

[data-brand="win95"] .mark {
  display: grid;
}

[data-brand="win95"] .brand-icon {
  display: none;
}

[data-brand="win95"] .btn-gold,
[data-brand="win95"] .btn-gold:hover {
  letter-spacing: 0;
  text-transform: none;
}
