/* AI Assistant Feedback System Styles */

/* Message-level feedback styles */
.message-feedback {margin-top: 8px; padding: 8px 0; border-top: 1px solid #e0e0e0; text-align: right;}
.feedback-icons {display: inline-flex; gap: 8px; align-items: center;}
.feedback-btn {background: #fff; border: 1px solid #ddd; border-radius: 20px; padding: 6px 12px; cursor: pointer; transition: all 0.2s ease; font-size: 14px; display: inline-flex; align-items: center; gap: 4px; color: #666;}
.feedback-btn:hover {background-color: #f5f5f5; border-color: #999; transform: translateY(-1px);}
.feedback-btn:active {transform: translateY(0);}
.feedback-btn.disabled {opacity: 0.6; cursor: not-allowed; pointer-events: none;}
.feedback-btn.selected {background-color: #e3f2fd; border-color: #2196f3; color: #1976d2;}
.feedback-btn.submitted {background-color: #e8f5e8; border-color: #4caf50; color: #2e7d32; opacity:1;}
.thumbs-up-icon, .thumbs-down-icon {font-size: 16px; line-height: 1;}

/* Conversation-level feedback styles */
.conversation-feedback {margin: 20px 0; padding: 20px; background: linear-gradient(135deg, #f8f9fa 0%, #e9ecef 100%); border: 2px solid #dee2e6; border-radius: 12px; text-align: center; box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);}
.conversation-feedback-content {max-width: 400px; margin: 0 auto;}
.feedback-prompt {font-size: 16px; font-weight: 500; color: #495057; margin: 0 0 16px 0; line-height: 1.4;}
.conversation-feedback-icons {display: flex; gap: 16px; justify-content: center; align-items: center;}
.conversation-feedback-btn {background: white; border: 2px solid #dee2e6; border-radius: 12px; padding: 16px 24px; cursor: pointer; transition: all 0.3s ease; font-size: 16px; display: flex; flex-direction: column; align-items: center; gap: 8px; color: #495057; min-width: 120px; box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);}
.conversation-feedback-btn:hover {background-color: #f8f9fa; border-color: #adb5bd; transform: translateY(-2px); box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);}
.conversation-feedback-btn:active {transform: translateY(-1px);}
.conversation-feedback-btn.disabled {opacity: 0.6; cursor: not-allowed; pointer-events: none;}
.conversation-feedback-btn.selected {background-color: #e3f2fd; border-color: #2196f3; color: #1976d2; transform: translateY(-2px); box-shadow: 0 4px 12px rgba(33, 150, 243, 0.3);}
.conversation-feedback-btn.submitted {background-color: #e8f5e8; border-color: #4caf50; color: #2e7d32; transform: translateY(-2px); box-shadow: 0 4px 12px rgba(76, 175, 80, 0.3);}
.conversation-feedback-btn .thumbs-up-icon, .conversation-feedback-btn .thumbs-down-icon {font-size: 24px;line-height: 1;}
.feedback-label {font-size: 14px;font-weight: 500;text-transform: uppercase;letter-spacing: 0.5px;}

/* Responsive design */
@media (max-width: 768px) {
	.conversation-feedback {margin: 16px 0;padding: 16px;}
	.conversation-feedback-icons {flex-direction: column;gap: 12px;}
	.conversation-feedback-btn {min-width: 100px;padding: 12px 20px;}
	.feedback-prompt {font-size: 14px;}
}

/* Animation for feedback submission */
@keyframes feedbackSubmitted {
	0% {
		transform: scale(1);
	}
	50% {
		transform: scale(1.05);
	}
	100% {
		transform: scale(1);
	}
}

.feedback-btn.submitted, .conversation-feedback-btn.submitted {animation: feedbackSubmitted 0.3s ease;}

/* Dark mode support 
@media (prefers-color-scheme: dark) {
	.message-feedback {border-top-color: #404040;}
	.feedback-btn {background: #2d2d2d;border-color: #555;color: #ccc;}
	.feedback-btn:hover {background-color: #3d3d3d;border-color: #777;}
	.conversation-feedback {background: linear-gradient(135deg, #2d2d2d 0%, #1a1a1a 100%);border-color: #404040;}
	.conversation-feedback-btn {background: #3d3d3d;border-color: #555;color: #ccc;}
	.conversation-feedback-btn:hover {background-color: #4d4d4d;border-color: #777;}
	.feedback-prompt {color: #e0e0e0;}
}*/