/* =========================================================================
   Browse Public Leagues (/Home/PublicLeagues) — dark marketing design like
   the landing page. Reuses Landing.css (.pl-page, .pl-nav, .pl-btn…); this
   file adds the browse-specific pieces (plb-*). Dark in both themes, same
   treatment as the landing hero / auth promo panels.
   ========================================================================= */

/* Content sits in the landing page's .pl-container (max-width 1460px) so every
   public page shares the same gutters */
/* Title is the shared h1.acPublicTitle (site.css) */
.plb-sub { color: #aebbd5; font-size: 17px; margin-bottom: 24px; }

/* Toolbar: search + filter chips */
.plb-toolbar { display: flex; gap: 12px; flex-wrap: wrap; align-items: center; margin-bottom: 8px; }
.plb-search { flex: 1 1 260px; display: flex; align-items: center; gap: 10px; background: rgba(255,255,255,0.05); border: 1px solid rgba(124,164,233,0.22); border-radius: 10px; padding: 10px 14px; color: #8fa7c9; }
.plb-search input { background: none; border: none; outline: none; color: #eef4ff; font-size: 15px; width: 100%; }
.plb-search input::placeholder { color: #6d80a0; }
.plb-chips { display: flex; gap: 8px; flex-wrap: wrap; }
.plb-chip { border-radius: 999px; padding: 8px 16px; font-size: 13px; font-weight: 700; cursor: pointer; border: 1px solid rgba(124,164,233,0.25); background: rgba(255,255,255,0.04); color: #b9c8e6; user-select: none; }
.plb-chip:hover { border-color: rgba(127,176,255,0.5); color: #eef4ff; }
.plb-chip.active { background: #2d7cff; border-color: #2d7cff; color: #fff; }

.plb-count { color: #7f95b8; font-size: 13px; margin-bottom: 14px; }

/* Season group header */
.plb-season-head { display: flex; align-items: center; gap: 10px; margin: 20px 0 10px; }
.plb-season-head:first-of-type { margin-top: 0; }
.plb-season-title { font-weight: 700; font-size: 15px; color: #eef4ff; white-space: nowrap; }
.plb-season-head.past .plb-season-title { color: #93a7c4; }
.plb-season-pill { border-radius: 999px; padding: 2px 10px; font-size: 11px; font-weight: 700; background: rgba(45,124,255,0.16); color: #7fb0ff; border: 1px solid rgba(45,124,255,0.35); white-space: nowrap; }
.plb-season-head.past .plb-season-pill { background: rgba(255,255,255,0.06); color: #8fa7c9; border-color: rgba(124,164,233,0.25); }
.plb-season-rule { flex: 1; height: 1px; background: rgba(70,102,155,0.3); }

/* League card grid */
.plb-grid { display: grid; grid-template-columns: 1fr; gap: 12px; }
@media (min-width: 760px)  { .plb-grid { grid-template-columns: repeat(2, 1fr); } }
@media (min-width: 1100px) { .plb-grid { grid-template-columns: repeat(3, 1fr); } }

.plb-card { border-radius: 16px; padding: 18px; background: linear-gradient(180deg, rgba(7,20,43,0.95) 0%, rgba(5,14,30,0.92) 100%); border: 1px solid rgba(80,118,189,0.3); display: flex; flex-direction: column; gap: 12px; transition: border-color .15s ease, transform .15s ease; }
.plb-card:hover { border-color: rgba(127,176,255,0.5); transform: translateY(-2px); }
.plb-card.plb-past { opacity: .65; }
.plb-card.plb-past:hover { transform: none; border-color: rgba(80,118,189,0.3); }

.plb-card-top { display: flex; align-items: center; gap: 12px; min-width: 0; }
.plb-card-copy { min-width: 0; }
.plb-card-name { font-weight: 700; font-size: 17px; color: #f0f5ff; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.plb-card-format { color: #97abc8; font-size: 13px; }

/* Org badge — bigger sibling of the app's .acLeagueBadge */
.plb-org { width: 34px; height: 34px; border-radius: 8px; margin-left: auto; flex: 0 0 auto; background: linear-gradient(135deg, #173b7a 0%, #0f274b 70%); border: 1px solid rgba(127,176,255,.35); color: #eef4ff; font-size: 10px; font-weight: 800; letter-spacing: .02em; display: inline-flex; align-items: center; justify-content: center; }
.plb-org.ncaaBadge { background: linear-gradient(135deg, #0b5cab 0%, #1f7dd3 100%); border-color: rgba(125,190,255,.4); color: #eef7ff; }

/* Tag pills */
.plb-tags { display: flex; gap: 6px; flex-wrap: wrap; }
.plb-tag { border-radius: 999px; padding: 4px 12px; font-size: 11.5px; font-weight: 700; letter-spacing: .02em; }
.plb-tag-conf { background: rgba(45,124,255,0.16); color: #7fb0ff; border: 1px solid rgba(45,124,255,0.35); }
.plb-tag-surv { background: rgba(245,158,11,0.14); color: #fbbf24; border: 1px solid rgba(245,158,11,0.35); }
.plb-tag-free { background: rgba(34,197,94,0.14); color: #4ade80; border: 1px solid rgba(34,197,94,0.35); }
.plb-tag-fee  { background: rgba(255,255,255,0.06); color: #c4d4ef; border: 1px solid rgba(124,164,233,0.25); }

.plb-stats { display: flex; gap: 18px; color: #97abc8; font-size: 13px; }
.plb-stats b { color: #e7eefb; font-weight: 700; }

.plb-card-foot { margin-top: auto; display: flex; }
.plb-card-foot .pl-btn { flex: 1; }
/* Disabled state buttons ("Past season" / "Too late to join" / "Joined") */
.plb-btn-disabled { background: rgba(255,255,255,0.08) !important; border-color: transparent !important; color: #8fa7c9 !important; opacity: 1 !important; }

.plb-loading { text-align: center; padding: 40px; }
.plb-empty { color: #97abc8; text-align: center; padding: 40px 0; }
