/* ============================================================
   DOS — green phosphor terminal / VGA text mode
   Applied when html[data-theme="dos"]
   ============================================================ */

html[data-theme="dos"] {
  --dos-bg: #000000;
  --dos-green: #33ff66;
  --dos-green-dim: #1a9940;
  --dos-green-bright: #66ff99;
  --dos-amber: #ffb000;
  --dos-cyan: #55ffff;
  --dos-white: #c0c0c0;
  --dos-blue: #0000aa;
  --dos-field: #001100;

  --bg: var(--dos-bg);
  --panel: #001a00;
  --ink: var(--dos-green);
  --muted: var(--dos-green-dim);
  --line: var(--dos-green-dim);
  --accent: var(--dos-green);
  --accent-2: var(--dos-amber);
  --accent-dark: #00cc44;
  --accent-soft: #002200;
  --bubble-in: #001100;
  --bubble-out: #003300;
  --bubble-out-ink: var(--dos-green-bright);
  --shadow: none;
  --chat-bg-top: #000000;
  --chat-bg-bot: #000000;
  --glow: none;
  --glow-strong: none;
  --input-glow: transparent;
  --danger: #ff5555;
  --radius-bubble: 0;
  --chip-pressed: #003300;
  --select-fill: #003300;
  --online: var(--dos-green-bright);
  --font: "VT323", "Courier New", monospace;
  --neon-spread: 0.25;
  --sidebar-texture: none;
}

html[data-theme="dos"] body {
  font-family: "VT323", "Courier New", monospace !important;
  font-size: calc(1.25rem * var(--font-scale, 1));
  letter-spacing: 0.04em;
  background: var(--dos-bg) !important;
  color: var(--dos-green);
  image-rendering: auto;
  text-shadow: 0 0 4px rgba(51, 255, 102, 0.25);
}

html[data-theme="dos"] .app-shell {
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  gap: 0.45rem;
  padding: 0.45rem;
}

html[data-theme="dos"] .sidebar,
html[data-theme="dos"] .chat-pane,
html[data-theme="dos"] .auth-card,
html[data-theme="dos"] .card,
html[data-theme="dos"] .console-nav,
html[data-theme="dos"] .console-screen,
html[data-theme="dos"] .ui-dialog,
html[data-theme="dos"] .info-panel,
html[data-theme="dos"] .me-chip,
html[data-theme="dos"] .composer,
html[data-theme="dos"] .new-menu,
html[data-theme="dos"] .emoji-panel,
html[data-theme="dos"] .msg-ctx,
html[data-theme="dos"] .send-menu,
html[data-theme="dos"] .pinned-bar {
  border-radius: 0 !important;
  background: var(--dos-bg) !important;
  border: 2px solid var(--dos-green) !important;
  box-shadow: none !important;
  backdrop-filter: none !important;
  color: var(--dos-green);
}

html[data-theme="dos"] .sidebar-header,
html[data-theme="dos"] .chat-header {
  background: var(--dos-blue) !important;
  color: var(--dos-white) !important;
  border-radius: 0 !important;
  border: 0 !important;
  border-bottom: 2px solid var(--dos-green) !important;
  box-shadow: none !important;
  text-shadow: none !important;
}

html[data-theme="dos"] .brand,
html[data-theme="dos"] #chat-title,
html[data-theme="dos"] .boot-splash-brand,
html[data-theme="dos"] .auth-card h1,
html[data-theme="dos"] h3 {
  font-family: var(--font) !important;
  color: var(--dos-green-bright) !important;
  text-shadow: 0 0 6px rgba(51, 255, 102, 0.35) !important;
  text-transform: uppercase;
  letter-spacing: 0.08em;
}

html[data-theme="dos"] .sidebar-header .brand,
html[data-theme="dos"] .chat-header #chat-title {
  color: #ffffff !important;
  text-shadow: none !important;
  font-size: 1.35rem !important;
}

html[data-theme="dos"] .chat-subtitle {
  color: var(--dos-cyan) !important;
  font-family: var(--font) !important;
  text-transform: none;
}

html[data-theme="dos"] .me-chip-text strong {
  color: var(--dos-green-bright) !important;
  font-family: var(--font) !important;
  text-transform: uppercase;
  font-size: 1.15rem !important;
}
html[data-theme="dos"] .me-chip-text .muted,
html[data-theme="dos"] #me-user {
  color: var(--dos-green) !important;
  text-transform: none !important;
  font-size: 1.05rem !important;
  text-shadow: none !important;
}

html[data-theme="dos"] input,
html[data-theme="dos"] textarea,
html[data-theme="dos"] select,
html[data-theme="dos"] .search-wrap input,
html[data-theme="dos"] #message-input {
  border-radius: 0 !important;
  background: var(--dos-field) !important;
  border: 1px solid var(--dos-green) !important;
  box-shadow: none !important;
  color: var(--dos-green-bright) !important;
  font-family: var(--font) !important;
  text-transform: none;
  caret-color: var(--dos-green-bright);
}
html[data-theme="dos"] input::placeholder,
html[data-theme="dos"] #message-input::placeholder {
  color: var(--dos-green-dim) !important;
  opacity: 1;
  text-transform: none;
}

