/**
 * DigitalStackHub Responsive Styles
 * 
 * @package DigitalStackHub
 */

/* Tablet Styles (768px - 1024px) */
@media (min-width: 768px) and (max-width: 1024px) {
    .hero-section {
        min-height: 60vh;
    }
    
    .hero-title {
        font-size: 2.5rem;
    }
    
    .pricing-card.featured {
        transform: scale(1);
    }
    
    .dashboard-header {
        flex-direction: column;
        text-align: center;
    }
    
    .user-info {
        flex-direction: column;
    }
    
    .forum-categories-grid {
        grid-template-columns: repeat(2, 1fr);
    }
}

/* Mobile Styles (up to 767px) */
@media (max-width: 767px) {
    /* Typography */
    .hero-title {
        font-size: 1.75rem;
    }
    
    .hero-description {
        font-size: 0.875rem;
    }
    
    /* Buttons */
    .hero-buttons {
        display: flex;
        flex-direction: column;
        gap: var(--spacing-sm);
    }
    
    .hero-buttons .btn {
        width: 100%;
    }
    
    /* Cards */
    .category-card,
    .resource-card,
    .pricing-card {
        padding: var(--spacing-md);
    }
    
    /* Dashboard */
    .dashboard-tabs {
        overflow-x: auto;
        white-space: nowrap;
    }
    
    .tabs-nav {
        display: inline-flex;
        width: 100%;
    }
    
    .stats-grid {
        grid-template-columns: repeat(2, 1fr);
        gap: var(--spacing-sm);
    }
    
    .payment-history-table,
    .referrals-table {
        display: block;
        overflow-x: auto;
        white-space: nowrap;
    }
    
    /* Forum */
    .topics-header {
        display: none;
    }
    
    .topic-item {
        grid-template-columns: 1fr;
        gap: var(--spacing-xs);
        position: relative;
        padding-left: var(--spacing-md);
    }
    
    .topic-item::before {
        content: '';
        position: absolute;
        left: 0;
        top: var(--spacing-md);
        bottom: var(--spacing-md);
        width: 3px;
        background: var(--color-primary);
        border-radius: var(--radius-full);
    }
    
    .topic-reply-count,
    .topic-view-count,
    .topic-last-post {
        font-size: 0.75rem;
        padding-left: var(--spacing-lg);
        position: relative;
    }
    
    .topic-reply-count::before,
    .topic-view-count::before,
    .topic-last-post::before {
        position: absolute;
        left: 0;
        font-weight: 600;
        color: var(--text-secondary);
    }
    
    .topic-reply-count::before {
        content: '💬 ';
    }
    
    .topic-view-count::before {
        content: '👁️ ';
    }
    
    .topic-last-post::before {
        content: '📅 ';
    }
    
    /* Category Cards */
    .category-card {
        flex-direction: column;
        text-align: center;
    }
    
    .category-stats {
        justify-content: center;
    }
    
    /* Reply Cards */
    .reply-author {
        flex-direction: column;
        text-align: center;
    }
    
    .reply-author img {
        margin: 0 auto;
    }
    
    /* Forms */
    .referral-link-box {
        flex-direction: column;
    }
    
    .forum-search .search-form {
        flex-direction: column;
    }
    
    /* Affiliate Stats */
    .affiliate-stats {
        grid-template-columns: repeat(2, 1fr);
        gap: var(--spacing-sm);
    }
    
    /* Upgrade Options */
    .upgrade-options-grid {
        grid-template-columns: 1fr;
    }
}

/* Small Mobile (up to 480px) */
@media (max-width: 480px) {
    .stats-grid {
        grid-template-columns: 1fr;
    }
    
    .affiliate-stats {
        grid-template-columns: 1fr;
    }
    
    .category-stats {
        flex-direction: column;
        align-items: center;
        gap: var(--spacing-xs);
    }
    
    .discussion-meta {
        flex-direction: column;
        gap: var(--spacing-xs);
    }
    
    .result-meta {
        flex-direction: column;
        gap: var(--spacing-xs);
    }
    
    .form-actions {
        flex-direction: column;
    }
    
    .form-actions .btn {
        width: 100%;
        text-align: center;
    }
    
    .trial-timer .countdown {
        font-size: 1.5rem;
    }
}

/* Landscape Mode */
@media (max-width: 767px) and (orientation: landscape) {
    .hero-section {
        min-height: auto;
        padding: var(--spacing-xl) 0;
    }
    
    .dashboard-header {
        flex-direction: row;
        text-align: left;
    }
    
    .user-info {
        flex-direction: row;
    }
}

/* Print Styles */
@media print {
    .site-header,
    .site-footer,
    .dashboard-tabs,
    .btn,
    .theme-toggle,
    .mobile-menu-toggle {
        display: none !important;
    }
    
    body {
        background: white;
        color: black;
    }
    
    .glass-card {
        background: white;
        box-shadow: none;
        border: 1px solid #ccc;
    }
}