/* ============================================================
   Windows 95 — classic gray UI, navy title bars, 3D bevels
   Applied when html[data-theme="win95"]
   ============================================================ */

html[data-theme="win95"] {
  --w95-face: #c0c0c0;
  --w95-face-dark: #808080;
  --w95-face-light: #dfdfdf;
  --w95-white: #ffffff;
  --w95-black: #000000;
  --w95-navy: #000080;
  --w95-teal: #008080;
  --w95-desktop: #008080;
  --w95-title: #000080;
  --w95-title-inactive: #808080;
  --w95-hilite: #000080;
  --w95-window: #c0c0c0;
  --w95-field: #ffffff;
  --w95-select: #000080;
  --w95-select-ink: #ffffff;

  --bg: #dfdfdf;
  --panel: var(--w95-face);
  --ink: #000000;
  --muted: #404040;
  --line: #808080;
  --accent: #000080;
  --accent-2: #000080;
  --accent-dark: #000060;
  --accent-soft: #c0c0c0;
  --bubble-in: #ffffff;
  --bubble-out: #000080;
  --bubble-out-ink: #ffffff;
  --shadow: none;
  --chat-bg-top: #ffffff;
  --chat-bg-bot: #ffffff;
  --glow: none;
  --glow-strong: none;
  --input-glow: transparent;
  --danger: #800000;
  --radius-bubble: 0;
  --chip-pressed: #808080;
  --select-fill: #000080;
  --online: #008000;
  --font: "Tahoma", "MS Sans Serif", "Segoe UI", sans-serif;
  --neon-spread: 0.2;
  --sidebar-texture: none;
}

html[data-theme="win95"] body {
  font-family: "Tahoma", "MS Sans Serif", "Segoe UI", sans-serif !important;
  font-size: calc(0.92rem * var(--font-scale, 1));
  background: var(--w95-desktop) !important;
  color: var(--ink);
  image-rendering: auto;
}

/* Classic 3D raised / sunken */
html[data-theme="win95"] .app-shell,
html[data-theme="win95"] .auth-card,
html[data-theme="win95"] .card,
html[data-theme="win95"] .console-nav,
html[data-theme="win95"] .console-screen,
html[data-theme="win95"] .ui-dialog,
html[data-theme="win95"] .sidebar,
html[data-theme="win95"] .info-panel,
html[data-theme="win95"] .chat-pane,
html[data-theme="win95"] .me-chip,
html[data-theme="win95"] .composer,
html[data-theme="win95"] .new-menu,
html[data-theme="win95"] .emoji-panel,
html[data-theme="win95"] .msg-ctx,
html[data-theme="win95"] .send-menu,
html[data-theme="win95"] .pinned-bar {
  border-radius: 0 !important;
  background: var(--w95-face) !important;
  border-top: 2px solid var(--w95-white) !important;
  border-left: 2px solid var(--w95-white) !important;
  border-right: 2px solid var(--w95-black) !important;
  border-bottom: 2px solid var(--w95-black) !important;
  box-shadow: none !important;
  backdrop-filter: none !important;
}

html[data-theme="win95"] .app-shell {
  background: var(--w95-desktop) !important;
  border: 0 !important;
  box-shadow: none !important;
  gap: 0.55rem;
  padding: 0.55rem;
}

html[data-theme="win95"] .sidebar,
html[data-theme="win95"] .chat-pane {
  background: var(--w95-face) !important;
}

html[data-theme="win95"] .chat-pane {
  display: grid !important;
  grid-template-rows: auto 1fr auto auto !important;
  min-height: 0;
}
html[data-theme="win95"] .messages-stage {
  min-height: 0;
  overflow: hidden;
  display: flex;
  flex-direction: column;
}
html[data-theme="win95"] .messages-stage .messages {
  flex: 1;
  min-height: 0;
}
html[data-theme="win95"] .composer-wrap {
  margin-top: auto;
  flex-shrink: 0;
}

