/* Bereich „Bewertung" – campaigns. Gemeinsames steht in assessment.css.
   Übersicht (/bewertung), Erprobungsliste und Erprobungsdetail. */

/* ---------- Übersicht ---------- */
.as-cmp-intro p { margin: 0 0 10px; line-height: 1.55; max-width: 72ch; }

/* Karten der aktiven Erprobungen: so viele nebeneinander, wie die Breite trägt. */
.as-cmp-cards { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 14px; }
.as-cmp-card { min-width: 0; }
.as-cmp-card-head { display: flex; align-items: center; justify-content: space-between; gap: 10px; min-width: 0; }
.as-cmp-card-title {
    font-family: var(--font-ui); font-size: 14px; font-weight: 600; color: var(--text); text-decoration: none;
    overflow: hidden; text-overflow: ellipsis; white-space: nowrap; min-width: 0;
}
.as-cmp-card-title:hover { color: var(--accent); }
.as-cmp-card-facts { display: flex; flex-wrap: wrap; gap: 4px 14px; font-size: 12px; color: var(--text-dim); margin-bottom: 10px; }
.as-cmp-card-none { font-size: 12.5px; }

/* Fahrzeuge einer Karte mit dem Knopf, der eine Bewertung beginnt. */
.as-cmp-startlist { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; }
.as-cmp-startlist li {
    display: flex; align-items: center; justify-content: space-between; gap: 10px;
    padding: 6px 0; border-top: 1px solid var(--line); min-width: 0;
}
.as-cmp-startlist li:first-child { border-top: 0; }
.as-cmp-startlist li .as-veh { flex: 1; }
.as-cmp-more { display: inline-block; margin-top: 8px; font-size: 12px; }

/* ---------- Liste ---------- */
.as-cmp-seg button { height: 30px; padding: 0 11px; font-size: 12px; }
.as-cmp-archcheck { padding-bottom: 8px; }
.as-cmp-clip { display: block; max-width: 36ch; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
td.as-cmp-clip { display: table-cell; }
.as-cmp-open { color: var(--fault); font-weight: 600; }
.as-cmp-form .as-cmp-span { grid-column: 1 / -1; }

/* ---------- Detail ---------- */
.as-cmp-head { display: flex; align-items: flex-end; justify-content: space-between; gap: 14px; flex-wrap: wrap; }
.as-cmp-head-main { min-width: 0; display: flex; flex-direction: column; gap: 4px; }
.as-cmp-head-main h2 { margin: 0; font-size: 20px; overflow-wrap: anywhere; }
.as-cmp-back { font-size: 12px; color: var(--text-dim); text-decoration: none; }
.as-cmp-back:hover { color: var(--accent); }
.as-cmp-head-meta { flex-wrap: wrap; gap: 8px; font-size: 12.5px; }
.as-cmp-head-actions { flex-wrap: wrap; gap: 6px; }

.as-cmp-release-input { margin-top: 5px; }

/* Die Leiste oben: Felder ohne Ziel sind keine Knöpfe; „/gesamt“ kleiner hinter der Zahl. */
.as-ov-stat.as-ov-stat-static { cursor: default; }
.as-ov-stat-of { font-size: 12px; font-weight: 400; color: var(--text-dim); }
.as-ov-stat:not(:has(.as-ov-stat-n)) { align-items: center; }

/* Stammdaten als Datenblatt: je Sachgruppe eine Zeile, die Beschriftung links, rechts
   ein Raster aus vier Spalten. Breite Felder (Name, Zeitraum, Stände) nehmen zwei. */
.as-cmp-sheet { display: flex; flex-direction: column; }
.as-cmp-group {
    display: grid; grid-template-columns: 150px minmax(0, 1fr); gap: 6px 14px;
    padding: 10px 0; border-top: 1px solid var(--line);
}
.as-cmp-group:first-child { border-top: 0; padding-top: 2px; }
.as-cmp-group:last-child { padding-bottom: 0; }
.as-cmp-group-label {
    display: flex; flex-direction: column; gap: 3px; padding-top: 4px;
    font-family: var(--font-mono); font-size: 10px; letter-spacing: .09em; text-transform: uppercase; color: var(--text-dim);
}
.as-cmp-group-hint {
    align-self: flex-start; font-family: var(--font-ui); font-size: 11px; letter-spacing: 0; text-transform: none;
    color: var(--warn); cursor: help; border-bottom: 1px dotted currentColor;
}
.as-cmp-group-fields { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 8px 12px; align-items: start; }
.as-cmp-w2 { grid-column: span 2; }
.as-cmp-w4 { grid-column: 1 / -1; }
.as-cmp-group-fields > .field-hint { margin: -2px 0 0; }
.as-cmp-group-fields > .check { font-size: 12.5px; }
.as-cmp-range { gap: 6px; flex-wrap: nowrap; }
.as-cmp-range .input { flex: 1 1 0; min-width: 0; }
.as-cmp-label-link { margin-left: 6px; font-weight: 400; }
.as-cmp-dirty { font-size: 11.5px; color: var(--warn); white-space: nowrap; }

@media (max-width: 1100px) {
    .as-cmp-group-fields { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 760px) {
    .as-cmp-group { grid-template-columns: minmax(0, 1fr); }
    .as-cmp-group-label { flex-direction: row; flex-wrap: wrap; align-items: baseline; gap: 4px 10px; padding-top: 0; }
    .as-cmp-group-fields { grid-template-columns: minmax(0, 1fr); }
    .as-cmp-w2 { grid-column: auto; }
}

/* Mitwirkende in Spalten nebeneinander, je Person eine Zelle. */
.as-cmp-members {
    list-style: none; margin: 0; padding: 0;
    display: grid; grid-template-columns: repeat(auto-fill, minmax(290px, 1fr)); gap: 6px;
}
.as-cmp-members li {
    display: flex; align-items: center; gap: 8px; min-width: 0;
    padding: 4px 6px 4px 10px; border: 1px solid var(--line); border-radius: var(--radius-sm); background: var(--panel-inset);
}
.as-cmp-member-name { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.as-cmp-addmember { width: 240px; max-width: 46vw; }
td.as-cmp-driver { max-width: 16ch; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

/* Auswahl der Flottenfahrzeuge im Dialog. */
.as-cmp-pick-tools { margin: 8px 0; gap: 6px; font-size: 12px; }
.as-cmp-picklist {
    list-style: none; margin: 0; padding: 0; max-height: 52vh; overflow: auto;
    border: 1px solid var(--line); border-radius: var(--radius-sm);
}
.as-cmp-picklist li {
    display: flex; align-items: center; justify-content: space-between; gap: 10px; flex-wrap: wrap;
    padding: 7px 10px; border-top: 1px solid var(--line);
}
.as-cmp-picklist li:first-child { border-top: 0; }
.as-cmp-picklist .check { min-width: 0; }
.as-cmp-pick-meta { font-size: 11.5px; color: var(--text-faint); display: flex; gap: 8px; flex-wrap: wrap; }
.as-cmp-busy { color: var(--warn); }

@media (max-width: 760px) {
    .as-cmp-hide-s { display: none; }
    .as-cmp-form { grid-template-columns: minmax(0, 1fr); }
    .as-cmp-cards { grid-template-columns: minmax(0, 1fr); }
}
