/*
 * Third-party widgets in Festivitas colors. Every selector starts with :root so it wins over the vendor stylesheets
 * however late a page loads them.
 */

/* ---------- Flatpickr (date pickers) ---------- */
:root .flatpickr-calendar {
    background: var(--fv-surface);
    border: 1px solid var(--fv-line);
    border-radius: var(--fv-radius-panel);
    box-shadow: var(--fv-shadow-lg);
    font-family: var(--fv-font-ui);
}
:root .flatpickr-calendar.arrowTop::before,
:root .flatpickr-calendar.arrowTop::after { border-bottom-color: var(--fv-line); }
:root .flatpickr-months .flatpickr-month,
:root .flatpickr-current-month .flatpickr-monthDropdown-months,
:root span.flatpickr-weekday,
:root .flatpickr-months .flatpickr-prev-month,
:root .flatpickr-months .flatpickr-next-month { color: var(--fv-ink); fill: var(--fv-ink); background: transparent; }
:root .flatpickr-current-month { font-family: var(--fv-font-display); font-weight: 600; }
:root span.flatpickr-weekday { color: var(--fv-muted); font-weight: 600; }
:root .flatpickr-day { color: var(--fv-ink); border-radius: var(--fv-radius-control); }
:root .flatpickr-day:hover,
:root .flatpickr-day:focus { background: var(--fv-raised); border-color: var(--fv-line); }
:root .flatpickr-day.today { border-color: var(--fv-gold-ui); }
:root .flatpickr-day.selected,
:root .flatpickr-day.startRange,
:root .flatpickr-day.endRange,
:root .flatpickr-day.selected:hover,
:root .flatpickr-day.selected:focus {
    background: var(--fv-primary);
    border-color: var(--fv-primary);
    color: var(--fv-on-primary);
}
:root .flatpickr-day.inRange { background: var(--fv-subtle); border-color: var(--fv-subtle); box-shadow: -5px 0 0 var(--fv-subtle), 5px 0 0 var(--fv-subtle); }
:root .flatpickr-day.flatpickr-disabled,
:root .flatpickr-day.prevMonthDay,
:root .flatpickr-day.nextMonthDay { color: var(--fv-line-strong); }
:root .flatpickr-time input,
:root .flatpickr-time .flatpickr-am-pm { color: var(--fv-ink); }
:root .flatpickr-time input:hover,
:root .flatpickr-time input:focus { background: var(--fv-raised); }
:root .flatpickr-calendar.hasTime .flatpickr-time { border-top-color: var(--fv-line); }

/* ---------- Quill (rich text editor) ---------- */
:root .ql-toolbar.ql-snow {
    border-color: var(--fv-line-strong);
    border-radius: var(--fv-radius-control) var(--fv-radius-control) 0 0;
    background: var(--fv-raised);
    font-family: var(--fv-font-ui);
}
:root .ql-container.ql-snow {
    border-color: var(--fv-line-strong);
    border-radius: 0 0 var(--fv-radius-control) var(--fv-radius-control);
    background: var(--fv-surface);
    color: var(--fv-ink);
    font-family: var(--fv-font-ui);
    font-size: 1rem;
    min-height: 200px;
}
:root .ql-editor { min-height: 200px; line-height: 1.65; }
:root .ql-editor.ql-blank::before { color: var(--fv-muted); font-style: normal; }
:root .ql-snow .ql-stroke { stroke: var(--fv-ink); }
:root .ql-snow .ql-fill { fill: var(--fv-ink); }
:root .ql-snow .ql-picker { color: var(--fv-ink); }
:root .ql-snow .ql-picker-options { background: var(--fv-surface); border-color: var(--fv-line) !important; }
:root .ql-snow.ql-toolbar button:hover .ql-stroke,
:root .ql-snow.ql-toolbar button.ql-active .ql-stroke,
:root .ql-snow .ql-picker-label:hover .ql-stroke { stroke: var(--fv-link); }
:root .ql-snow.ql-toolbar button:hover .ql-fill,
:root .ql-snow.ql-toolbar button.ql-active .ql-fill { fill: var(--fv-link); }
:root .ql-snow.ql-toolbar button:hover,
:root .ql-snow.ql-toolbar button.ql-active,
:root .ql-snow .ql-picker-label:hover,
:root .ql-snow .ql-picker-label.ql-active,
:root .ql-snow .ql-picker-item:hover,
:root .ql-snow .ql-picker-item.ql-selected { color: var(--fv-link); }
:root .ql-snow a { color: var(--fv-link); }
:root .ql-snow .ql-tooltip {
    background: var(--fv-surface);
    border-color: var(--fv-line);
    border-radius: var(--fv-radius-control);
    box-shadow: var(--fv-shadow);
    color: var(--fv-ink);
}
:root .ql-snow .ql-tooltip input[type="text"] { border-color: var(--fv-line-strong); background: var(--fv-surface); color: var(--fv-ink); }

/* ---------- Dropzone (archive uploads) ---------- */
:root .dropzone {
    border: 2px dashed var(--fv-line-strong);
    border-radius: var(--fv-radius-panel);
    background: var(--fv-raised);
    color: var(--fv-muted);
}
:root .dropzone:hover,
:root .dropzone.dz-drag-hover { border-color: var(--fv-primary); background: var(--fv-subtle); }
:root .dropzone .dz-preview .dz-image { border-radius: var(--fv-radius-control); }
:root .dropzone .dz-preview .dz-progress .dz-upload { background: var(--fv-primary); }

/* ---------- Tom Select (searchable selects) ---------- */
:root .ts-wrapper .ts-control {
    min-height: calc(1.6em + 1.1rem + 2px);
    border-color: var(--fv-line-strong);
    border-radius: var(--fv-radius-control);
    background: var(--fv-surface);
    color: var(--fv-ink);
    font-size: 1rem;
}
:root .ts-wrapper.focus .ts-control {
    border-color: var(--fv-primary);
    box-shadow: 0 0 0 3px color-mix(in srgb, var(--fv-focus) 35%, transparent);
}
:root .ts-wrapper.is-invalid .ts-control,
:root .is-invalid + .ts-wrapper .ts-control { border-color: var(--fv-danger); }
:root .ts-control input { color: var(--fv-ink); }
:root .ts-control input::placeholder { color: var(--fv-muted); }
:root .ts-dropdown {
    border-color: var(--fv-line);
    border-radius: var(--fv-radius-panel);
    background: var(--fv-surface);
    color: var(--fv-ink);
    box-shadow: var(--fv-shadow-lg);
    overflow: hidden;
}
:root .ts-dropdown .option { padding: .55rem .8rem; }
:root .ts-dropdown .active { background: var(--fv-subtle); color: var(--fv-subtle-ink); }
:root .ts-dropdown .no-results { padding: .55rem .8rem; color: var(--fv-muted); }