/* Title-bar style headers (not the whole settings nav) */
html[data-theme="win95"] .sidebar-header,
html[data-theme="win95"] .chat-header,
html[data-theme="win95"] .info-panel > header,
html[data-theme="win95"] .ui-dialog h3,
html[data-theme="win95"] .console-brand {
  background: linear-gradient(90deg, var(--w95-navy) 0%, #1084d0 100%) !important;
  color: #fff !important;
  border-radius: 0 !important;
  border: 0 !important;
  box-shadow: none !important;
  font-weight: 700;
  text-shadow: none !important;
  padding: 0.35rem 0.55rem;
}

html[data-theme="win95"] .sidebar-header .brand,
html[data-theme="win95"] #chat-title,
html[data-theme="win95"] .boot-splash-brand,
html[data-theme="win95"] .auth-card h1 {
  font-family: var(--font) !important;
  color: #fff !important;
  text-shadow: none !important;
  text-transform: none;
  font-size: 0.95rem !important;
  font-weight: 700;
}

html[data-theme="win95"] .auth-card h1 {
  color: var(--w95-navy) !important;
  background: transparent;
}

html[data-theme="win95"] .chat-subtitle,
html[data-theme="win95"] .me-chip-text .muted,
html[data-theme="win95"] #me-user {
  color: #e0e0e0 !important;
  text-shadow: none !important;
  text-transform: none !important;
}

html[data-theme="win95"] .me-chip {
  background: var(--w95-face) !important;
  margin-top: 0.35rem;
}
html[data-theme="win95"] .me-chip-text strong {
  color: #000 !important;
  font-family: var(--font) !important;
  text-transform: none;
}
html[data-theme="win95"] .me-chip-text .muted,
html[data-theme="win95"] #me-user {
  color: #008000 !important;
  font-size: 0.85rem !important;
}

html[data-theme="win95"] .chat-header .chat-subtitle,
html[data-theme="win95"] .chat-header #chat-title {
  color: #fff !important;
}

/* Sunken fields */
html[data-theme="win95"] input,
html[data-theme="win95"] textarea,
html[data-theme="win95"] select,
html[data-theme="win95"] .search-wrap input,
html[data-theme="win95"] #message-input,
html[data-theme="win95"] .messages {
  border-radius: 0 !important;
  background: var(--w95-field) !important;
  border-top: 2px solid var(--w95-black) !important;
  border-left: 2px solid var(--w95-black) !important;
  border-right: 2px solid var(--w95-white) !important;
  border-bottom: 2px solid var(--w95-white) !important;
  box-shadow: none !important;
  color: #000 !important;
  font-family: var(--font) !important;
  text-transform: none;
}

html[data-theme="win95"] .messages {
  background: #fff !important;
  margin: 0.35rem;
}

html[data-theme="win95"] .messages-stage {
  background: var(--w95-face);
}
html[data-theme="win95"] .messages-stage::before {
  display: none !important;
}

/* Raised buttons */
html[data-theme="win95"] .btn-primary,
html[data-theme="win95"] .btn-ghost,
html[data-theme="win95"] .icon-btn,
html[data-theme="win95"] .send-btn,
html[data-theme="win95"] .chip,
html[data-theme="win95"] .tab,
html[data-theme="win95"] .theme-opt,
html[data-theme="win95"] .info-action {
  border-radius: 0 !important;
  background: var(--w95-face) !important;
  color: #000 !important;
  border-top: 2px solid var(--w95-white) !important;
  border-left: 2px solid var(--w95-white) !important;
  border-right: 2px solid var(--w95-black) !important;
  border-bottom: 2px solid var(--w95-black) !important;
  box-shadow: none !important;
  filter: none !important;
  text-shadow: none !important;
}

html[data-theme="win95"] .btn-primary,
html[data-theme="win95"] .send-btn.has-text,
html[data-theme="win95"] .chip.active,
html[data-theme="win95"] .tab.active,
html[data-theme="win95"] .theme-opt.active {
  background: var(--w95-face) !important;
  border-top: 2px solid var(--w95-black) !important;
  border-left: 2px solid var(--w95-black) !important;
  border-right: 2px solid var(--w95-white) !important;
  border-bottom: 2px solid var(--w95-white) !important;
  outline: 1px dotted #000;
  outline-offset: -5px;
}

html[data-theme="win95"] .btn-primary {
  font-weight: 700;
}

html[data-theme="win95"] .send-btn {
  width: auto !important;
  height: auto !important;
  min-width: 5.5rem;
  padding: 0.4rem 0.75rem !important;
  white-space: nowrap;
}
html[data-theme="win95"] .send-btn .send-ico-default {
  display: none !important;
}
html[data-theme="win95"] .send-btn .send-label-pixel {
  display: inline !important;
  font-family: var(--font) !important;
  color: inherit;
}

html[data-theme="win95"] .icon-btn:hover:not(:disabled),
html[data-theme="win95"] .btn-ghost:hover,
html[data-theme="win95"] .chip:hover {
  background: var(--w95-face-light) !important;
}

