/* SITE HEADER — one top menu, identical on every signed-in page (Home included).
   Styled after the menu bar in the approved art (assets/dashboard-clean.png).
   Uses the page's existing .topbar markup and dropdown behaviour; nothing in index.html is edited.
   Loaded last so it wins over the older layered header rules.
   Undo: remove this file and its <link> in index.html. */

/* ---------- bar (all signed-in pages) ---------- */
body.pool-authorized:not(.login-mode) .topbar{
  display:flex!important;align-items:center!important;justify-content:space-between!important;gap:16px!important;
  position:sticky!important;top:0!important;z-index:300!important;
  height:92px!important;min-height:92px!important;padding:0 18px!important;overflow:visible!important;
  background:#05090f!important;border:0!important;border-bottom:1px solid rgba(174,187,197,.35)!important;
  box-shadow:0 6px 18px rgba(0,0,0,.45)!important;backdrop-filter:none!important}
/* stadium lights strip from the approved dashboard art, behind the bar */
body.pool-authorized .topbar .unified-header-bg{
  position:absolute!important;inset:0!important;width:100%!important;height:100%!important;z-index:0!important;
  object-fit:cover!important;object-position:center 0!important;pointer-events:none!important;filter:brightness(.8)}
body.pool-authorized .topbar>*:not(.unified-header-bg){position:relative;z-index:1}
body.pool-authorized .topbar .secondary-gotw{display:none!important}

/* logo */
body.pool-authorized .topbar .brand{
  flex:0 0 auto!important;width:auto!important;height:84px!important;font-size:0!important;
  background:none!important;display:flex!important;align-items:center!important}
body.pool-authorized .topbar .brand img{height:84px;width:auto;filter:drop-shadow(0 3px 6px rgba(0,0,0,.8))}

