/* ══ GBR Public Styles v1.3 — Sandy's Spiel ════════════════ */
@import url('https://fonts.googleapis.com/css2?family=Barlow+Condensed:wght@500;700;900&family=Barlow:wght@400;500;600&display=swap');

.gbr-public-wrap {
    font-family: 'Barlow', sans-serif;
    max-width: 880px;
    margin: 0 auto 40px;
}

/* ── Header ── */
.gbr-public-header {
    background: #111;
    border-radius: 14px 14px 0 0;
    padding: 16px 22px;
    display: flex;
    align-items: center;
    gap: 14px;
}
.gbr-pub-logo { width: 48px; height: 48px; object-fit: contain; border-radius: 50%; flex-shrink: 0; }
.gbr-pub-header-text { display: flex; flex-direction: column; gap: 1px; }
.gbr-pub-brand { font-family: 'Barlow Condensed', sans-serif; font-size: 10px; font-weight: 700; letter-spacing: 2.5px; text-transform: uppercase; color: #CC1F1F; }
.gbr-pub-title { font-family: 'Barlow Condensed', sans-serif; font-size: 1.45rem; font-weight: 900; color: #fff; margin: 0; line-height: 1.1; }

/* ── Filter pills ── */
.gbr-public-filters { display: flex; gap: 8px; flex-wrap: wrap; padding: 12px 18px; background: #f2f2f2; border-left: 1px solid #e0e0e0; border-right: 1px solid #e0e0e0; }
.gbr-pub-pill { padding: 5px 15px; border-radius: 20px; font-family: 'Barlow', sans-serif; font-size: 12px; font-weight: 600; border: none; cursor: pointer; color: #777; background: #e0e0e0; transition: all .14s; }
.gbr-pub-pill:hover { background: #c8c8c8; color: #111; }
.gbr-pub-pill.active { background: #111; color: #fff; }

/* ── Table wrapper ── */
.gbr-pub-table-wrap { overflow-x: auto; border: 1px solid #e0e0e0; border-top: none; border-radius: 0 0 14px 14px; }
.gbr-pub-table { width: 100%; border-collapse: collapse; table-layout: auto; }

.gbr-pub-table thead th {
    background: #f7f7f7;
    padding: 10px 10px;
    font-family: 'Barlow Condensed', sans-serif;
    font-size: 11px; font-weight: 700; letter-spacing: 1.3px;
    text-transform: uppercase; color: #999;
    text-align: left; border-bottom: 2px solid #e0e0e0;
    white-space: nowrap;
}
.gbr-pub-table tbody tr { border-bottom: 1px solid #ebebeb; transition: background .1s; }
.gbr-pub-table tbody tr:last-child { border-bottom: none; }
.gbr-pub-table tbody tr:hover { background: #fafafa; }
.gbr-pub-table tbody td { padding: 10px 10px; font-size: 14px; color: #1a1a1a; vertical-align: middle; }
.gbr-pub-table tbody tr.gbr-hidden { display: none; }

/* ── Rank cell — compact ── */
.pub-th-rank { width: 48px !important; }
.pub-rank    { width: 48px; white-space: nowrap; padding-right: 4px !important; vertical-align: middle; }
.pub-rank-num {
    font-family: 'Barlow Condensed', sans-serif;
    font-size: 15px; font-weight: 900; color: #CC1F1F;
    display: block; line-height: 1.2;
}

/* Riser badge — on its own line under the rank number */
.pub-riser {
    display: inline-flex; align-items: center; gap: 1px;
    background: #e6f4ea; color: #1a7a34;
    font-family: 'Barlow Condensed', sans-serif;
    font-size: 11px; font-weight: 700;
    padding: 1px 5px; border-radius: 4px;
    margin-top: 2px; white-space: nowrap;
}

/* ── Headshot cell — generously sized ── */
.pub-th-photo   { width: 90px !important; }
.pub-headshot-cell { width: 90px; padding: 6px 8px !important; }
.pub-headshot {
    width: 74px; height: 74px;
    border-radius: 50%;
    object-fit: cover;
    border: 2px solid #e0e0e0;
    display: block;
}

/* ── Player name — no wrapping on desktop ── */
.pub-name {
    font-weight: 600;
    font-size: 15px;
    white-space: nowrap;   /* desktop: keep on one line */
}

/* ── School, height, commitment — allow wrap naturally ── */
.pub-school { font-size: 13px; }
.pub-ht     { white-space: nowrap; font-size: 13px; }
.pub-commit { font-size: 13px; }

/* ── Position badges ── */
.pub-pos-badge { display: inline-block; padding: 3px 8px; border-radius: 5px; font-family: 'Barlow Condensed', sans-serif; font-size: 11px; font-weight: 700; letter-spacing: 1px; text-transform: uppercase; white-space: nowrap; }
.pub-pos-pg { background:#e8f0fe; color:#1a56cc; }
.pub-pos-cg { background:#dbeafe; color:#1d4ed8; }
.pub-pos-sg { background:#fce8e6; color:#c0352a; }
.pub-pos-w  { background:#e6f4ea; color:#1e7e34; }
.pub-pos-pf { background:#fff3cd; color:#856404; }
.pub-pos-c  { background:#f3e8ff; color:#6f3fa0; }

.pub-committed { color: #1a7a34; font-weight: 600; font-size: 13px; white-space: nowrap; }
.pub-open      { color: #ccc; }

.gbr-pub-empty { text-align: center; padding: 46px 20px; color: #888; font-size: 15px; border: 1px solid #e0e0e0; border-top: none; border-radius: 0 0 14px 14px; }

/* ═══════════════════════════════════════════════════════
   MOBILE  — clean, screenshot-friendly layout
   Key goals:
   • Player names never break mid-word (overflow hidden / ellipsis)
   • Headshots stay circular and visible
   • Rank column is tight
   • Table fits on screen without horizontal scroll
═══════════════════════════════════════════════════════ */
@media (max-width: 640px) {

    .gbr-public-wrap { margin: 0 0 30px; }

    /* Header tighter */
    .gbr-public-header { padding: 12px 14px; gap: 10px; }
    .gbr-pub-logo { width: 38px; height: 38px; }
    .gbr-pub-title { font-size: 1.1rem; }

    /* Table cells smaller padding */
    .gbr-pub-table tbody td { padding: 8px 6px; font-size: 12px; }
    .gbr-pub-table thead th { padding: 8px 6px; font-size: 10px; }

    /* Rank — stays compact */
    .pub-th-rank, .pub-rank { width: 36px !important; }
    .pub-rank-num { font-size: 13px; }
    .pub-riser { font-size: 10px; padding: 1px 4px; }

    /* Headshot — still clearly visible on mobile */
    .pub-th-photo, .pub-headshot-cell { width: 58px !important; padding: 4px 4px !important; }
    .pub-headshot { width: 50px; height: 50px; border-width: 1px; }

    /* Player name — single line, truncate if needed, NO mid-word breaks */
    .pub-name {
        font-size: 12px;
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
        max-width: 110px;
    }

    /* School — allow wrap but no hyphenation */
    .pub-school {
        font-size: 11px;
        word-break: keep-all;
        overflow-wrap: break-word;
        hyphens: none;
    }

    /* Height — keep on one line */
    .pub-ht { font-size: 11px; white-space: nowrap; }

    /* Commitment — can wrap but no hyphens */
    .pub-commit {
        font-size: 11px;
        word-break: keep-all;
        hyphens: none;
    }
    .pub-committed { font-size: 11px; white-space: nowrap; }

    /* Position badge */
    .pub-pos-badge { font-size: 10px; padding: 2px 6px; }

    /* Hide commitment column on very small screens to avoid crush */
    @media (max-width: 420px) {
        .pub-commit, .gbr-pub-table thead th:last-child { display: none; }
    }
}
