/**
 * ثيمات HUD سينمائية — Iron Man / Star Wars
 * يُطبَّق على html/body ويرثه #moduleContent وكل الشاشات
 */

@import url("https://fonts.googleapis.com/css2?family=Orbitron:wght@500;700;800&family=Rajdhani:wght@500;600;700&display=swap");

/* ——— متغيرات مشتركة + تأثيرات HUD ——— */
body[class*="sigma-theme-base-hud-"],
body.sigma-theme-base-jarvis {
  --hud-font-display: "Orbitron", "Rajdhani", "Segoe UI", sans-serif;
  --hud-font-ui: "Rajdhani", "Cairo", "Segoe UI", sans-serif;
  --hud-scanline: rgba(255, 255, 255, 0.03);
  --hud-grid: rgba(0, 212, 255, 0.05);
  --hud-panel-bg: rgba(6, 14, 28, 0.82);
  --hud-corner: var(--accent-color);
}

body[class*="sigma-theme-base-hud-"].dark-mode,
body.sigma-theme-base-jarvis.dark-mode {
  background-color: var(--bg-body);
  background-image:
    linear-gradient(var(--hud-scanline) 1px, transparent 1px),
    linear-gradient(90deg, var(--hud-scanline) 1px, transparent 1px),
    linear-gradient(var(--hud-grid) 1px, transparent 1px),
    linear-gradient(90deg, var(--hud-grid) 1px, transparent 1px),
    radial-gradient(ellipse 100% 60% at 50% -10%, color-mix(in srgb, var(--accent-color) 22%, transparent) 0%, transparent 55%),
    radial-gradient(ellipse 70% 45% at 100% 100%, color-mix(in srgb, var(--accent-color) 10%, transparent) 0%, transparent 50%);
  background-size: 100% 3px, 100% 3px, 48px 48px, 48px 48px, 100% 100%, 100% 100%;
}

body[class*="sigma-theme-base-hud-"] .sidebar,
body.sigma-theme-base-jarvis .sidebar {
  border-left: 1px solid color-mix(in srgb, var(--accent-color) 45%, transparent);
  box-shadow:
    -6px 0 32px color-mix(in srgb, var(--accent-color) 12%, transparent),
    inset 0 0 48px color-mix(in srgb, var(--accent-color) 6%, transparent);
  backdrop-filter: blur(8px);
}

body[class*="sigma-theme-base-hud-"] .header,
body.sigma-theme-base-jarvis .header {
  border-bottom: 1px solid color-mix(in srgb, var(--accent-color) 40%, transparent);
  box-shadow: 0 4px 24px color-mix(in srgb, var(--accent-color) 10%, transparent);
  backdrop-filter: blur(10px);
}

body[class*="sigma-theme-base-hud-"] .brand,
body.sigma-theme-base-jarvis .brand {
  font-family: var(--hud-font-display);
  letter-spacing: 0.12em;
  text-shadow: 0 0 16px var(--accent-glow), 0 0 32px color-mix(in srgb, var(--accent-color) 35%, transparent);
  color: var(--accent-color);
}

body[class*="sigma-theme-base-hud-"] .stat-card,
body[class*="sigma-theme-base-hud-"] .chart-card,
body[class*="sigma-theme-base-hud-"] .activity-section,
body[class*="sigma-theme-base-hud-"] .sd-panel,
body.sigma-theme-base-jarvis .stat-card,
body.sigma-theme-base-jarvis .chart-card,
body.sigma-theme-base-jarvis .activity-section {
  position: relative;
  border: 1px solid color-mix(in srgb, var(--accent-color) 38%, transparent) !important;
  background: var(--hud-panel-bg) !important;
  box-shadow:
    0 0 24px color-mix(in srgb, var(--accent-color) 10%, transparent),
    inset 0 0 1px color-mix(in srgb, var(--accent-color) 35%, transparent) !important;
  backdrop-filter: blur(6px);
}

