TOM SELECT - FAUNATRACE
   ========================= */

.ts-wrapper {
    width: 100%;
    font-size: 14px;
}

.ts-wrapper.single .ts-control,
.ts-control {
    min-height: 40px;
    padding: 8px 12px;
    background: var(--bg-input);
    color: var(--color-text);
    border: 1px solid var(--color-border);
    border-radius: 10px;
    box-shadow: none;
    transition: border-color 0.15s ease, background 0.15s ease, box-shadow 0.15s ease;
}

.ts-wrapper.single .ts-control:hover,
.ts-control:hover {
    background: var(--bg-input-focus);
    border-color: var(--color-accent);
}

.ts-control,
.ts-wrapper.single.input-active .ts-control,
.ts-wrapper .ts-control,
.ts-wrapper.focus .ts-control,
.ts-wrapper.dropdown-active .ts-control,
.ts-wrapper.input-active .ts-control {
    background: var(--bg-input-focus);
    border-color: var(--color-accent);
    box-shadow: 0 0 0 3px rgba(99, 199, 178, 0.14);
}

.ts-control input {
    color: var(--color-text);
}

.ts-control input::placeholder {
    color: var(--color-text-soft);
}

.ts-wrapper.single .ts-control::after {
    border-color: var(--color-text-soft) transparent transparent transparent;
}

.ts-wrapper.single.dropdown-active .ts-control::after {
    border-color: transparent transparent var(--color-text-soft) transparent;
}

.ts-dropdown {
    margin-top: 6px;
    background: var(--color-panel);
    color: var(--color-text);
    border: 1px solid var(--color-border);
    border-radius: 10px;
    box-shadow: 0 10px 24px var(--color-shadow);
    overflow: hidden;
    z-index: 9999;
}

.ts-dropdown .option,
.ts-dropdown .optgroup-header,
.ts-dropdown .no-results,
.ts-dropdown .create {
    padding: 10px 12px;
    color: var(--color-text);
    background: transparent;
}

.ts-dropdown .option:hover,
.ts-dropdown .active {
    background: var(--color-panel-alt);
    color: var(--color-text);
}

.ts-dropdown .selected {
    background: rgba(99, 199, 178, 0.14);
    color: var(--color-text);
}

.ts-dropdown .option .highlight {
    background: rgba(99, 199, 178, 0.2);
    color: var(--color-text);
}

/* Disabled state */
.ts-wrapper.disabled .ts-control,
.ts-control[disabled] {
    opacity: 0.6;
    cursor: not-allowed;
}

/* Sort toolbar cleanup */
.tracked-animals-toolbar {
    display: flex;
    flex-direction: column;
    gap: 8px;
    margin-bottom: 16px;
}

.tracked-animals-toolbar label {
    color: var(--color-text);
    font-size: 14px;
    font-weight: 600;
}

.tracked-animals-toolbar .ts-wrapper,
.tracked-animals-toolbar select {
    width: 100%;
    max-width: 260px;
}