/* POSTS LIST - FORCE OVERRIDE (loads LAST to ensure no conflicts) */

/* Base: Force row layout on desktop and above */
.posts-list {
    display: flex !important;
    flex-direction: column !important;
    gap: 15px !important;
    width: 100% !important;
}

.post-list-item {
    display: flex !important;
    flex-direction: row !important;
    gap: 16px !important;
    padding: 12px !important;
    background: white !important;
    border: none !important;
    border-bottom: 1px solid !important;
    border-image: linear-gradient(to right, var(--jf-accent-color, #9B6B3C), var(--jf-accent-color, #9B6B3C) 40%, transparent) 0 0 1 0 !important;
    text-decoration: none !important;
    color: inherit !important;
    width: 100% !important;
    box-sizing: border-box !important;
    align-items: flex-start !important;
}

.post-list-image {
    display: flex !important;
    width: 150px !important;
    height: 150px !important;
    flex-shrink: 0 !important;
    background: #ccc;
    border-radius: 4px;
    align-items: center;
    justify-content: center;
    font-size: 12px;
    color: #666;
    object-fit: cover;
}

.post-list-image img {
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
}

.post-list-content {
    display: flex !important;
    flex-direction: column !important;
    flex: 1 !important;
    justify-content: flex-start !important;
}

/* MOBILE: 768px and below - Switch to column */
@media (max-width: 768px) {
    .post-list-item {
        flex-direction: column !important;
        gap: 8px !important;
    }

    .post-list-image {
        width: 100% !important;
        height: auto !important;
        min-height: 200px !important;
    }
}