body[class*="sigma-theme-base-hud-"] .stat-card::before,
body[class*="sigma-theme-base-hud-"] .chart-card::before,
body[class*="sigma-theme-base-hud-"] .sd-panel::before,
body.sigma-theme-base-jarvis .stat-card::before,
body.sigma-theme-base-jarvis .chart-card::before {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  border-radius: inherit;
  background:
    linear-gradient(var(--accent-color), var(--accent-color)) top left / 14px 2px no-repeat,
    linear-gradient(var(--accent-color), var(--accent-color)) top left / 2px 14px no-repeat,
    linear-gradient(var(--accent-color), var(--accent-color)) top right / 14px 2px no-repeat,
    linear-gradient(var(--accent-color), var(--accent-color)) top right / 2px 14px no-repeat,
    linear-gradient(var(--accent-color), var(--accent-color)) bottom left / 14px 2px no-repeat,
    linear-gradient(var(--accent-color), var(--accent-color)) bottom left / 2px 14px no-repeat,
    linear-gradient(var(--accent-color), var(--accent-color)) bottom right / 14px 2px no-repeat,
    linear-gradient(var(--accent-color), var(--accent-color)) bottom right / 2px 14px no-repeat;
  opacity: 0.75;
}

body[class*="sigma-theme-base-hud-"] .theme-toggle,
body[class*="sigma-theme-base-hud-"] .theme-picker-open-btn,
body.sigma-theme-base-jarvis .theme-toggle,
body.sigma-theme-base-jarvis .theme-picker-open-btn {
  border: 1px solid color-mix(in srgb, var(--accent-color) 55%, transparent) !important;
  box-shadow: 0 0 14px color-mix(in srgb, var(--accent-color) 25%, transparent);
  color: var(--accent-color);
}

body[class*="sigma-theme-base-hud-"] .page-title,
body.sigma-theme-base-jarvis .page-title {
  font-family: var(--hud-font-display);
  letter-spacing: 0.06em;
  text-shadow: 0 0 12px var(--accent-glow);
}

/* ——— JARVIS (Iron Man) ——— */
body.sigma-theme-base-jarvis.dark-mode {
  --hud-grid: rgba(0, 212, 255, 0.06);
  --hud-scanline: rgba(0, 212, 255, 0.04);
}

/* ——— HUD STARK — Stark Industries Mainframe ——— */
body.sigma-theme-base-hud-stark.dark-mode {
  --accent-color: #00e5ff;
  --accent-hover: #7df9ff;
  --accent-glow: rgba(0, 229, 255, 0.6);
  --bg-body: #020810;
  --sidebar-bg-start: #030c18;
  --sidebar-bg-end: #061428;
  --sidebar-text: #c8f4ff;
  --sidebar-hover: rgba(0, 229, 255, 0.14);
  --sidebar-active: rgba(0, 229, 255, 0.26);
  --card-bg: rgba(4, 18, 36, 0.9);
  --header-bg: rgba(3, 14, 28, 0.94);
  --text-primary: #dffaff;
  --text-secondary: #5ec8e8;
  --text-light: #3a90b0;
  --border-color: rgba(0, 229, 255, 0.32);
  --input-bg: rgba(2, 16, 32, 0.92);
  --hud-panel-bg: rgba(3, 16, 32, 0.88);
}
body.sigma-theme-base-hud-stark:not(.dark-mode) {
  --accent-color: #0088bb;
  --accent-hover: #00a8dd;
  --accent-glow: rgba(0, 136, 187, 0.35);
  --bg-body: #e8f8ff;
  --sidebar-bg-start: #d0f0ff;
  --sidebar-bg-end: #b8e8ff;
  --sidebar-text: #042838;
  --sidebar-hover: rgba(0, 150, 200, 0.12);
  --sidebar-active: rgba(0, 180, 220, 0.2);
  --card-bg: rgba(255, 255, 255, 0.94);
  --header-bg: rgba(255, 255, 255, 0.98);
  --text-primary: #042838;
  --text-secondary: #2a6888;
  --border-color: rgba(0, 180, 220, 0.28);
  --input-bg: #f0faff;
  --hud-panel-bg: rgba(255, 255, 255, 0.92);
}

