/* =========================================================
 * A&A Forgacs Muhelye - CookieYes cookie banner arculati CSS
 *
 * KIZAROLAG MEGJELENES. A consent-kezelest, a sutik blokkolasat,
 * a gombok funkciojat es a banner szovegeit nem erinti.
 *
 * MIERT KELL SOK HELYEN !important?
 * A CookieYes a felhobol (cdn-cookieyes.com/client_data/.../script.js)
 * rendereli a bannert, es a szineket NEM stylesheetben, hanem
 * ELEMENTRE IRT inline style attributumban adja meg, peldaul:
 *   <button class="cky-btn cky-btn-accept"
 *           style="color:#FFFFFF; border-color:#1863dc; background-color:#1863dc;">
 * Inline stilust semmilyen stylesheet-specificity nem ver, csak az
 * !important. Ezert az !important CSAK azokon a tulajdonsagokon
 * szerepel, amelyeket a CookieYes inline ir ki:
 * background-color, color, border-color.
 * Minden mas (tipografia, padding, outline, transition) !important nelkul,
 * pusztan magasabb specificity-vel all be.
 *
 * NYELVFUGGETLEN: kizarolag .cky-* osztalyokra hivatkozik, nincs benne
 * URL, nyelvkod vagy oldal-ID, ezert a magyar es az angol valtozaton
 * egyformán ervenyes.
 * ========================================================= */

/* ---------------------------------------------------------
 * Tokenek - a weboldal Elementor global valtozoira epulnek.
 * Fallback ertek csak arra az esetre, ha a Kit CSS nem toltodne be.
 * --------------------------------------------------------- */
