/* pcwplus.hu brand-specifikus felulirasok.

   A keret a gsplus.hu-rol atvett fajlokbol epul (bootstrap.min +
   reboot-compat + bootstrap-theme + style + dark), a PCW-piros
   szinvilagot a body allando "pcw" classa kapcsolja be
   (bootstrap-theme.css body.pcw token-flip). Ide csak olyan szabaly
   keruljon, ami kifejezetten a pcwplus.hu-n ter el a kozos designtol. */

/* Embedded keret elrejtese (?embedded=1, iframe-beagyazas az account.html-bol,
   pl. /plus/{honap}/magazin?embedded=1). A szabalyok a regi style.css
   7409-7415. sorabol lettek atmentve az uj keret (.site-header/.site-footer/
   #back_top) es a meg elo .gs-plus-header/.gs-plus-content szelektorokra;
   a regi .plus-menu szin-felulirasok elmaradtak, mert csak layout-szabaly
   kell (nincs dark.css-par ehhez a szekciohoz). */

.embedded .site-header,
.embedded .site-footer,
.embedded #back_top {display: none;}
.embedded .main {margin: 0 auto;width: 100%;padding: 0;}
.embedded .gs-plus-header {padding: 0;}
.embedded .gs-plus-content.padding {padding: 0 2rem 0 0;}

@media (max-width: 767.98px) {
  .embedded .gs-plus-header .plus-menu {height: auto;margin-bottom: 1rem;}
  .embedded .gs-plus-header .plus-menu ul li {width: 100%;}
}

/* Regi aloldalak (pl. account.html - /profil) inline <style> blokkjai
   globalis .btn szabalyt hordoznak (font-size 20px, padding .75rem 1.2rem,
   margin 1rem 0, hover #231f20), ami a KERET gombjaira is raszivarog.
   Itt vedjuk ki: a fejlec CTA es a mobil offcanvas login-gomb merete
   mindig a Bootstrap-alap marad; a szinek a marka-tokenekbol jonnek,
   igy dark.css-par nem kell. Az aloldalak sajat tartalmi gombjait nem
   bantjuk - az oldalak ugyis megszunnek/megujulnak. */
.site-header a.btn.header-cta,
.mobile-menu a.btn.mobile-menu-login {
  font-size: var(--bs-btn-font-size, 1rem);
  padding: .375rem .75rem;
  margin: 0;
  /* a szin es a felirat a gomb sajat Bootstrap-variansabol jon
     (btn-primary/-secondary), igy a vedes variansfuggetlen - a regi
     aloldalak inline .btn szabalya (color:#fff) sem szivarog ra */
  background-color: var(--bs-btn-bg);
  color: var(--bs-btn-color);
}
.site-header a.btn.header-cta:hover,
.mobile-menu a.btn.mobile-menu-login:hover {
  background-color: var(--bs-btn-hover-bg);
  color: var(--bs-btn-hover-color);
}
.site-header a.btn.header-cta:active,
.mobile-menu a.btn.mobile-menu-login:active {
  background-color: var(--bs-btn-active-bg);
  color: var(--bs-btn-active-color);
}

/* /profil kijelentkezett fogadooldal (account.html): a PCW-cikkek a GSPlusra
   koltoztek, ez az oldal a PCWMax kapuja - harom kartyas utvalaszto
   (GSPlus / mar elofizeto / meg nem elofizeto -> /csomag).
   Csak token-alapu/attetszo szinek, ezert nincs kulon dark.css-par. */
.pcw-welcome {
  max-width: 1100px;
  margin: 0 auto;
  padding: 2rem 0 3rem;
}
/* Az account.html regi inline <style>-ja globalis h2/.btn/.single-article p
   szabalyokat hordoz - a .pcw-welcome-elotagos, magasabb specificitasu
   szabalyok ezek ellen is vedenek (border/hatter/meret semlegesites). */
