/*
 * Theme for Air Datepicker — both schemes.
 *
 * Air Datepicker exposes `--adp-*` custom properties but ships only a light
 * palette. Re-bind them to the el-* token bridge so light AND dark mode
 * follow the panel theme (previously only dark was overridden and light
 * merely happened to match). The bridge vars flip under html.dark on their
 * own, so one scheme-neutral block covers both; the `html` prefix outranks
 * the vendor `.air-datepicker` block regardless of stylesheet order.
 * Imported by the air-datepicker Stimulus controller so it loads only
 * alongside the picker.
 */
html .air-datepicker {
    --adp-background-color: var(--surface);
    --adp-background-color-hover: var(--surface-3);
    --adp-background-color-active: color-mix(in srgb, var(--text-4) 35%, var(--surface));
    --adp-background-color-in-range: color-mix(in srgb, var(--accent) 12%, transparent);
    --adp-background-color-in-range-focused: color-mix(in srgb, var(--accent) 20%, transparent);
    --adp-background-color-selected-other-month-focused: var(--accent);
    /* Selected cells render white text — keep the muted variant solid
     * enough for that in both schemes (accent-pale is too pale in light). */
    --adp-background-color-selected-other-month: color-mix(in srgb, var(--accent) 60%, var(--surface));

    --adp-color: var(--text);
    --adp-color-secondary: var(--text-3);
    --adp-accent-color: var(--accent);
    --adp-color-current-date: var(--accent);
    --adp-color-other-month: var(--text-4);
    --adp-color-disabled: var(--text-4);
    --adp-color-disabled-in-range: var(--text-4);
    --adp-color-other-month-hover: var(--text-3);

    --adp-border-color: var(--rule);
    --adp-border-color-inner: var(--rule);
    --adp-border-color-inline: var(--rule);

    --adp-nav-color-secondary: var(--text-3);
    --adp-nav-arrow-color: var(--text-3);

    --adp-day-name-color: var(--accent);
    --adp-day-name-color-hover: var(--text-2);

    --adp-cell-background-color-hover: var(--surface-3);
    --adp-cell-background-color-selected: var(--accent);
    --adp-cell-background-color-selected-hover: color-mix(in oklab, var(--accent) 85%, var(--text));
    --adp-cell-background-color-in-range: color-mix(in srgb, var(--accent) 12%, transparent);
    --adp-cell-background-color-in-range-hover: color-mix(in srgb, var(--accent) 20%, transparent);
    --adp-cell-border-color-in-range: color-mix(in srgb, var(--accent) 40%, transparent);

    --adp-btn-color: var(--text-2);
    --adp-btn-color-hover: var(--text);
    --adp-btn-background-color-hover: var(--surface-3);
    --adp-btn-background-color-active: color-mix(in srgb, var(--text-4) 35%, var(--surface));

    --adp-time-track-color: var(--rule);
    --adp-time-track-color-hover: var(--text-4);
    --adp-time-day-period-color: var(--text-3);

    --adp-overlay-background-color: rgba(0, 0, 0, 0.5);
}