/* Shared Dark Mode Styles for All Tools */

[theme='dark'] .kubectl-builder-page,
[theme='dark'] .regex-lab-page,
[theme='dark'] .regex-lab-layout,
[theme='dark'] .passgen-page,
[theme='dark'] .jwt-tools-page,
[theme='dark'] .tempemail-page,
[theme='dark'] .n8n-gallery-page,
[theme='dark'] .ssl-tools-page,
[theme='dark'] .yaml-json-path-page,
[theme='dark'] .yaml-linter-page,
[theme='dark'] .json-linter-page,
body[theme='dark'] .kubectl-builder-page,
body[theme='dark'] .regex-lab-page,
body[theme='dark'] .regex-lab-layout,
body[theme='dark'] .passgen-page,
body[theme='dark'] .jwt-tools-page,
body[theme='dark'] .tempemail-page,
body[theme='dark'] .n8n-gallery-page,
body[theme='dark'] .ssl-tools-page,
body[theme='dark'] .yaml-json-path-page,
body[theme='dark'] .yaml-linter-page,
body[theme='dark'] .json-linter-page {
  --kubectl-bg: #0d1117;
  --kubectl-card-bg: #161b22;
  --kubectl-card-border: #30363d;
  --kubectl-accent: #58a6ff;
  --kubectl-accent-soft: rgba(88, 166, 255, 0.1);
  --kubectl-accent-strong: #79c0ff;
  --kubectl-text-main: #c9d1d9;
  --kubectl-text-muted: #8b949e;
  --kubectl-danger: #f85149;
  --kubectl-success: #3fb950;
  --kubectl-warning: #d29922;
  --kubectl-shadow-soft: 0 1px 3px rgba(0, 0, 0, 0.4), 0 1px 2px rgba(0, 0, 0, 0.3);
  --kubectl-border-subtle: 1px solid #30363d;
  --kubectl-input-bg: #0d1117;
  --kubectl-input-border: #30363d;
  --kubectl-fieldset-bg: #161b22;

  /* Regex Lab variables */
  --regex-bg: #0d1117;
  --regex-card-bg: #161b22;
  --regex-border: #30363d;
  --regex-text: #c9d1d9;
  --regex-text-main: #c9d1d9;
  --regex-text-muted: #8b949e;
  --regex-accent: #58a6ff;
  --regex-accent-soft: rgba(88, 166, 255, 0.1);
  --regex-accent-strong: #79c0ff;
  --regex-input-bg: #0d1117;
  --regex-input-border: #30363d;
  --regex-fieldset-bg: #161b22;
  --regex-match-bg: rgba(88, 166, 255, 0.2);
  --regex-group-bg: rgba(163, 113, 247, 0.2);
  --regex-danger: #f85149;
  --regex-success: #3fb950;

  /* Password Gen variables */
  --passgen-bg: #0d1117;
  --passgen-card-bg: #161b22;
  --passgen-border: #30363d;
  --passgen-text: #c9d1d9;
  --passgen-text-muted: #8b949e;
  --passgen-accent: #58a6ff;
  --passgen-success: #3fb950;
  --passgen-shadow: 0 2px 8px rgba(0, 0, 0, 0.4);

  /* JWT Tools variables */
  --jwt-bg: #0d1117;
  --jwt-card-bg: #161b22;
  --jwt-card-bg-alt: #0d1117;
  --jwt-border: #30363d;
  --jwt-card-border: #30363d;
  --jwt-text-main: #c9d1d9;
  --jwt-text-muted: #8b949e;
  --jwt-text-inverse: #ffffff;
  --jwt-accent-purple: #a855f7;
  --jwt-accent-purple-soft: #c9a0fd;
  --jwt-accent-purple-dark: #8b5cf6;
  --jwt-accent-purple-lighter: #a78bfa;
  --jwt-accent-purple-lightest: #c4b5fd;
  --jwt-input-bg: #0d1117;
  --jwt-input-border: #30363d;
  --jwt-input-border-focus: #a855f7;
  --jwt-btn-secondary-bg: #30363d;
  --jwt-btn-secondary-hover: #484f58;
  --jwt-success: #3fb950;
  --jwt-success-bg: #1b2b1b;
  --jwt-success-badge: #238636;
  --jwt-success-badge-hover: #2ea043;
  --jwt-error: #f85149;
  --jwt-error-bg: #2d1517;
  --jwt-error-badge: #da3633;
  --jwt-warning: #e3b341;
  --jwt-warning-bg: #3a2f1c;
  --jwt-warning-badge: #e3b341;
  --jwt-info: #58a6ff;
  --jwt-info-bg: #1c2a3a;
  --jwt-info-badge: #58a6ff;
  --jwt-tooltip-bg: #111827;
  --jwt-tooltip-text: #f9fafb;

  /* Temp Email variables */
  --tempemail-bg: #0d1117;
  --tempemail-card-bg: #161b22;
  --tempemail-card-border: #30363d;
  --tempemail-accent: #58a6ff;
  --tempemail-accent-hover: #79c0ff;
  --tempemail-accent-soft: rgba(88, 166, 255, 0.1);
  --tempemail-text-main: #c9d1d9;
  --tempemail-text-muted: #8b949e;
  --tempemail-success: #3fb950;
  --tempemail-success-soft: rgba(63, 185, 80, 0.15);
  --tempemail-danger: #f85149;
  --tempemail-danger-soft: rgba(248, 81, 73, 0.15);
  --tempemail-input-bg: #0d1117;
  --tempemail-input-border: #30363d;
  --tempemail-warning: #3a2f1c;
  --tempemail-warning-border: #9a6700;
  --tempemail-warning-text: #e3b341;

  /* n8n Gallery variables */
  --n8n-bg: #0d1117;
  --n8n-card-bg: #161b22;
  --n8n-card-border: #30363d;
  --n8n-accent: #58a6ff;
  --n8n-accent-hover: #79b8ff;
  --n8n-accent-soft: rgba(88, 166, 255, 0.15);
  --n8n-text-main: #c9d1d9;
  --n8n-text-muted: #8b949e;
  --n8n-success: #3fb950;
  --n8n-input-bg: #0d1117;
  --n8n-input-border: #30363d;
  --n8n-vcs-color: #a371f7;
  --n8n-vcs-bg: rgba(163, 113, 247, 0.15);
  --n8n-devops-color: #58a6ff;
  --n8n-devops-bg: rgba(88, 166, 255, 0.15);
  --n8n-automation-color: #d29922;
  --n8n-automation-bg: rgba(210, 153, 34, 0.15);
  --n8n-beginner-color: #3fb950;
  --n8n-beginner-bg: rgba(63, 185, 80, 0.15);
  --n8n-intermediate-color: #d29922;
  --n8n-intermediate-bg: rgba(210, 153, 34, 0.15);
  --n8n-advanced-color: #f85149;
  --n8n-advanced-bg: rgba(248, 81, 73, 0.15);

  /* YAML/JSON Path Tester variables */
  --yjp-bg: #0d1117;
  --yjp-card-bg: #161b22;
  --yjp-card-border: #30363d;
  --yjp-accent: #58a6ff;
  --yjp-accent-hover: #79c0ff;
  --yjp-accent-soft: rgba(88, 166, 255, 0.15);
  --yjp-text-main: #c9d1d9;
  --yjp-text-muted: #8b949e;
  --yjp-success: #3fb950;
  --yjp-success-soft: rgba(63, 185, 80, 0.15);
  --yjp-danger: #f85149;
  --yjp-danger-soft: rgba(248, 81, 73, 0.15);
  --yjp-input-bg: #0d1117;
  --yjp-input-border: #30363d;

  /* YAML Linter & JSON Linter variables */
  --yl-primary: #58a6ff;
  --yl-primary-soft: rgba(88, 166, 255, 0.15);
  --yl-body-bg: #0d1117;
  --yl-body-bg-alt: #0d1117;
  --yl-card-bg: #161b22;
  --yl-card-border: #30363d;
  --yl-input-bg: #0d1117;
  --yl-input-border: #30363d;
  --yl-result-bg: #161b22;
  --yl-result-border: #30363d;
  --yl-shadow-soft: 0 18px 40px rgba(0, 0, 0, 0.5);
  --yl-text-main: #c9d1d9;
  --yl-text-muted: #8b949e;
  --yl-text-error: #f87171;
  --yl-text-success: #4ade80;
  --yl-text-warning: #fbbf24;
  --yl-success-bg: rgba(63, 185, 80, 0.15);
  --yl-error-bg: rgba(248, 81, 73, 0.15);
  --yl-warning-bg: rgba(210, 153, 34, 0.15);
  --yl-border-subtle: #30363d;
  --yl-border-strong: #484f58;
}

