/*
 Theme Name:   Bricks Child Theme
 Theme URI:    https://bricksbuilder.io/
 Description:  Use this child theme to extend Bricks.
 Author:       Bricks
 Author URI:   https://bricksbuilder.io/
 Template:     bricks
 Version:      1.1
 Text Domain:  bricks
*/

a:hover {
	transition: .3s;
}

/* SZÜLŐ kártya – ő vágja le a kilógó részt */
.brxe-zymyws {
    position: relative;
    overflow: hidden;
    min-height: 200px; /* ízlés szerint: 180–260px között szokott jól kinézni */
}

/* Link kártya, amin a háttér van + tartalom közép-közép */
.brxe-oizzgm {
    position: relative;
    display: flex;
    flex-direction: column;   /* cím felül, gomb alatta */
    align-items: center;
    justify-content: center;  /* ez teszi középre a "blokkot" (cím + gomb) */
    text-align: center;
    padding: 40px 20px;
    box-sizing: border-box;

    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;

    transform-origin: center center;
    transform: scale(1);
    transition:
        transform 0.4s ease,
        box-shadow 0.4s ease;
}

/* Sötétítő overlay (alapból átlátszó) */
.brxe-oizzgm::before {
    content: "";
    position: absolute;
    inset: 0;
    background: rgba(0, 0, 0, 0);
    transition: background 0.4s ease;
    pointer-events: none;
}

/* HOVER: kicsi zoom + sötétítés */
.brxe-zymyws:hover .brxe-oizzgm {
    transform: scale(1.05);
}

.brxe-zymyws:hover .brxe-oizzgm::before {
    background: rgba(0, 0, 0, 0.35);
}

/* Cím animáció + fehérre váltás hoverkor */
.brxe-oizzgm .brxe-heading {
    position: relative;
    z-index: 1;
    transition: transform 0.4s ease, color 0.4s ease;
}

.brxe-zymyws:hover .brxe-heading {
    transform: translateY(-2px);
    color: #ffffff;
}

/* Gomb alapból ÖSSZECSUKVA – nem foglal helyet, ezért a cím valóban középen van */
.brxe-oizzgm .brxe-button {
    display: inline-flex;
    align-items: center;
    justify-content: center;

    max-height: 0;          /* nincs magassága */
    overflow: hidden;       /* tartalom rejtve */
    opacity: 0;
    margin-top: 0;
    pointer-events: none;
    transform: translateY(6px);

    transition:
        max-height 0.3s ease,
        opacity 0.3s ease,
        margin-top 0.3s ease,
        transform 0.3s ease;
}

/* Hover: gomb kinyílik, felúszik, látható lesz,
   a cím picit feljebb csúszik – pont úgy, mint most, csak szebben :) */
.brxe-zymyws:hover .brxe-button {
    max-height: 60px;       /* legyen nagyobb, mint a gomb valós magassága */
    margin-top: 14px;
    opacity: 1;
    transform: translateY(0);
    pointer-events: auto;
}






/* 1) A kép kerete – ne engedje ki a képet, fix min-magasság */
.brxe-dqtubo .image-wrapper {
  position: relative;
  overflow: hidden;
  min-height: 400px; /* ha ennél alacsonyabb kell a második blokknál, ezt később külön vehetjük */
}

.brxe-hurqot .image-wrapper {
  position: relative;
  overflow: hidden;
  min-height: 280px; /* ha ennél alacsonyabb kell a második blokknál, ezt később külön vehetjük */
}

/* 2) Kép alapállapotban – kitölti a keretet */
.brxe-dqtubo .image-wrapper img,
.brxe-hurqot .image-wrapper img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;       /* szépen vágja, ha nem pont 16:9 az eredeti */
  transition: transform .4s ease;
  transform-origin: center center;
}

/* 3) Hover: rázoomolunk, de a keret levágja a kilógó részt */
.brxe-dqtubo .image-wrapper:hover img,
.brxe-hurqot .image-wrapper:hover img {
  transform: scale(1.06);
}


