/* ============================================================
   Sotet mod - a html.dark-mode class kapcsolja be (fejlec-menuk
   .theme-toggle gombja -> site.js; tarolas: site_theme cookie,
   a header.html <head>-beli inline szkriptje render elott teszi
   fel a classt, igy nincs vilagos villanas; a lap-cache miatt
   szerveroldalon nem donthetunk temarol).

   Ez a reteg a vilagos alap-CSS-t irja felul - MINDEN uj vagy
   modositott komponensnel ide is kell sotet par, kulonben a
   sotet nezetben vilagos marad! A doboz-atallas vegen a reteg
   atfesulendo/takaritando.

   Paletta a gs_homepage_web_draft2_4_darkmode.jpg tervbol:
   lap-hatter #3a3a3a, fejlec/menu #333333, feluletek #444-#4a4a4a,
   hajszalvonalak #4d4d4d, cimek feherben, GS-kek es #c4c4c4
   cimke-szurke valtozatlanul. Szandekosan VILAGOS szigetek:
   urlap-inputok, hirdetes-feluletek (creative-ek), adblocker- es
   billing-modalok.
   ============================================================ */

/* --- token-flip: a szoveg-alapszin feher; ahol a vilagos tema a
   szoveg-tokent HATTERKENT hasznalja (site-footer, article-hero,
   felnott-modal), ott lejjebb sotet fix ertek vedi ki a flipet --- */
/* A GS-kek (#0387cd) a #3a3a3a lapon csak 2,9:1, ezert sotetben vilagositott
   arnyalatra valt (3,8:1 - a korabbi kekkel azonos olvashatosag). */
html.dark-mode {
  --site-color-text: #ffffff;
  --site-color-primary: #359fd7;
  --site-color-primary-hover: #4fabdc;
  --site-color-primary-active: #2999d4;
}
/* Rovat-szkopok (BRAND_HUBS) sotet parjai: a PCW pirosa es a Puli lilaja a
   #3a3a3a lapon 2,9 ill. 1,9:1 lenne, ezert vilagositott arnyalatot kapnak
   (3,8:1, mint a GS-kek) - a hover sotetben FELFELE ter el. A vilagos
   logoszinek (CW, Zoldpalya, Masvilag, Elet) sotetben magukban is olvashatok
   (4,5-7:1), ezert itt a szoveg-token is a logoszin; a gomb/chip a
   bootstrap-theme.css brand-fill tokenjeit hasznalja, sotet felirattal. */
html.dark-mode body.pcw {
  --site-color-primary: #ff5c70;
  --site-color-primary-hover: #ff7686;
  --site-color-primary-active: #ff4d63;
}
html.dark-mode body.cw {
  --site-color-primary: #ffc100;
  --site-color-primary-hover: #ffc71a;
  --site-color-primary-active: #f0b500;
}
html.dark-mode body.zoldpalya {
  --site-color-primary: #00bf63;
  --site-color-primary-hover: #1fc776;
  --site-color-primary-active: #00b05b;
}
html.dark-mode body.puli {
  --site-color-primary: #9b8bd9;
  --site-color-primary-hover: #ac9edf;
  --site-color-primary-active: #917fd5;
}
html.dark-mode body.masvilag {
  --site-color-primary: #00cce2;
  --site-color-primary-hover: #00e3fb;
  --site-color-primary-active: #00bed3;
}
html.dark-mode body.elet {
  --site-color-primary: #c69c6d;
  --site-color-primary-hover: #cda87f;
  --site-color-primary-active: #c29562;
}
html.dark-mode body {
    background-color: #3a3a3a !important;
}
/* a tartalmi terulet sajat feher hattere es sotet alapszine;
   az olvasoszoveg nem vakito feher, hanem halvany szurke (user-keres) -
   a cimek/ikonok maradnak feheren a token reven */
html.dark-mode .main {
  background: #3a3a3a;
  color: #d0d0d0;
}
/* leadek: a vilagos temaban explicit a szoveg-tokenre allnak, ezert a
   halvany olvaso-szurket kulon ki kell mondani rajuk */
html.dark-mode .section .main-slider.main-slider-big .element .text .lead,
html.dark-mode .section .main-slider.main-slider-big .element .text .lead a,
html.dark-mode .section .main-slider.main-slider-small .element .text .lead,
html.dark-mode .section .box-pr.fokusz-jobbhasab .element .lead,
html.dark-mode .section .box-pr .element .lead,
html.dark-mode .section .box-news .element .text .lead {
  color: #d0d0d0;
}
/* a vilagos tema globalis a { color:#343434 } szabalyanak parja;
   ez a szabaly a bootstrap-tema a:hover-jenel erosebb, ezert a
   hover-szint is itt adjuk vissza */
