/* Support Ticket Modal Styles */

#supportTicketModal .file-upload-area {
    transition: all 0.3s ease;
    min-height: 150px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
}

#supportTicketModal .file-upload-area:hover {
    background-color: #e9ecef !important;
}

#supportTicketModal .file-upload-area.border-primary {
    background-color: #e7f3ff !important;
    border-color: #0d6efd !important;
}

#supportTicketModal #filePreview img {
    width: 100%;
    height: 120px;
    object-fit: cover;
}

#supportTicketModal #filePreview .btn-danger {
    padding: 0.25rem 0.5rem;
    font-size: 0.75rem;
}

#supportTicketModal .form-label {
    font-weight: 500;
}

#supportTicketModal .text-danger {
    color: #dc3545;
}

#supportTicketModal textarea {
    resize: vertical;
}

#supportTicketModal .was-validated .form-control:invalid,
#supportTicketModal .was-validated .form-select:invalid {
    border-color: #dc3545;
}

#supportTicketModal .was-validated .form-control:valid,
#supportTicketModal .was-validated .form-select:valid {
    border-color: #198754;
}

/* Responsive adjustments */
@media (max-width: 768px) {
    #supportTicketModal .modal-dialog {
        margin: 0.5rem;
    }
    
    #supportTicketModal #filePreview img {
        height: 80px;
    }
}

/* Loading state */
#supportTicketModal .btn-primary:disabled {
    cursor: not-allowed;
    opacity: 0.65;
}

/* Alert animations */
#supportTicketModal .alert {
    animation: slideIn 0.3s ease-out;
}

@keyframes slideIn {
    from {
        opacity: 0;
        transform: translateY(-10px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}