/* ============================================================================
   PALACEINSIGHT - MOBILE-FIRST RESPONSIVE SYSTEM v16.0
   Breakpoints:
   - base: 0-600px   (mobile pequeno)
   - sm:  601-768px  (mobile grande/phablet)
   - md:  769-1024px (tablet)
   - lg:  1025-1280px (desktop)
   - xl:  1281px+    (large desktop)
   ============================================================================ */

/* ===== MOBILE OVERFLOW FIXES (GLOBAL) ===== */
html, body {
    overflow-x: hidden;
    max-width: 100vw;
}

img, iframe, video {
    max-width: 100%;
    height: auto;
}

table {
    display: block;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
}

/* ===== BASE: 0-600px (MOBILE PEQUENO) ===== */
@media (max-width: 600px) {

    /* HEADER + HAMBURGER DRAWER NAV (V19.1.0) */
    .site-header {
        padding: 0.75rem 0;
    }
    .header-top .container {
        display: flex;
        flex-direction: row;
        gap: 0.5rem;
        align-items: center;
        justify-content: flex-start;
    }
    .site-title {
        font-size: 1.5rem !important;
        text-align: left;
    }
    .site-title a {
        display: inline-block;
    }

    /* HAMBURGER ICON: visivel no mobile */
    .menu-toggle {
        display: flex !important;
    }

    /* MENU INLINE: oculto no mobile (drawer lateral assume) */
    .main-navigation {
        display: none !important;
    }

    /* BREAKING NEWS */
    .breaking-news {
        font-size: 0.78rem;
    }
    .breaking-news .breaking-content {
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
        max-width: 75vw;
    }

    /* HERO */
    .hero-section {
        margin: 1rem 0;
    }
    .hero-title {
        font-size: 1.5rem !important;
    }
    .hero-content {
        padding: 1rem !important;
    }

    /* GRIDS → coluna única */
    .container {
        width: 95% !important;
        padding: 0 0.5rem;
    }

    .mentor-grid-section,
    .grid-2x2,
    .mentor-grid,
    .youtube-grid,
    .social-share-buttons {
        grid-template-columns: 1fr !important;
        gap: 1rem !important;
    }

    /* SIDEBAR: cai pra baixo, vai do largura cheia */
    main.site-content > .container,
    .site-content > .container {
        display: flex !important;
        flex-direction: column !important;
    }
    aside.sidebar,
    .sidebar {
        width: 100% !important;
        order: 2;
        margin-top: 2rem;
        padding: 1rem 0 !important;
    }
    main {
        order: 1;
        width: 100% !important;
    }

    /* SINGLE POST */
    .post-content,
    .post-content p,
    .post-content li {
        font-size: 1rem !important;
        line-height: 1.65 !important;
    }
    .post-content h1 { font-size: 1.5rem !important; }
    .post-content h2 { font-size: 1.25rem !important; }
    .post-content h3 { font-size: 1.1rem !important; }

    /* ADS - menos altura em mobile */
    .ad-banner {
        min-height: 100px !important;
        min-width: auto !important;
        width: 100% !important;
        max-width: 320px;
    }
    .content-ad-wrapper {
        margin: 1rem 0 !important;
        padding: 0.5rem !important;
    }

    /* FOOTER: empilhado */
    .footer-content {
        grid-template-columns: 1fr !important;
        gap: 1.5rem !important;
        text-align: center;
    }
    .footer-column h3,
    .footer-column ul {
        text-align: center;
    }
    .footer-bottom p {
        font-size: 0.75rem !important;
        padding: 0 0.5rem;
    }

    /* MATCHES BANNER */
    .matches-banner-header,
    .matches-banner-header-inner {
        text-align: center;
    }
    .matches-banner-title {
        font-size: 1.5rem !important;
    }
    .matches-embed-wrapper {
        padding: 0.5rem !important;
    }

    /* STANDINGS */
    .standings-toolbar {
        padding: 0.5rem !important;
    }
    .standings-toolbar-inner {
        gap: 0.4rem;
    }
    .standings-toolbar-pill {
        padding: 0.3rem 0.6rem !important;
        font-size: 0.7rem !important;
    }
    .standings-embed-wrapper {
        padding: 0.5rem !important;
    }
    .pl-legend {
        gap: 0.5rem !important;
        padding: 0.5rem !important;
    }
    .pl-legend-item {
        font-size: 0.7rem !important;
    }

    /* VIDEOS */
    .video-section {
        padding: 0.75rem !important;
    }
    .section-badge {
        font-size: 0.7rem !important;
    }
    .section-title {
        font-size: 1.15rem !important;
    }

    /* NEWSLETTER + SOCIAL SHARE */
    .newsletter-cta {
        padding: 1.25rem 1rem !important;
    }
    .newsletter-heading {
        font-size: 1.15rem !important;
    }
    .newsletter-form {
        flex-direction: column !important;
    }
    .newsletter-form input[type=email],
    .newsletter-form button {
        width: 100% !important;
    }

    /* CONTENT ENGAGEMENT (BOTTOM POST) */
    .post-bottom-engagement {
        margin-top: 1.5rem !important;
        padding-top: 1rem !important;
    }
    .engagement-heading {
        font-size: 1.05rem !important;
    }
    .ss-btn {
        font-size: 0.8rem !important;
        padding: 0.6rem 0.75rem !important;
    }
    .ss-btn span {
        font-size: 0.78rem;
    }

    /* SQUAD / STADIUM pages */
    .page-content img {
        max-width: 100% !important;
    }
}

