/* ==========================================================================
   TennisShop Gym v2 — sponsors.css
   Tira de patrocinantes de eventos. Aplica en:
     - .tsg-sponsors--modal   → modal del calendario
     - .tsg-sponsors--card    → tira pequeña dentro de la card del widget Events
     - .tsg-sponsors--page    → versión grande para template archive del evento
   ========================================================================== */

.tsg-sponsors {
    --tsg-blue: #001489;
    --tsg-orange: #e66415;
    --tsg-muted: #64748b;
    --tsg-subtle: #94a3b8;
    --tsg-border: #e9ecf3;
    --tsg-surface: #ffffff;

    margin-top: 18px;
    padding-top: 16px;
    border-top: 1px dashed var(--tsg-border);
    font-family: "Montserrat","Gotham",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif;
}

.tsg-sponsors__label {
    display: block;
    font-size: 10px;
    font-weight: 800;
    letter-spacing: 1.5px;
    text-transform: uppercase;
    color: var(--tsg-subtle);
    text-align: center;
    margin-bottom: 10px;
}

.tsg-sponsors__strip {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: center;
    gap: 18px;
}

.tsg-sponsor-link {
    display: inline-flex;
    align-items: center;
    transition: transform .2s ease, filter .2s ease, opacity .2s ease;
    text-decoration: none;
    filter: grayscale(0.35);
    opacity: 0.85;
}
.tsg-sponsor-link:hover { transform: scale(1.06); filter: none; opacity: 1; }

.tsg-sponsor {
    display: inline-flex;
    align-items: center;
    justify-content: center;
}
.tsg-sponsor img {
    max-width: 100%;
    object-fit: contain;
    display: block;
}
.tsg-sponsor__placeholder {
    display: inline-block;
    padding: 8px 12px;
    background: rgba(0,20,137,.05);
    border-radius: 8px;
    font-weight: 700;
    font-size: 12px;
    color: var(--tsg-blue);
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

/* ─── Tiers: tamaños distintos según importancia ────────────────────────── */
.tsg-sponsor--main img,
.tsg-sponsor--main .tsg-sponsor__placeholder { max-height: 64px; }
.tsg-sponsor--gold img,
.tsg-sponsor--gold .tsg-sponsor__placeholder { max-height: 48px; }
.tsg-sponsor--silver img,
.tsg-sponsor--silver .tsg-sponsor__placeholder { max-height: 38px; }
.tsg-sponsor--collaborator img,
.tsg-sponsor--collaborator .tsg-sponsor__placeholder { max-height: 30px; opacity: 0.85; }

/* ─── Variantes por contexto ────────────────────────────────────────────── */
.tsg-sponsors--modal {
    margin-top: 22px;
    padding-top: 20px;
}
.tsg-sponsors--card {
    margin-top: 12px;
    padding: 10px 20px 16px;
    border-top: 1px dashed var(--tsg-border);
    background: rgba(0,20,137,.02);
}
.tsg-sponsors--card .tsg-sponsors__strip { gap: 12px; }
.tsg-sponsors--card .tsg-sponsor--main img { max-height: 40px; }
.tsg-sponsors--card .tsg-sponsor--gold img { max-height: 32px; }
.tsg-sponsors--card .tsg-sponsor--silver img { max-height: 26px; }
.tsg-sponsors--card .tsg-sponsor--collaborator img { max-height: 22px; }

.tsg-sponsors--page {
    margin: 40px auto;
    padding: 30px 20px;
    border-top: 0;
    background: linear-gradient(180deg, rgba(0,20,137,.03), transparent);
    border-radius: 16px;
    max-width: 1100px;
}
.tsg-sponsors--page .tsg-sponsors__label { font-size: 12px; margin-bottom: 16px; }
.tsg-sponsors--page .tsg-sponsors__strip { gap: 30px; }
.tsg-sponsors--page .tsg-sponsor--main img { max-height: 96px; }
.tsg-sponsors--page .tsg-sponsor--gold img { max-height: 72px; }
.tsg-sponsors--page .tsg-sponsor--silver img { max-height: 54px; }
.tsg-sponsors--page .tsg-sponsor--collaborator img { max-height: 40px; }

/* ─── Responsive ────────────────────────────────────────────────────────── */
@media (max-width: 600px) {
    .tsg-sponsors__strip { gap: 12px; }
    .tsg-sponsor--main img { max-height: 48px; }
    .tsg-sponsor--gold img { max-height: 38px; }
    .tsg-sponsor--silver img { max-height: 30px; }
    .tsg-sponsor--collaborator img { max-height: 24px; }
}