/* GridBee — lapos, gradiensmentes komponens-szókincs (.gb-*)
 * A plugzone.hu .pz-* komponenscsaládjának szerkezeti mintáit követi
 * (tömör szín, mélység árnyékkal/kerettel, nem gradienssel), GridBee
 * zöld+arany színezéssel. Közös a publikus fiók/kosár/checkout oldalak
 * és az admin panel között — a tokens.css-re épül, önmagában nem működik.
 */

*{box-sizing:border-box}

body.gb-page, body.gb-admin{
	margin:0;
	font-family:var(--font-family);
	color:var(--text);
	background:var(--page-bg);
	-webkit-font-smoothing:antialiased; -moz-osx-font-smoothing:grayscale;
	line-height:1.6;
}
body.gb-page{
	background-color:var(--page-bg);
	background-image:var(--hex-pattern);
	background-attachment:fixed;
}

.scroll-progress{position:fixed; top:0; left:0; height:3px; width:0; z-index:200; background:var(--gold-500); pointer-events:none; box-shadow:0 0 10px rgba(240,194,59,.55)}

.gb-main{max-width:var(--wrap-max); margin:0 auto; padding:36px 20px 72px}
.gb-main.narrow{max-width:520px}
.gb-main.medium{max-width:800px}

.gb-section-head{display:flex; align-items:flex-end; justify-content:space-between; gap:16px; flex-wrap:wrap; margin-bottom:22px}
.gb-section-head h1, .gb-section-head h2{margin:0; font-size:clamp(1.4rem, 2.4vw, 1.85rem); color:var(--primary-dark); letter-spacing:-.02em}
.gb-section-head p{margin:6px 0 0; color:var(--text-muted); max-width:62ch}
.gb-section-head__lead{flex:1; min-width:min(100%, 280px)}

@media (prefers-reduced-motion: reduce){
	*, *::before, *::after{animation-duration:.001ms !important; animation-iteration-count:1 !important; transition-duration:.001ms !important; scroll-behavior:auto !important}
}

.gb-container{max-width:1160px; margin:0 auto; padding:0 20px}
.gb-container.wide{max-width:1400px}

/* ── Navigáció — sötét, sticky, blur, a nav-surface az egyetlen tudatos
   gradiens-kivétel a lapos elv alól, a plugzone mintáját követve ────────── */
