@import url("./premium-night-shell.css?v=20260831-connected");

/* Northstar presentation for the Supabase-connected coach/player preview. */
body.versari-app-ready.versari-light {
  --premium-bg: #eae3d7;
  --premium-rail: #f6efe3;
  --premium-surface: #fbf7ef;
  --premium-raised: #fffdf8;
  --premium-line: #d4c7b7;
  --premium-muted: #6f6a61;
  --premium-cyan: #007d9b;
  --premium-copper: #c97b45;
  --premium-white: #071b22;
  background: var(--premium-bg);
  color: var(--premium-white);
}

/* Keep cyan as an accent in light mode; large reading surfaces stay warm. */
body.versari-app-ready.versari-light .workspace,
body.versari-app-ready.versari-light .content {
  background: var(--premium-bg) !important;
}

body.versari-app-ready.versari-light .content > .view,
body.versari-app-ready.versari-light .content > .view.active {
  background: transparent !important;
  color: var(--premium-white) !important;
}

body.versari-app-ready.versari-light .content :is(
  input,
  select,
  textarea,
  .filters select,
  .text-input
) {
  background: var(--premium-raised) !important;
  color: var(--premium-white) !important;
  border-color: var(--premium-line) !important;
}

body.versari-app-ready.versari-light .content :is(
  .panel,
  .schedule-row,
  .lineup-row,
  .format-grid,
  .flow > span,
  .integration-note
) {
  background: var(--premium-surface) !important;
}

body.versari-app-ready:not(.versari-light) {
  --premium-bg: #020609;
  --premium-rail: #041017;
  --premium-surface: #07161b;
  --premium-raised: #0b2027;
  --premium-line: #24414a;
  --premium-muted: #9ab0b8;
  --premium-cyan: #28d9e8;
  --premium-copper: #c97b45;
  --premium-white: #f4f8fa;
}

.versari-light .sidebar,
body.versari-light[data-preview-role="admin"] .app-shell > .sidebar {
  --premium-white: #071b22;
  --premium-muted: #6f6a61;
  --premium-line: #d4c7b7;
  background: var(--premium-rail) !important;
  color: var(--premium-white) !important;
  box-shadow: 8px 0 30px rgba(63, 46, 29, .06);
}

