/*
 * Futuristic / Cyber theme.
 * Translucent panels, neon glow borders, HUD aesthetic.
 * Glass-morphism with scan-line effects.
 */

body.futuristic-theme {
  /* Title Bar */
  --ActiveTitle: rgba(0, 20, 40, 0.85);
  --GradientActiveTitle: rgba(0, 40, 60, 0.85);
  --TitleText: #00e5ff;
  --InactiveTitle: rgba(0, 10, 20, 0.7);
  --GradientInactiveTitle: rgba(0, 20, 30, 0.7);
  --InactiveTitleText: rgba(0, 180, 220, 0.4);

  /* Buttons & Panels */
  --ButtonFace: rgba(0, 15, 30, 0.9);
  --ButtonText: #00d4ff;
  --ButtonLight: rgba(0, 40, 60, 0.6);
  --ButtonHilight: rgba(0, 200, 255, 0.15);
  --ButtonShadow: rgba(0, 0, 0, 0.4);
  --ButtonDkShadow: rgba(0, 0, 0, 0.6);

  /* Window */
  --Window: rgba(0, 8, 16, 0.95);
  --WindowText: #b8e0ff;
  --WindowFrame: rgba(0, 200, 255, 0.3);

  /* Desktop */
  --Background: #020810;

  /* Selection */
  --Hilight: rgba(0, 200, 255, 0.25);
  --HilightText: #00ffff;
  --MenuHilight: rgba(0, 200, 255, 0.2);

  /* Menu */
  --Menu: rgba(0, 12, 24, 0.92);
  --MenuText: rgba(0, 200, 255, 0.85);
  --MenuBar: rgba(0, 15, 30, 0.9);

  /* Other */
  --Scrollbar: rgba(0, 20, 40, 0.6);
  --GrayText: rgba(0, 150, 200, 0.35);

  /* Layout overrides */
  --border-width: 1px;
  --folder-color: #00c8ff;
}

/* ─── Taskbar ────────────────────────────────────────────────────────── */

body.futuristic-theme .taskbar {
  background: rgba(0, 8, 20, 0.82);
  backdrop-filter: blur(20px) saturate(1.4);
  -webkit-backdrop-filter: blur(20px) saturate(1.4);
  border-top: 1px solid rgba(0, 200, 255, 0.25);
  box-shadow:
    0 -1px 20px rgba(0, 180, 255, 0.08),
    inset 0 1px 0 rgba(0, 200, 255, 0.05);
}

body.futuristic-theme .taskbar__start {
  background: linear-gradient(135deg, rgba(0, 180, 255, 0.15), rgba(0, 100, 200, 0.25));
  border: 1px solid rgba(0, 200, 255, 0.35);
  border-radius: 4px;
  color: #00e5ff;
  text-shadow: 0 0 8px rgba(0, 229, 255, 0.5);
  transition: all 0.2s ease;
}

body.futuristic-theme .taskbar__start:hover {
  background: linear-gradient(135deg, rgba(0, 180, 255, 0.3), rgba(0, 100, 200, 0.4));
  border-color: rgba(0, 229, 255, 0.6);
  box-shadow: 0 0 15px rgba(0, 200, 255, 0.25);
}

body.futuristic-theme .taskbar__start:active {
  background: linear-gradient(135deg, rgba(0, 140, 200, 0.4), rgba(0, 80, 160, 0.5));
  border-color: rgba(0, 229, 255, 0.7);
}

body.futuristic-theme .taskbar__program-btn {
  background: rgba(0, 20, 40, 0.5);
  border: 1px solid rgba(0, 200, 255, 0.12);
  border-radius: 3px;
  color: rgba(0, 200, 255, 0.65);
  transition: all 0.15s ease;
}

body.futuristic-theme .taskbar__program-btn:hover {
  background: rgba(0, 40, 80, 0.4);
  border-color: rgba(0, 200, 255, 0.25);
  color: rgba(0, 200, 255, 0.85);
}

body.futuristic-theme .taskbar__program-btn.active {
  background: rgba(0, 60, 100, 0.4);
  border-color: rgba(0, 200, 255, 0.4);
  color: #00e5ff;
  box-shadow: 0 0 8px rgba(0, 200, 255, 0.12);
}

body.futuristic-theme .taskbar__tray {
  background: rgba(0, 15, 30, 0.4);
  border: 1px solid rgba(0, 200, 255, 0.08);
  border-radius: 3px;
}