/* Override specific backgrounds in dark mode */
[theme='dark'] .kubectl-card,
[theme='dark'] .regex-panel,
[theme='dark'] .regex-lab-card,
[theme='dark'] .regex-lab-fieldset,
[theme='dark'] .regex-lab-groups-panel,
[theme='dark'] .regex-lab-explanation-panel,
[theme='dark'] .regex-lab-highlight-preview,
[theme='dark'] .regex-lab-recipes,
[theme='dark'] .passgen-card,
[theme='dark'] .jwt-tools-page .tool-section,
[theme='dark'] .jwt-tools-page .card,
[theme='dark'] .tempemail-card,
[theme='dark'] .tempemail-inbox,
[theme='dark'] .tempemail-modal-content,
[theme='dark'] .n8n-gallery-card,
[theme='dark'] .n8n-gallery-filters,
[theme='dark'] .n8n-gallery-modal-content,
[theme='dark'] .ssl-tools-page .regex-lab-card,
[theme='dark'] .ssl-tools-page .tab-nav,
[theme='dark'] .yaml-json-path-page .regex-lab-card,
[theme='dark'] .yaml-json-path-page .examples-section,
[theme='dark'] .yaml-linter-page .yl-card,
[theme='dark'] .yaml-linter-page .yl-input-wrapper,
[theme='dark'] .yaml-linter-page .yl-result-panel,
[theme='dark'] .yaml-linter-page .yl-result-body,
[theme='dark'] .json-linter-page .yl-card,
[theme='dark'] .json-linter-page .yl-input-wrapper,
[theme='dark'] .json-linter-page .yl-result-panel,
[theme='dark'] .json-linter-page .yl-result-body,
body[theme='dark'] .kubectl-card,
body[theme='dark'] .regex-panel,
body[theme='dark'] .regex-lab-card,
body[theme='dark'] .regex-lab-fieldset,
body[theme='dark'] .regex-lab-groups-panel,
body[theme='dark'] .regex-lab-explanation-panel,
body[theme='dark'] .regex-lab-highlight-preview,
body[theme='dark'] .regex-lab-recipes,
body[theme='dark'] .passgen-card,
body[theme='dark'] .jwt-tools-page .tool-section,
body[theme='dark'] .jwt-tools-page .card,
body[theme='dark'] .tempemail-card,
body[theme='dark'] .tempemail-inbox,
body[theme='dark'] .tempemail-modal-content,
body[theme='dark'] .n8n-gallery-card,
body[theme='dark'] .n8n-gallery-filters,
body[theme='dark'] .n8n-gallery-modal-content,
body[theme='dark'] .ssl-tools-page .regex-lab-card,
body[theme='dark'] .ssl-tools-page .tab-nav,
body[theme='dark'] .yaml-json-path-page .regex-lab-card,
body[theme='dark'] .yaml-json-path-page .examples-section,
body[theme='dark'] .yaml-linter-page .yl-card,
body[theme='dark'] .yaml-linter-page .yl-input-wrapper,
body[theme='dark'] .yaml-linter-page .yl-result-panel,
body[theme='dark'] .yaml-linter-page .yl-result-body,
body[theme='dark'] .json-linter-page .yl-card,
body[theme='dark'] .json-linter-page .yl-input-wrapper,
body[theme='dark'] .json-linter-page .yl-result-panel,
body[theme='dark'] .json-linter-page .yl-result-body {
  background: var(--kubectl-card-bg) !important;
  border-color: var(--kubectl-card-border) !important;
}

