/* ==========================================================================
   SANC.HU – közös stílusok
   Színek, betűk egy helyen (:root). Sötét módban automatikusan átvált.
   ========================================================================== */

:root {
    --grafit: #1f2328; /* fejléc, fő szövegszín */
    --fejlec-hatter: #2C3A7D; /* VILÁGOS mód: fejléc + lenyíló almenü háttere */
    --szoveg: #1f2328;
    --szoveg-2: #4b535c;
    --halvany: #878787;
    --papir: #F1F1F1; /* oldal háttere */
    --lap: #ffffff; /* dobozok */
    --vonal: #dfe3e7;
    --sanc: #ff830c; /* a SANC narancs: helyek, fő gombok */
    --sanc-sotet: #b55300; /* narancs szöveg fehér alapon (olvasható kontraszt) */
    --sanc-halvany: #fff1e4;
    --betelt: #c4372c;
    --szabad: #2f7d4f;
    --betu: "Barlow", system-ui, -apple-system, "Segoe UI", sans-serif;
    --kijelzo: "Bebas Neue", "Barlow", sans-serif;
    --kiemelt-hatter: var(--grafit); /* kiválasztott nap, téma stb. */
    --kiemelt-szoveg: #fff;
    --szelesseg: 1120px;
    --kerekites: 10px;
    color-scheme: light;
}

/* Sötét mód: vagy a felhasználó választotta (data-theme="dark"), vagy nincs választás és a rendszer sötét.
   A két blokk szándékosan ugyanaz, CSS-ben ezt nem lehet egy szabályba vonni. */
    :root[data-theme="dark"] {
        --fejlec-hatter: #1f2328; /* sötét mód: fejléc háttere */
        --szoveg: #B0B0B0;
        --szoveg-2: #b9c0c8;
        --halvany: #8d96a0;
        --papir: #2E3236;
        --lap: #212529;
        --vonal: #2f353b;
        --sanc: #ff9233;
        --sanc-sotet: #ffa555;
        --sanc-halvany: #3a2614;
        --betelt: #ff6b5e;
        --szabad: #5cc58a;
        --kiemelt-hatter: var(--sanc);
        --kiemelt-szoveg: #1f1205;
        color-scheme: dark;
    }

@media (prefers-color-scheme: dark) {
    :root:not([data-theme]) {
        --fejlec-hatter: #1f2328; /* sötét mód (rendszer szerint): fejléc háttere */
        --szoveg: #eceff2;
        --szoveg-2: #b9c0c8;
        --halvany: #8d96a0;
        --papir: #14171a;
        --lap: #1d2125;
        --vonal: #2f353b;
        --sanc: #ff9233;
        --sanc-sotet: #ffa555;
        --sanc-halvany: #3a2614;
        --betelt: #ff6b5e;
        --szabad: #5cc58a;
        --kiemelt-hatter: var(--sanc);
        --kiemelt-szoveg: #1f1205;
        color-scheme: dark;
    }
}

*, *::before, *::after { box-sizing: border-box; }

html { -webkit-text-size-adjust: 100%; }

body {
    margin: 0;
    font-family: var(--betu);
    font-size: 1.0625rem;
    line-height: 1.5;
    color: var(--szoveg);
    background: var(--papir);
    min-height: 100vh;
    display: flex;
    flex-direction: column;
}

a { color: var(--sanc-sotet); }
a:hover { text-decoration-thickness: 2px; }

:focus-visible {
    outline: 3px solid var(--sanc);
    outline-offset: 2px;
    border-radius: 4px;
}

img { max-width: 100%; display: block; }

.sr {
    position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px;
    overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0;
}

.ugras {
    position: absolute; left: 1rem; top: -3rem; z-index: 50;
    background: var(--lap); color: var(--szoveg); padding: .5rem 1rem; border-radius: 6px;
}
.ugras:focus { top: .5rem; }

/* ---------- Fejléc ---------- */

.fejlec {
    background: var(--fejlec-hatter);
    color: #fff;
    border-bottom: 3px solid var(--sanc);
    position: sticky;
    top: 0;
    z-index: 20;
}

.fejlec-belso {
    max-width: var(--szelesseg);
    margin: 0 auto;
    padding: 0 16px;
    min-height: 96px;
    display: flex;
    align-items: center;
    gap: 1.5rem;
}

.logo {
    font-family: var(--kijelzo);
    font-size: 3.1rem;
    line-height: 1;
    letter-spacing: .02em;
    color: #fff;
    text-decoration: none;
    padding-top: 4px;
}
.logo span { color: var(--sanc); font-size: .55em; margin-left: 0px; }
.logo { display: flex; align-items: center; }
/* labda a logó előtt: a fejléc alsó szélén picit túllóg (a transform nem tolja el a fejléc magasságát) */
.logo-labda {
    width: 88px; height: 88px;            /* labda mérete */
    margin-right: .9rem;                  /* távolság a SANC felirattól */
    transform: translateY(16px);          /* ennyivel lóg lejjebb: nagyobb szám = jobban kilóg alul */
    filter: drop-shadow(0 4px 6px rgba(0, 0, 0, .35));
    position: relative; z-index: 1;       /* a narancs csík fölött legyen */
    flex-shrink: 0;
}
@media (max-width: 900px) {
    .logo-labda { width: 60px; height: 60px; transform: translateY(2px); }
}

.fomenu {
    flex: 1;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
}

.fomenu ul {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    gap: .25rem;
}

