/* ============================================================
   AUFTRAG-EINLASS-CC.md: das Tor am Veranstaltungsabend
   (Uebersicht, Scan, Tuerliste).

   Gebaut fuers HANDY des Einlasspersonals: eine Spalte, grosse
   Tippflaechen, hoher Kontrast. Die Tokens sind die der
   Kassen-Formsprache (--pos-*), weil diese Seiten unter PosLayout
   haengen - kein zweiter Satz Farben daneben.
   ============================================================ */

.adm-shell {
    display: flex;
    flex-direction: column;
    width: 100%;
    flex: 1 1 auto;
    min-height: 0;
    overflow-y: auto;
}

.adm-header {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 10px 16px;
    border-bottom: 1px solid var(--pos-hairline);
    background: var(--pos-panel);
    position: sticky;
    top: 0;
    z-index: 2;
}

.adm-header-text {
    display: flex;
    flex-direction: column;
    min-width: 0;
}

.adm-title {
    font-weight: 600;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.adm-subtitle {
    font-size: 0.85rem;
    color: var(--pos-muted);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

/* Der Zaehlstand - Regel 11: was ist geschehen, mit Zahl. Er steht oben
   und bleibt beim Blaettern stehen. */
.adm-tally {
    padding: 8px 16px;
    background: var(--pos-mulde-bg);
    border-bottom: 1px solid var(--pos-hairline);
    font-size: 0.95rem;
}

/* Regel 12: das Band ist EINE Zeile, es waechst nicht mit dem Text mit -
   und es erscheint erst, wenn der Zustand bestaetigt ist. */
.adm-band {
    padding: 8px 16px;
    background: var(--pos-danger-bg);
    border-bottom: 1px solid var(--pos-danger);
    color: var(--pos-text);
    font-size: 0.9rem;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.adm-body {
    display: flex;
    flex-direction: column;
    gap: 14px;
    padding: 16px;
    max-width: 520px;
    margin: 0 auto;
    width: 100%;
}

.adm-hint {
    color: var(--pos-muted);
    font-size: 0.9rem;
    margin: 0;
}

/* --- Uebersicht: eine Karte je Durchlauf ------------------------------- */

.adm-run {
    border: 1px solid var(--pos-hairline);
    border-radius: var(--pos-radius-btn);
    background: var(--pos-surface);
    padding: 12px 14px;
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.adm-run-name {
    font-weight: 600;
    font-size: 1.05rem;
}

.adm-run-when,
.adm-run-count {
    color: var(--pos-muted);
    font-size: 0.9rem;
}

.adm-run-actions {
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
}

/* --- Kamera ------------------------------------------------------------ */

.adm-camera {
    position: relative;
    width: 100%;
    aspect-ratio: 1 / 1;
    background: #000;
    border-radius: var(--pos-radius-btn);
    overflow: hidden;
}

.adm-video {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.adm-camera-overlay {
    position: absolute;
    inset: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 16px;
    text-align: center;
    background: rgba(0, 0, 0, 0.6);
    color: #fff;
}

.adm-manual {
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.adm-input {
    background: var(--pos-surface);
    border: 1px solid var(--pos-hairline);
    border-radius: var(--pos-radius-btn);
    color: var(--pos-text);
    padding: 12px;
    font-size: 1rem;
    width: 100%;
}

/* --- Die Auskunft zu einem Ticket -------------------------------------- */

.adm-card {
    border: 1px solid var(--pos-hairline);
    border-left-width: 6px;
    border-radius: var(--pos-radius-btn);
    background: var(--pos-surface);
    padding: 12px 14px;
    display: flex;
    flex-direction: column;
    gap: 6px;
}

/* Dieselben vier Toene wie an der Kasse - kein zweiter Satz Farben:
   gruen (--pos-go) = durch, gelb = hinsehen, tomatenrot = halt. */
.adm-card-valid { border-left-color: var(--pos-accent); }
.adm-card-admitted { border-left-color: var(--pos-go); }
.adm-card-warn { border-left-color: var(--pos-warn); }
.adm-card-stop { border-left-color: var(--pos-danger); }

.adm-card-head {
    font-weight: 600;
    font-size: 1.1rem;
}

.adm-card-line {
    font-size: 0.95rem;
}

.adm-card-muted {
    color: var(--pos-muted);
    font-size: 0.9rem;
}

/* Der Nachweis-Hinweis (TB-H1 AtEntry) ist der einzige Satz auf dieser
   Karte, der eine HANDLUNG des Menschen verlangt - er wird deshalb
   hervorgehoben und nicht in die Zeilen darunter eingereiht. */
.adm-proof {
    border-radius: var(--pos-radius-btn);
    background: var(--pos-warn-bg);
    border: 1px solid var(--pos-warn);
    padding: 8px 10px;
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.adm-proof-title {
    font-weight: 600;
    font-size: 0.85rem;
    text-transform: uppercase;
    letter-spacing: 0.04em;
}

.adm-actions {
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
    margin-top: 4px;
}

/* --- Tuerliste --------------------------------------------------------- */

.adm-hit {
    border: 1px solid var(--pos-hairline);
    border-radius: var(--pos-radius-btn);
    background: var(--pos-surface);
    padding: 10px 12px;
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.adm-hit-name {
    font-weight: 600;
}

.adm-reason {
    display: flex;
    flex-direction: column;
    gap: 6px;
    margin-top: 4px;
}
