/*
 * Win7 - Aero glass over Bliss, carried over from the old DEV console.
 *
 * Wallpaper is img/brand/win7-bg.jpg, the first background-image below; the
 * gradients under it are the fallback sky and hill, so the skin still reads if
 * the file is missing. Panels are translucent white glass over a blurred
 * backdrop, buttons the vertical two-stop gradients with a lit top edge.
 */

[data-brand="win7"] {
  --bg: #6ba8d8;
  --surface: #f2f7fd;
  --surface-2: #ffffff;
  --primary: #1f7fd4;
  --primary-ink: #ffffff;
  --secondary: #5b7f9e;
  --accent: #c0392b;
  --fg: #12263f;
  --flag: #7030a0;
  --muted: #4a6b8a;
  --line: rgba(20, 60, 100, 0.22);
  --valkyra: #c62828;
  --lonestar: #1565c0;
  --manticore: #2e7d32;
  --shadow: 0 16px 40px rgba(10, 40, 80, 0.35);
  --font: "Segoe UI", "Source Sans 3", system-ui, sans-serif;
  --mono: "Consolas", "IBM Plex Mono", ui-monospace, monospace;
  --radius: 6px;
  --field: #ffffff;
}

[data-brand="win7"].plus-grid::before,
[data-brand="win7"] .plus-grid::before {
  background-color: #6ba8d8;
  background-image:
    url("../../img/brand/win7-bg.jpg"),
    radial-gradient(ellipse 16% 5% at 20% 22%, rgba(255, 255, 255, 0.95), transparent 70%),
    radial-gradient(ellipse 11% 3.5% at 63% 14%, rgba(255, 255, 255, 0.88), transparent 70%),
    radial-gradient(ellipse 13% 4% at 86% 30%, rgba(255, 255, 255, 0.82), transparent 70%),
    radial-gradient(ellipse 9% 3% at 38% 34%, rgba(255, 255, 255, 0.70), transparent 72%),
    radial-gradient(ellipse 132% 44% at 50% 104%, #7ad04a 0%, #58ab30 34%, #418324 56%, transparent 57%),
    linear-gradient(180deg, #1a68c0 0%, #3f92da 26%, #7ab9e8 44%, #b4d9f0 55%, #d8ebf7 60%, #d8ebf7 100%);
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
}

[data-brand="win7"] .mark {
  background:
    radial-gradient(circle at 34% 24%, rgba(255, 255, 255, 0.95) 0 12%, rgba(120, 200, 255, 0.6) 32%, transparent 58%),
    radial-gradient(circle at 50% 55%, #58b4f5 0 42%, #1565b8 74%, #0b3d78 100%);
  border: 1px solid rgba(255, 255, 255, 0.9);
  border-radius: 50%;
  color: #fff;
  font-size: 0;
  box-shadow: inset 0 -5px 10px rgba(0, 40, 90, 0.5), 0 2px 8px rgba(0, 30, 70, 0.4);
}

[data-brand="win7"] .mark::after {
  content: "7";
  font-family: "Segoe UI", sans-serif;
  font-size: 17px;
  font-weight: 700;
  text-shadow: 0 1px 2px rgba(0, 25, 60, 0.8);
}

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

[data-brand="win7"] .brand h1 {
  font-size: 20px;
  letter-spacing: 0.01em;
  text-transform: none;
  font-weight: 600;
}

[data-brand="win7"] .topbar,
[data-brand="win7"] .nav,
[data-brand="win7"] .card,
[data-brand="win7"] .connect-card,
[data-brand="win7"] .modal,
[data-brand="win7"] .menu,
[data-brand="win7"] .table-wrap {
  background: linear-gradient(180deg, rgba(255, 255, 255, 0.93), rgba(226, 240, 252, 0.90));
  border: 1px solid rgba(255, 255, 255, 0.95);
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 1),
    0 0 0 1px rgba(30, 90, 150, 0.18),
    0 12px 32px rgba(8, 40, 80, 0.32);
  backdrop-filter: blur(16px) saturate(1.3);
}

[data-brand="win7"] .ctrl,
[data-brand="win7"] .field input:not([type="checkbox"]),
[data-brand="win7"] .field select,
[data-brand="win7"] .field textarea,
[data-brand="win7"] .score {
  background: #ffffff;
  color: #12263f;
  border-color: rgba(20, 60, 100, 0.30);
  border-radius: 4px;
  box-shadow: inset 0 1px 2px rgba(10, 40, 80, 0.16);
}

[data-brand="win7"] .btn,
[data-brand="win7"] .pill,
[data-brand="win7"] .server-tab {
  background: linear-gradient(180deg, #fdfefe 0%, #eef5fb 46%, #dce9f6 54%, #ccdff0 100%);
  border: 1px solid rgba(30, 90, 150, 0.40);
  border-radius: 4px;
  color: #12263f;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.95), 0 1px 2px rgba(10, 40, 80, 0.18);
}

[data-brand="win7"] .btn:hover,
[data-brand="win7"] .server-tab:hover {
  background: linear-gradient(180deg, #ffffff 0%, #eaf5ff 46%, #cfe8fb 54%, #b6dbf6 100%);
  border-color: #4ca0e0;
}

[data-brand="win7"] .btn-primary,
[data-brand="win7"] .btn-gold,
[data-brand="win7"] .gold-pill,
[data-brand="win7"] .nav a.active,
[data-brand="win7"] .pill.active,
[data-brand="win7"] .server-tab.active {
  background: linear-gradient(180deg, #7cc0f0 0%, #3d97dd 46%, #1f7fd4 54%, #1567b4 100%);
  color: #ffffff;
  border: 1px solid #1a6cb5;
  border-radius: 4px;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.55), 0 1px 3px rgba(10, 50, 100, 0.35);
  text-shadow: 0 1px 1px rgba(0, 40, 90, 0.45);
}

[data-brand="win7"] .btn-gold:hover {
  background: linear-gradient(180deg, #9fd3f7 0%, #5aabe6 46%, #3b93da 54%, #2a7cc4 100%);
}

[data-brand="win7"] .btn-danger {
  background: linear-gradient(180deg, #fff 0%, #ffeaea 54%, #ffd6d6 100%);
  border-color: #d08383;
  color: #9b1b1b;
}

[data-brand="win7"] .nav a {
  text-transform: none;
  letter-spacing: 0;
  font-size: 13px;
  border-radius: 4px;
}

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

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

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