/**
 * MKM Bix - Responsive Tablet
 * Tablet breakpoint styles (max-width: 991px)
 * @package MKM_Bix
 */

@media screen and (max-width: 991px) {
    
    /* ==================== HEADER ==================== */
    :root {
        --mkm-header-height: var(--mkm-header-height-mobile);
    }
    
    .mkm-nav-desktop {
        display: none;
    }
    
    .mkm-menu-toggle {
        display: flex;
    }
    
    /* ==================== LAYOUT ==================== */
    .mkm-content-area.has-sidebar,
    .mkm-content-area.has-sidebar.sidebar-left {
        grid-template-columns: 1fr;
    }
    
    .mkm-content-area.has-sidebar .mkm-sidebar,
    .mkm-content-area.has-sidebar.sidebar-left .mkm-sidebar {
        order: 0;
    }
    
    /* ==================== GRID ==================== */
    .mkm-grid-cols-3,
    .mkm-grid-cols-4,
    .mkm-posts-grid.mkm-grid-cols-3,
    .mkm-posts-grid.mkm-grid-cols-4 {
        grid-template-columns: repeat(2, 1fr);
    }
    
    /* ==================== RELATED POSTS ==================== */
    .mkm-related-grid {
        grid-template-columns: repeat(2, 1fr);
    }
    
    /* ==================== POST NAVIGATION ==================== */
    .mkm-post-nav,
    .mkm-post-navigation {
        grid-template-columns: 1fr;
    }
    
    .mkm-post-nav-next {
        text-align: left;
    }
    
    .mkm-post-nav-next .mkm-post-nav-label {
        justify-content: flex-start;
    }
    
    /* ==================== FOOTER ==================== */
    .mkm-footer-cols-3,
    .mkm-footer-cols-4 {
        grid-template-columns: repeat(2, 1fr);
    }
    
    /* ==================== SLIDER ==================== */
    .mkm-slide {
        aspect-ratio: 16 / 9;
    }
    
    .mkm-slide-title {
        font-size: var(--mkm-fs-2xl);
    }
    
    .mkm-slide-content {
        padding: var(--mkm-space-6);
    }
    
    /* ==================== HERO ==================== */
    .mkm-hero {
        padding: var(--mkm-space-12) 0;
    }
    
    .mkm-hero-title {
        font-size: var(--mkm-fs-4xl);
    }
    
    .mkm-hero-subtitle {
        font-size: var(--mkm-fs-lg);
    }
    
    /* ==================== AUTHOR BOX ==================== */
    .mkm-author-box {
        flex-direction: column;
        text-align: center;
    }
    
    .mkm-author-box-social {
        justify-content: center;
    }
    
    /* ==================== FEATURED GRID ==================== */
    .mkm-featured-grid {
        grid-template-columns: 1fr;
        grid-template-rows: auto;
    }
    
    .mkm-featured-grid .mkm-grid-item:first-child {
        grid-row: auto;
    }
    
    /* ==================== LIST LAYOUT ==================== */
    .mkm-list-layout .mkm-card {
        grid-template-columns: 200px 1fr;
    }
    
    /* ==================== CARD HORIZONTAL ==================== */
    .mkm-card-horizontal {
        grid-template-columns: 200px 1fr;
    }
    
    /* ==================== MASONRY ==================== */
    .mkm-masonry-grid {
        columns: 2;
    }
    
    /* ==================== SIDEBAR ==================== */
    .mkm-sidebar-sticky {
        position: relative;
        top: 0;
    }
    
    .mkm-sidebar-bordered {
        padding-left: 0;
        border-left: none;
        padding-top: var(--mkm-space-8);
        border-top: 1px solid var(--mkm-gray-200);
    }
    
    /* ==================== SEARCH RESULT ==================== */
    .mkm-search-result {
        flex-direction: column;
    }
    
    .mkm-search-result-thumbnail {
        width: 100%;
        height: 200px;
    }
    
    /* ==================== SHARE STICKY ==================== */
    .mkm-share-sticky {
        position: relative;
        left: auto;
        top: auto;
        transform: none;
        flex-direction: row;
        justify-content: center;
        margin: var(--mkm-space-6) 0;
    }
    
    /* ==================== HIDE ON TABLET ==================== */
    .hide-tablet {
        display: none !important;
    }
    
    /* ==================== SHOW ON TABLET ==================== */
    .show-tablet {
        display: block !important;
    }
}