/**
 * Light / dark theme tokens — header, footer, shell components.
 */

:root,
[data-theme="light"] {
  color-scheme: light;

  --itk-body-bg: var(--gray-50);
  --itk-body-text: var(--gray-900);

  --itk-header-main-bg: rgba(255, 255, 255, 0.88);
  --itk-header-main-bg-scrolled: rgba(255, 255, 255, 0.58);
  --itk-header-main-border: rgba(15, 23, 42, 0.08);
  --itk-header-glass-border: rgba(255, 255, 255, 0.72);
  --itk-header-glass-highlight: rgba(255, 255, 255, 0.55);
  --itk-header-glass-blur: 28px;
  --itk-header-shadow: 0 8px 32px rgba(15, 23, 42, 0.1), 0 2px 8px rgba(15, 23, 42, 0.06);

  --itk-nav-link: var(--gray-700);
  --itk-nav-link-hover: var(--navy-900);
  --itk-nav-link-hover-bg: rgba(var(--accent-rgb), 0.08);
  --itk-nav-link-active-border: rgba(var(--accent-rgb), 0.22);

  --itk-header-btn-bg: #ffffff;
  --itk-header-btn-border: rgba(15, 23, 42, 0.12);
  --itk-header-btn-color: var(--navy-900);
  --itk-header-btn-hover-bg: rgba(var(--accent-rgb), 0.06);
  --itk-header-btn-hover-border: rgba(var(--accent-rgb), 0.28);

  --itk-search-bg: #ffffff;
  --itk-search-border: rgba(15, 23, 42, 0.08);
  --itk-search-title: var(--navy-900);

  --itk-dropdown-bg: #ffffff;
  --itk-dropdown-border: rgba(15, 23, 42, 0.1);
  --itk-dropdown-shadow: 0 20px 50px rgba(15, 23, 42, 0.12);
  --itk-dropdown-text: var(--gray-700);
  --itk-dropdown-title: var(--navy-900);
  --itk-dropdown-hover-bg: rgba(var(--accent-rgb), 0.06);
  --itk-dropdown-hover-text: var(--navy-900);

  --itk-mega-backdrop: rgba(15, 23, 42, 0.35);
  --itk-mega-panel-bg: linear-gradient(180deg, #ffffff 0%, #f8fafc 100%);
  --itk-mega-panel-border: rgba(15, 23, 42, 0.08);
  --itk-mega-panel-shadow: 0 24px 60px rgba(15, 23, 42, 0.12);
  --itk-mega-sidebar-bg: #f8fafc;
  --itk-mega-text: var(--gray-700);
  --itk-mega-title: var(--navy-900);
  --itk-mega-muted: var(--gray-500);
  --itk-mega-tab-bg: #ffffff;
  --itk-mega-tab-active-bg: rgba(var(--accent-rgb), 0.1);
  --itk-mega-card-bg: #ffffff;
  --itk-mega-card-border: rgba(15, 23, 42, 0.08);

  --itk-drawer-bg: #ffffff;
  --itk-drawer-border: rgba(15, 23, 42, 0.08);
  --itk-drawer-text: var(--gray-700);
  --itk-drawer-title: var(--navy-900);
  --itk-drawer-shadow: -12px 0 40px rgba(15, 23, 42, 0.12);
  --itk-drawer-close-bg: #f8fafc;
  --itk-drawer-close-border: rgba(15, 23, 42, 0.12);

  --itk-search-input-bg: #f1f5f9;
  --itk-search-input-border: rgba(15, 23, 42, 0.12);
  --itk-search-input-text: var(--navy-900);
  --itk-search-input-placeholder: var(--gray-400);

  --itk-footer-bg: #ffffff;
  --itk-footer-border: rgba(15, 23, 42, 0.08);
  --itk-footer-text: var(--gray-600);
  --itk-footer-title: var(--navy-900);
  --itk-footer-muted: var(--gray-500);
  --itk-footer-bottom-bg: #f8fafc;
  --itk-footer-social-bg: #f1f5f9;
  --itk-footer-social-color: var(--gray-600);

  --itk-surface: #ffffff;
  --itk-surface-raised: #ffffff;
  --itk-surface-muted: var(--gray-50);
  --itk-border: var(--gray-200);
  --itk-border-muted: var(--gray-100);
  --itk-text-primary: var(--navy-900);
  --itk-text-secondary: var(--gray-600);
  --itk-text-muted: var(--gray-500);
  --itk-text-faint: var(--gray-400);
  --itk-input-bg: #ffffff;
  --itk-input-border: var(--gray-200);
  --itk-shadow-card: var(--shadow-card);
  --itk-shadow-lg: var(--shadow-xl);
  --itk-blockquote-bg: var(--gray-50);
  --itk-tag-bg: var(--gray-100);
  --itk-skeleton-bg: var(--gray-200);
}

[data-theme="dark"] {
  color-scheme: dark;

  --itk-body-bg: #0a1018;
  --itk-body-text: #e5e7eb;

  --itk-header-main-bg: rgba(13, 27, 42, 0.82);
  --itk-header-main-bg-scrolled: rgba(13, 27, 42, 0.52);
  --itk-header-main-border: rgba(255, 255, 255, 0.08);
  --itk-header-glass-border: rgba(255, 255, 255, 0.14);
  --itk-header-glass-highlight: rgba(255, 255, 255, 0.08);
  --itk-header-glass-blur: 32px;
  --itk-header-shadow: 0 12px 40px rgba(0, 0, 0, 0.35), 0 2px 12px rgba(0, 0, 0, 0.2);

  --itk-nav-link: rgba(255, 255, 255, 0.78);
  --itk-nav-link-hover: #ffffff;
  --itk-nav-link-hover-bg: rgba(var(--accent-rgb), 0.12);
  --itk-nav-link-active-border: rgba(var(--accent-rgb), 0.25);

  --itk-header-btn-bg: rgba(255, 255, 255, 0.04);
  --itk-header-btn-border: rgba(255, 255, 255, 0.12);
  --itk-header-btn-color: #ffffff;
  --itk-header-btn-hover-bg: rgba(255, 255, 255, 0.1);
  --itk-header-btn-hover-border: rgba(var(--accent-rgb), 0.35);

  --itk-search-bg: #152238;
  --itk-search-border: rgba(255, 255, 255, 0.08);
  --itk-search-title: #ffffff;

  --itk-dropdown-bg: linear-gradient(180deg, #152238, var(--navy-800));
  --itk-dropdown-border: rgba(255, 255, 255, 0.1);
  --itk-dropdown-shadow: 0 24px 48px rgba(0, 0, 0, 0.5);
  --itk-dropdown-text: var(--gray-300);
  --itk-dropdown-title: #ffffff;
  --itk-dropdown-hover-bg: rgba(var(--accent-rgb), 0.12);
  --itk-dropdown-hover-text: #ffd4c8;

  --itk-mega-backdrop: rgba(7, 14, 24, 0.55);
  --itk-mega-panel-bg: linear-gradient(180deg, #0f2038 0%, var(--navy-900) 100%);
  --itk-mega-panel-border: rgba(var(--accent-rgb), 0.15);
  --itk-mega-panel-shadow: 0 24px 60px rgba(0, 0, 0, 0.45);
  --itk-mega-sidebar-bg: rgba(255, 255, 255, 0.03);
  --itk-mega-text: var(--gray-300);
  --itk-mega-title: #ffffff;
  --itk-mega-muted: var(--gray-400);
  --itk-mega-tab-bg: rgba(255, 255, 255, 0.04);
  --itk-mega-tab-active-bg: rgba(var(--accent-rgb), 0.12);
  --itk-mega-card-bg: rgba(255, 255, 255, 0.04);
  --itk-mega-card-border: rgba(255, 255, 255, 0.08);

  --itk-drawer-bg: linear-gradient(180deg, var(--navy-900), #0a1628);
  --itk-drawer-border: rgba(255, 255, 255, 0.08);
  --itk-drawer-text: var(--gray-300);
  --itk-drawer-title: #ffffff;
  --itk-drawer-shadow: -12px 0 40px rgba(0, 0, 0, 0.45);
  --itk-drawer-close-bg: rgba(255, 255, 255, 0.05);
  --itk-drawer-close-border: rgba(255, 255, 255, 0.12);

  --itk-search-input-bg: rgba(255, 255, 255, 0.08);
  --itk-search-input-border: rgba(255, 255, 255, 0.14);
  --itk-search-input-text: #ffffff;
  --itk-search-input-placeholder: var(--gray-400);

  --itk-footer-bg: var(--navy-950);
  --itk-footer-border: rgba(255, 255, 255, 0.06);
  --itk-footer-text: var(--gray-400);
  --itk-footer-title: #ffffff;
  --itk-footer-muted: var(--gray-500);
  --itk-footer-bottom-bg: rgba(0, 0, 0, 0.18);
  --itk-footer-social-bg: var(--navy-800);
  --itk-footer-social-color: var(--gray-400);

  /* Content surfaces */
  --itk-surface: #141e30;
  --itk-surface-raised: #1a2740;
  --itk-surface-muted: #0f1726;
  --itk-border: rgba(255, 255, 255, 0.1);
  --itk-border-muted: rgba(255, 255, 255, 0.06);
  --itk-text-primary: #f1f5f9;
  --itk-text-secondary: #cbd5e1;
  --itk-text-muted: #94a3b8;
  --itk-text-faint: #64748b;
  --itk-input-bg: rgba(255, 255, 255, 0.06);
  --itk-input-border: rgba(255, 255, 255, 0.12);
  --itk-shadow-card: 0 2px 16px rgba(0, 0, 0, 0.35);
  --itk-shadow-lg: 0 12px 40px rgba(0, 0, 0, 0.45);
  --itk-blockquote-bg: rgba(255, 255, 255, 0.04);
  --itk-tag-bg: rgba(255, 255, 255, 0.08);
  --itk-skeleton-bg: rgba(255, 255, 255, 0.08);
}

@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    color-scheme: dark;

    --itk-body-bg: #0a1018;
    --itk-body-text: #e5e7eb;

    --itk-header-main-bg: rgba(13, 27, 42, 0.82);
    --itk-header-main-bg-scrolled: rgba(13, 27, 42, 0.52);
    --itk-header-main-border: rgba(255, 255, 255, 0.08);
    --itk-header-glass-border: rgba(255, 255, 255, 0.14);
    --itk-header-glass-highlight: rgba(255, 255, 255, 0.08);
    --itk-header-glass-blur: 32px;
    --itk-header-shadow: 0 12px 40px rgba(0, 0, 0, 0.35), 0 2px 12px rgba(0, 0, 0, 0.2);

    --itk-nav-link: rgba(255, 255, 255, 0.78);
    --itk-nav-link-hover: #ffffff;
    --itk-nav-link-hover-bg: rgba(var(--accent-rgb), 0.12);
    --itk-nav-link-active-border: rgba(var(--accent-rgb), 0.25);

    --itk-header-btn-bg: rgba(255, 255, 255, 0.04);
    --itk-header-btn-border: rgba(255, 255, 255, 0.12);
    --itk-header-btn-color: #ffffff;
    --itk-header-btn-hover-bg: rgba(255, 255, 255, 0.1);
    --itk-header-btn-hover-border: rgba(var(--accent-rgb), 0.35);

    --itk-search-bg: #152238;
    --itk-search-border: rgba(255, 255, 255, 0.08);
    --itk-search-title: #ffffff;

    --itk-dropdown-bg: linear-gradient(180deg, #152238, var(--navy-800));
    --itk-dropdown-border: rgba(255, 255, 255, 0.1);
    --itk-dropdown-shadow: 0 24px 48px rgba(0, 0, 0, 0.5);
    --itk-dropdown-text: var(--gray-300);
    --itk-dropdown-title: #ffffff;
    --itk-dropdown-hover-bg: rgba(var(--accent-rgb), 0.12);
    --itk-dropdown-hover-text: #ffd4c8;

    --itk-mega-backdrop: rgba(7, 14, 24, 0.55);
    --itk-mega-panel-bg: linear-gradient(180deg, #0f2038 0%, var(--navy-900) 100%);
    --itk-mega-panel-border: rgba(var(--accent-rgb), 0.15);
    --itk-mega-panel-shadow: 0 24px 60px rgba(0, 0, 0, 0.45);
    --itk-mega-sidebar-bg: rgba(255, 255, 255, 0.03);
    --itk-mega-text: var(--gray-300);
    --itk-mega-title: #ffffff;
    --itk-mega-muted: var(--gray-400);
    --itk-mega-tab-bg: rgba(255, 255, 255, 0.04);
    --itk-mega-tab-active-bg: rgba(var(--accent-rgb), 0.12);
    --itk-mega-card-bg: rgba(255, 255, 255, 0.04);
    --itk-mega-card-border: rgba(255, 255, 255, 0.08);

    --itk-drawer-bg: linear-gradient(180deg, var(--navy-900), #0a1628);
    --itk-drawer-border: rgba(255, 255, 255, 0.08);
    --itk-drawer-text: var(--gray-300);
    --itk-drawer-title: #ffffff;
    --itk-drawer-shadow: -12px 0 40px rgba(0, 0, 0, 0.45);
    --itk-drawer-close-bg: rgba(255, 255, 255, 0.05);
    --itk-drawer-close-border: rgba(255, 255, 255, 0.12);

    --itk-search-input-bg: rgba(255, 255, 255, 0.08);
    --itk-search-input-border: rgba(255, 255, 255, 0.14);
    --itk-search-input-text: #ffffff;
    --itk-search-input-placeholder: var(--gray-400);

    --itk-footer-bg: var(--navy-950);
    --itk-footer-border: rgba(255, 255, 255, 0.06);
    --itk-footer-text: var(--gray-400);
    --itk-footer-title: #ffffff;
    --itk-footer-muted: var(--gray-500);
    --itk-footer-bottom-bg: rgba(0, 0, 0, 0.18);
    --itk-footer-social-bg: var(--navy-800);
    --itk-footer-social-color: var(--gray-400);

    --itk-surface: #141e30;
    --itk-surface-raised: #1a2740;
    --itk-surface-muted: #0f1726;
    --itk-border: rgba(255, 255, 255, 0.1);
    --itk-border-muted: rgba(255, 255, 255, 0.06);
    --itk-text-primary: #f1f5f9;
    --itk-text-secondary: #cbd5e1;
    --itk-text-muted: #94a3b8;
    --itk-text-faint: #64748b;
    --itk-input-bg: rgba(255, 255, 255, 0.06);
    --itk-input-border: rgba(255, 255, 255, 0.12);
    --itk-shadow-card: 0 2px 16px rgba(0, 0, 0, 0.35);
    --itk-shadow-lg: 0 12px 40px rgba(0, 0, 0, 0.45);
    --itk-blockquote-bg: rgba(255, 255, 255, 0.04);
    --itk-tag-bg: rgba(255, 255, 255, 0.08);
    --itk-skeleton-bg: rgba(255, 255, 255, 0.08);
  }
}

/* Dual logo — one visible variant; header slot must not collapse */
.itk-logo {
  flex: 0 0 auto;
  flex-shrink: 0;
  min-width: 0;
  max-width: min(168px, 40vw);
}

.itk-header-inner > .itk-logo,
.itk-mobile-drawer-head > .itk-logo {
  flex-shrink: 0;
}

.itk-logo .itk-logo-img {
  display: block;
  max-width: 100%;
  max-height: 48px;
  width: auto;
  height: auto;
  object-fit: contain;
}

.itk-logo .itk-logo-img--dark { display: none; }

.itk-logo .itk-logo-img--light,
.itk-logo .itk-logo-img:not(.itk-logo-img--light):not(.itk-logo-img--dark) {
  display: block;
}

[data-theme="dark"] .itk-logo .itk-logo-img--light { display: none; }
[data-theme="dark"] .itk-logo .itk-logo-img--dark { display: block; }

@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) .itk-logo .itk-logo-img--light { display: none; }
  :root:not([data-theme="light"]) .itk-logo .itk-logo-img--dark { display: block; }
}

/* Body */
body {
  background: var(--itk-body-bg);
  color: var(--itk-body-text);
  transition: background 0.25s ease, color 0.25s ease;
}

/* Header shell — glassmorphism when sticky (scrolled) */
.itk-header.is-scrolled {
  box-shadow: var(--itk-header-shadow);
}

.itk-header.is-scrolled .itk-header-main {
  background: var(--itk-header-main-bg-scrolled);
  border-bottom-color: var(--itk-header-glass-border);
  backdrop-filter: blur(var(--itk-header-glass-blur)) saturate(1.85);
  -webkit-backdrop-filter: blur(var(--itk-header-glass-blur)) saturate(1.85);
  box-shadow:
    inset 0 1px 0 var(--itk-header-glass-highlight),
    inset 0 -1px 0 var(--itk-header-main-border);
}

.itk-header.is-scrolled .itk-header-action-btn,
.itk-header.is-scrolled .itk-theme-toggle,
.itk-header.is-scrolled .itk-mobile-toggle {
  background: rgba(255, 255, 255, 0.42);
  border-color: var(--itk-header-glass-border);
  backdrop-filter: blur(12px) saturate(1.5);
  -webkit-backdrop-filter: blur(12px) saturate(1.5);
}

[data-theme="dark"] .itk-header.is-scrolled .itk-header-action-btn,
.itk-dark .itk-header.is-scrolled .itk-header-action-btn,
[data-theme="dark"] .itk-header.is-scrolled .itk-theme-toggle,
.itk-dark .itk-header.is-scrolled .itk-theme-toggle,
[data-theme="dark"] .itk-header.is-scrolled .itk-mobile-toggle,
.itk-dark .itk-header.is-scrolled .itk-mobile-toggle {
  background: rgba(255, 255, 255, 0.06);
  border-color: var(--itk-header-glass-border);
}

.itk-header-main {
  background: var(--itk-header-main-bg);
  border-bottom-color: var(--itk-header-main-border);
}

.itk-nav-link {
  color: var(--itk-nav-link);
}

.itk-nav-item.is-active .itk-nav-link,
.itk-nav-link:hover {
  color: var(--itk-nav-link-hover);
  background: var(--itk-nav-link-hover-bg);
}

.itk-nav-item.is-active .itk-nav-link {
  box-shadow: inset 0 0 0 1px var(--itk-nav-link-active-border);
}

.itk-nav-dropdown {
  background: var(--itk-dropdown-bg);
  border-color: var(--itk-dropdown-border);
  box-shadow: var(--itk-dropdown-shadow);
}

.itk-nav-dropdown a {
  color: var(--itk-dropdown-text);
}

.itk-nav-dropdown a:hover {
  background: var(--itk-dropdown-hover-bg);
  color: var(--itk-dropdown-hover-text);
}

.itk-mega-backdrop {
  background: var(--itk-mega-backdrop);
}

.itk-mega-panel {
  background: var(--itk-mega-panel-bg);
  border-top-color: var(--itk-mega-panel-border);
  border-bottom-color: var(--itk-mega-panel-border);
  box-shadow: var(--itk-mega-panel-shadow);
}

.itk-mega-intro {
  background: var(--itk-mega-sidebar-bg);
}

.itk-mega-intro strong,
.itk-mega-content-title {
  color: var(--itk-mega-title);
}

.itk-mega-intro p,
.itk-mega-cat-desc,
.itk-mega-content-more {
  color: var(--itk-mega-text);
}

.itk-mega-cat {
  background: var(--itk-mega-tab-bg);
  border-color: var(--itk-mega-card-border);
  color: var(--itk-mega-text);
}

.itk-mega-cat:hover,
.itk-mega-cat.is-active {
  background: var(--itk-mega-tab-active-bg);
  color: var(--itk-mega-title);
}

.itk-mega-cat-label {
  color: inherit;
}

.itk-mega-post {
  background: var(--itk-mega-card-bg);
  border-color: var(--itk-mega-card-border);
}

.itk-mega-post:hover {
  border-color: rgba(var(--accent-rgb), 0.35);
}

.itk-mega-post-body strong {
  color: var(--itk-mega-title);
}

.itk-mega-post-body time {
  color: var(--itk-mega-muted);
}

.itk-header-action-btn,
.itk-mobile-toggle,
.itk-theme-toggle {
  background: var(--itk-header-btn-bg);
  border-color: var(--itk-header-btn-border);
  color: var(--itk-header-btn-color);
}

.itk-header-action-btn:hover,
.itk-mobile-toggle:hover,
.itk-theme-toggle:hover {
  background: var(--itk-header-btn-hover-bg);
  border-color: var(--itk-header-btn-hover-border);
}

.itk-notif-badge {
  border-color: var(--itk-header-main-bg-scrolled);
}

.itk-notif-dropdown {
  background: var(--itk-dropdown-bg);
  border-color: var(--itk-dropdown-border);
  box-shadow: var(--itk-dropdown-shadow);
}

.itk-notif-header {
  border-bottom-color: var(--itk-dropdown-border);
  color: var(--itk-dropdown-title);
}

.itk-notif-item {
  border-bottom-color: var(--itk-dropdown-border);
  color: var(--itk-dropdown-text);
}

.itk-notif-item:hover {
  background: var(--itk-dropdown-hover-bg);
  color: var(--itk-dropdown-hover-text);
}

.itk-search-bar {
  background: var(--itk-search-bg);
  border-bottom-color: var(--itk-search-border);
}

.itk-search-panel-title {
  color: var(--itk-search-title);
}

.itk-mobile-drawer-panel {
  background: var(--itk-drawer-bg);
  border-color: var(--itk-drawer-border);
}

.itk-mobile-drawer-head {
  border-bottom-color: var(--itk-drawer-border);
}

.itk-mobile-quick-card {
  background: var(--itk-mega-tab-bg);
  border-color: var(--itk-mega-card-border);
  color: var(--itk-drawer-text);
}

.itk-mobile-quick-card:hover {
  background: var(--itk-mega-tab-active-bg);
  color: var(--itk-drawer-title);
}

.itk-mobile-quick-card small {
  color: var(--itk-mega-muted);
}

.itk-mobile-drawer-close {
  color: var(--itk-drawer-text);
  background: var(--itk-drawer-close-bg);
  border-color: var(--itk-drawer-close-border);
}

.itk-mobile-quick-label {
  color: var(--itk-drawer-title);
}

/* Theme toggle icons — show moon in light mode, sun in dark mode */
.itk-theme-toggle .itk-theme-icon--sun,
.itk-theme-toggle .itk-theme-icon--moon { display: none; }

[data-theme="light"] .itk-theme-toggle .itk-theme-icon--moon,
:root:not([data-theme="dark"]) .itk-theme-toggle .itk-theme-icon--moon {
  display: inline-flex;
}

[data-theme="dark"] .itk-theme-toggle .itk-theme-icon--sun { display: inline-flex; }

@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) .itk-theme-toggle .itk-theme-icon--moon { display: none; }
  :root:not([data-theme="light"]) .itk-theme-toggle .itk-theme-icon--sun { display: inline-flex; }
}

@media (prefers-color-scheme: light) {
  :root:not([data-theme="dark"]) .itk-theme-toggle .itk-theme-icon--sun { display: none; }
}

.itk-theme-toggle {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 40px;
  height: 40px;
  padding: 0;
  border: 1px solid var(--itk-header-btn-border);
  border-radius: 10px;
  background: var(--itk-header-btn-bg);
  color: var(--itk-header-btn-color);
  cursor: pointer;
  transition: background 0.2s, border-color 0.2s;
}

.itk-theme-toggle svg {
  width: 18px;
  height: 18px;
}

/* Footer shell */
.itk-footer {
  background: var(--itk-footer-bg);
  color: var(--itk-footer-text);
  border-top: 1px solid var(--itk-footer-border);
}

.itk-footer-main {
  border-top: 0;
}

.itk-footer-tagline {
  color: var(--itk-footer-text);
}

.itk-footer-col-title {
  color: var(--itk-footer-title);
  border-bottom-color: var(--itk-footer-border);
}

.itk-footer-links a {
  color: var(--itk-footer-text);
}

.itk-footer-links a:hover {
  color: var(--cyan-600);
}

.itk-footer-bottom {
  background: var(--itk-footer-bottom-bg);
  border-top-color: var(--itk-footer-border);
}

.itk-footer-copy,
.itk-footer-legal a {
  color: var(--itk-footer-muted);
}

.itk-footer-legal a:hover {
  color: var(--cyan-600);
}

.itk-social a {
  background: var(--itk-footer-social-bg);
  color: var(--itk-footer-social-color);
}

.itk-social a:hover {
  background: var(--cyan-600);
  color: #ffffff;
}

[data-theme="dark"] .itk-footer-links a:hover,
[data-theme="dark"] .itk-footer-legal a:hover {
  color: var(--cyber-500);
}

@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) .itk-footer-links a:hover,
  :root:not([data-theme="light"]) .itk-footer-legal a:hover {
    color: var(--cyber-500);
  }
}

