/* =======================================================================
   BetTipsApp — Modern Match Tables (Yön B: acik / premium-minimal)
   -----------------------------------------------------------------------
   Kapsananlar: x2 / cs / ou / btts / cn (corners) / yc (cards) / htft
   En SON yuklendigi icin sayfa ici eski tablo CSS'ini EZER.
   Ekle:  <link rel="stylesheet" href="/assets/table-modern.css">
======================================================================= */

:root{
  --tm-ink:#0b1220;
  --tm-soft:#475569;
  --tm-muted:#94a3b8;
  --tm-hair:rgba(15,23,42,.08);
  --tm-surface:#ffffff;
  --tm-radius:12px;
  --tm-ease:cubic-bezier(.22,.61,.36,1);
}

/* ---------- govde: satirlar arasi nefes, kart mantigi ---------- */
table.x2-fixtures, table.cs-fixtures, table.ou-fixtures, table.btts-fixtures,
table.cn-fixtures, table.yc-fixtures, table.htft-fixtures{
  width:100%;
  border-collapse:separate !important;
  border-spacing:0 9px !important;
  font-size:14px;
  background:transparent !important;
}

/* baslik: kucuk, soluk, harf araligi acik */
table.x2-fixtures thead th, table.cs-fixtures thead th, table.ou-fixtures thead th,
table.btts-fixtures thead th, table.cn-fixtures thead th, table.yc-fixtures thead th,
table.htft-fixtures thead th{
  background:transparent !important; border:none !important;
  color:var(--tm-muted) !important;
  font-size:10.5px !important; font-weight:500 !important;
  letter-spacing:1px !important; text-transform:uppercase !important;
  padding:2px 16px 6px !important; text-align:left !important;
}
table.x2-fixtures thead th:nth-child(n+3), table.cs-fixtures thead th:nth-child(n+3),
table.ou-fixtures thead th:nth-child(n+3), table.btts-fixtures thead th:nth-child(n+3),
table.cn-fixtures thead th:nth-child(n+3), table.yc-fixtures thead th:nth-child(n+3),
table.htft-fixtures thead th:nth-child(n+3){text-align:center !important;}

/* --- her mac satiri = beyaz kart, ince hairline --- */
table.x2-fixtures tbody tr:not([class*="league-row"]):not([class*="detail-row"]),
table.cs-fixtures tbody tr:not([class*="league-row"]):not([class*="detail-row"]),
table.ou-fixtures tbody tr:not([class*="league-row"]):not([class*="detail-row"]),
table.btts-fixtures tbody tr:not([class*="league-row"]):not([class*="detail-row"]),
table.cn-fixtures tbody tr:not([class*="league-row"]):not([class*="detail-row"]),
table.yc-fixtures tbody tr:not([class*="league-row"]):not([class*="detail-row"]),
table.htft-fixtures tbody tr:not([class*="league-row"]):not([class*="detail-row"]){
  background:var(--tm-surface);
  transition:border-color .2s var(--tm-ease), transform .2s var(--tm-ease);
}
table.x2-fixtures tbody tr:not([class*="league-row"]):not([class*="detail-row"]):hover,
table.cs-fixtures tbody tr:not([class*="league-row"]):not([class*="detail-row"]):hover,
table.ou-fixtures tbody tr:not([class*="league-row"]):not([class*="detail-row"]):hover,
table.btts-fixtures tbody tr:not([class*="league-row"]):not([class*="detail-row"]):hover,
table.cn-fixtures tbody tr:not([class*="league-row"]):not([class*="detail-row"]):hover,
table.yc-fixtures tbody tr:not([class*="league-row"]):not([class*="detail-row"]):hover,
table.htft-fixtures tbody tr:not([class*="league-row"]):not([class*="detail-row"]):hover{
  transform:translateY(-1px);
}