.pcw-welcome .pcw-welcome-lead {
  max-width: 640px;
  margin: 0 auto 2rem;
  font-size: var(--site-fs-lead, 18px);
  line-height: 1.5;
}
.pcw-welcome .pcw-welcome-card {
  height: 100%;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: .75rem;
  padding: 1.75rem 1.5rem;
  border: 1px solid rgba(128, 128, 128, .3);
  border-radius: 1.5rem;
}
.pcw-welcome .pcw-welcome-card h2 {
  font-size: var(--site-fs-lead, 18px);
  font-weight: 900;
  text-transform: uppercase;
  margin: 0;
  padding: 0;
  height: auto;
  border: 0;
  background: transparent;
}
.pcw-welcome .pcw-welcome-card p {
  margin: 0;
  flex-grow: 1;
  font-size: 1rem;
}
.pcw-welcome .pcw-welcome-card a.btn {
  font-weight: 700;
  font-size: 1rem;
  padding: .375rem 1.5rem;
  margin: 0;
  background-color: var(--site-color-primary);
}
.pcw-welcome .pcw-welcome-card a.btn:hover {
  background-color: var(--site-color-primary-hover);
}
.pcw-welcome .pcw-welcome-card a.btn:active {
  background-color: var(--site-color-primary-active);
}
/* A GSPlusra vezeto gomb a GS-kek szineit viseli (a gsplus bootstrap-theme
   :root primary-ertekei) - a kek sotet modban is valtozatlan, mint a
   gsplus-on, ezert nincs dark-par. */
.pcw-welcome .pcw-welcome-card a.btn.btn-gsplus {
  background-color: #339fdb;
  border-color: #339fdb;
}
.pcw-welcome .pcw-welcome-card a.btn.btn-gsplus:hover {
  background-color: #2b87ba;
  border-color: #2b87ba;
}
.pcw-welcome .pcw-welcome-card a.btn.btn-gsplus:active {
  background-color: #297faf;
  border-color: #297faf;
}
.pcw-welcome .pcw-welcome-register {
  margin: 2rem 0 0;
  font-size: 14px;
}
.pcw-welcome .pcw-welcome-register a {
  color: var(--site-color-primary);
  font-weight: 700;
}

/* Rovid oldalakon a footer alatt feher sav maradt, a .main 700px-es
   min-height-je pedig folos ures helyet tolt ki. Megoldas: a minimum
   feloldasa + a HTML-GYOKER kapja a footer hatterszinet - a body csak a
   tartalomig fest, alatta a gyoker szine "folytatja" a footert, gorgetesi
   mellekhatas nelkul. A dark-par itt helyben all (a dark.css bajt-azonos
   a gsplus-szal, nem bovitjuk); az ertekek a .site-footer fix szinei
   (vilagos: --site-color-text erteke, sotet: a dark.css footer-vedelme). */
.main {
  min-height: 0;
}
html {
  background-color: #343434;
}
html.dark-mode {
  background-color: #2f2f2f;
}
/* embedded (iframe) nezetben nincs footer - a body toltse ki a teljes
   magassagot, hogy a gyoker sotet szine ne latszodjon a tartalom alatt */
body.embedded {
  min-height: 100vh;
}

/* Belepett /profil oldal (account.html, .site-account szkop) - a PCWMax
   menu es a magazinlista igazitasa az uj designhoz. A szinek marka-tokenek
   (dark modban a body.pcw sotet parja el), fix szin nincs -> nincs dark-par. */

/* PCWMax-menu: pill-forma, a fejlec-CTA tipografiajaval (16px/700/verzal/feher);
   a style.css regi #c12901-es savjat a token-alapu piros valtja */
.site-account .gs-plus-header .plus-menu {
  background: var(--site-color-primary);
  border-radius: 50rem;
  overflow: hidden;
  /* a style.css fix 50px-e + az itteni overflow:hidden egyutt levagna a
     mobil lenyilo listat - a magassag a tartalomhoz igazodik */
  height: auto;
}
/* a mobil "Menü" cimke is a menupontok tipografiajat viseli
   (a style.css 24px-es alapja helyett) */
