/* assets/css/frontend-tickets.css */

#aviya-my-tickets-app { font-family: sans-serif; }

.aviya-tickets-table { width: 100%; border-collapse: collapse; margin-top: 20px; }

.aviya-tickets-table th, .aviya-tickets-table td { padding: 12px; border: 1px solid #ddd; text-align: left; }

.aviya-tickets-table th { background-color: #f7f7f7; }

.aviya-ticket-row { cursor: pointer; }

.aviya-ticket-row:hover { background-color: #f1f1f1; }

.aviya-ticket-status-open, .aviya-ticket-status-user-replied, .aviya-ticket-status-agent-replied, .aviya-ticket-status-pending, .aviya-ticket-status-closed { color: white; padding: 4px 8px; border-radius: 4px; font-size: 12px; font-weight: bold; }

.aviya-ticket-status-open { background-color: #2271b1; }

.aviya-ticket-status-user-replied { background-color: #22c55e; }

.aviya-ticket-status-agent-replied { background-color: #64748b; }

.aviya-ticket-status-pending { background-color: #f59e0b; }

.aviya-ticket-status-closed { background-color: #888; }



/* Modal Styles */

.aviya-modal-overlay { position: fixed; top: 0; left: 0; width: 100%; height: 100%; background: rgba(0,0,0,0.6); z-index: 1000; }

.aviya-modal-content { position: fixed; top: 50%; left: 50%; transform: translate(-50%, -50%); background: #fff; width: 700px; max-width: 90%; max-height: 85vh; z-index: 1001; border-radius: 5px; display: flex; flex-direction: column; }

.aviya-modal-header { padding: 15px 20px; border-bottom: 1px solid #eee; display: flex; justify-content: space-between; align-items: center; }

.aviya-modal-header h3 { margin: 0; font-size: 18px; }

.aviya-modal-close { background: none; border: none; font-size: 28px; cursor: pointer; color: #888; }

.aviya-modal-body { padding: 20px; overflow-y: auto; }

.aviya-reply-message { border: 1px solid #eee; border-radius: 5px; padding: 15px; margin-bottom: 15px; }

.aviya-reply-message.admin-reply { background-color: #f7f7f7; border-left: 4px solid #7e8993; }

.aviya-reply-message.user-reply { border-left: 4px solid #007bff; }

.aviya-reply-message p { margin-top: 0; }

.aviya-reply-meta { font-size: 12px; color: #777; margin-top: 10px; border-top: 1px dashed #eee; padding-top: 5px; }

#aviya-ticket-reply-form textarea { width: 100%; padding: 10px; margin-bottom: 10px; border: 1px solid #ddd; border-radius: 3px; }

.aviya-form-actions { display: flex; justify-content: space-between; align-items: center; }

.aviya-button-primary { background-color: #007bff; color: white; border: none; padding: 10px 15px; border-radius: 3px; cursor: pointer; }

.aviya-button-secondary { background-color: #6c757d; color: white; border: none; padding: 10px 15px; border-radius: 3px; cursor: pointer; }

.aviya-ticket-closed-notice { padding: 15px; background-color: #f1f1f1; border-radius: 3px; text-align: center; }

.aviya-ticket-notification { padding: 15px 20px; margin: 20px 0; border-radius: 4px; background-color: #f0f8ff; /* A light blue */ border-left: 5px solid #007bff; /* Matches the primary color */    color: #333;}

.aviya-ticket-notification p { margin: 0; padding: 0;}

.aviya-ticket-notification a { font-weight: bold; color: #0056b3; text-decoration: underline;}

.aviya-ticket-notification a:hover { text-decoration: none;}