/* kejtlyn TENIS — štýly (ladí s farbami kejtlyn.sk: fialová + krémová, akcent tenisová zelená) */
* { box-sizing: border-box; margin: 0; padding: 0; }

:root {
    --fialova:  #3a2940;
    --fialova2: #5a3f63;
    --krem:     #faf6f0;
    --zelena:   #9acd32;
    --zelena2:  #7cb518;
    --biela:    #ffffff;
    --seda:     #8a7f90;
    --cervena:  #d9534f;
}

body {
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Arial, sans-serif;
    background: var(--krem);
    color: var(--fialova);
    min-height: 100vh;
}

.tn-wrap { max-width: 720px; margin: 0 auto; padding: 18px 14px 50px; }

/* ── Hlavička ── */
.tn-header { text-align: center; padding: 14px 0 6px; }
.tn-header .tn-logo {
    font-size: 26px; font-weight: 800; letter-spacing: 1px;
    color: var(--fialova);
}
.tn-header .tn-logo span { color: var(--zelena2); }
.tn-header .tn-sub { color: var(--seda); font-size: 13px; margin-top: 2px; }

/* ── Karty ── */
.tn-card {
    background: var(--biela);
    border-radius: 16px;
    box-shadow: 0 4px 18px rgba(58, 41, 64, .08);
    padding: 20px;
    margin: 16px 0;
}
.tn-card h2 { font-size: 17px; margin-bottom: 14px; }

/* ── Scoreboard ── */
.tn-meta { text-align: center; color: var(--seda); font-size: 13px; margin-bottom: 10px; }
.tn-live-badge {
    display: inline-block; background: var(--cervena); color: #fff;
    font-size: 11px; font-weight: 700; letter-spacing: 1px;
    padding: 3px 10px; border-radius: 20px; animation: tn-pulz 1.6s infinite;
}
.tn-koniec-badge {
    display: inline-block; background: var(--fialova); color: #fff;
    font-size: 11px; font-weight: 700; letter-spacing: 1px;
    padding: 3px 10px; border-radius: 20px;
}
@keyframes tn-pulz { 0%,100% { opacity: 1; } 50% { opacity: .55; } }

.tn-tabulka { width: 100%; border-collapse: collapse; }
.tn-tabulka th {
    font-size: 11px; color: var(--seda); font-weight: 600;
    text-transform: uppercase; letter-spacing: .5px;
    padding: 6px 4px; text-align: center;
}
.tn-tabulka th:first-child { text-align: left; }
.tn-tabulka td { padding: 10px 4px; text-align: center; font-size: 20px; }
.tn-tabulka td.tn-meno {
    text-align: left; font-size: 16px; font-weight: 700; max-width: 46%;
    overflow-wrap: anywhere;
}
.tn-tabulka td.tn-set  { color: var(--seda); font-weight: 600; }
.tn-tabulka td.tn-set.tn-vyhrany { color: var(--fialova); font-weight: 800; }
.tn-tabulka td.tn-set sup { font-size: 10px; }
.tn-tabulka td.tn-gemy { font-weight: 800; }
.tn-tabulka td.tn-body {
    font-weight: 800; color: #fff; background: var(--zelena2);
    border-radius: 10px; min-width: 52px;
}
.tn-tabulka tr.tn-vitaz td.tn-meno::after { content: " 🏆"; }
.tn-tiebreak-info { text-align: center; color: var(--cervena); font-size: 12px; font-weight: 700; margin-top: 8px; }