.cky-consent-container,
.cky-modal,
.cky-btn-revisit-wrapper {
	--aa-cky-surface: #FFFFFF;                                  /* body hatter - a fejlec is ezen ul */
	--aa-cky-ink: var(--e-global-color-146552c, #0F0B09);       /* Kit: "Sotet" */
	--aa-cky-ink-soft: rgba(15, 11, 9, 0.78);                   /* ugyanaz halkitva, a leiro szoveghez */
	--aa-cky-gold: var(--e-global-color-accent, #B88A4A);       /* Kit: "Hangsuly" - a CTA szine */
	--aa-cky-gold-tint: rgba(184, 138, 74, 0.14);               /* az aa-oldalak.css outline-hover tintje */
	--aa-cky-deep: var(--e-global-color-secondary, #2A211C);    /* Kit: "Masodlagos" - primary hover */
	--aa-cky-on-deep: var(--e-global-color-text, #F3EEE7);      /* Kit: "Szoveg" - sotet alapon */
	--aa-cky-hair: rgba(15, 11, 9, 0.12);                       /* hajszalvonal vilagos alapon */
	--aa-cky-heading: var(--e-global-typography-primary-font-family, "Cormorant Garamond"), serif;
	--aa-cky-body: var(--e-global-typography-text-font-family, "Montserrat"), sans-serif;
	--aa-cky-ease: 0.2s ease;
}

/* ---------------------------------------------------------
 * 1. Banner felulete
 * --------------------------------------------------------- */
/* A CookieYes sajat szabalya ugyanezzel a specificity-vel es kesobb
   erkezik (a felhos script futasidoben szurja be a <style> blokkot),
   ezert itt a banner poziciojelzo osztalyaval emeljuk a specificity-t. */
.cky-consent-container.cky-banner-bottom .cky-consent-bar,
.cky-consent-container.cky-banner-top .cky-consent-bar,
.cky-consent-container.cky-box-bottom-left .cky-consent-bar,
.cky-consent-container.cky-box-bottom-right .cky-consent-bar,
.cky-consent-container.cky-box-top-left .cky-consent-bar,
.cky-consent-container.cky-box-top-right .cky-consent-bar {
	background-color: var(--aa-cky-surface) !important;
	border-style: solid;
	border-width: 1px 0 0;
	border-color: var(--aa-cky-hair) !important;
	border-radius: 0;
	box-shadow: 0 -2px 18px rgba(15, 11, 9, 0.10);
	font-family: var(--aa-cky-body);
	color: var(--aa-cky-ink-soft);
}

/* ---------------------------------------------------------
 * 2. Cimsor - a weboldal cimbetutipusa (Cormorant Garamond)
 * --------------------------------------------------------- */
.cky-consent-container .cky-notice .cky-title {
	color: var(--aa-cky-ink) !important;
	font-family: var(--aa-cky-heading);
	font-size: 22px;
	font-weight: 600;
	line-height: 1.3;
	letter-spacing: 0;
	margin: 0 0 10px;
}

/* ---------------------------------------------------------
 * 3. Leiro szoveg - a weboldal body tipografiaja
 * --------------------------------------------------------- */
.cky-consent-container .cky-notice-des,
.cky-consent-container .cky-notice-des p {
	color: var(--aa-cky-ink-soft) !important;
	font-family: var(--aa-cky-body);
	font-size: 14px;
	font-weight: 400;
	line-height: 1.7;
	letter-spacing: 0;
}

.cky-consent-container .cky-notice-des a,
.cky-consent-container .cky-notice-des a.cky-policy {
	color: var(--aa-cky-ink) !important;
	text-decoration: underline;
	text-underline-offset: 2px;
	transition: color var(--aa-cky-ease);
}

.cky-consent-container .cky-notice-des a:hover,
.cky-consent-container .cky-notice-des a.cky-policy:hover {
	color: var(--aa-cky-gold) !important;
}

/* ---------------------------------------------------------
 * 4. Gombok - kozos alap (a weboldal CTA tipografiaja)
 * A Kit mar ad Montserrat / uppercase / letter-spacing erteket
 * minden <button>-re; itt a meretet es a suly't igazitjuk
 * a weboldal .elementor-button CTA-ihoz.
 * --------------------------------------------------------- */
.cky-consent-container .cky-notice-btn-wrapper .cky-btn,
.cky-modal .cky-prefrence-btn-wrapper .cky-btn {
	font-family: var(--aa-cky-body);
	font-size: 14px;
	font-weight: 500;
	letter-spacing: 2.8px;
	text-transform: uppercase;
	line-height: 1.2;
	border-radius: 0;
	border-width: 1px;
	border-style: solid;
	padding: 12px 24px;
	transition: background-color var(--aa-cky-ease), color var(--aa-cky-ease), border-color var(--aa-cky-ease);
}

/* A CookieYes altalanos hover-e egy brightness szuro; a weboldal
   szines hovert hasznal, ezert a szurot semlegesitjuk. */
.cky-consent-container .cky-notice-btn-wrapper .cky-btn:hover,
.cky-modal .cky-prefrence-btn-wrapper .cky-btn:hover {
	filter: none;
}

/* 4/a. ELSODLEGES CTA - "Az osszes elfogadasa"
   Megegyezik a weboldal arany CTA gombjaival (#B88A4A alapon sotet felirat). */
.cky-consent-container .cky-notice-btn-wrapper .cky-btn-accept,
.cky-modal .cky-prefrence-btn-wrapper .cky-btn-accept {
	background-color: var(--aa-cky-gold) !important;
	border-color: var(--aa-cky-gold) !important;
	color: var(--aa-cky-ink) !important;
}

.cky-consent-container .cky-notice-btn-wrapper .cky-btn-accept:hover,
.cky-modal .cky-prefrence-btn-wrapper .cky-btn-accept:hover {
	background-color: var(--aa-cky-deep) !important;
	border-color: var(--aa-cky-deep) !important;
	color: var(--aa-cky-on-deep) !important;
}

/* 4/b. MASODLAGOS GOMBOK - "Elutasit" es "Testreszabas"
   A weboldal outline gombja: attetszo toltes, arany keret.
   Vilagos alapon a felirat a sotet token, hogy a kontraszt magas maradjon
   (az "Elutasit" ne legyen halkabb vagy nehezebben eszreveheto). */
.cky-consent-container .cky-notice-btn-wrapper .cky-btn-reject,
.cky-consent-container .cky-notice-btn-wrapper .cky-btn-customize,
.cky-modal .cky-prefrence-btn-wrapper .cky-btn-reject,
.cky-modal .cky-prefrence-btn-wrapper .cky-btn-preferences {
	background-color: transparent !important;
	border-color: var(--aa-cky-gold) !important;
	color: var(--aa-cky-ink) !important;
}

.cky-consent-container .cky-notice-btn-wrapper .cky-btn-reject:hover,
.cky-consent-container .cky-notice-btn-wrapper .cky-btn-customize:hover,
.cky-modal .cky-prefrence-btn-wrapper .cky-btn-reject:hover,
.cky-modal .cky-prefrence-btn-wrapper .cky-btn-preferences:hover {
	background-color: var(--aa-cky-gold-tint) !important;
	border-color: var(--aa-cky-gold) !important;
	color: var(--aa-cky-ink) !important;
}

/* ---------------------------------------------------------
 * 5. Billentyuzet-fokusz
 * A weboldal sajat konvencioja (aa-referencia.css):
 * outline: 2px solid <arany>; outline-offset: 2px;
 * A jelolest NEM tavolitjuk el, csak a szinet hozzuk arculatba.
 * --------------------------------------------------------- */
.cky-consent-container .cky-btn:focus-visible,
.cky-consent-container .cky-notice-des a:focus-visible,
.cky-modal .cky-btn:focus-visible,
.cky-modal .cky-btn-close:focus-visible,
.cky-modal .cky-accordion-btn:focus-visible,
.cky-modal .cky-show-desc-btn:focus-visible,
.cky-modal .cky-switch input[type="checkbox"]:focus-visible,
.cky-btn-revisit-wrapper .cky-btn-revisit:focus-visible {
	outline: 2px solid var(--aa-cky-gold);
	outline-offset: 2px;
}

/* ---------------------------------------------------------
 * 6. Beallitasok ablak (Testreszabas)
 * Ugyanaz a rendszer, hogy megnyitaskor ne valtson stilust.
 * --------------------------------------------------------- */
.cky-modal .cky-preference-center {
	background-color: var(--aa-cky-surface) !important;
	border-color: var(--aa-cky-hair) !important;
	color: var(--aa-cky-ink-soft) !important;
	font-family: var(--aa-cky-body);
	border-radius: 0;
}

.cky-modal {
	border-radius: 0;
}

.cky-modal .cky-preference-header .cky-preference-title {
	color: var(--aa-cky-ink) !important;
	font-family: var(--aa-cky-heading);
	font-size: 22px;
	font-weight: 600;
	letter-spacing: 0;
}

.cky-modal .cky-preference-header .cky-btn-close {
	color: var(--aa-cky-ink);
}

.cky-modal .cky-preference-content-wrapper,
.cky-modal .cky-preference-content-wrapper p,
.cky-modal .cky-accordion-header-des,
.cky-modal .cky-accordion-header-des p {
	color: var(--aa-cky-ink-soft) !important;
	font-family: var(--aa-cky-body);
	font-size: 14px;
	line-height: 1.7;
	letter-spacing: 0;
}

/* Az akkordion kategoria-feliratai. A Kit minden <button>-re 2.8px
   betukozt ad; cimkekent ez tul szellos, ezert itt visszafogjuk. */
.cky-modal .cky-accordion-header .cky-accordion-btn {
	color: var(--aa-cky-ink) !important;
	font-family: var(--aa-cky-body);
	font-size: 15px;
	font-weight: 600;
	letter-spacing: 0.4px;
	text-transform: none;
}

.cky-modal .cky-accordion-header .cky-always-active {
	color: var(--aa-cky-gold) !important;
	font-family: var(--aa-cky-body);
	font-size: 13px;
	font-weight: 500;
	letter-spacing: 0.4px;
}

.cky-modal .cky-preference-content-wrapper .cky-show-desc-btn {
	color: var(--aa-cky-gold) !important;
	font-family: var(--aa-cky-body);
	font-size: 14px;
	letter-spacing: 0;
	text-transform: none;
	transition: color var(--aa-cky-ease);
}

.cky-modal .cky-preference-content-wrapper .cky-show-desc-btn:hover {
	color: var(--aa-cky-ink) !important;
}

.cky-modal .cky-horizontal-separator,
.cky-modal .cky-accordion:last-child {
	border-color: var(--aa-cky-hair);
}

/* Kapcsolok: a bekapcsolt allapot a weboldal aranya.
   A CookieYes a hatteret inline irja ki, ezert kell az !important;
   a :checked magasabb specificity-vel all a kikapcsolt allapot fole. */
.cky-modal .cky-switch input[type="checkbox"] {
	background-color: rgba(15, 11, 9, 0.22) !important;
}

.cky-modal .cky-switch input[type="checkbox"]:checked {
	background-color: var(--aa-cky-gold) !important;
}

.cky-modal .cky-footer-wrapper a,
.cky-modal [data-cky-tag="detail-powered-by"] a {
	color: var(--aa-cky-ink-soft) !important;
}

/* ---------------------------------------------------------
 * 7. Visszateres-jelolo (a valasztas utan megjeleno kis gomb)
 * --------------------------------------------------------- */
.cky-btn-revisit-wrapper {
	background-color: var(--aa-cky-gold) !important;
	border-radius: 0;
}

.cky-btn-revisit-wrapper .cky-btn-revisit img {
	filter: none;
}

/* ---------------------------------------------------------
 * 8. Mobil
 * A CookieYes sajat media query-i 576px alatt mar fuggolegesbe
 * rendezik a gombokat (elfogadas elol). Itt csak a hosszu magyar
 * feliratok tordeleset tesszuk rendbe: kisebb betukoz es meret,
 * plusz egyenletes fuggoleges tavolsag.
 * --------------------------------------------------------- */
/* 769-1100px kozott a CookieYes meg az egysoros (szoveg | gombok)
   elrendezest hasznalja, de a harom gomb ezen a savon mar nem fer ki:
   a flex sor a leiro szoveget ~90px szelesre nyomja ossze, es a banner
   tobb szaz pixel magassa nyulik. (Ez a sajat CSS nelkul is igy volt.)
   Itt ugyanarra a fuggoleges elrendezesre valtunk, amit a CookieYes
   768px alatt maga is hasznal. */
@media (min-width: 769px) and (max-width: 1100px) {
	.cky-consent-container .cky-notice-group {
		display: block;
	}

	.cky-consent-container .cky-notice-btn-wrapper {
		margin-left: 0;
		margin-top: 16px;
		justify-content: flex-start;
		flex-wrap: wrap;
		gap: 10px;
	}

	.cky-consent-container .cky-notice-btn-wrapper .cky-btn {
		flex: 0 1 auto;
		margin-right: 0;
	}
}

@media (max-width: 768px) {
	.cky-consent-container .cky-notice-btn-wrapper {
		gap: 10px;
	}

	.cky-consent-container .cky-notice .cky-title {
		font-size: 20px;
	}

	.cky-consent-container .cky-notice-btn-wrapper .cky-btn,
	.cky-modal .cky-prefrence-btn-wrapper .cky-btn {
		font-size: 13px;
		letter-spacing: 1.6px;
		padding: 12px 16px;
	}
}

@media (max-width: 576px) {
	.cky-consent-container .cky-notice-btn-wrapper .cky-btn {
		width: 100%;
		margin-top: 10px;
		/* legalabb 44px magas erintofelulet */
		padding: 14px;
		white-space: normal;
	}

	.cky-consent-container .cky-notice-btn-wrapper .cky-btn-accept {
		margin-top: 16px;
	}

	.cky-modal .cky-preference-header .cky-preference-title {
		font-size: 20px;
	}
}

@media (max-width: 360px) {
	.cky-consent-container .cky-notice-btn-wrapper .cky-btn {
		font-size: 12px;
		letter-spacing: 1.2px;
	}
}
