.post {
    /* max-width: 700px; */
    /* Sesuaikan lebar post */
    /* border: 1px solid #ccc; */
    /* Contoh border */
    /* padding: 10px; */
    /* font-family: sans-serif; */
    font-size: 14px;
    background-color: white;
    /* border-radius: 10px; */
    margin-bottom: 10px;
    margin-left: auto;
    margin-right: auto;
    padding: 15px;
}

.post-header {
    display: flex;
    align-items: center;
    margin: 10px;
    align-items: flex-start;
}

.profile-picture {
    width: 40px;
    /* Sesuaikan ukuran foto profil */
    height: 40px;
    border-radius: 50%;
    margin-right: 10px;
}

.post-info {
    flex-grow: 1;
}

.post-author {
    font-weight: bold;
    columns: black;
}

.post-details {
    color: #555;
    font-size: 12px;
}

.post-time {
    color: #888;
    font-size: 12px;
}

.post-privacy {
    display: inline-block;
    width: 16px;
    height: 16px;
    /* background-image: url('path/to/friends-icon.png'); */
    background-size: cover;
    vertical-align: middle;
    margin-left: 5px;
}

.post-navigation {
    display: flex;
    align-items: center;
    /* background-color: #1877f2; */
    /* border-top: #888; */
    /* border-bottom: #888; */
}

.post-options,
.post-close {
    cursor: pointer;
    margin-left: 10px;
    font-size: 16px;
    font-weight: 600;
}


.post-content {
    padding: 10px;
}

/* post interaction */

.post-interactions {
    font-family: sans-serif;
    font-size: 14px;
    /* padding: 8px; */
    padding-left: 8px;
    padding-right: 8px;
    /* background-color: aquamarine; */
}

.post-stats {
    display: flex;
    align-items: center;
    padding-bottom: 5px;
    justify-content: space-between;
    /* border-bottom: 1px solid rgb(201, 31, 31); */
}

.post-stats i {
    color: #1877f2;
    /* Warna ikon "Suka" */
    margin-right: 5px;
}

.post-comments,
.post-shares {
    margin-left: 15px;
    color: #65676b;
}

xhr {
    border: none;
    border-top: 1px solid #ddd;
    margin: 10px 0;
}

.post-actions {
    display: flex;
    justify-content: space-around;
    align-items: center;
    /* background-color: #1877f2; */
    padding-top: 8px;
    padding-bottom: 8px;
    border-top: 1px solid #ddd;
    border-bottom: 1px solid #ddd;
}

.action-button {
    background: none;
    border: none;
    display: flex;
    align-items: center;
    color: #2e2d2d;
    cursor: pointer;
    /* padding: 5px 10px; */
    font-weight: 600;
    /* font-size: 12px; */

}

.action-button i {
    margin-right: 5px;
}

.action-button:hover {
    background-color: #f0f2f5;
    /* Efek hover */
    border-radius: 5px;
}

/* comment section */

.comment-section {
    /* font-family: sans-serif; */
    /* font-size: 14px; */
    /* background-color: whitesmoke */
}






.comment {
    display: flex;
    /* align-items: center; */
    margin: 10px;

    /* border-top: 1px solid #ddd; */
    /* padding: 10px; */
}

.comment-profile-picture {
    width: 40px;
    /* Sesuaikan ukuran foto profil */
    height: 40px;
    border-radius: 50%;
    margin-right: 10px;
}

.comment-info {
    flex-grow: 1;
    margin-bottom: 10px;
    background-color: rgb(228, 243, 229);
    border-radius: 10px;
    padding: 10px;
}

.comment-author {
    font-weight: bold;
}

.comment-time {
    color: #7c7979;
    margin-right: 5px;
    font-size: 12px;
}

.comment-content {
    margin-bottom: 10px;
    margin-top: 10px;
}

.comment-actions {
    display: flex;
    /* align-items: center; */
}

.action-button {
    background: none;
    border: none;
    color: #65676b;
    cursor: pointer;
    margin-right: 5px;
    font-size: 12px;
    font-weight: 400;
}

.action-button:hover {
    color: white;
    background-color: #5d6268;
    border-radius: 5px;
}

.likes-count {
    color: #65676b;
    margin-left: 5px;
}

.view-replies {
    color: #1877f2;
    cursor: pointer;
    margin-top: 5px;
}

.view-replies:hover {
    text-decoration: underline;
}

/* foto pada postingan */

.photo-container {
    align-items: center;
    display: flex;
    flex-wrap: wrap;
    padding-left: 10px;
    /* background-color: #1877f2; */
}

.dropdown-item {
    font-size: 12px;
    color: rgb(38, 122, 27);
}

.dropdown-item:hover {
    color: rgb(219, 57, 28);
}


/* untuk menampilkan foto thumbnail */

/* .photo-thumbnail {
    height: 200px;
    object-fit: cover;
    cursor: pointer;
    transition: transform 0.2s;
} */

/* .photo-thumbnail:hover {
    transform: scale(1.05);
} */

blockquote {
    border-left: 4px solid #ccc;
    /* Warna dan ketebalan border */
    padding: 1em 1.5em;
    /* Padding di dalam blockquote */
    font-style: italic;
    /* Gaya teks italic */
    color: #555;
    /* Warna teks */
    margin: 1em 0;
    /* Margin atas dan bawah */
}



.xcontainer {

    width: 100%;
    display: flex;
    justify-content: center;
    /* Pusatkan konten secara horizontal */
}

.content {
    max-width: 760px;
    /* Lebar maksimum konten pada layar lebar */
    width: 100%;
    /* Konten selalu selebar 100% dari parent */
    /* padding: 20px; */
    /* Ruang di dalam konten */
    box-sizing: border-box;
    padding: 0;
    /* Pastikan padding tidak menambah lebar */
}

/* Media query untuk layar kecil (misalnya, lebar maksimum 768px) */
@media (max-width: 768px) {
    .content {
        max-width: 100%;
        /* Konten full selebar container pada layar kecil */
    }
}