/* css/match-premium.css — Match detail premium + responsive (Updated Green Theme) */

.mp-shell { margin-top: 0.5rem; }

/* Tabs */
.mp-tabs {
    display: flex;
    gap: 6px;
    overflow-x: auto;
    flex-wrap: nowrap;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
    padding-bottom: 4px;
}
.mp-tabs::-webkit-scrollbar { display: none; }
.mp-tabs .match-tab {
    flex-shrink: 0;
    white-space: nowrap;
    padding: 8px 14px;
    font-size: 0.72rem;
    cursor: pointer;
    transition: all 0.2s;
}
.mp-tabs .match-tab:hover,
.mp-tabs .match-tab.active {
    background: var(--primary);
    color: #fff;
    border-radius: 8px;
}

@media (max-width: 640px) {
    .mp-tabs { flex-wrap: wrap; overflow-x: visible; }
    .mp-tabs .match-tab { font-size: 0.68rem; padding: 7px 10px; }
}

.mp-content { max-height: none; overflow: visible; padding: 0.5rem 0 1rem; }
.card.expanded .match-tab-content { max-height: min(75vh, 900px); overflow-y: auto; }
.mp-loading { text-align: center; padding: 2rem; color: var(--text-muted); }
.mp-section-label { font-size: 0.65rem; font-weight: 800; letter-spacing: 0.08em; text-transform: uppercase; color: var(--text-muted); margin-bottom: 0.75rem; }

/* Venue hero */
.mp-venue-hero {
    position: relative;
    border-radius: 14px;
    overflow: hidden;
    margin-bottom: 1rem;
    min-height: 120px;
    background: linear-gradient(135deg, #184632 0%, #0d1117 100%);
}
.mp-venue-img { width: 100%; height: 140px; object-fit: cover; opacity: 0.85; }
.mp-venue-overlay { position: absolute; inset: 0; background: linear-gradient(to top, rgba(0,0,0,0.85) 0%, transparent 60%); padding: 1rem 1.1rem; display: flex; flex-direction: column; justify-content: flex-end; }
.mp-venue-name { font-size: 1.1rem; font-weight: 800; color: #fff; }

/* Coaches panel */
.mp-coaches-panel { padding: 1rem 1.1rem; border-radius: 14px; margin-bottom: 1rem; border: 1px solid var(--glass-border); }
.mp-coaches-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 0.75rem; }
.mp-coach-card { display: flex; align-items: center; gap: 10px; padding: 0.65rem; background: rgba(0,0,0,0.25); border-radius: 12px; }
.mp-coach-formation { font-size: 0.8rem; font-weight: 800; color: var(--primary); }

/* Starting XI */
.mp-xi-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 0.75rem; margin-bottom: 1rem; }
.mp-xi-formation { margin-left: auto; font-weight: 800; font-size: 0.9rem; color: var(--primary); }
.mp-player-num { background: var(--primary); color: #fff; font-size: 0.55rem; border-radius: 8px; display: flex; align-items: center; justify-content: center; width: 16px; height: 16px; }
.mp-player-value { color: #2ecc71; font-size: 0.68rem; font-weight: 700; }
.mp-player-attr { color: var(--primary); font-size: 0.62rem; font-weight: 700; }

/* AI Preview */
.mp-ai-preview { padding: 1.25rem 1.5rem; border-radius: 16px; border: 1px solid rgba(var(--primary-rgb), 0.15); background: linear-gradient(135deg, rgba(var(--primary-rgb), 0.06) 0%, rgba(255, 255, 255, 0.02) 100%); }
.mp-ai-badge, .mp-ai-badge-inline { background: rgba(var(--primary-rgb), 0.15); color: var(--primary); border: 1px solid rgba(var(--primary-rgb), 0.25); }
.oi-ai-summary .mp-section-label i { color: var(--primary); }

/* Match Page Hero */
.mp-hero-score.live { color: var(--primary); }
.mp-live-badge { color: var(--primary); font-size: 0.75rem; font-weight: 800; text-transform: uppercase; }

/* Smart Live Bar */
.match-smart-bar {
    position: fixed; bottom: 0; left: 0; right: 0; z-index: 1000;
    background: linear-gradient(to top, rgba(10, 11, 16, 0.98) 70%, transparent);
    padding: 0.75rem 1rem;
}
.mp-smart-cta { box-shadow: 0 8px 32px rgba(var(--primary-rgb), 0.35); }
.mp-smart-live {
    background: linear-gradient(135deg, var(--primary), #27ae60);
    color: #fff;
    animation: mpPulseGlow 2s ease-in-out infinite;
}
@keyframes mpPulseGlow {
    0%, 100% { box-shadow: 0 8px 32px rgba(var(--primary-rgb), 0.35); }
    50% { box-shadow: 0 8px 40px rgba(var(--primary-rgb), 0.55); }
}

/* Pitch & Formation */
.fp-formation { color: var(--primary); }
.fp-home .fp-dot { fill: var(--primary); stroke: #1e8449; }
.fp-away .fp-dot { fill: #2ecc71; stroke: #27ae60; }
.mp-fd-item i { color: var(--primary); }

/* Language Switcher */
.lang-btn.active { background: var(--primary); color: #fff; }

/* Media Queries & Responsive Overrides */
@media (max-width: 600px) {
    .mp-hero-teams { grid-template-columns: 1fr; gap: 0.75rem; }
    .mp-hero-center { order: -1; }
    .fp-header { grid-template-columns: 1fr; text-align: center; }
}