/* ——— HUD ARC — Arc Reactor Core ——— */
body.sigma-theme-base-hud-arc.dark-mode {
  --accent-color: #00ffd2;
  --accent-hover: #80ffe8;
  --accent-glow: rgba(0, 255, 210, 0.55);
  --bg-body: #000608;
  --sidebar-bg-start: #020a0c;
  --sidebar-bg-end: #041418;
  --sidebar-text: #b8fff0;
  --sidebar-hover: rgba(0, 255, 210, 0.12);
  --sidebar-active: rgba(0, 255, 210, 0.24);
  --card-bg: rgba(2, 20, 24, 0.92);
  --header-bg: rgba(2, 16, 20, 0.95);
  --text-primary: #d4fff8;
  --text-secondary: #4ec8b0;
  --border-color: rgba(0, 255, 210, 0.3);
  --input-bg: rgba(2, 18, 22, 0.9);
  --hud-grid: rgba(0, 255, 210, 0.05);
}
body.sigma-theme-base-hud-arc:not(.dark-mode) {
  --accent-color: #00b894;
  --accent-hover: #00d4aa;
  --accent-glow: rgba(0, 184, 148, 0.35);
  --bg-body: #eefcf8;
  --card-bg: #fff;
  --header-bg: #fff;
  --text-primary: #083828;
  --text-secondary: #2a7868;
  --border-color: rgba(0, 184, 148, 0.25);
  --input-bg: #f0faf6;
  --hud-panel-bg: rgba(255, 255, 255, 0.94);
}

/* ——— HUD IMPERIAL — Star Wars Imperial ——— */
body.sigma-theme-base-hud-imperial.dark-mode {
  --accent-color: #ff3b2e;
  --accent-hover: #ff6b5c;
  --accent-glow: rgba(255, 59, 46, 0.58);
  --bg-body: #080404;
  --sidebar-bg-start: #120808;
  --sidebar-bg-end: #1a0c0c;
  --sidebar-text: #ffd8d4;
  --sidebar-hover: rgba(255, 59, 46, 0.14);
  --sidebar-active: rgba(255, 59, 46, 0.28);
  --card-bg: rgba(24, 8, 8, 0.92);
  --header-bg: rgba(18, 6, 6, 0.95);
  --text-primary: #ffe8e6;
  --text-secondary: #e08078;
  --text-light: #a05850;
  --border-color: rgba(255, 59, 46, 0.35);
  --input-bg: rgba(20, 6, 6, 0.9);
  --hud-grid: rgba(255, 59, 46, 0.05);
  --hud-scanline: rgba(255, 80, 60, 0.04);
}
body.sigma-theme-base-hud-imperial:not(.dark-mode) {
  --accent-color: #cc2018;
  --accent-hover: #e03028;
  --accent-glow: rgba(204, 32, 24, 0.35);
  --bg-body: #fff5f4;
  --card-bg: #fff;
  --header-bg: #fff;
  --text-primary: #3a1010;
  --text-secondary: #884040;
  --border-color: rgba(204, 32, 24, 0.22);
  --input-bg: #fff0ee;
  --hud-panel-bg: rgba(255, 255, 255, 0.94);
}

/* ——— HUD REBEL — Rebel Tactical HUD ——— */
body.sigma-theme-base-hud-rebel.dark-mode {
  --accent-color: #00ffd2;
  --accent-hover: #5cffe0;
  --accent-glow: rgba(0, 255, 210, 0.5);
  --bg-body: #040a0c;
  --sidebar-bg-start: #061014;
  --sidebar-bg-end: #0a1a20;
  --sidebar-text: #c8fff4;
  --sidebar-hover: rgba(0, 255, 210, 0.12);
  --sidebar-active: rgba(0, 255, 210, 0.22);
  --card-bg: rgba(6, 22, 28, 0.9);
  --header-bg: rgba(4, 18, 24, 0.94);
  --text-primary: #d8fff8;
  --text-secondary: #50c8b0;
  --border-color: rgba(0, 255, 210, 0.28);
  --input-bg: rgba(4, 18, 24, 0.9);
  --hud-grid: rgba(0, 255, 210, 0.04);
}
body.sigma-theme-base-hud-rebel:not(.dark-mode) {
  --accent-color: #009980;
  --accent-hover: #00b898;
  --accent-glow: rgba(0, 153, 128, 0.32);
  --bg-body: #eefaf6;
  --card-bg: #fff;
  --text-primary: #083830;
  --border-color: rgba(0, 153, 128, 0.22);
  --input-bg: #f0faf6;
  --hud-panel-bg: rgba(255, 255, 255, 0.94);
}

