/* ── Theme variables: dark (default) ── */

:root,
[data-theme="dark"] {
  --sci-bg: #0a0e1a;
  --sci-bg-light: #101828;
  --sci-accent: #00e5ff;
  --sci-accent-rgb: 0, 229, 255;
  --sci-glass: rgba(15, 20, 40, 0.75);
  --sci-glass-border: rgba(0, 229, 255, 0.12);
  --sci-text: #e0e6ed;
  --sci-text-muted: #8a9ab5;
  --sci-heading: #ffffff;
  --sci-hero-mask: linear-gradient(
    135deg,
    rgba(6, 10, 28, 0.92),
    rgba(0, 40, 60, 0.88) 50%,
    rgba(0, 229, 255, 0.25) 100%
  );
  --sci-navbar-bg: rgba(10, 14, 26, 0.7);
  --sci-navbar-border: rgba(0, 229, 255, 0.15);
  --sci-footer-bg: #101828;
  --sci-grid-line: rgba(0, 229, 255, 0.03);
  --sci-card-shadow: rgba(0, 0, 0, 0.3);
  --sci-highlight-bg: linear-gradient(135deg, rgba(0, 229, 255, 0.06), rgba(0, 100, 140, 0.1));
  --sci-highlight-border: rgba(0, 229, 255, 0.2);
  --sci-code-bg: rgba(8, 12, 24, 0.9);
  --sci-code-border: rgba(0, 229, 255, 0.15);
  --sci-scrollbar-thumb: rgba(0, 229, 255, 0.2);
  --sci-scrollbar-hover: rgba(0, 229, 255, 0.4);
}

/* ── Theme variables: light ── */

[data-theme="light"] {
  --sci-bg: #F4F7FA;
  --sci-bg-light: #E8EDF2;
  --sci-accent: #0891B2;
  --sci-accent-rgb: 8, 145, 178;
  --sci-glass: rgba(255, 255, 255, 0.85);
  --sci-glass-border: rgba(8, 145, 178, 0.15);
  --sci-text: #334155;
  --sci-text-muted: #64748B;
  --sci-heading: #0F172A;
  --sci-hero-mask: linear-gradient(
    135deg,
    rgba(15, 23, 42, 0.88),
    rgba(8, 145, 178, 0.75) 50%,
    rgba(8, 145, 178, 0.35) 100%
  );
  --sci-navbar-bg: rgba(255, 255, 255, 0.85);
  --sci-navbar-border: rgba(8, 145, 178, 0.18);
  --sci-footer-bg: #E8EDF2;
  --sci-grid-line: rgba(8, 145, 178, 0.04);
  --sci-card-shadow: rgba(0, 0, 0, 0.08);
  --sci-highlight-bg: linear-gradient(135deg, rgba(8, 145, 178, 0.06), rgba(8, 145, 178, 0.1));
  --sci-highlight-border: rgba(8, 145, 178, 0.25);
  --sci-code-bg: rgba(15, 23, 42, 0.06);
  --sci-code-border: rgba(8, 145, 178, 0.15);
  --sci-scrollbar-thumb: rgba(8, 145, 178, 0.25);
  --sci-scrollbar-hover: rgba(8, 145, 178, 0.45);
}

/* ── Global transitions: smooth background/text color changes during theme switching ── */

html {
  transition: background-color 0.3s ease, color 0.3s ease;
}

/* ── Navbar: hamburger button (mobile collapse trigger) ── */

.navbar-toggler {
  color: #b0b8c4;
  border: 1.5px solid transparent;
  background: transparent;
  transition: border-color 0.2s ease, background 0.2s ease;
}

.navbar-toggler-icon {
  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3e%3cpath stroke='%23b0b8c4' stroke-linecap='round' stroke-miterlimit='10' stroke-width='3' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e");
  background-repeat: no-repeat;
  background-position: center;
  background-size: 100%;
  transition: background-image 0.15s ease;
}

.navbar-toggler.is-open .navbar-toggler-icon {
  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3e%3cpath stroke='%23b0b8c4' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2.4' d='M7 7l16 16M23 7L7 23'/%3e%3c/svg%3e");
}

[data-theme="dark"] .navbar-toggler {
  color: var(--sci-heading);
  border-color: transparent;
  background: transparent;
}

[data-theme="dark"] .navbar-toggler.is-open {
  border-color: rgba(var(--sci-accent-rgb), 0.45);
  background: rgba(var(--sci-accent-rgb), 0.08);
}

[data-theme="dark"] .navbar-toggler-icon {
  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3e%3cpath stroke='rgba(255,255,255,0.95)' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2.4' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e");
}

[data-theme="dark"] .navbar-toggler.is-open .navbar-toggler-icon {
  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3e%3cpath stroke='rgba(255,255,255,0.95)' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2.4' d='M7 7l16 16M23 7L7 23'/%3e%3c/svg%3e");
}

