/* Make browser-native date/calendar icons and numeric field spinners
   visible on the dark UI. We replace the native dark indicator glyph
   with an explicit white-on-transparent calendar SVG so the icon is
   always visible regardless of how the browser renders the default. */
input[type="date"]::-webkit-calendar-picker-indicator,
input[type="datetime-local"]::-webkit-calendar-picker-indicator,
input[type="month"]::-webkit-calendar-picker-indicator {
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23f4f7fb' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><rect x='3' y='4' width='18' height='18' rx='2' ry='2'/><line x1='16' y1='2' x2='16' y2='6'/><line x1='8' y1='2' x2='8' y2='6'/><line x1='3' y1='10' x2='21' y2='10'/></svg>") !important;
  background-repeat: no-repeat !important;
  background-position: center !important;
  background-size: 18px 18px !important;
  width: 20px !important;
  height: 20px !important;
  opacity: 1 !important;
  cursor: pointer;
  /* !important + filter:none neutralises any stale cached rule that
     used `filter: invert(...)` to darken the native indicator — the
     SVG is already the correct color, no inversion required. */
  filter: none !important;
}
input[type="time"]::-webkit-calendar-picker-indicator {
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23f4f7fb' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><circle cx='12' cy='12' r='10'/><polyline points='12 6 12 12 16 14'/></svg>") !important;
  background-repeat: no-repeat !important;
  background-position: center !important;
  background-size: 18px 18px !important;
  width: 20px !important;
  height: 20px !important;
  opacity: 1 !important;
  cursor: pointer;
  filter: none !important;
}
input[type="number"]::-webkit-inner-spin-button,
input[type="number"]::-webkit-outer-spin-button {
  filter: invert(1) brightness(2) contrast(1.15) !important;
  opacity: 1 !important;
}
select { color-scheme: dark; }
input, select, textarea { color-scheme: dark; }