/* ---------- menu bar: dark metal bar, silver edge, thin dividers, red active ---------- */
body.pool-authorized .topbar .nav{
  flex:0 0 auto!important;display:flex!important;gap:0!important;justify-content:center!important;align-items:stretch!important;
  position:absolute!important;left:50%!important;top:10px!important;transform:translateX(-50%)!important;
  height:38px!important;width:auto!important;overflow:visible!important;padding:0!important;
  background:linear-gradient(180deg,#26313b 0%,#0a1016 55%,#161f27 100%)!important;
  border:1px solid #8a97a3!important;border-radius:3px!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.18),0 3px 10px rgba(0,0,0,.6)!important}
body.pool-authorized .topbar .nav>button,
body.pool-authorized .topbar .nav-menu>.nav-menu-trigger{
  height:100%!important;margin:0!important;padding:0 22px!important;
  background:transparent!important;border:0!important;border-right:1px solid rgba(255,255,255,.16)!important;border-radius:0!important;
  color:#eef3f6!important;font:800 13px/1 'Barlow Semi Condensed','Arial Narrow','Barlow Semi Condensed','Arial Narrow',Arial,sans-serif!important;letter-spacing:.06em!important;
  text-transform:uppercase!important;white-space:nowrap!important;cursor:pointer!important;box-shadow:none!important}
body.pool-authorized .topbar .nav>:last-child,
body.pool-authorized .topbar .nav>:last-child>.nav-menu-trigger{border-right:0!important}
body.pool-authorized .topbar .nav-menu{display:flex!important;align-items:stretch!important;height:100%!important}
body.pool-authorized .topbar .nav>button.active,
body.pool-authorized .topbar .nav>button:hover,
body.pool-authorized .topbar .nav-menu>.nav-menu-trigger:hover,
body.pool-authorized .topbar .nav-menu.open>.nav-menu-trigger{
  background:linear-gradient(180deg,#d01a20 0%,#8e0a0f 60%,#6d070b 100%)!important;color:#fff!important}
body.pool-authorized .topbar .nav-dropdown{top:100%!important;border-color:#8a97a3!important;background:#081522!important}

/* account / login button */
body.pool-authorized .topbar .account{margin-left:auto!important;flex:0 0 auto!important}

/* ---------- HOME: same menu floating over the dashboard art (the art is the background) ---------- */
body.pool-authorized.home-mode:not(.login-mode) .topbar{
  position:fixed!important;left:0!important;right:0!important;top:0!important;
  background:transparent!important;border:0!important;box-shadow:none!important;pointer-events:none!important}
body.pool-authorized.home-mode .topbar .unified-header-bg,
body.pool-authorized.home-mode .topbar .brand,
body.pool-authorized.home-mode .topbar .account{display:none!important}
body.pool-authorized.home-mode .topbar .nav{pointer-events:auto!important}
/* retire the old picture-menu + its invisible click zones (the real menu above replaces them) */
body.pool-authorized.home-mode #hwMenu,
body.pool-authorized.home-mode .master-nav-home,body.pool-authorized.home-mode .master-nav-picks,
body.pool-authorized.home-mode .master-nav-standings,body.pool-authorized.home-mode .master-nav-analysis,
body.pool-authorized.home-mode .master-nav-rules,body.pool-authorized.home-mode .master-nav-chat,
body.pool-authorized.home-mode #homeCommishNav{display:none!important}

/* ---------- PHONES ---------- */
@media(max-width:850px){
  body.pool-authorized:not(.login-mode) .topbar{height:auto!important;min-height:0!important;flex-wrap:wrap!important;padding:6px 10px 8px!important;row-gap:6px!important}
  body.pool-authorized .topbar .brand,body.pool-authorized .topbar .brand img{height:52px!important}
  body.pool-authorized .topbar .nav{position:relative!important;left:auto!important;top:auto!important;transform:none!important;
    order:3!important;width:100%!important;height:36px!important;overflow-x:auto!important;overflow-y:visible!important;justify-content:flex-start!important}
  body.pool-authorized .topbar .nav>button,body.pool-authorized .topbar .nav-menu>.nav-menu-trigger{padding:0 13px!important;font-size:12px!important}
  body.pool-authorized.home-mode:not(.login-mode) .topbar{position:relative!important;pointer-events:auto!important;background:#05090f!important}
  body.pool-authorized.home-mode .topbar .brand,body.pool-authorized.home-mode .topbar .account{display:flex!important}
  body.pool-authorized .topbar .unified-header-bg{display:none!important}
  body.pool-authorized.home-mode .master-hotspot:not(.master-account-hotspot){display:none!important}
}

/* PICKS: remove the radio dots beside VS (the selected team already highlights + shows YOUR PICK) */
#pickGames .pick-radio{display:none!important}
/* PICKS: slimmer center block with VS centered in it */
#pickGames .pick-row{grid-template-columns:minmax(0,1fr) 72px minmax(0,1fr)!important}
#pickGames .pick-center{display:flex!important;align-items:center!important;justify-content:center!important;padding:0!important}
#pickGames .pick-vs{font-size:14px!important;letter-spacing:.06em}
@media(max-width:850px){#pickGames .pick-row{grid-template-columns:1fr 44px 1fr!important}#pickGames .pick-vs{font-size:12px!important}}
/* PICKS: team lettering centered within each side block (logo stays at the outer edge) */
#pickGames .pick-side>div{flex:1 1 auto;text-align:center!important}
#pickGames .pick-side .your-pick-badge{margin-left:auto;margin-right:auto}

/* Schedule page: hide SYNC NFL DATA (the site already syncs NFL data automatically in the background) */
#syncSchedule{display:none!important}

/* Commish → Pool Money: payout plan table */
.pool-payout-plan{margin-top:16px;padding:14px 16px;border:1px solid rgba(231,189,88,.45);border-radius:10px;background:rgba(8,18,32,.72)}
.pool-payout-plan h3{margin:0 0 10px;font:400 20px/1 Anton,Impact,sans-serif;letter-spacing:.06em;color:#f3d77a}
.pool-payout-plan table{width:100%;border-collapse:collapse;font-size:15px}
.pool-payout-plan th{font-size:12px;letter-spacing:.08em;color:#9fb0c0;text-align:right;padding:6px 8px}
.pool-payout-plan td{padding:8px;border-top:1px solid rgba(255,255,255,.08);text-align:right;white-space:nowrap}
.pool-payout-plan td:first-child,.pool-payout-plan th:first-child{text-align:left;white-space:normal}
.pool-payout-plan tr.sum td{background:rgba(231,189,88,.08);color:#fff}
.pool-payout-plan .short{color:#ff7b7b}
.pool-payout-plan p{margin:10px 0 0;font-size:13px;color:#b8c6d3}
@media(max-width:600px){.pool-payout-plan table{font-size:13px}.pool-payout-plan td,.pool-payout-plan th{padding:6px 4px}}
.pool-payout-plan+.pool-payout-plan{margin-top:14px}
.payout-ask{display:flex;align-items:center;justify-content:space-between;gap:12px;margin:0 0 10px;padding:10px 12px;border:1px solid #c9a44a;border-radius:8px;background:rgba(201,164,74,.14);color:#fff}
.payout-ask .btn{flex:0 0 auto}
@media(max-width:600px){.payout-ask{flex-direction:column;align-items:stretch;text-align:center}}

.commish-who{font-size:12px;font-weight:600;color:#9fc3e6;margin-top:2px;overflow-wrap:anywhere}
