/* ==========================================================================
   AMS DIGITAL — DARK MODE OVERRIDES
   Automatically applied when root html has [data-theme="dark"]
   ========================================================================== */

[data-theme="dark"] {
  --bg:                #0A0A0A;
  --fg:                #F0F0F0;
  --fg-muted:          #8A8A8A;
  --bg-card:           #161616;
  --bg-surface:        #111111;
  --border:            #2A2A2A;
  --color-hover-bg:    #1A1A1A;
  --color-tag-bg:      #1E1E1E;
  --header-bg:         rgba(10,10,10,0.92);
  --shadow-xs:         0 1px 2px rgba(0,0,0,0.2);
  --shadow-sm:         0 2px 8px rgba(0,0,0,0.3);
  --shadow-md:         0 4px 16px rgba(0,0,0,0.4);
  --shadow-lg:         0 8px 32px rgba(0,0,0,0.5);
  --color-overlay:     rgba(255,255,255,0.04);
}

/* Elementor uses a separate global palette and can also generate per-widget
   color rules. Map the global values first, then override its common text
   widgets so manually selected black text remains readable in dark mode. */
[data-theme="dark"] .elementor-kit-5,
[data-theme="dark"] .elementor {
  --e-global-color-primary: var(--fg);
  --e-global-color-secondary: var(--fg-muted);
  --e-global-color-text: var(--fg);
}

[data-theme="dark"] .elementor .elementor-widget-heading .elementor-heading-title,
[data-theme="dark"] .elementor .elementor-widget-text-editor,
[data-theme="dark"] .elementor .elementor-widget-text-editor :is(p, span, li, strong, em, b, i, blockquote, cite),
[data-theme="dark"] .elementor .elementor-widget-image .widget-image-caption,
[data-theme="dark"] .elementor .elementor-widget-icon-box .elementor-icon-box-title,
[data-theme="dark"] .elementor .elementor-widget-icon-box .elementor-icon-box-description,
[data-theme="dark"] .elementor .elementor-widget-image-box .elementor-image-box-title,
[data-theme="dark"] .elementor .elementor-widget-image-box .elementor-image-box-description,
[data-theme="dark"] .elementor .elementor-widget-call-to-action .elementor-cta__title,
[data-theme="dark"] .elementor .elementor-widget-call-to-action .elementor-cta__description {
  color: var(--fg) !important;
}

[data-theme="dark"] .elementor .elementor-widget-text-editor a {
  color: var(--fg) !important;
  text-decoration-color: var(--fg-muted);
}
/* Subtle image opacity styling in dark mode for core web vitals accessibility */
[data-theme="dark"] img {
  opacity: 0.92;
  transition: opacity var(--transition-base);
}

[data-theme="dark"] img:hover {
  opacity: 1.0;
}

/* Scrollbar customization for webkit browsers in dark mode */
[data-theme="dark"] ::-webkit-scrollbar {
  width: 10px;
  height: 10px;
}

[data-theme="dark"] ::-webkit-scrollbar-track {
  background: var(--bg);
}

[data-theme="dark"] ::-webkit-scrollbar-thumb {
  background: var(--border);
  border-radius: var(--radius-full);
}

[data-theme="dark"] ::-webkit-scrollbar-thumb:hover {
  background: var(--fg-muted);
}