/* Raspored nastupa — javni prikaz.
   Radi se na mobitelu, jer ga ljudi gledaju na terenu. */

.prigušeno { color: #5b636e; }

/* zaglavlje sa satom */
.rasp-zaglavlje {
  display: flex; align-items: center; justify-content: space-between;
  gap: 16px; flex-wrap: wrap;
}
.rasp-zaglavlje .sat { text-align: right; }
.rasp-zaglavlje #sat {
  font-size: 30px; font-weight: 650; line-height: 1;
  font-variant-numeric: tabular-nums; letter-spacing: -.01em;
}
.rasp-zaglavlje #stanje { font-size: 13px; margin-top: 3px; }

/* moja ekipa */
.moje-ekipe { margin-top: 12px; display: grid; gap: 8px; }
.moja {
  display: grid; grid-template-columns: 58px 1fr auto;
  align-items: center; gap: 12px;
  padding: 11px 14px; border-radius: 10px;
  border: 1px solid var(--rub); background: #fff;
}
.moja .k-vrijeme { font-size: 19px; font-weight: 650; font-variant-numeric: tabular-nums; }
.moja .k-stanje { font-size: 13px; font-weight: 600; white-space: nowrap; }
.moja.ceka     { border-left: 4px solid var(--rub); }
.moja.priprema { border-left: 4px solid var(--plava); background: #f5f8fd; }
.moja.priprema .k-stanje { color: var(--plava); }
.moja.sada     { border-left: 4px solid var(--crvena); background: #fdf3f3; }
.moja.sada .k-stanje { color: var(--crvena); }
.moja.kasni    { border-left: 4px solid #a5650a; }
.moja.kasni .k-stanje { color: #a5650a; }
.moja.gotovo   { opacity: .55; }

/* staze: sada i sljedeći */
/* Staza je jedinstvena unutar kategorije — pomladak i mladež rade
   istovremeno na svojim terenima, pa ih zna biti i četiri. */
.staze {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
  gap: 16px; margin-bottom: 18px;
}
.staza-kartica {
  background: var(--ploha); border: 1px solid var(--rub);
  border-radius: var(--radijus); padding: 16px;
}
.staza-naslov {
  font-size: 13px; font-weight: 650; text-transform: uppercase;
  letter-spacing: .05em; margin-bottom: 12px;
}
.staza-naslov .prigušeno { font-weight: 400; text-transform: none; letter-spacing: 0; }

.k-oznaka {
  font-size: 11px; text-transform: uppercase; letter-spacing: .07em;
  color: var(--tinta-blijeda); font-weight: 650; margin-bottom: 4px;
}
.k-vrijeme { font-size: 13px; color: var(--tinta-blijeda); font-variant-numeric: tabular-nums; }
.k-drustvo { font-size: 21px; font-weight: 650; line-height: 1.2; margin: 2px 0; }
.k-kat { font-size: 13px; color: var(--tinta-blijeda); }
.k-dodatak { font-size: 13px; font-weight: 600; color: var(--plava); margin-top: 4px; }

.sada { padding: 12px 0; }
.sada.aktivna .k-drustvo { color: var(--crvena); }
.sljedeci { padding: 12px 0 0; border-top: 1px solid var(--rub); }

.napredak { height: 4px; background: #eceef1; border-radius: 3px; margin-top: 10px; overflow: hidden; }
.napredak span { display: block; height: 100%; background: var(--crvena); transition: width 1s linear; }
.napredak.kasni span { background: #a5650a; }
.k-dodatak.kasni { color: #a5650a; }

/* tablica rasporeda */
.rasp-tablica .vrijeme { font-variant-numeric: tabular-nums; font-weight: 600; }
.rasp-tablica th:nth-child(1), .rasp-tablica td:nth-child(1) { width: 64px; }
.rasp-tablica th:nth-child(2), .rasp-tablica td:nth-child(2) { width: 64px; }
.rasp-tablica th:nth-child(4), .rasp-tablica td:nth-child(4) { width: 92px; }
/* naziv društva ima prednost pred stanjem */
.rasp-tablica td:nth-child(3) { min-width: 0; }
.kratki { display: none; }
.sr { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.rasp-tablica tr.proslo { opacity: .45; }
.rasp-tablica tr.tece   { background: #fdf3f3; }
.rasp-tablica tr.tece .stanje-celija { color: var(--crvena); font-weight: 650; font-size: 13px; white-space: nowrap; }
.rasp-tablica tr.kasni .stanje-celija { color: #a5650a; font-weight: 600; font-size: 13px; white-space: nowrap; }
.rasp-tablica tr.proslo .stanje-celija { font-size: 12px; white-space: nowrap; }
.rasp-tablica .stanje-celija { font-size: 13px; color: var(--tinta-blijeda); white-space: nowrap; }
.rasp-tablica tr.moj    { box-shadow: inset 3px 0 0 var(--plava); }
.rasp-tablica tr.moj td:first-child { font-weight: 700; }

.tocka {
  display: inline-block; width: 7px; height: 7px; border-radius: 50%;
  background: var(--crvena); margin-right: 6px; vertical-align: middle;
  animation: kuca 1.4s ease-in-out infinite;
}
@keyframes kuca { 0%,100% { opacity: 1; } 50% { opacity: .25; } }

.rasp-tablica tr.naredu .stanje-celija { color: var(--plava); font-weight: 600; }

@media (max-width: 700px) {
  /* Sve staze u jedan zaslon: dva stupca, sitniji slog. */
  .staze { grid-template-columns: 1fr 1fr; gap: 10px; }
  .staza-kartica { padding: 12px; }
  .staza-naslov { font-size: 11px; margin-bottom: 8px; }
  .staza-naslov .prigušeno { display: none; }
  .k-drustvo { font-size: 17px; }
  .k-oznaka { font-size: 10px; }
  .k-vrijeme, .k-kat, .k-dodatak { font-size: 12px; }
  .sada { padding: 8px 0; }
  .sljedeci { padding: 8px 0 0; }
  .zatim { font-size: 12px; }

  /* Tablica na mobitelu: fiksni raspored stupaca, inače sadržaj zaglavlja
     razvuče „Vrijeme" i „Staza" pa naziv društva ostane bez mjesta. */
  .rasp-tablica { table-layout: fixed; }
  .rasp-tablica th, .rasp-tablica td { padding: 8px 4px; }
  .rasp-tablica th { font-size: 10px; letter-spacing: 0; }
  .rasp-tablica .puni { display: none; }
  .rasp-tablica .kratki { display: inline; }
  .rasp-tablica th:nth-child(1), .rasp-tablica td:nth-child(1) { width: 52px; }
  .rasp-tablica th:nth-child(2), .rasp-tablica td:nth-child(2) { width: 44px; }
  /* na uskom zaslonu oznaka „odustala" ide kao običan tekst, bez okvira */
  .rasp-tablica .oznaka { border: 0; background: none; padding: 0; font-size: 12px; }
  .rasp-tablica th:nth-child(4), .rasp-tablica td:nth-child(4) { width: 76px; white-space: nowrap; }
  .rasp-tablica .stanje-celija { font-size: 12px; }
  .rasp-tablica tr.tece .stanje-celija { font-size: 12px; }
  .rasp-zaglavlje { align-items: flex-start; }
  .rasp-zaglavlje #sat { font-size: 26px; }
  .moja { grid-template-columns: 52px 1fr; }
  .moja .k-stanje { grid-column: 2; }
}

@media (prefers-reduced-motion: reduce) {
  .tocka { animation: none; }
  .napredak span { transition: none; }
}

/* ekipa koja je odustala */
.rasp-tablica tr.odustala td:nth-child(3) strong { text-decoration: line-through; }
.rasp-tablica tr.odustala { opacity: .5; }

/* Isto kao na terenu: hidden mora nadjačati display: grid. */
[hidden] { display: none !important; }

/* treći u nizu — samo natuknica, ne kartica */
.zatim {
  margin-top: 10px; padding-top: 10px; border-top: 1px dashed var(--rub);
  font-size: 13px; color: var(--tinta-blijeda);
}
.zatim:empty { display: none; }
.zatim .k-oznaka { display: inline; margin: 0; }