.gb-nav{
	background:var(--nav-surface);
	color:#eaf3f1;
	position:sticky; top:0; z-index:100;
	border-bottom:1px solid rgba(255,255,255,.06);
	box-shadow:0 4px 20px rgba(0,0,0,.15);
	backdrop-filter:blur(10px); -webkit-backdrop-filter:blur(10px);
}
.gb-nav__bar{display:flex; align-items:center; justify-content:space-between; gap:16px; padding:12px 20px; max-width:var(--wrap-max); margin:0 auto}
.gb-nav__logo{display:flex; align-items:center; gap:10px; color:#eaf3f1; text-decoration:none; font-weight:800; letter-spacing:.12em; font-size:14px}
.gb-nav__logo svg{width:32px; height:32px; filter:drop-shadow(0 0 10px rgba(240,194,59,.35))}
.gb-nav__links{display:flex; align-items:center; gap:6px; flex-wrap:wrap}
.gb-nav__links a{color:#eaf3f1; text-decoration:none; font-weight:600; font-size:14px; padding:8px 14px; border-radius:var(--radius-md); display:inline-flex; align-items:center; gap:7px; transition:background var(--transition-fast), transform var(--transition-fast)}
.gb-nav__links a:hover{background:rgba(255,255,255,.12); transform:translateY(-1px)}
.gb-nav__links a.is-active{background:rgba(255,255,255,.16)}
.gb-nav__links a.gb-nav__cart{color:var(--gold-400); font-weight:800}
.gb-nav__links a.is-accent{color:var(--gold-400)}
.gb-nav__badge{background:var(--gold-500); color:#12261f; padding:2px 7px; border-radius:var(--radius-full); font-size:11px; font-weight:800; margin-left:2px}

.gb-nav-toggle{display:none; background:none; border:1px solid rgba(255,255,255,.2); border-radius:var(--radius-sm); width:40px; height:36px; align-items:center; justify-content:center; cursor:pointer; color:#eaf3f1}
@media (max-width:900px){
	.gb-nav__links{display:none; flex-basis:100%; flex-direction:column; align-items:stretch; gap:2px; margin-top:12px; padding-top:12px; border-top:1px solid rgba(255,255,255,.12)}
	.gb-nav__links.is-open{display:flex}
	.gb-nav__links a{padding:12px 14px; font-size:15px}
	.gb-nav__bar{flex-wrap:wrap}
	.gb-nav-toggle{display:grid; place-items:center}
}

/* ── Nyelvváltó — pill + dropdown, plugzone mintát követve ───────────────── */
.gb-lang{position:relative}
.gb-lang__toggle{display:inline-flex; align-items:center; gap:6px; background:rgba(255,255,255,.08); color:#eaf3f1; border:1px solid rgba(255,255,255,.2); border-radius:var(--radius-full); padding:7px 12px; font-weight:700; font-size:13px; cursor:pointer}
.gb-lang__toggle:hover{background:rgba(255,255,255,.14)}
.gb-lang__menu{display:none; position:absolute; right:0; top:calc(100% + 8px); background:var(--surface); border-radius:var(--radius-md); box-shadow:0 12px 32px rgba(6,40,36,.22); border:1px solid var(--border); min-width:160px; overflow:hidden; z-index:200}
.gb-lang__menu.is-open{display:block}
.gb-lang__menu a{display:block; padding:10px 14px; color:var(--text); text-decoration:none; font-size:14px; font-weight:600}
.gb-lang__menu a:hover{background:var(--surface-alt)}
.gb-lang__menu a.is-active{background:var(--green-50); color:var(--primary); font-weight:700}

/* ── Gombok ────────────────────────────────────────────────────────────── */
.gb-btn{display:inline-flex; align-items:center; justify-content:center; gap:8px; padding:12px 20px; border:1.5px solid transparent; border-radius:var(--radius-md); font-weight:700; font-size:.92rem; font-family:inherit; cursor:pointer; text-decoration:none; transition:transform var(--transition-fast), background var(--transition-fast), box-shadow var(--transition-fast)}
.gb-btn-primary{background:var(--primary); color:#fff; box-shadow:var(--shadow-primary)}
.gb-btn-primary:hover{background:var(--green-800); transform:translateY(-2px)}
.gb-btn-accent{background:var(--accent); color:#2c2408; box-shadow:var(--shadow-accent)}
.gb-btn-accent:hover{background:var(--gold-600); transform:translateY(-2px)}
.gb-btn-ghost{background:var(--surface); color:var(--primary); border-color:var(--border-strong)}
.gb-btn-ghost:hover{background:var(--surface-alt); transform:translateY(-2px)}
.gb-btn-danger{background:var(--danger-fg); color:#fff}
.gb-btn-danger:hover{background:#a91f1f; transform:translateY(-2px)}
.gb-btn-sm{padding:8px 14px; font-size:.82rem}
.gb-btn-lg{padding:14px 26px; font-size:1rem}
.gb-btn-block{width:100%}
.gb-btn:disabled{opacity:.55; cursor:not-allowed; transform:none !important}

/* ── Kártyák ───────────────────────────────────────────────────────────── */
.gb-card{background:var(--surface); border:1px solid var(--border); border-radius:var(--radius-xl); padding:24px 26px; box-shadow:var(--shadow-sm)}
.gb-card__title{display:flex; align-items:center; gap:10px; font-weight:700; font-size:var(--text-lg); color:var(--primary-dark); margin:0 0 12px}

/* ── Chip / badge ──────────────────────────────────────────────────────── */
.gb-chip{display:inline-flex; align-items:center; gap:6px; padding:5px 11px; border-radius:var(--radius-full); font-size:.75rem; font-weight:700}
.gb-chip-success{background:var(--success-bg); color:var(--success-fg)}
.gb-chip-danger{background:var(--danger-bg); color:var(--danger-fg)}
.gb-chip-warning{background:var(--warning-bg); color:var(--warning-fg)}
.gb-chip-info{background:var(--info-bg); color:var(--info-fg)}
.gb-chip-neutral{background:var(--neutral-bg); color:var(--neutral-fg)}
.gb-chip-brand{background:var(--green-50); color:var(--primary)}
.gb-chip-accent{background:var(--gold-100); color:var(--gold-800)}

/* ── Form elemek ───────────────────────────────────────────────────────── */
.gb-field{display:flex; flex-direction:column; gap:5px; min-width:0}
.gb-field-row{display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:12px}
@media (max-width:560px){.gb-field-row{grid-template-columns:1fr}}
.gb-label{font-size:11px; font-weight:700; letter-spacing:.05em; text-transform:uppercase; color:var(--primary-light)}
.gb-input, .gb-select, .gb-textarea{
	width:100%; padding:12px 14px; border:1.5px solid var(--border); border-radius:var(--radius-md);
	background:var(--surface-alt); font-size:var(--text-base); font-family:inherit; color:var(--text);
	transition:border-color var(--transition-fast), background var(--transition-fast), box-shadow var(--transition-fast);
}
.gb-input:focus, .gb-select:focus, .gb-textarea:focus{outline:none; background:var(--surface); border-color:var(--primary-light); box-shadow:var(--focus-ring)}
.gb-textarea{resize:vertical; min-height:100px}

/* ── Beszerzési megrendelés: dinamikus tételsor-builder ───────────────── */
.gb-po-lines{display:grid; gap:8px}
.gb-po-line{display:grid; grid-template-columns:minmax(0,2.2fr) 120px 190px 140px 44px; gap:8px; align-items:center}
.gb-po-line--head{font-size:11px; font-weight:700; letter-spacing:.05em; text-transform:uppercase; color:var(--primary-light); padding:0 2px}
.gb-po-subtotal{font-weight:700; color:var(--primary-dark); text-align:right; font-variant-numeric:tabular-nums}
.gb-po-summary{margin-top:12px; display:flex; align-items:center; justify-content:space-between; gap:12px; flex-wrap:wrap; padding-top:12px; border-top:1px solid var(--border)}
.gb-po-summary__total{font-size:1rem; font-weight:800; color:var(--primary-dark); font-variant-numeric:tabular-nums}
@media (max-width:900px){
	.gb-po-line{grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:8px}
	.gb-po-line--head{display:none}
	.gb-po-line > :nth-child(4){text-align:left}
	.gb-po-line > :nth-child(5){justify-self:end}
}

/* ── Táblázatok ────────────────────────────────────────────────────────── */
.gb-table-wrap{overflow-x:auto; border-radius:var(--radius-xl); box-shadow:var(--shadow-sm); border:1px solid var(--border)}
.gb-table{width:100%; border-collapse:collapse; background:var(--surface)}
.gb-table th{position:sticky; top:0; background:var(--green-50); color:var(--primary); font-size:.72rem; font-weight:700; letter-spacing:.06em; text-transform:uppercase; text-align:left; padding:14px 18px; border-bottom:1px solid var(--green-100)}
.gb-table td{padding:14px 18px; border-bottom:1px solid var(--border); color:var(--text)}
.gb-table tbody tr:hover{background:var(--surface-alt)}
.gb-table tbody tr:last-child td{border-bottom:none}

/* ── Pagináció ─────────────────────────────────────────────────────────── */
.gb-pagination{display:flex; align-items:center; justify-content:space-between; gap:12px; margin-top:18px; flex-wrap:wrap}
.gb-pagination__info{color:var(--text-muted); font-size:.85rem}
.gb-pagination__buttons{display:flex; gap:6px; flex-wrap:wrap}
.gb-pagination__buttons a, .gb-pagination__buttons span{display:inline-flex; align-items:center; justify-content:center; min-width:36px; height:36px; padding:0 10px; border-radius:var(--radius-md); text-decoration:none; font-weight:700; font-size:.85rem; color:var(--primary); border:1px solid var(--border)}
.gb-pagination__buttons a:hover{background:var(--surface-alt)}
.gb-pagination__buttons .is-current{background:var(--primary); color:#fff; border-color:var(--primary)}
.gb-pagination__buttons .is-disabled{opacity:.4; pointer-events:none}

/* ── Alert / flash ─────────────────────────────────────────────────────── */
.gb-alert{padding:13px 18px; border-radius:var(--radius-md); font-weight:600; margin-bottom:20px; display:flex; align-items:center; gap:10px}
.gb-alert-success{background:var(--success-bg); color:var(--success-fg); border:1px solid rgba(46,125,50,.25)}
.gb-alert-danger{background:var(--danger-bg); color:var(--danger-fg); border:1px solid rgba(198,40,40,.25)}
.gb-alert-info{background:var(--info-bg); color:var(--info-fg); border:1px solid rgba(21,101,192,.25)}

/* ── Toast (JS-vezérelt, fixed régió) ──────────────────────────────────── */
.gb-toast-region{position:fixed; top:20px; right:max(16px, env(safe-area-inset-right)); z-index:10040; width:min(380px, calc(100vw - 32px)); display:flex; flex-direction:column; gap:10px}
.gb-toast{display:grid; grid-template-columns:22px minmax(0,1fr) 28px; gap:10px; align-items:start; padding:14px 12px 14px 16px; border-radius:var(--radius-md); color:#fff; font-size:.88rem; font-weight:600; box-shadow:0 14px 36px rgba(6,40,36,.24)}
.gb-toast--success{background:var(--success-fg)}
.gb-toast--error{background:var(--danger-fg)}
.gb-toast--warning{background:var(--warning-fg)}
.gb-toast--info{background:var(--primary)}
.gb-toast__close{background:none; border:none; color:inherit; opacity:.8; cursor:pointer; font-size:16px; line-height:1}

/* ── Stat-hero — tömör sötét panel, nagy szám + statsor. Közös a főoldal
   és az admin dashboard KPI-k között ─────────────────────────────────────── */
.gb-hero{background:var(--primary-dark); color:#fff; border-radius:var(--radius-xl); padding:30px 32px; box-shadow:var(--shadow-lg)}
.gb-hero__eyebrow{display:inline-block; font-size:11px; font-weight:700; letter-spacing:.08em; text-transform:uppercase; color:var(--gold-400); margin-bottom:8px}
.gb-hero__lead{font-size:2.4rem; font-weight:800; letter-spacing:-.02em; margin:0 0 4px; font-variant-numeric:tabular-nums}
.gb-hero__label{color:#cfe6e1; font-size:.95rem; margin:0 0 20px}
.gb-hero__stats{display:grid; grid-template-columns:repeat(auto-fit, minmax(140px, 1fr)); gap:0; border-top:1px solid rgba(255,255,255,.12); padding-top:16px}
.gb-stat{padding:6px 16px; text-align:left; border-right:1px solid rgba(255,255,255,.1)}
.gb-stat:last-child{border-right:none}
.gb-stat__value{font-size:1.5rem; font-weight:800; color:var(--gold-500); font-variant-numeric:tabular-nums}
.gb-stat__label{font-size:.78rem; color:#cfe6e1; font-weight:600; margin-top:2px}

/* ── Master/detail két-panelos nézet (készletező, és bármi hasonló admin-lista) —
   a cms.plugzone.hu ai_charger_monitor.php lista+részlet mintáját követi: kompakt,
   görgethető lista bal oldalt (státusz-pötty + kiemelt aktív sor), teljes részlet-kártya
   jobb oldalt, egyetlen hosszú táblázat helyett. ────────────────────────────────────── */
.gb-inventory{display:grid; grid-template-columns:340px minmax(0,1fr); gap:20px; align-items:start}
@media (max-width:900px){.gb-inventory{grid-template-columns:1fr}}

.gb-inventory__list{background:var(--surface); border:1px solid var(--border); border-radius:var(--radius-xl); box-shadow:var(--shadow-sm); overflow:hidden; max-height:calc(100vh - 320px); min-height:360px; display:flex; flex-direction:column}
@media (max-width:900px){.gb-inventory__list{max-height:420px}}
.gb-inventory__list-body{overflow-y:auto; flex:1}
.gb-inventory__list-empty{padding:24px 18px; color:var(--text-muted); font-size:.9rem; text-align:center}

.gb-inv-item{display:flex; align-items:center; gap:10px; padding:12px 16px; border-bottom:1px solid var(--border); text-decoration:none; color:var(--text); cursor:pointer; transition:background var(--transition-fast)}
.gb-inv-item:last-child{border-bottom:none}
.gb-inv-item:hover{background:var(--surface-alt)}
.gb-inv-item.is-active{background:var(--green-50); border-left:3px solid var(--primary); padding-left:13px}
.gb-inv-dot{width:10px; height:10px; border-radius:50%; flex:0 0 auto}
.gb-inv-dot.dot-ok{background:var(--success-fg)}
.gb-inv-dot.dot-low{background:var(--warning-fg)}
.gb-inv-dot.dot-out{background:var(--danger-fg)}
.gb-inv-item__body{min-width:0; flex:1}
.gb-inv-item__name{font-weight:700; font-size:.9rem; white-space:nowrap; overflow:hidden; text-overflow:ellipsis}
.gb-inv-item__meta{font-size:.76rem; color:var(--text-muted); margin-top:2px}
.gb-inv-item__stock{font-size:.78rem; font-weight:700; flex:0 0 auto}

.gb-inventory__detail{min-height:360px}
.gb-inventory__empty{display:flex; flex-direction:column; align-items:center; justify-content:center; gap:10px; min-height:360px; padding:40px 20px; text-align:center; color:var(--text-muted); background:var(--surface); border:1px dashed var(--border-strong); border-radius:var(--radius-xl)}
.gb-inventory__empty i{font-size:2rem; opacity:.5}

/* ── Grid segédek — minmax(0,1fr), hogy széles tartalom se csorduljon ki ── */
.gb-grid{display:grid; gap:18px}
.gb-grid.cols-2{grid-template-columns:repeat(2, minmax(0,1fr))}
.gb-grid.cols-3{grid-template-columns:repeat(3, minmax(0,1fr))}
.gb-grid.cols-4{grid-template-columns:repeat(4, minmax(0,1fr))}
@media (max-width:768px){
	.gb-grid.cols-2, .gb-grid.cols-3{grid-template-columns:1fr}
	.gb-grid.cols-4{grid-template-columns:repeat(2, minmax(0,1fr))}
}

/* ── Oldalcím (publikus fiók-oldalak és admin listák közös feje) ─────────── */
.gb-page-header{display:flex; align-items:center; justify-content:space-between; gap:16px; margin-bottom:20px; flex-wrap:wrap}
.gb-page-header h1{margin:0; font-size:var(--text-2xl); color:var(--primary-dark); letter-spacing:-.01em}
.gb-page-header__actions{display:flex; gap:10px; flex-wrap:wrap}
.gb-cat-search{display:flex; gap:8px; min-width:min(100%, 280px)}
.gb-cat-search .gb-input{min-width:0; flex:1}

/* ── Lábléc ────────────────────────────────────────────────────────────── */
.gb-footer{margin-top:44px; padding:24px 0; color:var(--text-secondary); font-size:14px; border-top:1px solid var(--border)}
.gb-footer__inner{display:flex; align-items:center; justify-content:space-between; gap:16px; flex-wrap:wrap; max-width:var(--wrap-max); margin:0 auto; padding:0 20px}

/* ── Termékkártya — katalógus, kapcsolódó, főoldal közös merchandising ── */
.gb-product-grid{display:grid; grid-template-columns:repeat(3, minmax(0,1fr)); gap:18px}
@media (max-width:900px){.gb-product-grid{grid-template-columns:repeat(2, minmax(0,1fr))}}
@media (max-width:560px){.gb-product-grid{grid-template-columns:1fr}}

.gb-product{display:flex; flex-direction:column; background:var(--surface); border:1px solid var(--border); border-radius:var(--radius-lg); overflow:hidden; box-shadow:var(--shadow-xs); transition:transform var(--transition-fast), box-shadow var(--transition-fast), border-color var(--transition-fast)}
.gb-product:hover{transform:translateY(-3px); box-shadow:var(--shadow-md); border-color:rgba(217,169,42,.45)}
.gb-product__media{display:block; aspect-ratio:4/3; background:linear-gradient(160deg, var(--green-50), var(--surface-alt)); overflow:hidden; position:relative}
.gb-product__media img{width:100%; height:100%; object-fit:cover; display:block}
.gb-product__fallback{position:absolute; inset:0; display:grid; place-items:center; color:var(--primary)}
.gb-product__fallback svg{width:48px; height:48px}
.gb-product__body{display:flex; flex-direction:column; gap:8px; padding:16px 16px 18px; flex:1}
.gb-product__name{margin:0; font-size:1rem; line-height:1.35; font-weight:700}
.gb-product__name a{color:var(--text); text-decoration:none}
.gb-product__name a:hover{color:var(--primary)}
.gb-product__desc{margin:0; color:var(--text-muted); font-size:.88rem; flex:1}
.gb-product__meta{display:flex; align-items:center; justify-content:space-between; gap:8px; margin-top:4px}
.gb-product__price{font-weight:800; color:var(--primary); font-variant-numeric:tabular-nums; letter-spacing:-.01em}
.gb-product__action{margin-top:6px}
.gb-product__action .gb-btn{width:100%}

/* ── Kategória-navigáció / belépő csempék ─────────────────────────────── */
.gb-cat-nav{display:flex; flex-wrap:wrap; gap:8px}
.gb-cat-nav a{display:inline-flex; align-items:center; padding:8px 14px; border-radius:var(--radius-full); border:1px solid var(--border); background:var(--surface); color:var(--text-secondary); text-decoration:none; font-weight:700; font-size:.86rem}
.gb-cat-nav a:hover{border-color:var(--border-strong); color:var(--primary)}
.gb-cat-nav a.is-active{background:var(--primary); color:#fff; border-color:var(--primary)}

.gb-cat-tiles{display:grid; grid-template-columns:repeat(3, minmax(0,1fr)); gap:16px}
@media (max-width:800px){.gb-cat-tiles{grid-template-columns:1fr}}
.gb-cat-tile{display:grid; grid-template-columns:auto 1fr; gap:14px; align-items:center; padding:18px 20px; background:var(--surface); border:1px solid var(--border); border-radius:var(--radius-lg); text-decoration:none; color:inherit; box-shadow:var(--shadow-xs); transition:transform var(--transition-fast), border-color var(--transition-fast), box-shadow var(--transition-fast)}
.gb-cat-tile:hover{transform:translateY(-2px); border-color:rgba(217,169,42,.5); box-shadow:var(--shadow-sm)}
.gb-cat-tile__ico{width:46px; height:46px; display:grid; place-items:center; background:var(--green-50); color:var(--primary); border-radius:12px; clip-path:polygon(25% 4%, 75% 4%, 98% 50%, 75% 96%, 25% 96%, 2% 50%)}
.gb-cat-tile__ico svg{width:22px; height:22px}
.gb-cat-tile__name{display:block; font-weight:800; color:var(--primary-dark); letter-spacing:-.01em}
.gb-cat-tile__blurb{display:block; margin-top:2px; font-size:.84rem; color:var(--text-muted)}

/* ── Breadcrumb + galéria (termékoldal) ──────────────────────────────── */
.gb-breadcrumb{display:flex; flex-wrap:wrap; gap:6px; align-items:center; font-size:.84rem; color:var(--text-muted); margin-bottom:20px}
.gb-breadcrumb a{color:var(--text-muted); text-decoration:none}
.gb-breadcrumb a:hover{color:var(--primary)}
.gb-breadcrumb__sep{opacity:.5}

.gb-gallery{display:grid; gap:10px}
.gb-gallery__stage{background:var(--surface); border:1px solid var(--border); border-radius:var(--radius-lg); overflow:hidden}
.gb-gallery__stage img{width:100%; display:block; aspect-ratio:4/3; object-fit:cover}
.gb-gallery__thumbs{display:flex; gap:8px; flex-wrap:wrap}
.gb-gallery__thumb{padding:0; border:2px solid transparent; border-radius:var(--radius-sm); overflow:hidden; cursor:pointer; background:var(--surface); width:68px; height:68px}
.gb-gallery__thumb img{width:100%; height:100%; object-fit:cover; display:block}
.gb-gallery__thumb.is-active{border-color:var(--gold-500)}

/* ── Auth / üres állapot ─────────────────────────────────────────────── */
.gb-auth{display:flex; align-items:flex-start; justify-content:center; padding-top:56px}
.gb-auth .gb-card{width:100%; max-width:420px}
.gb-auth__mark{display:flex; justify-content:center; margin-bottom:8px}
.gb-auth__mark svg{width:40px; height:40px}
.gb-auth h1, .gb-auth h2{text-align:center; color:var(--primary-dark); margin:0 0 18px; letter-spacing:-.02em}
.gb-auth__switch{margin-top:20px; text-align:center; font-size:.9rem}
.gb-auth__switch a{color:var(--primary); font-weight:700; text-decoration:none}

.gb-empty{text-align:center; padding:52px 24px}

.gb-article{max-width:720px}
.gb-article h1{margin:0 0 18px; color:var(--primary-dark); letter-spacing:-.02em; font-size:clamp(1.6rem, 3vw, 2.1rem); line-height:1.2}
.gb-article h2{margin:28px 0 10px; color:var(--primary-dark); font-size:1.2rem; letter-spacing:-.015em}
.gb-article p{margin:0 0 12px; color:var(--text); line-height:1.7}
.gb-article ul{margin:0 0 16px; padding-left:1.2em; color:var(--text); line-height:1.65}
.gb-article li{margin:4px 0}
.gb-article__meta{margin:0 0 10px; font-size:.82rem; font-weight:700; letter-spacing:.04em; text-transform:uppercase; color:var(--green-700)}
.gb-article__cta{display:flex; flex-wrap:wrap; gap:10px; margin-top:32px; padding-top:22px; border-top:1px solid var(--border)}

/* ── Fejléc-deck: oldalirányú lapozás külön URL-ek között ─────────────── */
html.gb-deck-lock, html.gb-deck-lock body{overflow:hidden}
.gb-deck{min-height:calc(100dvh - 72px); padding:12px 0 80px; will-change:transform}
.gb-deck:has(.hero){padding-top:0}
.gb-deck.is-leave-left{animation:gbDeckOutLeft .28s cubic-bezier(.16,.8,.24,1) both}
.gb-deck.is-leave-right{animation:gbDeckOutRight .28s cubic-bezier(.16,.8,.24,1) both}
html[data-deck-enter="left"] .gb-deck{animation:gbDeckInRight .36s cubic-bezier(.16,.8,.24,1) both}
html[data-deck-enter="right"] .gb-deck{animation:gbDeckInLeft .36s cubic-bezier(.16,.8,.24,1) both}
@keyframes gbDeckOutLeft{to{transform:translateX(-24%); opacity:0}}
@keyframes gbDeckOutRight{to{transform:translateX(24%); opacity:0}}
@keyframes gbDeckInRight{from{transform:translateX(24%); opacity:0}to{transform:none; opacity:1}}
@keyframes gbDeckInLeft{from{transform:translateX(-24%); opacity:0}to{transform:none; opacity:1}}

.gb-deck-dots{position:fixed; left:50%; bottom:max(14px, env(safe-area-inset-bottom)); transform:translateX(-50%); z-index:80; display:flex; gap:8px; padding:8px 12px; background:rgba(4,25,22,.55); border:1px solid rgba(255,255,255,.12); border-radius:var(--radius-full); backdrop-filter:blur(10px); -webkit-backdrop-filter:blur(10px)}
.gb-deck-dots a{width:8px; height:8px; border-radius:50%; background:rgba(255,255,255,.35); display:block}
.gb-deck-dots a.is-active{background:var(--gold-500); transform:scale(1.25)}

.gb-deck-edge{position:fixed; top:50%; z-index:80; width:42px; height:42px; margin-top:-21px; display:grid; place-items:center; border-radius:50%; background:rgba(4,25,22,.55); color:#eaf3f1; border:1px solid rgba(255,255,255,.14); text-decoration:none; backdrop-filter:blur(10px); -webkit-backdrop-filter:blur(10px)}
.gb-deck-edge:hover{background:var(--green-900); color:var(--gold-400)}
.gb-deck-edge--prev{left:max(10px, env(safe-area-inset-left))}
.gb-deck-edge--next{right:max(10px, env(safe-area-inset-right))}
@media (max-width:900px){.gb-deck-edge{display:none}}
@media (prefers-reduced-motion: reduce){
	.gb-deck.is-leave-left, .gb-deck.is-leave-right,
	html[data-deck-enter="left"] .gb-deck, html[data-deck-enter="right"] .gb-deck{animation:none}
}