.versari-light .sidebar .brand {
  margin: -28px -18px 18px !important;
  padding: 20px 22px !important;
  height: 86px !important;
  background: #020609 !important;
  border-bottom: 3px solid transparent !important;
  border-image: linear-gradient(90deg, #28d9e8, #c97b45) 1 !important;
}

.versari-light .sidebar .brand img {
  width: 166px !important;
  max-height: 48px !important;
}

.versari-light .sidebar .nav-item,
.versari-light .sidebar .nav-item:not(.active) {
  color: #56534e !important;
}

.versari-light .sidebar .nav-item:hover {
  color: #071b22 !important;
  background: rgba(201, 123, 69, .09) !important;
}

.versari-light .sidebar .nav-item.active {
  color: #071b22 !important;
  background: linear-gradient(90deg, rgba(201, 123, 69, .16), rgba(201, 123, 69, .06)) !important;
  box-shadow: inset 3px 0 #007d9b, inset 6px 0 #c97b45 !important;
}

.versari-light .sidebar-section-label,
.versari-light .sidebar-role-switcher > span {
  color: #74371f !important;
}

.versari-light .sidebar .profile,
.versari-light .sidebar-bottom > .nav-item {
  border-color: var(--premium-line) !important;
  color: #56534e !important;
}

.versari-light .sidebar-bottom,
.versari-light .sidebar-role-switcher,
.versari-light .sidebar .profile,
.versari-light .sidebar-bottom > .nav-item,
.versari-light .sidebar-bottom select {
  background: var(--premium-rail) !important;
  color: #514b44 !important;
  border-color: var(--premium-line) !important;
}

.versari-light .sidebar-bottom > .nav-item:hover,
.versari-light .sidebar .profile:hover {
  background: rgba(201, 123, 69, .09) !important;
  color: #071b22 !important;
}

.versari-light .workspace > .topbar {
  background: rgba(251, 247, 239, .96) !important;
  border-color: var(--premium-line) !important;
}

.versari-app-ready .workspace > .topbar .sidebar-role-switcher {
  display: flex !important;
  align-items: center;
  gap: 8px;
  width: auto !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
}

.versari-app-ready .workspace > .topbar .sidebar-role-switcher > span {
  color: var(--premium-copper) !important;
  font-size: 8px;
  font-weight: 900;
  letter-spacing: .12em;
  white-space: nowrap;
}

.versari-app-ready .workspace > .topbar .sidebar-role-switcher select {
  width: auto !important;
  min-width: 132px;
  min-height: 38px;
  padding: 0 32px 0 11px;
  border: 1px solid var(--premium-line) !important;
  border-radius: 6px;
  background: var(--premium-surface) !important;
  color: var(--premium-white) !important;
}

.versari-light :is(.program-context-nav, .competition-context-nav, .resources-context-nav) button {
  color: #514b44 !important;
  border-color: #cbbdab !important;
  background: #fbf7ef !important;
}

.versari-light :is(.program-context-nav, .competition-context-nav, .resources-context-nav) button:hover,
.versari-light :is(.program-context-nav, .competition-context-nav, .resources-context-nav) button.active {
  color: #071b22;
  border-color: #c97b45;
  background: #f4e3d5;
}

body.versari-app-ready.versari-light .content :is(.program-context-nav, .competition-context-nav, .resources-context-nav) button {
  background:#fbf7ef !important;
  color:#514b44 !important;
  border-color:#d4c7b7 !important;
}
body.versari-app-ready.versari-light .content :is(.program-context-nav, .competition-context-nav, .resources-context-nav) button:is(:hover,.active) {
  background:#fffdf8 !important;
  color:#007d9b !important;
  border-bottom-color:#c97b45 !important;
}

body.versari-app-ready.versari-light .content :is(
  .coach-program-hero,
  .coach-team-list,
  .coach-profile-card,
  .school-summary,
  .organization-hero,
  .live-section,
  .live-empty,
  .live-onboarding,
  .game-detail,
  .game-menu button,
  .schedule-row,
  .live-schedule-row,
  .game-available-leagues,
  .game-league-card,
  .live-standings-panel,
  .standings-league-selector button
) {
  background: var(--premium-surface) !important;
  color: var(--premium-white) !important;
  border-color: var(--premium-line) !important;
  box-shadow: none !important;
}

body.versari-app-ready.versari-light .content :is(
  .coach-program-hero,
  .coach-team-list,
  .coach-profile-card,
  .school-summary,
  .organization-hero,
  .live-section,
  .live-empty,
  .live-onboarding,
  .game-detail,
  .schedule-row,
  .live-schedule-row,
  .live-standings-panel
) :is(h1, h2, h3, h4, b, strong) {
  color: #071b22 !important;
}

body.versari-app-ready.versari-light .content :is(.outline, .text-btn, .panel-link, .live-open-match) {
  background: #fffdf8 !important;
  color: #071b22 !important;
  border-color: #cbbdab !important;
}

body.versari-app-ready.versari-light .content :is(.filters, .northstar-section-tabs) button:not(.primary) {
  background: #fbf7ef !important;
  color: #514b44 !important;
  border-color: #d4c7b7 !important;
}

body.versari-app-ready.versari-light .content :is(.filters, .northstar-section-tabs) button:is(.selected, .active) {
  background: #fffdf8 !important;
  color: #007d9b !important;
  border-bottom-color: #c97b45 !important;
}

.northstar-competition-page { max-width: 1220px; margin: 0 auto; padding: 20px 0 52px; }
.northstar-section-tabs { display:flex; gap:0; margin:0 0 26px; border-bottom:1px solid var(--premium-line); }
.northstar-section-tabs button { min-height:46px; padding:0 22px; border:0; border-bottom:2px solid transparent; font-weight:850; letter-spacing:.05em; text-transform:uppercase; cursor:pointer; }
.northstar-section-tabs button.active { border-bottom-color:var(--premium-copper); color:var(--premium-cyan); }
.northstar-league-summary { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); margin:0 0 22px; border:1px solid var(--premium-line); background:var(--premium-surface); }
.northstar-league-summary article { min-height:104px; padding:22px 24px; border-right:1px solid var(--premium-line); }
.northstar-league-summary article:last-child { border-right:0; }
.northstar-league-summary b,.northstar-league-summary span { display:block; }
.northstar-league-summary b { color:var(--premium-white); font:400 34px Michroma,Inter,sans-serif; }
.northstar-league-summary span { margin-top:7px; color:var(--premium-muted); font-size:9px; font-weight:850; letter-spacing:.12em; text-transform:uppercase; }
.northstar-category-strip { display:flex; gap:10px; overflow-x:auto; padding:0 0 12px; scrollbar-color:var(--premium-copper) transparent; }
.northstar-category-strip button { flex:0 0 min(310px,82vw); min-height:118px; padding:18px 20px; border:1px solid var(--premium-line); border-top:3px solid transparent; background:var(--premium-surface); color:var(--premium-white); text-align:left; cursor:pointer; }
.northstar-category-strip button.active { border-top-color:var(--premium-copper); background:var(--premium-raised); }
.northstar-category-strip span,.northstar-category-strip b,.northstar-category-strip small { display:block; }
.northstar-category-strip span { color:var(--premium-copper); font-size:9px; font-weight:900; letter-spacing:.12em; text-transform:uppercase; }
.northstar-category-strip b { margin-top:9px; font:600 17px Michroma,Inter,sans-serif; }
.northstar-category-strip small { margin-top:7px; color:var(--premium-muted); line-height:1.4; }
.northstar-league-directory { margin-top:22px; }
.northstar-league-directory > header { display:flex; align-items:end; justify-content:space-between; gap:20px; padding:0 0 14px; border-bottom:1px solid var(--premium-line); }
.northstar-league-directory > header h2 { margin:5px 0 0; }
.northstar-league-directory > header p { max-width:470px; margin:0; color:var(--premium-muted); text-align:right; }
.northstar-league-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; margin-top:14px; }
.northstar-league-card { display:grid; grid-template-columns:minmax(0,1fr) auto; gap:15px; padding:18px; border:1px solid var(--premium-line); border-left:4px solid var(--league-accent); background:var(--premium-surface); color:var(--premium-white); text-align:left; cursor:pointer; }
.northstar-league-card:hover { background:var(--premium-raised); transform:translateY(-1px); }
.northstar-league-identity { display:flex; gap:12px; min-width:0; }
.northstar-league-identity i { display:grid; place-items:center; flex:0 0 42px; width:42px; height:42px; border-radius:8px; background:var(--league-accent); color:#071b22; font-style:normal; font-weight:900; }
.northstar-league-identity span { color:var(--premium-copper); font-size:9px; font-weight:900; letter-spacing:.1em; text-transform:uppercase; }
.northstar-league-identity h3 { margin:4px 0; color:var(--premium-white); font-size:15px; }
.northstar-league-identity p { margin:0; color:var(--premium-muted); }
.northstar-league-state { align-self:start; padding:6px 8px; border:1px solid var(--premium-line); color:var(--premium-muted); font-size:9px; text-transform:uppercase; }
.northstar-league-state.open { border-color:var(--league-accent); color:var(--league-accent); }
.northstar-league-card dl { grid-column:1/-1; display:grid; grid-template-columns:1fr 1fr; gap:14px; margin:0; padding-top:13px; border-top:1px solid var(--premium-line); }
.northstar-league-card dt { color:var(--premium-muted); font-size:8px; font-weight:850; letter-spacing:.08em; text-transform:uppercase; }
.northstar-league-card dd { margin:5px 0 0; }
.northstar-league-card > span { grid-column:1/-1; color:var(--premium-cyan); font-size:10px; font-weight:850; }
.northstar-format-layout { margin-top:4px; }

body.versari-light .northstar-league-summary,
body.versari-light .northstar-category-strip button,
body.versari-light .northstar-league-card { background:#fbf7ef !important; color:#071b22 !important; border-color:#d4c7b7; }
body.versari-light .northstar-category-strip button.active,
body.versari-light .northstar-league-card:hover { background:#fffdf8 !important; }
body.versari-light .northstar-league-identity h3,
body.versari-light .northstar-league-summary b { color:#071b22 !important; }
body.versari-app-ready.versari-light .content .northstar-category-strip button,
body.versari-app-ready.versari-light .content .northstar-league-card {
  background:#fbf7ef !important;
  color:#071b22 !important;
  border-color:#d4c7b7 !important;
}
body.versari-app-ready.versari-light .content .northstar-category-strip button.active,
body.versari-app-ready.versari-light .content .northstar-league-card:hover { background:#fffdf8 !important; }
body.versari-app-ready.versari-light #games .competition-context-nav button,
body.versari-app-ready.versari-light #games .northstar-category-strip button,
body.versari-app-ready.versari-light #games .northstar-league-card {
  background:#fbf7ef !important;
  color:#071b22 !important;
  border-color:#d4c7b7 !important;
}
body.versari-app-ready.versari-light #games .competition-context-nav button.active,
body.versari-app-ready.versari-light #games .northstar-category-strip button.active,
body.versari-app-ready.versari-light #games .northstar-league-card:hover {
  background:#fffdf8 !important;
}

body.versari-app-ready.versari-light #school .coach-program-page :is(.school-summary,.school-grid .panel,.coach-school-team-head,.coach-school-team-row),
body.versari-app-ready.versari-light #teams .coach-program-page :is(.panel,.coach-team-card,.coach-roster-row,.coach-stat,.coach-team-selector button),
body.versari-app-ready.versari-light #matches :is(.live-schedule-row,.live-schedule-empty),
body.versari-app-ready.versari-light #standings :is(.standings-league-selector button,.live-standings-panel,.live-standing-grid) {
  background:#fbf7ef !important;
  color:#071b22 !important;
  border-color:#d4c7b7 !important;
  box-shadow:none !important;
}
body.versari-app-ready.versari-light #school .coach-program-page :is(.school-summary,.school-grid .panel,.coach-school-team-row) :is(h2,h3,b,strong,span),
body.versari-app-ready.versari-light #teams .coach-program-page :is(.panel,.coach-team-card,.coach-roster-row,.coach-stat) :is(h2,h3,b,strong),
body.versari-app-ready.versari-light #matches .live-schedule-row :is(h3,b,strong),
body.versari-app-ready.versari-light #standings :is(.live-standings-panel,.live-standing-grid) :is(h2,h3,b,strong) {
  color:#071b22 !important;
}
body.versari-app-ready.versari-light #school .coach-program-page :is(.panel-head,.coach-school-team-head),
body.versari-app-ready.versari-light #standings .live-standing-grid.head {
  background:#f3ecdf !important;
}
body.versari-app-ready.versari-light #school .coach-program-page button.coach-school-team-row,
body.versari-app-ready.versari-light #school .coach-program-page .panel-head,
body.versari-app-ready.versari-light #school .coach-program-page .coach-school-team-head {
  background:#fbf7ef !important;
  color:#071b22 !important;
  border-color:#d4c7b7 !important;
}
body.versari-app-ready.versari-light :is(#school,#teams,#people) .program-context-nav button,
body.versari-app-ready.versari-light :is(#matches,#queue,#games,#standings) .competition-context-nav button,
body.versari-app-ready.versari-light #league-rules .resources-context-nav button {
  background:#fbf7ef !important;
  color:#514b44 !important;
  border-color:#d4c7b7 !important;
}
body.versari-app-ready.versari-light :is(#school,#teams,#people) .program-context-nav button.active,
body.versari-app-ready.versari-light :is(#matches,#queue,#games,#standings) .competition-context-nav button.active,
body.versari-app-ready.versari-light #league-rules .resources-context-nav button.active {
  background:#fffdf8 !important;
  color:#007d9b !important;
  border-bottom-color:#c97b45 !important;
}
body.versari-app-ready.versari-light #school .page-title :is(button,.primary) {
  background:#c97b45 !important;
  color:#071b22 !important;
  border-color:#c97b45 !important;
}
html body.versari-app-ready.versari-light main.app-shell .content #school.view.active .coach-program-page .school-grid .panel .panel-head,
html body.versari-app-ready.versari-light main.app-shell .content #school.view.active .coach-program-page .school-grid .panel button.coach-school-team-row {
  background:#fbf7ef !important;
  color:#071b22 !important;
  border-color:#d4c7b7 !important;
}
html body.versari-app-ready.versari-light main.app-shell .content #school.view.active .school-grid .panel .panel-head,
html body.versari-app-ready.versari-light main.app-shell .content #school.view.active .school-grid .panel button.coach-school-team-row,
html body.versari-app-ready.versari-light main.app-shell .content #school.view.active .school-grid .panel .coach-school-team-head {
  background:#fbf7ef !important;
  color:#071b22 !important;
  border-color:#d4c7b7 !important;
}

