/* Additional CSS styles */
        .post3 {
            background-color: #fff;
            border-radius: 8px;
            box-shadow: 0 2px 4px rgba(0, 0, 0, 0.5);
            padding: 10px;

        }
        /* General Form Styling */
form {
    display: flex;
    justify-content: center;
    margin: 10px 0;
}

/* Input Field Styling */
form input[type="text"] {
    width: 100%;
    
    padding: 8px 12px;
    font-size: 16px;
    border: 1px solid #ccc;
    border-radius: 4px;
    outline: none;
}

/* Input Field Focus State */
form input[type="text"]:focus {
    border-color: #007bff;
}


        .user-info {
            display: flex;
            align-items: center;
            margin-bottom: 10px;
        }

        .user-info img {
            width: 35px;
            height: 35px;
            border-radius: 50%;
            margin-right: 10px;
        }

        .user-info .name {
            font-weight: bold;
            color: #333;
        }

        .post h3 {

            margin-bottom: 10px;
            color: #333;
        }

        .post p {
            margin-top: 0;
            color: #666;
        }

        .reply-form {
            margin-top: 10px;
        }

        .reply-form textarea {
            width: calc(100% - 20px);
            padding: 10px;
            border: 1px solid #ccc;
            border-radius: 4px;
            resize: vertical;
        }

        .reply-form button {
            margin-top: 10px;
            padding: 8px 16px;
            background-color: #007bff;
            color: #fff;
            border: none;
            border-radius: 4px;
            cursor: pointer;
        }

        .reply-form button:hover {
            background-color: #0056b3;
        }

        .replies {
            margin-top: 20px;
            padding-left: 20px;
            border-left: 2px solid #eee;
        }

        .reply {
            margin-bottom: 15px;
        }

        .reply .user-info {
            margin-bottom: 5px;
        }

        .reply p {
            margin: 0;
        }

        .edit-post-form,
        .edit-reply-form {
            display: none;
            margin-top: 10px;
        }

        .post-actions,
        .reply-actions {
            margin-top: 10px;
        }

        .post-actions button,
        .reply-actions button {
            margin-right: 5px;
            padding: 5px 10px;
            border: none;
            border-radius: 4px;
            cursor: pointer;
        }

        .post-actions .like-btn,
        .reply-actions .like-btn {
            background-color: #28a745;
            color: #fff;
        }

        .post-actions .dislike-btn,
        .reply-actions .dislike-btn {
            background-color: #dc3545;
            color: #fff;
        }

        .post-actions .report-btn,
        .reply-actions .report-btn {
            background-color: #ffc107;
            color: #000;
        }

        .post-content {
            max-height: 7.2em;
            /* Limit the post content to 4 lines */
            overflow: hidden;
            position: relative;
        }

        .read-more-btn {
            color: #007bff;
            cursor: pointer;
            display: none;
            /* Hide by default */
            background-color: transparent;
            border: none;
            font-size: 16px;
            margin-top: 5px;
        }

        .post-expanded .post-content {
            max-height: none;
            /* Expand content */
        }

        .post-expanded .read-more-btn {
            display: none;
            /* Hide the button when expanded */
        }

        .read-more-visible {
            display: inline-block;
            /* Show the button when applicable */
        }