html.dark-mode a {
  color: #ffffff;
}
html.dark-mode a:hover {
  color: var(--site-color-primary);
}
/* az <a>-alapu gombok feliratat a fenti globalis a-szabalyok
   elvinnek (feher, hoveren kek) - a gombok a sajat Bootstrap
   valtozoikbol szinezodnek vissza (a vilagos hatteru btn-secondary
   feher felirattal olvashatatlan volt) */
html.dark-mode a.btn {
  color: var(--bs-btn-color);
}
html.dark-mode a.btn:hover {
  color: var(--bs-btn-hover-color);
}
html.dark-mode a.btn:active {
  color: var(--bs-btn-active-color);
}

/* --- fejlec, menuk, kereso --- */
html.dark-mode .site-header {
  background: #333333;
}
/* fejlec-ikonok: currentColor-os inline SVG-k */
html.dark-mode .header-icon-btn {
  color: #ffffff;
}
html.dark-mode .header-icon-btn:hover,
html.dark-mode .header-icon-btn.icon-active {
  color: var(--site-color-primary);
}
html.dark-mode .header-menu a {
  color: #ffffff;
}
html.dark-mode .header-menu a:hover {
  color: var(--site-color-primary);
}
/* sotetben a feher+kek logovarians (logo-darkmode) latszik a fejlecben
   es a mobil menuben is - az !important a hero-fejlec :not-lancos,
   nagy specificitasu logo-valto szabalyait is felulirja (dark+hero
   kombinacioban is a kekes varians a szandekolt) */
html.dark-mode .site-header .logo .logo-dark,
html.dark-mode .site-header .logo .logo-light,
html.dark-mode .mobile-menu .offcanvas-header .logo-dark {
  display: none !important;
}
html.dark-mode .site-header .logo .logo-darkmode,
html.dark-mode .mobile-menu .offcanvas-header .logo-darkmode {
  display: block !important;
}
/* kiemelt cikk: az atlatszo hero-fejlec sotetben is atlatszo marad
   (a feher ikon/logo-szineket a vilagos tema has-hero szabalyai adjak) */
@media (min-width: 992px) {
  html.dark-mode body.has-hero:not(.mega-menu-open):not(.search-open) .site-header:not(.shrink) {
    background: transparent;
  }
}
html.dark-mode .mega-menu {
  background: #333333;
  border-top-color: #4d4d4d;
}
html.dark-mode .search-wrapper {
  background: #333333;
}
html.dark-mode .search-wrapper .search {
  background: #444444;
  border-color: #555555;
  color: #ffffff;
}
html.dark-mode .mobile-menu {
  background: #333333;
  color: #ffffff;
}
html.dark-mode .mobile-menu .offcanvas-header,
html.dark-mode .mobile-menu .mobile-menu-list li {
  border-color: #4d4d4d;
}
/* a Bootstrap sotet close-X-e feherre forditva (a logot mar sajat
   sotet modos varians adja, nem filter) */
html.dark-mode .mobile-menu .btn-close {
  filter: brightness(0) invert(1);
}
/* --- sotet feluletek, amik a vilagos temaban a szoveg-tokenre epulnek:
   a token-flip nelkuluk feherre valtana oket --- */
html.dark-mode .site-footer {
  background: #2f2f2f;
}
html.dark-mode .article-hero {
  background: #343434;
}
html.dark-mode .adult_alert_modal_content {
  background: #343434;
}
html.dark-mode .adult_alert_modal {
  background-color: #3a3a3a;
}

/* --- elvalaszto hajszalvonalak: #ededed -> sotet --- */
html.dark-mode .section .box-news .element,
html.dark-mode .section .box-news-list .element,
html.dark-mode .section .box-pr .element {
  border-color: #4d4d4d;
}

/* --- doboz-feluletek --- */
html.dark-mode .col-lg-8 .box-news-list-cards .element,
html.dark-mode .col-12 .box-news-list-cards .element {
  background: #444444;
}
/* a kiemelt video kartyaja sotetszurke (terv: Videok blokk);
   a videok-lista sotet panelje valtozatlanul jo sotetben is */
