/* Styles spécifiques à la page /demo/traffic */

.user-info-panel {
	background-color: #f5f5f5;
	border-radius: 4px;
	padding: 10px;
	margin: 10px 0;
	box-shadow: 0 2px 4px rgba(0,0,0,0.1);
}

.user-info-panel h3 {
	margin-top: 0;
	margin-bottom: 10px;
	color: #333;
}

.user-info-panel p {
	margin: 5px 0;
}

.user-points {
	font-weight: bold;
	color: #0078ff;
}

.reality-check {
	margin-top: 10px;
	padding: 10px;
	background-color: #fff3e0;
	border-radius: 4px;
}

.reality-check-buttons {
	display: flex;
	justify-content: space-between;
	margin-top: 8px;
}

.confirm-btn, .deny-btn {
	padding: 5px 10px;
	border: none;
	border-radius: 4px;
	cursor: pointer;
	font-weight: bold;
}

.confirm-btn {
	background-color: #4caf50;
	color: white;
}

.deny-btn {
	background-color: #f44336;
	color: white;
}

.reality-check-info {
	margin-top: 10px;
	padding: 8px;
	background-color: #e8f5e9;
	border-radius: 4px;
	font-size: 0.9em;
}

#photoPreviewContainer {
	margin-top: 8px;
	display: none;
}

#photoPreview {
	max-width: 100%;
	border-radius: 4px;
}

.camera-block {
	margin-top: 12px;
	background: #f9fafb;
	border: 1px solid #e5e7eb;
	border-radius: 6px;
	padding: 10px;
}
.camera-block .note { font-size: 12px; color: #666; }
.camera-controls {
	display: flex;
	gap: 8px;
	margin-bottom: 8px;
}
.camera-preview video {
	width: 100%;
	max-height: 260px;
	background: #000;
	border-radius: 4px;
}
.gps-status {
	margin-left: 8px;
	font-size: 12px;
	color: #555;
}