html[data-theme="dos"] .messages {
  background: transparent !important;
}
html[data-theme="dos"] .messages-stage {
  background: #000;
}
html[data-theme="dos"] .messages-stage::before {
  display: none !important;
}

html[data-theme="dos"] .btn-primary,
html[data-theme="dos"] .btn-ghost,
html[data-theme="dos"] .icon-btn,
html[data-theme="dos"] .send-btn,
html[data-theme="dos"] .chip,
html[data-theme="dos"] .tab,
html[data-theme="dos"] .theme-opt,
html[data-theme="dos"] .info-action {
  border-radius: 0 !important;
  background: #000 !important;
  color: var(--dos-green) !important;
  border: 1px solid var(--dos-green) !important;
  box-shadow: none !important;
  filter: none !important;
  font-family: var(--font) !important;
  text-transform: uppercase;
  letter-spacing: 0.06em;
}

html[data-theme="dos"] .btn-primary,
html[data-theme="dos"] .send-btn.has-text,
html[data-theme="dos"] .chip.active,
html[data-theme="dos"] .tab.active,
html[data-theme="dos"] .theme-opt.active {
  background: var(--dos-green) !important;
  color: #000 !important;
  border-color: var(--dos-green-bright) !important;
}

html[data-theme="dos"] .send-btn {
  width: auto !important;
  height: auto !important;
  min-width: 5.5rem;
  padding: 0.35rem 0.7rem !important;
  white-space: nowrap;
}
html[data-theme="dos"] .send-btn .send-ico-default {
  display: none !important;
}
html[data-theme="dos"] .send-btn .send-label-pixel {
  display: inline !important;
  font-family: var(--font) !important;
  text-transform: uppercase;
}

html[data-theme="dos"] .icon-btn:hover:not(:disabled),
html[data-theme="dos"] .btn-ghost:hover {
  background: #003300 !important;
  color: var(--dos-green-bright) !important;
}

html[data-theme="dos"] .chat-list li button {
  border-radius: 0 !important;
  border: 1px solid transparent !important;
  background: transparent !important;
  box-shadow: none !important;
  color: var(--dos-green) !important;
}
html[data-theme="dos"] .chat-list li button:hover {
  background: #001a00 !important;
  border-color: var(--dos-green-dim) !important;
}
html[data-theme="dos"] .chat-list li button.active {
  background: #002800 !important;
  border: 1px solid var(--dos-green) !important;
  box-shadow: none !important;
}
html[data-theme="dos"] .chat-list li button strong {
  color: var(--dos-green-bright) !important;
  text-shadow: none !important;
  font-family: var(--font) !important;
  font-size: 1.15rem !important;
  text-transform: none;
  font-weight: 400;
}
html[data-theme="dos"] .chat-list li button .preview,
html[data-theme="dos"] .chat-item-meta {
  color: var(--dos-green-dim) !important;
}
html[data-theme="dos"] .chat-unread-badge {
  border-radius: 0 !important;
  background: var(--dos-amber) !important;
  color: #000 !important;
  border: 1px solid var(--dos-amber) !important;
  box-shadow: none !important;
  font-family: var(--font) !important;
}

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

html[data-theme="dos"] .messages .row .bubble:not(.deleted) {
  border-radius: 0 !important;
  background: #001100 !important;
  color: var(--dos-green-bright) !important;
  border: 1px solid var(--dos-green) !important;
  box-shadow: none !important;
  filter: none !important;
}
html[data-theme="dos"] .messages .row.mine .bubble:not(.deleted) {
  background: #002200 !important;
  border-color: var(--dos-cyan) !important;
  color: var(--dos-cyan) !important;
}
html[data-theme="dos"] .messages .row .sender-name,
html[data-theme="dos"] .messages .row.mine .sender-name {
  color: var(--neon, var(--dos-amber)) !important;
  text-shadow: none !important;
  font-family: var(--font) !important;
  text-transform: uppercase;
  background: transparent;
  border: 0;
  box-shadow: none;
  padding: 0;
  font-size: 1.05rem !important;
}
html[data-theme="dos"] .bubble-body {
  font-family: var(--font) !important;
  font-size: 1.2rem;
}
html[data-theme="dos"] .bubble-foot {
  color: var(--dos-green-dim) !important;
}
html[data-theme="dos"] .day-sep {
  border-radius: 0 !important;
  background: #000 !important;
  color: var(--dos-amber) !important;
  border: 1px dashed var(--dos-green-dim) !important;
  box-shadow: none !important;
  text-shadow: none !important;
  font-family: var(--font) !important;
  text-transform: uppercase;
}