/* ── Admin tlačidlá bodovania ── */
.tn-bod-btny { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; margin-top: 16px; }
.tn-bod-btn {
    padding: 26px 10px; font-size: 17px; font-weight: 800;
    border: 0; border-radius: 14px; cursor: pointer;
    background: var(--zelena2); color: #fff;
    transition: transform .06s, background .15s;
    overflow-wrap: anywhere;
}
.tn-bod-btn:active { transform: scale(.96); }
.tn-bod-btn.tn-b { background: var(--fialova2); }
.tn-akcie { display: flex; gap: 10px; margin-top: 12px; flex-wrap: wrap; }
.tn-btn {
    flex: 1; padding: 12px; font-size: 14px; font-weight: 700;
    border: 2px solid var(--fialova); border-radius: 10px;
    background: #fff; color: var(--fialova); cursor: pointer; min-width: 130px;
}
.tn-btn.tn-danger { border-color: var(--cervena); color: var(--cervena); }
.tn-btn.tn-plna { background: var(--fialova); color: #fff; }

/* ── Formuláre ── */
.tn-form label { display: block; font-size: 13px; font-weight: 700; margin: 12px 0 4px; }
.tn-form input[type=text], .tn-form input[type=password], .tn-form select {
    width: 100%; padding: 12px; font-size: 16px;
    border: 1.5px solid #d9d2de; border-radius: 10px; background: #fff;
    color: var(--fialova);
}
.tn-form input:focus, .tn-form select:focus { outline: 2px solid var(--zelena2); border-color: transparent; }
.tn-form .tn-submit {
    margin-top: 16px; width: 100%; padding: 14px; font-size: 16px; font-weight: 800;
    background: var(--zelena2); color: #fff; border: 0; border-radius: 10px; cursor: pointer;
}
.tn-chyba { background: #fdecea; color: var(--cervena); border-radius: 10px; padding: 10px 14px; margin: 10px 0; font-size: 14px; }

/* ── Zoznamy zápasov / história ── */
.tn-zoznam { list-style: none; }
.tn-zoznam li {
    display: flex; justify-content: space-between; align-items: center; gap: 10px;
    padding: 12px 4px; border-bottom: 1px solid #eee7dd; flex-wrap: wrap;
}
.tn-zoznam li:last-child { border-bottom: 0; }
.tn-zoznam .tn-z-hraci { font-weight: 700; font-size: 15px; }
.tn-zoznam .tn-z-detail { color: var(--seda); font-size: 12px; margin-top: 2px; }
.tn-zoznam .tn-z-skore { font-weight: 800; font-size: 15px; white-space: nowrap; }
.tn-zoznam a.tn-z-odkaz {
    text-decoration: none; background: var(--fialova); color: #fff;
    padding: 8px 14px; border-radius: 8px; font-size: 13px; font-weight: 700;
}
.tn-prazdne { color: var(--seda); text-align: center; padding: 20px 0; font-size: 14px; }

/* ── Zdieľanie odkazu ── */
.tn-odkaz-box { display: flex; gap: 8px; margin-top: 8px; }
.tn-odkaz-box input {
    flex: 1; padding: 10px; font-size: 13px; border: 1.5px solid #d9d2de;
    border-radius: 8px; color: var(--seda); background: var(--krem);
}
.tn-odkaz-box button {
    padding: 10px 14px; border: 0; border-radius: 8px; background: var(--fialova);
    color: #fff; font-weight: 700; cursor: pointer; white-space: nowrap;
}

.tn-footer { text-align: center; color: var(--seda); font-size: 12px; margin-top: 30px; }
.tn-footer a { color: var(--fialova2); }

@media (max-width: 480px) {
    .tn-tabulka td { font-size: 17px; }
    .tn-tabulka td.tn-meno { font-size: 14px; }
    .tn-bod-btn { padding: 30px 8px; }
}

/* ── Mazanie zápasu (admin) ── */
.tn-zmazat {
    padding: 8px 10px; border: 2px solid var(--cervena); border-radius: 8px;
    background: #fff; color: var(--cervena); font-size: 14px; cursor: pointer; line-height: 1;
}
.tn-zmazat:hover { background: var(--cervena); color: #fff; }

/* ── Tlačidlo Admin na titulke ── */
.tn-admin-btn {
    position: absolute; top: 14px; right: 14px;
    text-decoration: none; background: var(--fialova); color: #fff;
    padding: 8px 16px; border-radius: 8px; font-size: 13px; font-weight: 700;
}
.tn-admin-btn:hover { background: var(--fialova2); }

/* ── Priebeh zápasu ── */
.tn-prb-set { margin-bottom: 16px; }
.tn-prb-set:last-child { margin-bottom: 0; }
.tn-prb-set + .tn-prb-set { border-top: 1px solid #eee7dd; padding-top: 12px; }
.tn-prb-nadpis { font-size: 12px; font-weight: 700; color: var(--seda); text-transform: uppercase; letter-spacing: .5px; margin-bottom: 5px; }
.tn-prb-gemy { display: flex; flex-wrap: wrap; gap: 5px; }
.tn-prb-gem {
    display: inline-block; padding: 4px 9px; background: var(--krem);
    border-radius: 7px; font-size: 13px; font-weight: 700; color: var(--fialova);
}
.tn-prb-gem.tn-prb-tb { background: var(--zelena2); color: #fff; }