/* Paplovag Kingdom · V0.8.2.8
   Egységes sötét/arany felületi paletta a belső és jogi oldalakon. */
:root {
  --bg: #050608;
  --panel: rgba(10, 11, 13, .95);
  --panel-2: rgba(13, 15, 18, .93);
  --border: rgba(202, 153, 70, .30);
  --gold: #c9953f;
  --gold-light: #e2bb6a;
  --text: #eee7d9;
  --muted: #bdb4a4;

  --ad-bg: #050608;
  --ad-panel: rgba(10, 11, 13, .96);
  --ad-panel-soft: rgba(13, 15, 18, .94);
  --ad-gold: #c9953f;
  --ad-gold-light: #e2bb6a;
  --ad-line: rgba(202, 153, 70, .32);
  --ad-line-soft: rgba(202, 153, 70, .16);
  --ad-text: #eee7d9;
  --ad-muted: #bdb4a4;
  --ad-derived: #c6a25a;
  --ad-derived-light: #efd79d;

  --kingdom-gold: #c9953f;
  --kingdom-gold-light: #e2bb6a;
  --kingdom-ink: #050608;
  --kingdom-panel: rgba(10, 11, 13, .96);
  --kingdom-line: rgba(202, 153, 70, .30);

  --arena-gold: #c9953f;
  --arena-gold-light: #e2bb6a;
  --arena-line: rgba(202, 153, 70, .30);
  --arena-panel: rgba(10, 11, 13, .96);
  --arena-muted: #aaa196;

  --admin-bg: #050608;
  --admin-panel: rgba(10, 11, 13, .96);
  --admin-gold: #c9953f;
  --admin-gold-light: #e2bb6a;
  --admin-line: rgba(202, 153, 70, .30);
  --admin-muted: #aaa196;
}

html,
body,
body.changelog-page,
body.legal-page,
body.admin-page,
body.adventurer-page,
body.arena-page,
body.kingdom-page {
  background-color: #050608;
}

body:not([data-page="login"]) {
  background:
    radial-gradient(circle at 50% -12%, rgba(112, 69, 26, .12), transparent 34%),
    linear-gradient(rgba(2, 3, 4, .94), rgba(2, 3, 4, .99)),
    repeating-linear-gradient(0deg, rgba(255,255,255,.008) 0 1px, transparent 1px 4px),
    #050608;
}