/* Fix dark text on dark backgrounds */
[theme='dark'] .regex-lab-card-title,
[theme='dark'] .regex-lab-section-label,
[theme='dark'] .regex-lab-recipes-title,
body[theme='dark'] .regex-lab-card-title,
body[theme='dark'] .regex-lab-section-label,
body[theme='dark'] .regex-lab-recipes-title {
  color: var(--kubectl-text-main) !important;
}

[theme='dark'] .kubectl-builder-page,
[theme='dark'] .regex-lab-page,
[theme='dark'] .regex-lab-layout,
[theme='dark'] .passgen-page,
[theme='dark'] .jwt-tools-page,
[theme='dark'] .tempemail-page,
[theme='dark'] .n8n-gallery-page,
[theme='dark'] .ssl-tools-page,
[theme='dark'] .yaml-json-path-page,
[theme='dark'] .yaml-linter-page,
[theme='dark'] .json-linter-page,
body[theme='dark'] .kubectl-builder-page,
body[theme='dark'] .regex-lab-page,
body[theme='dark'] .regex-lab-layout,
body[theme='dark'] .passgen-page,
body[theme='dark'] .jwt-tools-page,
body[theme='dark'] .tempemail-page,
body[theme='dark'] .n8n-gallery-page,
body[theme='dark'] .ssl-tools-page,
body[theme='dark'] .yaml-json-path-page,
body[theme='dark'] .yaml-linter-page,
body[theme='dark'] .json-linter-page {
  background: var(--kubectl-bg) !important;
  color: var(--kubectl-text-main) !important;
}

/* Input fields in dark mode */
[theme='dark'] :is(.kubectl-builder-page, .regex-lab-page, .regex-lab-layout, .passgen-page, .jwt-tools-page, .tempemail-page, .n8n-gallery-page, .ssl-tools-page, .yaml-json-path-page, .yaml-linter-page, .json-linter-page) input,
[theme='dark'] :is(.kubectl-builder-page, .regex-lab-page, .regex-lab-layout, .passgen-page, .jwt-tools-page, .tempemail-page, .n8n-gallery-page, .ssl-tools-page, .yaml-json-path-page, .yaml-linter-page, .json-linter-page) select,
[theme='dark'] :is(.kubectl-builder-page, .regex-lab-page, .regex-lab-layout, .passgen-page, .jwt-tools-page, .tempemail-page, .n8n-gallery-page, .ssl-tools-page, .yaml-json-path-page, .yaml-linter-page, .json-linter-page) textarea,
body[theme='dark'] :is(.kubectl-builder-page, .regex-lab-page, .regex-lab-layout, .passgen-page, .jwt-tools-page, .tempemail-page, .n8n-gallery-page, .ssl-tools-page, .yaml-json-path-page, .yaml-linter-page, .json-linter-page) input,
body[theme='dark'] :is(.kubectl-builder-page, .regex-lab-page, .regex-lab-layout, .passgen-page, .jwt-tools-page, .tempemail-page, .n8n-gallery-page, .ssl-tools-page, .yaml-json-path-page, .yaml-linter-page, .json-linter-page) select,
body[theme='dark'] :is(.kubectl-builder-page, .regex-lab-page, .regex-lab-layout, .passgen-page, .jwt-tools-page, .tempemail-page, .n8n-gallery-page, .ssl-tools-page, .yaml-json-path-page, .yaml-linter-page, .json-linter-page) textarea {
  background: var(--kubectl-input-bg) !important;
  border-color: var(--kubectl-input-border) !important;
  color: var(--kubectl-text-main) !important;
}

