/* ===================== */
    /* Team filter (append to elite8.css) */
    /* ===================== */

    .team-filter {
        /* border: 2px solid #e8eaea;
        background-color: #fff; */
        padding: 1.5rem 2rem;
        margin-bottom: 1.5rem;
        width: 100%;
    }

    .team-filter-head {
        display: flex;
        justify-content: space-between;
        align-items: baseline;
        margin-bottom: 1rem;
    }

    .team-filter-title {
        font-weight: 700;
        text-transform: uppercase;
        color: #444;
    }

    .team-filter-clear {
        display: none;
        background: none;
        border: 0;
        padding: 0;
        color: #bf2b34;
        font-weight: 700;
        cursor: pointer;
        /* font-size: 1.3rem; */
    }

    .team-filter-clear.show {
        display: inline;
    }

    .team-filter-clear:hover {
        text-decoration: underline;
    }

    .team-filter-chips {
        display: flex;
        flex-wrap: wrap;
        gap: .75rem;
    }

    .team-chip {
        display: inline-flex;
        align-items: center;
        border: 2px solid #e8eaea;
        border-radius: 999px;
        background-color: #fff;
        color: #444;
        padding: .4rem 1.4rem .4rem .6rem;
        font-size: 1.4rem;
        font-weight: 600;
        line-height: 1;
        cursor: pointer;
        transition: border-color .15s ease, background-color .15s ease;
    }

    .team-chip:hover {
        border-color: #bf2b34;
    }

    .team-chip:focus-visible {
        outline: 2px solid #bf2b34;
        outline-offset: 2px;
    }

    /* Reuses the existing .team-icon logo classes (.newport, .jserra, etc.) */
    .team-chip .team-icon {
        width: 3rem;
        height: 3rem;
        margin-right: .75rem;
    }

    .team-chip[aria-pressed="true"] {
        background-color: #444;
        border-color: #444;
        color: #fff;
    }

    /* Selected chips get a white "puck" behind the logo so dark marks stay visible */
    .team-chip[aria-pressed="true"] .team-icon {
        background-color: #fff !important;
        border-radius: 50%;
    }

    .team-filter-note {
        margin: 1rem 0 0;
        color: #666;
        /* font-size: 1.3rem; */
        margin-bottom: 0 !important        
    }

    /* Hidden by the filter (events and empty date headers) */
    .filtered-out {
        display: none !important;
    }

    @media screen and (max-width: 768px) {
        .team-filter {
            padding: 1.5rem 1rem;
        }

        .team-chip {
            font-size: 1.3rem;
        }

        .team-chip .team-icon {
            width: 2.5rem;
            height: 2.5rem;
        }
    }