/* ─── Dark mode — full content surfaces (.itk-dark) ─── */
.itk-dark {
  color-scheme: dark;

  --itk-body-bg: #0a1018;
  --itk-body-text: #e5e7eb;

  --itk-header-main-bg: rgba(13, 27, 42, 0.82);
  --itk-header-main-bg-scrolled: rgba(13, 27, 42, 0.52);
  --itk-header-main-border: rgba(255, 255, 255, 0.08);
  --itk-header-glass-border: rgba(255, 255, 255, 0.14);
  --itk-header-glass-highlight: rgba(255, 255, 255, 0.08);
  --itk-header-glass-blur: 32px;
  --itk-header-shadow: 0 12px 40px rgba(0, 0, 0, 0.35), 0 2px 12px rgba(0, 0, 0, 0.2);

  --itk-nav-link: rgba(255, 255, 255, 0.78);
  --itk-nav-link-hover: #ffffff;
  --itk-nav-link-hover-bg: rgba(var(--accent-rgb), 0.12);
  --itk-nav-link-active-border: rgba(var(--accent-rgb), 0.25);

  --itk-header-btn-bg: rgba(255, 255, 255, 0.04);
  --itk-header-btn-border: rgba(255, 255, 255, 0.12);
  --itk-header-btn-color: #ffffff;
  --itk-header-btn-hover-bg: rgba(255, 255, 255, 0.1);
  --itk-header-btn-hover-border: rgba(var(--accent-rgb), 0.35);

  --itk-search-bg: #152238;
  --itk-search-border: rgba(255, 255, 255, 0.08);
  --itk-search-title: #ffffff;

  --itk-dropdown-bg: linear-gradient(180deg, #152238, var(--navy-800));
  --itk-dropdown-border: rgba(255, 255, 255, 0.1);
  --itk-dropdown-shadow: 0 24px 48px rgba(0, 0, 0, 0.5);
  --itk-dropdown-text: var(--gray-300);
  --itk-dropdown-title: #ffffff;
  --itk-dropdown-hover-bg: rgba(var(--accent-rgb), 0.12);
  --itk-dropdown-hover-text: #ffd4c8;

  --itk-mega-backdrop: rgba(7, 14, 24, 0.55);
  --itk-mega-panel-bg: linear-gradient(180deg, #0f2038 0%, var(--navy-900) 100%);
  --itk-mega-panel-border: rgba(var(--accent-rgb), 0.15);
  --itk-mega-panel-shadow: 0 24px 60px rgba(0, 0, 0, 0.45);
  --itk-mega-sidebar-bg: rgba(255, 255, 255, 0.03);
  --itk-mega-text: var(--gray-300);
  --itk-mega-title: #ffffff;
  --itk-mega-muted: var(--gray-400);
  --itk-mega-tab-bg: rgba(255, 255, 255, 0.04);
  --itk-mega-tab-active-bg: rgba(var(--accent-rgb), 0.12);
  --itk-mega-card-bg: rgba(255, 255, 255, 0.04);
  --itk-mega-card-border: rgba(255, 255, 255, 0.08);

  --itk-drawer-bg: linear-gradient(180deg, var(--navy-900), #0a1628);
  --itk-drawer-border: rgba(255, 255, 255, 0.08);
  --itk-drawer-text: var(--gray-300);
  --itk-drawer-title: #ffffff;
  --itk-drawer-shadow: -12px 0 40px rgba(0, 0, 0, 0.45);
  --itk-drawer-close-bg: rgba(255, 255, 255, 0.05);
  --itk-drawer-close-border: rgba(255, 255, 255, 0.12);

  --itk-search-input-bg: rgba(255, 255, 255, 0.08);
  --itk-search-input-border: rgba(255, 255, 255, 0.14);
  --itk-search-input-text: #ffffff;
  --itk-search-input-placeholder: var(--gray-400);

  --itk-footer-bg: var(--navy-950);
  --itk-footer-border: rgba(255, 255, 255, 0.06);
  --itk-footer-text: var(--gray-400);
  --itk-footer-title: #ffffff;
  --itk-footer-muted: var(--gray-500);
  --itk-footer-bottom-bg: rgba(0, 0, 0, 0.18);
  --itk-footer-social-bg: var(--navy-800);
  --itk-footer-social-color: var(--gray-400);

  --itk-surface: #141e30;
  --itk-surface-raised: #1a2740;
  --itk-surface-muted: #0f1726;
  --itk-border: rgba(255, 255, 255, 0.1);
  --itk-border-muted: rgba(255, 255, 255, 0.06);
  --itk-text-primary: #f1f5f9;
  --itk-text-secondary: #cbd5e1;
  --itk-text-muted: #94a3b8;
  --itk-text-faint: #64748b;
  --itk-input-bg: rgba(255, 255, 255, 0.06);
  --itk-input-border: rgba(255, 255, 255, 0.12);
  --itk-shadow-card: 0 2px 16px rgba(0, 0, 0, 0.35);
  --itk-shadow-lg: 0 12px 40px rgba(0, 0, 0, 0.45);
  --itk-blockquote-bg: rgba(255, 255, 255, 0.04);
  --itk-tag-bg: rgba(255, 255, 255, 0.08);
  --itk-skeleton-bg: rgba(255, 255, 255, 0.08);

  --shadow-card: var(--itk-shadow-card);
  --shadow-xl: var(--itk-shadow-lg);
}

.itk-dark .itk-section-gray,
.itk-dark .itk-related-posts {
  background: var(--itk-surface-muted);
  border-color: var(--itk-border-muted);
}

/* Plain sections (tutorials, multimedia, about) — override Elementor white wrapper */
.itk-dark .itk-section:not(.itk-section-gray):not(.itk-section-dark):not(.itk-section-books) {
  background: var(--itk-body-bg);
}

.itk-dark .itk-main--elementor-home .elementor-section,
.itk-dark .itk-main--elementor-home .elementor-container,
.itk-dark .itk-main--elementor-home .elementor-column,
.itk-dark .itk-main--elementor-home .elementor-column-wrap,
.itk-dark .itk-main--elementor-home .elementor-widget-wrap,
.itk-dark .itk-main--elementor-home .elementor-element.elementor-widget-shortcode,
.itk-dark .itk-main--elementor-home .e-con,
.itk-dark .itk-main--elementor-home .e-con-inner,
.itk-dark .itk-main--elementor-home .e-con > .e-con-inner {
  background-color: transparent !important;
}

.itk-dark .itk-section-title:not(.itk-text-white),
.itk-dark .itk-archive-header .itk-section-title,
.itk-dark .itk-page-title,
.itk-dark .itk-card-title,
.itk-dark .itk-sidebar-title,
.itk-dark .itk-sidebar-post span,
.itk-dark .itk-breadcrumbs span,
.itk-dark .itk-post-nav-link strong,
.itk-dark .itk-single-author strong,
.itk-dark .itk-comments-title,
.itk-dark .itk-comment-reply-title,
.itk-dark .itk-comment-author,
.itk-dark .itk-404-code,
.itk-dark .itk-pwa-install-text strong,
.itk-dark .itk-tutorial-item h3,
.itk-dark .itk-media-card h3,
.itk-dark .itk-news-lead-body h3,
.itk-dark .itk-prose h2,
.itk-dark .itk-prose h3,
.itk-dark .itk-prose h4 {
  color: var(--itk-text-primary);
}

.itk-dark .itk-section-subtitle,
.itk-dark .itk-archive-desc,
.itk-dark .itk-card-excerpt,
.itk-dark .itk-card-footer,
.itk-dark .itk-news-lead-body p,
.itk-dark .itk-news-lead-meta,
.itk-dark .itk-breadcrumbs a,
.itk-dark .itk-sidebar-cats a,
.itk-dark .itk-sidebar-post small,
.itk-dark .itk-single-author p,
.itk-dark .itk-single-author-label,
.itk-dark .itk-single-tags-label,
.itk-dark .itk-post-nav-link span,
.itk-dark .itk-comment-text,
.itk-dark .itk-comment-meta time,
.itk-dark .itk-404-text,
.itk-dark .itk-no-results,
.itk-dark .itk-search-count,
.itk-dark .itk-pwa-install-text span {
  color: var(--itk-text-muted);
}

.itk-dark .itk-breadcrumbs a:hover {
  color: var(--cyber-500);
}

.itk-dark .itk-card,
.itk-dark .itk-sidebar-widget,
.itk-dark .itk-post-nav-link,
.itk-dark .itk-tutorial-item a,
.itk-dark .itk-media-card,
.itk-dark .itk-news-lead,
.itk-dark .itk-about-badge,
.itk-dark .itk-stat-card,
.itk-dark .itk-contact-card,
.itk-dark .itk-pwa-install-inner {
  background: var(--itk-surface);
  border-color: var(--itk-border);
  box-shadow: var(--itk-shadow-card);
}

.itk-dark .itk-tutorial-item a,
.itk-dark .itk-media-card {
  color: var(--itk-text-primary);
}

.itk-dark .itk-tutorial-item span {
  color: var(--itk-text-muted);
}

.itk-dark .itk-tutorial-item a:hover h3,
.itk-dark .itk-media-card:hover h3 {
  color: var(--cyber-500);
}

/* Books section — always dark-themed; subtle glow boost in site dark mode */
.itk-dark .itk-section-books {
  background: linear-gradient(165deg, #060b12 0%, var(--navy-950) 45%, #080f18 100%);
}

.itk-dark .itk-section-books .itk-book-card {
  background: rgba(255, 255, 255, 0.03);
  border-color: rgba(255, 255, 255, 0.07);
}

.itk-dark .itk-section-books .itk-book-card:hover {
  border-color: rgba(248, 64, 16, 0.4);
  box-shadow: 0 24px 48px rgba(0, 0, 0, 0.55), 0 0 24px rgba(248, 64, 16, 0.08);
}

.itk-dark .itk-books-subtitle {
  color: var(--itk-text-muted) !important;
}

/* Homepage newsletter CTA — seamless with books band */
.itk-dark .itk-home-cta {
  background: linear-gradient(180deg, #080f18 0%, var(--navy-950) 40%, #060b12 100%);
}

.itk-dark .itk-home-cta-panel {
  background: rgba(255, 255, 255, 0.03);
  border-color: rgba(255, 255, 255, 0.07);
}

.itk-dark .itk-home-cta-field {
  background: rgba(0, 0, 0, 0.4);
  border-color: rgba(255, 255, 255, 0.1);
}

.itk-dark .itk-card-footer {
  border-top-color: var(--itk-border-muted);
}

.itk-dark .itk-single-author,
.itk-dark .itk-engagement-bar,
.itk-dark .itk-toc,
.itk-dark .itk-comment-body,
.itk-dark .itk-comment-respond {
  background: var(--itk-surface-raised);
  border-color: var(--itk-border);
}

.itk-dark .itk-comment-list .children .itk-comment-body {
  background: var(--itk-surface-muted);
}

.itk-dark .itk-comment-list .children {
  border-right-color: var(--itk-border);
}

.itk-dark .itk-comments-wrap,
.itk-dark .itk-single-tags {
  border-top-color: var(--itk-border);
}

/* Single post — dark mode */
.itk-dark .itk-single-post {
  background: var(--itk-body-bg);
}

.itk-dark .itk-single-hero {
  background: linear-gradient(165deg, #060b12 0%, var(--navy-950) 50%, #080f18 100%);
}

.itk-dark .itk-single-hero-overlay {
  background: linear-gradient(
    180deg,
    rgba(4, 8, 14, 0.65) 0%,
    rgba(6, 11, 18, 0.88) 55%,
    rgba(6, 11, 18, 0.97) 100%
  );
}

.itk-dark .itk-single-article {
  background: var(--itk-surface);
  border-color: var(--itk-border);
  box-shadow: 0 20px 50px rgba(0, 0, 0, 0.35);
}

.itk-dark .itk-single-post .itk-engagement-bar {
  background: var(--itk-surface-muted);
  border-color: var(--itk-border);
}

.itk-dark .itk-single-featured {
  background: #000;
  border-color: var(--itk-border);
  box-shadow: 0 12px 32px rgba(0, 0, 0, 0.4);
}

.itk-dark .itk-single-author {
  background: linear-gradient(135deg, var(--itk-surface-muted) 0%, var(--itk-surface) 100%);
  border-color: var(--itk-border);
}

.itk-dark .itk-single-author::before {
  background: radial-gradient(circle, rgba(248, 64, 16, 0.12) 0%, transparent 70%);
}

.itk-dark .itk-single-author-avatar img {
  border-color: var(--itk-surface);
}

.itk-dark .itk-single-author-label {
  color: var(--cyber-500);
}

.itk-dark .itk-post-nav-link {
  background: var(--itk-surface-muted);
  border-color: var(--itk-border);
}

.itk-dark .itk-post-nav-link:hover {
  background: var(--itk-surface);
  border-color: rgba(248, 64, 16, 0.35);
  box-shadow: 0 10px 28px rgba(0, 0, 0, 0.35);
}

.itk-dark .itk-related-posts {
  background: linear-gradient(180deg, var(--itk-surface) 0%, var(--itk-body-bg) 100%);
  border-top-color: var(--itk-border);
}

.itk-dark .itk-single-content .rmp-widgets-container {
  background: var(--itk-surface-muted);
  border-color: var(--itk-border);
}

.itk-dark .itk-single-content .rmp-heading--title {
  color: var(--itk-text-primary);
}

.itk-dark .itk-single-content .rmp-heading--subtitle,
.itk-dark .itk-single-content .rmp-rating-widget__results {
  color: var(--itk-text-muted);
}

.itk-dark .itk-tag {
  border-color: var(--itk-border);
}

.itk-dark .itk-sidebar-title {
  border-bottom-color: var(--itk-border-muted);
}

.itk-dark .itk-sidebar-cats a:hover {
  background: rgba(var(--accent-rgb), 0.1);
  color: var(--cyber-500);
}

.itk-dark .itk-share-btn {
  background: var(--itk-tag-bg);
  color: var(--itk-text-secondary);
}

.itk-dark .itk-tag {
  background: var(--itk-tag-bg);
  color: var(--itk-text-secondary);
}

.itk-dark .itk-tag:hover {
  background: var(--cyber-500);
  color: #fff;
}

.itk-dark .itk-prose {
  color: var(--itk-text-secondary);
}

.itk-dark .itk-prose a {
  color: var(--cyber-500);
}

.itk-dark .itk-prose blockquote {
  background: var(--itk-blockquote-bg);
  color: var(--itk-text-muted);
  border-right-color: var(--cyber-500);
}

/* Editor rich content — dark mode */
.itk-dark .itk-hl-yellow,
.itk-dark mark.itk-hl-yellow {
  background: linear-gradient(180deg, #854d0e 0%, #a16207 100%);
  color: #fef9c3;
}

.itk-dark .itk-hl-blue,
.itk-dark mark.itk-hl-blue {
  background: linear-gradient(180deg, #1e3a8a 0%, #1d4ed8 100%);
  color: #dbeafe;
}

.itk-dark .itk-hl-green,
.itk-dark mark.itk-hl-green {
  background: linear-gradient(180deg, #14532d 0%, #166534 100%);
  color: #dcfce7;
}

.itk-dark .itk-hl-cyber,
.itk-dark mark.itk-hl-cyber {
  background: linear-gradient(180deg, #9a3412 0%, var(--cyber-500) 100%);
  color: #fff7ed;
}

.itk-dark .itk-hl-purple,
.itk-dark mark.itk-hl-purple {
  background: linear-gradient(180deg, #581c87 0%, #7e22ce 100%);
  color: #f3e8ff;
}

.itk-dark .itk-prose .is-style-itk-lead {
  color: var(--itk-text-primary);
}

.itk-dark .itk-prose .is-style-itk-muted {
  color: var(--itk-text-muted);
}

.itk-dark .itk-prose .is-style-itk-gradient {
  background: linear-gradient(135deg, var(--cyber-500) 0%, #fb923c 50%, #e2e8f0 100%);
  -webkit-background-clip: text;
  background-clip: text;
}

.itk-dark .itk-prose .is-style-itk-callout-info {
  background: linear-gradient(135deg, #1e3a8a 0%, #1e40af 100%);
  border-color: #3b82f6;
  color: #dbeafe;
}

.itk-dark .itk-prose .is-style-itk-callout-success {
  background: linear-gradient(135deg, #14532d 0%, #166534 100%);
  border-color: #22c55e;
  color: #dcfce7;
}

.itk-dark .itk-prose .is-style-itk-callout-warning {
  background: linear-gradient(135deg, #78350f 0%, #92400e 100%);
  border-color: #f59e0b;
  color: #fef3c7;
}

.itk-dark .itk-prose .is-style-itk-callout-danger {
  background: linear-gradient(135deg, #7f1d1d 0%, #991b1b 100%);
  border-color: #ef4444;
  color: #fee2e2;
}

.itk-dark .itk-prose .is-style-itk-callout-cyber {
  background: linear-gradient(135deg, #431407 0%, #7c2d12 100%);
  border-color: var(--cyber-500);
  color: #ffedd5;
}

.itk-dark .itk-prose .wp-block-quote.is-style-itk-quote-cyber {
  background: linear-gradient(135deg, #431407 0%, var(--itk-surface) 100%);
  color: var(--itk-text-primary);
}

.itk-dark .itk-prose .wp-block-quote.is-style-itk-quote-minimal {
  border-right-color: var(--itk-border);
  color: var(--itk-text-muted);
}

.itk-dark .itk-tabs button,
.itk-dark .itk-media-tabs button,
.itk-dark .itk-sidebar-tab {
  background: var(--itk-surface);
  border-color: var(--itk-border);
  color: var(--itk-text-muted);
}

.itk-dark .itk-tabs button.is-active,
.itk-dark .itk-media-tabs button.is-active {
  background: var(--cyber-500);
  border-color: var(--cyber-500);
  color: #fff;
}

.itk-dark .itk-sidebar-tab.is-active {
  background: var(--cyber-500);
  border-color: var(--cyber-500);
  color: #fff;
}

.itk-dark .btn-outline {
  border-color: var(--cyber-500);
  color: var(--cyber-500);
}

.itk-dark .btn-outline:hover {
  background: var(--cyber-500);
  color: #fff;
}

.itk-dark .badge-red { background: rgba(220, 38, 38, 0.2); color: #fca5a5; }
.itk-dark .badge-blue { background: rgba(37, 99, 235, 0.2); color: #93c5fd; }
.itk-dark .badge-green { background: rgba(22, 163, 74, 0.2); color: #86efac; }
.itk-dark .badge-purple { background: rgba(126, 34, 206, 0.2); color: #d8b4fe; }
.itk-dark .badge-cyan { background: rgba(var(--accent-rgb), 0.2); color: #ffb89e; }
.itk-dark .badge-gray { background: var(--itk-tag-bg); color: var(--itk-text-muted); }

.itk-dark .itk-engagement-item {
  color: var(--itk-text-secondary);
}

.itk-dark .itk-engagement-item:hover,
.itk-dark .itk-engagement-item.is-active {
  color: var(--cyber-500);
  background: rgba(var(--accent-rgb), 0.12);
}

.itk-dark .itk-toc-toggle,
.itk-dark .itk-toc-list a {
  color: var(--itk-text-secondary);
}

.itk-dark .itk-toc-list a:hover,
.itk-dark .itk-toc-list a.is-active {
  color: var(--cyber-500);
}

.itk-dark .itk-ajax-search-results {
  background: var(--itk-surface);
  border-color: var(--itk-border);
  box-shadow: var(--itk-shadow-lg);
}

.itk-dark .itk-ajax-search-list a {
  color: var(--itk-text-secondary);
  border-bottom-color: var(--itk-border-muted);
}

.itk-dark .itk-ajax-search-list a:hover {
  background: rgba(var(--accent-rgb), 0.1);
  color: var(--itk-text-primary);
}

.itk-dark .itk-ajax-search-list strong {
  color: var(--itk-text-primary);
}

.itk-dark .itk-ajax-search-skeleton-item {
  border-bottom-color: var(--itk-border-muted);
}

.itk-dark .itk-comment-form input[type="text"],
.itk-dark .itk-comment-form input[type="email"],
.itk-dark .itk-comment-form input[type="url"],
.itk-dark .itk-comment-form textarea,
.itk-dark .itk-search-page-form input,
.itk-dark .itk-newsletter-form input,
.itk-dark .itk-footer-newsletter input {
  background: var(--itk-input-bg);
  border-color: var(--itk-input-border);
  color: var(--itk-text-primary);
}

.itk-dark .itk-comment-form input:focus,
.itk-dark .itk-comment-form textarea:focus,
.itk-dark .itk-search-page-form input:focus,
.itk-dark .itk-newsletter-form input:focus {
  border-color: rgba(var(--accent-rgb), 0.5);
  box-shadow: 0 0 0 3px rgba(var(--accent-rgb), 0.15);
}

.itk-dark .itk-comment-form label,
.itk-dark .itk-comment-form .logged-in-as {
  color: var(--itk-text-muted);
}

.itk-dark .itk-comment-form .logged-in-as a,
.itk-dark .itk-comment-author-url {
  color: var(--cyber-500);
}

.itk-dark .itk-comment-awaiting {
  background: rgba(var(--accent-rgb), 0.12);
  color: #ffb89e;
}

.itk-dark .itk-comment-reply a {
  background: var(--itk-tag-bg);
  color: var(--cyber-500);
}

.itk-dark .itk-comments .nav-previous a,
.itk-dark .itk-comments .nav-next a,
.itk-dark .pagination a,
.itk-dark .pagination span,
.itk-dark .nav-links a,
.itk-dark .nav-links span {
  background: var(--itk-surface);
  border-color: var(--itk-border);
  color: var(--itk-text-secondary);
}

.itk-dark .pagination a:hover,
.itk-dark .nav-links a:hover,
.itk-dark .itk-comments .nav-previous a:hover,
.itk-dark .itk-comments .nav-next a:hover {
  border-color: var(--cyber-500);
  color: var(--cyber-500);
}

.itk-dark .pagination .current,
.itk-dark .nav-links .current {
  background: var(--cyber-500);
  border-color: var(--cyber-500);
  color: #fff;
}

.itk-dark .itk-skeleton,
.itk-dark img.itk-img-loading {
  background: linear-gradient(90deg, var(--itk-skeleton-bg) 25%, rgba(255, 255, 255, 0.12) 50%, var(--itk-skeleton-bg) 75%);
}

.itk-dark .itk-infinite-loader {
  color: var(--itk-text-muted);
}

.itk-dark .itk-mobile-nav-link,
.itk-dark .itk-mobile-nav-sub a {
  color: var(--itk-drawer-text);
}

.itk-dark .itk-mobile-nav-link {
  color: var(--itk-drawer-title);
}

.itk-dark .itk-mobile-nav-sub a:hover {
  background: transparent;
  color: var(--cyber-500);
}

.itk-dark .itk-scroll-top {
  box-shadow: 0 4px 20px rgba(0, 0, 0, 0.4);
}

.itk-dark {
  scrollbar-color: var(--cyber-500) #1a2740;
}

.itk-dark ::-webkit-scrollbar-track {
  background: #1a2740;
}

.itk-dark ::-webkit-scrollbar-thumb {
  background: linear-gradient(180deg, var(--cyber-500), var(--cyan-700));
  border-color: #1a2740;
}

.itk-dark .itk-pwa-status {
  background: var(--itk-surface);
  color: var(--itk-text-primary);
  border-color: var(--itk-border);
}

/* Logo swap via .itk-dark */
.itk-dark .itk-logo .itk-logo-img--light { display: none; }
.itk-dark .itk-logo .itk-logo-img--dark { display: block; }

/* Theme toggle icons via .itk-dark */
.itk-dark .itk-theme-toggle .itk-theme-icon--moon { display: none; }
.itk-dark .itk-theme-toggle .itk-theme-icon--sun { display: inline-flex; }

.itk-dark .itk-footer-links a:hover,
.itk-dark .itk-footer-legal a:hover {
  color: var(--cyber-500);
}

/* ─── Light mode header text (override theme.css hardcoded white) ─── */
:root:not(.itk-dark) .itk-logo-text strong {
  color: var(--navy-900);
}

:root:not(.itk-dark) .itk-nav-link {
  color: var(--itk-nav-link);
}

:root:not(.itk-dark) .itk-nav-item.is-active .itk-nav-link,
:root:not(.itk-dark) .itk-nav-link:hover {
  color: var(--itk-nav-link-hover);
  background: var(--itk-nav-link-hover-bg);
}

:root:not(.itk-dark) .itk-nav-dropdown {
  background: var(--itk-dropdown-bg);
  border-color: var(--itk-dropdown-border);
  box-shadow: var(--itk-dropdown-shadow);
}

:root:not(.itk-dark) .itk-nav-dropdown a {
  color: var(--itk-dropdown-text);
}

:root:not(.itk-dark) .itk-nav-dropdown a:hover {
  background: var(--itk-dropdown-hover-bg);
  color: var(--itk-dropdown-hover-text);
}

:root:not(.itk-dark) .itk-header.is-scrolled {
  box-shadow: var(--itk-header-shadow);
}

:root:not(.itk-dark) .itk-header.is-scrolled .itk-header-main {
  background: var(--itk-header-main-bg-scrolled);
  border-bottom-color: var(--itk-header-glass-border);
  backdrop-filter: blur(var(--itk-header-glass-blur)) saturate(1.85);
  -webkit-backdrop-filter: blur(var(--itk-header-glass-blur)) saturate(1.85);
  box-shadow:
    inset 0 1px 0 var(--itk-header-glass-highlight),
    inset 0 -1px 0 var(--itk-header-main-border);
}

:root:not(.itk-dark) .itk-header-main {
  background: var(--itk-header-main-bg);
  border-bottom-color: var(--itk-header-main-border);
}