/* ============================================
   REVVEDUPCARS - MOBILE ENHANCEMENTS
   Enhanced mobile experience for small devices
   ============================================ */

/* Small Mobile Devices (iPhone SE, small Android phones) */
@media (max-width: 375px) {
    /* Typography adjustments for readability */
    body {
        font-size: 15px;
    }
    
    h1, .h1 {
        font-size: 1.75rem !important;
        line-height: 1.3;
    }
    
    h2, .h2 {
        font-size: 1.5rem !important;
        line-height: 1.3;
    }
    
    h3, .h3 {
        font-size: 1.25rem !important;
        line-height: 1.3;
    }
    
    /* Header adjustments */
    .revved-header {
        padding: 10px 0;
    }
    
    .revved-logo img,
    .site-logo img {
        max-height: 40px;
        width: auto;
    }
    
    .revved-search-input {
        font-size: 14px;
        padding: 8px 12px;
    }
    
    /* Navigation */
    .revved-menu-toggle {
        width: 40px;
        height: 40px;
    }
    
    /* Hero section */
    .revved-hero {
        padding: 20px 0;
    }
    
    .hero-card-title {
        font-size: 1rem;
        line-height: 1.4;
    }
    
    /* Article cards */
    .article-card,
    .revved-post-item {
        margin-bottom: 16px;
    }
    
    .card-title,
    .revved-post-title {
        font-size: 1rem !important;
        line-height: 1.4 !important;
    }
    
    .card-meta,
    .revved-post-meta {
        font-size: 13px;
    }
    
    /* Forms */
    input[type="text"],
    input[type="email"],
    input[type="search"],
    textarea {
        font-size: 16px; /* Prevents zoom on focus in iOS */
        padding: 12px;
    }
    
    button,
    .btn,
    .revved-btn {
        font-size: 14px;
        padding: 10px 16px;
    }
    
    /* Newsletter form */
    .newsletter-form,
    .newsletter-info {
        padding: 16px;
    }
    
    .newsletter-info input[type="email"] {
        width: 100%;
        margin-bottom: 10px;
    }
    
    .newsletter-info input[type="submit"] {
        width: 100%;
    }
    
    /* Footer */
    .revved-footer,
    .site-footer {
        padding: 24px 0;
    }
    
    .footer-col {
        margin-bottom: 20px;
    }
    
    .footer-logo img {
        max-height: 40px;
    }
    
    /* Single post page */
    .article-hero {
        padding: 16px 0;
    }
    
    .article-title {
        font-size: 1.5rem !important;
        line-height: 1.3;
    }
    
    .article-meta {
        flex-direction: column;
        gap: 12px;
    }
    
    .meta-author img {
        width: 36px;
        height: 36px;
    }
    
    /* Comments */
    .comments-area {
        padding: 16px 0;
    }
    
    .comment-body {
        padding: 12px;
        font-size: 14px;
    }
    
    /* Sidebar widgets */
    .widget,
    .sidebar-widget {
        margin-bottom: 16px;
        padding: 16px;
    }
    
    .widget-title {
        font-size: 1.1rem !important;
    }
    
    /* Ticker */
    .revved-ticker {
        font-size: 13px;
        padding: 8px 0;
    }
    
    /* Archive pages */
    .archive-header {
        padding: 16px 0;
    }
    
    .archive-title {
        font-size: 1.75rem !important;
    }
    
    /* Touch-friendly elements */
    a,
    button,
    .btn {
        min-height: 44px; /* iOS recommended touch target */
        min-width: 44px;
        display: inline-flex;
        align-items: center;
        justify-content: center;
    }
    
    /* Reduce spacing on mobile */
    .revved-container,
    .container {
        padding-left: 16px;
        padding-right: 16px;
    }
    
    section {
        padding: 24px 0;
    }
    
    /* Image optimization */
    img {
        max-width: 100%;
        height: auto;
    }
    
    .article-featured-image img,
    .featured-image img {
        height: auto !important;
    }
}

/* Extra small devices */
@media (max-width: 320px) {
    body {
        font-size: 14px;
    }
    
    .revved-logo img,
    .site-logo img {
        max-height: 35px;
    }
    
    .card-title,
    .revved-post-title {
        font-size: 0.9rem !important;
    }
    
    .revved-container,
    .container {
        padding-left: 12px;
        padding-right: 12px;
    }
}

/* Landscape mode optimization for small devices */
@media (max-height: 500px) and (orientation: landscape) {
    .revved-header {
        position: sticky;
        top: 0;
        z-index: 999;
    }
    
    .revved-hero {
        padding: 10px 0;
    }
    
    section {
        padding: 16px 0;
    }
}

/* Touch improvements for all mobile */
@media (max-width: 767px) {
    /* Remove hover effects on touch devices */
    .article-card:hover,
    .revved-post-item:hover {
        transform: none;
        box-shadow: var(--revved-card-shadow);
    }
    
    /* Better tap targets */
    .category-badge,
    .card-category {
        padding: 6px 12px;
        margin: 4px;
    }
    
    /* Prevent text overflow */
    .card-title,
    .revved-post-title,
    .article-title {
        word-wrap: break-word;
        overflow-wrap: break-word;
        hyphens: auto;
    }
    
    /* Better form spacing */
    form input,
    form textarea,
    form select {
        margin-bottom: 12px;
    }
    
    /* Improve readability */
    p {
        text-align: left;
        hyphens: auto;
    }
}