.ambient-one { background: #9a682e; }
.ambient-two { background: #6f4924; opacity: .08; }

.site-header::before {
  border-bottom-color: rgba(202, 153, 70, .18);
  background:
    radial-gradient(circle at 18% 0%, rgba(112, 69, 26, .09), transparent 32%),
    linear-gradient(180deg, rgba(3, 4, 5, .98), rgba(3, 4, 5, .96));
}

.top-nav { color: #aaa092; }
.top-nav a:hover,
.top-nav a.active { color: #e2bb6a; }

.profile-banner {
  border-color: rgba(202,153,70,.30);
  background: linear-gradient(115deg, rgba(55,37,20,.84), rgba(10,11,13,.96) 56%, rgba(18,14,10,.94));
}
.account-card,
.loading-card,
.roadmap-card {
  background: linear-gradient(180deg, rgba(14,15,17,.96), rgba(7,8,9,.98));
  border-color: rgba(202,153,70,.22);
}
.account-card.unlinked { background: rgba(9,10,12,.86); }
.account-user img,
.profile-avatar { background: #12100d; }

/* A karakterlapon a számított értékek is az arany/krém palettát használják. */
.adventure-fog-two { background: #76542e; opacity: .08; }
.derived-stat strong,
.combat-stat strong,
.character-level-badge strong { color: var(--ad-derived-light); }
.derived-stat span,
.combat-stat span,
.character-level-badge small { color: var(--ad-derived); }

/* A Birodalom oldal másodlagos köde ne legyen kék. */
.kingdom-fog-two { background: #70502d; }
.kingdom-map-section,
.kingdom-overview-card,
.kingdom-dialog {
  background-color: rgba(9,10,11,.96);
}

/* Az Aréna pajzs-effektusa szándékosan kék marad: ez a védés visszajelzése. */
.arena-panel,
.battle-log-panel,
.arena-dialog,
.arena-wallet-card,
.arena-latest-result {
  background-color: rgba(9,10,11,.96);
}

.admin-hero {
  background: linear-gradient(110deg, rgba(64,41,20,.58), rgba(9,10,12,.97) 58%);
}
.summary-card,
.admin-panel,
.admin-detail-dialog,
.delete-dialog {
  background-color: rgba(9,10,12,.97);
}

.legal-page {
  background:
    radial-gradient(circle at 12% 4%, rgba(131,87,28,.13), transparent 32%),
    radial-gradient(circle at 88% 14%, rgba(112,69,26,.08), transparent 34%),
    #050608;
}
.legal-card {
  border-color: rgba(202,153,70,.30);
  background: rgba(9,10,12,.97);
}
.legal-details,
.legal-details > div,
.legal-table th,
.legal-table td,
.legal-links { border-color: rgba(202,153,70,.18); }

.waiting-card,
.changelog-version-card,
.changelog-entry {
  background: linear-gradient(180deg, rgba(14,13,12,.96), rgba(7,8,9,.98));
  border-color: rgba(202,153,70,.22);
}

.site-footer::before {
  border-top-color: rgba(202,153,70,.18);
  background:
    radial-gradient(circle at 82% 100%, rgba(58,39,23,.08), transparent 34%),
    linear-gradient(180deg, rgba(4,5,6,.97), rgba(2,3,4,.995));
}
.site-footer nav { gap: 18px; }
.site-footer a { color: #aaa196; }
.site-footer a:hover,
.site-footer a:focus-visible { color: #e2bb6a; }

@media (max-width: 620px) {
  .site-footer nav { gap: 12px 16px; }
}

/* V0.8.2.10 – A navigáció színei az indexoldal arany tónusait követik. */
.top-nav a,
.top-nav .disabled,
.top-nav .logout-button { color: #aaa092; }
.top-nav a:hover,
.top-nav a:focus-visible,
.top-nav a.active,
.top-nav .logout-button:hover,
.top-nav .logout-button:focus-visible { color: #e2bb6a; }

/* V0.8.2.25 – currency icon display */
strong.currency-amount,
.currency-amount {
  display: inline-flex;
  align-items: center;
  gap: 0.38em;
  line-height: 1;
  white-space: nowrap;
  vertical-align: middle;
}

strong.currency-amount::after,
.currency-amount::after {
  content: "";
  width: var(--currency-icon-size, 0.92em);
  height: var(--currency-icon-size, 0.92em);
  display: block;
  flex: 0 0 auto;
  background-position: center;
  background-repeat: no-repeat;
  background-size: contain;
  filter: drop-shadow(0 1px 2px rgba(0, 0, 0, 0.45));
}

.currency-amount--crown {
  --currency-icon-size: 1.02em;
}

.currency-amount--ancient {
  --currency-icon-size: 0.98em;
}


.character-vault .currency-amount--crown,
.currency-token .currency-amount--crown {
  --currency-icon-size: 1.28em;
}

.character-vault .currency-amount--ancient,
.currency-token .currency-amount--ancient {
  --currency-icon-size: 1.12em;
}

.detail-crown-card .currency-amount--crown {
  --currency-icon-size: 1.14em;
}

.currency-amount--crown::after {
  background-image: url("/assets/currency/korona-icon.png");
}

.currency-amount--ancient::after {
  background-image: url("/assets/currency/osi-garas-icon.png");
}

.treasury-card strong.currency-amount,
.detail-crown-card strong.currency-amount,
.arena-wallet-card strong.currency-amount,
.kingdom-wallet-card strong.currency-amount {
  justify-content: flex-end;
}

.contribution-balance strong.currency-amount,
.character-vault strong.currency-amount {
  justify-content: flex-start;
}
