/* Mobile styles for single.php */

@media (max-width: 768px) {
    .single-article {
        min-height: 60vh;
        padding: 2rem 0;
        background: linear-gradient(135deg, #f8fafc 0%, #e2e8f0 100%);
    }

    .article-container {
        padding: 0 1rem;
    }

    .article-navigation-top {
        margin-bottom: 2rem;
        text-align: center;
    }

    .article-title-single {
        font-size: 2rem;
    }

    .article-featured-image {
        display: flex;
        justify-content: center;
        align-items: center;
    }

    .article-featured-image .featured-img {
        max-width: 80%;
        border: none;
    }

    .article-content {
        font-size: 1rem;
    }

    .article-content h2 {
        font-size: 1.75rem;
    }

    .article-content h3 {
        font-size: 1.25rem;
    }

    .article-content blockquote {
        padding: 1rem 1.5rem;
    }

    /* Back to articles button on mobile */
    .article-navigation-top .btn-secondary {
        font-size: 0.9rem;
        padding: 0.75rem 1.25rem;
        border-radius: 10px;
    }
}