/* ==========================================================================
   FC CONDOR - CREAM & LOGO PALETTE DESIGN SYSTEM + MOBILE TABLE STYLES
   ========================================================================== */

:root {
    --condor-cream: #FAF7F0;
    --condor-card-bg: #FFFFFF;
    --condor-card-border: #E8E2D5;
    --condor-text-main: #1A1C23;
    --condor-text-muted: #6B6F7E;
    --condor-gold: #D4A017;
    --condor-gold-hover: #B8860B;
    --condor-blue: #0A2680;
    --condor-red: #C8102E;
}

body {
    font-family: 'Inter', sans-serif;
    background-color: var(--condor-cream);
    color: var(--condor-text-main);
    margin: 0;
    padding: 0;
}

h1, h2, h3, h4, h5, h6, .font-display {
    font-family: 'Oswald', sans-serif;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    color: var(--condor-text-main);
}

/* Club Badge Flag Stripe Header Accent */
.flag-stripe {
    background: linear-gradient(90deg, var(--condor-blue) 0%, var(--condor-blue) 33.3%, var(--condor-gold) 33.3%, var(--condor-gold) 66.6%, var(--condor-red) 66.6%, var(--condor-red) 100%);
}

.gold-glow {
    text-shadow: 0 0 15px rgba(212, 160, 23, 0.4);
}

.nav-link.active {
    color: var(--condor-blue) !important;
    border-bottom: 2px solid var(--condor-blue);
    background-color: rgba(10, 38, 128, 0.06);
}

/* Touch-friendly horizontal scrolling wrapper for mobile devices */
.table-scroll {
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    width: 100%;
}

/* Scrollbar styling for touch tables */
.table-scroll::-webkit-scrollbar {
    height: 4px;
}
.table-scroll::-webkit-scrollbar-thumb {
    background: var(--condor-gold);
    border-radius: 4px;
}

/* Ensure mobile text stays readable without overflowing */
@media (max-width: 640px) {
    .table-scroll table {
        font-size: 0.75rem;
    }
    .table-scroll th, 
    .table-scroll td {
        padding: 0.5rem 0.35rem !important;
    }
    .team-name-cell {
        max-width: 110px;
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
    }
}