#brxe-dqtubo .repeater-item [data-field-id="yazrut"] {
    transition: .4s;
}

@media (max-width: 768px) {
	.brxe-dqtubo .image-wrapper,
	.brxe-hurqot .image-wrapper {
	 	min-height: 256px;
	}
}


@media (max-width: 1181px) {
	.lang-item a {
			display: block!important;
	}
}


:root .bricks-button[class*="primary"],
:root .bricks-button[class*="secondary"],
:root .bricks-button[class*="light"] {
	padding: 12px 32px;
	transition: .4s;
}







/* ===== Bricks form – custom checkbox stílus (bveqsm + zopdia) ===== */

/* UL – közös a két formnál */
#brxe-bveqsm .options-wrapper,
#brxe-zopdia .options-wrapper {
  list-style: none;
  margin: 0;
  padding: 0;
}

/* li – soros, középre igazított tartalom */
#brxe-bveqsm .options-wrapper li,
#brxe-zopdia .options-wrapper li {
  position: relative;
  display: flex;
  align-items: center;
}

/* Natív checkbox: a kocka helyén marad, láthatatlan, de kattintható */
#brxe-bveqsm .options-wrapper input[type="checkbox"],
#brxe-zopdia .options-wrapper input[type="checkbox"] {
  position: absolute;
  left: 0;
  top: 50%;
  transform: translateY(-50%);
  width: 24px;
  height: 24px;
  margin: 0;
  opacity: 0;
  cursor: pointer;
}

/* Label – kap helyet balra a kockának */
#brxe-bveqsm .options-wrapper label,
#brxe-zopdia .options-wrapper label {
  position: relative;
  padding-left: 32px;   /* hely a kockának */
  cursor: pointer;
  font-size: 14px;
  line-height: 1.4;
  margin: 0;
}

/* A “kocka” – alapállapotban világos, finom kerettel */
#brxe-bveqsm .options-wrapper label::before,
#brxe-zopdia .options-wrapper label::before {
  content: "";
  position: absolute;
  left: 0;
  top: 50%;
  transform: translateY(-50%);
  width: 22px;          /* kocka méret */
  height: 22px;
  border-radius: 4px;
  border: 1px solid #dddedf;
  background-color: #f4f4f4;
  box-sizing: border-box;
  transition:
    background-color .2s ease,
    border-color .2s ease;
}

/* A pipa – kicsit nagyobb, középre igazítva */
#brxe-bveqsm .options-wrapper label::after,
#brxe-zopdia .options-wrapper label::after {
  content: "";
  position: absolute;
  left: 6px;
  top: 45%;
  transform: translateY(-50%) rotate(-45deg) scale(0.5);
  width: 10px;
  height: 6px;
  border-left: 2px solid #fff;
  border-bottom: 2px solid #fff;
  opacity: 0;
  transition:
    opacity .2s ease,
    transform .2s ease;
}

/* CHECKED állapot – fekete háttér + fehér pipa */
#brxe-bveqsm .options-wrapper input[type="checkbox"]:checked + label::before,
#brxe-zopdia .options-wrapper input[type="checkbox"]:checked + label::before {
  background: #000;
  border-color: #000;
}

#brxe-bveqsm .options-wrapper input[type="checkbox"]:checked + label::after,
#brxe-zopdia .options-wrapper input[type="checkbox"]:checked + label::after {
  opacity: 1;
  transform: translateY(-50%) rotate(-45deg) scale(1);
}

/* Fókuszjelzés billentyűzetes használathoz */
#brxe-bveqsm .options-wrapper input[type="checkbox"]:focus-visible + label::before,
#brxe-zopdia .options-wrapper input[type="checkbox"]:focus-visible + label::before {
  box-shadow: 0 0 0 2px rgba(0,0,0,.25);
}
