.flk1s-widget { border:1px solid #e5e7eb; padding:20px; border-radius:14px; background:#fff; box-shadow:0 2px 6px rgba(0,0,0,.06); max-width:1100px; margin:0 auto; }
.flk1s-row { margin-bottom:18px; display:flex; align-items:center; gap:12px; }
.flk1s-label { font-weight:600; color:#111827; }
.flk1s-select { font-size:18px; padding:10px 12px; min-width:280px; border-radius:10px; border:1px solid #d1d5db; }

.flk1s-header { margin:4px 0 10px; }
.flk1s-header h2 { margin:0; font-size:26px; letter-spacing:0.2px; }
.flk1s-subtitle { color:#6b7280; margin-top:6px; font-size:14px; }

.flk1s-results .flk1s-section { margin-top:22px; }
.flk1s-table { width:100%; border-collapse: separate; border-spacing:0; overflow:hidden; }
.flk1s-table th, .flk1s-table td { border-bottom:1px solid #eef2f7; padding:10px 12px; text-align:center; }
.flk1s-table thead th { background:#f9fafb; font-weight:700; font-size:14px; color:#374151; }
.flk1s-table tbody tr:nth-child(even){ background:#fcfcfd; }
.flk1s-team { text-align:left; }
.flk1s-points { font-weight:800; }
.flk1s-gd { color:#111827; }

/* Matches list */
.flk1s-matches { list-style:none; margin:8px 0 0; padding:0; }
.flk1s-matches li { padding:12px 0; border-bottom:1px dashed #e5e7eb; display:grid; grid-template-columns: 170px 1fr auto; gap:14px; align-items:center; }
.flk1s-date { font-size:0.95em; color:#111827; }
.flk1s-dow { color:#6b7280; margin-left:6px; font-size:0.9em; }
.flk1s-pair { display:flex; align-items:center; gap:10px; }
.flk1s-teamlogo { width:18px; height:18px; border-radius:50%; object-fit:cover; border:1px solid #e5e7eb; background:#fff; }
.flk1s-score { font-weight:700; margin-left:8px; }

/* Result badge */
.flk1s-badge { padding:4px 8px; border-radius:999px; font-weight:700; font-size:12px; border:1px solid transparent; }
.flk1s-badge-win { background:#ecfdf5; color:#065f46; border-color:#a7f3d0; }   /* zelena */
.flk1s-badge-draw { background:#f3f4f6; color:#374151; border-color:#e5e7eb; }  /* siva */
.flk1s-badge-loss { background:#fef2f2; color:#991b1b; border-color:#fecaca; }  /* crvena */

/* Forma kvadrati + legenda na dnu */
.flk1s-form { display:flex; gap:4px; justify-content:center; }
.flk1s-box { display:inline-block; width:12px; height:12px; border-radius:3px; margin:0 1px; border:1px solid #e5e7eb; }
.flk1s-green { background:#10b981; }
.flk1s-red { background:#ef4444; }
.flk1s-gray { background:#9ca3af; }
.flk1s-legend { display:flex; gap:16px; align-items:center; justify-content:flex-end; margin-top:10px; font-size:13px; color:#374151; }

/* Section titles */
.flk1s-results h3 { margin-bottom:10px; margin-top:0; font-size:18px; letter-spacing:0.3px; }

/* ---- NOVO: kartični pregled utakmica + grid + alatna traka ---- */
.flk1s-toolbar { display:flex; gap:8px; align-items:center; margin:8px 0 12px; }
.flk1s-chipbtn { border:1px solid #d1d5db; background:#fff; padding:6px 10px; border-radius:999px; font-size:13px; cursor:pointer; }
.flk1s-chipbtn.is-active { background:#111827; color:#fff; border-color:#111827; }

.flk1s-matches { list-style:none; margin:8px 0 0; padding:0; display:grid; grid-template-columns: 1fr; gap:10px; }
@media (min-width: 900px) { .flk1s-matches { grid-template-columns: 1fr 1fr; } }
.flk1s-matches li { border:1px solid #e5e7eb; border-left:4px solid #e5e7eb; border-radius:12px; padding:12px 14px; display:flex; align-items:center; gap:16px; background:#fafafa; }
.flk1s-matches li.is-played { border-left-color:#a7f3d0; background:#f9fffc; }
.flk1s-matches li.is-scheduled { border-left-color:#bfdbfe; background:#f8fbff; }

.flk1s-datebox { min-width:152px; }
.flk1s-date { font-weight:600; color:#111827; }
.flk1s-dowchip { margin-left:6px; font-size:12px; padding:2px 8px; border-radius:999px; background:#f3f4f6; color:#374151; }

.flk1s-pair { flex:1; display:flex; align-items:center; gap:10px; font-weight:600; color:#111827; }
.flk1s-teamlogo { width:18px; height:18px; border-radius:50%; object-fit:cover; border:1px solid #e5e7eb; background:#fff; }

.flk1s-badge { padding:6px 10px; border-radius:999px; font-weight:700; font-size:12px; border:1px solid transparent; }
.flk1s-badge-win { background:#ecfdf5; color:#065f46; border-color:#a7f3d0; }
.flk1s-badge-draw { background:#f3f4f6; color:#374151; border-color:#e5e7eb; }
.flk1s-badge-loss { background:#fef2f2; color:#991b1b; border-color:#fecaca; }

/* ---- NASLOVI / ISTICANJE ---- */
.flk1s-h3 {
  font-size:20px; font-weight:800; color:#111827;
  display:flex; align-items:center; gap:8px;
  border-bottom:1px solid #e5e7eb; padding-bottom:6px;
  margin-top:24px; margin-bottom:12px;
}
.flk1s-h3.flk1s-h3--upcoming::before { content:'📅'; }
.flk1s-h3.flk1s-h3--rounds::before { content:'🏟️'; }

.flk1s-h4-round {
  font-size:16px; font-weight:700; color:#374151;
  margin:16px 0 8px;
  border-left:3px solid #d1d5db; padding-left:8px;
}

/* ---- TABLICA: scroll omotač na mobitelu ---- */
.flk1s-table-wrap { width:100%; overflow-x:auto; }
.flk1s-table-wrap::-webkit-scrollbar { height:8px; }
.flk1s-table-wrap::-webkit-scrollbar-thumb { background:#e5e7eb; border-radius:8px; }

/* ---- MOBILNE PRILAGODBE ---- */
@media (max-width: 560px){
  .flk1s-widget { padding:14px; border-radius:12px; }
  .flk1s-label { font-size:14px; }
  .flk1s-select { font-size:16px; min-width:240px; }

  .flk1s-h3 { font-size:18px; padding-bottom:4px; margin-top:18px; }
  .flk1s-h4-round { font-size:15px; margin:12px 0 8px; }

  .flk1s-toolbar { gap:6px; flex-wrap:wrap; }
  .flk1s-chipbtn { padding:5px 9px; font-size:12px; }

  .flk1s-matches { grid-template-columns: 1fr; gap:8px; }
  .flk1s-matches li { padding:10px 12px; border-radius:12px; flex-direction: column; align-items:flex-start; gap:8px; }
  .flk1s-datebox { width:100%; display:flex; align-items:center; justify-content:space-between; }
  .flk1s-date { font-size:14px; }
  .flk1s-dowchip { font-size:11px; padding:2px 6px; }
  .flk1s-pair { width:100%; font-weight:700; gap:8px; }
  .flk1s-badge { margin-left:auto; font-size:12px; padding:5px 8px; }
}

/* ---- KOMPAKTNI MOD ZA LJESTVICU ---- */
.flk1s-compact .flk1s-table th,
.flk1s-compact .flk1s-table td { padding:6px 8px; font-size:13px; }
.flk1s-compact .flk1s-table thead th { font-size:13px; }
.flk1s-compact .flk1s-form .flk1s-box { width:10px; height:10px; }
.flk1s-compact .flk1s-legend { margin-top:6px; font-size:12px; }

/* Dodatno smanjenje na vrlo malim ekranima */
@media (max-width: 560px){
  .flk1s-table th, .flk1s-table td { padding:6px 8px; font-size:13px; }
  .flk1s-table thead th { font-size:13px; }
  .flk1s-form .flk1s-box { width:10px; height:10px; }
  .flk1s-legend { margin-top:6px; font-size:12px; }
}

/* Penalty chip next to team */
.flk1s-pen { display:inline-block; margin-left:6px; padding:2px 6px; border-radius:999px; background:#fef2f2; color:#991b1b; font-weight:700; font-size:11px; border:1px solid #fecaca; }

/* === Round label in 'Sljedećih 7 dana' === */
.flk1s-matches li .flk1s-roundline{font-size:.85em;line-height:1.2;color:#6b7280;margin-top:4px}

/* === Visual separation between 'Sljedećih 7 dana' and 'Raspored & rezultati po kolima' === */
.flk1s-section + .flk1s-section{margin-top:28px}
.flk1s-section h3.flk1s-h3{margin-bottom:12px}

/* === Stronger separation between upcoming and rounds sections === */
.flk1s-section--upcoming{padding-bottom:14px;border-bottom:1px solid #e5e7eb;margin-bottom:40px}
.flk1s-section--rounds{margin-top:10px}
/* Only show roundline inside upcoming list items */
.flk1s-section--upcoming .flk1s-matches li .flk1s-roundline{display:block}
.flk1s-section--rounds .flk1s-matches li .flk1s-roundline{display:none}

/* === v4 adjustments === */
/* Sakrij 'Kolo' unutar rasporeda po kolima */
.flk1s-section--rounds .flk1s-roundline { display:none !important; }

/* Jače odvajanje sekcija */
.flk1s-section--upcoming {
    padding-bottom:20px;
    margin-bottom:50px;
    border-bottom:2px solid #ccc;
}

/* === v6 spacing between sections === */
.flk1s-section--upcoming {
    padding-bottom: 25px;
    margin-bottom: 60px;
    border-bottom: 2px solid #ccc;
}

/* === v7 stronger spacing between upcoming and rounds === */
.flk1s-section--upcoming {
    padding-bottom: 25px;
    margin-bottom: 60px;
    border-bottom: 2px solid #ccc;
}

/* === v8 subtitle style === */
.flk1s-subtitle {
    font-size: 0.9em;
    color: #6b7280;
    font-style: italic;
    margin: 4px 0 12px 0;
}


/* Stats bar */
.flk1s-section--stats{margin-top:8px}
.flk1s-statsbar{display:flex;gap:10px;align-items:center;border:1px dashed #e5e7eb;border-radius:10px;padding:8px 12px;font-size:14px;color:#0f172a;background:#fafbfc}
.flk1s-statsbar .flk1s-dot{opacity:.6}
@media (prefers-color-scheme: dark){
  .flk1s-statsbar{border-color:#1f2a3a;background:#0f1523;color:#e5ecf5}
}

/* Progress bar */
.flk1s-progress{height:10px;border-radius:10px;background:#f1f5f9;margin-top:8px;overflow:hidden}
.flk1s-progress__fill{height:100%;background:#1d4ed8}
@media (prefers-color-scheme: dark){
  .flk1s-progress{background:#131a29}
  .flk1s-progress__fill{background:#60a5fa}
}


/* Records (two rows, two columns) */
.flk1s-records{margin-top:10px;border:1px solid #e5e7eb;border-radius:10px;padding:10px;background:#ffffff}
.flk1s-rec-row{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin:6px 0}
.flk1s-rec{display:flex;justify-content:space-between;gap:8px;padding:8px 10px;border:1px dashed #e5e7eb;border-radius:8px;background:#fafbfc}
.flk1s-rec-label{font-size:13px;color:#64748b}
.flk1s-rec-val{font-weight:600;color:#0f172a}
@media (max-width: 680px){
  .flk1s-rec-row{grid-template-columns:1fr}
}
@media (prefers-color-scheme: dark){
  .flk1s-records{background:#0e1523;border-color:#243244}
  .flk1s-rec{background:#0b1220;border-color:#243244}
  .flk1s-rec-label{color:#9aa4b2}
  .flk1s-rec-val{color:#e5ecf5}
}


/* ===== Mobile only (safe) — does NOT affect desktop ===== */
@media (max-width: 680px){
  /* Standings: horizontal scroll so ništa se ne sakriva */
  .flk1s-table-wrap{overflow-x:auto;-webkit-overflow-scrolling:touch}
  .flk1s-table{min-width:700px}

  /* Records: jedan stupac na uskim ekranima */
  .flk1s-rec-row{grid-template-columns:1fr}

  /* Nadolazeći: prelom u vertikalu radi čitljivosti */
  .flk1s-matches li{flex-direction:column;align-items:flex-start;gap:6px}
  .flk1s-matches .flk1s-time{min-width:auto}
  .flk1s-matches .flk1s-teams{justify-content:flex-start}

  /* Toolbar gumbi: neka se prelamaju */
  .flk1s-toolbar{display:flex;flex-wrap:wrap;gap:6px 8px}
  .flk1s-chipbtn{margin:0}
}


/* Mobile visibility fix: force stats + records visible on small screens */
@media (max-width: 680px){
  .flk1s-section--stats,
  .flk1s-statsbar,
  .flk1s-progress,
  .flk1s-records{display:block}
}
/* Trend column */
.flk1s-trend{white-space:nowrap;text-align:center;font-variant-numeric:tabular-nums}
@media (max-width:680px){
  .flk1s-table{min-width:760px}
}

/* === Averages row: show both averages in the same line === */
.flk1s-averages{display:flex;gap:2rem;flex-wrap:wrap;margin-top:8px}
.flk1s-avg{display:flex;gap:.4rem;align-items:baseline;font-size:14px}
.flk1s-stat-label{font-weight:600;color:#0f172a}
.flk1s-stat-val{font-weight:700}
@media (prefers-color-scheme: dark){
  .flk1s-stat-label{color:#e5ecf5}
}

/* One-line averages on desktop, wrap on small screens */
.flk1s-averages{display:flex;gap:2rem;flex-wrap:wrap;margin-top:8px}
@media (min-width: 768px){
  .flk1s-averages{flex-wrap:nowrap}
}
.flk1s-avg{display:flex;gap:.35rem;align-items:baseline;font-size:14px;white-space:nowrap}

/* tweak gaps for one-line fit */
.flk1s-averages{gap:1.5rem}
.flk1s-avg{font-size:13.5px}

/* Inline progress inside statsbar */
.flk1s-statsbar{display:flex;align-items:center;gap:12px;flex-wrap:wrap}
@media (min-width: 992px){ .flk1s-statsbar{flex-wrap:nowrap} }

.flk1s-progress__fill{display:block;height:100%;background:#1d4ed8}
.flk1s-dot{opacity:.6}
.flk1s-avg{white-space:nowrap;font-size:14px}
@media (max-width: 480px){  }