html.dark-mode .section .box-pr.videok-kiemelt .element {
  background: linear-gradient(145deg, #4a4a4a, #3f3f3f);
}
/* kiemelt kartya (Nagykepes, overlay-kartya nelkul) */
html.dark-mode .section .box-news-list-cards:not(.overlay-kartya) .element {
  background: #4a4a4a;
  border-color: #555555;
}
html.dark-mode .section .box-news-list-cards:not(.overlay-kartya) .element .text .lead {
  color: #d0d0d0;
}
/* rovat-chip: a feher chip sotetben elut a kartya/lap hatteretol, ezert
   bal paddingot is kap - vilagos temaban feher a feheren, ott a kep bal
   elen kezdodo kiiras a szandekolt. A vilagos logoszinu rovatok
   chipjei a sajat paddingjukat a style.css-bol kapjak. */
html.dark-mode .section .box .element > .image + .meta a,
html.dark-mode .section .box-slider-unit .main-slider .element > .image + .text .meta a {
  padding-left: 8px;
}

/* --- cikkoldal --- */
/* stilusos idezetek (blockquote1-5): a kek alap/Basic es a keretes
   Kiemelt sotetben is jo; a Vilagos (vilagoskek) es a Normal (GS-kek)
   kartya fix szovegszinu SZANDEKOS szines sziget - nem kap sotet part;
   a Sotet kartya a sotet lapnal is sotetebb tonust kap, hogy elvaljon
   (kilogo kek savja valtozatlanul jo) */
/* a Kiemelt idezojel-ikonjai alatt a kitakaro szinfolt a sotet lap
   hatterszinet veszi fel (a kek ikon sotetben is jo) */
html.dark-mode blockquote.blockquote2::before,
html.dark-mode blockquote.blockquote2::after {
  background-color: #3a3a3a;
}
html.dark-mode blockquote.blockquote5 p {
  background: #2d2d2d;
}
html.dark-mode .single-article .tags,
html.dark-mode .single-article .tags a {
  color: #c4c4c4;
}
html.dark-mode .single-article .related-articles .single-related-article .inner-card,
html.dark-mode .single-review .related-articles .single-related-article .inner-card {
  background: #444444;
}
html.dark-mode .ad-header-after-article {
  background-color: #444444;
}
html.dark-mode .img-thumbnail {
  background-color: #444444;
  border-color: #555555;
}
/* mobilon a hero-szoveg vilagos savja is sotetul */
@media (max-width: 767.98px) {
  html.dark-mode .article-hero {
    background: #3a3a3a;
  }
}
/* ad-boost: desktopon a ::before hordozza a hatteret, mobilon maga az <a> */
html.dark-mode .ad-boost a {
  color: #d0d0d0;
}
html.dark-mode .ad-boost a::before {
  background-color: #4a4a4a;
}
@media (max-width: 991.98px) {
  html.dark-mode .ad-boost a {
    background-color: #4a4a4a;
  }
}
/* cikkbe szurt promo-dobozok (.inarticle-highlight, DB-markup): a
   hirlevel-kartyaval egyezo sotet kartya, cim feheren */
html.dark-mode .inarticle-highlight {
  background: #4a4a4a;
  color: #d0d0d0;
}
html.dark-mode .inarticle-highlight > b {
  color: #ffffff;
}
/* hirlevel-doboz: sotet kartya, feher szoveg, a boritek-ikon
   feher kitoltessel (a fill/stroke a data-URI-ban cserelodik) */
html.dark-mode .inarticle-highlight.random-important-newsletter-subscription-block {
  background: #4a4a4a;
  color: #d0d0d0;
}
html.dark-mode .inarticle-highlight.random-important-newsletter-subscription-block > b {
  color: #ffffff;
}
html.dark-mode .inarticle-highlight.random-important-newsletter-subscription-block > b::before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 26 20'%3E%3Crect width='26' height='20' rx='4' fill='%23ffffff'/%3E%3Cpath d='M4 5.5l9 6 9-6' fill='none' stroke='%234a4a4a' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
}
html.dark-mode .inarticle-highlight.random-important-newsletter-subscription-block form label {
  color: #b5b5b5;
}

/* hirdetes-cimke (a ::before tartalma es alapszine az ad-szkript
   injektalt CSS-ebol jon futasidoben) - sotetben olvashato halvany
   szurke; az !important az injektalt szabalyt is felulirja */
html.dark-mode .ads_show_ad_title::before {
  color: #d0d0d0 !important;
}

