/* ============================================================
   EWMT2 – Arany téma (sötét + arany)
   Külön override réteg a Bootstrap fölött. Levehető: csak a
   <link ... theme-gold.css> sort kell törölni az index.php-ból.
   ============================================================ */

:root{
  --bg:        #12100b;
  --bg-2:      #1a150f;
  --surface:   #241d14;
  --surface-2: #2d2418;
  --border:    #3c2f1d;
  --gold:      #e6bd54;
  --gold-2:    #cf9a2f;
  --gold-deep: #8a6a1f;
  --text:      #ece2cc;
  --muted:     #ab9c7c;
}

/* ---------- Alap ---------- */
body{
  background: var(--bg);
  color: var(--text);
  font-family: "Segoe UI", Roboto, Arial, sans-serif;
}
a{ color: var(--gold); }
a:hover{ color: #f3d27e; text-decoration: none; }
hr{
  border: 0;
  height: 2px;
  background: linear-gradient(90deg, transparent, var(--gold-deep), var(--gold), var(--gold-deep), transparent);
  opacity: .8;
  margin: 2rem 0;
}
h1,h2,h3,h4,h5{ color: var(--text); }
strong{ color: #f0e4c8; }

/* ---------- Navbar ---------- */
.navbar.bg-dark{
  background: linear-gradient(180deg, #1c1610, #14100b) !important;
  border-bottom: 2px solid var(--gold-deep);
  box-shadow: 0 2px 18px rgba(0,0,0,.5);
}
.navbar-brand{
  font-weight: 800;
  letter-spacing: 2px;
  color: var(--gold) !important;
  text-shadow: 0 1px 6px rgba(230,189,84,.35);
}
.navbar-dark .navbar-nav .nav-link{
  color: #d8cbac !important;
  font-weight: 600;
  position: relative;
  transition: color .2s;
}
.navbar-dark .navbar-nav .nav-link:hover{ color: var(--gold) !important; }
.navbar-dark .navbar-nav .nav-link::after{
  content:""; position:absolute; left:12px; right:12px; bottom:4px; height:2px;
  background: var(--gold); transform: scaleX(0); transform-origin:left; transition: transform .25s;
}
.navbar-dark .navbar-nav .nav-link:hover::after{ transform: scaleX(1); }

/* ---------- HERO banner ---------- */
.gold-hero{
  position: relative;
  margin-top: 56px;            /* fixed navbar alá */
  min-height: clamp(400px, 62vh, 680px);   /* magasabb hero -> tobb banner latszik */
  display: flex;
  align-items: flex-end;       /* gombok a banner aljara */
  justify-content: center;
  padding: 40px 16px 44px;
  text-align: center;
  overflow: hidden;
  background:
    linear-gradient(180deg, rgba(18,16,11,.18) 0%, rgba(18,16,11,.30) 55%, rgba(18,16,11,.85) 92%, #12100b 100%),
    url('../banner.jpg') center/cover no-repeat;
  border-bottom: 2px solid var(--gold-deep);
}
.gold-hero::before,
.gold-hero::after{
  content:""; position:absolute; left:0; right:0; height:2px;
  background: linear-gradient(90deg, transparent, var(--gold), transparent);
}
.gold-hero::before{ top:0; opacity:.7; }
.gold-hero::after{ bottom:0; opacity:.9; }

.gold-hero__inner{ position:relative; z-index:2; max-width: 780px; margin:0 auto; }

.gold-hero__emblem{
  width: 92px; height: 92px; margin: 0 auto 18px;
  border-radius: 50%;
  display:flex; align-items:center; justify-content:center;
  font-size: 34px; font-weight: 800; letter-spacing: 1px;
  color: #1a140b;
  background: radial-gradient(circle at 35% 30%, #fbe9a8, #e6bd54 42%, #b9862a 100%);
  box-shadow: 0 0 0 3px rgba(230,189,84,.25), 0 8px 26px rgba(0,0,0,.55);
}
.gold-hero__title{
  margin: 6px 0 6px;
  font-size: clamp(44px, 8vw, 84px);
  font-weight: 900;
  letter-spacing: 6px;
  color: var(--gold);
  background: linear-gradient(180deg, #fbe9a8 0%, #e6bd54 45%, #b9862a 100%);
  -webkit-background-clip: text; background-clip: text;
  -webkit-text-fill-color: transparent;
  text-shadow: 0 6px 30px rgba(230,189,84,.20);
}
.gold-hero__subtitle{
  margin: 0 0 26px;
  font-size: clamp(15px, 2.4vw, 20px);
  color: var(--muted);
  letter-spacing: .5px;
}
.gold-hero__cta{ display:flex; gap:14px; justify-content:center; flex-wrap:wrap; }

/* ---------- Arany gombok ---------- */
.btn-gold,
.btn-primary, .btn-secondary, .btn-lg.btn-secondary{
  border: 1px solid var(--gold-2) !important;
  border-radius: 8px !important;
  font-weight: 700 !important;
  letter-spacing: .4px;
  color: #1a140b !important;
  background: linear-gradient(180deg, #f2d178, #e6bd54 45%, #c9982f 100%) !important;
  box-shadow: 0 6px 18px rgba(201,152,47,.28);
  transition: transform .12s, box-shadow .2s, filter .2s;
  padding: 11px 26px;
}
.btn-gold:hover,
.btn-primary:hover, .btn-secondary:hover{
  color:#1a140b !important; filter: brightness(1.08);
  box-shadow: 0 8px 24px rgba(230,189,84,.4); transform: translateY(-1px);
}
.btn-gold--outline{
  background: transparent !important;
  color: var(--gold) !important;
  border: 1px solid var(--gold-2) !important;
  box-shadow: none;
}
.btn-gold--outline:hover{
  background: rgba(230,189,84,.10) !important;
  color: #f3d27e !important;
}

/* ---------- Kártyák / szekciók ---------- */
.card{ background: var(--surface) !important; border:1px solid var(--border) !important; }
.card.bg-secondary{
  background: linear-gradient(180deg, var(--surface-2), var(--surface)) !important;
  border:1px solid var(--gold-deep) !important;
  box-shadow: 0 6px 24px rgba(0,0,0,.4);
}
.card.bg-secondary h1{ color: var(--gold) !important; letter-spacing:1px; }
.card .card-body{ color: var(--text); }
.bg-secondary{ background-color: var(--surface-2) !important; }

/* online / karakter számlálók */
h5[align="center"]{ color: var(--gold); font-weight:700; }

.container ul li{ color: var(--text); }

/* ---------- Modalok / űrlapok ---------- */
.modal-content{ background: var(--surface); color: var(--text); border:1px solid var(--gold-deep); }
.modal-header, .modal-footer{ border-color: var(--border); }
.modal-title{ color: var(--gold); }
.form-control{
  background:#171208; color:#fff; border:1px solid var(--border);
}
.form-control:focus{
  background:#171208; color:#fff; border-color: var(--gold-2);
  box-shadow: 0 0 0 .18rem rgba(230,189,84,.18);
}
.form-control::placeholder{ color:#8f8064; }
.errorMsg{ color:#f0c66b; font-size:14px; margin:6px 0; }
.close{ color: var(--gold); opacity:.8; }

/* ---------- Footer ---------- */
footer.bg-dark{
  background: #14100b !important;
  border-top: 2px solid var(--gold-deep);
}
footer .text-white{ color: var(--muted) !important; }

/* ---------- Reszponzív ---------- */
@media (max-width: 576px){
  .gold-hero{ padding: 64px 14px 70px; }
  .gold-hero__title{ letter-spacing: 4px; }
}

/* ---------- Hero logó kép ---------- */
.gold-hero__logo{
  display:block;
  max-width: min(340px, 72vw);
  height: auto;
  margin: 0 auto 26px;
  filter: drop-shadow(0 10px 30px rgba(0,0,0,.55));
}

/* ---------- Statisztika sáv (online / 24h / karakterek) ---------- */
.stats-bar{
  display:flex; flex-wrap:wrap; gap:16px; justify-content:center;
  margin: 26px 0 8px;
}
.stat-card{
  flex: 1 1 200px; max-width: 300px;
  background: linear-gradient(180deg, var(--surface-2), var(--surface));
  border: 1px solid var(--gold-deep);
  border-radius: 12px;
  padding: 20px 16px;
  text-align: center;
  box-shadow: 0 6px 22px rgba(0,0,0,.35);
}
.stat-card__num{
  font-size: 40px; font-weight: 900; line-height:1;
  color: var(--gold);
  background: linear-gradient(180deg, #fbe9a8, #e6bd54 55%, #b9862a);
  -webkit-background-clip:text; background-clip:text; -webkit-text-fill-color:transparent;
  text-shadow: 0 4px 18px rgba(230,189,84,.18);
}
.stat-card__label{ margin-top:8px; color: var(--muted); font-size:14px; letter-spacing:.3px; }

/* ---------- Hírek / Patch notes ---------- */
.news-section{ margin: 40px 0 10px; }
.news-section__title{
  text-align:center; color: var(--gold);
  font-weight: 800; letter-spacing: 1px; margin-bottom: 22px;
}
.news-section__title::after{
  content:""; display:block; width:120px; height:2px; margin:12px auto 0;
  background: linear-gradient(90deg, transparent, var(--gold), transparent);
}
.news-card{
  background: var(--surface);
  border: 1px solid var(--border);
  border-left: 3px solid var(--gold-2);
  border-radius: 10px;
  padding: 18px 20px;
  margin: 0 auto 16px;
  max-width: 820px;
  box-shadow: 0 4px 16px rgba(0,0,0,.30);
}
.news-card__head{ display:flex; align-items:center; flex-wrap:wrap; gap:10px; margin-bottom:8px; }
.news-card__date{ color: var(--muted); font-size:13px; }
.news-card__tag{
  font-size:12px; font-weight:700; letter-spacing:.4px;
  color:#1a140b; background: linear-gradient(180deg,#f2d178,#c9982f);
  border-radius: 20px; padding: 2px 12px;
}
.news-card__title{ width:100%; margin:2px 0 0; color:#f0e4c8; font-size:19px; }
.news-card__body{ color: var(--text); line-height:1.55; }

/* ---- "Korábbi hírek" ------------------------------------------------
   Minden hir TELJES szoveggel latszik -- ami sok lesz idovel, az a LISTA
   hossza. Ezert az elso par bejegyzes utan a tobbi egy <details> ala kerul.
   NINCS hozza JavaScript: JS nelkul is nyilik, a kereso a teljes tartalmat
   latja, es a Ctrl+F is megtalalja a rejtett reszt (a bongeszo kinyitja).

   A gomb a lap fo aranyszinu gomb-stilusat kapja (lasd .btn-gold), hogy
   egyertelmuen kattinthato legyen, es kozepre zart pasztilla.
   Az elvalaszto vonal NEM ::before, hanem a details hattereben festett
   gradiens -- a ::before a <details> shadow-DOM-ja miatt bongeszonkent
   kiszamithatatlan. */
.news-archive{
  max-width: 820px;
  margin: 28px auto 16px;
  padding-top: 28px;
  text-align: center;
  /* 1 px magas, kozepre zart aranyszalag a gomb folott */
  background: linear-gradient(90deg, transparent, var(--gold-deep), transparent)
              no-repeat top center / 240px 1px;
}
.news-archive > summary{
  display: inline-block;
  cursor: pointer;
  list-style: none;
  padding: 14px 36px;
  font-weight: 800;
  font-size: 16px;
  letter-spacing: .6px;
  color: #1a140b;
  background: linear-gradient(180deg, #f2d178, #e6bd54 45%, #c9982f 100%);
  border: 1px solid var(--gold-2);
  border-radius: 8px;
  box-shadow: 0 6px 18px rgba(201,152,47,.28);
  transition: transform .12s, box-shadow .2s, filter .2s;
  user-select: none;
}
/* A nyitogato haromszog elrejtese (bongeszonkent mas a szelektor) */
.news-archive > summary::-webkit-details-marker{ display:none; }
.news-archive > summary::marker{ content:""; }
.news-archive > summary:hover{
  filter: brightness(1.08);
  box-shadow: 0 8px 24px rgba(230,189,84,.40);
  transform: translateY(-1px);
}
.news-archive > summary:focus-visible{ outline:2px solid var(--gold); outline-offset:3px; }

.news-archive__close{ display:none; }
.news-archive[open] > summary .news-archive__open{ display:none; }
.news-archive[open] > summary .news-archive__close{ display:inline; }

/* Csukva a gomb a lista aljan all; nyitva a felhozott bejegyzesek folott. */
.news-archive[open] > summary{ margin-bottom: 26px; }

/* A kozepre igazitas CSAK a gombra vonatkozik -- a hirek szovege balra zart. */
.news-archive__list{
  text-align: left;
  animation: newsFade .18s ease-out;
}
@keyframes newsFade{
  from{ opacity:0; transform: translateY(-4px); }
  to{ opacity:1; transform:none; }
}
/* Aki kikapcsolta az animaciokat, ne kapjon mozgast */
@media (prefers-reduced-motion: reduce){
  .news-archive__list{ animation:none; }
}

@media (max-width: 576px){
  .news-archive > summary{ padding: 13px 22px; font-size: 15px; }
}

/* Hir-kep (news.php 'image'): legfeljebb a kartya szelessegeig no, kozepre zarva.
   A max-height az allo plakatok miatt kell (kulonben kepernyonyi magasak
   lennenek); a fekvo kepeket nem erinti. Kattintasra teljes meret. */
.news-card__image{
  display:block; width:fit-content; max-width:100%; margin:18px auto 4px;
  border:1px solid var(--gold-deep); border-radius:12px;
  overflow:hidden; background:#000;
  box-shadow: 0 6px 22px rgba(0,0,0,.40);
}
.news-card__image img{ display:block; max-width:100%; max-height:720px; width:auto; height:auto; }

/* TikTok beagyazas: allo video, kozepre zart doboz.
   A lejatszo also savjat (leiras, zene, gombok) NEM lehet CSS-bol elrejteni,
   mert masik domainrol jon -> helyette KIVAGJUK: az iframe magasabb, mint a
   doboz, a doboz pedig overflow:hidden-nel levagja az aljat.
   KET SZAM SZABALYOZ MINDENT:
     --w      = a lejatszo szelessege (ezzel allitod a meretet)
     --chrome = mennyit vagunk le az aljabol (ha TikTok atalakitja a
                lejatszot, EZT az egy erteket kell hangolni) */
.news-card__video{
  --w: 300px;
  --chrome: 180px;
  position:relative;
  display:block; width:100%; max-width:var(--w);
  aspect-ratio: 9 / 16;
  margin:18px auto 4px; margin-left:auto; margin-right:auto;
  float:none;
  border:1px solid var(--gold-deep); border-radius:12px;
  overflow:hidden; background:#000;
  box-shadow: 0 6px 22px rgba(0,0,0,.40);
}
.news-card__video iframe{
  position:absolute; top:0; left:0;
  display:block; width:100%;
  height: calc(100% + var(--chrome));
  border:0;
}
/* Regi bongeszok (nincs aspect-ratio): fix meret, ugyanaz az aranyszam. */
@supports not (aspect-ratio: 1){
  .news-card__video{ height:533px; }
}

@media (max-width: 576px){
  .stat-card__num{ font-size:32px; }
  .gold-hero__logo{ margin-bottom:20px; }
}

/* ============================================================
   Aloldalak (dashboard, download, profiler): kartya-fejlec,
   tablak, tovabbi gombok, szovegek
   ============================================================ */
.card-header{
  background: linear-gradient(180deg, var(--surface-2), var(--surface)) !important;
  border-bottom: 1px solid var(--gold-deep) !important;
  color: var(--gold) !important;
}
.card-header h4, .card-header h5, .card-header h6,
.card-header .text-primary{ color: var(--gold) !important; margin:0; }
.text-primary{ color: var(--gold) !important; }

/* Tablak sotet temaban */
.table{ color: var(--text); }
.table thead th{
  background: var(--surface-2);
  color: var(--gold);
  border-color: var(--gold-deep) !important;
  font-weight: 700;
}
.table td, .table th{ border-color: var(--border) !important; }
.table-bordered, .table-bordered td, .table-bordered th{ border: 1px solid var(--border) !important; }
.table-striped tbody tr:nth-of-type(odd){ background: rgba(255,255,255,.03); }
.table-hover tbody tr:hover{ background: rgba(230,189,84,.08); color: var(--text); }

/* btn-success is arany, hogy egyseges legyen */
.btn-success{
  border: 1px solid var(--gold-2) !important;
  color: #1a140b !important;
  background: linear-gradient(180deg, #f2d178, #e6bd54 45%, #c9982f 100%) !important;
  box-shadow: 0 6px 18px rgba(201,152,47,.28);
  font-weight: 700;
}
.btn-success:hover{ color:#1a140b !important; filter: brightness(1.08); }

/* ---------- Discord doboz ---------- */
.discord-box{
  display:flex; align-items:center; gap:20px; flex-wrap:wrap;
  max-width: 820px; margin: 26px auto 10px;
  background: linear-gradient(180deg, var(--surface-2), var(--surface));
  border: 1px solid var(--gold-deep);
  border-left: 3px solid #5865F2;
  border-radius: 12px;
  padding: 20px 24px;
  box-shadow: 0 6px 22px rgba(0,0,0,.35);
}
.discord-box__icon{ flex:0 0 auto; line-height:0; }
.discord-box__text{ flex:1 1 240px; }
.discord-box__text h3{ margin:0 0 4px; color:#f0e4c8; font-size:19px; }
.discord-box__text p{ margin:0; color:var(--muted); font-size:14px; }
.discord-box__btn{ flex:0 0 auto; }
@media (max-width: 576px){
  .discord-box{ text-align:center; justify-content:center; }
}

/* ============================================================
   Feher / vilagos dobozok -> vilagosabb barna, olvashato szoveg
   ============================================================ */

/* input-group cimkek (pl. "Login:", "ID:", "@", "Uj:") */
.input-group-text{
  background: var(--surface-2) !important;
  color: var(--text) !important;
  border: 1px solid var(--border) !important;
}

/* morzsamenu (breadcrumb) */
.breadcrumb{
  background: var(--surface-2) !important;
  border: 1px solid var(--border);
}
.breadcrumb-item, .breadcrumb-item.active,
.breadcrumb-item + .breadcrumb-item::before{ color: var(--muted) !important; }
.breadcrumb-item a{ color: var(--gold) !important; }
.breadcrumb-item p{ color: var(--text) !important; }

/* altalanos vilagos hatterek */
.bg-light, .bg-white{ background: var(--surface-2) !important; color: var(--text) !important; }

/* bg-warning kartya (pl. letoltes oldal) -> vilagos barna */
.card.bg-warning, .bg-warning{
  background: linear-gradient(180deg, #3a2f1c, #2d2418) !important;
  color: var(--text) !important;
}
.card.bg-warning{ border: 1px solid var(--gold-deep) !important; }
.card.bg-warning .card-body, .card.bg-warning p, .card.bg-warning h5{ color: var(--text) !important; }

/* modal fejlec/labjegyzet ne legyen vilagos */
.modal-header, .modal-footer{ background: var(--surface); }

/* input-group prepend keret */
.input-group-prepend{ border-radius: 6px 0 0 6px; overflow: hidden; }