/**
 * LORO Gleitmittelmengen - Styles
 * Erstellt: 2026-01-09
 * Nur Layout-spezifische Styles, TYPO3-Template liefert Basis
 * VEREINHEITLICHT 2026-07-19: .glm-input nutzt jetzt zentrales .form-control.
 * Original-Backup: backups/tool_styles_2026-07-19/gleitmittelmengen/.
 */

/* Container */
.glm-container {
    max-width: 700px;
}

/* Formular */
.glm-form {
    margin-bottom: 25px;
}

.glm-form-row {
    margin-bottom: 15px;
}

.glm-frost-row label {
    display: flex;
    align-items: center;
    gap: 8px;
    cursor: pointer;
}

.glm-section-label {
    display: block;
    margin-bottom: 10px;
}

/* Muffen-Grid */
.glm-muffen-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
    gap: 10px;
}

.glm-muffen-row {
    display: flex;
    align-items: center;
    gap: 8px;
}

.glm-input {
    width: 70px;
    text-align: center;
}

.glm-dn {
    min-width: 70px;
}

/* Ergebnis */
.glm-ergebnis {
    margin-top: 20px;
}

.glm-keine-eingabe {
    font-style: italic;
    padding: 15px;
}

.glm-result-row {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 8px 0;
}

.glm-result-value {
    text-align: right;
}

/* Ausschreibung */
.glm-ausschreibung {
    margin-top: 20px;
}

/* Mobile */
@media (max-width: 500px) {
    .glm-muffen-grid {
        grid-template-columns: 1fr;
    }

    .glm-result-row {
        flex-direction: column;
        align-items: flex-start;
        gap: 5px;
    }

    .glm-result-value {
        text-align: left;
    }
}

/* Overflow-Fix (2026-07-19): .glm-muffen-row ist Grid-Item ohne min-width:0 -
   bei knapper Spaltenbreite (minmax(200px,1fr)) und hoher DN (z.B. "x DN 200")
   konnte die Flex-Zeile (Input+DN+Gramm, kein Wrap) minimal ueber die Spalte
   hinausragen. min-width:0 erlaubt Schrumpfen, flex-wrap dient als Fallback. */
.glm-muffen-grid > .glm-muffen-row { min-width: 0; }
.glm-muffen-row { flex-wrap: wrap; }