:root {
  --bg:#0b0c10; --card:#12141a; --text:#e6e6e6; --muted:#9aa3af;
  --primary:#22c55e; --danger:#ef4444;
}

/* ===== Reset & base ===== */
*{ box-sizing:border-box; }
body{ margin:0; font-family:system-ui,-apple-system,"Segoe UI",Roboto,sans-serif; background:var(--bg); color:var(--text); }
a{ color:var(--primary); text-decoration:none; }
.container{ max-width:920px; margin:0 auto; padding:16px; }
.card{ background:var(--card); border:1px solid #1f2630; border-radius:14px; padding:20px; box-shadow:0 10px 30px rgba(0,0,0,.25); }
h1{ margin-top:0; }
.muted{ color:var(--muted); }
.success{ color:#86efac; }
.error{ color:#fca5a5; }
.truncate{ overflow:hidden; white-space:nowrap; text-overflow:ellipsis; }
.bold{ font-weight:900; }

.site-header,.site-footer{ background:#0d0f15; border-bottom:1px solid #1f2630; }
.site-footer{ border-top:1px solid #1f2630; border-bottom:0; margin-top:40px; }
.brand{ font-weight:700; }
.nav a{ margin-left:12px; }
.header-right{ display:flex; align-items:center; gap:12px; }
.profile-link{ text-decoration:none; font-weight:700; }
.logout-inline{ display:inline-block; }

.alert{ padding:12px; border-radius:10px; margin-bottom:12px; }
.alert.success{ background:rgba(34,197,94,.15); border:1px solid #22c55e; }
.alert.error{ background:rgba(239,68,68,.15); border:1px solid #ef4444; }

.form label{ display:block; margin-bottom:12px; }
.form input{ width:100%; padding:12px; border-radius:10px; border:1px solid #2a3340; background:#0f1218; color:#fff; }
.btn{ background:var(--primary); color:#08120c; padding:12px 16px; border:0; border-radius:10px; font-weight:600; cursor:pointer; }
.btn:hover{ filter:brightness(1.05); }
@media (min-width:768px){ .form{ max-width:480px; } }

/* ===== Header (sport select + kereső + logout) ===== */
.header-bar{ display:flex; align-items:center; justify-content:space-between; gap:12px; }
.header-left,.header-right{ display:flex; align-items:center; gap:12px; }

/* sport select */
.select-wrap{ position:relative; display:inline-block; }
.select-wrap select{
  -webkit-appearance:none; appearance:none;
  background:#10161f; border:1px solid #2a3340; color:#e5ecff;
  padding:8px 34px 8px 12px; border-radius:8px; font-size:.95rem; font-weight:600; line-height:1.1;
}
.select-wrap::after{ content:"▾"; position:absolute; right:10px; top:50%; transform:translateY(-50%); opacity:.7; pointer-events:none; }
.select-wrap select:focus{ outline:none; border-color:#2f9e58; box-shadow:0 0 0 3px rgba(47,158,88,.2); }

/* header kereső */
.header-search{ position:relative; }
.icon-btn{ background:#10161f; border:1px solid #2a3340; color:#e5ecff; border-radius:8px; padding:8px 10px; cursor:pointer; font-size:1rem; }
.icon-btn:hover{ filter:brightness(1.05); }
.search-box{
  position:absolute; left:0; top:calc(100% + 8px);
  background:#0c121a; border:1px solid #2a3340; border-radius:10px;
  padding:8px; width:min(520px,70vw); z-index:50; box-shadow:0 8px 24px rgba(0,0,0,.35);
}
.search-box input{
  width:100%; padding:10px 12px; border-radius:8px;
  background:#10161f; border:1px solid #2a3340; color:#e5ecff; font-size:.95rem;
}
.search-box input:focus{ outline:none; border-color:#2f9e58; box-shadow:0 0 0 3px rgba(47,158,88,.2); }
.search-results{ margin-top:8px; max-height:320px; overflow:auto; border-top:1px solid #1b2431; padding-top:6px; }
.search-results .row{ display:flex; gap:10px; align-items:flex-start; padding:8px; border-radius:8px; cursor:pointer; }
.search-results .row:hover{ background:#121a25; }
.search-results .type{ width:22px; text-align:center; opacity:.85; }
.search-results .text .label{ font-weight:700; }
.search-results .text .sub{ font-size:.85rem; opacity:.8; }
.search-results .type .flag,
.search-results .flag{ width:20px; height:14px; object-fit:cover; border-radius:2px; box-shadow:0 0 0 1px rgba(255,255,255,0.06); display:inline-block; vertical-align:middle; }
.search-results .logo{ width:20px; height:20px; object-fit:contain; display:inline-block; vertical-align:middle; }

/* játékos találat: [ország] [név] [csapat] */
.search-results .row.player{
  display:grid; grid-template-columns:26px 1fr 26px; align-items:center; gap:10px; padding:8px; border-radius:8px; cursor:pointer;
}
.search-results .row.player:hover{ background:#121a25; }
.search-results .row.player .col-left,.search-results .row.player .col-right{ display:flex; align-items:center; justify-content:center; }
.search-results .row.player .col-mid .label{ font-weight:700; }
@media (max-width:640px){ .header-left{ gap:8px; } .search-box{ z-index:1000; } }

/* ===== Player header / kpi ===== */
.player-header{ display:flex; flex-direction:column; gap:12px; }
.ph-left{ display:flex; align-items:center; gap:10px; }
.ph-name{ font-size:1.4rem; font-weight:800; }
.ph-team-logo img.logo,.ph-left .logo{ width:24px; height:24px; object-fit:contain; }
.flag{ width:20px; height:14px; object-fit:cover; border-radius:2px; box-shadow:0 0 0 1px rgba(255,255,255,0.06); }
.ph-cols{ display:grid; grid-template-columns:1fr 1fr; gap:14px; }
.ph-col .muted{ opacity:.8; }
.kpi-row{ display:grid; grid-template-columns:repeat(3,1fr); gap:12px; }
.kpi{ background:#0f141c; border:1px solid #1d2430; border-radius:12px; padding:10px 12px; }
.kpi-title{ font-size:.9rem; opacity:.85; }
.kpi-val{ font-size:1.4rem; font-weight:800; margin:4px 0; }
.kpi-sub{ font-size:.9rem; opacity:.8; }
@media (max-width:720px){ .ph-cols{ grid-template-columns:1fr; } }

/* ===== Team header ===== */
.team-head{ display:flex; align-items:center; justify-content:space-between; }
.team-title{ font-size:1.6rem; font-weight:800; }
.team-logo{ width:48px; height:48px; object-fit:contain; }
.sec-title{ margin-bottom:10px; }

/* ===== Match list (egységes) =====
   Grid: [dátum] [liga] [csapatok+eredmény] [badge] */
.match-list{ display:flex; flex-direction:column; gap:10px; }
.match-row{
  display:grid; grid-template-columns: 180px 220px 1fr auto;
  align-items:center; gap:12px; background:#0f141c; border:1px solid #1d2430;
  border-radius:12px; padding:10px 12px; text-decoration:none; color:inherit; min-height:48px;
}
.mr-time{ white-space:nowrap; opacity:.9; min-width:160px; }
.mr-league{ white-space:nowrap; opacity:.85; font-size:.9rem; }
.mr-badge{ justify-self:end; }

/* Csapat sor: egy vonalban, középen az eredmény */
.mr-teams{ display:inline-flex; align-items:center; gap:12px; min-width:0; }
.mr-teams .team{ display:inline-flex; align-items:center; gap:6px; }
.mr-teams .score{ display:inline-flex; gap:6px; font-weight:800; }
.mr-teams .dash{ opacity:.8; }
img.logo.team{
  height:18px;
  width:auto;
  object-fit:contain;
  display:block;           /* elég ennyi */
}


/* Kimenetel jelvény */
.badge{ padding:2px 8px; border-radius:999px; font-size:.8rem; font-weight:800; color:#fff; }
.badge-win{ background:#2f9e58; } .badge-draw{ background:#d28c00; } .badge-loss{ background:#b43b3b; }

/* Következő meccs – nincs eredmény, csak kötőjel */
.mr-teams .score.upcoming .hs,
.mr-teams .score.upcoming .as{ width:0.001px; }
.mr-teams .score.upcoming .dash{ opacity:.8; }

/* WIN HIGHLIGHT – sor osztály alapján */
.match-row.win-home .mr-teams .team.home .name,
.match-row.win-away .mr-teams .team.away .name{ font-weight:800 !important; }
.match-row.win-home .mr-teams .score .hs,
.match-row.win-away .mr-teams .score .as{ font-weight:900 !important; }
/* alap score súly (hogy látszódjon a különbség) */
.match-row .mr-teams .score{ font-weight:600; }

/* Tablet */
@media (max-width:900px){
  .match-row{ grid-template-columns:150px 160px 1fr auto; gap:10px; padding:8px 10px; }
  .mr-time{ min-width:140px; }
}
/* Mobil: két soros */
@media (max-width:600px){
  .match-row{
    grid-template-columns:1fr auto;
    grid-template-areas:
      "meta badge"
      "teams badge";
    row-gap:6px;
  }
  .mr-time,.mr-league{ display:inline-block; margin-right:8px; }
  .mr-time::after{ content:" | "; opacity:.5; margin-left:6px; }
  .mr-league{ opacity:.8; font-size:.85rem; }
  .mr-teams{ grid-area:teams; }
  .badge{ grid-area:badge; justify-self:end; align-self:center; }
}

/* ===== Match (meccs adatlap) ===== */
.match-head .mh-top{ display:flex; justify-content:space-between; align-items:center; margin-bottom:8px; }
.match-head .league-link{ opacity:.9; }
.match-head .when{ opacity:.8; font-size:.95rem; }
.match-head .mh-row{ display:grid; grid-template-columns:1fr auto 1fr; align-items:center; gap:12px; }
.match-head .side{ display:flex; align-items:center; gap:8px; }
.match-head .side.home{ justify-content:flex-start; }
.match-head .side.away{ justify-content:flex-end; }
.match-head .team-logo{ width:28px; height:28px; object-fit:contain; }
.match-head .team-name{ font-size:1.1rem; font-weight:700; }
.match-head .team-name.bold{ font-weight:900; }
.match-head .score{ font-size:1.6rem; font-weight:800; display:flex; align-items:center; gap:8px; }
.match-head .score .num.bold{ font-weight:900; }
.match-head .team-link{ display:flex; align-items:center; gap:8px; color:inherit; text-decoration:none; }
.match-head .team-link:hover .team-name{ text-decoration:underline; }

/* Események idővonal */
.half-sep{ position:relative; text-align:center; margin:12px 0; }
.half-sep::before{ content:""; position:absolute; left:0; right:0; top:50%; height:1px; background:#1d2430; }
.half-sep>span{ position:relative; padding:0 10px; background:#0b1118; font-size:.9rem; color:#cbd5e1; }

.timeline{ display:flex; flex-direction:column; gap:8px; }
.tl-row{ display:grid; grid-template-columns:1fr 1fr; align-items:center; }
.tl-row .col.who{ padding:6px 8px; background:#0f141c; border:1px solid #1d2430; border-radius:10px; }
.tl-row.home .col.who{ justify-self:start; }
.tl-row.away .col.who{ justify-self:end; }
.tl-row .col.spacer{ height:0; }
.tl-row .who.right{ text-align:right; }
.tl-row .time{ opacity:.9; margin-right:6px; }
.tl-row .icon{ margin-right:6px; }
.tl-row .assist{ opacity:.85; }
.timeline .aux{ margin-left:6px; opacity:.9; }

@media (max-width:600px){
  .match-head .mh-row{ grid-template-columns:1fr; gap:6px; }
  .match-head .side.away{ justify-content:flex-start; }
  .match-head .score{ justify-content:flex-start; }
}



/* ===== Winner highlight (brutál biztos) ===== */
.match-row .mr-teams .team .name { font-weight: 600; }          /* alap */
.match-row .mr-teams .score       { font-weight: 600; }          /* alap */

.match-row .mr-teams .team.is-winner .name {
  font-weight: 900 !important;                                   /* nyertes csapat NÉV */
}

.match-row .mr-teams .score .is-winner {
  font-weight: 900 !important;                                   /* nyertes saját gól */
}

/* Ha a fonton alig látszik a 600→900 váltás, adj egy kis vizuális lökést: */
.match-row .mr-teams .team.is-winner .name,
.match-row .mr-teams .score .is-winner {
  letter-spacing: .005em;
}


/* "További meccsek" – a 11. sortól rejtve, gombra nyílik */
.match-row.hidden { display: none !important; }


/* "További meccsek" gomb középre */
.loadmore-wrap{
  margin-top: 10px;
  display: flex;
  justify-content: center;   /* <-- ez hozza középre */
}

.loadmore-wrap .btn{
  display: inline-block;     /* biztos, ami biztos */
}
/* a "who" sor legyen flex, hogy a törlő gomb kimehessen a végére */
.tl-row .col.who,
.tl-row .col.who.right{
  display:flex;
  align-items:center;
  gap:8px;
}

/* a név rész nőjön, a gombot tolja ki a sor végére */
.tl-row .col.who .name,
.tl-row .col.who.right .name{
  flex:0 0 auto;
}

/* a törlő form a sor végére */
.evt-del-form{
  margin-left:auto;
  display:inline;
}

/* az X gomb */
.evt-x{
  border:0;
  background:transparent;
  cursor:pointer;
  font-size:18px;
  font-weight:700;
  line-height:1;
  padding:0 6px;
  color:#e11d48;
}
.evt-x:hover{ filter:brightness(.85); }

/* kis ikonok a meccs részletekben */
.mr-tags { display:flex; gap:6px; align-items:center; flex-wrap:wrap; }
.mr-tags .ico { font-size:14px; line-height:1; }


.subnav { display:flex; gap:10px; align-items:center; margin-top:8px; }
.subnav-link { text-decoration:none; }
.subnav-icon { text-decoration:none; font-size:18px; padding:4px 8px; border-radius:8px; }
.subnav-icon:hover { background: rgba(255,255,255,0.06); }