/* File: blog.css - Gaya khusus untuk Halaman Index Blog & Detail */

.gallery-intro { /* Digunakan juga sebagai intro blog */
    text-align: center;
    margin-bottom: 50px;
    font-size: 1.1em;
    color: var(--color-text);
}

.full-blog-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
    gap: 30px;
}

/* Menggunakan gaya blog-card dari style.css, pastikan di style.css sudah ada */

/* Gaya untuk Halaman Detail Postingan (posts/post_x.html) */
.post-title {
    font-size: clamp(2em, 4vw, 3em);
    margin-bottom: 10px;
    color: var(--color-dark);
}

.post-meta {
    font-size: 0.9em;
    color: #6c757d;
    margin-bottom: 25px;
}

.post-meta span {
    margin-right: 15px;
}

.post-featured-image {
    width: 100%;
    height: auto;
    max-height: 400px;
    object-fit: cover;
    border-radius: 10px;
    margin-bottom: 30px;
    box-shadow: var(--shadow-subtle);
}

.post-content {
    font-size: 1.1em;
    line-height: 1.8;
}

.post-content h3 {
    margin-top: 30px;
    margin-bottom: 15px;
    color: var(--color-primary);
}

/* Tombol Share */
.social-share-buttons {
    display: flex;
    gap: 15px; /* Jarak antar tombol */
    margin-top: 3rem;
    border-top: 1px solid var(--color-light); /* Garis pemisah dari konten */
    padding-top: 20px;
    flex-wrap: wrap; /* Memastikan tombol turun baris di mobile */
}

.share-button {
    display: inline-flex;
    align-items: center;
    padding: 10px 15px;
    border-radius: 8px;
    font-size: 0.95rem;
    text-decoration: none;
    color: #FFFFFF;
    /* Transisi untuk efek hover yang halus */
    transition: transform 0.2s, box-shadow 0.2s, opacity 0.2s; 
    font-family: var(--font-body);
    font-weight: 700;
}

.share-button i {
    margin-right: 8px;
    font-size: 1.1rem;
}

.share-button:hover {
    transform: translateY(-2px); /* Efek terangkat */
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2); /* Bayangan saat hover */
    opacity: 0.9;
}

/* Warna Spesifik Platform */
.share-button[data-platform="twitter"] {
    background-color: #1DA1F2;
}
.share-button[data-platform="facebook"] {
    background-color: #4267B2;
}
.share-button[data-platform="whatsapp"] {
    background-color: #25D366;
}
.share-button[data-platform="telegram"] {
    background-color: #0088cc;
}


/* Media Query untuk Responsivitas */
@media (max-width: 600px) {
    .social-share-buttons {
        justify-content: center; /* Tombol share di tengah pada mobile */
        gap: 10px;
    }
}