html[data-theme="win95"] .ui-ico {
  stroke-width: 1.5;
}

/* Chat list — listbox */
html[data-theme="win95"] .chat-list {
  background: #fff;
  margin: 0.35rem;
  border-top: 2px solid var(--w95-black);
  border-left: 2px solid var(--w95-black);
  border-right: 2px solid var(--w95-white);
  border-bottom: 2px solid var(--w95-white);
}
html[data-theme="win95"] .chat-list li button {
  border-radius: 0 !important;
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  color: #000 !important;
}
html[data-theme="win95"] .chat-list li button:hover {
  background: #e8e8e8 !important;
}
html[data-theme="win95"] .chat-list li button.active {
  background: var(--w95-select) !important;
  color: var(--w95-select-ink) !important;
  box-shadow: none !important;
}
html[data-theme="win95"] .chat-list li button.active strong,
html[data-theme="win95"] .chat-list li button.active .preview,
html[data-theme="win95"] .chat-list li button.active .chat-item-meta {
  color: #fff !important;
  text-shadow: none !important;
}
html[data-theme="win95"] .chat-list li button strong {
  color: #000 !important;
  text-shadow: none !important;
  font-family: var(--font) !important;
  font-size: 0.9rem !important;
  text-transform: none;
}
html[data-theme="win95"] .chat-unread-badge {
  border-radius: 0 !important;
  background: #800000 !important;
  color: #fff !important;
  border: 1px solid #000 !important;
  box-shadow: none !important;
  font-weight: 700;
}

html[data-theme="win95"] .chat-list-sep-label {
  font-family: var(--font) !important;
  color: #000 !important;
  text-transform: none;
  text-shadow: none;
}

/* Bubbles — Win95 windows */
html[data-theme="win95"] .messages .row .bubble:not(.deleted) {
  border-radius: 0 !important;
  background: #fff !important;
  color: #000 !important;
  border-top: 2px solid var(--w95-white) !important;
  border-left: 2px solid var(--w95-white) !important;
  border-right: 2px solid var(--w95-black) !important;
  border-bottom: 2px solid var(--w95-black) !important;
  box-shadow: none !important;
  filter: none !important;
}
html[data-theme="win95"] .messages .row.mine .bubble:not(.deleted) {
  background: #ffffcc !important;
  color: #000 !important;
}
html[data-theme="win95"] .messages .row .sender-name,
html[data-theme="win95"] .messages .row.mine .sender-name {
  color: var(--neon, var(--w95-navy)) !important;
  text-shadow: none !important;
  font-family: var(--font) !important;
  font-weight: 700;
  text-transform: none;
  background: transparent;
  border: 0;
  box-shadow: none;
  padding: 0;
}
html[data-theme="win95"] .bubble-foot {
  color: #606060 !important;
}
html[data-theme="win95"] .day-sep {
  border-radius: 0 !important;
  background: var(--w95-face) !important;
  color: #000 !important;
  border-top: 2px solid var(--w95-white) !important;
  border-left: 2px solid var(--w95-white) !important;
  border-right: 2px solid var(--w95-black) !important;
  border-bottom: 2px solid var(--w95-black) !important;
  box-shadow: none !important;
  text-shadow: none !important;
}

/* Avatars — square, no neon bloom */
html[data-theme="win95"] .avatar,
html[data-theme="win95"] .avatar-wrap,
html[data-theme="win95"] .avatar-img {
  border-radius: 0 !important;
}
html[data-theme="win95"] .avatar:not(.has-img) {
  background-image: none !important;
  background-color: var(--av, #808080) !important;
  text-shadow: none !important;
}
html[data-theme="win95"] .avatar:not(.has-img)::after {
  display: none !important;
}
html[data-theme="win95"] .avatar-wrap::after,
html[data-theme="win95"] #chat-avatar-wrap::after {
  border-radius: 0 !important;
  box-shadow: 1px 1px 0 #000, -1px -1px 0 #fff !important;
}
html[data-theme="win95"] .status-dot {
  border-radius: 0 !important;
  border: 1px solid #000 !important;
  box-shadow: none !important;
  width: 12px !important;
  height: 12px !important;
}
html[data-theme="win95"] .status-dot.online {
  background: #00ff00 !important;
  box-shadow: none !important;
}