body.futuristic-theme .taskbar__clock {
  color: #00e5ff;
  text-shadow: 0 0 6px rgba(0, 229, 255, 0.4);
  font-family: 'Courier New', monospace;
  letter-spacing: 1px;
}

/* ─── Windows ────────────────────────────────────────────────────────── */

body.futuristic-theme ui-dialog {
  background: rgba(0, 10, 20, 0.9);
  backdrop-filter: blur(12px) saturate(1.2);
  -webkit-backdrop-filter: blur(12px) saturate(1.2);
  border: 1px solid rgba(0, 200, 255, 0.2);
  border-radius: 6px;
  box-shadow:
    0 0 25px rgba(0, 150, 255, 0.08),
    0 8px 32px rgba(0, 0, 0, 0.5);
}

body.futuristic-theme ui-dialog.active {
  border-color: rgba(0, 200, 255, 0.3);
  box-shadow:
    0 0 30px rgba(0, 150, 255, 0.12),
    0 8px 32px rgba(0, 0, 0, 0.5);
}

body.futuristic-theme ui-dialog:not(.active) {
  border-color: rgba(0, 200, 255, 0.08);
  box-shadow: 0 4px 20px rgba(0, 0, 0, 0.5);
}

body.futuristic-theme .ui-dialog__titlebar {
  background: linear-gradient(to right, rgba(0, 25, 45, 0.95), rgba(0, 40, 65, 0.9));
  border-bottom: 1px solid rgba(0, 200, 255, 0.15);
  border-radius: 5px 5px 0 0;
  padding: 4px 8px;
  position: relative;
}

/* Scan-line overlay on active titlebar */
body.futuristic-theme ui-dialog.active .ui-dialog__titlebar::after {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: repeating-linear-gradient(
    0deg,
    transparent,
    transparent 2px,
    rgba(0, 200, 255, 0.025) 2px,
    rgba(0, 200, 255, 0.025) 4px
  );
  pointer-events: none;
  border-radius: 5px 5px 0 0;
}

body.futuristic-theme .ui-dialog__title {
  letter-spacing: 0.5px;
  font-weight: 500;
}

body.futuristic-theme .ui-dialog__btn {
  width: 20px;
  height: 20px;
  background: transparent;
  border: 1px solid rgba(0, 200, 255, 0.25);
  border-radius: 3px;
  color: rgba(0, 210, 255, 0.7);
  transition: all 0.15s ease;
}

body.futuristic-theme .ui-dialog__btn:hover {
  background: rgba(0, 200, 255, 0.12);
  border-color: rgba(0, 200, 255, 0.5);
  color: #00e5ff;
  box-shadow: 0 0 8px rgba(0, 200, 255, 0.2);
}

body.futuristic-theme .ui-dialog__btn--close:hover {
  background: rgba(255, 50, 50, 0.25);
  border-color: rgba(255, 80, 80, 0.5);
  color: #ff6060;
  box-shadow: 0 0 8px rgba(255, 50, 50, 0.2);
}

body.futuristic-theme .ui-dialog__content {
  border-radius: 0 0 5px 5px;
}

/* ─── Menus ──────────────────────────────────────────────────────────── */

body.futuristic-theme ui-menu,
body.futuristic-theme .ui-menu {
  background: rgba(0, 10, 25, 0.9);
  backdrop-filter: blur(16px) saturate(1.3);
  -webkit-backdrop-filter: blur(16px) saturate(1.3);
  border: 1px solid rgba(0, 200, 255, 0.15);
  border-radius: 4px;
  box-shadow: 0 4px 24px rgba(0, 0, 0, 0.5), 0 0 12px rgba(0, 150, 255, 0.06);
}

body.futuristic-theme .ui-menu__menuitem:hover {
  background: rgba(0, 200, 255, 0.1);
  border-radius: 2px;
}

body.futuristic-theme .ui-menu__separator {
  border-top: 1px solid rgba(0, 200, 255, 0.08);
  border-bottom: none;
}

/* ─── Start Menu ─────────────────────────────────────────────────────── */