[theme='dark'] :is(.kubectl-builder-page, .regex-lab-page, .regex-lab-layout, .passgen-page, .jwt-tools-page, .tempemail-page, .n8n-gallery-page, .yaml-json-path-page) input:focus,
[theme='dark'] :is(.kubectl-builder-page, .regex-lab-page, .regex-lab-layout, .passgen-page, .jwt-tools-page, .tempemail-page, .n8n-gallery-page, .yaml-json-path-page) select:focus,
[theme='dark'] :is(.kubectl-builder-page, .regex-lab-page, .regex-lab-layout, .passgen-page, .jwt-tools-page, .tempemail-page, .n8n-gallery-page, .yaml-json-path-page) textarea:focus,
body[theme='dark'] :is(.kubectl-builder-page, .regex-lab-page, .regex-lab-layout, .passgen-page, .jwt-tools-page, .tempemail-page, .n8n-gallery-page, .yaml-json-path-page) input:focus,
body[theme='dark'] :is(.kubectl-builder-page, .regex-lab-page, .regex-lab-layout, .passgen-page, .jwt-tools-page, .tempemail-page, .n8n-gallery-page, .yaml-json-path-page) select:focus,
body[theme='dark'] :is(.kubectl-builder-page, .regex-lab-page, .regex-lab-layout, .passgen-page, .jwt-tools-page, .tempemail-page, .n8n-gallery-page, .yaml-json-path-page) textarea:focus {
  border-color: var(--kubectl-accent) !important;
  outline: none;
  box-shadow: 0 0 0 3px var(--kubectl-accent-soft);
}

/* Buttons in dark mode */
[theme='dark'] :is(.kubectl-builder-page, .regex-lab-page, .regex-lab-layout, .passgen-page, .jwt-tools-page, .tempemail-page, .n8n-gallery-page, .ssl-tools-page, .yaml-json-path-page) button,
body[theme='dark'] :is(.kubectl-builder-page, .regex-lab-page, .regex-lab-layout, .passgen-page, .jwt-tools-page, .tempemail-page, .n8n-gallery-page, .ssl-tools-page, .yaml-json-path-page) button {
  background: var(--kubectl-card-bg) !important;
  border-color: var(--kubectl-card-border) !important;
  color: var(--kubectl-text-main) !important;
}

[theme='dark'] :is(.kubectl-builder-page, .regex-lab-page, .regex-lab-layout, .passgen-page, .jwt-tools-page, .tempemail-page, .n8n-gallery-page, .ssl-tools-page, .yaml-json-path-page) button:hover,
body[theme='dark'] :is(.kubectl-builder-page, .regex-lab-page, .regex-lab-layout, .passgen-page, .jwt-tools-page, .tempemail-page, .n8n-gallery-page, .ssl-tools-page, .yaml-json-path-page) button:hover {
  background: var(--kubectl-accent) !important;
  border-color: var(--kubectl-accent) !important;
  color: #ffffff !important;
}

/* Code blocks and monospace in dark mode */
[theme='dark'] :is(.kubectl-builder-page, .regex-lab-page, .regex-lab-layout, .passgen-page, .jwt-tools-page) code,
[theme='dark'] :is(.kubectl-builder-page, .regex-lab-page, .regex-lab-layout, .passgen-page, .jwt-tools-page) pre,
[theme='dark'] :is(.kubectl-builder-page, .regex-lab-page, .regex-lab-layout, .passgen-page, .jwt-tools-page) .kubectl-command-output,
[theme='dark'] :is(.kubectl-builder-page, .regex-lab-page, .regex-lab-layout, .passgen-page, .jwt-tools-page) .regex-pattern,
[theme='dark'] :is(.kubectl-builder-page, .regex-lab-page, .regex-lab-layout, .passgen-page, .jwt-tools-page) .passgen-output,
body[theme='dark'] :is(.kubectl-builder-page, .regex-lab-page, .regex-lab-layout, .passgen-page, .jwt-tools-page) code,
body[theme='dark'] :is(.kubectl-builder-page, .regex-lab-page, .regex-lab-layout, .passgen-page, .jwt-tools-page) pre,
body[theme='dark'] :is(.kubectl-builder-page, .regex-lab-page, .regex-lab-layout, .passgen-page, .jwt-tools-page) .kubectl-command-output,
body[theme='dark'] :is(.kubectl-builder-page, .regex-lab-page, .regex-lab-layout, .passgen-page, .jwt-tools-page) .regex-pattern,
body[theme='dark'] :is(.kubectl-builder-page, .regex-lab-page, .regex-lab-layout, .passgen-page, .jwt-tools-page) .passgen-output {
  background: var(--kubectl-input-bg) !important;
  color: var(--kubectl-text-main) !important;
  border-color: var(--kubectl-input-border) !important;
}

