/*
Theme: Portalnews
Arquivo: responsive.css
Descrição: Breakpoints oficiais para tablet e mobile.
*/

/* TABLET: 769px até 1200px */
@media (min-width: 769px) and (max-width: 1200px) {

    .container {
        display: grid !important;
        grid-template-columns: 1fr !important;
        gap: 20px !important;
        padding: 16px !important;
        max-width: 100% !important;
    }

    .main-content-area {
        width: 100% !important;
        min-width: 0 !important;
    }

    .layout,
    .layout.layout-double,
    .layout.layout-single {
        display: grid !important;
        grid-template-columns: 1fr !important;
        gap: 20px !important;
        width: 100% !important;
    }

    .content-left,
    .content-right {
        display: flex !important;
        flex-direction: column !important;
        gap: 20px !important;
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
    }

    .content-left > .widget,
    .content-right > .widget,
    .sidebar > .widget {
        width: 100% !important;
        max-width: 100% !important;
        flex: 0 0 auto !important;
    }

    .sidebar,
    .home-sidebar {
        width: 100% !important;
        min-width: 0 !important;
        max-width: 100% !important;
    }

    .banner-ads,
    .custom-banner-widget {
        width: 100% !important;
        max-width: 100% !important;
        overflow: visible !important;
    }

    .banner-ads img,
    .custom-banner-widget img,
    .widget img {
        max-width: 100% !important;
        height: auto !important;
    }

    .latest-news-grid-widget,
    .latest-news-grid-featured,
    .latest-news-custom-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    }

    .latest-news-grid-horizontal {
        grid-template-columns: 1fr !important;
    }

    .slider-banner {
        height: 340px !important;
    }

    .slider-banner .slide-title,
    .slider-banner .slide-title a,
    .slide-title,
    .slide-title a {
        font-size: 30px !important;
        line-height: 1.16 !important;
    }
}

/* MOBILE: até 768px */
@media (max-width: 768px) {

    .container {
        display: grid !important;
        grid-template-columns: 1fr !important;
        gap: 14px !important;
        padding: 10px !important;
        max-width: 100% !important;
    }

    .main-content-area {
        width: 100% !important;
        min-width: 0 !important;
    }

    .layout,
    .layout.layout-double,
    .layout.layout-single {
        display: grid !important;
        grid-template-columns: 1fr !important;
        gap: 14px !important;
        width: 100% !important;
    }

    .content-left,
    .content-right,
    .sidebar {
        display: flex !important;
        flex-direction: column !important;
        gap: 14px !important;
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
        padding: 8px !important;
    }

    .content-left > .widget,
    .content-right > .widget,
    .sidebar > .widget {
        width: 100% !important;
        max-width: 100% !important;
        flex: 0 0 auto !important;
        margin-bottom: 14px !important;
    }

    .sidebar,
    .home-sidebar {
        width: 100% !important;
        min-width: 0 !important;
        max-width: 100% !important;
    }

    .banner-ads,
    .custom-banner-widget {
        width: 100% !important;
        max-width: 100% !important;
        margin: 14px 0 !important;
        overflow: visible !important;
    }

    .banner-ads img,
    .custom-banner-widget img,
    .widget img {
        max-width: 100% !important;
        height: auto !important;
    }

    .branding-widget-container {
        flex-direction: column !important;
        align-items: center !important;
        gap: 10px !important;
    }

    .branding,
    .header-inline-widget-container {
        width: 100% !important;
        max-width: 100% !important;
        justify-content: center !important;
        margin: 0 !important;
    }

    .site-logo img,
    .custom-logo {
        max-width: 220px !important;
        height: auto !important;
        margin: 0 auto !important;
    }

    .menu-widget-container {
        width: 100% !important;
        flex-wrap: wrap !important;
        justify-content: center !important;
    }

    .slider-banner {
        height: 240px !important;
    }

    .slider-banner .slide-title,
    .slider-banner .slide-title a,
    .slide-title,
    .slide-title a {
        font-size: 20px !important;
        line-height: 1.18 !important;
        max-width: 92% !important;
    }

    .latest-news-grid-widget,
    .latest-news-grid-featured,
    .latest-news-custom-grid,
    .ultimas-grid {
        grid-template-columns: 1fr !important;
    }

    .latest-news-grid-item.featured-main {
        grid-column: span 1 !important;
        grid-row: span 1 !important;
    }

    .latest-news-grid-horizontal {
        grid-template-columns: 1fr !important;
    }

    .latest-news-grid-horizontal-item,
    .post-item,
    .latest-news-widget .latest-news-item {
        width: 100% !important;
    }

    .rio-paraguai-cards,
    .rio-paraguai-cards.rio-paraguai-portal {
        grid-template-columns: 1fr !important;
    }

    .portalnews-top-bar-inner {
        flex-direction: column !important;
        justify-content: center !important;
        text-align: center !important;
        gap: 4px !important;
        padding: 5px 12px !important;
    }

    .portalnews-top-bar-left,
    .portalnews-top-bar-right {
        width: 100% !important;
        justify-content: center !important;
        flex-wrap: wrap !important;
    }
}

/* MOBILE PEQUENO: até 480px */
@media (max-width: 480px) {

    .container {
        padding: 8px !important;
        gap: 12px !important;
    }

    .content-left,
    .content-right,
    .sidebar {
        padding: 6px !important;
        gap: 12px !important;
    }

    .slider-banner {
        height: 210px !important;
    }

    .slider-banner .slide-title,
    .slider-banner .slide-title a,
    .slide-title,
    .slide-title a {
        font-size: 17px !important;
    }

    .latest-news-title,
    .entry-title a {
        font-size: 14px !important;
    }
}

/* PROTEÇÃO DESKTOP: acima de 1201px */
@media (min-width: 1201px) {

    .container {
        display: grid !important;
        grid-template-columns: minmax(0, 1fr) 300px !important;
        gap: 20px !important;
        align-items: start !important;
        max-width: 1360px !important;
        margin-left: auto !important;
        margin-right: auto !important;
    }

    .main-content-area {
        display: block !important;
        min-width: 0 !important;
    }

    .sidebar,
    .home-sidebar {
        width: 300px !important;
        min-width: 300px !important;
        max-width: 300px !important;
        align-self: start !important;
    }

    .layout {
        display: grid !important;
        grid-template-columns: minmax(0, 61%) minmax(0, 39%) !important;
        gap: 20px !important;
    }

    .layout.layout-single {
        grid-template-columns: 1fr !important;
    }
}