body.futuristic-theme .start-menu-panel {
  background: rgba(0, 10, 25, 0.9);
  backdrop-filter: blur(20px) saturate(1.3);
  -webkit-backdrop-filter: blur(20px) saturate(1.3);
  border: 1px solid rgba(0, 200, 255, 0.15);
  border-radius: 6px 6px 0 0;
  box-shadow: 0 -4px 30px rgba(0, 150, 255, 0.08), 0 4px 20px rgba(0, 0, 0, 0.5);
}

body.futuristic-theme .start-menu__search {
  background: rgba(0, 15, 30, 0.4);
  border-top: 1px solid rgba(0, 200, 255, 0.08);
}

body.futuristic-theme .start-menu__search-input {
  background: rgba(0, 10, 20, 0.8);
  border: 1px solid rgba(0, 200, 255, 0.15);
  color: #b8e0ff;
  border-radius: 3px;
}

body.futuristic-theme .start-menu__search-input:focus {
  border-color: rgba(0, 200, 255, 0.4);
  box-shadow: 0 0 8px rgba(0, 200, 255, 0.12);
}

/* ─── Desktop Icons ──────────────────────────────────────────────────── */

body.futuristic-theme .desktop__icons .icon__label {
  color: #b8e0ff;
  text-shadow: 0 0 6px rgba(0, 180, 255, 0.35), 0 1px 3px rgba(0, 0, 0, 0.8);
}

body.futuristic-theme .desktop__icons .icon:focus .icon__label,
body.futuristic-theme .desktop__icons .icon.selected .icon__label {
  background: rgba(0, 200, 255, 0.15);
  border-radius: 2px;
}

/* ─── Dialog Buttons & Inputs ────────────────────────────────────────── */

body.futuristic-theme .ui-dialog__ok-btn,
body.futuristic-theme .ui-dialog__cancel-btn {
  background: rgba(0, 25, 45, 0.8);
  border: 1px solid rgba(0, 200, 255, 0.25);
  border-radius: 3px;
  color: #00d4ff;
  transition: all 0.15s ease;
}

body.futuristic-theme .ui-dialog__ok-btn:hover,
body.futuristic-theme .ui-dialog__cancel-btn:hover {
  background: rgba(0, 45, 70, 0.6);
  border-color: rgba(0, 200, 255, 0.45);
  box-shadow: 0 0 8px rgba(0, 200, 255, 0.15);
}

body.futuristic-theme .ui-dialog__input {
  background: rgba(0, 10, 20, 0.8);
  border: 1px solid rgba(0, 200, 255, 0.15);
  color: #b8e0ff;
  border-radius: 3px;
}

body.futuristic-theme .ui-dialog__input:focus {
  border-color: rgba(0, 200, 255, 0.4);
  box-shadow: 0 0 6px rgba(0, 200, 255, 0.12);
}

body.futuristic-theme .ui-dialog__field input,
body.futuristic-theme .ui-dialog__field textarea,
body.futuristic-theme .ui-dialog__field select {
  background: rgba(0, 10, 20, 0.8);
  border: 1px solid rgba(0, 200, 255, 0.15);
  color: #b8e0ff;
  border-radius: 3px;
}

body.futuristic-theme .ui-dialog__field input:focus,
body.futuristic-theme .ui-dialog__field textarea:focus,
body.futuristic-theme .ui-dialog__field select:focus {
  border-color: rgba(0, 200, 255, 0.4);
  box-shadow: 0 0 6px rgba(0, 200, 255, 0.12);
}

/* ─── Scrollbars ─────────────────────────────────────────────────────── */

body.futuristic-theme ::-webkit-scrollbar {
  width: 6px;
  height: 6px;
}

body.futuristic-theme ::-webkit-scrollbar-track {
  background: rgba(0, 10, 20, 0.4);
}

body.futuristic-theme ::-webkit-scrollbar-thumb {
  background: rgba(0, 200, 255, 0.18);
  border-radius: 3px;
}

body.futuristic-theme ::-webkit-scrollbar-thumb:hover {
  background: rgba(0, 200, 255, 0.3);
}

/* ─── Explorer / File Manager overrides ──────────────────────────────── */

body.futuristic-theme .explorer-sidebar {
  background: rgba(0, 12, 24, 0.9);
  border-right: 1px solid rgba(0, 200, 255, 0.1);
}

body.futuristic-theme .explorer-toolbar {
  background: rgba(0, 15, 30, 0.8);
  border-bottom: 1px solid rgba(0, 200, 255, 0.1);
}