/* Range slider in dark mode - make it more visible */
[theme='dark'] :is(.kubectl-builder-page, .regex-lab-page, .regex-lab-layout, .passgen-page, .jwt-tools-page) .length-slider,
body[theme='dark'] :is(.kubectl-builder-page, .regex-lab-page, .regex-lab-layout, .passgen-page, .jwt-tools-page) .length-slider {
  background: linear-gradient(
    90deg,
    #c2185b,
    #ffcc33,
    #00f6ff
  ) !important;
  box-shadow:
    0 0 0 1px rgba(255, 255, 255, 0.2),
    0 0 10px rgba(88, 166, 255, 0.3) !important;
}
[theme='dark'] :is(.kubectl-builder-page, .regex-lab-page, .regex-lab-layout, .passgen-page, .jwt-tools-page) .length-slider::-webkit-slider-thumb,
body[theme='dark'] :is(.kubectl-builder-page, .regex-lab-page, .regex-lab-layout, .passgen-page, .jwt-tools-page) .length-slider::-webkit-slider-thumb {
  background: radial-gradient(circle at 30% 20%, #fff 0, #58a6ff 45%, #1f6feb 80%) !important;
  border: 1px solid rgba(255, 255, 255, 0.3) !important;
  box-shadow:
    0 2px 6px rgba(0, 0, 0, 0.9),
    0 0 10px rgba(88, 166, 255, 0.9) !important;
}
[theme='dark'] :is(.kubectl-builder-page, .regex-lab-page, .regex-lab-layout, .passgen-page, .jwt-tools-page) .length-slider::-moz-range-thumb,
body[theme='dark'] :is(.kubectl-builder-page, .regex-lab-page, .regex-lab-layout, .passgen-page, .jwt-tools-page) .length-slider::-moz-range-thumb {
  background: radial-gradient(circle at 30% 20%, #fff 0, #58a6ff 45%, #1f6feb 80%) !important;
  border: 1px solid rgba(255, 255, 255, 0.3) !important;
  box-shadow:
    0 2px 6px rgba(0, 0, 0, 0.9),
    0 0 10px rgba(88, 166, 255, 0.9) !important;
}
[theme='dark'] :is(.kubectl-builder-page, .regex-lab-page, .regex-lab-layout, .passgen-page, .jwt-tools-page) .length-slider::-moz-range-track,
body[theme='dark'] :is(.kubectl-builder-page, .regex-lab-page, .regex-lab-layout, .passgen-page, .jwt-tools-page) .length-slider::-moz-range-track {
  background: linear-gradient(
    90deg,
    #c2185b,
    #ffcc33,
    #00f6ff
  ) !important;
}

/* JWT Tools specific dark mode fixes */
[theme='dark'] .jwt-tools-page .btn-primary:hover,
body[theme='dark'] .jwt-tools-page .btn-primary:hover {
  background: linear-gradient(135deg, #6d28d9 0%, #9333ea 100%) !important;
  color: #ffffff !important;
}

[theme='dark'] .jwt-tools-page .btn-secondary:hover,
body[theme='dark'] .jwt-tools-page .btn-secondary:hover {
  background: #484f58 !important;
  color: #c9d1d9 !important;
}

[theme='dark'] .jwt-tools-page .btn-toggle-active,
body[theme='dark'] .jwt-tools-page .btn-toggle-active {
  background: #8b5cf6 !important;
  color: #ffffff !important;
}

[theme='dark'] .jwt-tools-page .tab-button.active,
body[theme='dark'] .jwt-tools-page .tab-button.active {
  color: #c9d1d9 !important;
  border-bottom-color: #a855f7 !important;
}

/* ==================== Temp Email Dark Mode ==================== */

[theme='dark'] .tempemail-card,
[theme='dark'] .tempemail-inbox,
[theme='dark'] .tempemail-alternatives,
[theme='dark'] .tempemail-modal-content,
body[theme='dark'] .tempemail-card,
body[theme='dark'] .tempemail-inbox,
body[theme='dark'] .tempemail-alternatives,
body[theme='dark'] .tempemail-modal-content {
  background: #161b22 !important;
  border-color: #30363d !important;
  color: #c9d1d9 !important;
}

[theme='dark'] .tempemail-notice,
body[theme='dark'] .tempemail-notice {
  background: rgba(88, 166, 255, 0.1) !important;
  border-color: #30363d !important;
  color: #c9d1d9 !important;
}

[theme='dark'] .tempemail-notice strong,
body[theme='dark'] .tempemail-notice strong {
  color: #58a6ff !important;
}

[theme='dark'] .tempemail-card-header h2,
[theme='dark'] .tempemail-section-label,
[theme='dark'] .tempemail-alternatives h3,
[theme='dark'] .tempemail-modal-header h3,
body[theme='dark'] .tempemail-card-header h2,
body[theme='dark'] .tempemail-section-label,
body[theme='dark'] .tempemail-alternatives h3,
body[theme='dark'] .tempemail-modal-header h3 {
  color: #c9d1d9 !important;
}

[theme='dark'] .tempemail-card-header small,
[theme='dark'] .tempemail-helper-text,
[theme='dark'] .tempemail-inbox-empty-hint,
[theme='dark'] .tempemail-message-subject,
[theme='dark'] .tempemail-message-date,
[theme='dark'] .tempemail-modal-meta,
body[theme='dark'] .tempemail-card-header small,
body[theme='dark'] .tempemail-helper-text,
body[theme='dark'] .tempemail-inbox-empty-hint,
body[theme='dark'] .tempemail-message-subject,
body[theme='dark'] .tempemail-message-date,
body[theme='dark'] .tempemail-modal-meta {
  color: #8b949e !important;
}

[theme='dark'] .tempemail-email-display input,
[theme='dark'] .tempemail-field input,
body[theme='dark'] .tempemail-email-display input,
body[theme='dark'] .tempemail-field input {
  background: #0d1117 !important;
  border-color: #30363d !important;
  color: #c9d1d9 !important;
}

[theme='dark'] .tempemail-email-display input,
body[theme='dark'] .tempemail-email-display input {
  border-color: #58a6ff !important;
}

[theme='dark'] .tempemail-domain-suffix,
body[theme='dark'] .tempemail-domain-suffix {
  background: #30363d !important;
  border-color: #30363d !important;
  color: #8b949e !important;
}

[theme='dark'] .tempemail-provider-btn,
body[theme='dark'] .tempemail-provider-btn {
  background: #0d1117 !important;
  border-color: #30363d !important;
  color: #8b949e !important;
}

[theme='dark'] .tempemail-provider-btn:hover,
body[theme='dark'] .tempemail-provider-btn:hover {
  border-color: #58a6ff !important;
  color: #58a6ff !important;
}

[theme='dark'] .tempemail-provider-btn.active,
body[theme='dark'] .tempemail-provider-btn.active {
  background: rgba(88, 166, 255, 0.1) !important;
  border-color: #58a6ff !important;
  color: #58a6ff !important;
}

[theme='dark'] .tempemail-info-box,
body[theme='dark'] .tempemail-info-box {
  background: rgba(88, 166, 255, 0.1) !important;
  color: #c9d1d9 !important;
}

[theme='dark'] .tempemail-info-box strong,
body[theme='dark'] .tempemail-info-box strong {
  color: #58a6ff !important;
}

[theme='dark'] .tempemail-message-item,
body[theme='dark'] .tempemail-message-item {
  border-color: #30363d !important;
}

[theme='dark'] .tempemail-message-item:hover,
body[theme='dark'] .tempemail-message-item:hover {
  background: rgba(88, 166, 255, 0.1) !important;
}

[theme='dark'] .tempemail-message-item.unread,
body[theme='dark'] .tempemail-message-item.unread {
  background: rgba(63, 185, 80, 0.15) !important;
}

[theme='dark'] .tempemail-message-from,
[theme='dark'] .tempemail-inbox-empty-text,
body[theme='dark'] .tempemail-message-from,
body[theme='dark'] .tempemail-inbox-empty-text {
  color: #c9d1d9 !important;
}

[theme='dark'] .tempemail-alt-link,
body[theme='dark'] .tempemail-alt-link {
  background: #0d1117 !important;
  border-color: #30363d !important;
  color: #c9d1d9 !important;
}

[theme='dark'] .tempemail-alt-link:hover,
body[theme='dark'] .tempemail-alt-link:hover {
  background: rgba(88, 166, 255, 0.1) !important;
  border-color: #58a6ff !important;
}

[theme='dark'] .tempemail-alt-link strong,
body[theme='dark'] .tempemail-alt-link strong {
  color: #58a6ff !important;
}

[theme='dark'] .tempemail-alt-link span,
body[theme='dark'] .tempemail-alt-link span {
  color: #8b949e !important;
}

[theme='dark'] .tempemail-btn-primary,
body[theme='dark'] .tempemail-btn-primary {
  background: #58a6ff !important;
  border-color: #58a6ff !important;
  color: #ffffff !important;
}

[theme='dark'] .tempemail-btn-primary:hover,
body[theme='dark'] .tempemail-btn-primary:hover {
  background: #79c0ff !important;
  border-color: #79c0ff !important;
}

[theme='dark'] .tempemail-btn-secondary,
body[theme='dark'] .tempemail-btn-secondary {
  background: rgba(88, 166, 255, 0.1) !important;
  color: #58a6ff !important;
}

[theme='dark'] .tempemail-btn-secondary:hover,
body[theme='dark'] .tempemail-btn-secondary:hover {
  background: #58a6ff !important;
  color: #ffffff !important;
}

[theme='dark'] .tempemail-btn-ghost,
body[theme='dark'] .tempemail-btn-ghost {
  background: transparent !important;
  border-color: #30363d !important;
  color: #8b949e !important;
}

[theme='dark'] .tempemail-btn-ghost:hover,
body[theme='dark'] .tempemail-btn-ghost:hover {
  background: #30363d !important;
  color: #c9d1d9 !important;
}

[theme='dark'] .tempemail-btn-danger,
body[theme='dark'] .tempemail-btn-danger {
  background: rgba(248, 81, 73, 0.15) !important;
  color: #f85149 !important;
}

[theme='dark'] .tempemail-btn-danger:hover,
body[theme='dark'] .tempemail-btn-danger:hover {
  background: #f85149 !important;
  color: #ffffff !important;
}

[theme='dark'] .tempemail-modal-backdrop,
body[theme='dark'] .tempemail-modal-backdrop {
  background: rgba(0, 0, 0, 0.7) !important;
}

[theme='dark'] .tempemail-modal-header,
[theme='dark'] .tempemail-modal-footer,
body[theme='dark'] .tempemail-modal-header,
body[theme='dark'] .tempemail-modal-footer {
  border-color: #30363d !important;
}

[theme='dark'] .tempemail-refresh-dot,
body[theme='dark'] .tempemail-refresh-dot {
  background: #3fb950 !important;
}

/* ==================== YAML/JSON Path Tester Dark Mode ==================== */

[theme='dark'] .yaml-json-path-page .examples-section,
body[theme='dark'] .yaml-json-path-page .examples-section {
  background: rgba(88, 166, 255, 0.1) !important;
}

[theme='dark'] .yaml-json-path-page .result-info,
body[theme='dark'] .yaml-json-path-page .result-info {
  background: rgba(88, 166, 255, 0.1) !important;
}

[theme='dark'] .yaml-json-path-page .example-item,
[theme='dark'] .yaml-json-path-page .syntax-item,
body[theme='dark'] .yaml-json-path-page .example-item,
body[theme='dark'] .yaml-json-path-page .syntax-item {
  background: #0d1117 !important;
  border-color: #30363d !important;
}

[theme='dark'] .yaml-json-path-page .example-item:hover,
body[theme='dark'] .yaml-json-path-page .example-item:hover {
  background: #161b22 !important;
  border-color: #58a6ff !important;
}

[theme='dark'] .yaml-json-path-page .example-label,
[theme='dark'] .yaml-json-path-page .example-desc,
body[theme='dark'] .yaml-json-path-page .example-label,
body[theme='dark'] .yaml-json-path-page .example-desc {
  color: #8b949e !important;
}

[theme='dark'] .yaml-json-path-page .example-item code,
[theme='dark'] .yaml-json-path-page .syntax-item code,
body[theme='dark'] .yaml-json-path-page .example-item code,
body[theme='dark'] .yaml-json-path-page .syntax-item code {
  color: #58a6ff !important;
  background: rgba(88, 166, 255, 0.15) !important;
}

[theme='dark'] .yaml-json-path-page .syntax-item span,
body[theme='dark'] .yaml-json-path-page .syntax-item span {
  color: #8b949e !important;
}

[theme='dark'] .yaml-json-path-page .regex-lab-card h3,
[theme='dark'] .yaml-json-path-page .examples-section h3,
[theme='dark'] .yaml-json-path-page .input-group label,
[theme='dark'] .yaml-json-path-page .editor-wrapper label,
[theme='dark'] .yaml-json-path-page .match-count,
body[theme='dark'] .yaml-json-path-page .regex-lab-card h3,
body[theme='dark'] .yaml-json-path-page .examples-section h3,
body[theme='dark'] .yaml-json-path-page .input-group label,
body[theme='dark'] .yaml-json-path-page .editor-wrapper label,
body[theme='dark'] .yaml-json-path-page .match-count {
  color: #58a6ff !important;
}

[theme='dark'] .yaml-json-path-page .copy-btn,
body[theme='dark'] .yaml-json-path-page .copy-btn {
  background: #238636 !important;
  color: #ffffff !important;
  border: none !important;
}

[theme='dark'] .yaml-json-path-page .copy-btn:hover,
body[theme='dark'] .yaml-json-path-page .copy-btn:hover {
  background: #2ea043 !important;
}

[theme='dark'] .yaml-json-path-page .yjp-success,
body[theme='dark'] .yaml-json-path-page .yjp-success {
  background: rgba(63, 185, 80, 0.15) !important;
  color: #3fb950 !important;
  border-color: #3fb950 !important;
}

[theme='dark'] .yaml-json-path-page .yjp-error,
body[theme='dark'] .yaml-json-path-page .yjp-error {
  background: rgba(248, 81, 73, 0.15) !important;
  color: #f85149 !important;
  border-color: #f85149 !important;
}

[theme='dark'] .yaml-json-path-page .btn-secondary,
body[theme='dark'] .yaml-json-path-page .btn-secondary {
  background: transparent !important;
  border-color: #30363d !important;
  color: #8b949e !important;
}

[theme='dark'] .yaml-json-path-page .btn-secondary:hover,
body[theme='dark'] .yaml-json-path-page .btn-secondary:hover {
  background: #30363d !important;
  color: #c9d1d9 !important;
}

/* ==================== YAML Linter & JSON Linter Dark Mode ==================== */

/* Updated dark mode variables for new structure */
[theme='dark'] .yaml-linter-page,
[theme='dark'] .json-linter-page,
body[theme='dark'] .yaml-linter-page,
body[theme='dark'] .json-linter-page {
  --yl-bg: #0d1117;
  --yl-card-bg: #161b22;
  --yl-card-border: #30363d;
  --yl-accent: #58a6ff;
  --yl-accent-hover: #79c0ff;
  --yl-accent-soft: rgba(88, 166, 255, 0.15);
  --yl-text-main: #c9d1d9;
  --yl-text-muted: #8b949e;
  --yl-success: #3fb950;
  --yl-success-soft: rgba(63, 185, 80, 0.15);
  --yl-danger: #f85149;
  --yl-danger-soft: rgba(248, 81, 73, 0.15);
  --yl-warning: #d29922;
  --yl-warning-soft: rgba(210, 153, 34, 0.15);
  --yl-input-bg: #0d1117;
  --yl-input-border: #30363d;
}

/* Cards */
[theme='dark'] .yaml-linter-page .regex-lab-card,
[theme='dark'] .json-linter-page .regex-lab-card,
body[theme='dark'] .yaml-linter-page .regex-lab-card,
body[theme='dark'] .json-linter-page .regex-lab-card {
  background: #161b22 !important;
  border-color: #30363d !important;
}

/* Labels */
[theme='dark'] .yaml-linter-page .regex-lab-card h3,
[theme='dark'] .yaml-linter-page .input-group label,
[theme='dark'] .yaml-linter-page .editor-wrapper > label,
[theme='dark'] .json-linter-page .regex-lab-card h3,
[theme='dark'] .json-linter-page .input-group label,
[theme='dark'] .json-linter-page .editor-wrapper > label,
body[theme='dark'] .yaml-linter-page .regex-lab-card h3,
body[theme='dark'] .yaml-linter-page .input-group label,
body[theme='dark'] .yaml-linter-page .editor-wrapper > label,
body[theme='dark'] .json-linter-page .regex-lab-card h3,
body[theme='dark'] .json-linter-page .input-group label,
body[theme='dark'] .json-linter-page .editor-wrapper > label {
  color: #58a6ff !important;
}

/* Result info bar */
[theme='dark'] .yaml-linter-page .result-info,
[theme='dark'] .json-linter-page .result-info,
body[theme='dark'] .yaml-linter-page .result-info,
body[theme='dark'] .json-linter-page .result-info {
  background: rgba(88, 166, 255, 0.1) !important;
}

/* Result status pill */
[theme='dark'] .yaml-linter-page .result-status,
[theme='dark'] .json-linter-page .result-status,
body[theme='dark'] .yaml-linter-page .result-status,
body[theme='dark'] .json-linter-page .result-status {
  background: #30363d !important;
  color: #8b949e !important;
}

[theme='dark'] .yaml-linter-page .result-status.ok,
[theme='dark'] .json-linter-page .result-status.ok,
body[theme='dark'] .yaml-linter-page .result-status.ok,
body[theme='dark'] .json-linter-page .result-status.ok {
  background: rgba(63, 185, 80, 0.15) !important;
  color: #3fb950 !important;
}

[theme='dark'] .yaml-linter-page .result-status.error,
[theme='dark'] .json-linter-page .result-status.error,
body[theme='dark'] .yaml-linter-page .result-status.error,
body[theme='dark'] .json-linter-page .result-status.error {
  background: rgba(248, 81, 73, 0.15) !important;
  color: #f85149 !important;
}

/* Result meta */
[theme='dark'] .yaml-linter-page .result-meta code,
[theme='dark'] .json-linter-page .result-meta code,
body[theme='dark'] .yaml-linter-page .result-meta code,
body[theme='dark'] .json-linter-page .result-meta code {
  background: rgba(88, 166, 255, 0.15) !important;
  color: #58a6ff !important;
}

/* Result body */
[theme='dark'] .yaml-linter-page .result-body,
[theme='dark'] .json-linter-page .result-body,
body[theme='dark'] .yaml-linter-page .result-body,
body[theme='dark'] .json-linter-page .result-body {
  background: #0d1117 !important;
  border-color: #30363d !important;
  color: #8b949e !important;
}

/* Buttons */
[theme='dark'] .yaml-linter-page .btn-primary,
[theme='dark'] .json-linter-page .btn-primary,
body[theme='dark'] .yaml-linter-page .btn-primary,
body[theme='dark'] .json-linter-page .btn-primary {
  background: #58a6ff !important;
  border-color: #58a6ff !important;
  color: #ffffff !important;
}

[theme='dark'] .yaml-linter-page .btn-primary:hover,
[theme='dark'] .json-linter-page .btn-primary:hover,
body[theme='dark'] .yaml-linter-page .btn-primary:hover,
body[theme='dark'] .json-linter-page .btn-primary:hover {
  background: #79c0ff !important;
  border-color: #79c0ff !important;
}

[theme='dark'] .yaml-linter-page .btn-secondary,
[theme='dark'] .json-linter-page .btn-secondary,
body[theme='dark'] .yaml-linter-page .btn-secondary,
body[theme='dark'] .json-linter-page .btn-secondary {
  background: transparent !important;
  border-color: #30363d !important;
  color: #8b949e !important;
}

[theme='dark'] .yaml-linter-page .btn-secondary:hover,
[theme='dark'] .json-linter-page .btn-secondary:hover,
body[theme='dark'] .yaml-linter-page .btn-secondary:hover,
body[theme='dark'] .json-linter-page .btn-secondary:hover {
  background: #30363d !important;
  color: #c9d1d9 !important;
}

/* Info text */
[theme='dark'] .yaml-linter-page .info-text code,
[theme='dark'] .json-linter-page .info-text code,
body[theme='dark'] .yaml-linter-page .info-text code,
body[theme='dark'] .json-linter-page .info-text code {
  background: rgba(88, 166, 255, 0.15) !important;
  color: #58a6ff !important;
}

/* Toggle label */
[theme='dark'] .yaml-linter-page .toggle-label,
[theme='dark'] .json-linter-page .toggle-label,
body[theme='dark'] .yaml-linter-page .toggle-label,
body[theme='dark'] .json-linter-page .toggle-label {
  color: #c9d1d9 !important;
}

/* Error/Success text */
[theme='dark'] .yaml-linter-page .error-line,
[theme='dark'] .json-linter-page .error-line,
body[theme='dark'] .yaml-linter-page .error-line,
body[theme='dark'] .json-linter-page .error-line {
  color: #f85149 !important;
}

[theme='dark'] .yaml-linter-page .warning-line,
[theme='dark'] .json-linter-page .warning-line,
body[theme='dark'] .yaml-linter-page .warning-line,
body[theme='dark'] .json-linter-page .warning-line {
  color: #d29922 !important;
}

[theme='dark'] .yaml-linter-page .success-text,
[theme='dark'] .json-linter-page .success-text,
body[theme='dark'] .yaml-linter-page .success-text,
body[theme='dark'] .json-linter-page .success-text {
  color: #3fb950 !important;
}

/* JSON Preview */
[theme='dark'] .yaml-linter-page .json-preview-wrapper,
[theme='dark'] .json-linter-page .json-preview-wrapper,
body[theme='dark'] .yaml-linter-page .json-preview-wrapper,
body[theme='dark'] .json-linter-page .json-preview-wrapper {
  background: #161b22 !important;
  border-color: #30363d !important;
}

[theme='dark'] .yaml-linter-page .json-preview,
[theme='dark'] .json-linter-page .json-preview,
body[theme='dark'] .yaml-linter-page .json-preview,
body[theme='dark'] .json-linter-page .json-preview {
  color: #c9d1d9 !important;
}