/* hucreler: ust/alt hairline, kose hucreler yuvarlak (kart efekti) */
table.x2-fixtures tbody td, table.cs-fixtures tbody td, table.ou-fixtures tbody td,
table.btts-fixtures tbody td, table.cn-fixtures tbody td, table.yc-fixtures tbody td,
table.htft-fixtures tbody td{
  background:transparent !important; border:none !important;
  border-top:.5px solid var(--tm-hair) !important;
  border-bottom:.5px solid var(--tm-hair) !important;
  padding:15px 16px !important; vertical-align:middle !important;
}
table.x2-fixtures tbody td:first-child, table.cs-fixtures tbody td:first-child,
table.ou-fixtures tbody td:first-child, table.btts-fixtures tbody td:first-child,
table.cn-fixtures tbody td:first-child, table.yc-fixtures tbody td:first-child,
table.htft-fixtures tbody td:first-child{
  border-left:.5px solid var(--tm-hair) !important;
  border-top-left-radius:var(--tm-radius) !important;
  border-bottom-left-radius:var(--tm-radius) !important;
}
table.x2-fixtures tbody td:last-child, table.cs-fixtures tbody td:last-child,
table.ou-fixtures tbody td:last-child, table.btts-fixtures tbody td:last-child,
table.cn-fixtures tbody td:last-child, table.yc-fixtures tbody td:last-child,
table.htft-fixtures tbody td:last-child{
  border-right:.5px solid var(--tm-hair) !important;
  border-top-right-radius:var(--tm-radius) !important;
  border-bottom-right-radius:var(--tm-radius) !important;
}

/* saat: kucuk, soluk, geride */
.x2-time, .cs-time, .ou-time, .btts-time, .cn-time, .yc-time, .htft-time{
  font-weight:500 !important; font-size:12px !important;
  color:var(--tm-muted) !important; white-space:nowrap;
  font-variant-numeric:tabular-nums;
}

/* takim isimleri: net, guclu ama abartisiz */
.x2-match, .cs-match, .ou-match, .btts-match, .match-teams{
  font-weight:500 !important; color:var(--tm-ink) !important;
  font-size:14.5px !important; letter-spacing:-.01em !important; line-height:1.35 !important;
}
.x2-vs, .cs-vs, .ou-vs, .btts-vs, .cn-vs, .yc-vs, .htft-vs{
  color:var(--tm-muted) !important; font-weight:400 !important;
  font-size:12px !important; padding:0 6px !important;
}
.team-name-inline{display:inline-flex; align-items:center; gap:6px;}

/* ---------- lig basligi: ince, soluk, zarif ---------- */
tr.x2-league-row td, tr.cs-league-row td, tr.ou-league-row td, tr.btts-league-row td,
tr.cn-league-row td, tr.yc-league-row td, tr.htft-league-row td{
  background:transparent !important; border:none !important;
  color:var(--tm-muted) !important;
  font-weight:500 !important; font-size:11px !important;
  letter-spacing:1px !important; text-transform:uppercase !important;
  padding:16px 4px 4px !important;
}
tr.x2-league-row td::before, tr.cs-league-row td::before, tr.ou-league-row td::before,
tr.btts-league-row td::before, tr.cn-league-row td::before, tr.yc-league-row td::before,
tr.htft-league-row td::before{display:none !important;}

/* =======================================================================
   PICK ETIKETLERI — Yon B: soft tint zemin + ayni aileden koyu yazi
   (gradient YOK, cirtlak YOK)
======================================================================= */
.x2-pill, .ou-pick, .btts-pick, .cn-pick, .yc-pick, .htft-pick, .cs-score-pill{
  display:inline-flex !important; align-items:center !important; justify-content:center !important;
  gap:5px !important; padding:7px 14px !important;
  border-radius:8px !important; font-weight:500 !important;
  font-size:14px !important; letter-spacing:.2px !important; line-height:1 !important;
  min-width:40px !important;
  box-shadow:none !important;
}

