/* AirDatepicker theme overrides — maps the library's CSS variables onto
   v2 design tokens so the popup calendar matches the rest of the app
   (primary green for selection, muted neutrals for the chrome, our
   border / surface / shadow language).

   AirDatepicker exposes a comprehensive set of `--adp-*` variables; we
   override them on the calendar root so vendor styles still cascade
   for the parts we don't redefine (layout, animations). */

.air-datepicker {
  /* Chrome */
  --adp-font-family: inherit;
  --adp-font-size: 14px;
  --adp-background-color: var(--color-surface);
  --adp-background-color-hover: var(--color-secondary);
  --adp-background-color-active: var(--color-secondary-hover);
  --adp-background-color-in-range: var(--color-sidebar-active);
  --adp-background-color-in-range-focused: var(--color-sidebar-active);
  --adp-background-color-selected-other-month-focused: var(--color-secondary-hover);
  --adp-background-color-selected-other-month: var(--color-secondary);

  --adp-border-color: var(--color-border);
  --adp-border-color-inline: var(--color-border);
  --adp-border-color-inner: var(--color-border);
  --adp-border-radius: 12px;

  /* Text */
  --adp-color: var(--color-text);
  --adp-color-secondary: var(--color-text-muted);
  --adp-color-other-month: var(--color-text-muted);
  --adp-color-other-month-hover: var(--color-text);
  --adp-color-disabled: color-mix(in srgb, var(--color-text-muted) 45%, transparent);
  --adp-color-disabled-in-range: var(--color-text-muted);
  --adp-color-current-date: var(--color-primary);

  /* Day name header */
  --adp-day-name-color: var(--color-text-muted);
  --adp-day-name-color-hover: var(--color-text);

  /* Cell selection */
  --adp-accent-color: var(--color-primary);
  --adp-cell-background-color-hover: var(--color-secondary);
  --adp-cell-background-color-selected: var(--color-primary);
  --adp-cell-background-color-selected-hover: var(--color-primary-hover);
  --adp-cell-background-color-in-range: color-mix(in srgb, var(--color-primary) 12%, transparent);
  --adp-cell-background-color-in-range-hover: color-mix(in srgb, var(--color-primary) 20%, transparent);
  --adp-cell-border-color-in-range: color-mix(in srgb, var(--color-primary) 35%, transparent);
  --adp-cell-border-radius: 8px;

  /* Nav arrows + buttons (Today / Clear) */
  --adp-btn-color: var(--color-text-muted);
  --adp-btn-color-hover: var(--color-text);
  --adp-btn-background-color-hover: var(--color-secondary);
  --adp-btn-background-color-active: var(--color-sidebar-active);
  --adp-btn-border-radius: 8px;
  --adp-btn-height: 32px;

  /* Layout polish */
  box-shadow:
    0 6px 16px -8px rgb(17 24 39 / 14%),
    0 2px 6px -2px rgb(17 24 39 / 8%),
    0 0 0 1px var(--color-border);
}

/* Today's date highlight when not selected — outline rather than
   competing-color background, so the selection (primary) stays the
   clear visual focus. */
.air-datepicker-cell.-current-:not(.-selected-) {
  color: var(--color-primary);
  font-weight: 600;
}

/* Nav: month/year title styling */
.air-datepicker-nav--title {
  color: var(--color-text);
  font-weight: 600;
}
.air-datepicker-nav--title:hover {
  background: var(--color-secondary);
  border-radius: 6px;
}