/* ============================================================
   NEOMS~DATABASE — THEME OVERRIDES FOR PRIMEDRIVE CHROME
   Applied last — remaps PrimeDrive blue palette to DB teal/dark.
   Keeps all PrimeDrive structural chrome (drag, resize, taskbar,
   start menu, icons) while preserving the SCP-horror aesthetic.
   ============================================================ */

/* ── FONTS ───────────────────────────────────────────────────── */
@import url("https://fonts.googleapis.com/css2?family=Share+Tech+Mono&family=VT323&display=swap");

/* ── BODY / DESKTOP BACKGROUND ───────────────────────────────── */
body {
  background: #060a0f !important;
  font-family: "Share Tech Mono", monospace !important;
}
body::before {
  background: rgba(0, 4, 10, 0.65) !important;
}

/* ── TOP LABEL BAR ────────────────────────────────────────────── */
.desk-label {
  background: linear-gradient(to bottom, #000c14 0%, #00262a 50%, #000c14 100%) !important;
  border-bottom: 1px solid #006666 !important;
}
.desk-label-title {
  font-family: "VT323", monospace !important;
  font-size: 14px !important;
  letter-spacing: 3px !important;
  color: #00eaff !important;
  font-style: normal !important;
  text-shadow: 0 0 8px rgba(0, 234, 255, 0.5) !important;
}
.desk-label-item {
  font-family: "Share Tech Mono", monospace !important;
  font-size: 10px !important;
  color: rgba(0, 204, 204, 0.65) !important;
  text-shadow: none !important;
  letter-spacing: 1px !important;
}

/* ── DESKTOP MAP SVG ──────────────────────────────────────────── */
#desktop-map-svg {
  position: absolute !important;
  inset: 0 !important;
  width: 100% !important;
  height: 100% !important;
  pointer-events: none !important;
  z-index: 0 !important;
  opacity: 0.72 !important;
}

/* ── DESKTOP ICONS ────────────────────────────────────────────── */
.desk-icon .icon-label {
  font-family: "VT323", monospace !important;
  font-size: 14px !important;
  color: #e8f0ff !important;
  text-shadow:
    1px 1px 0 #000,
    -1px 1px 0 #000,
    1px -1px 0 #000,
    -1px -1px 0 #000 !important;
  letter-spacing: 1px !important;
}
.desk-icon:hover .icon-label,
.desk-icon.selected .icon-label {
  color: #00eaff !important;
}
.desk-icon:hover {
  background: rgba(0, 180, 200, 0.18) !important;
  border-color: rgba(0, 200, 220, 0.4) !important;
}
.desk-icon.selected {
  background: rgba(0, 160, 180, 0.28) !important;
  border-color: #00cccc !important;
}

/* ── WINDOW CHROME ────────────────────────────────────────────── */
.win {
  border-color: #007070 !important;
  border-radius: 6px !important;
}
.win.focused {
  border-color: #00cccc !important;
  box-shadow:
    0 6px 28px rgba(0, 180, 200, 0.4),
    0 2px 8px rgba(0, 0, 0, 0.5) !important;
}
.win:not(.focused) {
  border-color: #004444 !important;
  box-shadow: 0 2px 10px rgba(0, 0, 0, 0.5) !important;
}