/* 1X2 */
.x2-pill{background:#f1f5f9 !important; color:#0b1220 !important; border:.5px solid #e2e8f0 !important;}
.x2-pill.is-home{background:#e6f1fb !important; color:#042c53 !important; border:.5px solid #b5d4f4 !important;}
.x2-pill.is-draw{background:#f1efe8 !important; color:#2c2c2a !important; border:.5px solid #d3d1c7 !important;}
.x2-pill.is-away{background:#e1f5ee !important; color:#04342c !important; border:.5px solid #9fe1cb !important;}

/* correct score — koyu, net, tabular */
.cs-score-pill{
  background:#0b1220 !important; color:#f4f6fb !important; border:.5px solid #0b1220 !important;
  font-variant-numeric:tabular-nums !important; letter-spacing:1px !important;
  font-size:14px !important; min-width:52px !important;
}

/* over-under / corners / cards */
.ou-pick, .cn-pick, .yc-pick{background:#f1efe8 !important; color:#2c2c2a !important; border:.5px solid #d3d1c7 !important;}
.ou-pick.is-over, .cn-pick.is-over, .yc-pick.is-over{background:#eeedfe !important; color:#26215c !important; border:.5px solid #cecbf6 !important;}
.ou-pick.is-under, .cn-pick.is-under, .yc-pick.is-under{background:#e1f5ee !important; color:#04342c !important; border:.5px solid #9fe1cb !important;}

/* btts */
.btts-pick{background:#f1f5f9 !important; color:#0b1220 !important; border:.5px solid #e2e8f0 !important;}
.btts-pick.is-yes{background:#e1f5ee !important; color:#04342c !important; border:.5px solid #9fe1cb !important;}
.btts-pick.is-no{background:#fbeaf0 !important; color:#4b1528 !important; border:.5px solid #f4c0d1 !important;}

/* htft */
.htft-pick{background:#eeedfe !important; color:#26215c !important; border:.5px solid #cecbf6 !important;}

/* pick ic parcalari (over/under ikon + etiket + cizgi) */
.ou-pick-icon, .cn-pick-icon, .yc-pick-icon{font-size:9px !important; opacity:.7;}
.ou-pick-label, .cn-pick-label, .yc-pick-label{font-size:11px !important; letter-spacing:.5px !important; font-weight:500 !important;}
.ou-pick-line, .cn-pick-line, .yc-pick-line{
  font-size:13px !important; font-weight:500 !important;
  padding-left:5px !important; margin-left:2px !important;
  border-left:.5px solid currentColor !important; opacity:.95;
  font-variant-numeric:tabular-nums !important;
}

/* accordion ok */
.expand-arrow{color:var(--tm-muted) !important; transition:transform .2s var(--tm-ease);}
tr.match-row[aria-expanded="true"] .expand-arrow{transform:rotate(180deg); color:var(--tm-ink) !important;}
tr.match-row{cursor:pointer;}

/* =======================================================================
   MOBIL — kompakt kart, kaydirmadan cok mac gorunur
======================================================================= */
@media(max-width:640px){
  table.x2-fixtures, table.x2-fixtures tbody, table.cs-fixtures, table.cs-fixtures tbody,
  table.ou-fixtures, table.ou-fixtures tbody, table.btts-fixtures, table.btts-fixtures tbody,
  table.cn-fixtures, table.cn-fixtures tbody, table.yc-fixtures, table.yc-fixtures tbody,
  table.htft-fixtures, table.htft-fixtures tbody{display:block !important; width:100% !important; border-spacing:0 !important;}

  table.x2-fixtures thead, table.cs-fixtures thead, table.ou-fixtures thead,
  table.btts-fixtures thead, table.cn-fixtures thead, table.yc-fixtures thead,
  table.htft-fixtures thead{display:none !important;}

  table.x2-fixtures tbody tr:not([class*="league-row"]):not([class*="detail-row"]),
  table.cs-fixtures tbody tr:not([class*="league-row"]):not([class*="detail-row"]),
  table.ou-fixtures tbody tr:not([class*="league-row"]):not([class*="detail-row"]),
  table.btts-fixtures tbody tr:not([class*="league-row"]):not([class*="detail-row"]),
  table.cn-fixtures tbody tr:not([class*="league-row"]):not([class*="detail-row"]),
  table.yc-fixtures tbody tr:not([class*="league-row"]):not([class*="detail-row"]),
  table.htft-fixtures tbody tr:not([class*="league-row"]):not([class*="detail-row"]){
    display:grid !important;
    grid-template-columns:1fr auto !important;
    grid-template-areas:"time pick" "match pick" !important;
    align-items:center !important; gap:3px 14px !important;
    padding:13px 15px !important; margin:0 0 9px !important;
    border-radius:var(--tm-radius) !important; border:.5px solid var(--tm-hair) !important;
  }
  table.x2-fixtures tbody td, table.cs-fixtures tbody td, table.ou-fixtures tbody td,
  table.btts-fixtures tbody td, table.cn-fixtures tbody td, table.yc-fixtures tbody td,
  table.htft-fixtures tbody td{display:block !important; padding:0 !important; border:none !important;}

  .x2-time, .cs-time, .ou-time, .btts-time, .cn-time, .yc-time, .htft-time{
    grid-area:time !important; font-size:11px !important; color:var(--tm-muted) !important;}

  .x2-match, .cs-match, .ou-match, .btts-match,
  table.cn-fixtures .match-teams, table.yc-fixtures .match-teams,
  table.htft-fixtures .match-teams, table.btts-fixtures .match-teams{
    grid-area:match !important; font-size:15px !important; font-weight:500 !important; line-height:1.3 !important;}

  .x2-cell, .ou-cell, .btts-cell, .cn-cell, .yc-cell, .htft-cell, .cs-score-cell{
    grid-area:pick !important; justify-self:end !important; align-self:center !important; text-align:right !important;}

  .btts-cell::before, .ou-cell::before, .cs-score-cell::before, .cn-cell::before,
  .yc-cell::before, .htft-cell::before, .x2-cell::before{content:"" !important; display:none !important;}

  .x2-pill, .ou-pick, .btts-pick, .cn-pick, .yc-pick, .htft-pick, .cs-score-pill{
    font-size:13.5px !important; padding:8px 14px !important;}

  table.x2-fixtures tbody tr.x2-league-row, table.cs-fixtures tbody tr.cs-league-row,
  table.ou-fixtures tbody tr.ou-league-row, table.btts-fixtures tbody tr.btts-league-row,
  table.cn-fixtures tbody tr.cn-league-row, table.yc-fixtures tbody tr.yc-league-row,
  table.htft-fixtures tbody tr.htft-league-row{
    display:block !important; margin:16px 0 6px !important; padding:0 !important;
    border:none !important; background:transparent !important;}
  tr.x2-league-row td, tr.cs-league-row td, tr.ou-league-row td, tr.btts-league-row td,
  tr.cn-league-row td, tr.yc-league-row td, tr.htft-league-row td{padding:0 2px !important; font-size:10.5px !important;}

  table.cn-fixtures tbody tr.match-detail-row, table.yc-fixtures tbody tr.match-detail-row{
    display:block !important; margin:-6px 0 9px !important;}
  table.cn-fixtures tbody tr.match-detail-row td, table.yc-fixtures tbody tr.match-detail-row td{display:block !important;}
}

@media(max-width:380px){
  .x2-match, .cs-match, .ou-match, .btts-match, .match-teams{font-size:14px !important;}
  .x2-pill, .ou-pick, .btts-pick, .cn-pick, .yc-pick, .htft-pick, .cs-score-pill{font-size:12.5px !important; padding:7px 11px !important;}
}

@media(prefers-reduced-motion:reduce){
  table.x2-fixtures tbody tr, table.cs-fixtures tbody tr, table.ou-fixtures tbody tr,
  table.btts-fixtures tbody tr, table.cn-fixtures tbody tr, table.yc-fixtures tbody tr,
  table.htft-fixtures tbody tr, .expand-arrow{transition:none !important;}
}