/*
 * Passt Tom Select an die Formularfelder des Portals an.
 *
 * Den Rahmen, den weissen Hintergrund und die Ecken zeichnet bereits .input-wrapper
 * (siehe main.css des Themes). Die Huelle von Tom Select liegt darin und bleibt
 * deshalb randlos und transparent - sonst entstuende ein Rahmen im Rahmen.
 */

.input-wrapper > .ts-wrapper {
    flex: 1 1 auto;
    min-width: 0;
    min-height: 0;
}

/* Abstaende und Schrift wie bei .input-wrapper select in main.css. */
.input-wrapper > .ts-wrapper .ts-control {
    border: 0 none;
    border-radius: 4px;
    background: transparent;
    box-shadow: none;
    padding: .6rem .5rem .5rem;
    font-size: 1.1rem;
    line-height: 1.3rem;
}

.input-wrapper > .ts-wrapper.single.input-active .ts-control {
    background: transparent;
}

/*
 * Bei geoeffneter Liste setzt das Standardtheme den Rahmen erneut
 * (.plugin-dropdown_input.focus.dropdown-active) - das ergaebe einen Rahmen im
 * Rahmen und ein Springen um einen Pixel.
 */
.input-wrapper > .ts-wrapper.plugin-dropdown_input.focus.dropdown-active .ts-control {
    border: 0 none;
}

.input-wrapper > .ts-wrapper .ts-control > .items-placeholder,
.input-wrapper > .ts-wrapper .ts-control > input {
    font-size: 1.1rem;
    line-height: 1.3rem;
}

/* Gesperrte Felder: kein eigener Hintergrund, nur zurueckgenommen dargestellt. */
.input-wrapper > .ts-wrapper.disabled .ts-control,
.input-wrapper > .ts-wrapper.disabled.single.input-active .ts-control {
    background: transparent;
    opacity: .55;
}

/*
 * Die Liste haengt an .input-wrapper (position:relative) und muss ueber den
 * nachfolgenden Feldern liegen.
 */
.input-wrapper > .ts-wrapper .ts-dropdown {
    z-index: 30;
    border-color: #B2B2B2;
    border-radius: 0 0 4px 4px;
}

/* Suchfeld im Kopf der Liste. */
.input-wrapper > .ts-wrapper .ts-dropdown .dropdown-input {
    border-bottom-color: #B2B2B2;
    box-shadow: none;
    padding: .6rem .5rem .5rem;
    font-size: 1.1rem;
    line-height: 1.3rem;
}

.input-wrapper > .ts-wrapper .ts-dropdown .no-results {
    padding: .6rem .5rem .5rem;
    color: #666;
}