.navbar.navbar-scrolled {
  background: rgba(10, 14, 26, 0.9) !important;
}

/* ── Navbar: dark mode – soften pure-white links to reduce glare ── */

[data-theme="dark"] .navbar .nav-link {
  color: #94a3b8 !important;
}

[data-theme="dark"] .navbar .nav-link:hover,
[data-theme="dark"] .navbar .nav-item.active .nav-link {
  color: #c8d4e0 !important;
}

/* ── Navbar: light mode overrides ── */

[data-theme="light"] .navbar .nav-link {
  color: #5a6a80 !important;
}

[data-theme="light"] .navbar-brand strong {
  color: #0891B2 !important;
  text-shadow: none;
}

[data-theme="light"] .navbar .nav-link:hover,
[data-theme="light"] .navbar .nav-item.active .nav-link {
  color: #0891B2 !important;
  text-shadow: none;
}

[data-theme="light"] .navbar-toggler {
  color: #334155;
  border-color: transparent;
  background: transparent;
}

[data-theme="light"] .navbar-toggler.is-open {
  border-color: rgba(51, 65, 85, 0.4);
  background: rgba(51, 65, 85, 0.08);
}

[data-theme="light"] .navbar-toggler-icon {
  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3e%3cpath stroke='rgba(51,65,85,0.92)' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2.2' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e");
}

[data-theme="light"] .navbar-toggler.is-open .navbar-toggler-icon {
  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3e%3cpath stroke='rgba(51,65,85,0.92)' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2.2' d='M7 7l16 16M23 7L7 23'/%3e%3c/svg%3e");
}

[data-theme="light"] .navbar.navbar-scrolled {
  background: rgba(255, 255, 255, 0.95) !important;
}

/* ── Hero section: light mode overrides ── */

[data-theme="light"] #intro h1 {
  text-shadow: 0 2px 12px rgba(0, 0, 0, 0.3);
}

[data-theme="light"] #intro h5 {
  color: rgba(255, 255, 255, 0.85);
}

[data-theme="light"] #intro .btn-outline-light {
  border-color: #3E6287;
  color: #3E6287;
  border-width: 2px;
}

[data-theme="light"] #intro .btn-outline-light:hover {
  background-color: #355879;
  color: #ffffff;
  box-shadow: 0 0 18px rgba(62, 98, 135, 0.32);
}

/* ── Theme / language toggle buttons: shared base styles ── */

.theme-toggle-btn,
.lang-toggle-btn {
  background: transparent;
  border: 1px solid rgba(255, 255, 255, 0.3);
  color: #fff;
  border-radius: 50%;
  width: 44px;
  height: 44px;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: all 0.3s ease;
  flex-shrink: 0;
}

/* Theme toggle button: distinct properties */
.theme-toggle-btn {
  margin-left: 12px;
}

.theme-toggle-btn svg {
  display: block;
  width: 28px;
  height: 28px;
  fill: currentColor;
}

/* Language toggle button: distinct properties */
.lang-toggle-btn {
  margin-left: 8px;
}

.lang-toggle-btn svg {
  display: block;
  width: 22px;
  height: 22px;
  fill: currentColor;
}

.theme-toggle-btn:hover,
.lang-toggle-btn:hover {
  border-color: var(--sci-accent);
  color: var(--sci-accent);
  box-shadow: 0 0 10px rgba(var(--sci-accent-rgb), 0.3);
}

[data-theme="light"] .theme-toggle-btn,
[data-theme="light"] .lang-toggle-btn {
  border-color: rgba(8, 145, 178, 0.3);
  color: #334155;
}

[data-theme="light"] .theme-toggle-btn:hover,
[data-theme="light"] .lang-toggle-btn:hover {
  border-color: #0891B2;
  color: #0891B2;
}

/* ── Mobile: full-screen overlay nav ── */

@media (max-width: 991px) {
  [data-theme="dark"] .navbar .nav-item {
    border-bottom-color: rgba(255, 255, 255, 0.08);
  }

  [data-theme="dark"] .navbar .nav-link:not(.navbar-brand) {
    color: #c8d4e0 !important;
  }

  [data-theme="dark"] .navbar .nav-item.active .nav-link {
    color: var(--sci-accent) !important;
  }

  [data-theme="light"] .navbar .nav-item {
    border-bottom-color: #e2e8f0;
  }

  [data-theme="light"] .navbar .nav-link:not(.navbar-brand) {
    color: #334155 !important;
  }

  [data-theme="light"] .navbar .nav-item.active .nav-link {
    color: #0891B2 !important;
  }

  [data-theme="light"] .nav-actions {
    border-top-color: #e2e8f0;
  }
}