
/* v187 DroneHQ Light Header Icon Polish
   Light mode only.
   Dark mode untouched.
   Preflight content untouched.
*/

html[data-theme="light"] {
  --dhq-v187-icon-blue: #0876c9;
  --dhq-v187-icon-border: #9fc4e5;
  --dhq-v187-icon-border-active: #0876c9;
}

/* Header utility button boxes. */
html[data-theme="light"] :is(.app-shell-header, .shell-header, .site-header, header) :is(
  button[aria-label*="ai" i],
  button[aria-label*="assistant" i],
  button[aria-label*="spark" i],
  button[aria-label*="location" i],
  button[aria-label*="position" i],
  button[aria-label*="mail" i],
  button[aria-label*="email" i],
  button[aria-label*="calendar" i],
  button[aria-label*="notification" i],
  button[aria-label*="bell" i],
  button[aria-label*="help" i],
  button[title*="ai" i],
  button[title*="assistant" i],
  button[title*="spark" i],
  button[title*="location" i],
  button[title*="position" i],
  button[title*="mail" i],
  button[title*="email" i],
  button[title*="calendar" i],
  button[title*="notification" i],
  button[title*="bell" i],
  button[title*="help" i],
  button:has(svg),
  button:has([data-lucide]),
  button:has(.lucide),
  a[aria-label*="ai" i],
  a[aria-label*="assistant" i],
  a[aria-label*="spark" i],
  a[aria-label*="location" i],
  a[aria-label*="position" i],
  a[aria-label*="mail" i],
  a[aria-label*="email" i],
  a[aria-label*="calendar" i],
  a[aria-label*="notification" i],
  a[aria-label*="bell" i],
  a[aria-label*="help" i],
  a:has(svg),
  a:has([data-lucide]),
  a:has(.lucide)
) {
  background: #ffffff !important;
  color: var(--dhq-v187-icon-blue) !important;
  border: 1px solid var(--dhq-v187-icon-border) !important;
  box-shadow: none !important;
  text-shadow: none !important;
  filter: none !important;
  opacity: 1 !important;
}

/* Active/open still stays light, just with stronger blue outline. */
html[data-theme="light"] :is(.app-shell-header, .shell-header, .site-header, header) :is(
  button[aria-expanded="true"],
  button[aria-pressed="true"],
  button.active,
  button.is-active,
  a[aria-expanded="true"],
  a[aria-pressed="true"],
  a.active,
  a.is-active
):has(svg) {
  background: #ffffff !important;
  color: var(--dhq-v187-icon-blue) !important;
  border: 2px solid var(--dhq-v187-icon-border-active) !important;
  box-shadow: none !important;
}

/* Crisp SVG rendering. This cleans the smeared Location/Calendar style. */
html[data-theme="light"] :is(.app-shell-header, .shell-header, .site-header, header) :is(
  button,
  a
) :is(svg, [data-lucide], .lucide) {
  width: 18px !important;
  height: 18px !important;
  color: var(--dhq-v187-icon-blue) !important;
  stroke: currentColor !important;
  fill: none !important;
  stroke-width: 2 !important;
  stroke-linecap: round !important;
  stroke-linejoin: round !important;
  filter: none !important;
  text-shadow: none !important;
  opacity: 1 !important;
  transform: none !important;
  shape-rendering: geometricPrecision !important;
}

/* AI/sparkle icon may be text or span instead of SVG. Force it blue and clean. */
html[data-theme="light"] :is(.app-shell-header, .shell-header, .site-header, header) :is(
  button[aria-label*="ai" i],
  button[aria-label*="assistant" i],
  button[aria-label*="spark" i],
  button[title*="ai" i],
  button[title*="assistant" i],
  button[title*="spark" i],
  button:has([data-lucide="sparkles"]),
  a[aria-label*="ai" i],
  a[aria-label*="assistant" i],
  a[aria-label*="spark" i],
  a:has([data-lucide="sparkles"])
) :is(svg, span, i, .icon, [class*="icon" i], [data-lucide]) {
  color: var(--dhq-v187-icon-blue) !important;
  stroke: currentColor !important;
  fill: none !important;
  text-shadow: none !important;
  filter: none !important;
  -webkit-text-stroke: 0 !important;
  opacity: 1 !important;
}

/* Prevent any old glow/duplicate pseudo-icon from showing in Light mode. */
html[data-theme="light"] :is(.app-shell-header, .shell-header, .site-header, header) :is(
  button[aria-label*="ai" i],
  button[aria-label*="assistant" i],
  button[aria-label*="spark" i],
  button[aria-label*="location" i],
  button[aria-label*="position" i],
  button[aria-label*="calendar" i],
  button[title*="ai" i],
  button[title*="assistant" i],
  button[title*="spark" i],
  button[title*="location" i],
  button[title*="position" i],
  button[title*="calendar" i]
)::before,
html[data-theme="light"] :is(.app-shell-header, .shell-header, .site-header, header) :is(
  button[aria-label*="ai" i],
  button[aria-label*="assistant" i],
  button[aria-label*="spark" i],
  button[aria-label*="location" i],
  button[aria-label*="position" i],
  button[aria-label*="calendar" i],
  button[title*="ai" i],
  button[title*="assistant" i],
  button[title*="spark" i],
  button[title*="location" i],
  button[title*="position" i],
  button[title*="calendar" i]
)::after {
  filter: none !important;
  text-shadow: none !important;
  box-shadow: none !important;
  opacity: 1 !important;
}