.site-account .gs-plus-header .plus-menu .mobile-plus-menu-title {
  font-size: 14px;
  font-weight: 700;
  text-transform: uppercase;
  color: #fff;
  /* a 35px-es cimke-magassaghoz igazitott sormagassag (user-hangolas) */
  line-height: 38px;
}
.site-account .gs-plus-header .plus-menu ul li {
  font-size: 14px;
}
.site-account .gs-plus-header .plus-menu ul li a,
.site-account .gs-plus-header .plus-menu ul li button {
  color: #fff;
  /* a fejlec felso savjanak menupont-merete (14px/700/verzal) */
  font-size: 14px;
  font-weight: 700;
  text-transform: uppercase;
  text-decoration: none;
  background: none;
  border: 0;
}
.site-account .gs-plus-header .plus-menu ul li a:hover,
.site-account .gs-plus-header .plus-menu ul li button:hover {
  text-decoration: underline;
}
@media (max-width: 991.98px) {
  /* mobilon a lenyilo lista mar nem pill: enyhebb kerekites, hogy a
     kihajtott menupontok ne csusszanak ki a formabol */
  .site-account .gs-plus-header .plus-menu {
    border-radius: 1.5rem;
  }
}
@media (min-width: 992px) {
  /* desktopon nagyobb eltartas a menu es a tartalom kozott */
  .site-account .gs-plus-header .plus-menu {
    margin-bottom: 2rem;
  }
}

/* A belepett nezet cimsorai (h2 > span) a uibox doboz-fejlecek
   box-title kinezetet kapjak: cimke-szurke verzal felirat kozepre,
   ket oldalt hajszalvonal (a szin a --site-color-label token).
   Az account.html inline h2/h2 span szabalyait (piros sav, szurke sav,
   feher span-hatter) itt semlegesitjuk. */
.site-account .plus-profile h2,
.site-account .plus-content h2,
.site-account .magazine-container h2 {
  display: flex;
  align-items: center;
  gap: 20px;
  margin: 0 0 1.5rem;
  padding: 0;
  height: auto;
  border: 0;
  background: none;
  color: var(--site-color-label);
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0.4em;
  text-transform: uppercase;
  text-align: center;
}
.site-account .plus-profile h2::before,
.site-account .plus-profile h2::after,
.site-account .plus-content h2::before,
.site-account .plus-content h2::after,
.site-account .magazine-container h2::before,
.site-account .magazine-container h2::after {
  content: "";
  flex: 1 1 auto;
  border-top: 1px solid currentColor;
}
.site-account .plus-profile h2 span,
.site-account .plus-content h2 span,
.site-account .magazine-container h2 span {
  display: inline;
  background: none;
  margin: 0;
  padding: 0;
  font-size: inherit;
  position: static;
}

/* A beagyazott (iframe-es, ?embedded=1) plus-aloldalak almenuje: a
   /profil piros PCWMax-menujenek parja szurkeben - azonos tipografia
   (1rem/700/verzal), pill-forma, also eltartas; az aktiv tab marka-piros.
   Az attetszo szurke dark modban is mukodik, a tobbi szin token/inherit,
   ezert nincs kulon dark-par. */
.embedded .gs-plus-header .plus-menu {
  background: rgba(128, 128, 128, .15);
  color: inherit;
  border-radius: 50rem;
  overflow: hidden;
  height: auto;
  margin-bottom: 1.5rem;
}
/* az iframe tipikusan 900-1100px szeles, igy a <992-es toresponton beluli
   "Menu" lenyilo aktivalodna desktopon is - embedded nezetben ezert NINCS
   lenyilo: a lista mindig latszik, kozepre rendezve, keskeny helyen tobb
   sorba torve. A stylesheet-beli !important a slideToggle inline
   display-jet is folulirja. */