html[data-theme="dos"] .avatar,
html[data-theme="dos"] .avatar-wrap,
html[data-theme="dos"] .avatar-img {
  border-radius: 0 !important;
}
html[data-theme="dos"] .avatar {
  font-family: var(--font) !important;
  font-size: 1rem !important;
}
html[data-theme="dos"] .avatar:not(.has-img) {
  background-image: none !important;
  background-color: var(--av, #003300) !important;
  color: #003300;
  text-shadow: none !important;
  border: 1px solid var(--dos-green);
}
html[data-theme="dos"] .avatar:not(.has-img)::after {
  display: none !important;
}
html[data-theme="dos"] .avatar-wrap::after,
html[data-theme="dos"] #chat-avatar-wrap::after {
  border-radius: 0 !important;
  box-shadow: 0 0 0 1px var(--dos-green) !important;
}
html[data-theme="dos"] .status-dot {
  border-radius: 0 !important;
  border: 1px solid #000 !important;
  box-shadow: none !important;
}
html[data-theme="dos"] .status-dot.online {
  background: #66ff66 !important;
  box-shadow: 0 0 8px rgba(102, 255, 102, 0.95) !important;
}
html[data-theme="dos"] .send-btn {
  width: auto !important;
  height: auto !important;
  min-width: 6.5rem;
  padding: 0.45rem 0.9rem !important;
  white-space: nowrap;
  overflow: hidden;
}

html[data-theme="dos"] .composer-prompt {
  display: inline-block !important;
  color: var(--dos-green);
  font-family: var(--font);
  font-size: 1.2rem;
  padding-left: 0.25rem;
}
html[data-theme="dos"] .composer-hints,
html[data-theme="dos"] .pixel-rpg-hud {
  display: none !important;
}
html[data-theme="dos"] #message-input {
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

html[data-theme="dos"] .btn-jump-bottom {
  border-radius: 0 !important;
  background: #000 !important;
  color: var(--dos-green) !important;
  border: 1px solid var(--dos-green) !important;
  box-shadow: none !important;
}

html[data-theme="dos"] .ui-dialog::backdrop {
  background: rgba(0, 0, 0, 0.75);
}
html[data-theme="dos"] .ui-toast {
  border-radius: 0 !important;
  background: #001100 !important;
  color: var(--dos-green) !important;
  border: 1px solid var(--dos-green) !important;
  box-shadow: none !important;
  font-family: var(--font) !important;
}

html[data-theme="dos"] .console-screen,
html[data-theme="dos"] #settings-screen,
html[data-theme="dos"] #admin-screen {
  position: fixed !important;
  inset: 0 !important;
  z-index: 10060 !important;
  overflow: auto !important;
  height: 100vh !important;
  height: 100dvh !important;
  max-height: 100dvh !important;
}
html[data-theme="dos"] .ui-dialog {
  z-index: 10070 !important;
}
html[data-theme="dos"],
html[data-theme="dos"] body {
  overflow: hidden !important;
  height: 100% !important;
  max-height: 100dvh !important;
}
html[data-theme="dos"] .app-shell {
  overflow: hidden !important;
  max-height: calc(100dvh - 12px) !important;
}
html[data-theme="dos"] .chat-pane {
  display: grid !important;
  grid-template-rows: auto 1fr auto auto !important;
  min-height: 0 !important;
}
html[data-theme="dos"] .messages-stage {
  min-height: 0;
  overflow: hidden;
}
html[data-theme="dos"] .composer-wrap {
  flex-shrink: 0;
}
html[data-theme="dos"] .boot-splash-spinner {
  border-radius: 0 !important;
  border-color: var(--dos-green) transparent var(--dos-amber) transparent !important;
}

html[data-theme="dos"] .console-item.active {
  background: #003300 !important;
  color: var(--dos-green-bright) !important;
  box-shadow: inset 3px 0 0 var(--dos-green) !important;
}

html[data-theme="dos"] .theme-opt small {
  color: var(--dos-green-dim);
  text-transform: none;
}

html[data-theme="dos"] * {
  scrollbar-width: thin;
  scrollbar-color: var(--dos-green-dim) #000;
}
html[data-theme="dos"] *::-webkit-scrollbar {
  width: 10px;
}
html[data-theme="dos"] *::-webkit-scrollbar-thumb {
  background: var(--dos-green-dim);
  border: 1px solid var(--dos-green);
}
html[data-theme="dos"] *::-webkit-scrollbar-track {
  background: #000;
}

html[data-theme="dos"] .auth-screen,
html[data-theme="dos"] .console-screen {
  background: #000 !important;
}

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

html[data-theme="dos"] .lock-pill {
  background: #000;
  border-radius: 0;
  border: 1px solid var(--dos-green);
  color: var(--dos-green);
}

html[data-theme="dos"] body::after {
  content: '';
  position: fixed;
  inset: 0;
  pointer-events: none;
  z-index: 9999;
  background: repeating-linear-gradient(
    to bottom,
    transparent 0,
    transparent 2px,
    rgba(0, 0, 0, 0.12) 2px,
    rgba(0, 0, 0, 0.12) 3px
  );
  opacity: 0.45;
}