/**
 * SLBENFICA.ORG — Mobile Responsive Additions
 * This file is ADDITIVE — it enhances the existing inline CSS.
 * Breakpoints: 900px (existing), 768px (tablet), 480px (phone), 360px (small phone)
 * 
 * Test: Samsung phone (Roger), iPad (Roger), Chromebook (Le)
 */

/* ══════════════════════════════════════
   Tablet (≤768px) 
   ══════════════════════════════════════ */
@media (max-width: 768px) {
    /* Standings table — hide less important columns */
    .standings-table table th:nth-child(5),
    .standings-table table td:nth-child(5),
    .standings-table table th:nth-child(6),
    .standings-table table td:nth-child(6) {
        display: none; /* Hide Losses and GD on tablet */
    }

    /* News grid — stack */
    .news-grid {
        grid-template-columns: 1fr !important;
    }
    .news-main-img {
        height: 200px !important;
    }

    /* Results grid — stack cards */
    .results-grid {
        grid-template-columns: 1fr !important;
    }

    /* Section padding */
    .section {
        padding: 2.5rem 0;
    }

    /* Container padding */
    .container {
        padding: 0 1rem;
    }

    /* Footer columns — stack */
    .footer-inner {
        grid-template-columns: 1fr !important;
        gap: 1.5rem !important;
    }
}

/* ══════════════════════════════════════
   Phone (≤480px)
   ══════════════════════════════════════ */
@media (max-width: 480px) {
    /* Nav */
    .nav-inner {
        height: 56px;
    }
    .nav-crest {
        width: 48px !important;
        height: 48px !important;
    }
    .nav-wordmark {
        font-size: 1.1rem !important;
    }
    .forum-btn {
        padding: 0.35rem 0.7rem !important;
        font-size: 0.78rem !important;
    }
    .lang-toggle {
        display: none; /* Hide on tiny screens — save space */
    }

    /* Hero */
    .hero-content {
        padding: 2rem 0 2.5rem !important;
    }
    .hero h1 {
        font-size: clamp(3rem, 12vw, 4rem) !important;
    }
    .hero-subtitle {
        font-size: 0.88rem !important;
    }
    .match-countdown {
        padding: 1rem !important;
    }
    .countdown-num {
        font-size: 1.6rem !important;
    }
    .countdown-divider {
        font-size: 1.6rem !important;
    }
    .team-name {
        font-size: 1.1rem !important;
    }
    .match-meta {
        flex-direction: column;
        gap: 0.3rem !important;
        font-size: 0.75rem !important;
    }

    /* Sections */
    .section {
        padding: 2rem 0;
    }
    .section-title {
        font-size: 1.4rem !important;
    }
    .section-header {
        flex-direction: column;
        align-items: flex-start !important;
        gap: 0.5rem !important;
    }

    /* Results cards */
    .result-card {
        padding: 0.75rem !important;
    }
    .result-score {
        font-size: 1.5rem !important;
    }

    /* Standalone results page — result rows */
    .result-row {
        padding: 0.6rem 0.5rem !important;
        gap: 0.4rem !important;
        font-size: 0.82rem;
    }
    .match-date {
        font-size: 0.72rem !important;
        min-width: 50px !important;
    }
    .team-home, .team-away {
        font-size: 0.82rem !important;
    }
    .score-num {
        font-size: 1rem !important;
    }
    .venue-tag {
        display: none !important; /* Hide home/away tag on phone */
    }

    /* Standings */
    .standings-table table {
        font-size: 0.75rem !important;
    }
    .standings-table th, .standings-table td {
        padding: 0.4rem 0.3rem !important;
    }
    /* Hide W, D, L columns on phone — keep Pos, Club, P, Pts */
    .standings-table table th:nth-child(3),
    .standings-table table td:nth-child(3),
    .standings-table table th:nth-child(4),
    .standings-table table td:nth-child(4),
    .standings-table table th:nth-child(5),
    .standings-table table td:nth-child(5) {
        display: none;
    }
    .club-pos {
        min-width: 18px !important;
    }

    /* Summary bar (resultados.html) */
    .summary-bar {
        flex-wrap: wrap;
        gap: 0.5rem !important;
        padding: 0.75rem !important;
    }
    .summary-stat .val {
        font-size: 1.3rem !important;
    }
    .summary-divider {
        display: none !important;
    }

    /* Filter buttons */
    .filter-bar {
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
        gap: 0.3rem !important;
    }
    .filter-btn {
        font-size: 0.72rem !important;
        padding: 0.35rem 0.6rem !important;
        white-space: nowrap;
    }

    /* News */
    .news-main-img {
        height: 160px !important;
    }
    .news-main-body h3 {
        font-size: 1rem !important;
    }
    .news-item h4 {
        font-size: 0.82rem !important;
    }

    /* Sport tabs */
    .sports-tabs {
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
        gap: 0.3rem !important;
        padding-bottom: 0.5rem;
    }
    .sport-tab {
        font-size: 0.78rem !important;
        padding: 0.4rem 0.7rem !important;
        white-space: nowrap;
    }

    /* Coming soon blocks */
    .coming-soon-sport {
        padding: 2rem 1rem !important;
    }
    .coming-soon-icon {
        font-size: 2.5rem !important;
    }

    /* Email signup */
    .email-signup {
        flex-direction: column;
    }
    .email-input {
        width: 100% !important;
    }
    .notify-btn {
        width: 100% !important;
    }

    /* Forum teaser */
    .forum-teaser h2 {
        font-size: 1.5rem !important;
    }
    .forum-teaser p {
        font-size: 0.85rem !important;
    }

    /* Footer */
    .footer-bottom {
        flex-direction: column;
        text-align: center;
    }
    .footer-disclaimer {
        font-size: 0.68rem !important;
    }
}

/* ══════════════════════════════════════
   Small Phone (≤360px) — Galaxy S series etc.
   ══════════════════════════════════════ */
@media (max-width: 360px) {
    .nav-wordmark {
        font-size: 0.95rem !important;
    }
    .hero h1 {
        font-size: 2.8rem !important;
    }
    .countdown-num {
        font-size: 1.3rem !important;
    }
    .section-title {
        font-size: 1.2rem !important;
    }
    .standings-table table {
        font-size: 0.7rem !important;
    }
}

/* ══════════════════════════════════════
   Touch device improvements
   ══════════════════════════════════════ */
@media (hover: none) {
    /* Larger touch targets */
    .nav-links a {
        min-height: 44px;
        display: flex;
        align-items: center;
    }
    .sport-tab {
        min-height: 44px;
    }
    .filter-btn {
        min-height: 36px;
    }
    .result-row, .result-card {
        min-height: 48px;
    }
    .mobile-nav a {
        min-height: 44px;
        display: flex;
        align-items: center;
    }
}

/* ══════════════════════════════════════
   Noticias page specific (standalone)
   ══════════════════════════════════════ */
@media (max-width: 768px) {
    .news-page-grid {
        grid-template-columns: 1fr !important;
    }
}

@media (max-width: 480px) {
    .news-page-featured img {
        height: 180px !important;
    }
    .news-page-item {
        padding: 0.75rem !important;
    }
}

/* ══════════════════════════════════════
   Print
   ══════════════════════════════════════ */
@media print {
    .nav, .mobile-nav, .hero, .forum-teaser, 
    .footer, .scroll-top, .email-signup,
    .nav-hamburger, .sports-tabs, .filter-bar {
        display: none !important;
    }
    body { background: white; color: black; }
    .standings-table th, .standings-table td {
        display: table-cell !important;
    }
}