html[data-theme="win95"] .composer-wrap {
  background: var(--w95-face);
}
html[data-theme="win95"] .composer {
  align-items: center;
}
html[data-theme="win95"] .composer-prompt,
html[data-theme="win95"] .composer-hints,
html[data-theme="win95"] .pixel-rpg-hud {
  display: none !important;
}

html[data-theme="win95"] .btn-jump-bottom {
  border-radius: 0 !important;
  background: var(--w95-face) !important;
  color: #000 !important;
  border-top: 2px solid var(--w95-white) !important;
  border-left: 2px solid var(--w95-white) !important;
  border-right: 2px solid var(--w95-black) !important;
  border-bottom: 2px solid var(--w95-black) !important;
  box-shadow: none !important;
}

html[data-theme="win95"] .ui-dialog::backdrop {
  background: rgba(0, 0, 0, 0.35);
}
html[data-theme="win95"] .ui-toast {
  border-radius: 0 !important;
  background: #ffffe1 !important;
  color: #000 !important;
  border: 1px solid #000 !important;
  box-shadow:
    2px 2px 0 #000 !important;
}

html[data-theme="win95"] .boot-splash {
  background: var(--w95-desktop) !important;
}
html[data-theme="win95"] .boot-splash-spinner {
  border-radius: 0 !important;
  border-color: var(--w95-navy) transparent var(--w95-navy) transparent !important;
}

html[data-theme="win95"] .console-item.active {
  background: var(--w95-select) !important;
  color: #fff !important;
  box-shadow: none !important;
  border-radius: 0 !important;
}

/* Settings / admin — full Win95 chrome (not modern gradient) */
html[data-theme="win95"] .console-screen,
html[data-theme="win95"] #settings-screen,
html[data-theme="win95"] #admin-screen {
  position: fixed !important;
  inset: 0 !important;
  z-index: 10060 !important;
  background: var(--w95-desktop) !important;
  overflow: auto !important;
}
html[data-theme="win95"] .console-nav {
  background: var(--w95-face) !important;
  border-right: 2px solid var(--w95-black) !important;
  color: #000 !important;
}
html[data-theme="win95"] .console-back,
html[data-theme="win95"] .console-item,
html[data-theme="win95"] .console-signed,
html[data-theme="win95"] .console-main,
html[data-theme="win95"] .console-main .muted,
html[data-theme="win95"] .console-main p,
html[data-theme="win95"] .console-main label {
  color: #000 !important;
  text-shadow: none !important;
}
html[data-theme="win95"] .console-item {
  border-radius: 0 !important;
  background: transparent !important;
}
html[data-theme="win95"] .console-item:hover {
  background: #e8e8e8 !important;
}
html[data-theme="win95"] .console-brand h2,
html[data-theme="win95"] .console-brand .console-sub {
  color: #fff !important;
}
html[data-theme="win95"] .console-main {
  background: var(--w95-face) !important;
}
html[data-theme="win95"] .send-btn {
  padding: 0.5rem 0.85rem !important;
}

html[data-theme="win95"] .theme-opt small {
  color: #404040;
}
html[data-theme="win95"] .theme-opt.active small {
  color: #404040;
}

html[data-theme="win95"] * {
  scrollbar-width: auto;
  scrollbar-color: #808080 #c0c0c0;
}
html[data-theme="win95"] *::-webkit-scrollbar {
  width: 16px;
  height: 16px;
}
html[data-theme="win95"] *::-webkit-scrollbar-thumb {
  background: var(--w95-face);
  border-top: 2px solid var(--w95-white);
  border-left: 2px solid var(--w95-white);
  border-right: 2px solid var(--w95-black);
  border-bottom: 2px solid var(--w95-black);
}
html[data-theme="win95"] *::-webkit-scrollbar-track {
  background: #dfdfdf;
  border-top: 2px solid var(--w95-black);
  border-left: 2px solid var(--w95-black);
}

html[data-theme="win95"] .auth-screen,
html[data-theme="win95"] .console-screen {
  background: var(--w95-desktop) !important;
}

html[data-theme="win95"] .empty-chat {
  color: #404040;
  text-shadow: none;
  font-family: var(--font);
  text-transform: none;
}

html[data-theme="win95"] .lock-pill {
  background: var(--w95-face);
  border-radius: 0;
  border-top: 1px solid var(--w95-white);
  border-left: 1px solid var(--w95-white);
  border-right: 1px solid var(--w95-black);
  border-bottom: 1px solid var(--w95-black);
}