/* ertekelodoboz: a feher kartya sotet felulet, a cimek feherek
   (a cimsav es a bal jelveny-panel eleve sotet, jo mindket temaban) */
html.dark-mode .review-pointbox .pointbox-card {
  background: #444444;
  border-color: #4d4d4d;
}
html.dark-mode .review-pointbox .positive .title,
html.dark-mode .review-pointbox .negative .title {
  color: #ffffff;
}
/* a hardver-valtozat PCW-pirosa a sotet lapon is vilagositott arnyalatra
   valt, mint a body.pcw rovat-szkop */
html.dark-mode .review-pointbox-hw {
  --site-color-primary: #ff5c70;
  --site-color-primary-hover: #ff7686;
  --site-color-link-hover: #ff5c70;
}
html.dark-mode .review-pointbox .pointbox-graph .bar {
  background: rgba(255, 255, 255, 0.12);
}

/* 404-oldal: a kartya sotet felulet lesz; a gif fekete invadere igy eltunne,
   ezert invertalva jon (az atlatszo hatteret a filter nem erinti) */
html.dark-mode .error-card {
  background: #444444;
  border-color: #4d4d4d;
}
html.dark-mode .error-visual img {
  filter: invert(1);
}

/* jatekinfo-doboz (kiemelt cikk jobb hasab): a szurke kartya vilagos
   sziget marad, de a token-flip a szoveget/linkeket feherre vinne -
   fix sotet ertek vedi (a cimsav fixen feher a palakeken, az jo) */
html.dark-mode .col-lg-4 .box-related-game .element,
html.dark-mode .col-lg-4 .box-related-game .element .content .list a {
  color: #343434;
}

/* --- tesztoldal (legacy single-review) minimalis sotet par --- */
html.dark-mode .single-review .tags,
html.dark-mode .single-review .tags a {
  color: #c4c4c4;
}
/* jatekinfo-aloldal: a gyujtemeny-tagok elvalaszto vonala */
html.dark-mode .gameinfo-top.gameinfo-child {
  border-top-color: #4d4d4d;
}

/* --- kereso-oldal paneljei --- */
html.dark-mode .search-top #searchform .s_2,
html.dark-mode .search-top #searchform ._button {
  background: #444444;
}

/* --- naptar --- */
html.dark-mode .calendar .event {
  background-color: #444444;
}
html.dark-mode .calendar .event .date {
  background-color: #3f3f3f;
}

/* --- Csapatunk-karusszel --- */
/* nev feher, beosztas olvasoszurke, nyilak feherek; a badge es a
   lapozo-pontok token-alapuak (a rovat-szkopok sotet token-flipje
   viszi oket) - azokra kulon szabaly nem kell */
html.dark-mode .swiper .team-member-name {
  color: #fff;
}
html.dark-mode .swiper .team-member-title {
  color: #d0d0d0;
}
html.dark-mode .swiper-outer .swiper-button-prev,
html.dark-mode .swiper-outer .swiper-button-next {
  color: #fff;
}

/* cikkiroi doboz (cikkoldal + szerzo-lista): azonos sotet felulet, az
   ikongombok a kartyanal vilagosabb korokben ulnek */
html.dark-mode .article-author {
  background: #4a4a4a;
  color: #d0d0d0;
}
html.dark-mode .article-author-avatar img {
  box-shadow: 0 0 0 3px #5f5f5f;
}
html.dark-mode .article-author-title {
  color: #b0b0b0;
}
html.dark-mode .article-author-social a {
  background: #5f5f5f;
  color: #fff;
}
html.dark-mode .article-author-social a:hover {
  background: var(--site-color-primary);
  color: #fff;
}


/* a szerzo-link alapszine sotetben is a token-kek (a fenti erosebb
   szelektor vedi a globalis dark a-szabalytol), hoverre feher - a
   sotetitett hover-arnyalat a sotet lapon alig latszana */
html.dark-mode .article-head .meta .info a.author-link:hover {
  color: #fff;
}

/* statikus jogi oldalak: a linkek a globalis feher a-szabaly helyett
   akcensszinuek, mint vilagos temaban */
html.dark-mode .static-page a {
  color: var(--site-color-primary);
}

/* web-push popup: sotet felulet - a feher dobozon a token-flip miatt
   feher lett volna a szoveg */
html.dark-mode #web-push-popup {
  background-color: #4a4a4a;
  border-color: #555555;
  color: #ffffff;
}