/*
 * Csobánka — nyilvános oldal.
 *
 * A vázat a Wikin sablon adja (webroot/vendor/wikin). Ez az állomány CSAK
 * a ráépülő eltéréseket tartalmazza:
 *
 *  - a sablon zöldjét kékre színeztük, hogy egyezzen az emblémával
 *    (ez a vendorolt style.css-ben történt, nem itt);
 *  - a lapfej háttere nem fotó, hanem szín — nem tartunk stock képet egy
 *    önkormányzati oldalon, és a sablon amúgy is 90%-os sötét fátyolt tesz rá;
 *  - a nyilvántartási táblák stílusa, ami a sablonban nincs benne.
 *
 * A sablon eredeti fájljait NEM írjuk felül, hogy frissíthető maradjon.
 */

:root {
    --csobanka-kek: #1f5da5;
    --csobanka-sotet: #3a3650;
    --csobanka-halvany: #6b6b6b;
    --csobanka-vonal: #e6e9ef;
}

/* A lapfej: a sablon fotós háttere helyett szín. */
.page-title-area {
    background-image: linear-gradient(135deg, #3a3650 0%, #2b3f63 100%);
    padding-top: 70px;
    padding-bottom: 70px;
}
.page-title-area::before {
    display: none;
}
.page-title-area .page-title-content h2 {
    font-size: 38px;
}

/*
 * A nyitóblokk: a sablon fotós hátterét itt sem tartjuk meg — a
 * gradiens ugyanazt a hatást adja stock kép nélkül.
 */
.banner-area {
    /* A sablon 100vh-t ad neki, mert ott képcsúszka van. Nálunk egy
       szövegblokk áll benne, ezért a magasság a tartalomhoz igazodik. */
    height: auto;
    min-height: 0;
    background-image: linear-gradient(120deg, #eaf2fb 0%, #f6f9fd 100%);
    padding-top: 80px;
    padding-bottom: 80px;
}
.banner-area .row { min-height: 0; }
.banner-area::before { display: none; }
.banner-content .top-title { color: var(--csobanka-kek); }
.banner-content h1 { color: var(--csobanka-sotet); }
.banner-content p { color: var(--csobanka-halvany); }

/* A telefonszám ne törjön ketté. */
.others-options .call,
.single-footer-widget .address a { white-space: nowrap; }

/* A fejléc emblémája a szöveges logó mellett. */
.navbar-brand .marka-embléma,
.mobile-responsive-menu .logo .marka-embléma {
    width: 42px;
    height: 42px;
    object-fit: contain;
    vertical-align: middle;
}
.marka-nev {
    display: inline-block;
    margin-left: 10px;
    vertical-align: middle;
    font-family: 'Barlow', sans-serif;
    font-weight: 700;
    font-size: 20px;
    line-height: 1.15;
    color: var(--csobanka-sotet);
}
.marka-nev small {
    display: block;
    font-family: 'Open Sans', sans-serif;
    font-weight: 400;
    font-size: 11px;
    letter-spacing: .08em;
    text-transform: uppercase;
    color: var(--csobanka-halvany);
}
/*
 * A mobil fejléc.
 *
 * A meanmenu a saját SÖTÉT sávjába teszi a logót, ezért ott a márkanév
 * világos kell legyen — a desktop fejléc világos hátterén viszont sötét.
 * Ugyanaz az elem, két háttér.
 */
.mobile-responsive-menu .logo a {
    display: flex;
    align-items: center;
}


@media (max-width: 575px) {
    /* Kis kijelzőn a szöveges rész tördelhető legyen, különben kitolja a
       lapot — a fejléc az egyetlen hely, ahol nincs görgethető keret. */
    .marka-nev {
        font-size: 16px;
        min-width: 0;
        white-space: normal;
    }
    .marka-nev small { font-size: 10px; letter-spacing: .04em; }
}

/*
 * Nyilvántartási táblák.
 *
 * A nyilvános oldal nagyobbik fele lista: határozatok, rendeletek,
 * szerződések. A sablonban nincs erre minta, ezért itt írjuk le — a
 * sablon tipográfiájához igazodva.
 */
.nyilvantartas {
    width: 100%;
    border-collapse: collapse;
    font-size: 15px;
}
.nyilvantartas thead th {
    font-family: 'Barlow', sans-serif;
    font-weight: 600;
    font-size: 13px;
    letter-spacing: .06em;
    text-transform: uppercase;
    color: var(--csobanka-sotet);
    border-bottom: 2px solid var(--csobanka-vonal);
    padding: 12px 14px 12px 0;
    text-align: left;
    white-space: nowrap;
}
.nyilvantartas td {
    padding: 14px 14px 14px 0;
    border-bottom: 1px solid var(--csobanka-vonal);
    vertical-align: top;
}
.nyilvantartas tbody tr:hover { background: #f8fafc; }
.nyilvantartas .szam { white-space: nowrap; font-variant-numeric: tabular-nums; }
.nyilvantartas a { color: var(--csobanka-kek); font-weight: 600; }

/* Vízszintesen görgethető táblázat kis kijelzőn. */
.tabla-keret { overflow-x: auto; }

/*
 * „Honnan van ez a lista?" — a generált listák eredetének kimondása.
 * Ez a nyilvános oldal egyik lényegi eleme: a lakos lássa, hogy az adat a
 * nyilvántartásból jön, nem kézi karbantartásból.
 */
.forras {
    background: #f2f7fc;
    border-left: 4px solid var(--csobanka-kek);
    padding: 16px 20px;
    margin-bottom: 30px;
    font-size: 14.5px;
    color: var(--csobanka-halvany);
    border-radius: 0 4px 4px 0;
}
.forras strong { color: var(--csobanka-sotet); }

.ures {
    padding: 40px 0;
    text-align: center;
    color: var(--csobanka-halvany);
}

/* Adatlapok: cím—érték párok. */
.adatlap { width: 100%; border-collapse: collapse; margin-bottom: 30px; }
.adatlap th {
    width: 34%;
    text-align: left;
    font-family: 'Barlow', sans-serif;
    font-weight: 600;
    color: var(--csobanka-sotet);
    padding: 11px 16px 11px 0;
    border-bottom: 1px solid var(--csobanka-vonal);
    vertical-align: top;
}
.adatlap td {
    padding: 11px 0;
    border-bottom: 1px solid var(--csobanka-vonal);
}

/* Jelvények: hatályos / visszavont / elfogadva. */
.jelzo {
    display: inline-block;
    padding: 3px 10px;
    border-radius: 3px;
    font-size: 12px;
    font-weight: 600;
    letter-spacing: .02em;
}
.jelzo-zold { background: #e6f5ec; color: #1a7a45; }
.jelzo-piros { background: #fdecec; color: #b3261e; }
.jelzo-szurke { background: #eef0f4; color: #5a6072; }

/* Képviselők. */
.kepviselo-lista { list-style: none; padding: 0; margin: 0; }
.kepviselo-lista li {
    border-bottom: 1px solid var(--csobanka-vonal);
    padding: 16px 0;
}
.kepviselo-lista li:last-child { border-bottom: 0; }
.kepviselo-nev {
    font-family: 'Barlow', sans-serif;
    font-weight: 600;
    font-size: 18px;
    color: var(--csobanka-sotet);
}
.kepviselo-tisztseg { color: var(--csobanka-halvany); font-size: 14.5px; }
.kepviselo-elerhetoseg {
    margin-top: 5px;
    display: flex;
    flex-wrap: wrap;
    gap: 4px 20px;
    font-size: 14px;
    color: var(--csobanka-halvany);
}

/* Mellékletek és szavazások az ülés lapján. */
.melleklet-lista, .szavazas-lista { padding-left: 0; list-style: none; }
.melleklet-lista li, .szavazas-lista li {
    border-bottom: 1px solid var(--csobanka-vonal);
    padding: 12px 0;
}
.melleklet-lista li:last-child, .szavazas-lista li:last-child { border-bottom: 0; }
.melleklet-adat, .szavazas-mod {
    display: block;
    color: var(--csobanka-halvany);
    font-size: 13.5px;
}
.szavazas-targy {
    font-family: 'Barlow', sans-serif;
    font-weight: 600;
    color: var(--csobanka-sotet);
}
.szavazas-nevsor {
    list-style: none;
    padding: 6px 0 0;
    margin: 0;
    display: flex;
    flex-wrap: wrap;
    gap: 2px 20px;
    font-size: 14px;
}

/* Közzétételi lista. */
.kozz-szakasz { margin-bottom: 40px; }
.kozz-lista { list-style: none; padding: 0; margin: 0; }
.kozz-tetel {
    border-bottom: 1px solid var(--csobanka-vonal);
    padding: 16px 0;
}
.kozz-tetel:last-child { border-bottom: 0; }
.kozz-tetel .kod {
    display: inline-block;
    min-width: 46px;
    font-family: 'Barlow', sans-serif;
    font-weight: 600;
    color: var(--csobanka-halvany);
}
.kozz-tetel .cim {
    font-family: 'Barlow', sans-serif;
    font-weight: 600;
    font-size: 17px;
    color: var(--csobanka-sotet);
}
.kozz-tetel .leiras { margin: 6px 0 0 46px; font-size: 14.5px; }
.kozz-tetel .meta,
.kozz-tetel .tovabbi {
    margin: 4px 0 0 46px;
    font-size: 13.5px;
    color: var(--csobanka-halvany);
    display: flex;
    flex-wrap: wrap;
    gap: 2px 18px;
}
.allapot {
    display: inline-block;
    padding: 2px 10px;
    border-radius: 3px;
    font-size: 12px;
    font-weight: 600;
}
.allapot-generalt { background: #e6f5ec; color: #1a7a45; }
.allapot-reszben { background: #fdf3e0; color: #8a5a00; }
.allapot-kezi { background: #eef0f4; color: #5a6072; }
.allapot-hianyzik { background: #fdecec; color: #b3261e; }

/* Ügyintézés. */
.ugykor-csoport { margin-bottom: 36px; }
.ugykor-lista { list-style: none; padding: 0; margin: 0; }
.ugykor-lista li {
    border-bottom: 1px solid var(--csobanka-vonal);
    padding: 14px 0;
    display: flex;
    flex-wrap: wrap;
    gap: 4px 16px;
    align-items: baseline;
}
.ugykor-lista li:last-child { border-bottom: 0; }
.ugykor-lista .nev {
    flex: 1 1 280px;
    font-weight: 600;
    color: var(--csobanka-sotet);
}
.ugykor-lista .adat { color: var(--csobanka-halvany); font-size: 14px; }

/* Következő ülések kiemelése a kezdőlapon és az üléslistán. */
.kiemelt-doboz {
    background: #f2f7fc;
    border: 1px solid var(--csobanka-vonal);
    border-top: 3px solid var(--csobanka-kek);
    padding: 24px 26px 10px;
    margin-bottom: 34px;
    border-radius: 0 0 4px 4px;
}
.kozelgo-ules { padding: 12px 0; border-top: 1px solid var(--csobanka-vonal); }
.kozelgo-ules:first-of-type { border-top: 0; }
.kozelgo-ules h3 { font-size: 18px; margin: 0 0 3px; }
.kozelgo-ules p { margin: 0; color: var(--csobanka-halvany); font-size: 14.5px; }

.mottoszoveg { color: var(--csobanka-halvany); }

/* Gyermekétkeztetés. */
.halvany { color: var(--csobanka-halvany); }

.etkezes-kartyak {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
    gap: 20px;
    margin-bottom: 34px;
}
.etkezes-kartya {
    border: 1px solid var(--csobanka-vonal);
    border-top: 3px solid var(--csobanka-kek);
    padding: 20px 22px;
    border-radius: 0 0 4px 4px;
    background: #fff;
}
.etkezes-kartya h3 { font-size: 18px; margin: 0 0 8px; }
.etkezes-kartya p { margin: 0 0 6px; font-size: 14.5px; }
.etkezes-kartya p:last-child { margin-bottom: 0; }

/* Az étlap cellái tördelhetők, de a nap oszlopa nem törik szét. */
.etlap-tabla th[scope="row"] { white-space: nowrap; }
.etlap-tabla td { vertical-align: top; min-width: 160px; }
.allergen {
    margin-top: 4px;
    font-size: 13px;
    color: var(--csobanka-halvany);
}

/* Nézetváltó sáv (rendeletek, étlap) és kiemelő jelölő.
   A sablonok eddig is ezeket az osztályokat használták, de nem volt hozzájuk
   szabály — a nézetváltó formázatlan linksorként jelent meg. */
.evsav {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 8px 20px;
    padding: 12px 0 14px;
    margin-bottom: 22px;
    border-bottom: 1px solid var(--csobanka-vonal);
    font-size: 15px;
}
.evsav a { color: var(--csobanka-kek); font-weight: 600; }
.evsav a.aktiv {
    color: var(--csobanka-sotet);
    border-bottom: 2px solid var(--csobanka-kek);
    padding-bottom: 2px;
}
.jelolo {
    display: inline-block;
    margin-left: 6px;
    padding: 1px 8px;
    border-radius: 10px;
    background: #eef0f4;
    color: #5a6072;
    font-size: 12.5px;
    white-space: nowrap;
}