/*
 * Theme overrides for Choices.js + Flatpickr.
 * Loaded AFTER the vendor CSS so dark/light tokens win over #fff defaults.
 */

.choices {
    margin-bottom: 0;
    font-size: 0.875rem;
}

.choices .choices__inner {
    min-height: 2.5rem;
    padding: 0.375rem 0.75rem;
    background-color: rgb(var(--color-canvas));
    border: 1px solid rgb(var(--color-border));
    border-radius: 0.5rem;
    color: rgb(var(--color-content));
    box-shadow: 0 1px 2px rgb(var(--color-overlay) / 0.04);
    font-size: 0.875rem;
    line-height: 1.5;
}

.choices.is-focused .choices__inner,
.choices.is-open .choices__inner {
    border-color: rgb(var(--color-primary));
    box-shadow: 0 0 0 4px rgb(var(--color-primary) / 0.1);
}

.choices[data-type*='select-one'] .choices__inner {
    padding-bottom: 0.375rem;
}

.choices .choices__input,
.choices .choices__input:focus {
    background-color: transparent;
    color: rgb(var(--color-content));
    margin-bottom: 0;
}

.choices .choices__input::placeholder {
    color: rgb(var(--color-content-subtle));
    opacity: 1;
}

.choices .choices__placeholder {
    opacity: 1;
    color: rgb(var(--color-content-subtle));
}

.choices .choices__list--multiple .choices__item {
    background-color: rgb(var(--color-primary-soft));
    border: 1px solid rgb(var(--color-border));
    border-radius: 9999px;
    color: rgb(var(--color-primary));
    margin: 0.125rem 0.25rem 0.125rem 0;
    padding: 0.2rem 0.55rem;
    font-weight: 500;
}

.choices .choices__list--multiple .choices__item.is-highlighted {
    background-color: rgb(var(--color-primary));
    border-color: rgb(var(--color-primary));
    color: rgb(var(--color-primary-contrast));
}

.choices .choices__button {
    border-left-color: rgb(var(--color-border));
    opacity: 0.75;
}

.choices .choices__button:hover,
.choices .choices__button:focus {
    opacity: 1;
}

.choices .choices__list--dropdown,
.choices .choices__list[aria-expanded] {
    background-color: rgb(var(--color-surface));
    border: 1px solid rgb(var(--color-border));
    border-radius: 0.5rem;
    color: rgb(var(--color-content));
    box-shadow: 0 10px 25px rgb(var(--color-overlay) / 0.18);
    z-index: 40;
}

.choices .choices__list--dropdown .choices__item,
.choices .choices__list[aria-expanded] .choices__item {
    background-color: transparent;
    color: rgb(var(--color-content));
    padding: 0.5rem 0.75rem;
}

.choices .choices__list--dropdown .choices__item--selectable.is-highlighted,
.choices .choices__list[aria-expanded] .choices__item--selectable.is-highlighted {
    background-color: rgb(var(--color-primary-soft));
    color: rgb(var(--color-content));
}

.flatpickr-calendar {
    background: rgb(var(--color-surface));
    border: 1px solid rgb(var(--color-border));
    box-shadow: 0 10px 25px rgb(var(--color-overlay) / 0.18);
    color: rgb(var(--color-content));
}

.flatpickr-months .flatpickr-month,
.flatpickr-current-month .flatpickr-monthDropdown-months,
.flatpickr-weekday,
.flatpickr-day {
    color: rgb(var(--color-content));
    fill: rgb(var(--color-content));
}

.flatpickr-day.flatpickr-disabled,
.flatpickr-day.prevMonthDay,
.flatpickr-day.nextMonthDay {
    color: rgb(var(--color-content-subtle));
}

.flatpickr-day:hover,
.flatpickr-day:focus,
.flatpickr-day.inRange,
.flatpickr-day.prevMonthDay.inRange,
.flatpickr-day.nextMonthDay.inRange {
    background: rgb(var(--color-surface-muted));
    border-color: rgb(var(--color-surface-muted));
}

.flatpickr-day.selected,
.flatpickr-day.startRange,
.flatpickr-day.endRange {
    background: rgb(var(--color-primary));
    border-color: rgb(var(--color-primary));
    color: rgb(var(--color-primary-contrast));
}

.flatpickr-months .flatpickr-prev-month,
.flatpickr-months .flatpickr-next-month {
    fill: rgb(var(--color-content-muted));
    color: rgb(var(--color-content-muted));
}

.flatpickr-months .flatpickr-prev-month:hover svg,
.flatpickr-months .flatpickr-next-month:hover svg {
    fill: rgb(var(--color-primary));
}