/**
 * Dan Don Tech - Responsive Stylesheet
 * Mobile-first responsive design adjustments.
 */

/* ===================================================== */
/* Large Desktops (1200px+) */
/* ===================================================== */
@media (min-width: 1200px) {
    .container {
        max-width: 1200px;
    }
}

/* ===================================================== */
/* Tablets & Small Desktops (768px - 1199px) */
/* ===================================================== */
@media (max-width: 1199.98px) {
    .hero-slide-image {
        height: 380px;
    }
    .hero-sidebar-posts {
        height: 380px;
    }
    .single-post-title {
        font-size: 30px;
    }
    .section-title {
        font-size: 22px;
    }
}

/* ===================================================== */
/* Tablets (768px - 991px) */
/* ===================================================== */
@media (max-width: 991.98px) {
    /* Navigation */
    .navbar-nav .nav-link {
        padding: 10px 16px !important;
    }
    .header-search-form {
        margin: 10px 0;
        width: 100%;
    }
    .header-search-form .input-group {
        width: 100%;
    }
    
    /* Hero */
    .hero-slider-section .col-lg-4 {
        display: none;
    }
    .hero-slide-image {
        height: 300px;
    }
    .hero-slide-title {
        font-size: 22px;
    }
    .hero-slide-desc {
        display: none;
    }
    
    /* Mega menu */
    .mega-menu-dropdown .mega-menu {
        width: 100%;
    }
    
    /* Single post */
    .single-post-title {
        font-size: 26px;
    }
    .single-post-content {
        font-size: 16px;
    }
    
    /* Music player */
    .music-cover-image {
        max-width: 300px;
        margin: 0 auto 20px;
        display: block;
    }
    
    /* Footer */
    .footer-widget {
        margin-bottom: 30px;
    }
    
    /* Sidebar */
    .sidebar {
        margin-top: 30px;
    }
}

/* ===================================================== */
/* Mobile Landscape (576px - 767px) */
/* ===================================================== */
@media (max-width: 767.98px) {
    /* General */
    h1 { font-size: 28px; }
    h2 { font-size: 22px; }
    h3 { font-size: 18px; }
    
    /* Header */
    .top-bar {
        display: none;
    }
    .navbar-brand img {
        height: 32px;
    }
    
    /* Hero */
    .hero-slider-section {
        padding: 0;
    }
    .hero-slider {
        border-radius: 0;
    }
    .hero-slide-image {
        height: 250px;
    }
    .hero-slide-title {
        font-size: 18px;
    }
    .carousel-caption {
        padding: 20px 15px 15px;
    }
    
    /* Breaking news */
    .ticker-label {
        padding: 3px 8px;
        font-size: 10px;
    }
    .ticker-item {
        font-size: 11px;
    }
    
    /* News cards */
    .news-card-image {
        height: 180px;
    }
    .news-card-title {
        font-size: 16px;
    }
    
    /* Trending */
    .trending-card-image {
        height: 160px;
    }
    
    /* Music cards */
    .music-card-image {
        aspect-ratio: 16/9;
    }
    
    /* Single post */
    .single-post-title {
        font-size: 22px;
    }
    .single-post-meta {
        font-size: 11px;
        gap: 10px;
    }
    .single-post-content {
        font-size: 15px;
    }
    .single-post-content h2 {
        font-size: 22px;
    }
    .single-post-content h3 {
        font-size: 18px;
    }
    
    /* Comments */
    .comment-replies {
        margin-left: 20px;
    }
    
    /* Author box */
    .author-box-inner {
        flex-direction: column;
        text-align: center;
    }
    .author-avatar {
        margin: 0 auto;
    }
    
    /* Downloads */
    .download-item {
        flex-wrap: wrap;
    }
    .download-rank {
        display: none;
    }
    .download-action {
        width: 100%;
        margin-top: 8px;
    }
    .download-action .btn {
        width: 100%;
    }
    
    /* Search results */
    .search-result-item .row > .col-sm-3 {
        margin-bottom: 10px;
    }
    .search-result-image {
        height: 150px;
    }
    
    /* Footer */
    .footer-bottom .row {
        text-align: center;
    }
    .footer-bottom .text-md-end {
        text-align: center !important;
        margin-top: 8px;
    }
    
    /* Scroll to top */
    .scroll-to-top {
        bottom: 20px;
        right: 20px;
        width: 38px;
        height: 38px;
        font-size: 16px;
    }
}

