/* css/view.customer.css - v2.2.7 (UI Refresh) */

#customer-view { display: flex; flex-direction: column; min-height: 100vh; }

.call-screen { 
    display: none; 
    position: fixed; 
    top: 0; 
    left: 0; 
    width: 100%; 
    height: 100%; 
    overflow: hidden; 
    background-color: #000; 
    z-index: 50; 
    flex-direction: column; 
    justify-content: center; 
    align-items: center; 
}
#customer-main-video { 
    position: absolute; 
    top: 0; 
    left: 0; 
    width: 100%; 
    height: 100%; 
    object-fit: cover; 
}
#customer-pip-video { 
    position: absolute; 
    bottom: 145px; 
    right: 20px; 
    width: 30%; 
    max-width: 180px; 
    height: auto; 
    border: 2px solid white; 
    border-radius: 8px; 
    box-shadow: 0 2px 10px rgba(0,0,0,0.5); 
    z-index: 10; 
}
.customer-controls { /* Selektor von #customer-controls zu .customer-controls geändert, um HTML zu entsprechen */
    position: absolute; 
    bottom: 60px; 
    left: 0; 
    width: 100%; 
    padding: 10px 20px; 
    display: flex; 
    justify-content: center; 
    align-items: center; 
    gap: 20px; 
    z-index: 20; 
}
.customer-controls .control-btn.is-off { background-color: var(--error-color); }
.customer-controls .control-btn.is-off:hover { background-color: var(--error-color-hover); }

#customer-feedback { 
    position: absolute; 
    top: 20px; 
    left: 50%; 
    transform: translateX(-50%); 
    background: rgba(0,0,0,0.7); 
    color: white; 
    padding: 10px 20px; 
    border-radius: 20px; 
    display: none; 
    z-index: 10; 
}

/* --- V2.2.7 UI Refresh: Kunden-Checkliste --- */
.customer-checklist {
    list-style-type: none; /* Entfernt Standard-Punkte */
    padding-left: 0; /* Entfernt Standard-Einzug */
    margin-top: 0.5rem;
    display: flex;
    flex-direction: column;
    gap: 0.75rem; /* Abstand zwischen den Punkten */
}

.customer-checklist li {
    display: flex;
    align-items: flex-start; /* Oben ausrichten, falls Text umbricht */
    gap: 0.75rem; /* Abstand zwischen Icon und Text */
    color: var(--text-secondary);
    line-height: 1.5;
}

.checklist-icon {
    flex-shrink: 0;
    width: 20px;
    height: 20px;
    color: var(--success-color); /* Grüne Häkchen */
    margin-top: 3px; /* Feinjustierung der vertikalen Position */
}
/* --- ENDE V2.2.7 UI Refresh --- */