.fomenu ul a {
    display: block;
    white-space: nowrap;
    color: #d6dbe0;
    text-decoration: none;
    font-weight: 500;
    padding: .55rem .7rem;
    border-radius: 6px;
}
.fomenu ul a:hover { color: #fff; background: rgba(255, 255, 255, .08); }
.fomenu ul a.aktiv { color: #fff; box-shadow: inset 0 -3px 0 var(--sanc); border-radius: 6px 6px 0 0; }

/* --- Edzések almenü (napok) ---
   Asztalon: rávitt egérre / billentyűs fókuszra legördül a menüpont alól. */
.fomenu li.almenus { position: relative; }
.fomenu ul.almenu {
    position: absolute; top: 100%; left: 0; z-index: 30;
    display: none; flex-direction: column; gap: 0;
    min-width: 11rem; padding: .35rem;
    background: var(--fejlec-hatter);
    border: 1px solid #666666; border-top: 3px solid var(--sanc);
    border-radius: 0 0 8px 8px;
    box-shadow: 0 10px 24px rgb(0 0 0 / .25);
}
.fomenu li.almenus:hover > ul.almenu,
.fomenu li.almenus:focus-within > ul.almenu { display: flex; }
.fomenu ul.almenu a { padding: .45rem .7rem; font-size: .98rem; }
.fomenu ul.almenu a.aktiv-nap { color: var(--sanc); }   /* a kiválasztott almenüpont: csak a színe narancs */
/* elválasztó vonal az almenüben (Edzéseim | Mind | napok) */
.fomenu ul.almenu li.almenu-elvalaszto { height: 1px; margin: .3rem .5rem; background: #4a525b; }

/* a még régi oldalra mutató menüpontok egy apró jelet kapnak */
.fomenu ul a.regi::after {
    content: "";
    display: inline-block;
    width: .4em; height: .4em;
    margin-left: .35em;
    vertical-align: .25em;
    border-radius: 50%;
    border: 1.5px solid currentColor;
    opacity: .6;
}

.fiok { display: flex; align-items: center; gap: .75rem; }

.fiok-nev {
    display: flex; align-items: center; gap: .5rem;
    color: #fff; text-decoration: none; font-weight: 500; white-space: nowrap;
}
/* szűkebb asztali képernyőn a név helyett csak a kép / monogram látszik */
@media (min-width: 901px) and (max-width: 1180px) {
    .fiok-nev span:not(.monogram) { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }
    .fomenu ul a { padding: .55rem .5rem; }
}

.fiok-nev img, .monogram {
    width: 70px;
    height: 70px;
    border-radius: 50%;
    object-fit: cover;
    border:1px solid var(--sanc);
    flex-shrink: 0; /* ne nyomódjon össze */
}

.monogram {
    font-size: 1.9rem; /* a nagy négyzethez arányos */
}

.monogram {
    display: inline-grid; place-items: center;
    background: #343a41; font-size: .8rem; font-weight: 700;
}

.kilep {
    font: inherit; font-size: .95rem;
    color: #d6dbe0; background: none;
    border: 1px solid #4a525b; border-radius: 6px;
    padding: .3rem .7rem; cursor: pointer;
}
.kilep:hover { color: #fff; border-color: #fff; }

.menu-gomb {
    display: none;
    margin-left: auto;
    background: none; border: 0; padding: 10px; cursor: pointer;
}
.menu-ikon, .menu-ikon::before, .menu-ikon::after {
    display: block; width: 24px; height: 2px; background: #fff; border-radius: 2px;
    transition: transform .2s ease;
}
.menu-ikon { position: relative; }
.menu-ikon::before, .menu-ikon::after { content: ""; position: absolute; left: 0; }
.menu-ikon::before { top: -7px; }
.menu-ikon::after { top: 7px; }
.menu-gomb[aria-expanded="true"] .menu-ikon { background: transparent; }
.menu-gomb[aria-expanded="true"] .menu-ikon::before { transform: translateY(7px) rotate(45deg); }
.menu-gomb[aria-expanded="true"] .menu-ikon::after { transform: translateY(-7px) rotate(-45deg); }

@media (max-width: 900px) {
    .js .menu-gomb { display: block; }
    .fejlec-belso { flex-wrap: wrap; gap: 0 1rem; }
    .fomenu {
        flex-basis: 100%;
        flex-direction: column;
        align-items: stretch;
        padding: .25rem 0 1rem;
        /* a fejléc ragad, ezért a hosszú menü a saját dobozában görgethető, így az alja (profil, kilépés) is elérhető */
        max-height: calc(100dvh - 110px);
        overflow-y: auto;
        overscroll-behavior: contain;
    }
    .js .fomenu:not(.nyitva) { display: none; }
    .fomenu ul { flex-direction: column; }
    .fomenu ul a { padding: .35rem .5rem; font-size: 1.05rem; line-height: 1.3; }   /* mobilmenü: sűrű sorok */
    .fomenu ul a.aktiv { box-shadow: inset 4px 0 0 var(--sanc); border-radius: 0; padding-left: 1rem; }
    /* mobilon az almenü mindig látszik, az Edzések alatt egy sorban, kis gombokként */
    .fomenu ul.almenu {
        position: static; display: flex; flex-direction: row; flex-wrap: wrap; gap: .35rem;
        min-width: 0; padding: .1rem 0 .4rem 1rem;
        background: none; border: 0; box-shadow: none;
    }
    .fomenu ul.almenu a {
        padding: .2rem .75rem; font-size: .92rem; min-height: 32px; display: grid; place-items: center;
        border: 1px solid #3a4148; border-radius: 999px;
    }
    .fomenu ul.almenu a.aktiv-nap { box-shadow: none; background: var(--sanc); border-color: var(--sanc); color: #1f1205; }
    .fomenu ul.almenu li.almenu-elvalaszto { width: 1px; height: auto; align-self: stretch; margin: .2rem .15rem; }   /* mobilon függőleges vonal */
    /* mobilon a profil és a kilépés a menü tetején, hogy görgetés nélkül is látsszon */
    .fiok { order: -1; border-bottom: 1px solid #3a4148; padding: .25rem 0 .6rem; margin-bottom: .35rem; gap: .6rem; }
    .fiok .fiok-nev { margin-right: auto; }   /* balra a profil, jobbra a téma és a kilépés */
    /* mobilon a témakapcsoló a fejlécben, a menü gomb előtt (a menübeli példány rejtve marad) */
    .fejlec-tema { order: 1; margin-left: auto; }
}

/* ---------- Oldal ---------- */

.oldal {
    flex: 1;
    width: 100%;
    max-width: var(--szelesseg);
    margin: 0 auto;
    padding: 1.75rem 16px 3rem;
}

.oldal-fej {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-end;
    justify-content: space-between;
    gap: .75rem 1.5rem;
    margin-bottom: 1.25rem;
}

h1 {
    font-family: var(--kijelzo);
    font-weight: 300;
    font-size: clamp(2.4rem, 6vw, 3.4rem);
    line-height: .95;
    letter-spacing: .01em;
    margin: 0;
 margin-top:5px;
}

h2 { font-size: 1.25rem; font-weight: 600; margin: 0 0 .75rem; }

.alcim { color: var(--szoveg-2); margin: .35rem 0 0; }

.lablec {
    width: 100%;
    margin: 0;
    padding: 1.5rem max(16px, calc((100% - var(--szelesseg)) / 2 + 16px)) 1rem; /* teljes szélességű sáv, a tartalom középen */
    background: color-mix(in srgb, var(--szoveg) 5%, var(--papir)); /* lábléc háttere: picit eltér a papírtól */

    display: flex;
    flex-direction: column;
    gap: .5rem;
    align-items: center;
    text-align: center;
    color: var(--halvany);
    font-size: .9rem;
    border-top: 1px solid var(--vonal);
}
.lablec a { color: inherit; }

/* ---------- Gombok, űrlapok ---------- */

.gomb {
    display: inline-flex; align-items: center; justify-content: center; gap: .4rem;
    font: inherit; font-weight: 600;
    min-height: 44px;
    padding: .5rem 1.1rem;
    border-radius: 8px;
    border: 2px solid var(--sanc);
    background: var(--sanc);
    color: #1f1205;
    text-decoration: none;
    cursor: pointer;
}
.gomb:hover { background: #ff9533; border-color: #ff9533; text-decoration: none; }
    .gomb.masodlagos {
        background: var(--h-eros);
        color:var(--h-eros-szoveg);
        border-color: var(--vonal);
    }
.gomb.masodlagos:hover { border-color: var(--szoveg-2); }

.mezo { display: flex; flex-direction: column; gap: .3rem; }
.mezo label, .mezo .cimke { font-weight: 600; font-size: .95rem; }

input[type="text"], input[type="email"], input[type="password"], input[type="search"],
input[type="tel"], input[type="url"], input:not([type]), select, textarea {
    font: inherit;
    width: 100%;
    min-height: 44px;
    padding: .5rem .75rem;
    color: var(--szoveg);
    background: var(--lap);
    border: 1px solid var(--vonal);
    border-radius: 8px;
}
textarea { min-height: 7rem; resize: vertical; line-height: 1.45; }
input:focus, select:focus, textarea:focus { border-color: var(--sanc); outline: none; box-shadow: 0 0 0 3px color-mix(in srgb, var(--sanc) 30%, transparent); }

.mezo-hiba { color: var(--betelt); font-size: .92rem; font-weight: 500; }
.mezo-hiba:empty { display: none; }
.input-validation-error { border-color: var(--betelt) !important; }

.pipa { display: flex; align-items: flex-start; gap: .55rem; font-size: .98rem; cursor: pointer; }
.pipa input { width: 1.15rem; height: 1.15rem; margin-top: .2rem; accent-color: var(--sanc); flex-shrink: 0; }

.uzenet-hiba {
    background: color-mix(in srgb, var(--betelt) 12%, var(--lap));
    border-left: 4px solid var(--betelt);
    padding: .75rem 1rem;
    border-radius: 6px;
}

/* ==========================================================================
   Belépés
   ========================================================================== */

.belepes {
    min-height: 100vh;
    display: grid;
    grid-template-columns: minmax(0, 1.25fr) minmax(360px, 1fr);
}

.belepes-kep {
    position: relative;
    background: var(--grafit) center / cover no-repeat;  
    color: #fff;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    padding: 2rem 2.5rem;
    isolation: isolate;
}
.belepes-kep::before {
    content: "";
    position: absolute; inset: 0; z-index: -1;
    background: linear-gradient(180deg, rgba(20, 23, 26, .55) 0%, rgba(20, 23, 26, .15) 40%, rgba(20, 23, 26, .85) 100%);
}

.belepes-logo {
    font-family: var(--kijelzo);
    font-size: clamp(4rem, 9vw, 7.5rem);
    line-height: .85;
    margin: 0;
    font-weight: 400;
}
.belepes-logo span { color: var(--sanc); font-size: .4em; }
.belepes-szlogen { font-size: 1.2rem; margin: .5rem 0 0; color: #e8ebee;  }

.szamok {
    display: flex; flex-wrap: wrap; gap: 1.25rem 2.5rem;
    margin: 0; padding: 0; list-style: none;
}
.szamok b {
    display: block;
    font-family: var(--kijelzo);
    font-weight: 400;
    font-size: 2.6rem;
    line-height: 1;
    color: var(--sanc);
}
.szamok span { color: #dfe3e7; font-size: .98rem; }

.belepes-urlap {
    background: var(--lap);
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 2.5rem 1.5rem;
}
.belepes-urlap form { width: 100%; max-width: 360px; display: flex; flex-direction: column; gap: 1.1rem; }
.belepes-urlap h1 { font-size: 2.6rem; }
/* a "Belépés" felirat h2 lett (a lap fő címsora a SANC.hu logó), de ugyanúgy néz ki, mint eddig */
.belepes-urlap .belepes-cim { font-family: var(--kijelzo); font-weight: 300; font-size: 2.6rem; line-height: .95; letter-spacing: .01em; margin: 5px 0 0; }
.belepes-urlap .gomb { width: 100%; margin-top: .25rem; }
.belepes-linkek { display: flex; justify-content: space-between; flex-wrap: wrap; gap: .5rem; font-size: .98rem; }

@media (max-width: 820px) {
    .belepes { grid-template-columns: 1fr; grid-template-rows: auto 1fr; }
    .belepes-kep { min-height: 42vh; padding: 1.25rem 16px 1.5rem; }
    .szlogen-tobbi { display: none; }   /* mobilon a szlogenből csak a "Röplabdabarátok oldala" marad */
    .belepes-urlap { align-items: flex-start; padding: 2rem 16px 3rem; }
    .szamok b { font-size: 2.1rem; }
}

/* ==========================================================================
   Edzések
   ========================================================================== */

.nap-valaszto {
    display: flex;
    gap: .4rem;
    overflow-x: auto;
    scrollbar-width: none;
    margin: 0 -16px 1rem;
    padding: 2px 16px 6px;
}
.nap-valaszto::-webkit-scrollbar { display: none; }
.nap-valaszto a {
    flex: 0 0 auto;
    min-width: 3.1rem;
    min-height: 44px;
    display: grid; place-items: center;
    padding: 0 .9rem;
    border-radius: 999px;
    border: 1px solid var(--vonal);
    background: var(--lap);
    color: var(--szoveg);
    text-decoration: none;
    font-weight: 600;
}
.nap-valaszto a:hover { border-color: var(--szoveg-2); }
.nap-valaszto a[aria-current="true"] { background: var(--kiemelt-hatter); border-color: var(--kiemelt-hatter); color: var(--kiemelt-szoveg); }
/* térképes nézet kapcsoló a napok sorának végén (Edzések oldal) */
.nap-valaszto .terkep-kapcsolo {
    flex: 0 0 auto; min-height: 44px; margin-left: auto;
    display: inline-flex; align-items: center; gap: .4rem; padding: 0 .9rem;
    border-radius: 999px; border: 1px solid var(--vonal); background: var(--lap); color: var(--szoveg);
    font: 600 1rem var(--betu); cursor: pointer;
}
.nap-valaszto .terkep-kapcsolo svg { width: 18px; height: 18px; }
.nap-valaszto .terkep-kapcsolo:hover { border-color: var(--szoveg-2); }
.nap-valaszto .terkep-kapcsolo[aria-pressed="true"] { background: var(--sanc); border-color: var(--sanc); color: #1f1205; }

.edzes-elrendezes {
    display: grid;
    grid-template-columns: 270px minmax(0, 1fr);
    gap: 2rem;
    align-items: start;
}

.szurok {
    position: sticky;
    top: 80px;
    background: var(--lap);
    border: 1px solid var(--vonal);
    border-radius: var(--kerekites);
    padding: 1.1rem;
}
.szurok summary {
    font-weight: 700;
    cursor: pointer;
    list-style: none;
    display: flex; justify-content: space-between; align-items: center;
}
.szurok summary::-webkit-details-marker { display: none; }
.szurok summary::after { content: "+"; font-size: 1.4rem; line-height: 1; color: var(--halvany); }
.szurok[open] summary::after { content: "–"; }
.szurok-tartalom { display: flex; flex-direction: column; gap: 1rem; margin-top: 1rem; }
.szuro-szam {
    display: inline-grid; place-items: center;
    min-width: 1.4rem; height: 1.4rem; padding: 0 .35rem; margin-left: .35rem;
    border-radius: 999px; background: var(--sanc); color: #1f1205; font-size: .8rem;
}
.szuro-gombok { display: flex; gap: .5rem; }
.szuro-gombok .gomb { flex: 1; }

@media (min-width: 901px) {
    .szurok summary { pointer-events: none; }
    .szurok summary::after { display: none; }
}

@media (max-width: 900px) {
    .edzes-elrendezes { grid-template-columns: 1fr; gap: 1.25rem; }
    .szurok { position: static; }
}

/* --- az edzéslista feje (cím + napválasztó): görgetéskor fent marad, a főmenü alatt ---
   A --fejlec-m a főmenü magassága (JavaScript méri; alapból 63px = 60px + 3px narancs csík),
   a --lista-fej-m ennek a fejnek a magassága – ez alá kerül a szűrőpanel. */
.lista-fej {
    position: sticky;
    top: var(--fejlec-m, 63px);
    z-index: 15;
    background: var(--papir);
    margin: -1.75rem -16px 1rem;
    padding: 1.25rem 16px .5rem;
    border-bottom: 1px solid var(--vonal);
}
.lista-fej .oldal-fej { margin-bottom: .75rem; }
.lista-fej .nap-valaszto { margin-bottom: 0; }
.edzes-elrendezes .szurok { top: calc(var(--fejlec-m, 63px) + var(--lista-fej-m, 0px) + 1rem); }
@media (max-width: 600px) {
    /* mobilon kevés a hely: a magyarázó sor elmarad, a cím kisebb */
    .lista-fej .alcim { display: none; }
    .lista-fej h1 { font-size: 2.2rem; }
    .lista-fej .oldal-fej { align-items: center; margin-bottom: .5rem; }
    .lista-fej .oldal-fej .gomb { min-height: 38px; padding: .3rem .85rem; font-size: .92rem; }
}

.talalat-szam { color: var(--halvany); margin: 0 0 1rem; }

/* --- egy nap blokkja --- */

.nap-blokk { margin-bottom: 2rem; }

.nap-cim {
    display: flex;
    align-items: baseline;
    gap: .6rem;
    margin: 0 0 .6rem;
    font-weight: 400;
}
.nap-cim .nap-nev { font-family: var(--kijelzo); font-size: 1.9rem; line-height: 1; }
.nap-cim .nap-datum { color: var(--halvany); font-size: 1rem; }
.nap-cim .ma { color: var(--sanc-sotet); font-weight: 700; font-size: .95rem; }

.edzes-lista {
    list-style: none; margin: 0; padding: 0;
    background: var(--lap);
    border: 1px solid var(--vonal);
    border-radius: var(--kerekites);
    overflow: hidden;
}
.edzes-lista > li + li { border-top: 1px solid var(--vonal); }

.edzes {
    position: relative;
    display: grid;
    grid-template-columns: 4.6rem 128px minmax(0, 1fr) auto;   /* idő, kép (16:9), adatok, létszám */
    align-items: center;
    gap: .25rem 1rem;
    padding: .9rem 1.1rem .9rem .9rem;
    color: inherit;
    text-decoration: none;
    background: var(--h-hatter, var(--lap));   /* az edzés hangulatszíne (kép nélkül: sima lap) */
}
.edzes:hover { background: color-mix(in srgb, var(--h-eros, var(--sanc)) 8%, var(--h-hatter, var(--lap))); }
.edzes:hover .edzes-nev { text-decoration: underline; text-decoration-thickness: 2px; text-underline-offset: 3px; }

.edzes-ido {
    font-family: var(--kijelzo);
    font-size: 2rem;
    line-height: 1;
    letter-spacing: .02em;
}

.edzes-kep {
    width: 128px; height: 72px;   /* 16:9 */
    border-radius: 8px;
    object-fit: cover;
    background: var(--kep-szin, #8a8f95);
}

.edzes-adatok { min-width: 0; }
.edzes-nev { display: block; font-weight: 700; font-size: 1.08rem; line-height: 1.3; margin: 0; overflow-wrap: anywhere; }
.edzes-hely { display: block; color: var(--szoveg-2); font-size: .97rem; margin: .1rem 0 0; }

.cimkek { display: flex; flex-wrap: wrap; gap: .35rem; margin-top: .4rem; }
.cimke {
    font-size: .82rem; font-weight: 600;
    padding: .1rem .5rem;
    border-radius: 999px;
    background: var(--papir);
    color: var(--szoveg-2);
    border: 1px solid var(--vonal);
}
.cimke.zart { background: var(--sanc-halvany); border-color: transparent; color: var(--sanc-sotet); }
a.cimke.zart { text-decoration: none; cursor: pointer; }      /* a zárt edzés csoportja: link a csoport tagjaira */
a.cimke.zart:hover { text-decoration: underline; }
.cimke.uzenet::before { content: ""; display: inline-block; width: .5em; height: .5em; border-radius: 50%; background: currentColor; margin-right: .3em; vertical-align: .1em; }

/* --- a létszám: egy pötty = egy hely a pályán --- */

.letszam { text-align: right; min-width: 9.5rem; }
/* 12 hely egy sorban, a 6. után kis rés: két térfél a háló két oldalán */
.helyek {
    display: inline-flex;
    flex-wrap: wrap;
    justify-content: flex-start;
    gap: 3px;
    max-width: 134px;
}
.helyek i:nth-child(12n+6) { margin-right: 5px; }
.helyek i {
    width: 8px; height: 8px;
    border-radius: 50%;
    border: 1.5px solid color-mix(in srgb, var(--szoveg-2) 55%, transparent);
}
.helyek i.foglalt { background: var(--sanc); border-color: var(--sanc); }

.helyek-sav {   /* nagy létszámnál pöttyök helyett sáv */
    width: 132px; height: 8px; border-radius: 4px; margin-left: auto;
    background: color-mix(in srgb, var(--szoveg-2) 18%, transparent);
    overflow: hidden;
}
.helyek-sav span { display: block; height: 100%; background: var(--sanc); }

.letszam-szoveg { display: block; font-size: .92rem; color: var(--szoveg-2); margin-top: .25rem; }
.letszam-szoveg b { font-weight: 700; font-size: 1.05rem; }   /* szabad helyek / várólista száma */
.letszam-szoveg.betelt { color: var(--betelt); font-weight: 600; }
.letszam-szoveg.szabad { color: var(--szabad); }

/* --- elmaradó alkalom --- */
.edzes.elmarad .edzes-kep { filter: grayscale(1); opacity: .6; }
.edzes.elmarad .edzes-ido, .edzes.elmarad .edzes-nev { text-decoration: line-through; text-decoration-thickness: 2px; color: var(--halvany); }
.edzes.elmarad .helyek, .edzes.elmarad .helyek-sav { opacity: .35; }
.elmarad-jel { color: var(--betelt); font-weight: 700; font-size: .92rem; }

@media (max-width: 600px) {
    .edzes {
        grid-template-columns: 96px minmax(0, 1fr);
        grid-template-areas:
            "kep adatok"
            "kep letszam";
        padding: .85rem 1rem .85rem .85rem;
        gap: .2rem .85rem;
        align-items: start;
    }
    .edzes-kep { grid-area: kep; width: 96px; height: 54px; }   /* mobilon is 16:9 */
    .edzes-adatok { grid-area: adatok; }
    .letszam { grid-area: letszam; text-align: left; min-width: 0; display: flex; flex-wrap: wrap; align-items: center; gap: .3rem .75rem; margin-top: .35rem; }
    .letszam-szoveg { margin-top: 0; white-space: nowrap; }
    .helyek-sav { margin-left: 0; width: 96px; }
    /* mobilon az időpont a név elé kerül */
    .edzes-ido { display: none; }
    .edzes-nev .mobil-ido { font-family: var(--kijelzo); font-weight: 400; font-size: 1.35rem; margin-right: .4rem; letter-spacing: .02em; }
}
@media (min-width: 601px) {
    .mobil-ido { display: none; }
}

.ures {
    background: var(--lap);
    border: 1px dashed var(--vonal);
    border-radius: var(--kerekites);
    padding: 2rem 1.5rem;
    text-align: center;
}
.ures p { margin: 0 0 1rem; color: var(--szoveg-2); }

/* ---------- Főoldal ---------- */

.udvozlo { margin-bottom: 2rem; }
.fooldal-racs { display: grid; grid-template-columns: minmax(0, 1fr); gap: 2rem; }
.szekcio-fej { display: flex; justify-content: space-between; align-items: baseline; gap: 1rem; margin-bottom: .75rem; }
.szekcio-fej h2 { margin: 0; }

@media (prefers-reduced-motion: reduce) {
    *, *::before, *::after { transition: none !important; animation: none !important; }
}

/* ==========================================================================
   Téma-váltó gomb a fejlécben
   ========================================================================== */

.tema-gomb-urlap { margin: 0; }
.fiok-tema { display: none; }   /* a menübeli témakapcsoló csak mobilon látszik */
.tema-gomb {
    display: grid; place-items: center;
    width: 40px; height: 40px;
    border-radius: 50%;
    border: 1px solid #4a525b;
    background: none;
    color: #d6dbe0;
    cursor: pointer;
}
.tema-gomb:hover { color: #fff; border-color: #fff; }

/* világosban a hold látszik (sötétre vált), sötétben a nap */
.ikon-nap { display: none; }
:root[data-theme="dark"] .ikon-hold { display: none; }
:root[data-theme="dark"] .ikon-nap { display: block; }
@media (prefers-color-scheme: dark) {
    :root:not([data-theme]) .ikon-hold { display: none; }
    :root:not([data-theme]) .ikon-nap { display: block; }
}

.fiok-nev.aktiv span:not(.monogram) { text-decoration: underline; text-decoration-color: var(--sanc); text-decoration-thickness: 3px; text-underline-offset: 6px; }

@media (max-width: 900px) {
    .js .menu-gomb { order: 2; margin-left: 0; }   /* jobbra: témakapcsoló, menü gomb, (admin) */
    .admin-kapcsolo-urlap { order: 3; }
    .fomenu { order: 5; }
}

/* ==========================================================================
   Profil
   ========================================================================== */

.profil-fej {
    display: flex;
    align-items: center;
    gap: 1.25rem;
    margin-bottom: 1.75rem;
}
.profil-fej h1 { font-size: clamp(2.2rem, 6vw, 3.2rem); overflow-wrap: anywhere; }
.profil-fej .alcim { margin-top: .4rem; overflow-wrap: anywhere; }
.profil-fej { flex-wrap: wrap; }
.profil-elonezet { margin-left: auto; white-space: nowrap; }   /* "Profilom előnézete": a fejléc jobb szélén (keskeny képernyőn alá törik) */
.profil-fej .alcim span { color: var(--halvany); }

.profil-kep {
    flex: 0 0 auto;
    width: 96px; height: 96px;
    border-radius: 50%;
    object-fit: cover;
    border: 3px solid var(--sanc);
}
.monogram-nagy {
    display: grid; place-items: center;
    background: var(--grafit); color: #fff;
    font-family: var(--kijelzo); font-size: 2.6rem; padding-top: 4px;
}

.profil-elrendezes {
    display: grid;
    grid-template-columns: 200px minmax(0, 1fr);
    gap: 2rem;
    align-items: start;
}

.profil-menu {
    position: sticky;
    top: 84px;
    display: flex;
    flex-direction: column;
    border-left: 2px solid var(--vonal);
}
.profil-menu a {
    color: var(--szoveg-2);
    text-decoration: none;
    font-weight: 500;
    padding: .45rem 0 .45rem 1rem;
    margin-left: -2px;
    border-left: 2px solid transparent;
}
.profil-menu a:hover { color: var(--szoveg); border-left-color: var(--sanc); }

.profil-szakaszok { display: flex; flex-direction: column; gap: 1.5rem; min-width: 0; }

.szakasz {
    background: var(--lap);
    border: 1px solid var(--vonal);
    border-radius: var(--kerekites);
    padding: 1.4rem 1.5rem 1.5rem;
    scroll-margin-top: 84px;
}
.szakasz > h2 { font-size: 1.35rem; }
.halvany-szakasz { background: transparent; border-style: dashed; }

.segito { color: var(--halvany); font-size: .95rem; margin: -.25rem 0 1rem; }
.mezo .segito { margin: 0; }

.uzenet-ok {
    background: color-mix(in srgb, var(--szabad) 13%, var(--lap));
    border-left: 4px solid var(--szabad);
    padding: .7rem 1rem;
    border-radius: 6px;
    margin: 0 0 1rem;
    font-weight: 500;
}
.szakasz .uzenet-hiba { margin-bottom: 1rem; }

.mezo-racs {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 1rem 1.25rem;
}
.mezo-racs .szeles { grid-column: 1 / -1; }

.csoport {
    border: 0;
    border-top: 1px solid var(--vonal);
    margin: 1.5rem 0 0;
    padding: 1.25rem 0 0;
}
.csoport legend { font-weight: 700; padding: 0 .5rem 0 0; }
.csoport .segito { margin-top: .25rem; }

.kapcsolok {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: .65rem 1.25rem;
}
.kapcsolok.egy-oszlop { grid-template-columns: 1fr; margin-top: .75rem; }

.urlap-lab {
    display: flex; align-items: center; gap: 1rem; flex-wrap: wrap;
    margin-top: 1.5rem;
}
.keskeny-urlap { max-width: 380px; display: flex; flex-direction: column; gap: 1rem; }
.keskeny-urlap .urlap-lab { margin-top: .25rem; }

/* --- téma választó kártyák --- */

.tema-valaszto {
    border: 0; margin: 0; padding: 0;
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 1rem;
}
.tema-kartya { position: relative; cursor: pointer; display: flex; flex-direction: column; gap: .5rem; }
.tema-kartya input { position: absolute; opacity: 0; pointer-events: none; }
.tema-nev { font-weight: 600; font-size: .98rem; }

.tema-minta {
    display: block;
    position: relative;
    aspect-ratio: 16 / 10;
    border-radius: 8px;
    border: 2px solid var(--vonal);
    overflow: hidden;
    padding: 22% 10% 0;
}
/* mini oldal: fejléc-sáv + két sor */
.tema-minta::before { content: ""; position: absolute; inset: 0 0 auto; height: 16%; background: #1f2328; border-bottom: 2px solid #ff830c; }
.tema-minta i { display: block; height: 14%; border-radius: 3px; margin-bottom: 7%; }
.tema-minta i:nth-child(1) { width: 55%; }
.tema-minta i:nth-child(3) { width: 75%; }

.minta-vilagos { background: #f2f4f6; }
.minta-vilagos i { background: #fff; border: 1px solid #dfe3e7; }
.minta-vilagos i:nth-child(1) { background: #1f2328; border: 0; }

.minta-sotet { background: #14171a; }
.minta-sotet i { background: #1d2125; border: 1px solid #2f353b; }
.minta-sotet i:nth-child(1) { background: #eceff2; border: 0; }

/* fél világos, fél sötét */
.minta-auto { background: linear-gradient(105deg, #f2f4f6 50%, #14171a 50%); }
.minta-auto i { background: linear-gradient(105deg, #fff 50%, #1d2125 50%); border: 1px solid #8a8f95; }
.minta-auto i:nth-child(1) { background: linear-gradient(105deg, #1f2328 50%, #eceff2 50%); border: 0; }

.tema-kartya:hover .tema-minta { border-color: var(--szoveg-2); }
.tema-kartya input:checked + .tema-minta { border-color: var(--sanc); box-shadow: 0 0 0 2px var(--sanc); }
.tema-kartya input:checked ~ .tema-nev::before { content: "✓ "; color: var(--sanc-sotet); }
.tema-kartya input:focus-visible + .tema-minta { outline: 3px solid var(--sanc); outline-offset: 3px; }

.js .js-rejt { display: none; }
.mentve-jel { color: var(--szabad); font-weight: 600; }

/* --- plakett ikonok --- */

.ikon-racs {
    border: 0; margin: 0 0 1.25rem; padding: 0;
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(56px, 1fr));
    gap: .5rem;
}
.ikon-valaszto { position: relative; cursor: pointer; }
.ikon-valaszto input { position: absolute; opacity: 0; pointer-events: none; }
.ikon-valaszto img, .ikon-valaszto span {
    width: 100%; aspect-ratio: 1;
    display: grid; place-items: center;
    padding: 1px;
    border-radius: 8px;
    border: 2px solid var(--vonal);
    background: var(--papir);
    object-fit: contain;
    font-size: .85rem; font-weight: 600; color: var(--szoveg-2);
}
.ikon-valaszto:hover img, .ikon-valaszto:hover span { border-color: var(--szoveg-2); }
.ikon-valaszto input:checked + img, .ikon-valaszto input:checked + span { border-color: var(--sanc); box-shadow: 0 0 0 2px var(--sanc); }
.ikon-valaszto input:focus-visible + img, .ikon-valaszto input:focus-visible + span { outline: 3px solid var(--sanc); outline-offset: 2px; }

@media (max-width: 900px) {
    .profil-elrendezes { grid-template-columns: 1fr; gap: 1rem; }
    .profil-menu {
        position: static;
        flex-direction: row;
        border-left: 0;
        overflow-x: auto;
        scrollbar-width: none;
        gap: .4rem;
        margin: 0 -16px;
        padding: 2px 16px 6px;
    }
    .profil-menu::-webkit-scrollbar { display: none; }
    .profil-menu a {
        flex: 0 0 auto;
        white-space: nowrap;
        border: 1px solid var(--vonal);
        border-radius: 999px;
        background: var(--lap);
        padding: .5rem .9rem;
        margin: 0;
        min-height: 44px;
        display: grid; place-items: center;
    }
    .profil-menu a:hover { border-color: var(--szoveg-2); }
}

@media (max-width: 600px) {
    .profil-fej { gap: 1rem; }
    .profil-kep { width: 72px; height: 72px; }
    .monogram-nagy { font-size: 2rem; }
    .szakasz 
    {
        padding: 1.1rem 1rem 1.25rem;

    }
    .mezo-racs, .kapcsolok { grid-template-columns: 1fr; }
    .tema-valaszto { gap: .6rem; }
    .tema-nev { font-size: .9rem; }
}

/* ==========================================================================
   Edzés részletei
   ========================================================================== */

.link-gomb {
    font: inherit; font-size: .95rem; font-weight: 600;
    background: none; border: 0; padding: .25rem 0;
    color: var(--sanc-sotet);
    cursor: pointer;
    text-decoration: underline; text-underline-offset: 3px;
}
.link-gomb:hover { text-decoration-thickness: 2px; }
.link-gomb.veszely { color: var(--betelt); }
summary.link-gomb { list-style: none; display: inline-block; }
summary.link-gomb::-webkit-details-marker { display: none; }

.gomb.teljes { width: 100%; }
.nagy-gomb { min-height: 52px; font-size: 1.1rem; }

.halvany-szam { color: var(--halvany); font-weight: 500; margin-left: .25rem; font-size:1.8rem; }
.halvany { color: var(--halvany); }

/* --- fej --- */

.edzes-fej {
    display: grid;
    grid-template-columns: 132px minmax(0, 1fr) auto;
    gap: 1.5rem;
    align-items: start;
    margin-bottom: 1rem;
}
.edzes-fej-kep img {
    width: 132px; height: 132px;
    border-radius: 12px;
    object-fit: cover;
    background: var(--kep-szin);
}
.edzes-fej.elmarad .edzes-fej-kep img { filter: grayscale(1); opacity: .6; }

/* --- borítóképes fejléc: a kép kitölti a sávot, a szöveg alul, sötét átmeneten --- */
.edzes-fej.boritos {
    position: relative;
    isolation: isolate;
    display: flex;
    align-items: flex-end;
    min-height: clamp(220px, 34vw, 340px);
    padding: 1.5rem 1.75rem;
    border-radius: 14px;
    overflow: hidden;
    background: var(--kep-szin);
    color: #fff;
}
.boritokep {
    position: absolute; inset: 0; z-index: -2;
    width: 100%; height: 100%;
    object-fit: cover;
    object-position: center 35%;
}
.edzes-fej.boritos::before {
    content: ""; position: absolute; inset: 0; z-index: -1;
    background: linear-gradient(180deg, rgba(20, 23, 26, .15) 0%, rgba(20, 23, 26, .25) 40%, rgba(20, 23, 26, .85) 100%);
}
.edzes-fej.boritos .edzes-fej-szoveg { flex: 1; min-width: 0; }
.edzes-fej.boritos h1 { color: #fff; text-shadow: 0 2px 12px rgba(0, 0, 0, .35); }
.edzes-fej.boritos .mikor-nap { color: var(--sanc); }
.edzes-fej.boritos .mikor-datum { color: #fff; }
.edzes-fej.boritos .mikor-ido { background: var(--sanc); color: #1f1205; }
.edzes-fej.boritos .edzes-hol { color: #e8ebee; }
.edzes-fej.boritos .edzes-hol a { color: #ffb066; }
.edzes-fej.boritos .cimke { background: rgba(255, 255, 255, .16); border-color: rgba(255, 255, 255, .28); color: #fff; }
.edzes-fej.boritos .cimke.zart { background: var(--sanc); border-color: var(--sanc); color: #1f1205; }
.edzes-fej.boritos .kedvenc-urlap { position: absolute; top: 1rem; right: 1rem; }
.edzes-fej.boritos .kedvenc-gomb { background: rgba(20, 23, 26, .55); border-color: rgba(255, 255, 255, .35); color: #fff; backdrop-filter: blur(4px); }
.edzes-fej.boritos .kedvenc-gomb.be { border-color: var(--sanc); }
.edzes-fej.boritos.elmarad .boritokep { filter: grayscale(1); }
.edzes-fej.boritos.elmarad h1 { color: #c9ced4; }

.edzes-mikor {
    display: flex; flex-wrap: wrap; align-items: baseline; gap: .1rem .6rem;
    margin: 0 0 .35rem;
    font-family: var(--kijelzo);
    line-height: 1;
}
.mikor-nap { font-size: 2rem; color: var(--sanc-sotet); }
.mikor-datum { font-size: 2rem; }
.mikor-ido { font-size: 2rem; padding: .1rem .5rem 0; border-radius: 6px; background: var(--kiemelt-hatter); color: var(--kiemelt-szoveg); }
.edzes-fej.elmarad .mikor-ido { background: var(--halvany); }
.mikor-ig { font-size: .75em; opacity: .85; }   /* a befejezés ("–21:00") a kezdés mellett, kicsit kisebben */

.edzes-fej h1 { font-size: clamp(2rem, 5vw, 3rem); overflow-wrap: anywhere; }
.edzes-fej.elmarad h1 { text-decoration: line-through; text-decoration-thickness: 3px; color: var(--halvany); }
.edzes-hol { margin: .4rem 0 .5rem; color: var(--szoveg-2); font-size: 1.05rem; }
.edzes-hol a { margin-left: .5rem; font-weight: 600; }
.cimke.elmarad-cimke { background: var(--betelt); border-color: var(--betelt); color: #fff; }

.kedvenc-gomb {
    display: inline-flex; align-items: center; gap: .4rem;
    font: inherit; font-weight: 600; font-size: .95rem;
    min-height: 40px;
    padding: .3rem .8rem;
    border-radius: 999px;
    border: 1px solid var(--vonal);
    background: var(--lap);
    color: var(--szoveg-2);
    cursor: pointer;
}
.kedvenc-gomb svg { fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linejoin: round; }
.kedvenc-gomb:hover { border-color: var(--szoveg-2); }
.kedvenc-gomb.be { color: var(--sanc-sotet); border-color: var(--sanc); }
.kedvenc-gomb.be svg { fill: var(--sanc); stroke: var(--sanc); }

.alkalom-lapozo {
    display: flex; align-items: center; gap: .5rem; flex-wrap: wrap;   /* egy sorban: előző · (szervezői gombok) · … · következő */
    margin: 0 0 1.25rem;
    font-weight: 600;
}
.alkalom-lapozo a { text-decoration: none; }   /* az előző / következő alkalom: körvonalas gomb (gomb masodlagos kicsi), mindenki látja */
.alkalom-lapozo .jobbra { margin-left: auto; }

/* --- két hasáb: jobb oldalon a jelentkezés és a névsor, bal oldalon a többi --- */

.edzes-racs {
    display: grid;
    /* bal: jelentkezés + névsor (keskenyebb), jobb: az edzésről + hozzászólások (szélesebb) */
    grid-template-columns: minmax(300px, 1fr) minmax(0, 1.5fr);
    gap: 1.75rem;
    align-items: start;
}
.edzes-bal, .edzes-jobb { display: flex; flex-direction: column; gap: 1.25rem; min-width: 0; }
.edzes-jobb { grid-column: 1; grid-row: 1; }   /* (a "jobb" doboz a jelentkezésé – most a bal oldalon) */
.edzes-bal { grid-column: 2; grid-row: 1; }    /* (a "bal" doboz az edzésről + hozzászólásoké – most a jobb oldalon) */

.szakasz h3 { font-size: 1.05rem; margin: 1.25rem 0 .5rem; }
.kis-szakasz p { margin: 0 0 .75rem; }

/* --- jelentkezés kártya --- */

/* --- hangulatszínek a borítóképből (Services/Hangulat.cs) ---
   Az oldal a .edzes-racs (a beállítások oldalon a .beallitas-oldal, a listában az .edzes sor) elemre írja ki a --hv-* (világos) és --hs-* (sötét) változókat.
   Itt a téma szerint kiválasztjuk a megfelelőt; ha nincs kép, az alap színek maradnak. */
.edzes-racs, .beallitas-oldal, .edzes-lista .edzes, .cs-kartya {
    --h-hatter: var(--hv-hatter, var(--h-alap, var(--lap)));
    --h-eros: var(--hv-eros, var(--sanc));
    --h-eros-szoveg: var(--hv-eros-szoveg, #1f1205);
    --h-kartya: var(--hv-hatter, var(--papir));   /* névsor kártyák háttere (kép nélkül: az eddigi szürke) */
    --h-nev: var(--hv-eros, var(--szoveg));       /* névsorban a név színe (kép nélkül: sima szövegszín) */
}
:root[data-theme="dark"] .edzes-racs, :root[data-theme="dark"] .beallitas-oldal, :root[data-theme="dark"] .edzes-lista .edzes, :root[data-theme="dark"] .cs-kartya {
    --h-hatter: var(--hs-hatter, var(--h-alap, var(--lap)));
    --h-eros: var(--hs-eros, var(--sanc));
    --h-eros-szoveg: var(--hs-eros-szoveg, #1f1205);
    --h-kartya: var(--hs-hatter, var(--papir));
    --h-nev: var(--hs-eros, var(--szoveg));
}
@media (prefers-color-scheme: dark) {
    :root:not([data-theme]) .edzes-racs, :root:not([data-theme]) .beallitas-oldal, :root:not([data-theme]) .edzes-lista .edzes, :root:not([data-theme]) .cs-kartya {
        --h-hatter: var(--hs-hatter, var(--h-alap, var(--lap)));
        --h-eros: var(--hs-eros, var(--sanc));
        --h-eros-szoveg: var(--hs-eros-szoveg, #1f1205);
        --h-kartya: var(--hs-hatter, var(--papir));
        --h-nev: var(--hs-eros, var(--szoveg));
    }
}

.jelentkezes-kartya {
    background: var(--h-hatter);
    border: 1px solid var(--h-halvany);
    box-shadow: rgba(0, 0, 0, 0.05) 0px 6px 24px 0px, rgba(0, 0, 0, 0.08) 0px 0px 0px 1px;
}
/* a fő gomb (Jelentkezem) a hangulat erős színével */
.jelentkezes-kartya .gomb:not(.masodlagos) {
    background: var(--h-eros);
    border-color: var(--h-eros);
    color: var(--h-eros-szoveg);
}
.jelentkezes-kartya .gomb:not(.masodlagos):hover { filter: brightness(1.08); }
.letszam-nagy {
    display: flex; justify-content: space-between; align-items: flex-end; gap: 1rem; flex-wrap: wrap;
    margin-bottom: .75rem;
}
.letszam-nagy .szam { font-family: var(--kijelzo); font-size: 3.4rem; line-height: .9; }
.letszam-nagy .per { font-family: var(--kijelzo); font-size: 2rem; color: var(--halvany); }
.letszam-nagy .mi { display: block; color: var(--szoveg-2); font-size: .95rem; }
.letszam-allapot { font-weight: 700; }
.betelt-jel { color: var(--betelt); }
.szabad-jel { color: var(--szabad); }

/* a pálya: egy pötty egy hely, két térfél, középen a háló */
.palya {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 12px 14px;
    margin-bottom: 1rem;
    border-radius: 8px;
    /* a hangulatszínhez igazodik (ha nincs, a --h-eros a SANC narancs) */
    background: color-mix(in srgb, var(--h-eros, var(--sanc)) 10%, var(--h-hatter, var(--lap)));
    border: 1px solid color-mix(in srgb, var(--h-eros, var(--sanc)) 30%, var(--vonal));
}
.terfel {
    flex: 1;
    display: grid;
    grid-template-columns: repeat(var(--oszlop), minmax(0, 22px));
    justify-content: center;
    gap: 6px;
}
.palya i {
    aspect-ratio: 1;
    border-radius: 50%;
    border: 2px solid color-mix(in srgb, var(--h-eros, var(--szoveg-2)) 50%, transparent);
}
.palya i.foglalt { background: var(--h-eros, var(--sanc)); border-color: var(--h-eros, var(--sanc)); }
.palya .halo {
    align-self: stretch;
    width: 2px;
    background: repeating-linear-gradient(var(--h-eros, var(--szoveg-2)) 0 4px, transparent 4px 8px);
    opacity: .7;
}
.helyek-sav.nagy { width: 100%; height: 12px; border-radius: 6px; margin: 0 0 1rem; }
.helyek-sav.nagy span { background: var(--h-eros, var(--sanc)); }

.jel-allapot { margin: 0 0 .75rem; font-weight: 500; }
.jel-allapot.ok { color: var(--szabad); }
.jel-muvelet .segito { margin: .6rem 0 0; }
.figyelmeztet { color: var(--sanc-sotet) !important; }

/* --- névsor: kis fekvő kártyák --- */

.nevsor { list-style: none; margin: 0; padding: 0; counter-reset: sor; display: flex; flex-direction: column; gap: .5rem; }
.nevsor > li {
    display: flex; align-items: center; gap: .75rem;
    padding: .1rem .1rem .1rem .1rem;
    border: 1px solid var(--vonal);
    border-radius: 10px;
    background: var(--h-kartya, var(--papir));   /* az edzés hangulatszíne */
    counter-increment: sor;
}
/* sorszám: nagy, jól látható – hányadik vagy */
ol.nevsor > li::before {
    content: counter(sor);
    flex: 0 0 2.1rem;
    text-align: center;
    font-family: var(--kijelzo);
    font-size: 3rem;
    line-height: 1;
    padding-top: 3px;
    color: var(--halvany);
    font-variant-numeric: tabular-nums;
}
.varolista > li::before {
    color: var(--halvany) !important;
    -webkit-text-stroke: 0.5px var(--szoveg-2);
    font-size: 1rem !important;
}

/* lemondott: a helyén marad, de szürkén, sorszám nélkül */
ol.nevsor > li.lemondott {
    counter-increment: none; background: transparent;
    border: 1.5px dashed color-mix(in srgb, var(--szoveg) 35%, transparent);   /* lemondott: erősebb szaggatott keret */
}
ol.nevsor > li.lemondott::before { content: "–"; color: var(--vonal); }
.nevsor > li.lemondott .avatar, .nevsor > li.lemondott .plakett 
{
    filter: grayscale(1); opacity: .55; 

}

.nevsor > li.lemondott .avatar-keret {
    display: none;
}

.nevsor > li.lemondott .nev {
    color: color-mix(in srgb, var(--szoveg) 24%, transparent);
    font-weight: 600;
}
.nevsor > li.lemondott .nev a { color: inherit; }
.nevsor > li.en { border-color: var(--h-eros, var(--sanc)); border-width: 2px; background: color-mix(in srgb, var(--h-eros, var(--sanc)) 10%, var(--h-kartya, var(--lap))); }
.nevsor > li.en::before { color: var(--sanc-sotet); }

.avatar {
    flex: 0 0 auto;
    width: 32px; height: 32px;
    border-radius: 50%;
    object-fit: cover;
   border:1px var(--sanc) solid;
}
.nevsor .avatar {
    width: 54px; height: 54px;
    border-radius: 4px;
    border: 1px solid color-mix(in srgb, var(--szoveg) 42%, transparent);   /* vékony keret a kép körül */
}
.monogram-kicsi {
    display: inline-grid; place-items: center;
    background: var(--papir); color: var(--szoveg-2);
    border: 1px solid var(--vonal);
    font-size: .75rem; font-weight: 700;
}
.nevsor .monogram-kicsi { background: var(--lap); font-size: 1.2rem; }
.monogram-kicsi.vendeg { border-style: dashed; }

.nev-blokk { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: .3rem; }
    .nev-blokk .nev {
        font-weight: 600;
        font-size: 1.1rem;
        line-height: 1.25;
        overflow-wrap: anywhere;
        text-transform: uppercase;
    }
.nev-blokk .nev a { color: inherit; text-decoration: none; }
.nevsor > li:not(.lemondott) .nev-blokk .nev { color: var(--h-nev, var(--szoveg)); }   /* név: az edzés erős színe */
.nev-blokk .nev a:hover { text-decoration: underline; }
.nev-info { font-size: .85rem; color: var(--halvany); display: flex; align-items: center; gap: .35rem .5rem; flex-wrap: wrap; }
/* a kép kerete: ehhez igazodik a plakett */
.avatar-keret { position: relative; flex: 0 0 auto; display: block; line-height: 0; margin-right: 4px; }

/* támogatói plakett: a profilkép jobb alsó sarkán, félig rálógva */
.plakett {
    position: absolute;
    right: -20px; bottom: 20px;
    width: 38px; height: 38px;
    padding: 1px;
    border-radius: 50%;

 
    object-fit: contain;

}
.te-jel {
    font-size: .75rem; font-weight: 700;
    padding: .3rem .7rem; margin-left: .35rem;
    border-radius: 999px;
    background: var(--sanc); color: #1f1205;
    vertical-align: 2px;
}

/* állapot: telt színes címke */
.allapot {
    display: inline-block;
    padding: .12rem .55rem;
    border-radius: 6px;
    font-size: .8rem; font-weight: 400;
    letter-spacing: .01em;
    line-height: 1.4;
}
.allapot.ok { background: var(--szabad); color: #fff; }
.allapot.fix { background: transparent; color: var(--szoveg-2); box-shadow: inset 0 0 0 0.4px var(--szoveg-2);  }
.allapot.lemondta { background: transparent; color: var(--halvany); box-shadow: inset 0 0 0 1.5px var(--vonal); }
.allapot.keso { background: color-mix(in srgb, var(--betelt) 15%, var(--lap)); color: var(--betelt); box-shadow: inset 0 0 0 1.5px color-mix(in srgb, var(--betelt) 45%, transparent); }
.allapot.vendeg { background: var(--sanc); color: #1f1205; }
.allapot.varo { background: transparent; color: var(--szoveg-2); box-shadow: inset 0 0 0 1.5px var(--halvany); }
:root[data-theme="dark"] .allapot.ok { color: #0f2318; }
@media (prefers-color-scheme: dark) {
    :root:not([data-theme]) .allapot.ok { color: #0f2318; }
}

.jel-ido { font-variant-numeric: tabular-nums; }
/* fix tag részvételi aránya a névsor részletes nézetében: visszafogottan, a többi kis infóval egyformán */
.arany { font-weight: 400; font-size: .72rem; color: var(--halvany); white-space: nowrap; cursor: help; }

.gomb.kicsi { min-height: 36px; padding: .3rem .85rem; font-size: .92rem; border-width: 1.5px; }
.sor-muvelet { margin: 0; }

/* kártya jobb oszlopa: állapotcímke a jobb felső, kuka a jobb alsó sarokban */
.nevsor > li { align-items: stretch; }
.nevsor > li > .avatar-keret, .nevsor > li > .nev-blokk { align-self: center; }
ol.nevsor > li::before { align-self: center; }
.kartya-jobb {
    flex: 0 0 auto;
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    justify-content: space-between;
    gap: .4rem;
}
.kartya-jobb .allapot { white-space: nowrap; }

/* kis kuka gomb a levételhez */
.kuka-gomb {
    display: grid; place-items: center;
    width: 32px; height: 32px;
    border-radius: 8px;
    border: 1.5px solid color-mix(in srgb, var(--betelt) 55%, var(--vonal));
    background: var(--lap);
    color: var(--betelt);
    cursor: pointer;
}
.kuka-gomb:hover { background: var(--betelt); border-color: var(--betelt); color: #fff; }

.nevsor-cim { color: var(--szoveg-2); }
.varolista > li { opacity: .85; background: var(--papir); }   /* a várólista az alap háttérrel, nem a hangulatszínnel */

.lemondtak { margin-top: 1rem; }
.lemondtak summary { cursor: pointer; color: var(--szoveg-2); font-weight: 600; }
.lemondott-lista { gap: 0; }
.lemondott-lista > li { gap: .5rem; flex-wrap: wrap; background: none; border: 0; border-top: 1px solid var(--vonal); border-radius: 0; padding: .45rem 0; }
.lemondott-lista > li:first-child { border-top: 0; }
.lemondott-lista .nev { text-decoration: line-through; color: var(--halvany); }
.lemondott-lista .mikor { margin-left: auto; color: var(--halvany); font-size: .88rem; }
.cimke.keso { background: color-mix(in srgb, var(--betelt) 14%, var(--lap)); color: var(--betelt); border-color: transparent; }

.vendeg-felvetel { margin-top: 1.25rem; border-top: 1px solid var(--vonal); padding-top: 1rem; }
.vendeg-felvetel summary { cursor: pointer; font-weight: 600; color: var(--sanc-sotet); }
.vendeg-urlap { margin-top: .75rem; display: flex; flex-direction: column; gap: .4rem; }
.vendeg-urlap label { font-weight: 600; font-size: .95rem; }
.vendeg-urlap .sor { display: flex; gap: .5rem; }
.vendeg-urlap .sor input { flex: 1; min-width: 0; }

/* --- főoldal, mobilon: összecsukható szakaszok (site.js: data-mobil-csukhato) --- */
@media (max-width: 900px) {
    [data-mobil-csukhato] > .szekcio-fej { cursor: pointer; margin-bottom: 0; }
    [data-mobil-csukhato] > .szekcio-fej h2::after {   /* nyíl a cím után: lefelé = csukva, felfelé = nyitva */
        content: ""; display: inline-block; width: .5rem; height: .5rem; margin-left: .6rem;
        border-right: 2px solid var(--szoveg-2); border-bottom: 2px solid var(--szoveg-2);
        transform: rotate(-135deg) translate(-2px, -2px); transition: transform .2s ease; vertical-align: middle;
    }
    [data-mobil-csukhato].csukva > .szekcio-fej h2::after { transform: rotate(45deg) translate(-3px, -3px); }
    [data-mobil-csukhato]:not(.csukva) > .szekcio-fej { margin-bottom: .75rem; }
    [data-mobil-csukhato].csukva > :not(.szekcio-fej) { display: none !important; }
}

/* --- összecsukható szakasz (mobilon) --- */
.osszecsukhato > summary { list-style: none; cursor: pointer; display: flex; align-items: center; justify-content: space-between; gap: 1rem; }
.osszecsukhato > summary::-webkit-details-marker { display: none; }
.osszecsukhato > summary h2 { margin: 0; }
.osszecsukhato > summary::after {
    content: ""; flex: 0 0 auto;
    width: .6rem; height: .6rem;
    border-right: 2px solid var(--szoveg-2); border-bottom: 2px solid var(--szoveg-2);
    transform: rotate(45deg) translate(-2px, -2px);
    transition: transform .2s ease;
}
.osszecsukhato[open] > summary::after { transform: rotate(-135deg) translate(-2px, -2px); }
.osszecsukhato-tartalom { margin-top: .75rem; }
@media (min-width: 901px) {
    .osszecsukhato > summary { cursor: default; pointer-events: none; }
    .osszecsukhato > summary::after { display: none; }
}

/* --- leírás --- */

.hosszu-szoveg {
    max-width: 70ch;
    overflow-wrap: anywhere;
    line-height: 1.2em;
    color: color-mix(in srgb, var(--szoveg) 55%, var(--papir));
}
.adatok {
    display: grid; grid-template-columns: auto 1fr; gap: .35rem 1.25rem;
    margin: 1.25rem 0 0; padding-top: 1rem; border-top: 1px solid var(--vonal);
}
.adatok dt { color: var(--halvany); font-size: .95rem; }
.adatok dd { margin: 0; }

/* --- értékelés --- */

.ertekeles {
    background: var(--h-hatter);
    color: var(--szoveg);   /* a téma szövegszíne (a --h-eros-szoveg az erős színű háttérre való, a halvány háttéren sötét módban fekete lett volna) */
}
.ertekeles .segito { color: var(--szoveg-2); }
.csillagok { display: flex; align-items: center; gap: .15rem; flex-wrap: wrap; }
.csillag {
    background: none; border: 0; padding: 4px; cursor: pointer;
    color: color-mix(in srgb, var(--h-hatter) 40%, transparent);
}
.csillag svg { fill: currentColor; display: block; }
.csillag.be { color: var(--sanc); }
/* rámutatáskor az adott és az előtte lévő csillagok világítanak */
.csillagok:hover .csillag { color: var(--sanc); }
.csillagok .csillag:hover ~ .csillag { color: color-mix(in srgb, var(--szoveg-2) 40%, transparent); }
.csillagok .link-gomb { margin-left: 1rem; }
.ertekelesem { display: flex; align-items: center; gap: 1rem; flex-wrap: wrap; }
.csillag-sor { font-size: 1.6rem; color: var(--sanc); letter-spacing: 2px; }
.ures-csillag { color: color-mix(in srgb, var(--szoveg-2) 30%, transparent); }

/* Edzés oldal – az értékelés utáni "Köszönjük…" üzenet */
.ertekeles .uzenet-ok {
    background: var(--h-eros);
    color: var(--h-eros-szoveg);
    border-left-color: var(--h-eros-szoveg);
}

/* --- hozzászólások --- */

.uj-hozzaszolas { margin-bottom: 1.25rem; }
.uj-hozzaszolas .urlap-lab { margin-top: .6rem; justify-content: flex-end; }
.hozzaszolas-lista { list-style: none; margin: 0; padding: 0; }
.hozzaszolas {
    display: flex; gap: .75rem;
    padding: 1rem 0;
    border-top: 1px solid var(--vonal);
    scroll-margin-top: 84px;
}
.hozzaszolas .avatar { width: 82px; height: 82px; }   /* hozzászólás avatar mérete */
.hozzaszolas .monogram-kicsi { font-size: 1.05rem; }
.hozzaszolas-test { flex: 1; min-width: 0; }
.hozzaszolas-fej { display: flex; flex-wrap: wrap; align-items: baseline; gap: .1rem .6rem; margin-bottom: .2rem; }
.hozzaszolas-fej .nev { font-weight: 700; }
.hozzaszolas-fej .nev a { color: inherit; text-decoration: none; }
.hozzaszolas-fej time { color: var(--halvany); font-size: .88rem; }
.hozzaszolas-szoveg { overflow-wrap: anywhere; }
.hozzaszolas-szoveg.athuzott { text-decoration: line-through; color: var(--halvany); }
.hozzaszolas-link { margin-top: .3rem; font-size: .95rem; overflow-wrap: anywhere; }
.hozzaszolas.sajat .hozzaszolas-fej .nev::after { content: " (te)"; color: var(--halvany); font-weight: 500; }
.hozzaszolas-muveletek { display: flex; gap: 1rem; align-items: flex-start; margin-top: .3rem; }
.hozzaszolas-muveletek form { margin: 0; }
.hozzaszolas-muveletek details[open] { flex-basis: 100%; }
.hozzaszolas-muveletek details textarea { margin-top: .5rem; }
.hozzaszolas-muveletek details .urlap-lab { margin-top: .5rem; }

/* --- szervezőknek --- */

.szervezo-panel { 
    border-style: dashed; 
    background-color:var(--h-hatter);
    border:1px solid var(--halvany);
}
.szervezo-gombok {
    display: flex;
    flex-wrap: wrap;
    gap: .6rem;
    margin-bottom: 1rem;
    
}
    .szervezo-gombok form {
        margin: 0;

    }
.link-sor { display: flex; gap: 1.25rem; flex-wrap: wrap; font-weight: 600; }

@media (max-width: 900px) {
    /* mobilon egy hasáb, ebben a sorrendben: jelentkezés, névsor, értékelés, leírás, hozzászólások, fix, szervező */
    /* stretch: minden doboz teljes szélességű (asztali nézetből az align-items: start itt összehúzta volna) */
    .edzes-racs { display: flex; flex-direction: column; gap: 1.25rem; align-items: stretch; }
    .edzes-bal, .edzes-jobb { display: contents; }
    .jelentkezes-kartya { order: 2; }
    .resztvevok { order: 1; }
    .ertekeles { order: 3; }
    .erosseg { order: 6; }   /* a mezőny erőssége: a fix tagság után (a DOM-ban utána van), a szervezőknek előtt */
    .leiras { order: 4; }
    .hozzaszolasok { order: 5; }
    #fix { order: 6; }
    .szervezo-panel { order: 7; }
    .megosztas-szakasz { order: 8; }   /* a megosztás a legalján */
     /* a megosztás a legalján */
    .edzes-fej { grid-template-columns: 96px minmax(0, 1fr); gap: 1rem; }
    .edzes-fej-kep img { width: 96px; height: 96px; }
    .kedvenc-urlap { grid-column: 1 / -1; }
    .edzes-fej.boritos { padding: 1.25rem; margin: -1.75rem -16px 1rem; border-radius: 0; }
    .edzes-fej.boritos .kedvenc-gomb span { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }
}

@media (max-width: 600px) {
    .edzes-fej { grid-template-columns: 72px minmax(0, 1fr); }
    .edzes-fej-kep img { width: 72px; height: 72px; border-radius: 10px; }
    .mikor-nap, .mikor-datum, .mikor-ido { font-size: 1.6rem; }
    .letszam-nagy .szam { font-size: 2.8rem; }
    .palya { gap: 8px; padding: 10px; }
    .nevsor .avatar { width: 56px; height: 56px; }
    ol.nevsor > li::before { flex-basis: 1.7rem; font-size: 1.7rem; }
    /* keskeny kártyán a hosszú állapotcímke törhet két sorba, hogy a névnek több hely maradjon */
    .kartya-jobb { max-width: 6.5rem; }
    .kartya-jobb .allapot { white-space: normal; text-align: center; }
    .nevsor .nev-blokk .nev { overflow-wrap: break-word; hyphens: auto; font-size: 1rem; }
    .nevsor > li { gap: .55rem; }
    .nevsor .avatar { width: 50px; height: 50px; }
    ol.nevsor > li::before { flex-basis: 1.3rem; font-size: 1.5rem; }
    .terfel { gap: 4px; }
}

/* ==========================================================================
   Alkalom kezelése (szervezőknek) – /edzes/{id}/kezeles
   ========================================================================== */

.kezeles-fej .vissza { margin: 0 0 .5rem; font-weight: 600; }
.kezeles-fej .vissza a { text-decoration: none; }
.kezeles-fej .alcim b { color: var(--szoveg); }

.kezeles-racs {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 1.25rem 1.75rem;
    align-items: start;
}
.kezeles-racs .naplo-szakasz { grid-column: 1 / -1; }

/* pipálós névsor a levételhez */
.pipa-lista { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; }
.pipa-lista > li { padding: .5rem 0; border-top: 1px solid var(--vonal); }
.pipa-lista > li:first-child { border-top: 0; }
.pipa-lista .pipa > span { display: flex; flex-wrap: wrap; align-items: center; gap: .3rem .6rem; }

/* piros, telt gomb a végleges műveletekhez */
.gomb.veszely-tele { background: var(--betelt); border-color: var(--betelt); color: #fff; }
.gomb.veszely-tele:hover { filter: brightness(1.08); background: var(--betelt); border-color: var(--betelt); }

.korlevel-urlap { display: flex; flex-direction: column; gap: 1rem; }
.korlevel-urlap .kinek { margin-top: 0; display: flex; flex-direction: column; gap: .5rem; }
.korlevel-urlap .urlap-lab { margin-top: 0; }

/* napló */
.naplo-valaszto { margin-bottom: 1rem; max-width: 360px; }
.naplo-lista { list-style: none; margin: 0; padding: 0; font-size: .95rem; }
.naplo-lista > li {
    display: grid;
    grid-template-columns: 7.5rem 12rem minmax(0, 1fr);
    gap: .2rem 1rem;
    padding: .45rem 0;
    border-top: 1px solid var(--vonal);
}
.naplo-lista > li:first-child { border-top: 0; }
.naplo-lista time { color: var(--halvany); font-variant-numeric: tabular-nums; white-space: nowrap; }
.naplo-ki { font-weight: 600; overflow-wrap: anywhere; }
.naplo-mit { overflow-wrap: anywhere; color: var(--szoveg-2); }

.veszely-szakasz { border-color: color-mix(in srgb, var(--betelt) 45%, var(--vonal)); }
.veszely-szakasz h2 { color: var(--betelt); }

@media (max-width: 900px) {
    .kezeles-racs { grid-template-columns: minmax(0, 1fr); }
}
@media (max-width: 600px) {
    .naplo-lista > li { grid-template-columns: minmax(0, 1fr); }
    .naplo-lista time { font-size: .85rem; }
}

/* ==========================================================================
   Edzés beállításai (/edzes-beallitas) – új edzés is
   ========================================================================== */

/* szám, dátum, idő mezők ugyanúgy nézzenek ki, mint a többi */
input[type="number"], input[type="date"], input[type="time"] {
    font: inherit; width: 100%; min-height: 44px; padding: .5rem .75rem;
    color: var(--szoveg); background: var(--lap);
    border: 1px solid var(--vonal); border-radius: 8px;
}

/* bal: az űrlap, jobb: fix tagok, statisztika, törlés (mobilon egymás alatt) */
.beallitas-racs {
    display: grid;
    grid-template-columns: minmax(0, 3fr) minmax(0, 2fr);
    gap: 1.25rem 1.75rem;
    align-items: start;
}
.beallitas-racs > .beallitas-adatok:only-child { grid-column: 1 / -1; max-width: 760px; background:gray !important; }
/* az adatok doboz az edzés hangulatszínét kapja.
   Kép nélkül a --h-alap: a lapszínnél kicsit sötétebb szürke, hogy a (lapszínű) mezők kiváljanak belőle.
   Sötét módban ugyanez kicsit világosabb a lapnál. A 8%-ot nyugodtan állítsd. */
.beallitas-oldal { --h-alap: color-mix(in srgb, var(--szoveg) 8%, var(--lap)); }
.beallitas-adatok {
    background: var(--h-hatter);
    border-color: color-mix(in srgb, var(--h-eros) 35%, var(--vonal));
    box-shadow: 0 14px 36px rgba(15, 20, 25, .18), 0 3px 8px rgba(15, 20, 25, .10);
}
.beallitas-adatok > h2 { color: var(--h-eros); }
.beallitas-oldalso { display: flex; flex-direction: column; gap: 1.25rem; }
.beallitas-oldalso > .szakasz { margin: 0; }
@media (max-width: 900px) {
    .beallitas-racs { grid-template-columns: minmax(0, 1fr); }
}
.beallitas-urlap .csoport:first-of-type { margin-top: .5rem; }
.beallitas-urlap .mezo-racs { margin-top: .75rem; }
.beallitas-urlap .csoport > .pipa + .pipa { margin-top: .5rem; }
.beallitas-urlap .csoport > .pipa:first-of-type { margin-top: .75rem; }

/* választó sor (Minden héten / Egyszeri, Nyílt / Zárt) */
.valaszto-sor { display: flex; flex-wrap: wrap; gap: .5rem 1.5rem; margin-top: .75rem; }

/* ami csak az egyik választásnál kell, a másiknál eltűnik (JavaScript nélkül is működik) */
.beallitas-urlap:has(#ism-egyszer:checked) .csak-heti,
.beallitas-urlap:has(#ism-heti:checked) .csak-egyszeri,
.beallitas-urlap:has(#lat-nyilt:checked) .csak-zart,
.beallitas-urlap:has(#lat-zart:checked) .csak-nyilt { display: none; }
.lathatosag-csoport > .mezo { margin-top: .75rem; max-width: 420px; }

.allapot-cimke {
    display: inline-block; margin-left: .5rem; padding: .05rem .5rem;
    font-size: .8rem; font-weight: 700; letter-spacing: .03em;
    border-radius: 999px; box-shadow: inset 0 0 0 1.5px var(--halvany); color: var(--szoveg-2);
    vertical-align: middle;
}

/* tagkereső legördülő */
.tagkereso { position: relative; }
.tag-talalatok {
    position: absolute; z-index: 20; top: 100%; left: 0; right: 0; margin: .2rem 0 0; padding: .25rem 0;
    list-style: none; background: var(--lap); border: 1px solid var(--vonal); border-radius: 8px;
    box-shadow: 0 8px 24px rgb(0 0 0 / .14); max-height: 300px; overflow-y: auto;
}
.tag-talalatok > li { padding: .5rem .75rem; cursor: pointer; display: flex; gap: .5rem; align-items: baseline; }
.tag-talalatok > li span { color: var(--halvany); font-size: .9rem; }
.tag-talalatok > li:hover, .tag-talalatok > li[aria-selected="true"] { background: var(--sanc-halvany); color: #1f1205; }
.tag-talalatok > li.nincs { color: var(--halvany); cursor: default; background: none; }
/* edzésre felírásnál: aki ugyanazon a napon közeli / ütköző edzésen van vagy várakozik ("Nem elérhető ebben az időben") */
/* Főoldali tipp kártya (Pages/Index.cshtml, az Edzéseid és a felfedező doboz között) */
/* .fo-doboz.tipp-kartya: erősebb a sima .fo-doboz-nál (az később jön a fájlban, és felülírná a keretet, árnyékot) */
.fo-doboz.tipp-kartya {
    background: var(--sanc-halvany);                                 /* a SANC narancs halvány változata (sötét módban sötét barnás) */
    border: 3px solid var(--sanc);                                   /* SANC narancs keret */
    box-shadow: 0 8px 28px color-mix(in srgb, var(--sanc) 28%, transparent);
    transition: opacity .45s ease, transform .45s ease;
}
.tipp-stat { margin: .75rem 0 0; font-size: .72rem; color: var(--halvany); }   /* "X embernek volt hasznos…" */
.tipp-kartya.tipp-eltunik { opacity: 0; transform: translateY(-8px); }
.tipp-fej { display: flex; align-items: center; gap: .4rem; margin: 0 0 .35rem; color: var(--sanc-sotet); font-weight: 700; text-transform: uppercase; letter-spacing: .05em; font-size: .8rem; }
.tipp-fej .cimke { text-transform: none; letter-spacing: 0; font-weight: 600; }
.fo-doboz.tipp-kartya h2 { margin: 0 0 .5rem; color: var(--sanc-sotet); }   /* "TIPP: cím" SANC színnel */
.tipp-szoveg { margin: 0 0 1rem; white-space: pre-line; }   /* a tipp sortörései megmaradnak */
.tipp-valaszok { display: flex; flex-wrap: wrap; gap: .5rem;  }
.tipp-koszi { margin: 0; font-weight: 700; color: var(--sanc-sotet); text-align:center; margin-top:20px; }

/* Admin / Tippek */
.tipp-urlap { display: flex; flex-direction: column; gap: .9rem; max-width: 720px; }
.tipp-urlap textarea { width: 100%; }
.tipp-lista-szakasz, .tipp-mutatas-szakasz { margin-top: 2rem; }
.tipp-inaktiv { opacity: .6; }
.tipp-gombok { white-space: nowrap; }
.tipp-gombok form { display: inline; margin-left: .5rem; }
.tag-talalatok > li.foglalt,
.tag-talalatok > li.foglalt:hover,
.tag-talalatok > li.foglalt[aria-selected="true"] { opacity: .45; filter: grayscale(1); cursor: not-allowed; background: none; color: inherit; }

/* fix tagok listája */
.fej-szam { color: var(--halvany); font-weight: 500; margin-left: .25rem; }
.fix-lista { list-style: none; margin: 0 0 1rem; padding: 0; }
.fix-lista > li {
    display: flex; align-items: center; gap: .5rem;
    padding: .4rem 0; border-top: 1px solid var(--vonal);
}
.fix-lista > li:first-child { border-top: 0; }
.fix-lista .fix-sorszam { min-width: 2rem; font-weight: 700; color: var(--szoveg-2); font-variant-numeric: tabular-nums; }
.fix-lista .fix-nev { flex: 1; min-width: 0; overflow-wrap: anywhere; display: flex; flex-wrap: wrap; align-items: center; gap: .25rem .5rem; }
.fix-lista .fix-varo .fix-sorszam, .fix-lista .fix-varo .fix-nev { color: var(--halvany); }
.ugras-alkalomra { margin: .6rem 0 0; }
.fix-lista .fix-gombok { display: flex; gap: .25rem; margin: 0; }
.fix-lista.kerelmek > li { flex-wrap: wrap; }
.ikon-gomb {
    width: 36px; height: 36px; display: inline-grid; place-items: center;
    font: inherit; font-size: .85rem; color: var(--szoveg-2); background: transparent;
    border: 1px solid var(--vonal); border-radius: 8px; cursor: pointer;
}
.ikon-gomb:hover:not(:disabled) { border-color: var(--szoveg-2); color: var(--szoveg); }
.ikon-gomb:disabled { opacity: .35; cursor: default; }
.ikon-gomb.veszely:hover { border-color: var(--betelt); color: var(--betelt); }
.fix-uj { display: flex; gap: .5rem; align-items: flex-end; margin-top: .5rem; }
.fix-uj .mezo { flex: 1; min-width: 0; }
.fix-uj .gomb { min-height: 44px; }

/* statisztika */
.stat-racs { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: .75rem; margin: 0 0 1rem; }
.stat-racs > div { background: var(--papir); border-radius: 8px; padding: .6rem .75rem; }
.stat-racs dt { font-size: .85rem; color: var(--halvany); }
.stat-racs dd { margin: 0; font-family: var(--kijelzo); font-size: 1.8rem; line-height: 1.1; }
.alkalom-tortenet summary { cursor: pointer; font-weight: 600; }
.alkalom-tortenet ul { margin: .5rem 0 0; padding-left: 1.25rem; max-height: 320px; overflow-y: auto; font-size: .95rem; }

/* --- edzés beállításai: a borítókép doboza (a jobb hasáb tetején, a fix tagok fölött) --- */
.borito-szakasz { padding: .75rem; background: var(--h-hatter, var(--lap)); border-color: color-mix(in srgb, var(--h-eros, var(--sanc)) 35%, var(--vonal)); }
.borito-kep { position: relative; }
.borito-kep img {
    display: block; width: 100%; aspect-ratio: 16 / 9; object-fit: cover;
    height:200px;
    border-radius: 8px; background: var(--papir);
}
.borito-uj {   /* "Új kép" jelzés a kép sarkában, amíg nincs elmentve */
    position: absolute; left: .5rem; bottom: .5rem;
    padding: .15rem .6rem; border-radius: 999px; font-size: .85rem; font-weight: 700;
    background: var(--h-eros, var(--sanc)); color: var(--h-eros-szoveg, #1f1205);
}
.borito-uj[hidden] { display: none; }
.borito-gombok { display: flex; flex-wrap: wrap; align-items: center; gap: .5rem 1rem; margin-top: .75rem; }
.borito-valaszto { position: relative; cursor: pointer; }
.borito-valaszto input[type="file"] {   /* a fájlválasztó láthatatlan, a gomb felirata látszik */
    position: absolute; inset: 0; opacity: 0; cursor: pointer; width: 100%;
}
.borito-valaszto:focus-within { box-shadow: 0 0 0 3px color-mix(in srgb, var(--sanc) 35%, transparent); }
.borito-szakasz .segito { margin: .5rem 0 0; font-size: .88rem; }
.borito-szakasz .uzenet-hiba, .borito-szakasz .uzenet-ok { margin: .75rem 0 0; }
.borito-szakasz.tolt img { opacity: .5; }

/* ==========================================================================
   Főoldal – három hasáb: faliújság | edzések | versenyek, tagok
   Asztalon (1200px fölött) három hasáb; közepes képernyőn felül az edzések,
   alatta a faliújság és a jobb hasáb egymás mellett; mobilon egymás alatt.
   ========================================================================== */
.oldal.szeles { max-width: 1440px; }   /* a főoldal szélesebb, hogy kiférjen a három hasáb */

.fooldal-fej { margin-bottom: 1.5rem; }
.fej-gombok { display: flex; gap: .6rem; flex-wrap: wrap; }

.fooldal-racs {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    grid-template-areas: "kozep" "fali" "jobb";
    gap: 1.5rem;
    align-items: start;
}
.fo-kozep { grid-area: kozep; display: flex; flex-direction: column; gap: 1.5rem; min-width: 0; container-type: inline-size; }
.fo-fali { grid-area: fali; min-width: 0; }
.fo-jobb { grid-area: jobb; display: flex; flex-direction: column; gap: 1.5rem; min-width: 0; }
@media (min-width: 760px) {
    .fooldal-racs { grid-template-columns: minmax(0, 1.25fr) minmax(0, 1fr); grid-template-areas: "kozep kozep" "fali jobb"; }
}
/* Mobilon (egy hasáb) a dobozok saját sorrendben, a hasábokon átnyúlva:
   Edzéseid, (tipp), Felfedező, Faliújság, Hírek, Versenyek, Térkép, Napi bemutatkozó, Legújabb tagjaink */
@media (max-width: 759px) {
    .fooldal-racs { display: flex; flex-direction: column; align-items: stretch; gap: 1.5rem; }   /* stretch: teljes szélesség (a konténer-dobozok különben összeesnek) */
    .fooldal-racs > .fo-kozep, .fooldal-racs > .fo-jobb { display: contents; }
    .fo-kozep > .fo-doboz { container-type: inline-size; }   /* a hasáb helyett a doboz a konténer (az edzéssorok elrendezéséhez) */
    #edzeseid { order: 1; }
    #tipp { order: 2; }
    #felfedezo { order: 3; }
    #fali { order: 4; }
    #hirek { order: 5; }
    #versenyek { order: 6; }
    #terkep { order: 7; }
    #napitag { order: 8; }
    #ujtagok { order: 9; }
    #kulondijak { order: 10; }   /* mobilon a különdíjasok legalul */
}
@media (min-width: 1200px) {
    .fooldal-racs {
        grid-template-columns: minmax(0, 1fr) minmax(0, 1.35fr) minmax(0, .9fr);   /* faliújság | edzések | jobb hasáb */
        grid-template-areas: "fali kozep jobb";
    }
}

/* a dobozok */
.fo-doboz {
    background: var(--lap);
    border: 1px solid var(--vonal);
    border-radius: var(--kerekites);
    padding: 1.1rem 1.15rem 1.25rem;
    scroll-margin-top: 84px;
    box-shadow: rgba(0, 0, 0, 0.1) 0px 10px 50px;
}
/* a főoldali szakaszok címei (Faliújság, Edzéseid, Versenyek, Napi bemutatkozó, Legújabb tagjaink…): itt közösen állíthatók */
    .fo-doboz > h2, .fo-doboz .szekcio-fej h2, .fo-doboz .osszecsukhato > summary h2 {
        font-size: 1.5rem;
        text-shadow: 4px 3px 10px rgba(0,0,0,0.24);
        text-transform:uppercase;
    }
.fo-doboz .szekcio-fej a { font-weight: 600; font-size: .95rem; white-space: nowrap; }
.fo-doboz > .segito { margin: -.4rem 0 .9rem; }
.fo-doboz .nap-blokk { margin-bottom: 1.25rem; }
.fo-doboz .nap-blokk:last-child { margin-bottom: 0; }
.fo-doboz .nap-cim .nap-nev { font-size: 1.5rem; }

/* keskeny középső hasábban az edzéssorok a mobilos elrendezést kapják (konténer szerint) */
@container (max-width: 620px) {
    .edzes {
        grid-template-columns: 96px minmax(0, 1fr);
        grid-template-areas: "kep adatok" "kep letszam";
        padding: .85rem 1rem .85rem .85rem;
        gap: .2rem .85rem;
        align-items: start;
    }
    .edzes-kep { grid-area: kep; width: 96px; height: 54px; }
    .edzes-adatok { grid-area: adatok; }
    .letszam { grid-area: letszam; text-align: left; min-width: 0; display: flex; flex-wrap: wrap; align-items: center; gap: .3rem .75rem; margin-top: .35rem; }
    .letszam-szoveg { margin-top: 0; white-space: nowrap; }
    .helyek-sav { margin-left: 0; width: 96px; }
    .edzes-ido { display: none; }
    .mobil-ido { display: inline; }
    .edzes-nev .mobil-ido { font-family: var(--kijelzo); font-weight: 400; font-size: 1.35rem; margin-right: .4rem; letter-spacing: .02em; }
}

/* --- fülek a "fedezz fel" dobozban --- */
.fo-fulek { display: flex; gap: .35rem; flex-wrap: wrap; margin: 0 0 1rem; }
.fo-fulek a {
    padding: .35rem .85rem; border-radius: 999px; border: 1px solid var(--vonal);
    color: var(--szoveg); text-decoration: none; font-weight: 600; font-size: .92rem;
}
.fo-fulek a:hover { border-color: var(--szoveg-2); }
.fo-fulek a[aria-current="true"] { background: var(--kiemelt-hatter); border-color: var(--kiemelt-hatter); color: var(--kiemelt-szoveg); }

/* --- edzéskártyák (felfedezés): kép felül, alatta az adatok, az edzés hangulatszínével --- */
.edzes-kartyak { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(200px, 1fr)); gap: .9rem; }
.edzes-kartya {
    --hk-hatter: var(--hv-hatter, var(--papir));
    display: flex; flex-direction: column; height: 100%;
    border: 1px solid var(--vonal); border-radius: var(--kerekites); overflow: hidden;
    background: var(--hk-hatter); color: inherit; text-decoration: none;
    transition: transform .12s ease, box-shadow .12s ease;
}
:root[data-theme="dark"] .edzes-kartya { --hk-hatter: var(--hs-hatter, var(--papir)); }
@media (prefers-color-scheme: dark) { :root:not([data-theme]) .edzes-kartya { --hk-hatter: var(--hs-hatter, var(--papir)); } }
.edzes-kartya:hover { transform: translateY(-2px); box-shadow: 0 6px 18px rgb(0 0 0 / .12); }
.edzes-kartya img { width: 100%; aspect-ratio: 16 / 9; height: auto; object-fit: cover; display: block; }
.ek-test { display: flex; flex-direction: column; gap: .15rem; padding: .65rem .8rem .8rem; }
.ek-mikor { font-family: var(--kijelzo); font-size: 1.25rem; line-height: 1.05; letter-spacing: .02em; }
.ek-nev { font-weight: 700; line-height: 1.25; overflow-wrap: anywhere; }
.ek-hely { color: var(--szoveg-2); font-size: .9rem; }
.ek-letszam { font-size: .9rem; color: var(--szabad); margin-top: .2rem; display: flex; flex-wrap: wrap; gap: .25rem .6rem; }
.ek-letszam.betelt { color: var(--betelt); font-weight: 600; }
.ek-uzenet { color: var(--halvany); }

/* --- faliújság --- */
.fali-iras { margin-bottom: 1.25rem; }
.fali-iras textarea { min-height: 4.5rem; }
.fali-iras .urlap-lab { margin-top: .6rem; justify-content: flex-end; }
.fali-opciok { margin-top: .5rem; }
.fali-opciok summary { cursor: pointer; color: var(--szoveg-2); font-size: .92rem; font-weight: 600; }
.fali-opciok .mezo { margin-top: .6rem; }

.fali-lista { list-style: none; margin: 0; padding: 0; }
.fali-uzenet { padding: 1rem 0; border-top: 2px solid color-mix(in srgb, var(--vonal) 70%, var(--szoveg) 30%); scroll-margin-top: 84px; }   /* erősebb elválasztás a bejegyzések között */
.fali-uzenet:first-child { border-top: 0; padding-top: .25rem; }
.fali-fej { display: flex; align-items: center; gap: .7rem; margin-bottom: .5rem; }
.fali-fej .avatar { width: 64px; height: 64px; border-radius: 4px; border-color: color-mix(in srgb, var(--papir) 82%, #000); }   /* a SANC narancs helyett a papír színének sötétebb változata */
.fali-fej .monogram-kicsi { font-size: .9rem; }

.fali-fej .plakett 
{
    width: 44px; 
    height: 44px; 
    right: -22px; 
    top : -8px; 
    padding: 1px; 

}
.fali-ki { display: flex; flex-direction: column; min-width: 0; }
.fali-nev { font-weight: 700; color: var(--szoveg); text-decoration: none; overflow-wrap: anywhere; }
a.fali-nev:hover { text-decoration: underline; }
.fali-meta { display: flex; flex-wrap: wrap; align-items: center; gap: .2rem .5rem; color: var(--halvany); font-size: .85rem; }
.fali-szoveg { overflow-wrap: anywhere; line-height: 1.14; font-size: 1rem; }   /* a faliújság üzenetek szövege */
.fali-uzenet.csoportos { background: linear-gradient(90deg, color-mix(in srgb, var(--sanc) 6%, transparent), transparent 60%); }

/* üzenethez kapcsolt edzés: kis kártya az edzés hangulatszínével */
.fali-edzes {
    --hk-hatter: var(--hv-hatter, var(--papir));
    display: flex; gap: .7rem; align-items: center; margin-top: .65rem; padding: .45rem;
    border: 1px solid var(--vonal); border-radius: 8px; background: var(--hk-hatter);
    color: inherit; text-decoration: none; font-size: .92rem;
}

:root[data-theme="dark"] .fali-edzes { --hk-hatter: var(--hs-hatter, var(--papir)); }
@media (prefers-color-scheme: dark) { :root:not([data-theme]) .fali-edzes { --hk-hatter: var(--hs-hatter, var(--papir)); } }
.fali-edzes img { width: 96px; height: 54px; object-fit: cover; border-radius: 6px; flex-shrink: 0; }
.fali-edzes > span { display: flex; flex-direction: column; min-width: 0; }
.fali-edzes > span > span { color: var(--szoveg-2); }
.fali-edzes > span > span b { color: var(--szabad); font-weight: 700; }
.fali-edzes:hover b:first-child { text-decoration: underline; }
.fali-edzes.mult { opacity: .6; }

.fali-lab { display: flex; flex-wrap: wrap; align-items: center; gap: .5rem 1rem; margin-top: .6rem; font-size: .9rem; }
.szavaz { display: flex; align-items: center; gap: .3rem; margin: 0; }
.szavaz-gomb {
    width: 34px; height: 34px; display: inline-grid; place-items: center;
    border: 1px solid var(--vonal); border-radius: 999px; background: transparent;
    color: var(--halvany); cursor: pointer;
}
.szavaz-gomb:hover { color: var(--szoveg); border-color: var(--szoveg-2); }
/* a saját szavazat: csak a kézjel színes (a kör marad), tetszik = fejléc színe, nem tetszik = piros */
.szavaz-gomb.aktiv { color: var(--fejlec-hatter); background: transparent; border-color: var(--vonal); }
.szavaz-gomb.nem.aktiv { color: var(--betelt); background: transparent; border-color: var(--vonal); }
/* sötét témában a fejléc színe (grafit) nem látszana a sötét háttéren: ott világoskék */
:root[data-theme="dark"] .szavaz-gomb.aktiv:not(.nem) { color: #8a9cf0; }
@media (prefers-color-scheme: dark) { :root:not([data-theme]) .szavaz-gomb.aktiv:not(.nem) { color: #8a9cf0; } }
/* a "2 wow" felirat: könnyedebb, kisebb */
.szavazat { min-width: 1.6rem; text-align: center; font-weight: 400; font-size: .82rem; color: var(--halvany); font-variant-numeric: tabular-nums; }
.fali-szerk summary { cursor: pointer; color: var(--szoveg-2); font-weight: 600; }
.fali-szerk[open] { flex-basis: 100%; order: 5; }
.fali-szerk form { margin-top: .5rem; }
.fali-szerk .urlap-lab { margin-top: .5rem; }
.fali-torles { margin: 0; }

/* --- versenyek --- */
.verseny-lista { list-style: none; margin: 0; padding: 0; }
.verseny-lista > li + li { border-top: 1px solid var(--vonal); }
.verseny-lista a { display: flex; gap: .85rem; padding: .7rem 0; color: inherit; text-decoration: none; }
.verseny-lista a:hover b { text-decoration: underline; }
.verseny-datum {
    flex: 0 0 52px; height: 56px; display: flex; flex-direction: column; align-items: center; justify-content: center;
    border-radius: 8px; background: var(--grafit); color: #fff; line-height: 1;
}
.vd-honap { font-size: .92rem; text-transform: uppercase; letter-spacing: .06em; color: var(--sanc); font-weight: 700; }
.vd-nap { font-family: var(--kijelzo); font-size: 1.7rem; }
.verseny-adat { display: flex; flex-direction: column; gap: .15rem; min-width: 0; }
.verseny-adat b { overflow-wrap: anywhere; }
.verseny-adat .halvany { color: var(--halvany); font-size: .88rem; }
.verseny-hir { font-size: .88rem; color: var(--szoveg-2); }
.verseny-adat .cimkek { margin-top: .2rem; }

/* --- a nap tagja --- */
.napi-tag h2 { margin-bottom: .75rem; }   /* a betűméret a közös szakaszcímből jön */
.napi-tag-kartya { display: flex; flex-direction: column; align-items: center; text-align: center; gap: .15rem; color: inherit; text-decoration: none; }
.napi-tag-kartya img {
    width: 300px; height: 300px; object-fit: cover; border-radius: 10px;
    border: 1px solid var(--halvany); box-shadow: 0 4px 14px rgb(0 0 0 / .15); margin-bottom: .5rem;
}
.napi-tag-nev { font-family: var(--kijelzo); font-size: 1.8rem; line-height: 1; }
.napi-tag-kartya:hover .napi-tag-nev { color: var(--sanc-sotet); }
.napi-tag-szamok { display: flex; justify-content: center; gap: 1.25rem; margin: .9rem 0; text-align: center; }
.napi-tag-szamok div { display: flex; flex-direction: column-reverse; }
.napi-tag-szamok dt { font-size: .78rem; color: var(--halvany); }
.napi-tag-szamok dd { margin: 0; font-family: var(--kijelzo); font-size: 1.7rem; line-height: 1; }
.napi-tag-bemutat {
    margin: 0 0 1rem; padding: .7rem .9rem; border-left: 3px solid var(--sanc);
    background: var(--papir); border-radius: 0 8px 8px 0; font-size: .93rem; color: var(--szoveg-2); font-style: italic;
}
.napi-tag .gomb { width: 100%; }

/* --- legújabb tagok --- */
.uj-tagok { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: .9rem .5rem; }
.uj-tagok a { display: flex; flex-direction: column; align-items: center; text-align: center; gap: .2rem; color: inherit; text-decoration: none; }
.uj-tagok .avatar { width: 74px; height: 74px; border-radius: 50%; border: 2px solid var(--vonal); }
.uj-tagok .monogram-kicsi { font-size: 1.1rem; }
.uj-tagok a:hover .avatar { border-color: var(--sanc); }
.ut-nev { font-weight: 600; font-size: .88rem; line-height: 1.2; overflow-wrap: anywhere; }
.ut-info { font-size: .78rem; color: var(--halvany); }
@media (max-width: 600px) {
    .fo-doboz { padding: .9rem .85rem 1rem; }
    .fo-doboz .edzes-lista { margin: 0 -.35rem; }
    .fej-gombok .gomb { flex: 1; }
}

/* --- faliújság: új üzenet szakasz, SANC narancs keretben --- */
.fali-iras {
    border: 1px solid var(--halvany);
    border-radius: var(--kerekites);
    padding: .80rem .90rem 1rem;
    background: var(--lap);
    margin-bottom: 1rem;
}
.fali-uj-cim { font-size: 1rem; margin: 0 0 .5rem; color: var(--szoveg;) }
:root[data-theme="dark"] .fali-uj-cim { color: var(--sanc); }
@media (prefers-color-scheme: dark) { :root:not([data-theme]) .fali-uj-cim { color: var(--sanc); } }

/* --- edzéshez kötött üzenet: maga az üzenet NEM színes (olyan, mint a többi); csak a benne lévő edzéskártya
   használja az edzés színeit (a változókat az üzenet <li>-je kapja a Hangulat.Css-ből) --- */
.fali-uzenet.edzeshez {
    --hk-hatter: var(--hv-hatter, var(--papir));
    --hk-eros: var(--hv-eros, var(--sanc));
}
:root[data-theme="dark"] .fali-uzenet.edzeshez { --hk-hatter: var(--hs-hatter, var(--papir)); --hk-eros: var(--hs-eros, var(--sanc)); }
@media (prefers-color-scheme: dark) {
    :root:not([data-theme]) .fali-uzenet.edzeshez { --hk-hatter: var(--hs-hatter, var(--papir)); --hk-eros: var(--hs-eros, var(--sanc)); }
}
/* a kapcsolt edzés kis kártyája: az edzés háttérszínével, erős színű kerettel és névvel */
.fali-uzenet.edzeshez .fali-edzes {
    background: var(--hk-hatter);   /* az edzés háttérszíne (kép nélkül: halvány szürke) */
    border-color: color-mix(in srgb, var(--hk-eros) 35%, var(--vonal));
}
.fali-uzenet.edzeshez .fali-edzes > span > b { color: var(--hk-eros); }

/* --- főoldal: idővonal a következő 7 napról (Edzéseid doboz teteje) ---
   Vízszintes vonal, rajta naponta egy kerek pötty: üres, ha nincs edzésed, az edzés színével teli, ha van.
   Keskeny dobozban (mobil) függőleges lesz. */
.idovonal {
    --iv-potty: 18px;
    list-style: none; margin: 0 0 1.25rem; padding: 0;
    display: grid; grid-template-columns: repeat(7, minmax(0, 1fr));
    position: relative;
}
.idovonal::before {   /* a vonal a pöttyök közepén */
    content: ""; position: absolute; left: calc(100% / 14); right: calc(100% / 14);
    top: calc(2.6rem + var(--iv-potty) / 2 - 1px); height: 2px;
    background: var(--vonal);
}
.iv-nap {
    --hk-eros: var(--hv-eros, var(--sanc));
    position: relative; display: flex; flex-direction: column; align-items: center; text-align: center; min-width: 0;
}
:root[data-theme="dark"] .iv-nap { --hk-eros: var(--hs-eros, var(--sanc)); }
@media (prefers-color-scheme: dark) { :root:not([data-theme]) .iv-nap { --hk-eros: var(--hs-eros, var(--sanc)); } }
.iv-fej { height: 2.6rem; display: flex; flex-direction: column; justify-content: flex-end; line-height: 1.15; }
.iv-napnev { font-weight: 700; font-size: .85rem; }
.iv-datum { font-size: .75rem; color: var(--halvany); }
.iv-nap.ma .iv-napnev { color: var(--sanc-sotet); }
.iv-potty {
    position: relative; z-index: 1;
    width: var(--iv-potty); height: var(--iv-potty); border-radius: 50%;
    background: var(--lap); border: 2px solid color-mix(in srgb, var(--szoveg-2) 45%, transparent);
    margin: 0 0 .4rem;
}
.iv-nap.van .iv-potty {   /* edzésnap: teli pötty az edzés színével */
    background: var(--hk-eros); border-color: var(--hk-eros);
    box-shadow: 0 0 0 4px color-mix(in srgb, var(--hk-eros) 22%, transparent);
}
/* ha aznap csak várólistán van: szürke pötty, és az edzés ideje is szürke */
.iv-nap.van.varakozo .iv-potty {
    background: var(--halvany); border-color: var(--halvany);
    box-shadow: 0 0 0 4px color-mix(in srgb, var(--halvany) 22%, transparent);
}
.iv-edzesek a.varakozo b { color: var(--halvany); }
.iv-edzesek { display: flex; flex-direction: column; gap: .3rem; width: 100%; padding: 0 .15rem; }
.iv-edzesek a { display: flex; flex-direction: column; color: inherit; text-decoration: none; font-size: .6rem; line-height: 1.2; }
.iv-edzesek a b { color: var(--hk-eros); font-size: .95rem; }
.iv-edzesek a span { overflow: hidden; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow-wrap: anywhere; }
.iv-edzesek a:hover span { text-decoration: underline; }
.iv-edzesek a.elmarad { opacity: .6; text-decoration: line-through; }

/* keskeny dobozban függőleges idővonal: balra a pöttyök, mellettük a nap és az edzések */
@container (max-width: 520px) {
    .idovonal { --iv-cimke: 7.2rem; grid-template-columns: minmax(0, 1fr); gap: .15rem; }   /* a nap neve + dátum oszlop szélessége */
    .idovonal::before { left: calc(var(--iv-cimke) + .7rem + var(--iv-potty) / 2 - 1px); right: auto; top: .6rem; bottom: .6rem; width: 2px; height: auto; }
    .iv-nap { display: grid; grid-template-columns: var(--iv-cimke) var(--iv-potty) minmax(0, 1fr); column-gap: .7rem; align-items: start; text-align: left; min-height: 1.9rem; }
    .iv-fej { height: auto; flex-direction: row; align-items: baseline; gap: .35rem; justify-content: flex-start; padding-top: .05rem; white-space: nowrap; }
    .iv-potty { margin: .1rem 0 0; }
    .iv-edzesek { padding: 0; }
    .iv-edzesek a { flex-direction: row; gap: .45rem; align-items: baseline; font-size: .9rem; }
    .iv-edzesek a span { -webkit-line-clamp: 1; }
}
.szavaz.tolt { opacity: .6; pointer-events: none; }

/* versenyek: a főkép a sor fölött, teljes szélességben */
.verseny-lista a { flex-wrap: wrap; }
.verseny-kep {
    flex-basis: 100%; width: 100%; height: auto; aspect-ratio: 16 / 9; object-fit: cover;
    border-radius: 8px; background: var(--papir);
}

/* versenyek: a város a dátum mellett, kiemelve */
.verseny-varos {
    display: inline-flex; align-items: center; gap: .25rem;
    font-size: .78rem; font-weight: 700; text-transform: uppercase; letter-spacing: .04em;
    color: var(--sanc-sotet);
}
:root[data-theme="dark"] .verseny-varos { color: var(--sanc); }
@media (prefers-color-scheme: dark) { :root:not([data-theme]) .verseny-varos { color: var(--sanc); } }

/* tagkereső legördülő: avatar + név + város */
.tag-talalatok > li { align-items: center; gap: .65rem; padding: .4rem .75rem; }
.tt-avatar { width: 40px; height: 40px; border-radius: 50%; object-fit: cover; flex-shrink: 0; background: var(--papir); }
.tt-monogram {
    display: inline-grid; place-items: center; border: 1px solid var(--vonal);
    color: var(--szoveg-2); font-size: .85rem; font-weight: 700;
}
.tag-talalatok > li .tt-szoveg { display: flex; flex-direction: column; min-width: 0; color: inherit; font-size: inherit; line-height: 1.25; }
.tag-talalatok > li .tt-szoveg b { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.tag-talalatok > li .tt-szoveg span { color: var(--halvany); font-size: .85rem; }
.tag-talalatok > li[aria-selected="true"] .tt-szoveg span, .tag-talalatok > li:hover .tt-szoveg span { color: #5b4a3a; }

/* főoldal "fedezz fel" doboz: magától lapoz (site.js). Lent egy vékony csík mutatja, mikor jön a következő lap. */
.fo-lap:not([hidden]) { animation: lap-be .35s ease; }
@keyframes lap-be { from { opacity: 0; transform: translateY(4px); } to { opacity: 1; transform: none; } }
.lapozo-csik { height: 3px; margin-top: 1rem; border-radius: 2px; background: var(--vonal); overflow: hidden; }
.lapozo-csik span { display: block; height: 100%; width: 0; background: var(--sanc); transition: width .1s linear; }
.lapozo-kezi .lapozo-csik { display: none; }   /* ha valaki maga választott fület, vagy nincs JavaScript-es lapozás */
html:not(.js) .lapozo-csik { display: none; }

/* ==========================================================================
   Edzés oldal: létszám egy sorban, kisebb pöttyök, névsor nézetváltó    box-shadow: 0 14px 36px rgba(15, 20, 25, .1), 0 3px 8px rgba(15, 20, 25, .10);
    background:var(--sotet);
   ========================================================================== */
.letszam-sor { margin: 0 0 .6rem; }   /* "8 / 12 hely foglalt · 4 szabad hely" – sima szöveg */

/* kisebb foglaltsági pöttyök a pályán */
.palya { padding: 8px 10px; gap: 8px; }
.terfel { grid-template-columns: repeat(var(--oszlop), minmax(0, 14px)); gap: 4px; }
.palya i { border-width: 1.5px; }

.resztvevok {
    /*box-shadow: 0 14px 36px rgba(15, 20, 25, .1), 0 3px 8px rgba(15, 20, 25, .10);*/
    background: transparent;
    border:none !important;
}
    /* a Résztvevők cím és mellette a nézetváltó */
    .resztvevok-fej {
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: .5rem 1rem;
        flex-wrap: wrap;
        margin-bottom: .75rem;
    }

        .resztvevok-fej h2 {
            margin: 0;
        }

    .nezet-valto {
        display: inline-flex;
        border: 1px solid var(--vonal);
        border-radius: 999px;
        padding: 2px;
        background: var(--lap);
    }

        .nezet-valto button {
            font: inherit;
            font-size: .88rem;
            font-weight: 600;
            cursor: pointer;
            padding: .3rem .8rem;
            border: 0;
            border-radius: 999px;
            background: transparent;
            color: var(--szoveg-2);
        }

            .nezet-valto button[aria-pressed="true"] {
                background: var(--kiemelt-hatter);
                color: var(--kiemelt-szoveg);
            }

    html:not(.js) .nezet-valto {
        display: none;
    }
    /* a nézetváltó alatt a kisebb "Mind / Ott lesz" kapcsoló */
    .nevsor-kapcsolok { display: flex; flex-direction: column; align-items: flex-end; gap: .35rem; }
    .nezet-valto.kicsi button { font-size: .76rem; padding: .18rem .65rem; }
    /* "Ott lesz": a lemondottak elrejtése a névsorból (a várólista marad) */
    .resztvevok.csak-bent ol.nevsor > li.lemondott { display: none; }
    /* LISTA nézet (alap): csak sorszám – név – státusz, egy sorban, kép, dátumok és kuka nélkül */
    .nevsor-lista .nevsor {
        gap: .3rem;
    }

        .nevsor-lista .nevsor > li {
            align-items: center;
            padding: .25rem .6rem .25rem .2rem;
            min-height: 0;
        }

    .nevsor-lista ol.nevsor > li::before {
        font-size: 1.5rem;
        flex-basis: 2rem;
        padding-top: 0;
    }

    .nevsor-lista .avatar-keret,
    .nevsor-lista .nev-info,
    .nevsor-lista .sor-muvelet {
        display: none;
    }

    .nevsor-lista .nev-blokk {
        gap: 0;
    }

        .nevsor-lista .nev-blokk .nev {
            font-size: 1rem;
        }

    .nevsor-lista .kartya-jobb {
        flex-direction: row;
        align-items: center;
        max-width: none;
    }

        .nevsor-lista .kartya-jobb .allapot {
            white-space: nowrap;
        }

    .nevsor-lista .varolista > li::before {
        font-size: 1rem !important;
    }
    /* --- faliújság: összecsukható "Új üzenet írása" és lapozás --- */
    details.fali-iras > summary {
        cursor: pointer;
        list-style: none;
        display: flex;
        align-items: center;
        justify-content: space-between;
        margin: 0;
    }

        details.fali-iras > summary::-webkit-details-marker {
            display: none;
        }

        details.fali-iras > summary::after {
            content: "+";
            font-size: 1.4rem;
            line-height: 1;
        }

    details.fali-iras[open] > summary {
        margin-bottom: .6rem;
    }

        details.fali-iras[open] > summary::after {
            content: "–";
        }

    details.fali-iras:not([open]) {
        padding-top: .6rem;
        padding-bottom: .6rem;
    }

    .fali-lapozo {
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: .5rem;
        margin-top: 1rem;
    }

        .fali-lapozo[hidden] {
            display: none;
        }

        .fali-lapozo button:disabled {
            opacity: .4;
            cursor: default;
        }

    .fali-lapszam {
        color: var(--halvany);
        font-size: .9rem;
        font-variant-numeric: tabular-nums;
    }

    .fali-csik {
        margin-top: .6rem;
    }

        .fali-csik[hidden] {
            display: none;
        }

    .fali-uzenet[hidden] {
        display: none;
    }
    /* ==========================================================================
   Tag profil (/tag/123)
   ========================================================================== */
    .tag-fej {
        display: grid;
        grid-template-columns: auto minmax(0, 1fr);
        gap: 1.5rem 2rem;
        align-items: center;
        background: var(--lap);
        border: 1px solid var(--vonal);
        border-radius: var(--kerekites);
        padding: 1.5rem;
        margin-bottom: 1.5rem;
    }

    /* --tag-szin: a profilkép átlagszíne (Pages/Tag.cshtml, a .tag-oldal-on). A --tag-alap ennek sötétebb árnyalata;
       ezt keverjük a lap színébe, így világos és sötét módban is olvasható marad a szöveg. */
    .tag-oldal[style*="--tag-szin"] {
        --tag-alap: color-mix(in srgb, var(--tag-szin) 50%, #000);   /* sötétítés: kisebb % = sötétebb */
    }
    .tag-oldal[style*="--tag-szin"] .tag-fej {
        background: linear-gradient(90deg, color-mix(in srgb, var(--tag-alap) 36%, var(--lap)), color-mix(in srgb, var(--tag-alap) 18%, var(--lap)));
        border-color: color-mix(in srgb, var(--tag-alap) 45%, var(--lap));
    }
    /* a többi szakasz (Közelgő edzések, Játszótársak, Értékelése, Számokban…): egyszínű, halványabb */
    .tag-oldal[style*="--tag-szin"] .szakasz {
        background: color-mix(in srgb, var(--tag-alap) 16%, var(--lap));
        border-color: color-mix(in srgb, var(--tag-alap) 35%, var(--lap));
    }

    .tag-kep-keret {
        position: relative;
        line-height: 0;
    }

    .tag-kep {
        width: 320px;
        height: 320px;
        object-fit: cover;
        border-radius: 16px; /* a profilkép mérete */
        border: 4px solid var(--sanc);
        box-shadow: 0 6px 20px rgb(0 0 0 / .15);
        background: var(--papir);
    }

    /* kép nélkül fele akkora a monogram, így a fejléc is alacsonyabb */
    .tag-fej.kep-nelkul .tag-kep { width: 160px; height: 160px; }
    .tag-fej.kep-nelkul .tag-monogram { font-size: 3rem; }
    .tag-fej.kep-nelkul .tag-plakett { width: 78px; height: 78px; right: -30px; top: -10px; }

    .tag-monogram {
        display: grid;
        place-items: center;
        font-family: var(--kijelzo);
        font-size: 5rem;
        color: var(--szoveg-2);
        line-height: 1;
    }

    .tag-plakett {
        width: 156px;
        height: 156px;
        right: -60px;
        top: -14px;
    }

    .tag-fej h1 {
        margin: 0;
    }

    .tag-becenev {
        margin: .25rem 0 0;
        color: var(--szoveg-2);
        font-style: italic;
    }

    .tag-hol {
        display: flex;
        flex-wrap: wrap;
        gap: .25rem 1.25rem;
        margin: .6rem 0 0;
        color: var(--szoveg-2);
    }

        .tag-hol span {
            display: inline-flex;
            align-items: center;
            gap: .3rem;
        }

    .tag-cimkek {
        margin-top: .9rem;
    }

        .tag-cimkek .cimke {
            font-size: .88rem;
            padding: .2rem .7rem;
        }

    /* Tagjaink: profilkép nélkül nincs képkeret, és a kártya csak akkora, amekkora a tartalma (nem nyúlik a sor magasságáig) */
    .tag-kartyak > li:has(> .tag-kartya.kep-nelkul) { align-self: start; }
    .tag-kartya.kep-nelkul { height: auto; }
    /* kép nélkül a támogatói plakett a név mellett */
    .tag-kartya .plakett.tk-nev-plakett { position: static; width: 26px; height: 26px; vertical-align: middle; margin-left: .35rem; }

    /* Tagjaink: aktivitási kategória (tooltipben a leírás) és az edzések száma */
    .cimke.tag-aktivitas { cursor: help; }
    .cimke.tag-edzesszam { font-variant-numeric: tabular-nums; }
    .cimke.tag-csapat {
        background: var(--sanc);
        border-color: var(--sanc);
        color: #1f1205;
    }

    .cimke.tag-tamogato {
        background: var(--sanc-halvany);
        border-color: transparent;
        color: var(--sanc-sotet);
    }

    .tag-fej-gombok {
        display: flex;
        flex-wrap: wrap;
        gap: .6rem;
        margin-top: 1.1rem;
    }

        .tag-fej-gombok:empty {
            display: none;
        }

    .tag-racs {
        display: grid;
        grid-template-columns: minmax(0, 1.7fr) minmax(0, 1fr);
        gap: 1.5rem;
        align-items: start;
    }

    .tag-fo, .tag-oldalso {
        display: flex;
        flex-direction: column;
        gap: 1.5rem;
        min-width: 0;
    }

        .tag-fo > .szakasz, .tag-oldalso > .szakasz {
            margin: 0;
        }

    .tag-kozelgo {
        list-style: none;
        margin: 0;
        padding: 0;
    }

        .tag-kozelgo li + li {
            border-top: 1px solid var(--vonal);
        }

        .tag-kozelgo a {
            display: grid;
            grid-template-columns: 11rem minmax(0, 1fr);
            gap: .1rem 1rem;
            padding: .55rem 0;
            color: inherit;
            text-decoration: none;
        }

        .tag-kozelgo time {
            font-family: var(--kijelzo);
            font-size: 1.2rem;
            grid-row: span 2;
            color: var(--sanc-sotet);
        }

        .tag-kozelgo a:hover b {
            text-decoration: underline;
        }

        .tag-kozelgo .halvany {
            color: var(--halvany);
            font-size: .9rem;
        }
    /* akikkel együtt játszott: kis névjegyek; aki az átlagnál többször, narancs számmal */
    .tarsak {
        list-style: none;
        margin: 0;
        padding: 0;
        display: grid;
        grid-template-columns: repeat(auto-fill, minmax(150px, 1fr));
        gap: .6rem;
    }

        .tarsak a {
            display: grid;
            grid-template-columns: auto minmax(0, 1fr);
            grid-template-rows: auto auto;
            column-gap: .6rem;
            align-items: center;
            padding: .45rem;
            border: 1px solid var(--vonal);
            border-radius: 10px;
            color: inherit;
            text-decoration: none;
            background: var(--papir);
        }

            .tarsak a:hover {
                border-color: var(--sanc);
            }

        .tarsak .avatar-keret {
            grid-row: span 2;
            margin-right: 0;
        }

        .tarsak .avatar {
            width: 68px;
            height: 68px;
            border-radius: 8px;
            border: 1px solid #888888;
        }

        .tarsak .monogram-kicsi {
            font-size: .95rem;
        }

        .tarsak .plakett {
            width: 40px;
            height: 40px;
            right: -6px;
            bottom: -6px;
            padding: 1px;
        }

    .tars-nev {
        font-weight: 400;
        font-size: .96rem;
        line-height: 1.0;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

    .tars-db {
        font-size: .8rem;
        color: var(--halvany);
    }

    .tarsak .gyakori .tars-db {
        color: var(--sanc-sotet);
        font-weight: 700;
    }

    .tag-adatok {
        display: grid;
        grid-template-columns: auto minmax(0, 1fr);
        gap: .35rem 1rem;
        margin: 0;
    }

        .tag-adatok dt {
            color: var(--halvany);
            font-size: .9rem;
        }

        .tag-adatok dd {
            margin: 0;
            overflow-wrap: anywhere;
        }

    .tag-oldalso .stat-racs {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

        .tag-oldalso .stat-racs + .tag-adatok {
            margin-top: .5rem;
        }
    /* szintértékelés: öt lépcső, az átlag szerinti kiemelve */
    .szint-skala {
        list-style: none;
        margin: 0 0 .4rem;
        padding: 0;
        display: flex;
        gap: 4px;
    }

        .szint-skala li {
            flex: 1;
            height: 10px;
            border-radius: 5px;
            background: var(--vonal);
        }

            .szint-skala li.be {
                background: color-mix(in srgb, var(--sanc) 55%, var(--vonal));
            }

            .szint-skala li.aktiv {
                background: var(--sanc);
            }

    .szint-nev {
        margin: 0 0 .9rem;
    }

    .ertekel-urlap {
        display: flex;
        flex-direction: column;
        gap: .35rem;
    }

        .ertekel-urlap label {
            font-weight: 600;
            font-size: .92rem;
        }

    @media (max-width: 900px) {
        .tag-racs {
            grid-template-columns: minmax(0, 1fr);
        }
    }

    @media (max-width: 600px) {
        .tag-fej {
            grid-template-columns: minmax(0, 1fr);
            justify-items: center;
            text-align: center;
            padding: 1.25rem 1rem;
        }

        .tag-kep {
            width: 180px;
            height: 180px;
        }
        .tag-fej.kep-nelkul .tag-kep { width: 90px; height: 90px; }

        .tag-hol, .tag-cimkek, .tag-fej-gombok {
            justify-content: center;
        }

        .tag-kozelgo a {
            grid-template-columns: minmax(0, 1fr);
        }

        .tag-kozelgo time {
            grid-row: auto;
        }
    }
    /* tag profil – "Hová készül": edzéskártya-sorok (időpont | kép | adatok), az edzés hangulatszínével */
    .tag-kozelgo {
        display: flex;
        flex-direction: column;
        gap: .5rem;
    }

        .tag-kozelgo li + li {
            border-top: 0;
        }

        .tag-kozelgo a {
            --hk-hatter: var(--hv-hatter, var(--papir));
            --hk-eros: var(--hv-eros, var(--sanc));
            display: grid;
            grid-template-columns: 6.5rem 112px minmax(0, 1fr);
            gap: .25rem .9rem;
            align-items: center;
            padding: .55rem .7rem;
            border: 1px solid color-mix(in srgb, var(--hk-eros) 25%, var(--vonal));
            border-radius: 10px;
            background: var(--hk-hatter);
        }

    :root[data-theme="dark"] .tag-kozelgo a {
        --hk-hatter: var(--hs-hatter, var(--papir));
        --hk-eros: var(--hs-eros, var(--sanc));
    }

    @media (prefers-color-scheme: dark) {
        :root:not([data-theme]) .tag-kozelgo a {
            --hk-hatter: var(--hs-hatter, var(--papir));
            --hk-eros: var(--hs-eros, var(--sanc));
        }
    }

    .tag-kozelgo a:hover {
        border-color: var(--hk-eros);
    }

    .tag-kozelgo time {
        grid-row: auto;
        display: flex;
        flex-direction: column;
        line-height: 1.05;
        color: var(--hk-eros);
        font-family: inherit;
        font-size: inherit;
    }

    .tk-nap {
        font-weight: 700;
        font-size: .9rem;
    }

    .tk-ido {
        font-family: var(--kijelzo);
        font-size: 1.6rem;
    }

    .tag-kozelgo img {
        width: 112px;
        height: 63px;
        object-fit: cover;
        border-radius: 6px;
    }

    .tk-adat {
        display: flex;
        flex-direction: column;
        min-width: 0;
        gap: .1rem;
    }

        .tk-adat > b {
            overflow-wrap: anywhere;
        }

    .tk-letszam {
        font-size: .88rem;
        color: var(--szabad);
    }

        .tk-letszam.betelt {
            color: var(--betelt);
            font-weight: 600;
        }

    @media (max-width: 600px) {
        .tag-kozelgo a {
            grid-template-columns: 84px minmax(0, 1fr);
        }

        .tag-kozelgo time {
            grid-column: 1 / -1;
            flex-direction: row;
            gap: .5rem;
            align-items: baseline;
        }

        .tag-kozelgo img {
            width: 84px;
            height: 47px;
        }
    }
    /* tag profil: a bemutatkozás a fejlécben, a név jobb oldalán (keskenyebb képernyőn alatta) */
    .tag-fej {
        grid-template-columns: auto minmax(0, 1fr) minmax(0, 1.1fr);
        align-items: start;
    }

    .tag-bemutat {
        align-self: stretch;
        display: flex;
        flex-direction: column;
        gap: .3rem;
        padding-left: 1.5rem;
        border-left: 1px solid var(--vonal);
    }

    .tag-bemutat-cim {
        font-size: .85rem;
        font-weight: 700;
        color: var(--halvany);
    }

    .tag-bemutat-szoveg {
        margin: 0;
        font-style: italic;
        color: var(--szoveg-2);
        line-height: 1.45;
        overflow-wrap: anywhere;
        max-height: 17.5em;
        overflow: hidden; /* kb. 6–7 sor; ami ezen túl van, a "több" gombbal látszik */
    }

        .tag-bemutat-szoveg.nyitva {
            max-height: none;
        }

        .tag-bemutat-szoveg.ures-szoveg {
            color: var(--halvany);
        }

    .tobb-gomb {
        align-self: flex-start;
        font-size: .9rem;
    }

        .tobb-gomb[hidden] {
            display: none;
        }

    @media (max-width: 1100px) {
        .tag-fej {
            grid-template-columns: auto minmax(0, 1fr);
        }

        .tag-bemutat {
            grid-column: 1 / -1;
            padding-left: 0;
            border-left: 0;
            padding-top: 1rem;
            border-top: 1px solid var(--vonal);
        }
    }

    @media (max-width: 600px) {
        .tag-fej {
            grid-template-columns: minmax(0, 1fr);
        }

        .tag-bemutat {
            text-align: left;
        }
    }
    /* edzés oldal: tetszik / nem tetszik a hozzászólásoknál (a gombok stílusa a faliújságéval közös: .szavaz-gomb) */
    .hozzaszolas-szavazat {
        margin-top: .4rem;
    }

        .hozzaszolas-szavazat .szavaz-gomb {
            width: 30px;
            height: 30px;
        }

        .hozzaszolas-szavazat .szavazat {
            font-size: .8rem;
        }
    /* ==========================================================================
   Tagjaink (/tagok): szűrők balra (mint az edzéslistán), jobbra a tagok kártyái
   ========================================================================== */
    .tag-szerep-szuro {
        margin-top: 0;
        display: flex;
        flex-direction: column;
        gap: .45rem;
    }

    .tag-kartyak {
        list-style: none;
        margin: 0;
        padding: 0;
        display: grid;
        grid-template-columns: repeat(auto-fill, minmax(260px, 1fr));
        gap: .8rem;
    }

    .tag-kartya {
        display: flex;
        gap: .85rem;
        align-items: flex-start;
        height: 100%;
        padding: .8rem;
        background: var(--lap);
        border: 1px solid var(--vonal);
        border-radius: var(--kerekites);
        color: inherit;
        text-decoration: none;
    }

        .tag-kartya:hover {
            border-color: var(--sanc);
        }

            .tag-kartya:hover .tk-nev {
                text-decoration: underline;
            }

        .tag-kartya .avatar {
            width: 122px;
            height: 122px;
            border-radius: 10px;
        }
        /* a kártyák képe */
        .tag-kartya .monogram-kicsi {
            font-size: 1.3rem;
        }

        /* Tagjaink: a támogatói plakett az avatar sarkán */
        .tag-kartya .plakett {
            width: 59px;
            height: 59px;
            right: -27px;
            top: -12px;
            padding: 1px;
        }

    .tk-szoveg {
        display: flex;
        flex-direction: column;
        gap: .2rem;
        min-width: 0;
    }

    .tk-nev {
        font-weight: 700;
        font-size: 1.05rem;
        line-height: 1.2;
        overflow-wrap: anywhere;
    }

    .tk-info {
        display: flex;
        flex-wrap: wrap;
        gap: .1rem .6rem;
        color: var(--halvany);
        font-size: .85rem;
    }

    .tag-kartya .cimkek {
        margin-top: .2rem;
    }

    .tag-kartya .cimke {
        font-size: .75rem;
    }

    .tk-bemutat {
        font-size: .85rem;
        font-style: italic;
        color: var(--szoveg-2);
        margin-top: .2rem;
        line-height: 1.35;
    }

    .lapozo-sor {
        display: flex;
        align-items: center;
        justify-content: center;
        gap: 1rem;
        margin-top: 1.5rem;
    }
    /* ==========================================================================
   Szervezői vezérlőpult (/szervezoknek)
   ========================================================================== */
    .pult-admin {
        margin: -.5rem 0 1rem;
        font-size: .92rem;
    }

    .pult-teendok {
        display: flex;
        flex-wrap: wrap;
        gap: .5rem 1.5rem;
        margin: 0 0 1.25rem;
        padding: .75rem 1rem;
        border-radius: var(--kerekites);
        border: 1px solid color-mix(in srgb, var(--sanc) 45%, var(--vonal));
        background: var(--sanc-halvany);
        color: #1f1205;
    }

    .pult-racs {
        display: grid;
        grid-template-columns: minmax(0, 1.7fr) minmax(0, 1.15fr);
        gap: 1.5rem;
        align-items: start;
    }

    .pult-oldalso {
        display: flex;
        flex-direction: column;
        gap: 1.5rem;
    }

        .pult-oldalso > .szakasz, .pult-racs > .szakasz {
            margin: 0;
        }

    @media (max-width: 900px) {
        .pult-racs {
            grid-template-columns: minmax(0, 1fr);
        }
    }
    /* egy edzés sora: kép | adatok | gombok, az edzés hangulatszínével */
    .pult-lista {
        list-style: none;
        margin: 0;
        padding: 0;
        display: flex;
        flex-direction: column;
        gap: .6rem;
    }

    .pult-edzes {
        --hk-hatter: var(--hv-hatter, var(--papir));
        --hk-eros: var(--hv-eros, var(--sanc));
        display: grid;
        grid-template-columns: 112px minmax(0, 1fr) auto;
        gap: .5rem 1rem;
        align-items: center;
        padding: .7rem;
        border-radius: 10px;
        background: var(--hk-hatter);
        border: 1px solid color-mix(in srgb, var(--hk-eros) 25%, var(--vonal));
    }

    :root[data-theme="dark"] .pult-edzes {
        --hk-hatter: var(--hs-hatter, var(--papir));
        --hk-eros: var(--hs-eros, var(--sanc));
    }

    @media (prefers-color-scheme: dark) {
        :root:not([data-theme]) .pult-edzes {
            --hk-hatter: var(--hs-hatter, var(--papir));
            --hk-eros: var(--hs-eros, var(--sanc));
        }
    }

    .pult-edzes > img {
        width: 112px;
        height: 63px;
        object-fit: cover;
        border-radius: 6px;
    }

    .pe-adat {
        display: flex;
        flex-direction: column;
        gap: .2rem;
        min-width: 0;
    }

    .pe-fej {
        display: flex;
        flex-wrap: wrap;
        align-items: center;
        gap: .3rem .6rem;
    }

    .pe-nev {
        font-weight: 700;
        font-size: 1.05rem;
        color: var(--hk-eros);
        text-decoration: none;
        overflow-wrap: anywhere;
    }

        .pe-nev:hover {
            text-decoration: underline;
        }

    .pe-info {
        display: flex;
        flex-wrap: wrap;
        gap: .1rem .8rem;
        font-size: .88rem;
        color: var(--szoveg-2);
    }

    .pe-szamok {
        display: flex;
        flex-wrap: wrap;
        align-items: center;
        gap: .2rem .9rem;
        font-size: .88rem;
    }

    .pe-kov {
        color: inherit;
        text-decoration: none;
    }

        .pe-kov:hover b {
            text-decoration: underline;
        }

    .cimke.kerelem {
        background: var(--sanc);
        border-color: var(--sanc);
        color: #1f1205;
        text-decoration: none;
    }

    .pe-gombok {
        display: flex;
        flex-direction: column;
        gap: .35rem;
    }

    .pult-inaktiv {
        margin-top: 1rem;
    }

        .pult-inaktiv summary {
            cursor: pointer;
            font-weight: 600;
            color: var(--szoveg-2);
            margin-bottom: .6rem;
        }

        .pult-inaktiv .pult-edzes {
            opacity: .75;
        }

    @media (max-width: 700px) {
        .pult-edzes {
            grid-template-columns: 84px minmax(0, 1fr);
        }

            .pult-edzes > img {
                width: 84px;
                height: 47px;
                align-self: start;
            }

        .pe-gombok {
            grid-column: 1 / -1;
            flex-direction: row;
            flex-wrap: wrap;
        }
    }
    /* csoportok, versenyek listája */
    .pult-csoportok {
        list-style: none;
        margin: 0 0 .75rem;
        padding: 0;
    }

        .pult-csoportok li + li {
            border-top: 1px solid var(--vonal);
        }

        .pult-csoportok a {
            display: flex;
            flex-wrap: wrap;
            align-items: center;
            gap: .2rem .5rem;
            padding: .55rem 0;
            color: inherit;
            text-decoration: none;
        }

            .pult-csoportok a:hover b {
                text-decoration: underline;
            }

        .pult-csoportok .halvany {
            flex-basis: 100%;
            color: var(--halvany);
            font-size: .85rem;
        }

    .cimke.tilto {
        background: color-mix(in srgb, var(--betelt) 12%, var(--lap));
        color: var(--betelt);
        border-color: transparent;
    }
    /* ==========================================================================
   Csoportok (/csoportok): felül a csoportjaid és az új csoport, alatta a kiválasztott csoport
   ========================================================================== */
    .csop-elrendezes {
        display: grid;
        grid-template-columns: minmax(0, 2fr) minmax(300px, 2fr);
        gap: 1.25rem;
        align-items: start;
    }
    /* bal: kártyák 3/4, jobb: részletek 1/4 */
    .csop-bal {
        display: grid;
        grid-template-columns: minmax(0, 1fr);
        gap: 1.25rem;
        align-items: start;
    }
        /* egymás alatt: Csoportjaid, alatta az új csoport */
        .csop-bal > .szakasz, .csop-jobb .szakasz {
            margin: 0;
        }

    .csop-reszlet {
        display: flex;
        flex-direction: column;
        gap: 1.25rem;
    }

    #uj summary {
        cursor: pointer;
        list-style: none;
        display: flex;
        align-items: center;
        justify-content: space-between;
    }

        #uj summary::-webkit-details-marker {
            display: none;
        }

        #uj summary::after {
            content: "+";
            font-size: 1.4rem;
            color: var(--halvany);
        }

    #uj details[open] summary::after {
        content: "–";
    }

    #uj summary h2 {
        margin: 0;
    }

    .csop-uj-urlap {
        display: flex;
        flex-direction: column;
        gap: .75rem;
        margin-top: .9rem;
    }

        .csop-uj-urlap .csoport {
            margin-top: 0;
            padding-top: .5rem;
            display: flex;
            flex-direction: column;
            gap: .45rem;
        }
    /* a csoportjaid: választható "chipek" */
    .csop-chipek {
        list-style: none;
        margin: 0;
        padding: 0;
        display: grid;
        grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
        gap: .6rem;
    }

        .csop-chipek a {
            display: flex;
            flex-direction: column;
            height: 100%;
            box-sizing: border-box;
            padding: .6rem .85rem;
            border: 1px solid var(--vonal);
            border-radius: 10px;
            color: inherit;
            text-decoration: none;
            background: var(--papir);
            line-height: 1.25;
        }

            .csop-chipek a span {
                font-size: .8rem;
                color: var(--halvany);
            }

            .csop-chipek a.tilto {
                border-color: color-mix(in srgb, var(--betelt) 40%, var(--vonal));
            }

            .csop-chipek a:hover {
                border-color: var(--sanc);
            }

            .csop-chipek a[aria-current="true"] {
                background: var(--fejlec-hatter);   /* a fejléc színe (világosban kék, sötétben grafit) */
                border-color: var(--fejlec-hatter);
                color: #fff;
            }

                .csop-chipek a[aria-current="true"] span {
                    color: inherit;
                    opacity: .8;
                }
    /* a kiválasztott csoport */
    .csop-fej {
        margin-bottom: 1.25rem;
    }

    .csop-fej-sor {
        display: flex;
        flex-wrap: wrap;
        align-items: center;
        gap: .4rem .75rem;
    }

        .csop-fej-sor h2 {
            margin: 0;
            font-size: 1.35rem;
        }

    .csop-fej .halvany {
        color: var(--halvany);
        margin: .4rem 0 0;
    }

    .csop-atnevez {
        margin-top: .75rem;
    }

        .csop-atnevez summary {
            cursor: pointer;
            font-weight: 600;
            color: var(--szoveg-2);
        }

    .sor-urlap {
        display: flex;
        gap: .5rem;
        margin-top: .5rem;
        max-width: 460px;
    }

        .sor-urlap input {
            flex: 1;
        }

    .csop-racs {
        display: grid;
        grid-template-columns: minmax(0, 1fr);
        gap: 1.25rem;
        align-items: start;
    }
        /* a keskeny jobb hasábban egymás alatt */
        .csop-racs > .szakasz, .csop-oldalso > .szakasz {
            margin: 0;
        }

    .csop-oldalso {
        display: flex;
        flex-direction: column;
        gap: 1.25rem;
    }

    .csop-tag-fel {
        margin-bottom: 1rem;
        max-width: 520px;
    }
    /* tagok: két hasábban, kép + név + (admin) város */
    .csop-tagok {
        list-style: none;
        margin: 0;
        padding: 0;
        display: grid;
        grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
        gap: .4rem .9rem;
    }

        .csop-tagok > li {
            padding: .3rem 0;
            border-bottom: 1px solid var(--vonal);
        }

    .csop-tag {
        display: flex;
        align-items: center;
        gap: .6rem;
        min-width: 0;
    }

        .csop-tag .avatar {
            width: 44px;
            height: 44px;
            border-radius: 8px;
        }

        .csop-tag .monogram-kicsi {
            font-size: .9rem;
        }

    .csop-tag-szoveg {
        display: flex;
        flex-direction: column;
        min-width: 0;
        line-height: 1.25;
    }

        .csop-tag-szoveg a {
            color: inherit;
            font-weight: 600;
            text-decoration: none;
            overflow-wrap: anywhere;
        }

            .csop-tag-szoveg a:hover {
                text-decoration: underline;
            }

        .csop-tag-szoveg .halvany {
            font-size: .8rem;
            color: var(--halvany);
        }

    .csop-tagok.valaszthato .pipa {
        align-items: center;
    }

    .csop-tag-muveletek {
        display: flex;
        flex-wrap: wrap;
        align-items: center;
        gap: .5rem;
        margin-top: 1rem;
        padding-top: .75rem;
        border-top: 1px solid var(--vonal);
    }

    .csop-valassz {
        text-align: center;
        padding: 1rem;
    }

    @media (max-width: 900px) {
        .csop-elrendezes {
            grid-template-columns: minmax(0, 1fr);
        }
    }
    /* csoport adminjai: SANC narancs háttér */
    .csop-tagok > li.admin {
        background: var(--sanc);
        border-bottom-color: transparent;
        border-radius: 8px;
        padding: .3rem .5rem;
        color: #1f1205;
    }

        .csop-tagok > li.admin .csop-tag-szoveg a,
        .csop-tagok > li.admin .csop-tag-szoveg .halvany {
            color: #1f1205;
        }

        .csop-tagok > li.admin .pipa input {
            accent-color: var(--grafit);
        }
    /* csoportkártya: van-e aktív edzése (zöld) vagy nincs (szürke) */
    .csop-chipek a .csop-edzes-jel {
        align-self: flex-start;
        margin-top: .3rem;
        padding: .05rem .5rem;
        border-radius: 999px;
        font-size: .72rem;
        font-weight: 700;
        color: var(--szoveg-2);
        background: var(--vonal);
    }

        .csop-chipek a .csop-edzes-jel.aktiv {
            background: var(--szabad);
            color: #fff;
        }

    .csop-chipek a[aria-current="true"] .csop-edzes-jel {
        opacity: 1;
        color: var(--szoveg-2);
    }

        .csop-chipek a[aria-current="true"] .csop-edzes-jel.aktiv {
            color: #fff;
        }
    /* tiltó csoport neve: vörös (csoportkártyák, a csoport címe, a vezérlőpult listája) */
    .csop-tilto-nev, .csop-chipek a.tilto b {
        color: var(--betelt);
    }

    .csop-chipek a.tilto[aria-current="true"] b {
        color: #ff8a80;
    }
    /* sötét (kiválasztott) háttéren világosabb vörös */
    /* vezérlőpult: csoportok egysoros listája – név balra, a jelzés jobbra */
    .pult-csoportok.egysoros a {
        flex-wrap: nowrap;
        justify-content: space-between;
        gap: .75rem;
    }

    .pult-csoportok.egysoros b {
        min-width: 0;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

    .pult-csoportok .csop-edzes-jel {
        flex-shrink: 0;
        padding: .05rem .5rem;
        border-radius: 999px;
        font-size: .72rem;
        font-weight: 700;
        color: var(--szoveg-2);
        background: var(--vonal);
        white-space: nowrap;
    }

        .pult-csoportok .csop-edzes-jel.aktiv {
            background: var(--szabad);
            color: #fff;
        }
    /* Edzés beállításai – "Melyik csoport?" címke, mellette jobbra az "Új csoport létrehozása" link */
    .mezo-fej {
        display: flex;
        justify-content: space-between;
        align-items: baseline;
        gap: .5rem;
        flex-wrap: wrap;
    }

        .mezo-fej a {
            font-size: .85rem;
            font-weight: 600;
        }
    /* az épp létrehozott csoport kártyája egyszer felvillan */
    .csop-chipek a.uj-csoport {
        animation: csop-uj 1.6s ease-out 1;
    }

    @keyframes csop-uj {
        0%, 30% {
            box-shadow: 0 0 0 4px var(--sanc);
        }

        100% {
            box-shadow: 0 0 0 0 transparent;
        }
    }
    /* ==========================================================================
   Csoportok – a kiválasztott csoport egyetlen panelben, erős árnyékkal
   ========================================================================== */
    .csop-panel {
        gap: 0;
        background: var(--lap);
        border: 1px solid var(--vonal);
        border-radius: var(--kerekites);
        overflow: hidden;
        box-shadow: 0 14px 36px rgba(15, 20, 25, .18), 0 3px 8px rgba(15, 20, 25, .10); /* a panel árnyéka */
    }
        /* a panelen belüli szakaszok nem külön dobozok, csak vonallal elválasztva */
        .csop-panel .szakasz, .csop-panel .csop-racs, .csop-panel .csop-oldalso {
            gap: 0;
        }

        .csop-panel .szakasz {
            border: 0;
            border-radius: 0;
            background: none;
            margin: 0;
            padding: 1.2rem 1.4rem;
        }

        .csop-panel .csop-racs > .szakasz, .csop-panel .csop-oldalso > .szakasz {
            border-top: 1px solid var(--vonal);
        }

        .csop-panel .veszely-szakasz {
            background: color-mix(in srgb, var(--betelt) 5%, var(--lap));
        }
        /* a fejléc: sötét sáv (tiltó csoportnál vörös), nagy névvel és adatokkal */
        .csop-panel .csop-fej {
            background: var(--fejlec-hatter);   /* a fejléc színe */
            color: #fff;
            padding: 1.4rem 1.4rem 1.2rem;
        }

        .csop-panel.tilto .csop-fej {
            background: var(--betelt);
            color: #fff;
        }

        .csop-panel .csop-fej h2 {
            margin: .45rem 0 .9rem;
            font-size: 1.7rem;
            line-height: 1.15;
            color: inherit;
            overflow-wrap: anywhere;
        }

    .csop-tipus {
        font-size: .75rem;
        font-weight: 700;
        letter-spacing: .06em;
        text-transform: uppercase;
        opacity: .75;
    }

    .csop-adatok {
        display: flex;
        flex-wrap: wrap;
        gap: .5rem;
        margin: 0;
    }

        .csop-adatok > div {
            padding: .4rem .7rem;
            border-radius: 8px;
            background: rgba(255, 255, 255, .12);
            min-width: 4.5rem;
        }

        .csop-adatok dt {
            font-size: .7rem;
            text-transform: uppercase;
            letter-spacing: .05em;
            opacity: .7;
        }

        .csop-adatok dd {
            margin: 0;
            font-weight: 700;
            font-size: 1.05rem;
        }

    .csop-panel .csop-atnevez summary {
        color: inherit;
        opacity: .85;
    }

    .csop-panel .csop-fej .uzenet-ok, .csop-panel .csop-fej .uzenet-hiba {
        margin: .9rem 0 0;
        color: var(--szoveg);
    }
    /* az üzenet a saját (világos) dobozában olvasható maradjon */

/* Edzés – felírás: tagkereső a "Vendéget hozok / felírok valakit" mezőben, és "felírta" a lista nézetben */
.vendeg-urlap .tagkereso { position: relative; flex: 1; min-width: 0; }
.vendeg-urlap .tagkereso input[type="text"] { width: 100%; }
.felirta-kicsi { display: none; }
.nevsor-lista .felirta-kicsi { display: inline; margin-left: .4rem; font-size: .8rem; font-weight: 400; color: var(--halvany); }

/* ==========================================================================
   Főoldal – "Edzéseid" kártyák: a kép alatt nagy létszámszám, pöttyök az edzés (sötét) színével
   (_EdzesNapok.cshtml, ViewData["NagyLetszam"])
   ========================================================================== */
.edzes-kep-oszlop { grid-area: kep; display: flex; flex-direction: column; align-items: center; gap: .15rem; }
.kep-letszam { display: flex; align-items:flex-start; gap: .25rem; color: var(--h-eros, var(--sanc)); font-size: 1.1rem; font-weight: 600; line-height: 1; margin-top:10px;}
.kep-letszam b { font-family: var(--kijelzo); font-size: 2.6rem; font-weight: 400; line-height: .9; }   /* a nagy szám */
.edzes.nagy-letszam .helyek i.foglalt { background: var(--h-eros, var(--sanc)); border-color: var(--h-eros, var(--sanc)); }
.edzes.nagy-letszam .helyek-sav span { background: var(--h-eros, var(--sanc)); }
/* főoldal "Edzéseid": előbb a "N szabad hely", utána a pöttyök */
.edzes.nagy-letszam .letszam {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: .3rem .75rem;
}

.edzes.nagy-letszam .letszam-szoveg {
    order: -1;
}

/* főoldal "Edzéseid": a "Zárt" / csoport címke az edzés sötét színével */
.edzes.nagy-letszam .cimke.zart {
    background: var(--h-eros, var(--sanc));
    color: var(--h-eros-szoveg, #1f1205);
    border-color: transparent;
}

/* ==========================================================================
   Edzés oldal – "Az edzésről": fent a szervezők (fejléc), lent a megtekintések (lábléc), saját háttérrel
   ========================================================================== */
/* a szakasz széléig érő fejléc és lábléc: a szakasznak nincs belső margója, csak a középső résznek */
.szakasz.leiras {
    padding: 0;
    overflow: hidden;
    box-shadow: rgba(0, 0, 0, 0.1) -4px 9px 25px -6px;
}
.leiras > .osszecsukhato { padding: 1.2rem 1.5rem 1.4rem; }
.leiras-fej {
    display: flex;
    flex-wrap: wrap;
    align-items: baseline;
    gap: .2rem .6rem;
    padding: .75rem 1.5rem;
    background: color-mix(in srgb, var(--szoveg) 5%, var(--papir)); /* lábléc háttere: halvány */
}
.leiras-fej-cimke { font-size: .75rem; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; opacity: .8; }
.leiras-fej-nevek { font-weight: 700; font-size: 1.05rem; }
.leiras-fej a { color: inherit; }

.leiras-lab {
    display: flex;
    flex-wrap: wrap;
    gap: .2rem 1rem;
    padding: .65rem 1.5rem;
    background: color-mix(in srgb, var(--szoveg) 5%, var(--papir)); /* lábléc háttere: halvány */
    border-top: 1px solid var(--vonal);
    color: var(--szoveg-2);
    font-size: .88rem;
}
    .leiras-lab b {
        color: var(--szoveg);
        padding: 6px;
        border: 1px solid gray;
        border-radius: 50%;
        background: color-mix(in srgb, var(--papir) 15%, var(--papir)); /* lábléc háttere: halvány */
    }

/* "asztalon-is": nagy képernyőn is összecsukható (alapból nyitva) – pl. az edzés leírása */
@media (min-width: 901px) {
    .osszecsukhato.asztalon-is > summary {
        cursor: pointer;
        pointer-events: auto;
    }

        .osszecsukhato.asztalon-is > summary::after {
            display: block;
        }
}

/* "Az edzésről": a szervezők és a legutóbbi látogatók linkjei aláhúzás nélkül (rámutatva igen) */
.leiras-fej a, .leiras-lab a { color: inherit; text-decoration: none; }
.leiras-fej a:hover, .leiras-lab a:hover { text-decoration: underline; }
/* edzés oldal: a hozzászólás "Elküldöm" gombja átlátszó háttérrel */
.uj-hozzaszolas .gomb {
    background: transparent;
    border: 1px solid currentColor;
    color: var(--szoveg);
    font-weight: 300;
}

    .uj-hozzaszolas .gomb:hover {
        background: color-mix(in srgb, var(--szoveg) 8%, transparent);
    }

.megosztas-szakasz .gomb {
    background: transparent;
    border: 1px solid currentColor;
    color: var(--szoveg);
    font-weight:300;
}

.kis-szakasz .gomb {
    background: transparent;
    border: 1px solid currentColor;
    color: var(--szoveg);
    font-weight: 300;
}



/* ==========================================================================
   Profil – profilkép feltöltése, e-mail cím csere
   ========================================================================== */
.profilkep-sor { display: flex; flex-wrap: wrap; align-items: flex-start; gap: 1rem 1.5rem; }
.profilkep-sor > div { flex: 1; min-width: 220px; }
.profilkep-sor p { margin: 0 0 .75rem; }
.profilkep-nagy { width: 140px; height: 140px; border-radius: 12px; object-fit: cover; flex-shrink: 0; display: grid; place-items: center; }   /* a kép mérete */
/* a fájlválasztó gombnak látszik: a valódi mező láthatatlanul ráfekszik */
.fajl-gomb { position: relative; overflow: hidden; cursor: pointer; margin-bottom: .5rem; }
.fajl-gomb input[type="file"] { position: absolute; inset: 0; opacity: 0; cursor: pointer; }
.fajl-gomb:focus-within { outline: 2px solid var(--sanc); outline-offset: 2px; }
.fajl-gomb.toltodik { opacity: .6; pointer-events: none; }
.fajl-gomb.toltodik::after { content: " – feltöltés…"; }
html.js .fajl-kuld { display: none; }   /* JavaScripttel a kiválasztás után magától feltölt */
.profilkep-sor .urlap-lab { display: flex; flex-wrap: wrap; gap: .5rem; margin: 0; }
.profilkep-sor .urlap-lab form { margin: 0; }

.email-csere-sor { display: grid; grid-template-columns: auto 1fr; gap: .3rem 1rem; margin: 0 0 1rem; }
.email-csere-sor dt { color: var(--halvany); }
.email-csere-sor dd { margin: 0; overflow-wrap: anywhere; }
.email-megerosites .urlap-lab { display: flex; flex-wrap: wrap; gap: .5rem; }

/* ==========================================================================
   Regisztráció, aktiválás, elfelejtett jelszó (a belépő oldal elrendezésével)
   ========================================================================== */
.belepes-logo-link { color: inherit; text-decoration: none; }
.belepes-urlap .reg-urlap { max-width: 440px; }   /* a regisztrációs űrlap szélessége */
.fiok-doboz { width: 100%; max-width: 400px; display: flex; flex-direction: column; gap: 1rem; }
.fiok-doboz h1 { font-size: 2.4rem; margin: 0; }
.fiok-doboz p { margin: 0; }
.fiok-urlap { display: flex; flex-direction: column; gap: 1rem; }
.fiok-doboz .gomb { width: 100%; }

.reg-kep { display: flex; align-items: center; gap: 1rem; }
.reg-kep > div { display: flex; flex-direction: column; gap: .3rem; align-items: flex-start; }
.reg-kep-kep { width: 84px; height: 84px; border-radius: 50%; object-fit: cover; flex-shrink: 0; border: 3px solid var(--sanc); }   /* a profilkép előnézete */
.reg-kep-ures { display: block; background: var(--papir); border-style: dashed; border-color: var(--vonal); }
.reg-kep-kep[hidden] { display: none; }
.belepes-urlap .reg-kep .gomb { width: auto; margin: 0; }
.reg-nem { border: 0; padding: 0; margin: 0; }
.reg-nem legend { font-weight: 600; font-size: .95rem; margin-bottom: .35rem; }
.reg-nem .valaszto-sor { display: flex; gap: 1.5rem; }
.reg-csapda { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }

/* ==========================================================================
   Szabályzat (/szabalyzat) – a szöveg a Content/szabalyzat.md fájlból
   ========================================================================== */
.szabalyzat { max-width: 780px; margin: 0 auto; line-height: 1.65; }
.szabalyzat h1 { margin: 0 0 .4rem; }
.szabalyzat h2 { margin: 2.5rem 0 .8rem; padding-top: 1.2rem; border-top: 2px solid var(--sanc); scroll-margin-top: 84px; }
.szabalyzat h3 { margin: 1.6rem 0 .5rem; font-size: 1.12rem; }
.szabalyzat p { margin: 0 0 .85rem; }
.szabalyzat ul { margin: 0 0 1rem; padding-left: 1.3rem; }
.szabalyzat li { margin: .3rem 0; }
.szabalyzat > p:nth-of-type(1) { color: var(--halvany); font-size: .92rem; }   /* "Hatályos: …" */
.szabalyzat-ugro { max-width: 780px; margin: 0 auto 1rem; display: flex; flex-wrap: wrap; gap: .5rem; }
.szabalyzat-ugro a { padding: .35rem .85rem; border-radius: 999px; border: 1px solid var(--vonal); background: var(--lap); color: inherit; text-decoration: none; font-weight: 600; font-size: .92rem; }
.szabalyzat-ugro a:hover { border-color: var(--sanc); }
.lablec-linkek { display: flex; flex-wrap: wrap; gap: .4rem 1.25rem; }
.lablec-build { font-size: .7rem; opacity: .6; margin-top: .25rem; }   /* "Powered by MesterCom. Build v…" a lábléc alján */
.lablec-statisztika { font-size: .85rem; }                                  /* "Tagok belépéseinek száma: …" */
.lablec-latogatok { font-size: .85rem; margin-top: -.3rem; }                 /* "Utolsó látogatók: A | B | C" */
.lablec-latogatok a { color: inherit; text-decoration: none; }   /* a nevek aláhúzás nélkül */
.lablec-latogatok a:hover { text-decoration: underline; }
.lablec-elvalaszto { margin: 0 .35rem; opacity: .6; }
.lablec-jog { font-size: .75rem; opacity: .8; max-width: 80ch; margin-top: -.25rem; line-height:.9rem }   /* jogi apróbetű a felirat alatt */
.belepes-szabalyzat { margin: 0; font-size: .85rem; text-align: center; }
.belepes-szabalyzat a { color: var(--halvany); }

/* Profil – regisztráció törlése */
.torles-nyito > summary { cursor: pointer; font-weight: 600; color: var(--betelt); margin-bottom: .5rem; }
.torles-lista { margin: .5rem 0 1.25rem; padding-left: 1.2rem; line-height: 1.55; }
.torles-lista li { margin: .3rem 0; }
#torles .uzenet-hiba ul { margin: .4rem 0; }

/* Főoldal – versenyek: a leírás eleje, legfeljebb 3 sorban */
.verseny-leiras {
    display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 12; line-clamp: 12; overflow: hidden;
    font-size: .86rem; line-height: 1.45; color: var(--szoveg-2); margin-top: .15rem;
}

/* ==========================================================================
   Verseny adatlap (/verseny/12) és szerkesztés (/verseny-szerkeszt/12)
   ========================================================================== */
.verseny-fej { position: relative; border-radius: var(--kerekites); overflow: hidden; background: var(--grafit); color: #fff; margin-bottom: 1.25rem; }
.verseny-fokep { display: block; width: 100%; aspect-ratio: 16 / 7; object-fit: cover; }   /* a főkép magassága (16:7) */
.verseny-fej-szoveg {
    display: flex; align-items: flex-end; gap: 1rem; padding: 1.25rem 1.5rem;
}
.verseny-fej:not(.kep-nelkul) .verseny-fej-szoveg {
    position: absolute; inset: auto 0 0 0;
    background: linear-gradient(180deg, transparent, rgba(15, 18, 21, .85));
    padding-top: 3.5rem;
}
.verseny-fej h1 { margin: 0; color: #fff; font-size: clamp(1.6rem, 3.5vw, 2.4rem); line-height: 1.1; }
.verseny-fej-datum {
    flex-shrink: 0; display: flex; flex-direction: column; align-items: center; justify-content: center;
    width: 4.2rem; height: 4.2rem; border-radius: 10px; background: #fff; color: var(--grafit); line-height: 1;
}
.verseny-fej-datum .vd-nap { font-size: 2rem; }
.verseny-fej-sor { display: flex; flex-wrap: wrap; gap: .3rem .9rem; margin: .4rem 0 0; color: #e3e7eb; }
.verseny-fej-sor .cimke { background: rgba(255, 255, 255, .18); color: #fff; border-color: transparent; }
.verseny-fej > .verseny-fej-szoveg > div:nth-child(2) { flex: 1; min-width: 0; }
.verseny-szerk-gomb { flex-shrink: 0; }

.verseny-racs { display: grid; grid-template-columns: minmax(0, 1fr) minmax(260px, 340px); gap: 1.25rem; align-items: start; }
.verseny-fo, .verseny-oldalso { display: flex; flex-direction: column; gap: 1.25rem; }
.verseny-fo > .szakasz, .verseny-oldalso > .szakasz { margin: 0; }
.verseny-hir-doboz { border-left: 4px solid var(--sanc); background: color-mix(in srgb, var(--sanc) 8%, var(--lap)); }
.verseny-hir-cimke { display: block; font-size: .72rem; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; color: var(--sanc-sotet, var(--sanc)); margin-bottom: .3rem; }
.verseny-adatok { display: grid; grid-template-columns: auto 1fr; gap: .45rem .9rem; margin: 0; }
.verseny-adatok dt { color: var(--halvany); font-size: .88rem; }
.verseny-adatok dd { margin: 0; overflow-wrap: anywhere; }
.verseny-dokok { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: .4rem; }
.verseny-dokok li > a, .verseny-dokok li > span:last-child { display: flex; align-items: center; gap: .6rem; }
.verseny-dokok li { display: flex; align-items: center; gap: .6rem; }
.verseny-dokok a { color: inherit; font-weight: 600; text-decoration: none; }
.verseny-dokok a:hover span:last-child { text-decoration: underline; }
.dok-ikon {
    flex-shrink: 0; width: 2.6rem; height: 2rem; border-radius: 6px; display: grid; place-items: center;
    background: var(--sanc); color: #1f1205; font-size: .7rem; font-weight: 800; letter-spacing: .03em;
}
.verseny-dokok li.nincs { color: var(--halvany); }
.verseny-dokok li.nincs .dok-ikon { background: var(--vonal); color: var(--halvany); }
.verseny-statisztika { font-size: .85rem; margin: 0; text-align: center; }

/* verseny szerkesztése – "A verseny" (alapadatok) szakasz sötétebb háttérrel */
.verseny-urlap section[aria-labelledby="alap-cim"] {
    background: color-mix(in srgb, var(--szoveg) 0%, var(--lap));
    box-shadow: rgba(0, 0, 0, 0.12) 0px 1px 3px, rgba(0, 0, 0, 0.24) 0px 1px 2px;
}

.verseny-szerk-racs { display: grid; grid-template-columns: minmax(0, 1fr) minmax(260px, 340px); gap: 1.25rem; align-items: start; }
.verseny-szerk-racs > div > .szakasz, .verseny-szerk-oldalso > .szakasz { margin: 0; }
.verseny-szerk-oldalso { display: flex; flex-direction: column; gap: 1.25rem; }
.verseny-szerk-oldalso .szakasz { display: flex; flex-direction: column; gap: .6rem; align-items: flex-start; }
.verseny-szerk-kep { width: 100%; aspect-ratio: 16 / 9; object-fit: cover; border-radius: 8px; }
.verseny-szerk-kep.ures { display: grid; place-items: center; background: var(--papir); border: 2px dashed var(--vonal); color: var(--halvany); font-size: .9rem; }
.verseny-szerk-kep[hidden] { display: none; }
.verseny-dok-mezo { width: 100%; }
.verseny-dok-meglevo { display: flex; align-items: center; gap: 1rem; font-size: .9rem; }
.verseny-dok-meglevo .pipa { font-size: .85rem; }
.verseny-mentes { margin: 1.25rem 0; display: flex; gap: .5rem; }
.verseny-torles { margin-top: 2rem; }

@media (max-width: 900px) {
    .verseny-racs, .verseny-szerk-racs { grid-template-columns: minmax(0, 1fr); }
    .verseny-fokep { aspect-ratio: 16 / 9; }
    .verseny-fej-szoveg { flex-wrap: wrap; }
}
.oldal > .vissza { margin: 0 0 .75rem; font-weight: 600; }
.oldal > .vissza a { text-decoration: none; }

/* ==========================================================================
   Versenynaptár (/versenyek) – kártyák főképpel, rajta a dátum és a város
   ========================================================================== */
.vn-eszkozok { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: .75rem 1rem; margin-bottom: 1.25rem; }
.vn-fulek { display: inline-flex; border: 1px solid var(--vonal); border-radius: 999px; padding: 3px; background: var(--lap); }
.vn-fulek a { padding: .4rem 1.1rem; border-radius: 999px; font-weight: 600; color: var(--szoveg-2); text-decoration: none; }
.vn-fulek a[aria-current="page"] { background: var(--kiemelt-hatter); color: var(--kiemelt-szoveg); }
.vn-kereso { display: flex; gap: .5rem; }
.vn-kereso input { width: min(260px, 60vw); }

.vn-racs { list-style: none; margin: 0 0 1.5rem; padding: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); gap: 1.1rem; }   /* kártya legkisebb szélessége */
.vn-kartya {
    display: flex; flex-direction: column; height: 100%; overflow: hidden;
    background: var(--lap); border: 1px solid var(--vonal); border-radius: var(--kerekites);
    color: inherit; text-decoration: none; transition: transform .15s ease, box-shadow .15s ease;
}
.vn-kartya:hover { transform: translateY(-2px); box-shadow: 0 10px 28px rgba(15, 20, 25, .14); }
.vn-kartya:hover .vn-nev { text-decoration: underline; }

.vn-kep { position: relative; display: block; aspect-ratio: 16 / 9; background: var(--grafit); }
.vn-kep img { position: absolute; inset: 0; display: block; width: 100%; height: 100%; object-fit: cover; }
.vn-kep.kep-nelkul { background: linear-gradient(135deg, var(--grafit), color-mix(in srgb, var(--sanc) 55%, var(--grafit))); }
.vn-kep-nev {
    position: absolute; inset: auto 1rem 1rem 1rem; color: #fff; font-family: var(--kijelzo); font-size: 1.8rem; line-height: 1;
    display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; overflow: hidden; opacity: .9;
}
.vn-datum {   /* a dátum címke a kép bal felső sarkában */
    position: absolute; top: .75rem; left: .75rem; width: 4.4rem; height: 4.6rem; border-radius: 9px;
    display: flex; flex-direction: column; align-items: center; justify-content: center; line-height: 1;
    background: #fff; color: var(--grafit); box-shadow: 0 4px 12px rgba(0, 0, 0, .25);
}
.vn-datum .vd-nap { font-size: 2.75rem; }
.vn-varos {   /* a város címke a kép jobb felső sarkában */
    position: absolute; right: .75rem; top: .75rem; display: inline-flex; align-items: center; gap: .3rem;
    padding: .25rem .65rem; border-radius: 999px; background: rgba(20, 23, 26, .58); color: #fff;
    font-size: .82rem; font-weight: 600; backdrop-filter: blur(4px);
    border-color:black;
}
.vn-test { display: flex; flex-direction: column; gap: .35rem; padding: .9rem 1rem 1rem; flex: 1; }
.vn-ido { font-size: .85rem; font-weight: 600; color: var(--sanc-sotet, var(--sanc)); }
.vn-nev { font-size: 1.12rem; line-height: 1.25; }
.vn-hir { font-size: .86rem; padding: .3rem .55rem; border-left: 3px solid var(--sanc); background: color-mix(in srgb, var(--sanc) 8%, var(--lap)); }
.vn-leiras {
    font-size: .88rem; line-height: 1.45; color: var(--szoveg-2);
    display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 3; line-clamp: 3; overflow: hidden;
}
.vn-test .cimkek { margin-top: auto; padding-top: .3rem; }
.cimke.vn-eredmeny { background: var(--szabad); border-color: var(--szabad); color: #fff; }
.vn-kartya.elmult .vn-kep img { filter: saturate(.75); }
.vn-kartya.elmult .vn-ido { color: var(--halvany); }

/* Hozzászólások: az avatarokat egy halvány függőleges vonal köti össze (mögöttük fut).
   Minden hozzászólás a saját avatarja közepétől a következő avatar közepéig húz egy szakaszt. */
.hozzaszolas { position: relative; --hz-avatar: 72px; --hz-felso: 1rem; }   /* = az avatar mérete és a hozzászólás felső paddingje */
.hozzaszolas:not(:last-child)::before {
    content: ""; position: absolute; z-index: 0;
    left: calc(var(--hz-avatar) / 2 - 1px);
    top: calc(var(--hz-felso) + var(--hz-avatar) / 2);
    bottom: calc(-1 * (var(--hz-felso) + var(--hz-avatar) / 2));
    width: 1px; border-radius: 2px;
    background: color-mix(in srgb, var(--sanc) 75%, transparent);   /* a vonal színe */
}
.hozzaszolas > .avatar { position: relative; z-index: 1; flex-shrink: 0; }
/* az avatar kerete a hozzászólásban: a támogatói plakett a jobb felső sarkán, kicsit kifelé */
.hozzaszolas > .hz-avatar { position: relative; z-index: 1; flex-shrink: 0; align-self: flex-start; line-height: 0; }
.hz-plakett { top: -12px; right: -14px; bottom: auto; width: 34px; height: 34px; }

/* főoldali idővonal: a nap neve link (az adott napi edzéskeresőre) */
a.iv-napnev { color: inherit; text-decoration: none; }
a.iv-napnev:hover { text-decoration: underline; color: var(--sanc-sotet, var(--sanc)); }

/* edzés oldal: a várólistások neve sima szövegszínű (világos témában fekete), nem az edzés színe */
.nevsor.varolista > li:not(.lemondott) .nev-blokk .nev { color: var(--szoveg); }

/* Tagprofil – elérhetőség a fejlécben, a név és a város alatt */
.tag-elerhetoseg { display: flex; flex-direction: column; gap: .2rem; margin: .35rem 0 .2rem; }
.tag-eler-sor { display: flex; flex-wrap: wrap; gap: .3rem 1.2rem; }
.tag-eler-sor a { display: inline-flex; align-items: center; gap: .4rem; font-weight: 600; text-decoration: none; overflow-wrap: anywhere; }
.tag-eler-sor a:hover { text-decoration: underline; }
.tag-eler-sor svg { flex-shrink: 0; opacity: .8; }
.tag-eler-megj { font-size: .82rem; color: var(--halvany); }
@media (max-width: 600px) {
    .tag-elerhetoseg { align-items: center; }
    .tag-eler-sor { justify-content: center; }
}

/* ===================================================================== Térkép (Pages/Shared/_Terkep.cshtml)
   Magyarország körvonala (Data/MagyarTerkep.cs), városonként egy kör: a mérete az edzések számával nő
   (a sugarat a _Terkep.cshtml Sugar() függvénye adja: 7 + 6·√db, legfeljebb 34). */
.terkep-doboz { margin-bottom: 1.25rem; }
.hu-terkep { margin: 0; position: relative; }
.hu-terkep svg { display: block; width: 100%; height: auto; max-height: 420px; touch-action: pan-y; user-select: none; -webkit-user-select: none; }
.hu-terkep.nagyitott svg { touch-action: none; cursor: grab; }
.hu-terkep.nagyitott svg:active { cursor: grabbing; }
/* nagyítás gombok a térkép jobb felső sarkában */
.hu-gombok { position: absolute; top: .4rem; right: .4rem; display: flex; flex-direction: column; gap: 4px; }
.hu-gombok button { width: 34px; height: 34px; padding: 0; border: 1px solid var(--vonal); border-radius: 8px; background: var(--lap);
                    color: var(--szoveg); font: 600 1.2rem/1 var(--betu); cursor: pointer; box-shadow: 0 1px 3px rgba(0,0,0,.12); }
.hu-gombok button:hover { border-color: var(--sanc); color: var(--sanc-sotet); }
.hu-gombok button[hidden] { display: none; }
/* "Ctrl + görgetés" súgó: akkor villan fel, ha nagyítás nélkül görget valaki a térkép fölött */
.hu-sugo { position: absolute; inset: 0; display: grid; place-items: center; pointer-events: none; opacity: 0; transition: opacity .2s;
           background: rgba(0,0,0,.35); color: #fff; font-weight: 600; border-radius: var(--kerekites); }
.hu-terkep.sugo-latszik .hu-sugo { opacity: 1; }
/* a kisebb városok neve csak 2× nagyítás felett (site.js: .reszletes) */
.hu-nev.kis { display: none; }
.hu-terkep.reszletes .hu-nev.kis { display: inline; }
.hu-terkep .hu-nev.takart, .hu-terkep.reszletes .hu-nev.takart { display: none; }   /* másik névvel ütközne (site.js) */
/* a térkép színei egy helyen (sötét módban lent felülírva) */
.hu-terkep {
    --hu-fold-1: #fbf8ef;   /* az ország színe középen … */
    --hu-fold-2: #ece6d3;   /* … és a szélén (sugaras átmenet) */
    --hu-hatar: #a39a86;    /* országhatár */
    --hu-hegy: #b9a26e;     /* hegységek elmosott foltja */
    --hu-viz: #7fb4de;      /* folyók, tavak körvonala */
    --hu-to: #b8d8f0;       /* tavak kitöltése */
    --hu-viznev: #4f8fc0;   /* Duna, Tisza felirat */
    --hu-hegynev: #8d7b4f;  /* hegységnevek */
    --hu-felirat-alap: var(--lap);   /* a városnevek körüli "glória" */
}
.hu-fold-1 { stop-color: var(--hu-fold-1); }
.hu-fold-2 { stop-color: var(--hu-fold-2); }
.hu-hatar { fill: none; stroke: var(--hu-hatar); stroke-width: 2; stroke-linejoin: round; vector-effect: non-scaling-stroke; }
.hu-hegy { fill: var(--hu-hegy); opacity: .42; }
.hu-folyo { fill: none; stroke: var(--hu-viz); stroke-width: 2.2; stroke-linecap: round; stroke-linejoin: round; vector-effect: non-scaling-stroke; }
.hu-to { fill: var(--hu-to); stroke: var(--hu-viz); stroke-width: 1; vector-effect: non-scaling-stroke; }
.hu-viznev { fill: var(--hu-viznev); font: italic 600 15px var(--betu); letter-spacing: .12em; text-anchor: middle; pointer-events: none; }
.hu-hegynev { fill: var(--hu-hegynev); font: italic 500 13px var(--betu); letter-spacing: .04em; text-anchor: middle; pointer-events: none; display: none; }
.hu-terkep.reszletes .hu-hegynev { display: inline; }
.hu-pont circle { fill: var(--sanc); fill-opacity: .82; stroke: #fff; stroke-width: 2.5; transition: fill-opacity .15s, stroke-width .15s; }
.hu-pont:hover circle, .hu-pont:focus-visible circle { fill-opacity: 1; stroke: var(--szoveg); stroke-width: 3; }
.hu-pont.kiemelt circle { fill: var(--grafit, #2b3036); fill-opacity: 1; stroke: var(--sanc); stroke-width: 4; }
.hu-szam { fill: #fff; font: 700 17px var(--betu); text-anchor: middle; dominant-baseline: central; pointer-events: none; }
.hu-nev { fill: var(--szoveg); font: 600 19px var(--betu); text-anchor: middle; pointer-events: none;
          paint-order: stroke; stroke: var(--hu-fold-1); stroke-width: 5px; stroke-linejoin: round; }
.hu-terkep figcaption { margin-top: .4rem; }
.hu-terkep .hu-hianyzo { color: var(--halvany); }
:root[data-theme="dark"] .hu-terkep {
    --hu-fold-1: #30363c; --hu-fold-2: #252a2f; --hu-hatar: #5d666f; --hu-hegy: #6b6046;
    --hu-viz: #3f6f94; --hu-to: #2a4a63; --hu-viznev: #7fb4de; --hu-hegynev: #a8996f;
}
:root[data-theme="dark"] .hu-pont circle { stroke: var(--lap); }
@media (prefers-color-scheme: dark) {
    :root:not([data-theme="light"]) .hu-terkep {
        --hu-fold-1: #30363c; --hu-fold-2: #252a2f; --hu-hatar: #5d666f; --hu-hegy: #6b6046;
        --hu-viz: #3f6f94; --hu-to: #2a4a63; --hu-viznev: #7fb4de; --hu-hegynev: #a8996f;
    }
    :root:not([data-theme="light"]) .hu-pont circle { stroke: var(--lap); }
}

/* ===================================================================== Támogatás (Pages/Tamogatas.cshtml) */
.tamogatas { max-width: 760px; margin: 0 auto; line-height: 1.65; text-align: justify; }
.tamogatas h1 { margin: 0 0 1rem; text-align: left; }
.tam-koszones { font-size: 1.25rem; font-weight: 600; margin: 0 0 1rem; }
.tam-kedvezmenyezett { display: flex; flex-direction: column; align-items: center; gap: .1rem; margin: 1.6rem 0 1rem; text-align: center; }
.tam-kedvezmenyezett span { color: var(--szoveg-2); font-size: .9rem; }
.tam-kedvezmenyezett strong { font-size: 1.25rem; }
.tam-kedvezmenyezett small { color: var(--halvany); font-size: .82rem; }
.tam-modok { list-style: none; margin: 0 auto 1.8rem; padding: 0; max-width: 520px; border: 1px solid var(--vonal); border-radius: var(--kerekites); overflow: hidden; }
.tam-modok li { display: flex; align-items: center; justify-content: space-between; gap: 1rem; padding: .75rem 1rem; background: var(--lap); }
.tam-modok li + li { border-top: 1px solid var(--vonal); }
.tam-mod-nev { font-weight: 700; letter-spacing: .04em; text-transform: uppercase; color: var(--szoveg-2); }
.tam-szamla { display: flex; align-items: center; gap: .5rem; flex-wrap: wrap; justify-content: flex-end; }
.tam-szamla strong { font-variant-numeric: tabular-nums; letter-spacing: .02em; }
.tam-masol { border: 1px solid var(--vonal); background: transparent; color: var(--szoveg-2); border-radius: 6px; padding: .15rem .55rem; font: 600 .82rem var(--betu); cursor: pointer; }
.tam-masol:hover { border-color: var(--sanc); color: var(--sanc-sotet); }
.tam-alairas { margin-top: 1.4rem; text-align: left; }
.tam-labda { display: block; margin: 1rem auto 2rem; width: min(320px, 70%); height: auto; mix-blend-mode: multiply; border-radius: var(--kerekites); }
:root[data-theme="dark"] .tam-labda { mix-blend-mode: normal; }
@media (prefers-color-scheme: dark) { :root:not([data-theme="light"]) .tam-labda { mix-blend-mode: normal; } }
@media (max-width: 560px) {
    .tamogatas { text-align: left; }
    .tam-modok li { flex-direction: column; align-items: flex-start; gap: .4rem; }
    .tam-szamla { justify-content: flex-start; }
}

/* figyelmeztetés (nem hiba): pl. létszámcsökkentés az edzés beállításain */
.uzenet-figyelem {
    background: color-mix(in srgb, #e0a100 14%, var(--lap));
    border-left: 4px solid #e0a100;
    padding: .7rem 1rem;
    border-radius: 6px;
    margin: 0 0 1rem;
    font-weight: 500;
}
.mezo-figyelem { display: block; margin-top: .3rem; font-size: .88rem; color: #9a6b00; }
.mezo-figyelem[hidden] { display: none; }
:root[data-theme="dark"] .mezo-figyelem { color: #f0c04a; }
@media (prefers-color-scheme: dark) { :root:not([data-theme="light"]) .mezo-figyelem { color: #f0c04a; } }

/* ===================================================================== A mezőny erőssége (edzés oldal, #erosseg)
   Számítás: Data/MezonyErosseg.cs. Teljes szélességű sor a két hasáb alatt; a színek az edzés hangulatszínei (--h-eros). */
/* a két hasáb alatti teljes szélességű sorok, ebben a sorrendben: mezőny erőssége, megosztás, szervezőknek
   (mobilon a .edzes-racs flex oszlop, ott az order értékek döntenek) */
.edzes-racs > .erosseg, .edzes-racs > .megosztas-szakasz, .edzes-racs > .szervezo-panel { grid-column: 1 / -1; }
.erosseg-tartalom { display: grid; grid-template-columns: minmax(260px, 1fr) minmax(0, 1.6fr); gap: 1.5rem 2.5rem; align-items: center; }
.erosseg-szint { margin: 0 0 .15rem; font-size: 1rem; }
.erosseg-szint strong { font: 400 2.6rem/1 var(--kijelzo); letter-spacing: .02em; color: var(--h-eros, var(--sanc)); }
.erosseg-szint span { color: var(--halvany); font-weight: 600; margin-left: .25rem; }
.erosseg-alap { margin: 0 0 .9rem; font-size: .85rem; }
/* skála: 0–100, a szintek helyével és nevével. A sáv az edzés halvány színétől (Kezdő) az erős színéig (Superhero) megy át;
   a pöttyben a pontszám (% jel nélkül). */
.erosseg-skala { position: relative; height: 30px; margin: .3rem .9rem 2.1rem; }
.erosseg-skala::before {
    content: ""; position: absolute; left: 0; right: 0; top: 50%; height: 10px; transform: translateY(-50%); border-radius: 999px;
    background: linear-gradient(90deg, color-mix(in srgb, var(--h-eros, var(--sanc)) 14%, var(--lap)), var(--h-eros, var(--sanc)));
}
.erosseg-szintjel { position: absolute; top: 38px; transform: translateX(-50%); font-size: .72rem; font-weight: 600; color: var(--halvany); white-space: nowrap; }
.erosseg-szintjel:last-child { transform: translateX(-100%); }   /* Superhero a jobb szélen: ne lógjon ki */
.erosseg-szintjel::before { content: ""; position: absolute; left: 50%; top: -12px; width: 1px; height: 7px; background: var(--halvany); }
.erosseg-szintjel:last-child::before { left: auto; right: 0; }
.erosseg-jelolo { position: absolute; top: 50%; z-index: 1; width: 30px; height: 30px; transform: translate(-50%, -50%); border-radius: 50%;
                  display: grid; place-items: center; font: 700 .75rem/1 var(--betu);
                  background: var(--h-eros, var(--sanc)); color: var(--h-eros-szoveg, #fff);
                  border: 3px solid var(--lap); box-shadow: 0 0 0 1px var(--h-eros, var(--sanc)), 0 2px 6px rgba(0,0,0,.2); }
/* Tag oldal, "Értékelése" kártya: a szintpont pöttye a jobb felső sarokban (ugyanaz a stílus, mint az .erosseg-jelolo) */
#ertekeles { position: relative; }
.ertekeles-pont { position: absolute; top: 1rem; right: 1rem;
                  width: 44px; height: 44px; border-radius: 50%;
                  display: grid; place-items: center;
                  font: 400 1.5rem/1 var(--kijelzo); letter-spacing: .02em; padding-top: 2px;   /* a szám betűtípusa: a címek Bebas Neue-ja */
                  background: var(--h-eros, var(--sanc)); color: var(--h-eros-szoveg, #fff);
                  border: 3px solid var(--lap); box-shadow: 0 0 0 1px var(--h-eros, var(--sanc)), 0 2px 6px rgba(0,0,0,.2); }
.erosseg-grafikon { margin: 0; }
.erosseg-grafikon svg { display: block; width: 100%; height: auto; max-height: 220px; }
.eg-racs { stroke: var(--vonal); stroke-width: 1; stroke-dasharray: 2 3; }
.eg-alap { stroke: var(--halvany); stroke-width: 1; }
.eg-tengely { fill: var(--halvany); font: 10px var(--betu); text-anchor: end; }
.eg-oszlop rect { fill: var(--h-eros, var(--sanc)); fill-opacity: .55; }
.eg-oszlop.aktualis rect { fill-opacity: 1; }
.eg-oszlop.varhato rect { fill-opacity: .22; stroke: var(--h-eros, var(--sanc)); stroke-width: 1.5; stroke-dasharray: 3 2; }
.eg-oszlop:hover rect { fill-opacity: .85; }
.eg-ertek { fill: var(--szoveg-2); font: 600 11px var(--betu); text-anchor: middle; }
.eg-oszlop.aktualis .eg-ertek { fill: var(--szoveg); font-weight: 700; }
.eg-ertek.nincs { fill: var(--halvany); }
.eg-datum { fill: var(--halvany); font: 10.5px var(--betu); text-anchor: middle; }
.eg-oszlop.aktualis .eg-datum { fill: var(--szoveg); font-weight: 600; }
.erosseg-megjegyzes { font-size: .75rem; line-height: 1.4; color: var(--halvany); margin: .8rem 0 0; }
@media (max-width: 760px) {
    .erosseg-tartalom { grid-template-columns: 1fr; }
}

/* ==========================================================================
   VISSZAÁLLÍTVA (okt. 20.): ezek a szabályok egy korábbi összefésülésnél kimaradtak a fájlból –
   verseny-lapozó, versenynaptár "Mind" nézet, megosztás szakasz, edzés névjegye, üres szavazat
   ========================================================================== */
/* Főoldal – verseny-lapozó: egyszerre egy kártya, alatta ‹ Előző · 3 / 12 · Következő › */
.verseny-lapozo.lapozva > li { border-top: 0; }
.verseny-lapozo > li[hidden] { display: none; }
.kartya-nav { display: flex; align-items: center; justify-content: space-between; gap: .5rem; margin-top: .6rem; }
.kartya-nav[hidden] { display: none; }
.kartya-nav button:disabled { opacity: .4; cursor: default; }
.kartya-nav [data-kartya-szam] { font-size: .9rem; font-variant-numeric: tabular-nums; }
/* lezajlott verseny a főoldalon: félig elszürkítve, mint a versenynaptár "Mind" nézetében */
.verseny-lapozo li.elmult > a { opacity: .55; filter: grayscale(.7); transition: opacity .15s ease, filter .15s ease; }
.verseny-lapozo li.elmult > a:hover { opacity: .85; filter: none; }
.cimke.verseny-lezajlott { margin-left: .4rem; font-size: .72rem; }

/* Versenynaptár, "Mind" nézet: a lezajlottak félig elszürkülnek, a közelgők SANC színű keretet kapnak */
.vn-racs.mind .vn-kartya.elmult { opacity: .55; filter: grayscale(.7); }
.vn-racs.mind .vn-kartya.elmult:hover { opacity: .85; filter: none; }
.vn-racs.mind .vn-kartya:not(.elmult) { border: 2px solid var(--sanc); }

/* ==========================================================================
   Edzés oldal – Megosztás (szürke szakasz a hozzászólások alatt)
   ========================================================================== */
.megosztas-szakasz { background: color-mix(in srgb, var(--szoveg) 5%, var(--papir)); border-color: transparent; }   /* a szürke háttér */
.megosztas-sor { display: flex; flex-direction: column; gap: .3rem; }
.megosztas-sor + .megosztas-sor { margin-top: 1.2rem; }
.megosztas-sor > label { font-weight: 700; color: var(--sanc-sotet, var(--sanc)); }
.masol-sor { display: flex; flex-wrap: wrap; gap: .5rem; margin-top: .2rem; }
.masol-sor input { flex: 1 1 260px; min-width: 0; font-size: .92rem; background: var(--lap); }

/* ==========================================================================
   Edzés névjegye (/edzes-nevjegy/123) – nyilvános, megosztható bemutató
   ========================================================================== */
.nevjegy-oldal { min-height: 100vh; padding: 2rem 16px; background: var(--papir); }
.nevjegy { max-width: 760px; margin: 0 auto; background: var(--lap); border-radius: 18px; overflow: hidden; box-shadow: 0 18px 50px rgba(15, 20, 25, .2); border: 2px solid var(--hv-eros, var(--sanc)); }
.nevjegy-kep {
    position: relative; aspect-ratio: 16 / 8; background: var(--grafit) center / cover no-repeat;
    display: flex; flex-direction: column; justify-content: space-between; padding: 1.25rem 1.5rem; color: #fff; isolation: isolate;
}
.nevjegy-kep::before { content: ""; position: absolute; inset: 0; z-index: -1; background: linear-gradient(180deg, rgba(20, 23, 26, .55), rgba(20, 23, 26, .05) 45%, rgba(20, 23, 26, .5)); }
.nevjegy-logo { font-family: var(--kijelzo); font-size: 3.2rem; line-height: .9; color: #fff; text-decoration: none; }
.nevjegy-logo span { color: var(--sanc); font-size: .45em; }
.nevjegy-bemutatja { font-weight: 600; font-size: 1.05rem; text-shadow: 0 1px 6px rgba(0, 0, 0, .5); }
.nevjegy-test { padding: 1.5rem 1.75rem 2rem; display: flex; flex-direction: column; gap: .6rem; text-align: center; align-items: center; }
.nevjegy-test h1 { margin: 0; font-size: clamp(1.7rem, 4vw, 2.4rem); }
.nevjegy-test p { margin: 0; }
.nevjegy-hely { font-size: 1.1rem; color: var(--szoveg-2); }
.nevjegy-ido b { color: var(--hv-eros, var(--sanc)); }
.nevjegy-letszam { font-weight: 600; color: var(--szabad); }
.nevjegy-leiras { text-align: left; align-self: stretch; margin: .5rem 0; padding-top: .8rem; border-top: 1px solid var(--vonal); }
.nevjegy-gomb { min-width: 260px; margin-top: .5rem; }
.nevjegy-megjegyzes { font-size: .88rem; color: var(--halvany); max-width: 420px; }

/* kedvelések: nullánál nincs kiírva semmi */
.szavazat:empty { display: none; }

/* ==========================================================================
   Csapatok (Pages/Csapatok.cshtml, Csapat.cshtml, CsapatSzerkeszt.cshtml)
   ========================================================================== */
.cs-kereso { display: flex; flex-wrap: wrap; align-items: center; gap: .5rem; margin: 0 0 1.25rem; }
.cs-kereso input[type="search"] { flex: 0 1 380px; min-width: 0; }
/* szűrő pipák "pirulaként": a bepipált narancs */
.cs-szurok { display: flex; flex-wrap: wrap; gap: .4rem; margin-left: .5rem; }
.cs-szuro { display: inline-flex; align-items: center; gap: .35rem; padding: .3rem .8rem; border: 1px solid var(--vonal); border-radius: 999px;
            background: var(--lap); font-size: .92rem; font-weight: 600; cursor: pointer; }
.cs-szuro:has(input:checked) { background: var(--sanc); border-color: var(--sanc); color: #1f1205; }
.cs-szuro input { margin: 0; accent-color: #1f1205; }
/* lista: kártyák – szélesek és alacsonyak: balra a szöveg, jobbra a kép (a HTML-ben a kép van elöl, ezért row-reverse);
   az egész kártya link a csapatoldalra */
.cs-racs { list-style: none; margin: 0 0 1.5rem; padding: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 480px), 1fr)); gap: 1.1rem; }
.cs-kartya > a { display: flex; flex-direction: row-reverse; align-items: stretch; height: 100%; min-height: 170px; border-radius: 4px; overflow: hidden;
                 background: var(--lap); border: 1px solid var(--vonal); color: var(--szoveg); text-decoration: none; transition: transform .15s, box-shadow .15s; }
.cs-kartya > a:hover { transform: translateY(-2px); box-shadow: 0 10px 28px rgba(15, 20, 25, .14); }
.cs-kartya > a:hover .cs-kartya-nev { text-decoration: underline; }
.cs-kartya.sajat > a { border: 2px solid var(--sanc); }
.cs-kartya-kep-doboz { position: relative; display: block; flex: 0 0 38%; background: var(--grafit); }   /* a kép szélessége */
.cs-kartya-kep { position: absolute; inset: 0; display: block; width: 100%; height: 100%; object-fit: cover; }
.cs-kartya-kep.ures { display: grid; place-items: center; color: rgba(255, 255, 255, .9); font: 400 2.8rem var(--kijelzo); letter-spacing: .05em; }
.cs-friss { position: absolute; top: .55rem; right: .55rem; padding: .2rem .6rem; border-radius: 999px; background: var(--sanc); color: #1f1205;
            font-size: .75rem; font-weight: 700; box-shadow: 0 2px 8px rgba(0, 0, 0, .25); }
.cs-kartya-szoveg { display: flex; flex-direction: column; gap: .2rem; padding: .8rem 1rem .85rem; flex: 1; min-width: 0; text-align: left; }
.cs-kartya-nev { font-size: 1.15rem; color: var(--h-nev, var(--szoveg)); }
.cs-kartya-letszam { font-weight: 400; color: var(--halvany); margin-left: .3rem; }   /* a név mögött: ugyanakkora, halványabb */
.cimke.cs-friss-cimke { background: var(--sanc); color: #1f1205; }
.cs-kartya-sor { display: flex; flex-wrap: wrap; align-items: center; gap: .2rem .7rem; font-size: .88rem; color: var(--szoveg-2); }
.cs-kartya-hozz { display: block; font-size: .85rem; color: var(--halvany); }
.cs-kartya-hozz.friss { color: var(--sanc-sotet, var(--sanc)); font-weight: 600; }
.cs-kartya-cimkek { display: flex; flex-wrap: wrap; gap: .35rem; margin-top: .3rem; }
.cs-kartya-tovabb { margin-top: auto; padding-top: .4rem; font-weight: 700; font-size: .9rem; color: var(--h-nev, var(--sanc-sotet, var(--sanc))); }
/* hangulatszín a csapatkép átlagszínéből (Pages/Csapatok.cshtml.cs → --hv-*/--hs-* változók; kép nélkül az alapszínek) */
.cs-kartya > a { background: var(--h-hatter, var(--lap)); }
/* a háttér magából a kép átlagszínéből keveredik: balra halványabb, a kép felé erősebb (a %-ok az erősség) */
.cs-kartya[style*="--cs-szin"] > a {
    background: linear-gradient(90deg, color-mix(in srgb, var(--cs-szin) 14%, var(--lap)), color-mix(in srgb, var(--cs-szin) 32%, var(--lap)));
}
.cs-kartya[style*="--hv-eros"] > a { border-color: color-mix(in srgb, var(--h-eros) 45%, transparent); }
.cs-kartya.sajat > a { border-color: var(--sanc); }   /* a saját csapat kerete akkor is narancs, ha van hangulatszín */
.cimke.cs-keres { background: color-mix(in srgb, var(--szabad) 16%, var(--lap)); color: var(--szabad); }
/* csapatoldal: fejléc */
.cs-fej { position: relative; border-radius: 16px; overflow: hidden; background: var(--grafit); color: #fff; margin-bottom: 1.5rem; }
.cs-fokep { display: block; width: 100%; max-height: 380px; object-fit: cover; }
.cs-fej-szoveg { display: flex; justify-content: space-between; align-items: flex-end; gap: 1rem; flex-wrap: wrap; padding: 1.2rem 1.4rem; }
.cs-fej:not(.kep-nelkul) .cs-fej-szoveg { position: absolute; inset: auto 0 0 0; background: linear-gradient(0deg, rgba(20, 23, 26, .85), rgba(20, 23, 26, 0)); padding-top: 3rem; }
.cs-fej h1 { margin: 0; color: #fff; font-size: clamp(1.7rem, 4vw, 2.6rem); }
.cs-fej-sor { display: flex; flex-wrap: wrap; gap: .3rem .9rem; margin: .3rem 0 0; color: rgba(255, 255, 255, .85); }
.cs-fej-jobb { display: flex; align-items: center; gap: .7rem; }
.cs-szavaz { background: rgba(255, 255, 255, .92); color: var(--szoveg); border-radius: 999px; padding: .2rem .5rem; }
:root[data-theme="dark"] .cs-szavaz { background: rgba(30, 34, 38, .92); }
.cs-szavaz .szavazat { font-weight: 700; }
/* csapatoldal: két hasáb */
.cs-oldal-racs { display: grid; grid-template-columns: minmax(0, 1.6fr) minmax(280px, 1fr); gap: 1.5rem; align-items: start; }
.cs-fo, .cs-oldalso { display: flex; flex-direction: column; gap: 1.25rem; min-width: 0; }
.cs-tagok { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: .55rem; }
.cs-tagok li { display: flex; align-items: center; gap: .65rem; }
.cs-tagok .avatar { width: 64px; height: 64px; border-radius: 10px; }   /* a tagok képe: kétszer akkora, lekerekített négyzet */

    .cs-tagok li:not(.menedzser) .avatar {
        border: none;
    }

.cs-tagok .monogram-kicsi { font-size: 1.2rem; }
.cs-tagok li.menedzser .avatar 
{ box-shadow: 0 0 0 2px var(--sanc); 
}
 
.cs-tag-szoveg { display: flex; flex-direction: column; min-width: 0; flex: 1; line-height: 1.25; }
.cs-tag-szoveg a { color: inherit; text-decoration: none; }
.cs-tag-szoveg a:hover { text-decoration: underline; }
.cs-tag-szoveg .halvany { font-size: .85rem; }
.cs-tartalek-cim { margin: 1rem 0 .5rem; font-size: .95rem; color: var(--szoveg-2); }
.cimke.cs-tag-cimke { background: color-mix(in srgb, var(--sanc) 16%, var(--lap)); color: var(--sanc-sotet, var(--sanc)); font-size: .72rem; }
.cs-kilepes { margin-top: 1rem; }
/* a csapattagok hozzászólása kiemelve */
/* --cs-szin: a csapatkép átlagszíne (Pages/Csapat.cshtml írja ki); kép nélkül a SANC narancs */
.hozzaszolas.csapattag .hozzaszolas-test {
    background: color-mix(in srgb, var(--cs-szin, var(--sanc)) 10%, var(--lap));
    border: 1px solid color-mix(in srgb, var(--cs-szin, var(--sanc)) 50%, var(--lap));
    );
    border-radius: 8px;
    padding: .5rem .75rem;
}
.hozzaszolas.csapattag .avatar {
    width: 104px;
    height: 104px;
    border-radius: 8px;
}
/* szerkesztő */
/* egy hasáb, középen: fent az adatok, alatta a tagok (így a tagok sorai elég szélesek a három hasábhoz), legalul a törlés */
.cs-szerk-racs { display: grid; grid-template-columns: minmax(0, 1fr); gap: 1.5rem; align-items: start; max-width: 920px; margin: 0 auto; }
.cs-szerk-racs > .veszely-szakasz { grid-column: 1 / -1; }
.cs-szerk-kep { margin-top: 1rem; }
.cs-szerk-kep .cimke-felirat { display: block; font-weight: 600; margin-bottom: .35rem; }
.cs-tag-fel { display: flex; flex-direction: column; gap: .5rem; padding-bottom: 1rem; margin-bottom: 1rem; border-bottom: 1px solid var(--vonal); }
.cs-tag-fel > label { font-weight: 600; }
.cs-tag-fel-sor { display: flex; flex-wrap: wrap; align-items: center; gap: .5rem .8rem; }
.cs-tag-fel-sor input[type="text"] { flex: 1 1 160px; min-width: 0; }
/* a tagok szerkesztése: tagonként egy külön kártya, három hasábbal
   (név + poszt | mez, tartalék, menedzser | mentés, kivétel) */
.cs-tag-szerk { list-style: none; margin: 0 0 .8rem; padding: 0; display: flex; flex-direction: column; gap: .7rem; container-type: inline-size; }
.cs-tag-szerk > li {
    display: grid; grid-template-columns: minmax(14rem, 1fr) auto 7.5rem; align-items: center; gap: .6rem 1.5rem;
    padding: .8rem 1rem; border: 1px solid var(--vonal); border-radius: 10px; background: var(--papir);
}
.cs-tag-szerk > li.menedzser { border-left: 4px solid var(--sanc); }
.cs-tag-bal { display: flex; flex-direction: column; gap: .35rem; min-width: 0; }
.cs-tag-nev { font-weight: 700; min-width: 0; overflow-wrap: anywhere; }
.cs-tag-nev a { color: inherit; }
.cs-tag-szerk li.menedzser .cs-tag-nev { color: var(--sanc-sotet, var(--sanc)); }
.cs-tag-bal input { width: 100%; max-width: 18rem; padding: .3rem .5rem; font-size: .9rem; }
.cs-tag-kozep { display: flex; align-items: center; gap: .5rem 1rem; }
.cs-tag-kozep .pipa { white-space: nowrap; margin: 0; }
.cs-mez-mezo { display: inline-flex; align-items: center; gap: .35rem; font-size: .85rem; color: var(--szoveg-2); white-space: nowrap; }
.cs-mez-mezo input { width: 3.4rem; padding: .3rem .4rem; font-size: .9rem; text-align: center; }
.cs-tag-jobb { display: flex; flex-direction: column; align-items: stretch; gap: .3rem; text-align: center; }
.cs-tag-jobb form { margin: 0; }
/* ha keskeny a hely (telefon): név + poszt fent, alatta a mez és a pipák, legalul a gombok egy sorban */
@container (max-width: 600px) {
    .cs-tag-szerk > li { grid-template-columns: 1fr; gap: .55rem; }
    .cs-tag-kozep { flex-wrap: wrap; }
    .cs-tag-jobb { flex-direction: row; align-items: center; justify-content: space-between; }
}

@media (max-width: 860px) {
    .cs-oldal-racs, .cs-szerk-racs { grid-template-columns: 1fr; }
    .cs-fej:not(.kep-nelkul) .cs-fej-szoveg { position: static; background: var(--grafit); }
}


/* ======================================================================
   Admin mód: kapcsoló a fejlécben, narancs sáv a fejléc alatt
   ====================================================================== */
.admin-kapcsolo-urlap { margin: 0; }
.admin-kapcsolo {
    display: inline-flex; align-items: center; gap: .4rem;
    height: 40px; padding: 0 .8rem;
    border-radius: 999px;
    border: 1px solid #4a525b;
    background: none;
    color: #d6dbe0;
    font: inherit; font-weight: 600; font-size: .9rem; letter-spacing: .02em;
    cursor: pointer;
}
.admin-kapcsolo:hover { color: #fff; border-color: #fff; }
.admin-kapcsolo-potty { width: .6rem; height: .6rem; border-radius: 50%; background: #6b737c; }
.admin-kapcsolo.be { background: var(--sanc); border-color: var(--sanc); color: #1f1205; }
.admin-kapcsolo.be .admin-kapcsolo-potty { background: #1f1205; box-shadow: 0 0 0 3px rgba(31, 18, 5, .2); }

.admin-sav {
    background: var(--sanc);
    color: #1f1205;
}
.admin-sav-belso {
    max-width: var(--szelesseg); margin: 0 auto; padding: .45rem 16px;
    display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: .4rem 1rem;
    font-size: .95rem;
}
.admin-sav form { margin: 0; }
.admin-sav .gomb.kicsi { padding-top: .2rem; padding-bottom: .2rem; }
@media (max-width: 700px) { .admin-sav-reszlet { display: none; } }
/* adminnál két elemmel több van a fejlécben (Admin menü + kapcsoló): asztalon a név helyett csak a profilkép látszik,
   és a menüpontok kicsit közelebb kerülnek egymáshoz, hogy minden kiférjen a fejléc szélességébe */
@media (min-width: 901px) {
    .fejlec.van-admin .fejlec-belso { gap: 1rem; }
    .fejlec.van-admin .fiok-nev span:not(.monogram) { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }
    .fejlec.van-admin .fomenu ul a { padding-left: .5rem; padding-right: .5rem; }
}
.admin-sav .gomb.masodlagos { background: #1f1205; color: #fff; border-color: #1f1205; }

/* ======================================================================
   Admin felület (/admin)
   ====================================================================== */
.admin-szamok {
    display: grid; grid-template-columns: repeat(auto-fill, minmax(160px, 1fr)); gap: 1.1rem;
    margin: .5rem 0 2rem;
}
.admin-szam, .admin-szam > a {
    display: flex; flex-direction: column; gap: .15rem;
    color: inherit; text-decoration: none;
}
.admin-szam {
    background: var(--lap); border: 1px solid var(--vonal); border-top: 4px solid var(--sanc); border-radius: var(--kerekites);
    padding: .9rem 1rem 1rem;
    box-shadow: 0 3px 10px rgba(0, 0, 0, .09), 0 1px 2px rgba(0, 0, 0, .08);
}
.admin-szam b { font-family: var(--kijelzo); font-weight: 400; font-size: 2.1rem; line-height: 1; color: var(--sanc-sotet); }
.admin-szam span { color: var(--szoveg-2); font-size: .9rem; line-height: 1.3; }
.admin-racs { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1.25rem; margin-bottom: 1.25rem; align-items: start; }
.admin-tabla { width: 100%; border-collapse: collapse; font-size: .95rem; }
.admin-tabla th { text-align: left; font-weight: 600; color: var(--szoveg-2); font-size: .85rem; padding: .4rem .5rem; border-bottom: 2px solid var(--vonal); }
.admin-tabla td { padding: .5rem; border-bottom: 1px solid var(--vonal); vertical-align: top; overflow-wrap: anywhere; }
.admin-tabla td .cimke { margin-right: .3rem; }
.admin-ido { white-space: nowrap; color: var(--szoveg-2); }
.admin-sql { margin-top: 1rem; }
.admin-sql summary { cursor: pointer; font-weight: 600; }
.admin-sql pre { background: var(--papir); border: 1px solid var(--vonal); border-radius: 8px; padding: .75rem; overflow-x: auto; font-size: .85rem; }
.cimke.aktiv, a.cimke.aktiv { background: var(--kiemelt-hatter); color: var(--kiemelt-szoveg); border-color: transparent; }
a.cimke { text-decoration: none; }
a.cimke:hover { border-color: var(--sanc); }
@media (max-width: 900px) {
    .admin-racs { grid-template-columns: minmax(0, 1fr); }
}

/* ======================================================================
   Hírek: főoldali doboz, lista (/hirek), cikk (/hir/12), szerkesztő
   ====================================================================== */
.hir-mini-lista { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; }
.hir-mini-lista li { border-top: 1px solid var(--vonal); }
.hir-mini-lista li:first-child { border-top: 0; }
.hir-mini-lista a { display: flex; gap: .75rem; align-items: flex-start; padding: .6rem 0; color: inherit; text-decoration: none; }
.hir-mini-lista a:hover b { color: var(--sanc-sotet); }
.hir-mini-lista img { width: 96px; aspect-ratio: 16 / 9; height: auto; object-fit: cover; border-radius: 6px; flex-shrink: 0; }
.hir-mini-lista .elso a { flex-direction: column; padding-top: 0; }
.hir-mini-lista .elso img { width: 100%; border-radius: 8px; }
.hir-mini-lista .elso b { font-size: 1.15rem; }
.hm-szoveg { display: flex; flex-direction: column; gap: .15rem; min-width: 0; }
.hm-szoveg b { line-height: 1.3; overflow-wrap: anywhere; }
.hm-datum { color: var(--halvany); font-size: .85rem; display: flex; align-items: center; gap: .4rem; }
.hm-kivonat { color: var(--szoveg-2); font-size: .95rem; display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; }
.fo-hirek-lab { margin: .6rem 0 0; }

.hir-tagfelho { display: flex; flex-wrap: wrap; gap: .4rem; margin: 0 0 1.25rem; }
.hir-tagfelho .cimke { font-size: .9rem; padding: .2rem .65rem; }
.hir-tagfelho .cimke .halvany { font-weight: 500; }
.hir-tagfelho .cimke.aktiv .halvany { color: inherit; opacity: .75; }

.hir-kartyak { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); gap: 1.25rem; }
.hir-kartyak.kicsi { grid-template-columns: repeat(auto-fill, minmax(200px, 1fr)); gap: 1rem; }
.hir-kartya {
    display: flex; flex-direction: column; height: 100%;
    background: var(--lap); border: 1px solid var(--vonal); border-radius: var(--kerekites); overflow: hidden;
    color: inherit; text-decoration: none;
    transition: border-color .15s, transform .15s;
}
.hir-kartya:hover { border-color: var(--sanc); transform: translateY(-2px); text-decoration: none; }
.hir-kartya.nem-lathato { border-style: dashed; }
.hir-kartya.nem-lathato img { opacity: .6; }
.hir-kartya img { width: 100%; aspect-ratio: 16 / 9; height: auto; object-fit: cover; display: block; }
.hk-test { display: flex; flex-direction: column; gap: .35rem; padding: .85rem 1rem 1rem; }
.hk-datum { color: var(--halvany); font-size: .85rem; display: flex; flex-wrap: wrap; align-items: center; gap: .4rem; }
.hk-cim { font-weight: 700; font-size: 1.1rem; line-height: 1.3; overflow-wrap: anywhere; }
.hir-kartyak.kicsi .hk-cim { font-size: 1rem; }
.hk-kivonat { color: var(--szoveg-2); font-size: .95rem; display: -webkit-box; -webkit-line-clamp: 4; -webkit-box-orient: vertical; overflow: hidden; }
.hir-lapozo { display: flex; justify-content: center; align-items: center; gap: 1rem; margin-top: 1.5rem; }
@media (prefers-reduced-motion: reduce) { .hir-kartya, .hir-kartya:hover { transition: none; transform: none; } }

.hir-cikk { max-width: 900px; margin: 0 auto; }   /* 760px + 10% */
.hir-cikk-fej { margin-bottom: 1.25rem; }
.hir-cikk-datum { color: var(--halvany); margin: 0 0 .5rem; display: flex; align-items: center; gap: .5rem; }
.hir-cikk-fej h1 { overflow-wrap: anywhere; }
.hir-cikk-bevezeto { font-size: 1.2rem; line-height: 1.5; color: var(--szoveg-2); margin: .9rem 0 0; }
.hir-cikk-szerzo { display: flex; flex-wrap: wrap; align-items: center; gap: .5rem .75rem; margin-top: 1rem; }
.hir-szerzo { display: inline-flex; align-items: center; gap: .5rem; font-weight: 600; color: inherit; }
.hir-szerzo img { width: 36px; height: 36px; border-radius: 50%; object-fit: cover; }
.hir-cikk-szerzo .gomb { margin-left: auto; }
.hir-cikk-kep { width: 100%; height: auto; border-radius: var(--kerekites); margin: 0 0 1.5rem; display: block; }
/* a hír szövege fehér szakaszban (mint a főoldali dobozok); a cím, a kép és a hozzászólások kívül maradnak */
.hir-cikk-szoveg { font-size: 1.08rem; line-height: 1.4; overflow-wrap: anywhere;
    background: var(--lap); border: 1px solid var(--vonal); border-radius: var(--kerekites);
    padding: 1.6rem 1.9rem 1rem; margin: 1.25rem 0; box-shadow: rgba(0, 0, 0, 0.08) 0px 8px 30px; }
.hir-cikk-szoveg > :first-child { margin-top: 0; }
@media (max-width: 600px) { .hir-cikk-szoveg { padding: 1.1rem 1rem .6rem; } }
.hir-cikk-szoveg h1 { font-size: 2.2rem; line-height: 1.2; margin: 2.2rem 0 .7rem; }
.hir-cikk-szoveg h2 { font-size: 1.85rem; line-height: 1.25; margin: 2rem 0 .6rem; }
.hir-cikk-szoveg h3 { font-size: 1.45rem; line-height: 1.3; margin: 1.6rem 0 .5rem; }
.hir-cikk-szoveg p { margin: 0 0 1.1rem; }
.hir-cikk-szoveg ul { margin: 0 0 1.1rem; padding-left: 1.4rem; }
.hir-cikk-szoveg li { margin: .25rem 0; }
.hir-cikk-szoveg a { color: var(--sanc-sotet); }
.hir-cikk-tagek { margin-top: 1.5rem; }
.hir-tobbi { max-width: 900px; margin: 2.5rem auto 0; padding-top: 1.5rem; border-top: 1px solid var(--vonal); }

.hir-szoveg-mezo { min-height: 22rem; }
.hir-tag-javaslat { display: flex; flex-wrap: wrap; align-items: center; gap: .35rem; margin-top: .35rem; font-size: .9rem; }
.hir-tag-javaslat button.cimke { cursor: pointer; font: inherit; font-size: .82rem; font-weight: 600; }
.hir-tag-javaslat button.cimke:hover { border-color: var(--sanc); }
.hir-sugo dl { display: grid; grid-template-columns: auto 1fr; gap: .35rem .75rem; margin: 0; font-size: .9rem; }
.hir-sugo dt { white-space: nowrap; }
.hir-sugo dd { margin: 0; color: var(--szoveg-2); }
.hir-sugo code { background: var(--papir); padding: .05rem .3rem; border-radius: 4px; font-size: .85rem; }

/* --- hír: tetszik / nem tetszik, hozzászólások száma, hozzászólások --- */
.hir-reakciok {
    display: flex; flex-wrap: wrap; align-items: center; gap: .5rem 1.25rem;
    margin-top: 1.5rem; padding-top: 1rem; border-top: 1px solid var(--vonal);
}
.hir-reakciok .szavazat:empty { display: inline-block; min-width: .5rem; }
.hir-hsz-szam { font-weight: 600; color: var(--sanc-sotet); }
.hir-hozzaszolasok { max-width: 900px; margin: 1.5rem auto 0; }
.hir-szamok { display: inline-flex; flex-wrap: wrap; align-items: center; gap: .25rem .9rem; color: var(--halvany); font-size: .85rem; font-variant-numeric: tabular-nums; }
.hir-szamok > span { display: inline-flex; align-items: center; gap: .3rem; }
.hir-szamok svg { flex-shrink: 0; }
.hk-test .hir-szamok { margin-top: .15rem; }

/* --- felmérő levelek válasza (/valasz/{kulcs}) és a vezérlőpult "Még fut" gombja --- */
.valasz-doboz { max-width: 440px; }
.valasz-edzes {
    display: flex; flex-direction: column; gap: .15rem;
    padding: .85rem 1rem; border: 1px solid var(--vonal); border-left: 4px solid var(--sanc);
    border-radius: var(--kerekites); background: var(--lap);
}
.valasz-edzes b { font-size: 1.1rem; }
.valasz-edzes span { color: var(--szoveg-2); }
.valasz-gombok { display: flex; flex-direction: column; gap: .75rem; margin: 0; }
.valasz-gomb {
    display: flex; flex-direction: column; align-items: flex-start; gap: .2rem; text-align: left;
    width: 100%; padding: .9rem 1rem; cursor: pointer;
    font: inherit; color: var(--szoveg); background: var(--lap);
    border: 1px solid var(--vonal); border-radius: var(--kerekites);
}
.valasz-gomb b { font-size: 1.05rem; }
.valasz-gomb span { color: var(--szoveg-2); font-size: .92rem; line-height: 1.4; }
.valasz-gomb:hover, .valasz-gomb:focus-visible { border-color: var(--sanc); }
.valasz-gomb.fo { border-color: var(--sanc); background: var(--sanc-halvany); }
.pe-megfut { margin: 0; display: contents; }
.admin-halott h3 { font-size: 1.05rem; margin: 1rem 0 .5rem; }
.admin-tabla .szam { text-align: right; white-space: nowrap; font-variant-numeric: tabular-nums; }

/* --- admin: felmérés táblázatai (/admin/edzesek, /admin/tagok) --- */
.admin-szuro {
    display: flex; flex-wrap: wrap; align-items: flex-end; gap: .75rem 1rem;
    background: var(--lap); border: 1px solid var(--vonal); border-radius: var(--kerekites);
    padding: .9rem 1rem; margin-bottom: 1rem;
}
.admin-szuro .mezo { min-width: 160px; flex: 0 1 200px; }
.admin-szuro .mezo:first-child { flex: 1 1 260px; }
.admin-szuro .mezo > span { font-weight: 600; font-size: .85rem; color: var(--szoveg-2); }
.admin-szuro .pipa { align-self: center; }
.admin-szuro-gombok { display: flex; gap: .5rem; margin-left: auto; }
.admin-fulek { margin-bottom: 1rem; }
.admin-talalat { margin: 0 0 .5rem; }
.admin-tabla-keret { overflow-x: auto; border: 1px solid var(--vonal); border-radius: var(--kerekites); background: var(--lap); }
.admin-felmeres { min-width: 860px; }
.admin-felmeres th { position: sticky; top: 0; background: var(--lap); }
.admin-felmeres td, .admin-felmeres th { padding-left: .75rem; padding-right: .75rem; }
.admin-felmeres tr.all td { opacity: .65; }
.admin-felmeres tr.hibas td { background: color-mix(in srgb, var(--betelt) 6%, transparent); }
.admin-felmeres .allapot { white-space: nowrap; }
.admin-al { display: block; color: var(--halvany); font-size: .82rem; line-height: 1.35; margin-top: .1rem; }
.admin-levelek { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: .25rem; font-size: .88rem; }
.admin-levelek li { display: flex; flex-wrap: wrap; align-items: baseline; gap: .1rem .4rem; }
.admin-levelek li.hibas { color: var(--betelt); }
.admin-levelek .admin-ido { min-width: 3.6rem; }
.cimke.valasz { background: color-mix(in srgb, var(--szabad) 14%, var(--lap)); color: var(--szoveg); border-color: color-mix(in srgb, var(--szabad) 45%, transparent); }
@media (max-width: 700px) {
    .admin-szuro .mezo { flex: 1 1 100%; }
    .admin-szuro-gombok { margin-left: 0; }
}

/* --- admin: nem létező e-mail cím, de aktív tag --- */
.admin-figyelem { border-left: 4px solid var(--betelt); }
.cimke.hiba-cimke { background: var(--betelt); color: #fff; border-color: var(--betelt); font-weight: 700; letter-spacing: .02em; }
.admin-megoldva { display: flex; gap: .4rem; align-items: center; margin: 0; }
.admin-megoldva input[type="text"] { min-width: 180px; padding: .35rem .5rem; font-size: .9rem; }

/* --- figyelmeztetés: a tag e-mail címe nem létezik (db/011) --- */
.email-hiba-sav { background: color-mix(in srgb, var(--betelt) 12%, var(--lap)); border-bottom: 2px solid var(--betelt); color: var(--szoveg); }
.email-hiba-sav-belso {
    max-width: var(--szelesseg); margin: 0 auto; padding: .7rem 16px;
    display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: .5rem 1rem; font-size: .95rem;
}
.email-hiba-sav b { color: var(--betelt); }

/* a plakettekre kattintva bárhol a Támogatás oldal jön fel (site.js) */
.plakett { cursor: pointer; }

/* doboz alján egy "tovább" link (pl. a főoldali felfedező doboz: Minden edzés) */
.fo-doboz-lab { margin: .9rem 0 0; text-align: right; }
.fo-doboz-lab a { font-weight: 700; color: var(--sanc-sotet, var(--sanc)); text-decoration: none; }
.fo-doboz-lab a:hover { text-decoration: underline; }

/* Profil oldal admin módban (más tag profilja): figyelmeztető címke a név fölött */
.admin-szerkeszt-jel { display: inline-block; margin: 0 0 .35rem; padding: .15rem .6rem; border-radius: 999px; background: var(--sanc); color: #fff; font-size: .8rem; font-weight: 700; }

/* Tag lapja: "Régen értékelted – még ez a véleményed?" */
.ertekeles-regi { margin: 0 0 .9rem; padding: .7rem .8rem; border-radius: 8px; background: var(--sanc-halvany); }
.ertekeles-regi p { margin: 0 0 .5rem; }
.ertekeles-regi form { margin: 0 0 .5rem; }
.ertekeles-regi p:last-child { margin: 0; }

/* "Hogyan működik a szintértékelés?" (/ertekeles) */
.ertekeles-leiras { max-width: 780px; margin: 0 auto; }
.ertekeles-leiras h2 { margin-top: 1.8rem; }
.ertekeles-leiras h3 { margin: 1.3rem 0 .4rem; font-size: 1.05rem; }
.leiras-tabla { border-collapse: collapse; margin: .5rem 0 .9rem; min-width: 260px; }
.leiras-tabla th, .leiras-tabla td { padding: .35rem .9rem .35rem 0; border-bottom: 1px solid var(--vonal); text-align: left; }
.leiras-tabla th { font-size: .8rem; text-transform: uppercase; letter-spacing: .04em; color: var(--szoveg-2); }
.leiras-tabla td + td, .leiras-tabla th + th { text-align: right; font-variant-numeric: tabular-nums; }
/* Tag lapja: a "Hogyan működik? ›" link az Értékelése cím alatt */
.ertekeles-hogyan { margin: -.4rem 0 .8rem; font-size: .85rem; }

/* Tagjaink: "Szint" szűrő – kétvégű csúszka (0–100 pont); csak az "Értékelés szerint" pipával látszik */
.tag-szint-szuro:has([data-szint-be]:not(:checked)) .szint-csuszka { display: none; }
.szint-csuszka { margin: .2rem 0 0; }
.szint-csuszka-ertek { font-weight: 700; font-variant-numeric: tabular-nums; margin-bottom: .15rem; }
.ketto-csuszka { position: relative; height: 1.6rem; }
/* a sáv: a kiválasztott tartomány narancs; a fél gombnyi behúzás miatt pontosan a gombok közepéig ér */
.ketto-csuszka::before {
    content: ""; position: absolute; left: .55rem; right: .55rem; top: 50%; height: 6px; transform: translateY(-50%); border-radius: 3px;
    background: linear-gradient(to right, var(--vonal) calc(var(--min) * 1%), var(--sanc) calc(var(--min) * 1%), var(--sanc) calc(var(--max) * 1%), var(--vonal) calc(var(--max) * 1%));
}
.ketto-csuszka input[type="range"] {
    position: absolute; left: 0; top: 50%; transform: translateY(-50%); width: 100%; height: 1.1rem; margin: 0;
    -webkit-appearance: none; appearance: none; background: none; pointer-events: none;
}
.ketto-csuszka input[type="range"]::-webkit-slider-runnable-track { height: 1.1rem; background: none; }
.ketto-csuszka input[type="range"]::-moz-range-track { height: 1.1rem; background: none; }
.ketto-csuszka input[type="range"]::-webkit-slider-thumb {
    -webkit-appearance: none; width: 1.1rem; height: 1.1rem; border-radius: 50%; background: var(--sanc);
    border: 2px solid #fff; box-shadow: 0 1px 3px rgba(0, 0, 0, .35); pointer-events: auto; cursor: pointer;
}
.ketto-csuszka input[type="range"]::-moz-range-thumb {
    width: 1.1rem; height: 1.1rem; box-sizing: border-box; border-radius: 50%; background: var(--sanc);
    border: 2px solid #fff; box-shadow: 0 1px 3px rgba(0, 0, 0, .35); pointer-events: auto; cursor: pointer;
}
.ketto-csuszka input[type="range"]:focus-visible { outline: none; }
.ketto-csuszka input[type="range"]:focus-visible::-webkit-slider-thumb { outline: 2px solid var(--sanc-sotet); outline-offset: 2px; }
.ketto-csuszka input[type="range"]:focus-visible::-moz-range-thumb { outline: 2px solid var(--sanc-sotet); outline-offset: 2px; }
.szint-csuszka-skala { display: flex; justify-content: space-between; padding: 0 .3rem; font-size: .72rem; color: var(--halvany); font-variant-numeric: tabular-nums; }

/* Tagjaink: a szintpont pöttye a kártya jobb felső sarkában, csak bekapcsolt "Szint" szűrőnél (mint a Tag oldal .ertekeles-pont-ja, kisebben) */
.tag-kartya.van-pont { position: relative; padding-right: 2.9rem; }
.tag-pont { position: absolute; top: .6rem; right: .6rem;
            width: 32px; height: 32px; border-radius: 50%;
            display: grid; place-items: center;
            font: 400 1.1rem/1 var(--kijelzo); letter-spacing: .02em; padding-top: 2px;
            background: var(--sanc); color: #fff;
            border: 2px solid var(--lap); box-shadow: 0 0 0 1px var(--sanc), 0 1px 4px rgba(0,0,0,.2); }

/* Tagjaink: tömörebb szűrőpanel (kisebb közök), hogy a Keresés gomb kiférjen; ha mégsem fér ki, a panel magában görgethető */
.tagok-elrendezes .szurok-tartalom { gap: .6rem; margin-top: .75rem; }
.tagok-elrendezes .szurok .csoport { margin: .2rem 0 0; padding: .55rem 0 0; }
.tagok-elrendezes .szurok .csoport legend { margin-bottom: .1rem; }
.tagok-elrendezes .tag-szerep-szuro { gap: .2rem; }
.tagok-elrendezes .szurok .pipa { font-size: .92rem; gap: .45rem; }
.tagok-elrendezes .szurok .pipa input { margin-top: .12rem; }
/* a "Szint" magyarázata apróbetűvel */
.tag-szint-szuro .segito { font-size: .75rem; line-height: 1.35; margin: .3rem 0 0; }
@media (min-width: 901px) {
    .tagok-elrendezes .szurok { max-height: calc(100vh - 80px - 1rem); overflow-y: auto; overscroll-behavior: contain; }
}

/* Verseny kártyák (versenynaptár, főoldal): szem + látogatók, buborék + hozzászólások, mint a híreknél (.hir-szamok) */
.verseny-szamok { margin-top: .45rem; }

/* ==========================================================================
   Fejléc: üzenetek boríték ikon (olvasatlannál narancs szám a sarkán)
   ========================================================================== */
.fejlec-uzenet {
    position: relative; flex-shrink: 0;
    display: grid; place-items: center;
    width: 40px; height: 40px; border-radius: 50%;
    border: 1px solid #4a525b; color: #d6dbe0; text-decoration: none;
    margin-right: -.75rem;   /* közelebb a témakapcsolóhoz */
}
.fejlec-uzenet:hover, .fejlec-uzenet.aktiv { color: #fff; border-color: #fff; }
.fejlec-uzenet.van-uj { color: #fff; border-color: var(--sanc); }
.fejlec-uzenet-szam {
    position: absolute; top: -6px; right: -7px;
    min-width: 20px; height: 20px; padding: 0 5px; border-radius: 999px;
    display: grid; place-items: center;
    background: var(--sanc); color: #1f1205; font-size: .72rem; font-weight: 700; line-height: 1;
    border: 2px solid var(--fejlec-hatter);
}
@media (max-width: 900px) {
    .fejlec-uzenet { order: 1; margin-left: auto; margin-right: 0; }
    .fejlec-uzenet + .fejlec-tema { margin-left: 0; }
}

/* ==========================================================================
   Üzeneteim (/uzenetek): balra a beszélgetések, középen a kiválasztott beszélgetés
   ========================================================================== */
.uz-elrendezes {
    display: grid; grid-template-columns: 310px minmax(0, 1fr); gap: 1.25rem;
    height: calc(100dvh - 96px - 4rem); min-height: 460px;
}
.uz-lista-doboz, .uz-beszelgetes {
    background: var(--lap); border: 1px solid var(--vonal); border-radius: var(--kerekites);
    display: flex; flex-direction: column; overflow: hidden; min-height: 0;
}
.uz-lista-cim { margin: 1rem 1rem .6rem; font-size: 2rem; }
.uz-ures { margin: 0 1rem .75rem; color: var(--halvany); font-size: .92rem; }
.uz-lista-doboz > .gomb { margin: 0 1rem 1rem; align-self: flex-start; }
.uz-partnerek { list-style: none; margin: 0; padding: 0; overflow-y: auto; flex: 1; }
.uz-partner {
    display: flex; align-items: center; gap: .7rem;
    padding: .65rem 1rem; border-top: 1px solid var(--vonal);
    color: inherit; text-decoration: none;
}
.uz-partner:hover { background: color-mix(in srgb, var(--sanc) 6%, var(--lap)); }
.uz-partner.aktiv { background: color-mix(in srgb, var(--sanc) 13%, var(--lap)); box-shadow: inset 4px 0 0 var(--sanc); }
.uz-avatar { width: 44px; height: 44px; border-radius: 50%; object-fit: cover; flex-shrink: 0; }
.uz-monogram { display: inline-grid; place-items: center; background: #343a41; color: #fff; font-weight: 700; font-size: .9rem; }
.uz-partner-adat { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: .1rem; }
.uz-partner-fej { display: flex; justify-content: space-between; align-items: baseline; gap: .5rem; }
.uz-partner-fej b { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-weight: 600; }
.uz-partner-ido { font-size: .75rem; color: var(--halvany); white-space: nowrap; }
.uz-partner-szoveg { font-size: .85rem; color: var(--szoveg-2); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.uz-partner.olvasatlan b, .uz-partner.olvasatlan .uz-partner-szoveg { font-weight: 700; color: var(--szoveg); }
.uz-szam {
    display: inline-grid; place-items: center; flex-shrink: 0;
    min-width: 1.35rem; height: 1.35rem; padding: 0 .35rem; border-radius: 999px;
    background: var(--sanc); color: #1f1205; font-size: .75rem; font-weight: 700;
}

.uz-valassz { flex: 1; display: grid; place-items: center; text-align: center; color: var(--halvany); padding: 1rem; }
.uz-fej { display: flex; align-items: center; gap: .5rem; padding: .65rem 1rem; border-bottom: 1px solid var(--vonal); }
.uz-fej-tag { display: flex; align-items: center; gap: .65rem; color: inherit; text-decoration: none; font-size: 1.1rem; min-width: 0; }
.uz-fej-tag b { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.uz-fej .uz-avatar { width: 40px; height: 40px; }
.uz-vissza { display: none; font-size: 2rem; line-height: 1; padding: 0 .5rem .2rem 0; color: inherit; text-decoration: none; }

.uz-uzenetek {
    list-style: none; margin: 0; padding: 1rem;
    flex: 1; overflow-y: auto; min-height: 0;
    display: flex; flex-direction: column; gap: .35rem;
    background: color-mix(in srgb, var(--papir) 55%, var(--lap));
}
.uz-buborek { max-width: min(78%, 560px); padding: .5rem .8rem .3rem; border-radius: 16px; line-height: 1.4; overflow-wrap: anywhere; }
.uz-buborek.masik { align-self: flex-start; background: var(--lap); border: 1px solid var(--vonal); border-bottom-left-radius: 4px; }
.uz-buborek.sajat { align-self: flex-end; background: color-mix(in srgb, var(--sanc) 20%, var(--lap)); border-bottom-right-radius: 4px; }
.uz-szoveg a { color: var(--sanc-sotet); }
.uz-ido { font-size: .7rem; color: var(--halvany); text-align: right; margin-top: .1rem; font-variant-numeric: tabular-nums; }
.uz-nap { align-self: center; margin: .7rem 0 .3rem; font-size: .75rem; color: var(--halvany); }
.uz-nap span { background: var(--lap); border: 1px solid var(--vonal); border-radius: 999px; padding: .15rem .7rem; }
.uz-korabbi { align-self: center; margin-bottom: .4rem; }
.uz-elso { margin: auto; color: var(--halvany); text-align: center; }

.uz-kuld { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: .35rem .6rem; align-items: end; padding: .7rem 1rem .5rem; border-top: 1px solid var(--vonal); }
.uz-kuld textarea { min-height: 2.75rem; max-height: 10rem; resize: none; }
.uz-kuld-hiba { grid-column: 1 / -1; margin: 0; }
.uz-kuld-tipp { grid-column: 1 / -1; margin: 0; font-size: .72rem; color: var(--halvany); }
.uz-nem-elerheto { margin: 0; padding: .9rem 1rem; border-top: 1px solid var(--vonal); color: var(--halvany); }

@media (max-width: 760px) {
    .uz-elrendezes { grid-template-columns: 1fr; height: calc(100dvh - 80px - 2rem); min-height: 380px; }
    .uz-elrendezes:not(.van-partner) { height: auto; }
    .uz-elrendezes.van-partner .uz-lista-doboz { display: none; }
    .uz-elrendezes:not(.van-partner) .uz-beszelgetes { display: none; }
    .uz-vissza { display: block; }
    .uz-buborek { max-width: 88%; }
    .uz-kuld-tipp { display: none; }   /* telefonon az Enter új sort ad, a Küldés gombbal megy el */
}

/* Üzeneteim: "+ Új üzenet" lenyíló űrlap a lista tetején, és a beszélgetés törlése gomb a fejlécben */
.uz-visszajelzes { margin: 0 1rem .6rem; font-size: .88rem; }
.uz-uj { margin: 0 1rem .75rem; }
.uz-uj > summary { list-style: none; display: inline-flex; cursor: pointer; }
.uz-uj > summary::-webkit-details-marker { display: none; }
.uz-uj[open] > summary { background: none; color: var(--szoveg); border-color: var(--vonal); }
.uz-uj-urlap { display: flex; flex-direction: column; gap: .6rem; margin-top: .65rem; padding: .75rem; border: 1px solid var(--vonal); border-radius: var(--kerekites); background: color-mix(in srgb, var(--papir) 55%, var(--lap)); }
.uz-uj-urlap textarea { min-height: 5rem; }
.uz-uj-urlap .gomb { align-self: flex-end; }
.uz-uj-urlap .uzenet-hiba { margin: 0; font-size: .88rem; }
.uz-uj .tagkereso { position: relative; }
.uz-torol { margin: 0 0 0 auto; }

/* Üzeneteim: több beszélgetés kijelölése és törlése (site.js: data-uz-kijeloles; kijelölő módban: .uz-elrendezes.kijelol-mod) */
.uz-kijeloles { flex: 1; min-height: 0; display: flex; flex-direction: column; }
.uz-kijelol-sav { display: flex; align-items: center; justify-content: flex-end; gap: .5rem; min-height: 2.1rem; padding: 0 1rem .4rem; }
.uz-kijelol-be { font-size: .88rem; }
.uz-kijelol-eszkozok { display: none; align-items: center; gap: .5rem; }
.uz-kijelol-eszkozok .link-gomb { font-size: .88rem; margin-right: auto; }
.uz-partnerek > li { position: relative; }
.uz-pipa { display: none; }
.uz-beszelgetes > .uz-kijelolve-info { flex: 1; place-content: center; text-align: center; padding: 1rem; gap: .25rem; }
.uz-kijelolve-info p { margin: 0; }
.uz-kijelolve-info b { font-size: 1.6rem; color: var(--sanc-sotet); }

.kijelol-mod .uz-kijelol-be { display: none; }
.kijelol-mod .uz-kijelol-sav { justify-content: space-between; }
.kijelol-mod .uz-kijelol-eszkozok { display: flex; flex: 1; }
.kijelol-mod .uz-pipa {
    display: block; position: absolute; left: 1rem; top: 50%; transform: translateY(-50%); z-index: 1;
    width: 1.15rem; height: 1.15rem; margin: 0; accent-color: var(--sanc); pointer-events: none;
}
.kijelol-mod .uz-partner { padding-left: 2.8rem; box-shadow: none; }
.kijelol-mod .uz-partner.aktiv { background: none; }
.kijelol-mod .uz-partnerek > li:has(.uz-pipa:checked) .uz-partner { background: color-mix(in srgb, var(--sanc) 13%, var(--lap)); }
.kijelol-mod .uz-beszelgetes > :not(.uz-kijelolve-info) { display: none !important; }
.kijelol-mod .uz-beszelgetes > .uz-kijelolve-info[hidden] { display: grid; }
@media (max-width: 760px) {
    /* telefonon a kijelölés a lista nézetben történik, a beszélgetés helyét nem mutatjuk */
    .kijelol-mod .uz-beszelgetes { display: none !important; }
}

/* Tag oldal, Értékelése szakasz: apróbetűs megjegyzés az alján */
.ertekeles-aprobetu { margin: .9rem 0 0; padding-top: .6rem; border-top: 1px solid var(--vonal); font-size: .75rem; line-height: 1.4; color: var(--halvany); }

/* Hozzászólások, faliújság, belső üzenetek: a link helyén kis átlátszó "Kattints ide" gomb (tooltip: a link; Szoveg.Megjelenit linkGomb) */
a.link-kattints {
    display: inline-flex; align-items: center; gap: .25rem;
    padding: .05rem .55rem; margin: 0 .1rem; border-radius: 999px;
    border: 1px solid var(--vonal); background: transparent;
    color: var(--szoveg-2); font-size: .85em; font-weight: 600; line-height: 1.5; text-decoration: none; white-space: nowrap;
    vertical-align: baseline;
}
a.link-kattints::after { content: "↗"; font-size: .9em; }
a.link-kattints:hover { background: color-mix(in srgb, var(--szoveg) 8%, transparent); border-color: var(--halvany); color: var(--szoveg); }

/* fejléc: új üzenet érkezésekor a szám egyszer megpattan (site.js) */
.fejlec-uzenet-szam.pattan { animation: uzenet-pattan .6s ease-out 2; }
@keyframes uzenet-pattan { 0%, 100% { transform: scale(1); } 40% { transform: scale(1.35); } }
@media (prefers-reduced-motion: reduce) { .fejlec-uzenet-szam.pattan { animation: none; } }

/* Admin: Tagok kezelése (admin főoldal) */
.admin-tagkezeles .admin-szuro { margin-bottom: .9rem; }
.admin-tagtabla tr.kivalasztott td { background: color-mix(in srgb, var(--sanc) 12%, var(--lap)); }
.admin-tagtabla .admin-allapot-mas { background: color-mix(in srgb, var(--betelt) 14%, var(--lap)); }
.admin-tag-panel {
    border: 2px solid var(--sanc); border-left-width: 6px; border-radius: var(--kerekites);
    padding: 1rem 1.15rem; margin: .25rem 0 1.25rem;
    background: color-mix(in srgb, var(--sanc) 14%, var(--lap));
    box-shadow: 0 6px 18px rgba(0, 0, 0, .14), 0 1px 3px rgba(0, 0, 0, .12);
}
.admin-tag-panel-fej > div:first-child > b { font-size: 1.2rem; }
.admin-tag-panel-fej { display: flex; justify-content: space-between; align-items: flex-start; gap: .75rem; flex-wrap: wrap; }
.admin-tag-panel-fej .admin-al { display: block; }
.admin-tag-panel-linkek { display: flex; gap: .4rem; flex-wrap: wrap; }
.admin-tag-muveletek { display: flex; flex-wrap: wrap; gap: .6rem 1.25rem; align-items: center; margin-top: .8rem; padding-top: .7rem; border-top: 1px solid color-mix(in srgb, var(--sanc) 35%, transparent); }
.admin-tag-muveletek form { margin: 0; }
.admin-email-csere { display: flex; gap: .4rem; align-items: center; flex-wrap: wrap; }
.admin-email-csere input[type="email"] { width: 260px; max-width: 100%; }
.admin-lapozo { display: flex; align-items: center; justify-content: center; gap: .75rem; margin-top: .8rem; }

/* Admin, tag panel: IP-címek */
.admin-tag-ipk { margin-top: .9rem; padding-top: .75rem; border-top: 1px solid color-mix(in srgb, var(--sanc) 35%, transparent); }
.admin-tag-ipk h3 { margin: 0 0 .5rem; font-size: 1rem; }
.admin-tag-ipk h3 .admin-al { display: inline; font-weight: 400; margin-left: .4rem; }
.admin-ip-tabla { border-collapse: collapse; font-size: .72rem; line-height: 1.25; background: var(--lap); font-variant-numeric: tabular-nums; }
.admin-ip-tabla th { font-size: .66rem; font-weight: 600; text-transform: uppercase; letter-spacing: .03em; color: var(--halvany); text-align: left; padding: .15rem .55rem; }
.admin-ip-tabla td { padding: .12rem .55rem; border-top: 1px solid var(--vonal); white-space: nowrap; }
.admin-ip-tabla code { font-size: 1em; }
.admin-ip-tabla td a { text-decoration: none; }
.admin-ip-tabla tr.nyitva td { background: color-mix(in srgb, var(--sanc) 14%, var(--lap)); font-weight: 600; }
.admin-ip-tabla tr.ip-tarsak td { white-space: normal; padding: .25rem .55rem .35rem 1.2rem; background: color-mix(in srgb, var(--sanc) 6%, var(--lap)); }
.admin-ip-tabla tr.ip-tarsak a { margin: 0 .1rem 0 .35rem; }
.admin-al-inline { color: var(--halvany); font-size: .82rem; margin-right: .5rem; }
.admin-tag-torles { margin-left: auto !important; }   /* a Tag törlése gomb a műveletsor jobb szélén, külön a többitől */

/* Admin napló (admin főoldal): apróbb betű, sűrűbb sorok */
.admin-tabla.admin-naplo { font-size: .78rem; line-height: 1.3; }
.admin-tabla.admin-naplo th, .admin-tabla.admin-naplo td { padding-top: .2rem; padding-bottom: .2rem; }
.admin-tabla.admin-naplo .admin-al { font-size: .72rem; }

/* Üzenetek: a saját üzenet alatt "Még nem látta" / "Látta: …" */
.uz-latta { font-size: .66rem; color: var(--halvany); }
.uz-latta.latta { color: var(--szoveg-2); }

/* Edzés beállításai: zárt edzés + fix tagok a láthatósági csoportban */
.fix-kerdes { margin: .5rem 0 1rem; padding: .8rem 1rem; border-radius: var(--kerekites); border: 1px solid var(--sanc); border-left-width: 5px; background: color-mix(in srgb, var(--sanc) 10%, var(--lap)); }
.fix-kerdes p { margin: 0 0 .6rem; }
.fix-kerdes form { display: flex; gap: .5rem; flex-wrap: wrap; margin: 0; }
.fixek-csoportba { margin-top: .6rem; font-size: .92rem; }

/* Vezérlőpult: a csoportlista névre szűrője */
.lista-szuro { width: 100%; margin: 0 0 .6rem; padding: .4rem .6rem; font-size: .9rem; }
/* Csoport oldal: a hozzá kötött edzések két linkkel, és a tagoknál a felvétel dátuma */
.csop-edzes { display: flex; flex-wrap: wrap; align-items: baseline; gap: .15rem .5rem; padding: .5rem 0; border-top: 1px solid var(--vonal); }
.csop-edzes:first-child { border-top: 0; }
.csop-edzes-linkek { flex-basis: 100%; margin: 0; font-size: .88rem; }
.csop-tag-felveve { display: block; font-size: .68rem; color: var(--halvany); }

/* névre szűrés (site.js: data-lista-szuro): a kiszűrt sorok a saját display-szabályuk ellenére is tűnjenek el */
.pult-lista > li[hidden], .pult-csoportok > li[hidden], .csop-chipek > li[hidden] { display: none !important; }

/* Edzés beállításai, Állapot: "A kiírt alkalmak elmaradnak" csak aktív edzésnél látszik */
.allapot-mezok:has(input[name="Urlap.Ervenyes"][type="checkbox"]:not(:checked)) .elmarad-pipa { display: none; }

/* Edzéslisták: a belépett tag kapcsolata az alkalommal (Jelentkeztél / Fix tag / Várólistán / Lemondtad / Szervezed / Kedvenc / Hozzászóltál) */
.cimke.sajat-bent { background: color-mix(in srgb, var(--szabad) 16%, var(--lap)); color: var(--szabad); border-color: transparent; }
.cimke.sajat-varo { background: color-mix(in srgb, var(--sanc) 16%, var(--lap)); color: var(--sanc-sotet); border-color: transparent; }
.cimke.sajat-jel { background: color-mix(in srgb, var(--szoveg) 7%, var(--lap)); color: var(--szoveg-2); border-color: transparent; }
.cimke.lemondtad { background: color-mix(in srgb, var(--betelt) 14%, var(--lap)); color: var(--betelt); border-color: transparent; }

/* Profil, Játékos adatok: a "Mi sérült?" pipák csak "Sérült" sportállapotnál látszanak */
.jatekos-adatok .serulesek-mezo { display: none; }
.jatekos-adatok:has(.sportallapot-valaszto option[value="Sérült"]:checked) .serulesek-mezo { display: flex; }
.jatekos-adatok .mezo-cimke { font-weight: 600; }
.serulesek-pipak { display: flex; flex-wrap: wrap; gap: .4rem 1.1rem; margin-top: .3rem; }
/* Tag oldal: a játékos adatok sora a város/klub alatt */
.tag-jatekos { display: flex; flex-wrap: wrap; gap: .25rem .9rem; margin: .35rem 0 0; font-size: .92rem; color: var(--szoveg-2); }
.tag-jatekos .serult { color: var(--betelt); font-weight: 600; }
.tag-jatekos .piheno { color: var(--sanc-sotet); font-weight: 600; }

/* Profil: az "Adataim" szakasz kiemelt kerettel */
.szakasz.kiemelt-szakasz {
    border: 2px solid var(--sanc); border-left-width: 6px;
    box-shadow: 0 6px 18px rgba(0, 0, 0, .10), 0 1px 3px rgba(0, 0, 0, .08);
}
.tag-jatekos .tag-sportallapot { flex-basis: 100%; }   /* a sportállapot mindig új sorban */

/* Tagjaink kártya: játékos adatok a város sor alatt; a sportállapot külön sorban */
.tk-jatekos { flex-wrap: wrap; }
.tk-jatekos .tk-sportallapot { flex-basis: 100%; }
.tk-jatekos .serult { color: var(--betelt); font-weight: 600; }
.tk-jatekos .piheno { color: var(--sanc-sotet); font-weight: 600; }

/* Főoldali tippkártya: a kategória szerinti "Ugrás a beállításokhoz ›" link */
.tipp-link { margin: -.2rem 0 .8rem; font-weight: 600; }
.tipp-link a { color: var(--sanc-sotet); }

/* Főoldal: az előző hónap különdíjasai – három álló kártya */
.kulondij-kartyak { list-style: none; margin: .25rem 0 0; padding: 0; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: .8rem; }
.kulondij-kartya > a, .kulondij-kartya.ures {
    display: flex; flex-direction: column; align-items: center; text-align: center; gap: .2rem; height: 100%;
    padding: 0 0 .85rem; border-radius: var(--kerekites); overflow: hidden;
    background: var(--lap); border: 1px solid var(--vonal); 
    
    color: inherit; text-decoration: none; box-shadow: 0 3px 10px rgba(0, 0, 0, .08);
}
.kulondij-kartya > a:hover { border-color: var(--sanc); }
.kulondij-kep { width: 100%; aspect-ratio: 3 / 4; object-fit: cover; display: block; margin-bottom: .45rem; background: var(--papir); }
.kulondij-monogram { display: grid; place-items: center; font: 400 3rem/1 var(--kijelzo); color: var(--halvany); }
.kulondij-dij { font-size: .7rem; font-weight: 700; text-transform: uppercase; letter-spacing: .04em; color: var(--sanc-sotet); padding: 0 .5rem; }
.kulondij-nev { font-size: 1rem; line-height: 1.2; padding: 0 .5rem; }
.kulondij-szam { font: 400 1.35rem/1.1 var(--kijelzo); letter-spacing: .02em; }
.kulondij-al { font-size: .78rem; color: var(--halvany); }
.kulondij-kartya.ures { justify-content: center; padding: 1rem .75rem; }
.kulondij-ures { font-size: .8rem; color: var(--halvany); }
@media (max-width: 520px) { .kulondij-kartyak { gap: .45rem; } .kulondij-nev { font-size: .85rem; } .kulondij-dij { font-size: .6rem; } }

/* Különdíjasok: a három hasáb alatt, teljes szélességben; balra Aktivitás (2 kártya), jobbra Fejlődés (3 kártya) */
.kulondij-doboz { margin-top: 1.5rem; }
.kulondij-csoportok { display: grid; grid-template-columns: minmax(0, 2fr) minmax(0, 3fr); gap: 1.5rem; }
.kulondij-csoport h3 { margin: 0 0 .55rem; font-size: .85rem; text-transform: uppercase; letter-spacing: .05em; color: var(--szoveg-2); }
.kulondij-csoport.aktivitas .kulondij-kartyak { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.kulondij-kartya.jatekos-top { display: flex; flex-direction: column; border-radius: var(--kerekites); overflow: hidden;
    background: var(--lap); border: 1px solid var(--vonal); 
    
    box-shadow: 0 3px 10px rgba(0, 0, 0, .08); }
.kulondij-kartya.jatekos-top > a { border: 0; border-radius: 0; box-shadow: none; height: auto; padding-bottom: .6rem; }
.kulondij-tobbi { margin: 0; padding: .5rem .8rem .7rem 2rem; border-top: 1px solid var(--vonal); font-size: .85rem; }
.kulondij-tobbi li { display: flex; justify-content: space-between; gap: .5rem; padding: .1rem 0; }
.kulondij-tobbi a { color: inherit; font-weight: 600; text-decoration: none; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.kulondij-tobbi span { color: var(--halvany); white-space: nowrap; }
@media (max-width: 900px) {
    .kulondij-csoportok { grid-template-columns: 1fr; }
}

/* Különdíjak: alacsonyabb kártyák (kisebb kép), a játékos-kártya alatt a 2–3. helyezett két kis kártyán */
.kulondij-kep { aspect-ratio: 4 / 3; max-height: 150px; }
.kulondij-kartya.jatekos-top { background: none; border: 0; box-shadow: none; overflow: visible; gap: .5rem; }
.kulondij-kartya.jatekos-top > a {
    display: flex; flex-direction: column; align-items: center; text-align: center; gap: .2rem;
    padding: 0 0 .85rem; border-radius: var(--kerekites); overflow: hidden;
    background: var(--lap); border: 1px solid var(--vonal); 
    
    box-shadow: 0 3px 10px rgba(0, 0, 0, .08);
}
.kulondij-mini-sor { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .5rem; }
.kulondij-mini {
    position: relative; display: flex; flex-direction: column; align-items: center; text-align: center; gap: .15rem;
    padding: .55rem .4rem .5rem; border-radius: var(--kerekites); background: var(--lap); border: 1px solid var(--vonal);
    color: inherit; text-decoration: none;
    box-shadow: 0 2px 6px rgba(0, 0, 0, .06);
}
.kulondij-mini:hover { border-color: var(--sanc); }
.kulondij-mini img, .kulondij-mini-mono { width: 40px; height: 40px; border-radius: 50%; object-fit: cover; }
.kulondij-mini-mono { display: grid; place-items: center; background: var(--papir); color: var(--halvany); font-weight: 700; font-size: .8rem; }
.kulondij-mini-hely { position: absolute; top: .3rem; left: .45rem; font: 400 1rem/1 var(--kijelzo); color: var(--sanc-sotet); }
.kulondij-mini b { font-size: .8rem; line-height: 1.2; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; }
.kulondij-mini > span:last-child { font-size: .68rem; color: var(--halvany); }

/* Különdíjak: a díj neve a kártya tetején (fejsáv), a kép a fej felé igazítva; a kis kártyákon nagyobb kép, az adatok külön sorban */
.kulondij-kartya .kulondij-dij { align-self: stretch; padding: .4rem .5rem; margin-bottom: 0; background: color-mix(in srgb, var(--sanc) 12%, var(--lap)); }
.kulondij-kep { object-position: center; margin-top: 0; }
.kulondij-mini img, .kulondij-mini-mono { width: 56px; height: 56px; object-position: center; }
.kulondij-mini > .kulondij-mini-adat { font-size: .68rem; color: var(--halvany); line-height: 1.25; }
/* különdíj kártyák: 20%-kal keskenyebbek, a cellájuk közepén */
.kulondij-kartyak > .kulondij-kartya { width: 100%; justify-self: center; }   /* a teljes cellaszélesség (a korábbi 92% + 10%) */

/* Különdíjak: az "Aktivitás" és a "Fejlődés" felirat középen a kártyáik fölött, a két csoport között halvány függőleges vonal */
.kulondij-csoport h3 { text-align: center; }
.kulondij-csoport.fejlodes { border-left: 1px solid var(--vonal); padding-left: 1.5rem; }
@media (max-width: 900px) {
    .kulondij-csoport.fejlodes { border-left: 0; padding-left: 0; border-top: 1px solid var(--vonal); padding-top: 1rem; }
}
/* a 2–3. helyezett kis képe: csak épp lekerekített sarkú négyzet */
.kulondij-mini img, .kulondij-mini-mono { border-radius: 6px; }
/* különdíj kártyák: mégis magasabb, álló kép (a 4:3-as fekvő túl kevés volt az arcokhoz) */
.kulondij-kep { aspect-ratio: 3 / 4; max-height: none; }

/* Kép nagyítása (site.js: data-nagyit) */
.tag-kep-nagyit { display: block; cursor: zoom-in; line-height: 0; }
dialog.kep-nagyito { padding: 0; border: 0; background: transparent; max-width: 92vw; max-height: 92vh; cursor: zoom-out; }
dialog.kep-nagyito::backdrop { background: rgba(0, 0, 0, .82); }
dialog.kep-nagyito img { display: block; max-width: 92vw; max-height: 92vh; width: auto; height: auto; border-radius: 10px; box-shadow: 0 10px 40px rgba(0, 0, 0, .5); }
/* különdíj kártyák fejsávja: a főmenü fejlécének színe, fehér szöveggel */
.kulondij-kartya .kulondij-dij { background: var(--fejlec-hatter); color: #fff; }
/* a kép nélküli (pl. "Hamarosan") kártya: a fejsáv fent, mint a többinél, a szöveg alatta */
.kulondij-kartya.ures { justify-content: flex-start; padding: 0 0 1rem; }
.kulondij-kartya.ures .kulondij-ures { padding: .9rem .9rem 0; }

/* Főoldal: Legújabb tagjaink – teljes szélességű sáv a hasábok alatt, kis kártyákkal (a legújabb elöl) */
.ujtagok-sav { margin-top: 1.5rem; }
.uj-tagok-sav { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fit, minmax(98px, 1fr)); gap: .55rem; }   /* auto-fit: a kártyák kitöltik a sort */
.uj-tagok-sav a {
    display: flex; flex-direction: column; align-items: center; text-align: center; gap: .15rem; height: 100%;
    padding: .65rem .4rem .55rem; border-radius: var(--kerekites); background: var(--lap); border: 1px solid var(--vonal);
    color: inherit; text-decoration: none;
}
.uj-tagok-sav a:hover { border-color: var(--sanc); }
.uj-tagok-sav .avatar { width: 56px; height: 56px; border-radius: 50%; object-fit: cover; margin-bottom: .2rem; }
.uj-tagok-sav .monogram-kicsi { display: grid; place-items: center; }
.uj-tagok-sav .ut-nev { font-weight: 600; font-size: .82rem; line-height: 1.2; overflow: hidden; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; }
.uj-tagok-sav .ut-info { font-size: .7rem; color: var(--halvany); line-height: 1.25; }
/* Legújabb tagjaink: nagyobb kártyák, képek és nevek */
.uj-tagok-sav { grid-template-columns: repeat(auto-fit, minmax(124px, 1fr)); gap: .65rem; }
.uj-tagok-sav a { padding: .8rem .5rem .7rem; }
.uj-tagok-sav .avatar { width: 72px; height: 72px; }
.uj-tagok-sav .ut-nev { font-size: .92rem; }
.uj-tagok-sav .ut-info { font-size: .74rem; }
/* Legújabb tagjaink: mindig csak egy teljes sor látszik (ami nem fér ki, az elrejtve – nincs törés), 68px-es képekkel */
.uj-tagok-sav { grid-template-columns: repeat(auto-fill, minmax(112px, 1fr)); gap: .5rem;
    grid-template-rows: auto; grid-auto-rows: 0; row-gap: 0; overflow: hidden; }
.uj-tagok-sav > li:nth-child(n) { min-width: 0; }
.uj-tagok-sav .avatar { width: 68px; height: 68px; }
@media (max-width: 600px) {
    .uj-tagok-sav { grid-template-rows: auto auto; row-gap: .5rem; }   /* telefonon két sor */
}
/* Legújabb tagjaink: halvány vízszintes vonal a város és a csatlakozás ideje között */
.uj-tagok-sav .ut-mikor { margin-top: .2rem; padding-top: .25rem; border-top: 1px solid var(--vonal); width: 60%; }

/* Legújabb tagjaink: halvány vízszintes vonal a város és a csatlakozás ideje között */
.uj-tagok-sav .ut-mikor { margin-top: .2rem; padding-top: .25rem; border-top: 1px solid var(--vonal); width: 60%; }

/* Tippek oldal (/tippek): kártyák rácsban; kattintásra előugró ablak a főoldali tippkártya stílusában */
.tipp-racs { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); gap: .9rem; }
.tipp-mini {
    display: flex; flex-direction: column; align-items: flex-start; gap: .4rem; width: 100%; height: 100%; text-align: left;
    padding: .9rem 1rem 1rem; font: inherit; color: inherit; cursor: pointer;
    background: var(--lap); border: 1px solid var(--vonal); border-top: 4px solid var(--sanc); border-radius: var(--kerekites);
    box-shadow: 0 3px 10px rgba(0, 0, 0, .06);
}
.tipp-mini:hover { border-color: var(--sanc); box-shadow: 0 6px 16px rgba(0, 0, 0, .1); }
.tipp-mini-fej { display: flex; flex-wrap: wrap; gap: .3rem; }
.tipp-mini-cim { font-size: 1.02rem; line-height: 1.25; color: var(--sanc-sotet); }
.tipp-mini-szoveg { font-size: .88rem; color: var(--szoveg-2); line-height: 1.4; }
.cimke.tipp-valaszom { background: color-mix(in srgb, var(--szabad) 16%, var(--lap)); color: var(--szabad); border-color: transparent; }

dialog.tipp-ablak { padding: 0; border: 0; background: transparent; width: min(640px, 92vw); max-height: 90vh; overflow: auto; }
dialog.tipp-ablak::backdrop { background: rgba(20, 23, 26, .62); backdrop-filter: grayscale(1) blur(1px); }
dialog.tipp-ablak .tipp-kartya { margin: 0; box-shadow: 0 20px 60px rgba(0, 0, 0, .45); }
dialog.tipp-ablak .tipp-szoveg { font-size: 1.05rem; line-height: 1.55; white-space: pre-line; }
.tipp-ablak-lab { margin: .8rem 0 0; text-align: right; }
.tipp-valaszok .gomb.valasztott { outline: 3px solid color-mix(in srgb, var(--sanc) 55%, transparent); outline-offset: 2px; }

/* Tippek oldal: témakörönként szakaszok; teljes 1px-es keret, pici árnyék; a még nem válaszolt tippek erősebben, a válaszoltak halványabb háttéren */
.tipp-temakor { margin: 0 0 1.6rem; }
.tipp-temakor-cim { display: flex; align-items: center; gap: .5rem; margin: 0 0 .7rem; font-size: 1rem; }
.tipp-temakor-cim .cimke { font-size: .95rem; padding: .25rem .8rem; background: var(--fejlec-hatter); color: #fff; border-color: transparent; }
.tipp-mini { border: 1px solid var(--vonal); box-shadow: 0 1px 3px rgba(0, 0, 0, .08); }
.tipp-mini:hover { border-color: var(--sanc); box-shadow: 0 3px 8px rgba(0, 0, 0, .12); }
/* minden tippkártya egyforma (a válaszolt / nem válaszolt nem különbözik) */
.tipp-racs .tipp-mini { background: var(--lap); border-color: color-mix(in srgb, var(--sanc) 45%, var(--vonal)); }
.tipp-racs .tipp-mini-cim { color: var(--sanc-sotet); }
/* Tippek: a válaszod címkéje a válasz szerint – "Már tudtam!" fehér, "Köszönöm, király!" narancs, "Nem érdekel" átlátszó */
.cimke.tipp-valaszom[data-valasz="TUDTAM"] { background: #fff; color: #1f2328; border: 1px solid var(--vonal); }
.cimke.tipp-valaszom[data-valasz="KOSZONOM"] { background: var(--sanc); color: #1f1205; border-color: var(--sanc); }
.cimke.tipp-valaszom[data-valasz="NEM_ERDEKEL"] { background: transparent; color: var(--halvany); border: 1px solid var(--vonal); }
/* Tippek: összecsukható témakör-szakaszok (a fejükre kattintva) */
summary.tipp-temakor-cim { cursor: pointer; list-style: none; }
summary.tipp-temakor-cim::-webkit-details-marker { display: none; }
summary.tipp-temakor-cim::after { content: "▾"; margin-left: .2rem; color: var(--halvany); transition: transform .15s; }
.tipp-temakor:not([open]) > summary.tipp-temakor-cim::after { transform: rotate(-90deg); }
.tipp-temakor:not([open]) { margin-bottom: .7rem; }
/* Tippek: a kereső a szakaszok fölött; a kiszűrt kártyák és szakaszok eltűnnek */
.tipp-kereso { max-width: 420px; margin-bottom: 1.1rem; }
.tipp-racs > li[hidden], .tipp-temakor[hidden] { display: none !important; }
/* tippkártya címe: a "TUDTAD-E?" szó a szövegszínnel (világos témában fekete), a cím többi része marad narancs */
.tipp-kartya h2 .tipp-kerdes { color: var(--szoveg); }

/* Admin: belépések grafikon. Színek (dataviz-validátorral ellenőrizve): világos #e06c00 / #4a5fc1, sötét #c96d16 / #6f84e0 */
.belepes-szakasz { --sor-belepes: #e06c00; --sor-tag: #4a5fc1; }
:root[data-theme="dark"] .belepes-szakasz { --sor-belepes: #c96d16; --sor-tag: #6f84e0; }
@media (prefers-color-scheme: dark) { :root:not([data-theme]) .belepes-szakasz { --sor-belepes: #c96d16; --sor-tag: #6f84e0; } }
.belepes-fej { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: .6rem 1rem; margin-bottom: .6rem; }
.belepes-fej h2 { margin: 0; }
.belepes-valto { display: flex; gap: .35rem; flex-wrap: wrap; }
.belepes-test { display: grid; grid-template-columns: minmax(0, 1fr) 200px; gap: 1.25rem; align-items: start; }
.belepes-grafikon { position: relative; margin: 0; }
.belepes-rajz svg { display: block; width: 100%; height: auto; }
.belepes-jelmagyarazat { display: flex; gap: 1rem; font-size: .82rem; color: var(--szoveg-2); margin-bottom: .3rem; }
.belepes-jelmagyarazat i, .belepes-tooltip i { display: inline-block; width: 14px; height: 3px; border-radius: 2px; margin-right: .35rem; vertical-align: middle; }
i.sor-belepes { background: var(--sor-belepes); }
i.sor-tag { background: var(--sor-tag); }
.bg-racs { stroke: var(--vonal); stroke-width: 1; }
.bg-alap { stroke: var(--halvany); stroke-width: 1; }
.bg-tengely { fill: var(--halvany); font-size: 11px; font-variant-numeric: tabular-nums; }
.bg-vonal { fill: none; stroke-width: 2; stroke-linejoin: round; stroke-linecap: round; }
.bg-vonal.sor-belepes { stroke: var(--sor-belepes); }
.bg-vonal.sor-tag { stroke: var(--sor-tag); }
.bg-kereszt { stroke: var(--halvany); stroke-width: 1; stroke-dasharray: 3 3; }
.bg-pont { stroke: var(--lap); stroke-width: 2; }
.bg-pont.sor-belepes { fill: var(--sor-belepes); }
.bg-pont.sor-tag { fill: var(--sor-tag); }
.belepes-tooltip {
    position: absolute; z-index: 2; pointer-events: none; display: flex; flex-direction: column; gap: .15rem;
    padding: .45rem .65rem; border-radius: 8px; background: var(--lap); border: 1px solid var(--vonal);
    box-shadow: 0 4px 14px rgba(0, 0, 0, .15); font-size: .8rem; white-space: nowrap; color: var(--szoveg);
}
.belepes-tooltip strong { font-variant-numeric: tabular-nums; }
.belepes-osszesen { display: flex; flex-direction: column; gap: .8rem; padding: .9rem 1rem; border-radius: var(--kerekites);
    background: color-mix(in srgb, var(--papir) 60%, var(--lap)); border: 1px solid var(--vonal); }
.belepes-osszesen-cim { font-size: .75rem; font-weight: 700; text-transform: uppercase; letter-spacing: .04em; color: var(--szoveg-2); }
.belepes-osszesen div { display: flex; flex-direction: column; }
.belepes-osszesen b { font: 400 2rem/1 var(--kijelzo); color: var(--szoveg); font-variant-numeric: tabular-nums; }
.belepes-osszesen div span { font-size: .8rem; color: var(--halvany); }
.belepes-tablazat { margin-top: .8rem; font-size: .9rem; }
.belepes-tablazat summary { cursor: pointer; color: var(--szoveg-2); }
.belepes-tabla td + td, .belepes-tabla th + th { text-align: right; font-variant-numeric: tabular-nums; }
@media (max-width: 760px) {
    .belepes-test { grid-template-columns: 1fr; }
    .belepes-osszesen { flex-direction: row; flex-wrap: wrap; }
}

/* Tippek: a témakörök fejléce teljes sávban a fejléc színével, nagyobb darabszámmal; nagyobb kártyák */
summary.tipp-temakor-cim { background: var(--fejlec-hatter); color: #fff; border-radius: var(--kerekites); padding: .55rem 1rem; }
summary.tipp-temakor-cim .cimke { font-size: 1.05rem; padding: 0; background: transparent; }
summary.tipp-temakor-cim .halvany-szam { font-size: 1.7rem; font-weight: 700; color: rgb(255 255 255 / .75); margin-left: .4rem; line-height: 1; }
summary.tipp-temakor-cim::after { color: rgb(255 255 255 / .75); margin-left: auto; font-size: 1.2rem; }
.tipp-racs { grid-template-columns: repeat(auto-fill, minmax(min(320px, 100%), 1fr)); gap: 1.1rem; }
.tipp-mini { padding: 1.15rem 1.25rem 1.3rem; gap: .55rem; min-height: 150px; }
.tipp-mini-cim { font-size: 1.15rem; }
.tipp-mini-szoveg { font-size: .95rem; }

/* a hír / verseny / edzés oldalán az admin "Kiemelés a főoldalon" kapcsolója (Shared/_KiemelesGomb) */
.kiemeles-gomb { display: inline-flex; margin: 0; }

/* ===== Főoldal: KIEMELT szalag a fejléc alatt, a köszöntés fölött (Index.cshtml #kiemelt) =====
   a tételek hézag nélkül egymás mellett, mint egy szalag; a kép a háttér, alul sötétedő átmeneten a szöveg */
.kiemelt-szalag { display: flex; margin: -1.75rem 0 1.75rem; overflow: hidden; border-radius: 0 0 var(--kerekites) var(--kerekites);
    box-shadow: rgba(0, 0, 0, 0.12) 0 10px 30px; background: var(--grafit); }
.kiemelt-elem { position: relative; flex: 1 1 0; min-width: 0; height: 400px; display: flex; align-items: flex-end;
    color: #fff; text-decoration: none; overflow: hidden; }
.kiemelt-szalag.db-1 .kiemelt-elem { height: 400px; }
.kiemelt-elem img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; transition: transform .4s ease; }
.kiemelt-elem::after { content: ""; position: absolute; inset: 0; background: linear-gradient(to top, rgb(0 0 0 / .78) 0%, rgb(0 0 0 / .35) 50%, rgb(0 0 0 / .05) 100%); }
.kiemelt-elem:hover img { transform: scale(1.04); }
.kiemelt-elem:hover .ke-cim { text-decoration: underline; text-decoration-thickness: 2px; text-underline-offset: 3px; }
/* a tételek között csak egy vékony világos vonal, hogy a képek ne folyjanak össze */
.kiemelt-elem + .kiemelt-elem { border-left: 1px solid rgb(255 255 255 / .25); }
.ke-szoveg { position: relative; z-index: 1; display: flex; flex-direction: column; gap: .3rem; padding: 1.1rem 1.25rem 1.2rem; max-width: 760px;
    text-shadow: 0 1px 3px rgb(0 0 0 / .5); }
.ke-fej { display: flex; flex-wrap: wrap; align-items: center; gap: .5rem; font-size: .8rem; }
.ke-tipus { padding: .15rem .55rem; border-radius: 4px; background: var(--sanc); color: #1f1205; font-weight: 700; letter-spacing: .08em;
    text-transform: uppercase; text-shadow: none; }
.ke-mikor { font-weight: 600; text-transform: uppercase; letter-spacing: .04em; }
.ke-cim { font-family: var(--kijelzo); font-weight: 400; font-size: 1.5rem; line-height: 1.15; overflow-wrap: anywhere; }
.kiemelt-szalag.db-1 .ke-cim { font-size: 2.1rem; }
.ke-kivonat { font-size: .92rem; line-height: 1.4; opacity: .92; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.kiemelt-szalag.db-3 .ke-kivonat { -webkit-line-clamp: 1; }
.ke-lab { font-size: .85rem; opacity: .9; display: flex; flex-wrap: wrap; gap: .25rem .75rem; }
.ke-hely { font-weight: 700; }
@media (max-width: 759px) {
    .kiemelt-szalag { flex-direction: column; margin: -1.75rem -16px 1.25rem; border-radius: 0; }   /* telefonon a képernyő széléig */
    /* oszlopban a "flex: 1 1 0" (0 alapméret) a magasságot is nullára venné → a tételek eltűnnének: itt a saját magasságuk számít */
    .kiemelt-elem, .kiemelt-szalag.db-1 .kiemelt-elem { height: 288px; flex: 0 0 auto; }
    .kiemelt-elem + .kiemelt-elem { border-left: 0; border-top: 1px solid rgb(255 255 255 / .25); }
    .ke-cim, .kiemelt-szalag.db-1 .ke-cim { font-size: 1.3rem; }
}

/* a ki nem tett (piszkozat) hír jelzése – csak a fejlesztői gépen (localhost) látszik a főoldalon */
.cimke.piszkozat-jel { background: #fff3cd; color: #7a5300; border-color: #e6c766; }
.ke-fej .cimke.piszkozat-jel { text-shadow: none; }

/* KIEMELT szalag: fajta-címke nélkül, sokkal nagyobb dátum és cím */
.ke-szoveg { gap: .4rem; padding: 1.4rem 1.6rem 1.5rem; }
.ke-mikor { font-size: 1.15rem; letter-spacing: .05em; }
.ke-cim { font-size: 2.4rem; line-height: 1.05; }
.kiemelt-szalag.db-1 .ke-mikor { font-size: 1.4rem; }
.kiemelt-szalag.db-1 .ke-cim { font-size: 3.4rem; }
.kiemelt-szalag.db-3 .ke-cim { font-size: 2rem; }
@media (max-width: 759px) {
    .ke-szoveg { padding: 1rem 1.1rem 1.1rem; }
    .ke-mikor, .kiemelt-szalag.db-1 .ke-mikor { font-size: 1rem; }
    .ke-cim, .kiemelt-szalag.db-1 .ke-cim, .kiemelt-szalag.db-3 .ke-cim { font-size: 1.9rem; }
}

/* KIEMELT szalag: a cím alatti szöveg (hír bevezetője / esemény leírásának első bekezdése) */
.ke-kivonat { font-size: 1.05rem; line-height: 1.4; max-width: 62ch; -webkit-line-clamp: 3; }
.kiemelt-szalag.db-1 .ke-kivonat { font-size: 1.15rem; -webkit-line-clamp: 4; }
.kiemelt-szalag.db-3 .ke-kivonat { -webkit-line-clamp: 2; }
@media (max-width: 759px) { .ke-kivonat, .kiemelt-szalag.db-1 .ke-kivonat { font-size: .95rem; -webkit-line-clamp: 2; } }

/* Főoldal, Hírek doboz: nincs cím, az első hír képe margó nélkül a doboz tetejéhez és széleihez simul
   (a .fo-doboz belső margóját negatív margóval oltjuk ki: asztalon 1.1rem / 1.15rem, 600px alatt .9rem / .85rem) */
.fo-hirek .hir-mini-lista li.elso img { aspect-ratio: 16 / 10.71; object-fit: cover; height: auto;   /* kb. 19%-kal magasabb a 16:9-nél */
    width: calc(100% + 2.3rem); max-width: none; margin: -1.1rem -1.15rem .35rem; border-radius: var(--kerekites) var(--kerekites) 0 0; }
.fo-hirek-lab { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: .5rem; font-weight: 600; }
@media (max-width: 600px) {
    .fo-hirek .hir-mini-lista li.elso img { width: calc(100% + 1.7rem); margin: -.9rem -.85rem .35rem; }
}

/* Főoldal, Hírek doboz: a kis híreknél a kép balra, a cím és a bevezető körbefutja */
.fo-hirek .hir-mini-lista li:not(.elso) > a { display: block; }
.fo-hirek .hir-mini-lista li:not(.elso) > a::after { content: ""; display: table; clear: both; }
.fo-hirek .hir-mini-lista li:not(.elso) img { float: left; width: 110px; margin: .2rem .8rem .25rem 0; }
.fo-hirek .hir-mini-lista li:not(.elso) .hm-szoveg { display: block; }
.fo-hirek .hir-mini-lista li:not(.elso) .hm-szoveg > * { display: block; }
.fo-hirek .hir-mini-lista li:not(.elso) .hm-szoveg > .hir-szamok { display: flex; margin-top: .2rem; }
.fo-hirek .hir-mini-lista li:not(.elso) .hm-kivonat { font-size: .88rem; line-height: 1.4; color: var(--szoveg-2); margin-top: .15rem; }

/* KIEMELT szalag: a számok sora alul (látták / hozzászólás, edzésnél résztvevők és szabad helyek) */
.ke-szamok { display: flex; flex-wrap: wrap; align-items: center; gap: .3rem 1.1rem; margin-top: .2rem; font-size: .95rem; font-weight: 600; opacity: .95; }
.ke-szamok > span { display: inline-flex; align-items: center; gap: .35rem; }
.ke-szamok svg { flex-shrink: 0; filter: drop-shadow(0 1px 2px rgb(0 0 0 / .5)); }

/* Hír: külön sorban álló link → kiemelt doboz a fejléc színével, nagy SANC színű gombbal (Szabalyzat.LinkDoboz) */
.link-doboz { display: flex; flex-direction: column; align-items: center; gap: .7rem; text-align: center;
    margin: 1.4rem 0; padding: 1.6rem 1.25rem 1.3rem; border-radius: var(--kerekites); background: var(--fejlec-hatter); color: #fff; }
.link-doboz-cim { margin: 0; font-family: var(--kijelzo); font-size: 1.5rem; line-height: 1.2; color: #fff; }
.hir-cikk-szoveg .link-doboz-gomb { color: #1f1205; text-decoration: none; }
.link-doboz-gomb { font-size: 1.2rem; font-weight: 700; padding: .8rem 2.2rem; border-radius: 999px; background: var(--sanc); border-color: var(--sanc);
    color: #1f1205; box-shadow: 0 6px 18px rgb(0 0 0 / .3); }
.link-doboz-gomb:hover { filter: brightness(1.08); transform: translateY(-1px); }
.link-doboz-hely { font-size: .85rem; color: rgb(255 255 255 / .7); }

/* Hír: Facebook-os link → ugyanaz a doboz, de átlátszó háttérrel; a gomb Facebook-kék, logóval és "Megnyitom" szöveggel */
.link-doboz.fb { background: transparent; color: var(--szoveg); }
.link-doboz.fb .link-doboz-cim { color: var(--szoveg); }
.link-doboz.fb .link-doboz-hely { color: var(--halvany); }
.hir-cikk-szoveg .link-doboz.fb .link-doboz-gomb, .link-doboz.fb .link-doboz-gomb {
    display: inline-flex; align-items: center; gap: .55rem; background: #1877f2; border-color: #1877f2; color: #fff;
    box-shadow: 0 6px 18px rgb(24 119 242 / .35); }
.link-doboz.fb .link-doboz-gomb:hover { background: #166fe5; border-color: #166fe5; color: #fff; }

/* Edzéseim / főoldali Edzéseid: a "Betelt" piros címke (_EdzesNapok, SajatKartyak) */
.cimke.betelt-cimke { background: var(--betelt); border-color: var(--betelt); color: #fff; text-transform: uppercase;
    letter-spacing: .05em; font-weight: 700; font-size: .72rem; padding: .12rem .45rem; border-radius: 2px; }
/* "IDE MÉSZ": ha bent vagy; a háttér az edzés erős színe, ugyanaz, mint a kép alatti nagy "X fő" számé (.kep-letszam) */
.cimke.ide-mesz { background: var(--h-eros, var(--sanc)); border-color: var(--h-eros, var(--sanc)); color: var(--h-eros-szoveg, #1f1205);
    text-transform: uppercase; letter-spacing: .05em; font-weight: 700; font-size: .72rem; padding: .12rem .45rem; border-radius: 2px; }
/* ha bent vagy (IDE MÉSZ / Fix tag), a Betelt címke szürke */
.cimke.betelt-cimke.szurke { background: color-mix(in srgb, var(--szoveg) 45%, var(--lap)); border-color: transparent; color: #fff; }
/* Elmarad: nagybetűs címke az edzés erős színével */
.cimke.elmarad-cimke { background: var(--h-eros, var(--sanc)); border-color: var(--h-eros, var(--sanc)); color: var(--h-eros-szoveg, #1f1205);
    text-transform: uppercase; letter-spacing: .05em; font-weight: 700; font-size: .72rem; padding: .12rem .45rem; border-radius: 2px; }

/* Edzéseim / főoldali Edzéseid: másfélszer szélesebb kép (16:9) – asztalon 128 → 192px, keskeny helyen 96 → 144px */
.edzes.sajat-kartya { grid-template-columns: 4.6rem 192px minmax(0, 1fr) auto; }
.edzes.sajat-kartya .edzes-kep { width: 192px; height: 108px; }
@container (max-width: 620px) {
    .edzes.sajat-kartya { grid-template-columns: 144px minmax(0, 1fr); }
    .edzes.sajat-kartya .edzes-kep { width: 144px; height: 81px; }
}
@media (max-width: 600px) {
    .edzes.sajat-kartya { grid-template-columns: 144px minmax(0, 1fr); }
    .edzes.sajat-kartya .edzes-kep { width: 144px; height: 81px; }
}

/* Főoldal, Edzéseid: a kártya fölött az idővonalon annak a napnak a pöttye megnő (site.js) */
.iv-potty { transition: transform .2s ease, box-shadow .2s ease; }
/* csak ha arra az edzésre mész (bent vagy / fix tag): megnő, és finoman pulzál */
.iv-nap.kiemel .iv-potty { transform: scale(1.6); animation: iv-pulzal 1.1s ease-in-out .2s infinite; }
@keyframes iv-pulzal {
    0%, 100% { transform: scale(1.6); box-shadow: 0 0 0 4px color-mix(in srgb, var(--hk-eros, var(--sanc)) 30%, transparent); }
    50% { transform: scale(1.8); box-shadow: 0 0 0 9px color-mix(in srgb, var(--hk-eros, var(--sanc)) 0%, transparent); }
}
@media (prefers-reduced-motion: reduce) { .iv-potty { transition: none; } .iv-nap.kiemel .iv-potty { animation: none; } }

/* Edzéseim kártyák: a "Lemondtad" címke ugyanolyan, mint az üzenetek címkéje (sima, semleges .cimke) */
.edzes.sajat-kartya .cimke.lemondtad { background: var(--papir); color: var(--szoveg-2); border-color: var(--vonal); }

/* Tag oldal, "Akikkel a legtöbbet játszott": a "Mutass többet" link a lista fölött, jobbra */
.tarsak-tobb { margin: 0 0 .6rem; text-align: right; font-weight: 600; font-size: .95rem; }

/* Admin / Tippek: a reagálók aránya (%) */
.tipp-arany { font-weight: 700; font-variant-numeric: tabular-nums; white-space: nowrap; }

/* Admin, Tagok kezelése: SANC támogató (igen / nem + összeg) */
.admin-tamogato { display: flex; flex-wrap: wrap; align-items: center; gap: .4rem .8rem; padding: .45rem .7rem; border: 1px solid var(--vonal); border-radius: 8px; }
.admin-tamogato-cim { font-weight: 700; }
.admin-tamogato .pipa { margin: 0; }
.admin-tamogato input[type="number"] { width: 7.5rem; }

/* Tudtad-e? oldal: a kártyán a tipp teljes szövege (nem csak az eleje), a sortörésekkel együtt */
.tipp-mini-szoveg { white-space: pre-line; }


/* --- admin: levélsablonok (/admin/sablonok) --- */
.sablon-sugo { margin: 0; padding-left: 1.2rem; display: flex; flex-direction: column; gap: .35rem; }
.sablon-sugo code, .sablon-mezok code, .sablon-kep-kod { font-size: .85rem; background: var(--papir); padding: .05rem .3rem; border-radius: 4px; }
.sablon-lista { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(320px, 1fr)); gap: 1rem; }
.sablon-kartya { display: flex; flex-direction: column; gap: .4rem; background: var(--lap); border: 1px solid var(--vonal); border-radius: var(--kerekites); padding: 1rem 1.1rem; }
.sablon-kartya p { margin: 0; }
.sablon-kartya-fej { display: flex; justify-content: space-between; align-items: baseline; gap: .5rem; }
.sablon-kartya-fej h3 { margin: 0; font-size: 1.1rem; }
.sablon-targy { font-weight: 600; }
.sablon-mezok { font-size: .85rem; overflow-wrap: anywhere; }
.sablon-kartya-lab { margin-top: auto; padding-top: .4rem; display: flex; flex-wrap: wrap; align-items: center; gap: .5rem .75rem; font-size: .88rem; }
.sablon-kepek { list-style: none; margin: 0 0 1rem; padding: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 1rem; }
.sablon-kepek li { display: flex; gap: .75rem; align-items: flex-start; background: var(--lap); border: 1px solid var(--vonal); border-radius: var(--kerekites); padding: .75rem; }
.sablon-kepek img { width: 120px; height: 90px; object-fit: cover; border-radius: 6px; flex-shrink: 0; background: var(--papir); }
.sablon-kepek form { margin: .3rem 0 0; }
.sablon-kep-kod { display: inline-block; margin-top: .3rem; }
.sablon-racs { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 1.25rem; align-items: start; }
.sablon-szerkeszto { display: flex; flex-direction: column; gap: .75rem; }
.sablon-szerkeszto .mezo > span { font-weight: 600; }
.sablon-kod { font-family: Consolas, "Cascadia Mono", Menlo, monospace; font-size: .85rem; line-height: 1.45; min-height: 32rem; white-space: pre; tab-size: 2; }
.sablon-elonezet { position: sticky; top: calc(var(--fejlec-m, 63px) + 1rem); border: 1px solid var(--vonal); border-radius: var(--kerekites); overflow: hidden; background: #f3f1ee; }
.sablon-elonezet-fej { display: flex; flex-wrap: wrap; gap: .25rem .6rem; align-items: baseline; padding: .6rem .9rem; background: var(--lap); border-bottom: 1px solid var(--vonal); font-size: .92rem; }
.sablon-elonezet-targy { flex-basis: 100%; font-weight: 600; }
.sablon-elonezet-targy:not(:empty)::before { content: "Tárgy: "; font-weight: 400; color: var(--halvany); }
.sablon-elonezet iframe { display: block; width: 100%; height: calc(100vh - var(--fejlec-m, 63px) - 7rem); min-height: 520px; border: 0; background: #f3f1ee; }
.sablon-kep-valaszto { list-style: none; margin: .5rem 0; padding: 0; display: flex; flex-direction: column; gap: .5rem; }
.sablon-kep-valaszto li { display: flex; align-items: center; gap: .6rem; }
.sablon-kep-valaszto img { width: 72px; height: 54px; object-fit: cover; border-radius: 4px; }
.sablon-verziok { list-style: none; margin: .5rem 0; padding: 0; display: flex; flex-direction: column; gap: .3rem; font-size: .9rem; }
.sablon-verziok li { display: flex; flex-wrap: wrap; gap: .25rem .6rem; }
.sablon-figyelem { color: var(--betelt); margin: 0 0 .5rem; }
@media (max-width: 1000px) {
    .sablon-racs { grid-template-columns: minmax(0, 1fr); }
    .sablon-elonezet { position: static; }
}

/* Kutatás aloldalainak közös menüje (Pages/Admin/_KutatasMenu.cshtml) */
.kutatas-menu { display: flex; flex-wrap: wrap; align-items: center; gap: .25rem 1.1rem; margin: 0 0 1rem; padding: 0 0 .45rem; border-bottom: 1px solid var(--vonal); font-weight: 600; }
.kutatas-menu a { text-decoration: none; color: var(--szoveg-2); padding: .15rem 0; border-bottom: 2px solid transparent; }
.kutatas-menu a:hover { color: var(--szoveg); border-bottom-color: var(--vonal); }
.kutatas-menu a.aktiv { color: var(--szoveg); border-bottom-color: var(--sanc); }
.kutatas-menu .kutatas-menu-admin { color: var(--sanc-sotet); margin-right: .4rem; }
.oldal > .kutatas-menu + .vissza { margin-top: -.4rem; font-weight: 400; font-size: .9rem; }

/* Versenysorozat címkéje (db/039): naptár, főoldal, adatlap. A színe a borítókép erős színe
   (style="--hv-eros…; --hs-eros…" a KepSzinService.SorozatCssAsync-ból); kép nélkül a SANC narancs. */
.cimke.vn-sorozat {
    --sz-eros: var(--hv-eros, var(--sanc)); --sz-szoveg: var(--hv-eros-szoveg, #1f1205);
    display: inline-flex; align-items: center; gap: .35em; align-self: flex-start; width: fit-content; max-width: 100%;
    background: var(--sz-eros); color: var(--sz-szoveg); border-color: transparent;
    font-size: .92rem; font-weight: 700; padding: .3rem .8rem; line-height: 1.25;
    box-shadow: 0 1px 3px rgba(0, 0, 0, .18);
}
.cimke.vn-sorozat::before { content: "🏆"; }
:root[data-theme="dark"] .cimke.vn-sorozat { --sz-eros: var(--hs-eros, var(--sanc)); --sz-szoveg: var(--hs-eros-szoveg, #1f1205); }
@media (prefers-color-scheme: dark) { :root:not([data-theme]) .cimke.vn-sorozat { --sz-eros: var(--hs-eros, var(--sanc)); --sz-szoveg: var(--hs-eros-szoveg, #1f1205); } }
.vn-test > .cimke.vn-sorozat, .verseny-adat > .cimke.vn-sorozat { margin-bottom: .15rem; }
.verseny-fej-sor a.cimke.vn-sorozat { background: var(--sz-eros); color: var(--sz-szoveg); text-decoration: none; font-size: 1rem; }
.verseny-fej-sor a.cimke.vn-sorozat:hover { filter: brightness(1.08); }

/* Admin: egysoros, sűrű táblázat (pl. Tagok felmérése → Levelek és válaszok) */
.admin-felmeres.egysoros td, .admin-felmeres.egysoros th { padding: .2rem .5rem; white-space: nowrap; vertical-align: middle; }
.admin-felmeres.egysoros td { line-height: 1.3; }
.admin-felmeres.egysoros .admin-al { display: inline; margin: 0 0 0 .4rem; }
.admin-felmeres.egysoros td .cimke { margin: 0 0 0 .3rem; padding-top: 0; padding-bottom: 0; }

/* Belépő oldal: a bemutatkozó rész a belépés alatt (a keresőknek is: a fő kulcsszavak látható szövegként) */
.belepes-info { max-width: 1100px; margin: 0 auto; padding: 3rem 1.5rem 3.5rem; }
.belepes-info > h2 { font-family: var(--kijelzo); font-weight: 400; font-size: clamp(1.9rem, 4vw, 2.6rem); line-height: 1.05; margin: 0 0 .8rem; text-align: center; }
.belepes-info-bevezeto { max-width: 720px; margin: 0 auto 2rem; text-align: center; color: var(--szoveg-2); font-size: 1.08rem; line-height: 1.55; }
.belepes-info-racs { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(300px, 100%), 1fr)); gap: 1.1rem; }
.belepes-info-racs article { background: var(--lap); border: 1px solid var(--vonal); border-radius: var(--kerekites); padding: 1.1rem 1.2rem 1.2rem; }
.belepes-info-racs h3 { margin: 0 0 .4rem; font-size: 1.15rem; }
.belepes-info-racs p { margin: 0; color: var(--szoveg-2); line-height: 1.5; }
.belepes-info-lab { text-align: center; margin: 2rem 0 0; }