/* ===================================================== */
/* Mobile Portrait (575px and below) */
/* ===================================================== */
@media (max-width: 575.98px) {
    /* Container */
    .container {
        padding-left: 15px;
        padding-right: 15px;
    }
    
    /* Hero */
    .hero-slide-image {
        height: 200px;
    }
    .hero-slide-title {
        font-size: 16px;
        margin-bottom: 4px;
    }
    .carousel-caption {
        padding: 15px 10px 10px;
    }
    .hero-slide-meta {
        font-size: 10px;
    }
    .carousel-indicators {
        display: none;
    }
    
    /* Section */
    .section-title {
        font-size: 18px;
    }
    .section-header {
        flex-direction: column;
        align-items: flex-start;
        gap: 8px;
    }
    
    /* News cards */
    .news-card-image {
        height: 160px;
    }
    .news-card-body {
        padding: 12px;
    }
    .news-card-title {
        font-size: 15px;
    }
    
    /* Trending */
    .trending-card-image {
        height: 140px;
    }
    .trending-badge {
        font-size: 10px;
        padding: 3px 8px;
    }
    
    /* Music */
    .music-card-body {
        padding: 10px;
    }
    .music-card-title {
        font-size: 14px;
    }
    .music-card-artist {
        font-size: 12px;
    }
    
    /* Single post */
    .single-post-title {
        font-size: 20px;
    }
    .single-post-featured-image img {
        max-height: 250px;
    }
    
    /* Music player */
    .music-player-section {
        padding: 15px;
    }
    .music-title {
        font-size: 22px;
    }
    .music-artist {
        font-size: 16px;
    }
    .music-details {
        grid-template-columns: 1fr;
    }
    .download-btn {
        font-size: 14px;
        width: 100%;
    }
    
    /* Comments */
    .comment-item {
        flex-direction: column;
        gap: 8px;
    }
    .comment-replies {
        margin-left: 15px;
    }
    
    /* Error page */
    .error-code {
        font-size: 80px;
    }
    .error-title {
        font-size: 24px;
    }
    
    /* Contact */
    .contact-info-item {
        flex-direction: column;
        text-align: center;
    }
    .contact-info-icon {
        margin: 0 auto;
    }
    
    /* Social share */
    .share-buttons {
        flex-wrap: wrap;
    }
    
    /* Newsletter */
    .newsletter-form-wrapper .input-group {
        flex-direction: column;
    }
    .newsletter-form-wrapper .input-group .form-control {
        border-radius: var(--radius-md) !important;
        margin-bottom: 8px;
    }
    .newsletter-form-wrapper .input-group .btn {
        border-radius: var(--radius-md) !important;
        width: 100%;
    }
    
    /* Pagination */
    .pagination {
        flex-wrap: wrap;
    }
    
    /* Advertisements */
    .advertisement-wrapper {
        margin: 10px 0;
    }
}

/* ===================================================== */
/* Print Styles */
/* ===================================================== */
@media print {
    .site-header,
    .site-footer,
    .sidebar,
    .social-share,
    .comments-section,
    .newsletter-section,
    .advertisement-wrapper,
    .scroll-to-top,
    .related-posts-section {
        display: none !important;
    }
    
    body {
        font-size: 12pt;
        color: #000;
        background: #fff;
    }
    
    .container {
        max-width: 100%;
        padding: 0;
    }
    
    .single-post-title {
        font-size: 24pt;
    }
    
    .single-post-content {
        font-size: 11pt;
    }
    
    a {
        color: #000;
        text-decoration: underline;
    }
}