/* ——— HUD NEBULA — Holographic Command ——— */
body.sigma-theme-base-hud-nebula.dark-mode {
  --accent-color: #b06cff;
  --accent-hover: #d0a0ff;
  --accent-glow: rgba(176, 108, 255, 0.55);
  --bg-body: #08040f;
  --sidebar-bg-start: #0c0618;
  --sidebar-bg-end: #140a24;
  --sidebar-text: #ecd8ff;
  --sidebar-hover: rgba(176, 108, 255, 0.14);
  --sidebar-active: rgba(176, 108, 255, 0.26);
  --card-bg: rgba(16, 8, 32, 0.9);
  --header-bg: rgba(12, 6, 24, 0.94);
  --text-primary: #f0e4ff;
  --text-secondary: #b090d8;
  --border-color: rgba(176, 108, 255, 0.32);
  --input-bg: rgba(12, 6, 24, 0.9);
  --hud-grid: rgba(176, 108, 255, 0.05);
}
body.sigma-theme-base-hud-nebula:not(.dark-mode) {
  --accent-color: #8840cc;
  --accent-hover: #a060e0;
  --accent-glow: rgba(136, 64, 204, 0.32);
  --bg-body: #f6f0fc;
  --card-bg: #fff;
  --text-primary: #2a1048;
  --border-color: rgba(136, 64, 204, 0.22);
  --input-bg: #f4ecfc;
  --hud-panel-bg: rgba(255, 255, 255, 0.94);
}

/* ——— HUD SITH — Dark Side Red Core ——— */
body.sigma-theme-base-hud-sith.dark-mode {
  --accent-color: #ff2244;
  --accent-hover: #ff5570;
  --accent-glow: rgba(255, 34, 68, 0.62);
  --bg-body: #000000;
  --sidebar-bg-start: #0a0004;
  --sidebar-bg-end: #140008;
  --sidebar-text: #ffc8d4;
  --sidebar-hover: rgba(255, 34, 68, 0.16);
  --sidebar-active: rgba(255, 34, 68, 0.3);
  --card-bg: rgba(12, 0, 4, 0.94);
  --header-bg: rgba(8, 0, 2, 0.96);
  --text-primary: #ffe0e8;
  --text-secondary: #e06078;
  --border-color: rgba(255, 34, 68, 0.38);
  --input-bg: rgba(10, 0, 4, 0.92);
  --hud-grid: rgba(255, 34, 68, 0.06);
  --hud-scanline: rgba(255, 40, 60, 0.05);
}
body.sigma-theme-base-hud-sith:not(.dark-mode) {
  --accent-color: #cc1030;
  --accent-hover: #e02040;
  --accent-glow: rgba(204, 16, 48, 0.35);
  --bg-body: #fff0f4;
  --card-bg: #fff;
  --text-primary: #300818;
  --border-color: rgba(204, 16, 48, 0.22);
  --input-bg: #fff4f6;
  --hud-panel-bg: rgba(255, 255, 255, 0.94);
}

/* ——— تطبيق HUD على الموديولات ——— */
body[class*="sigma-theme-base-hud-"] #moduleContent,
body[class*="sigma-theme-base-hud-"] .sigma-module-host,
body.sigma-theme-base-jarvis #moduleContent,
body.sigma-theme-base-jarvis .sigma-module-host,
.sigma-module-host[class*="sigma-theme-base-hud-"],
.sigma-module-host.sigma-theme-base-jarvis,
#moduleContent[class*="sigma-theme-base-hud-"],
#moduleContent.sigma-theme-base-jarvis {
  color: var(--text-primary);
}