@media(max-width:760px){
  .northstar-competition-page{padding-top:8px}.northstar-section-tabs{overflow-x:auto}.northstar-section-tabs button{white-space:nowrap;padding-inline:15px}.northstar-league-summary{grid-template-columns:1fr}.northstar-league-summary article{border-right:0;border-bottom:1px solid var(--premium-line)}.northstar-league-summary article:last-child{border-bottom:0}.northstar-league-grid{grid-template-columns:1fr}.northstar-league-directory>header{display:block}.northstar-league-directory>header p{margin-top:8px;text-align:left}.northstar-league-card{grid-template-columns:1fr}.northstar-league-state{justify-self:start}.northstar-league-card dl{grid-template-columns:1fr}
}

.northstar-connected-toggle {
  min-height: 38px;
  padding: 0 13px;
  border: 1px solid var(--premium-line, #24414a);
  border-radius: 6px;
  background: var(--premium-surface, #07161b);
  color: var(--premium-white, #f4f8fa);
  font: 800 11px Inter, Arial, sans-serif;
  cursor: pointer;
  white-space: nowrap;
}

.northstar-connected-toggle:hover,
.northstar-connected-toggle:focus-visible {
  border-color: var(--premium-cyan, #28d9e8);
}

@media (max-width: 760px) {
  .versari-light .sidebar .brand {
    margin: 0 !important;
    padding: 7px 10px !important;
    height: auto !important;
    border: 0 !important;
  }
  .northstar-connected-toggle { min-height: 34px; padding-inline: 10px; }
  .versari-app-ready .workspace > .topbar .sidebar-role-switcher > span { display: none !important; }
  .versari-app-ready .workspace > .topbar .sidebar-role-switcher select { min-width: 118px; min-height: 34px; }
}