/* Minimal modern styling for PWA */
:root{--bg:#0b1020;--panel:#121735;--card:#172043;--text:#e6eeff;--muted:#9fb0d6;--accent:#7cc4ff;--good:#3ed598;--bad:#ff6b6b;--radius:16px;--gap:16px}
*{box-sizing:border-box}html,body{height:100%}body{margin:0;background:radial-gradient(1200px 600px at 20% -10%,#1a255a 0%,rgba(26,37,90,0) 60%),var(--bg);color:var(--text);font:16px/1.5 Inter,system-ui,Segoe UI,Roboto,Arial,sans-serif}
.site-head{max-width:1100px;margin:24px auto 8px;padding:0 16px}
.title-row{display:flex;align-items:center;gap:12px;justify-content:space-between}
.title-row h1{margin:0;font-size:clamp(24px,4vw,34px)}
.title-actions{margin-left:auto;display:flex;gap:8px;align-items:center}
.sub{color:var(--muted);font-size:.95rem}
.site-foot{max-width:1100px;margin:24px auto 40px;padding:0 16px;color:var(--muted)}
.offline{margin-top:8px;background:#251a1a;color:#ffb3b3;border:1px solid #7a3a3a;padding:8px 12px;border-radius:10px}
.nav{margin-top:10px;display:flex;gap:8px;flex-wrap:wrap}
.tab{background:transparent;border:1px solid #2a3565;color:var(--text);border-radius:999px;padding:8px 12px;cursor:pointer}
.tab.current{background:var(--accent);color:#001b2e;border-color:transparent}
.panel{max-width:1100px;margin:16px auto;padding:0 16px}
.panel h2{margin:0 0 10px;font-size:clamp(18px,2.5vw,22px)}
.grid{display:grid;gap:var(--gap)}.form{grid-template-columns:repeat(2,minmax(240px,1fr))}
.two-cols{display:grid;grid-template-columns:1fr 1fr;gap:var(--gap)}@media (max-width:900px){.form,.two-cols{grid-template-columns:1fr}}
label{display:grid;gap:6px}label span{color:var(--muted);font-size:.9rem}
input{background:var(--card);color:var(--text);border:1px solid #2a3565;border-radius:10px;padding:10px 12px;outline:none}
input:focus{border-color:var(--accent);box-shadow:0 0 0 3px rgba(124,196,255,.15)}
.actions{display:flex;flex-wrap:wrap;gap:10px;align-items:center}
button{background:var(--accent);color:#001b2e;border:0;border-radius:999px;padding:10px 16px;font-weight:700;cursor:pointer}
button.ghost{background:transparent;color:#fff;border:1px solid #2a3565}
.status{color:var(--muted)}
.card{background:var(--panel);border:1px solid #2a3565;border-radius:var(--radius);padding:12px}
.stats{grid-template-columns:repeat(3,minmax(200px,1fr))}
@media (max-width:900px){.stats{grid-template-columns:repeat(2,1fr)}}
/* Mobile single column for summary stats */
@media (max-width:640px){ .stats{grid-template-columns:1fr} }
.stat .k{color:var(--muted);font-size:.9rem}.stat .v{font-size:1.4rem;font-weight:800;margin-top:4px}
.table-wrap{overflow:auto}.table{width:100%;border-collapse:collapse}
.table th,.table td{padding:10px 12px;border-bottom:1px solid #2a3565;text-align:left;white-space:nowrap}
.table th{color:var(--muted);font-weight:600}.bad{color:var(--bad);font-weight:700}.good{color:var(--good);font-weight:700}.muted{color:var(--muted)}

dialog{border:1px solid #2a3565;border-radius:16px;background:var(--panel);color:var(--text);padding:14px 16px;max-width:520px}
dialog::backdrop{background:rgba(0,0,0,.45)}

/* Guard by tab */
body[data-tab="settings"] [data-tabpanel]:not([data-tabpanel="settings"]),
body[data-tab="summary"]  [data-tabpanel]:not([data-tabpanel="summary"]),
body[data-tab="season"]   [data-tabpanel]:not([data-tabpanel="season"]) { display: none !important; }

.inline-select{margin-left:10px;background:var(--card);color:var(--text);border:1px solid #2a3565;border-radius:10px;padding:6px 10px}
.inline-select:focus{border-color:var(--accent);outline:none;box-shadow:0 0 0 3px rgba(124,196,255,.15)}

/* Loading overlay */
[hidden]{display:none!important}
.loading-overlay{position:fixed;left:0;top:0;right:0;bottom:0;background:rgba(7,10,20,.55);display:flex;align-items:center;justify-content:center;z-index:9999;backdrop-filter:saturate(120%) blur(1px)}
.spinner{width:56px;height:56px;border-radius:50%;border:4px solid rgba(255,255,255,.25);border-top-color:var(--accent);animation:spin 1s linear infinite}
@keyframes spin{to{transform:rotate(360deg)}}


/* Team cell with manager on next line */
.team-cell .team-name{font-weight:800}
.team-cell .manager-name{color:var(--muted);font-size:.85rem;margin-top:2px}


.inline-checkbox{margin-left:10px; display:inline-flex; gap:6px; align-items:center; font-size:.95rem; color:var(--muted)}
.inline-checkbox input{width:16px; height:16px}


/* Season table optional column visibility */
.table.optional-hide thead th.optional-col,
.table.optional-hide tbody td.optional-col { display: none; }
.table.optional-hide.show-all thead th.optional-col,
.table.optional-hide.show-all tbody td.optional-col { display: table-cell; }

/* Sort arrows for Season table headers */
.table thead th.sortable{position:relative;padding-right:18px;cursor:pointer}
.table thead th.sortable::after{content:'\2195';position:absolute;right:6px;top:50%;transform:translateY(-50%);opacity:.45;font-size:11px}
.table thead th.sortable[data-sortdir="asc"]::after{content:'\25B2';opacity:.95}
.table thead th.sortable[data-sortdir="desc"]::after{content:'\25BC';opacity:.95}

/* Hide season chips/consistency block without altering JS structure */
#seasonChipsPanel{display:none !important}

/* Empty-state styling for HOTW/VOTW */
.hotv-empty{ font-size:10pt; opacity:0.8; }

/* Hide Avg GW points card in Summary */
.card.stat:has(#statAvg){ display:none !important; }


/* Honours Admin UI */
.listbox{ border:1px solid var(--line,#ddd); border-radius:8px; padding:.5rem; max-height:320px; overflow:auto; }
.hon-item{ display:flex; align-items:center; justify-content:space-between; gap:.5rem; padding:.35rem .25rem; border-bottom:1px dashed rgba(0,0,0,.06); }
.hon-item:last-child{ border-bottom:none; }
.hon-item button{ font-size:.85rem; }
.hon-name{ cursor:pointer; }
.hon-selected .hon-name{ font-weight:600; }
.hon-reason{ flex:1; margin-left:.5rem; min-width:140px; }
.muted{ opacity:.75; font-size:.9rem; }
.btn{ padding:.45rem .8rem; border:1px solid var(--line,#ccc); border-radius:8px; background:#f7f7f7; }
.btn.primary{ background:#1e90ff; color:#fff; border-color:#1e90ff; }
.flex-row{ display:flex; gap:.5rem; }
.grid.form.two-cols{ display:grid; grid-template-columns: 1fr auto; gap:.75rem; }
.grid.two-cols{ display:grid; grid-template-columns: 1fr 1fr; gap:1rem; }
@media (max-width:700px){
  .grid.two-cols{ grid-template-columns: 1fr; }
}


/* Honours table sortable headers */
#honoursTally thead th{ position:relative; cursor:pointer; padding-right:1.2em; user-select:none; }
#honoursTally thead th::after{ content:'⇅'; position:absolute; right:.35em; top:50%; transform:translateY(-50%); opacity:.45; font-size:.9em; }
#honoursTally thead th[data-sortdir='asc']::after{ content:'▲'; opacity:.85; }
#honoursTally thead th[data-sortdir='desc']::after{ content:'▼'; opacity:.85; }
#honoursTally thead th:hover::after{ opacity:.95; }

/* soft notify bar placeholder (inline styles set in JS) */
#softNotifyBar{pointer-events:none}