.embedded .gs-plus-header .plus-menu .mobile-plus-menu-title {
  display: none;
}
.embedded .gs-plus-header .plus-menu ul {
  display: flex !important;
  flex-wrap: wrap;
  justify-content: center;
  align-items: center;
  gap: 0;
  width: auto;
  padding: .25rem .75rem;
  background: transparent;
  position: static;
  text-align: center;
}
.embedded .gs-plus-header .plus-menu ul li {
  display: inline-block;
  float: none;
  height: auto;
  line-height: 1.2;
  margin: .25rem 0;
  padding: 0;
  font-size: 14px;
}
.embedded .gs-plus-header .plus-menu ul li a {
  display: inline-block;
  /* szukebb padding + nincs verzal: igy desktop-iframe-ben egy sorba
     fer a teljes almenu (user-hangolas DevTools-bol, 2026-08-01) */
  padding: .625rem .85rem;
  color: inherit;
  font-size: 14px;
  font-weight: 700;
  text-decoration: none;
}
.embedded .gs-plus-header .plus-menu ul li a:hover {
  color: var(--site-color-primary);
}
.embedded .gs-plus-header .plus-menu ul li.active {
  background: var(--site-color-primary);
  border-radius: 50rem;
}
.embedded .gs-plus-header .plus-menu ul li.active a,
.embedded .gs-plus-header .plus-menu ul li.active a:hover {
  color: #fff;
}
@media (max-width: 767.98px) {
  /* keskeny (mobil) iframe-ben a tobbsoros lista stadion-formaja csunya -
     enyhebb kerekites */
  .embedded .gs-plus-header .plus-menu {
    border-radius: 1.5rem;
  }
}

/* Magazinracs: valodi Bootstrap-oszlopok, sorkoz + kerekitett boritok */
.site-account .magazines {
  row-gap: 1.5rem;
}
.site-account .magazines [class*="col-"] p {
  margin: 0 0 .5rem;
}
/* --- KISERLETI: nyomtatott-magazin hatas a boritokon (2026-08-02, v2) ---
   enyhen dontott borito (gerinc balra) + VALODI 3D lapel a jobb elen:
   a boritora merolegesen allitott, vekonyan csikozott feher felulet adja
   a lapok vastagsagat (preserve-3d). Arnyek alapbol NINCS, csak hoverre -
   hoverre a magazin kiegyenesedik es megemelkedik. Visszavonashoz ez a
   blokk torolheto (elozo allapot: git pcw-profil-1). */
.site-account .magazines [class*="col-"] {
  /* a 3D szinteret az oszlop adja, igy a lapel-felulet is benne el */
  perspective: 900px;
}
.site-account .magazines [class*="col-"] a {
  display: block;
  position: relative;
  transform: rotateY(-9deg);
  transform-origin: left center;
  transform-style: preserve-3d;
  border-radius: 2px 4px 4px 2px;
  transition: transform .35s ease, box-shadow .35s ease;
}
/* lapel (fore-edge): fuggoleges hajszalcsikok = lap-retegek */
.site-account .magazines [class*="col-"] a::before {
  content: "";
  position: absolute;
  top: 1px;
  bottom: 1px;
  right: 0;
  width: 14px;
  transform: rotateY(90deg);
  transform-origin: right center;
  background: repeating-linear-gradient(90deg, #f7f7f7 0, #f7f7f7 1px, #dcdcdc 1px, #dcdcdc 2px, #efefef 2px, #efefef 3px);
}
/* gerinc-arnyalat a bal elen (kattintast atengedo overlay) */
.site-account .magazines [class*="col-"] a::after {
  content: "";
  position: absolute;
  inset: 0;
  border-radius: inherit;
  background: linear-gradient(90deg, rgba(0, 0, 0, .18), rgba(255, 255, 255, .12) 3.5%, rgba(0, 0, 0, 0) 9%);
  pointer-events: none;
}
.site-account .magazines img {
  width: 100%;
  height: auto;
  display: block;
  border-radius: inherit;
}
.site-account .magazines [class*="col-"] a:hover {
  transform: rotateY(-3deg) translateY(-4px);
  box-shadow: 10px 14px 24px rgba(0, 0, 0, .25);
}