/* ── TITLE BAR ────────────────────────────────────────────────── */
.win-bar {
  background: linear-gradient(90deg, #000060 0%, #1084d0 50%, #000060 100%) !important;
  border-bottom: 1px solid #00aacc !important;
  border-radius: 3px 3px 0 0 !important;
}
.win-title {
  font-family: "Share Tech Mono", monospace !important;
  font-size: 11px !important;
  letter-spacing: 1.5px !important;
  color: #00eaff !important;
  text-shadow: 0 0 6px rgba(0, 200, 255, 0.5) !important;
}

/* ── WIN BODY ─────────────────────────────────────────────────── */
.win-body {
  background: #0a0a14 !important;
  border-top: 1px solid #003a3a !important;
  border-radius: 0 0 3px 3px !important;
}
.win-scroll {
  background: #0a0a14 !important;
  color: #8899aa !important;
  font-family: "Share Tech Mono", monospace !important;
  scrollbar-color: #00cccc #060a14 !important;
  padding: 0 !important;
}
.win-scroll::-webkit-scrollbar-thumb {
  background: #00cccc !important;
}
.win-scroll::-webkit-scrollbar {
  background: #060a14 !important;
}

/* ── RESIZE GRIP ──────────────────────────────────────────────── */
.win-resize {
  background-image:
    radial-gradient(circle, #00cccc 1.2px, transparent 1.2px),
    radial-gradient(circle, #00cccc 1.2px, transparent 1.2px),
    radial-gradient(circle, #00cccc 1.2px, transparent 1.2px),
    radial-gradient(circle, #00cccc 1.2px, transparent 1.2px),
    radial-gradient(circle, #00cccc 1.2px, transparent 1.2px),
    radial-gradient(circle, #00cccc 1.2px, transparent 1.2px) !important;
}

/* ── TOAST ────────────────────────────────────────────────────── */
#toast {
  border-color: #00cccc !important;
  background: #050a16 !important;
  color: #00eaff !important;
  font-family: "Share Tech Mono", monospace !important;
  font-size: 10px !important;
  letter-spacing: 1px !important;
}

/* ── TASKBAR ──────────────────────────────────────────────────── */
#taskbar {
  background: linear-gradient(to bottom, #000050 0%, #1068b0 5%, #0044bb 100%) !important;
  border-top: 1px solid #00aacc !important;
}
#start-btn {
  font-family: "Share Tech Mono", monospace !important;
  font-size: 11px !important;
  letter-spacing: 3px !important;
  background: linear-gradient(to bottom, #000060 0%, #1084d0 5%, #006aaa 100%) !important;
}
#start-btn:hover {
  background: linear-gradient(to bottom, #000080 0%, #00aacc 8%, #006aaa 100%) !important;
}
.tb-btn {
  font-family: "Share Tech Mono", monospace !important;
  font-size: 9px !important;
  letter-spacing: 0.5px !important;
}
.tb-btn.active {
  background: linear-gradient(to bottom, #004466 0%, #00cccc 5%, #005566 100%) !important;
}
#taskbar-clock {
  font-family: "VT323", monospace !important;
  font-size: 16px !important;
  letter-spacing: 2px !important;
  background: linear-gradient(to bottom, #000060 0%, #1068b0 5%, #006aaa 100%) !important;
}

/* ── CONTEXT MENU ─────────────────────────────────────────────── */
#ctx-menu {
  background: #050a16 !important;
  border-color: #00cccc !important;
  font-family: "Share Tech Mono", monospace !important;
}
.ctx-item {
  font-family: "Share Tech Mono", monospace !important;
  font-size: 10px !important;
  color: #8899cc !important;
}
.ctx-item:hover {
  background: rgba(0, 160, 180, 0.2) !important;
  color: #00eaff !important;
}
.ctx-sep {
  background: #003a3a !important;
}

/* ── START MENU ───────────────────────────────────────────────── */
#start-menu {
  background: #050a16 !important;
  border-color: #00cccc !important;
  font-family: "Share Tech Mono", monospace !important;
}
.start-header {
  background: linear-gradient(to bottom, #000060 0%, #1084d0 40%, #000050 100%) !important;
  font-family: "VT323", monospace !important;
  font-size: 16px !important;
  letter-spacing: 4px !important;
  color: #fff !important;
}
.start-user {
  background: rgba(0, 4, 16, 0.8) !important;
  border-right-color: #003a3a !important;
}
.start-avatar {
  border-color: #00cccc !important;
  box-shadow: 0 0 12px rgba(0, 200, 220, 0.4) !important;
}
.start-username {
  font-family: "Share Tech Mono", monospace !important;
  font-size: 10px !important;
  color: #8899cc !important;
}
.start-usertag {
  font-family: "Share Tech Mono", monospace !important;
  font-size: 9px !important;
  color: #334455 !important;
}
.start-sep {
  background: #003a3a !important;
}
.start-social {
  color: #667788 !important;
  font-family: "Share Tech Mono", monospace !important;
  font-size: 9px !important;
}
.start-social:hover {
  background: rgba(0, 140, 160, 0.2) !important;
  color: #00eaff !important;
}
.start-apps {
  scrollbar-color: #00cccc #050a16 !important;
}
.start-apps-title {
  font-family: "Share Tech Mono", monospace !important;
  font-size: 8px !important;
  letter-spacing: 3px !important;
  color: #334455 !important;
  border-bottom-color: #0a1a24 !important;
}
.start-item {
  font-family: "Share Tech Mono", monospace !important;
  font-size: 10px !important;
  color: #8899cc !important;
  border-bottom-color: #0a1420 !important;
}
.start-item:hover {
  background: rgba(0, 140, 160, 0.2) !important;
  color: #00eaff !important;
}

/* ── CLEARANCE INDICATOR ──────────────────────────────────────── */
#clearance-indicator {
  display: flex;
  align-items: center;
  gap: 4px;
  padding: 0 10px;
  height: 100%;
  border-left: 1px solid rgba(0, 200, 220, 0.25);
  cursor: pointer;
  flex-shrink: 0;
}
.clr-label {
  font-family: "Share Tech Mono", monospace;
  font-size: 10px;
  letter-spacing: 1px;
  color: rgba(0, 220, 255, 0.85);
  margin-right: 2px;
}
.clr-dot {
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: rgba(255, 255, 255, 0.12);
  border: 1px solid rgba(0, 200, 220, 0.3);
}
.clr-dot.active {
  background: #00cccc;
  border-color: #fff;
  box-shadow: 0 0 5px #00cccc;
}

/* ── DB ICON (emoji in start menu) ───────────────────────────── */
.start-item-icon.db-ico {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-family: "VT323", monospace;
  font-size: 14px;
  color: #cc0000;
  text-shadow: 0 0 4px rgba(0, 200, 220, 0.5);
  width: 16px;
  height: 16px;
  flex-shrink: 0;
}

/* ── OPEN ANIMATION — teal glow instead of blue ──────────────── */
@keyframes winOpen {
  0%   { opacity: 0; transform: scale(0.88); }
  100% { opacity: 1; transform: scale(1); }
}
@keyframes winClose {
  0%   { opacity: 1; transform: scale(1); }
  100% { opacity: 0; transform: scale(0.88); }
}