/*
 * -----------------------------
 * CoreX
 * TiNi #Software
 * ------------------------------
 * Programmer: Dominik Hildebrandt
 * ------------------------------
 * Created:     2026-10-20
 * Last Change: 2026-10-20
 * Change Log:
 *   2026-10-20  Neu. Einheitliche Auswahlfelder im ganzen Projekt.
 *
 * WARUM ES DIESE DATEI GIBT
 *
 * Ein `select` bringt seinen eigenen Pfeil mit, und der gehorcht keiner
 * Regel: er sitzt je nach Betriebssystem woanders, hat eine andere Farbe
 * und ignoriert die Schriftgroesse. Neben einem gestalteten Textfeld sah
 * das Auswahlfeld deshalb ueberall ein bisschen fremd aus — gleiche Hoehe,
 * gleicher Rahmen, und dann ein Pfeil aus einer anderen Welt.
 *
 * Gemessen am 2026-10-20: 281 Auswahlfelder im Bestand. 148 tragen
 * `form-select` und werden von Bootstrap gestaltet, 65 eine moduleigene
 * Klasse — aber 37 tragen GAR KEINE Klasse und 31 nur `form-control`,
 * das den Pfeil des Betriebssystems stehen laesst. Das waren die eckigen.
 *
 * Die Loesung ist nicht neu: `tini_members` hat sie in
 * `manager.style.html` fuer `#mv-cockpit`. Sie steht hier noch einmal,
 * weil es bis heute KEINE projektweite Stilvorlage gab — global geladen
 * wurden nur Fremdbibliotheken.
 *
 * WO SIE GELADEN WIRD
 *
 * In `coreX/run/run_external_scripts.php` direkt nach `bootstrap.min.css`
 * und VOR allem, was ein Modul mitbringt. Damit gilt sie ueberall, und
 * jedes Modul behaelt das letzte Wort: seine eigene CSS laedt spaeter.
 */

/* ----------------------------------------------------------------------
 *  Auswahlfelder
 * ------------------------------------------------------------------- */

/*
 * `appearance: none` nimmt den Pfeil des Betriebssystems weg; der Ersatz
 * ist ein Hintergrundbild (Chevron als SVG) an einer festen Stelle.
 *
 * Die Farbe darin ist ein Mittelgrau: eine Data-URI kennt `currentColor`
 * nicht, und ein Grau, das auf hellem UND dunklem Grund traegt, ist hier
 * die ehrlichere Loesung als zwei Bilder.
 *
 * Der rechte Innenabstand macht Platz dafuer — sonst laege ein langer
 * Eintrag unter dem Pfeil.
 */
select,
select.form-select,
select.form-control {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    padding-right: 2.1rem;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none' stroke='%237b8496' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 6l4 4 4-4'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: right 0.7rem center;
    background-size: 0.8rem;
    cursor: pointer;
}

/*
 * Ein Feld ohne jede Klasse hat auch keinen Rahmen und keinen Radius —
 * es saehe sonst aus wie ein Textfeld ohne Kasten. Rahmen, Radius und
 * Innenabstand kommen aus den Bootstrap-Variablen, damit das Feld
 * dieselbe Form hat wie jedes `form-control` daneben.
 *
 * NUR fuer Felder ohne Klasse: wer `form-select` oder `form-control`
 * traegt, hat seine Form schon, und eine zweite Festlegung hier wuerde
 * jede spaetere Aenderung an Bootstrap uebergehen.
 */
select:not([class]) {
    display: inline-block;
    padding-top: 0.375rem;
    padding-bottom: 0.375rem;
    padding-left: 0.75rem;
    font-size: 1rem;
    line-height: 1.5;
    color: var(--bs-body-color, #212529);
    background-color: var(--bs-body-bg, #fff);
    border: var(--bs-border-width, 1px) solid var(--bs-border-color, #dee2e6);
    border-radius: var(--bs-border-radius, 0.375rem);
    transition: border-color .15s ease-in-out, box-shadow .15s ease-in-out;
}

select:not([class]):focus {
    outline: 0;
    border-color: var(--bs-primary, #0d6efd);
    box-shadow: 0 0 0 0.25rem rgba(13, 110, 253, .25);
}

select:not([class]):disabled {
    background-color: var(--bs-secondary-bg, #e9ecef);
    cursor: not-allowed;
}

/*
 * Mehrfachauswahl und aufgeklappte Liste tragen keinen Pfeil — dort waere
 * er eine Behauptung ueber etwas, das gar nicht aufklappt.
 */
select[multiple],
select[size]:not([size="1"]) {
    background-image: none;
    padding-right: 0.75rem;
    cursor: default;
}

/*
 * Die aufgeklappte Liste gehoert dem Betriebssystem. Was sich
 * beeinflussen laesst, ist die Farbe der Eintraege — ohne das steht in
 * einem dunklen Thema schwarze Schrift auf schwarzem Grund, weil der
 * Browser die Farbe vom Feld erbt, den Grund aber nicht.
 */
select option {
    background: Canvas;
    color: CanvasText;
}

/*
 * AUSNAHMEN — Felder, die gar nicht sichtbar sind oder ihren eigenen
 * Aufklapper mitbringen. Ein Pfeil an einem versteckten Feld ist
 * folgenlos, ein doppelter Pfeil an einem ersetzten Feld nicht.
 *
 *   `selectpicker`  bootstrap-select baut einen eigenen Knopf daneben
 *                   (zwei Stellen: admin/user_fields/add + edit).
 *   `bfh-selectbox` bootstrap-formhelpers, dieselbe Bauart.
 */
select.selectpicker,
select.bfh-selectbox,
select[data-bfh-selectbox] {
    -webkit-appearance: auto;
    -moz-appearance: auto;
    appearance: auto;
    background-image: none;
    padding-right: 0.75rem;
}
