/* belépő oldal — 3 osztatú választó (bejelentkezés / továbblépés / regisztráció) */

.belepo-oldal {
    max-width: 1100px;
    margin: 0 auto;
}

/* A regisztrációs panel (alsó sor) alapból REJTETT.
   A 2. osztat „Regisztrálok" gombja JS-szel láthatóvá teszi. */
#belepo-regisztracio-row {
    display: none;
}

/* Kötelező-mező-jelölés (piros *) — a label szövege normál színű,
   csak a végén levő `*` piros.
   - sima label: `label.required` → `::after` egy piros `*`
   - checkbox-label: a Bootstrap `.custom-control-label::after` foglalt
     (a checkbox vizuális jelölőjéhez), ezért ott a `<span.kotelezo-csillag>`
     explicit-csillagot teszünk a templatebe a szöveg végére.
   A globális `.required { color: red }` (base.css:138) szín-szabályát
   a `color: inherit`-tel felülírjuk a belépő-oldalon, hogy csak a `*` legyen piros. */
.belepo-doboz label.required {
    color: inherit;
}

.belepo-doboz label.required::after {
    content: ' *';
    color: red;
    font-weight: bold;
}

.belepo-doboz .kotelezo-csillag {
    color: red;
    font-weight: bold;
}

/* A 2. osztatban a „Folytatás regisztráció nélkül" link-formátumú gomb
   — kinézetre azonos a bal felső „Elfelejtett jelszó" linkkel
   (text-decoration + szín, button-háttér nélkül). */
.belepo-folytat-link-form {
    margin: 0;
    padding: 0;
}

.belepo-folytat-link {
    background: none;
    border: none;
    padding: 0;
    color: #7C372D;
    text-decoration: underline;
    cursor: pointer;
    font-size: inherit;
}

.belepo-folytat-link:hover {
    color: #FF8400;
}

.belepo-oldal h1 {
    margin-bottom: 1.2rem;
}

.belepo-row {
    display: flex;
    flex-wrap: wrap;
    gap: 0;
    align-items: stretch;
}

.belepo-osztat {
    padding: 0 12px;
    margin-bottom: 16px;
    display: flex;
}

.belepo-doboz {
    flex: 1;
    background: #ffeddb;
    border-radius: 12px;
    padding: 18px 20px 22px;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.08);
    display: flex;
    flex-direction: column;
}

.belepo-doboz h2 {
    color: #7C372D;
    font-size: 18px;
    text-align: center;
    margin-bottom: 10px;
}

.belepo-doboz .belepo-leiras {
    font-size: 13px;
    color: #444;
    text-align: center;
    margin-bottom: 14px;
    flex-grow: 0;
    padding-top: 0;
}

/* az 1. és 2. osztat formja egységes 4-soros CSS-grid:
     1. sáv (1fr)  : .belepo-fej              — rugalmas, felső tartalom (form-mezők)
     2. sáv (auto) : .belepo-folytat-cim       — „Most nem szeretnék regisztrálni" h2
                                                 (1. osztaton visibility:hidden placeholder)
     3. sáv (auto) : .belepo-fogomb            — a fő-gomb sora
     4. sáv (auto) : .belepo-vegelink          — link / placeholder sora */
.belepo-doboz form {
    width: 100%;
    flex-grow: 1;
    display: grid;
    grid-template-rows: 1fr auto auto auto;
}

.belepo-doboz .form-group {
    margin-bottom: 10px;
}

.belepo-doboz label {
    font-size: 12px;
    font-weight: bold;
    margin-bottom: 2px;
    display: block;
}

.belepo-doboz .form-control {
    font-size: 13px;
}

.belepo-doboz-disabled {
    opacity: 0.55;
}

.belepo-doboz-disabled .btn.disabled {
    pointer-events: none;
    cursor: not-allowed;
}

/* a 3-soros grid sávjai — a fej rugalmas, a fogomb és vegelink alulra
   kerül, mindkét osztaton azonos vízszintes vonalon */
.belepo-doboz .belepo-fogomb {
    padding-top: 1rem;
}

.belepo-doboz .belepo-vegelink {
    padding-top: 0.5rem;
}

/* „Miért érdemes regisztrálni" groupbox — fieldset-keret nagyobb betűkkel
   és bővebb padding-gel (#15). */
.belepo-doboz .miert-erdemes-box {
    border: 1px solid rgba(124, 55, 45, 0.35);
    border-radius: 8px;
    padding: 14px 18px 18px;
    margin-bottom: 14px;
    background: rgba(255, 255, 255, 0.5);
}

.belepo-doboz .miert-erdemes-box legend {
    width: auto;
    padding: 0 8px;
    font-size: 16px;
    font-weight: bold;
    color: #7C372D;
    margin-bottom: 8px;
    display: inline-flex;
    align-items: center;
    gap: 6px;
    /* a fieldset-keskenység esetén se törjön két sorba */
    white-space: nowrap;
}

/* világító lámpakörte-ikon: sárga + halvány glow drop-shadow-val,
   finom „pulse" animációval */
.belepo-doboz .miert-erdemes-box .lampakorte-ikon {
    width: 22px;
    height: 22px;
    fill: #f5b800;
    filter: drop-shadow(0 0 3px rgba(245, 184, 0, 0.85));
    animation: lampakorte-pulse 2s ease-in-out infinite;
}

@keyframes lampakorte-pulse {
    0%, 100% { filter: drop-shadow(0 0 2px rgba(245, 184, 0, 0.6)); }
    50%      { filter: drop-shadow(0 0 5px rgba(245, 184, 0, 0.95)); }
}

.belepo-doboz .miert-erdemes-box ul {
    margin: 0;
    padding-left: 22px;
    font-size: 16px;
    color: #444;
}

.belepo-doboz .miert-erdemes-box ul li {
    margin: 4px 0;
    line-height: 1.4;
}

/* a 2. osztat „Most nem szeretnék regisztrálni" felirata — a Bejelentkezés
   h2-vel azonos méret, közvetlenül a Folytatás gomb fölött (margin: 0). */
.belepo-doboz .belepo-folytat-cim {
    font-size: 18px;
    text-align: center;
    color: #7C372D;
    margin: 0;
}