body[class*="sigma-theme-base-hud-"] #moduleContent .form-container,
body[class*="sigma-theme-base-hud-"] #moduleContent .view-all-container,
body[class*="sigma-theme-base-hud-"] .sigma-module-host .form-container,
body.sigma-theme-base-jarvis #moduleContent .form-container,
body.sigma-theme-base-jarvis #moduleContent .view-all-container,
.sigma-module-host[class*="sigma-theme-base-hud-"] .form-container,
.sigma-module-host[class*="sigma-theme-base-hud-"] .view-all-container,
.sigma-module-host.sigma-theme-base-jarvis .form-container,
#moduleContent[class*="sigma-theme-base-hud-"] .form-container,
#moduleContent[class*="sigma-theme-base-hud-"] .view-all-container {
  background: var(--hud-panel-bg);
  border: 1px solid color-mix(in srgb, var(--accent-color) 30%, transparent);
  box-shadow: 0 0 20px color-mix(in srgb, var(--accent-color) 8%, transparent);
}

body[class*="sigma-theme-base-hud-"] #moduleContent .view-all-table thead th,
body[class*="sigma-theme-base-hud-"] .sigma-module-host .view-all-table thead th,
body.sigma-theme-base-jarvis #moduleContent .view-all-table thead th {
  background: color-mix(in srgb, var(--accent-color) 18%, var(--card-bg)) !important;
  color: var(--text-primary) !important;
  border-color: color-mix(in srgb, var(--accent-color) 35%, transparent) !important;
  text-shadow: 0 0 8px color-mix(in srgb, var(--accent-color) 40%, transparent);
}

body[class*="sigma-theme-base-hud-"] #moduleContent .station-toolbar-btn,
body[class*="sigma-theme-base-hud-"] .sigma-module-host .station-toolbar-btn,
body.sigma-theme-base-jarvis #moduleContent .station-toolbar-btn {
  border-color: color-mix(in srgb, var(--accent-color) 45%, transparent) !important;
  background: color-mix(in srgb, var(--accent-color) 8%, var(--card-bg)) !important;
  color: var(--text-primary) !important;
  box-shadow: 0 0 10px color-mix(in srgb, var(--accent-color) 12%, transparent);
}

body[class*="sigma-theme-base-hud-"] #moduleContent input:not([type="button"]):not([type="submit"]),
body[class*="sigma-theme-base-hud-"] #moduleContent select,
body[class*="sigma-theme-base-hud-"] #moduleContent textarea,
body.sigma-theme-base-jarvis #moduleContent input:not([type="button"]):not([type="submit"]),
body.sigma-theme-base-jarvis #moduleContent select,
body.sigma-theme-base-jarvis #moduleContent textarea {
  background: var(--input-bg) !important;
  border-color: color-mix(in srgb, var(--accent-color) 35%, transparent) !important;
  color: var(--text-primary) !important;
}

body[class*="sigma-theme-base-hud-"] .menu a:hover,
body.sigma-theme-base-jarvis .menu a:hover {
  text-shadow: 0 0 8px var(--accent-glow);
}

/* خطوط مسح HUD — طبقة ثابتة لا تؤثر على التمرير */
html:has(body[class*="sigma-theme-base-hud-"])::before,
html:has(body.sigma-theme-base-jarvis)::before {
  content: "";
  position: fixed;
  inset: 0;
  pointer-events: none;
  z-index: 9997;
  background: repeating-linear-gradient(
    0deg,
    transparent,
    transparent 2px,
    rgba(0, 0, 0, 0.028) 2px,
    rgba(0, 0, 0, 0.028) 4px
  );
  opacity: 0.28;
}

body[class*="sigma-theme-base-hud-"]::after,
body.sigma-theme-base-jarvis::after {
  display: none;
}

body[class*="sigma-theme-base-hud-"] .theme-picker-open-btn.is-active,
body[class*="sigma-theme-base-hud-"] .theme-picker-open-btn[aria-expanded="true"],
body.sigma-theme-base-jarvis .theme-picker-open-btn.is-active,
body.sigma-theme-base-jarvis .theme-picker-open-btn[aria-expanded="true"] {
  border-color: var(--accent-color) !important;
  background: color-mix(in srgb, var(--accent-color) 18%, var(--card-bg)) !important;
  color: var(--accent-color) !important;
  box-shadow: 0 0 20px var(--accent-glow) !important;
}

body[class*="sigma-theme-base-hud-"] .theme-picker-open-btn:hover i,
body.sigma-theme-base-jarvis .theme-picker-open-btn:hover i {
  transform: rotate(180deg);
  filter: drop-shadow(0 0 6px var(--accent-color));
}