/* ===== SM: 601-768px (PHABLET / MOBILE GRANDE) ===== */
@media (min-width: 601px) and (max-width: 768px) {
    /* HAMBURGER DRAWER ativo tambem no phablet (V19.1.0) */
    .menu-toggle {
        display: flex !important;
    }
    .main-navigation {
        display: none !important;
    }
    .header-top .container {
        flex-direction: row;
        align-items: center;
        gap: 0.5rem;
    }
    .site-title {
        font-size: 1.75rem !important;
        text-align: left;
    }
    .hero-title {
        font-size: 1.85rem !important;
    }
    .mentor-grid-section,
    .youtube-grid {
        grid-template-columns: repeat(2, 1fr) !important;
    }
    .footer-content {
        grid-template-columns: 1fr 1fr !important;
    }
    .social-share-buttons {
        grid-template-columns: repeat(2, 1fr) !important;
    }
    aside.sidebar {
        width: 100% !important;
    }
}

/* ===== MD: 769-1024px (TABLET) ===== */
@media (min-width: 769px) and (max-width: 1024px) {
    .container {
        max-width: 95%;
    }
    .site-content > .container {
        gap: 1.5rem;
    }
    .mentor-grid-section {
        grid-template-columns: repeat(2, 1fr) !important;
    }
    aside.sidebar {
        width: 320px !important;
    }
    .video-section {
        padding: 1.5rem !important;
    }
}

/* ===== LG/XL: 1025px+ (DESKTOP NORMAL/LARGE) ===== */
@media (min-width: 1025px) {
    .container {
        max-width: 1200px;
    }
}

/* ===== iPad Pro / Tablet landscape (1025-1366) ===== */
@media (min-width: 1025px) and (max-width: 1366px) {
    .hero-section,
    .mentor-grid-section {
        max-width: 100%;
    }
}

/* ===== LANDSCAPE (telefone em modo paisagem) ===== */
@media (max-height: 500px) and (orientation: landscape) {
    .hero-section {
        margin: 0.5rem 0;
    }
    .hero-title {
        font-size: 1.25rem !important;
    }
    header.site-header {
        padding: 0.25rem 0 !important;
    }
}

/* ===== ULTRA WIDE (2K/4K) ===== */
@media (min-width: 1920px) {
    .container {
        max-width: 1600px;
    }
    .hero-title {
        font-size: 2.75rem !important;
    }
}

/* ===== TOUCH / TAP IMPROVEMENTS ===== */
@media (hover: none) and (pointer: coarse) {
    .ss-btn,
    .newsletter-form button,
    .post-bottom-engagement a {
        min-height: 44px; /* min area de tap Apple HIG */
        min-width: 44px;
    }
    .main-navigation .container > ul > li > a {
        min-height: 40px;
        display: inline-flex;
        align-items: center;
    }
}

/* ===== PRINT STYLES ===== */
@media print {
    .site-header,
    .site-footer,
    aside.sidebar,
    .content-ad-wrapper,
    .post-bottom-engagement,
    .matches-banner {
        display: none !important;
    }
    .post-content {
        font-size: 12pt;
        color: #000;
    }
}

/* ===== DARK MODE (compatibilidade futura) ===== */
@media (prefers-color-scheme: dark) {
    :root {
        /* Mantém cores claras por identidade Crystal Palace */
        --bg: var(--white);
    }
}

/* ===== REDUCED MOTION (acessibilidade) ===== */
@media (prefers-reduced-motion: reduce) {
    *, *::before, *::after {
        animation-duration: 0.01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: 0.01ms !important;
        scroll-behavior: auto !important;
    }
}

/* ===== IMAGES FLEXIBILITY ===== */
img {
    max-width: 100%;
    height: auto;
    -webkit-user-drag: none;
    user-drag: none;
}

picture > img {
    display: block;
}

/* ===== TABLES RESPONSIVE ===== */
table {
    max-width: 100%;
    width: 100%;
}

@media (max-width: 768px) {
    .wp-block-table table,
    .has-fixed-layout {
        font-size: 0.85rem;
    }
}
