@import url('https://fonts.googleapis.com/css2?family=Cinzel:wght@600;700;800&display=swap');
/* ===== EraBaiak: odswiezenie szablonu tibiacom ===== */

/* logo EB zamiast logo Tibii */
#LeftArtwork #TibiaLogoArtworkTop {
  top: 18px;
  height: 125px;
  width: 166px;
  cursor: pointer;
}
#LeftArtwork #TibiaLogoArtworkBottom,
#LeftArtwork #LogoLink,
#LeftArtwork #Statue_1,
#LeftArtwork #Statue_2 {
  display: none;
}

/* tresc nizej, zeby zmiescic wieksze logo ze smokami (oryginalnie 155px) */
#ContentRow {
  top: 225px;
}

/* tlo strony pod obrazkiem - granat jak w logo */
body {
  background-color: #050b18;
}

/* boks "Pobierz gre" */
#DownloadBox.eb-download {
  height: auto;
  background: none;
}
.eb-download-inner {
  margin: 0 7px;
  padding: 12px 10px 14px;
  text-align: center;
  background: linear-gradient(180deg, #0b1630 0%, #060b18 100%);
  border: 1px solid #2a5fa8;
  border-bottom: none;
  box-shadow: inset 0 0 18px rgba(38, 150, 255, 0.18);
}
.eb-download-logo {
  width: 110px;
  height: auto;
  display: block;
  margin: 0 auto 4px;
}
.eb-download-title {
  color: #cfd6df;
  font: bold 12px Verdana, Arial, sans-serif;
  letter-spacing: 1px;
  margin-bottom: 10px;
}
a.eb-download-btn {
  display: block;
  margin: 0 6px 8px;
  padding: 9px 0;
  color: #fff !important;
  text-decoration: none !important;
  font: bold 14px Verdana, Arial, sans-serif;
  letter-spacing: 1px;
  background: linear-gradient(180deg, #46a8ff 0%, #2696ff 45%, #145fb4 100%);
  border: 1px solid #96d2ff;
  border-radius: 3px;
  text-shadow: 0 1px 2px rgba(0, 0, 0, 0.6);
  box-shadow: 0 0 10px rgba(38, 150, 255, 0.45);
}
a.eb-download-btn:hover {
  background: linear-gradient(180deg, #6bbcff 0%, #3ba4ff 45%, #1a6fd0 100%);
}
.eb-download-sub {
  color: #8f9bb0;
  font: 10px Verdana, Arial, sans-serif;
  line-height: 14px;
  margin-bottom: 6px;
}
a.eb-download-link {
  color: #6bbcff !important;
  font: bold 11px Verdana, Arial, sans-serif;
}

/* ===== MENU PO LEWEJ ===== */
#Menu .MenuButton {
  transition: filter .25s ease;
}
#Menu .MenuButton:hover {
  filter: brightness(1.2) drop-shadow(0 0 6px rgba(38, 150, 255, .6));
}
#Menu .Submenu {
  background: linear-gradient(180deg, #0c1c38 0%, #071226 100%) !important;
}
#Menu .Submenuitem {
  transition: background-color .2s ease, box-shadow .2s ease;
}
#Menu .Submenuitem:hover {
  box-shadow: inset 3px 0 0 #2696ff;
}
#Menu .SubmenuitemLabel {
  border-bottom: 1px solid #1d355c;
  transition: padding-left .2s ease, color .2s ease, text-shadow .2s ease;
}
#Menu .Submenuitem:hover .SubmenuitemLabel {
  padding-left: 19px;
}
.Submenu a:link, .Submenu a:visited, .Submenu a:focus {
  color: #c6d6ee;
}
.Submenu a:hover .SubmenuitemLabel {
  color: #fff;
  text-shadow: 0 0 6px rgba(70, 170, 255, .85);
}
/* aktualna podstrona */
#Menu .Submenuitem:has(> .ActiveSubmenuItemIcon[style*="visible"]) {
  background: linear-gradient(90deg, rgba(38, 150, 255, .38), rgba(38, 150, 255, 0)) !important;
  box-shadow: inset 3px 0 0 #46a8ff;
}
#Menu .Submenuitem:has(> .ActiveSubmenuItemIcon[style*="visible"]) .SubmenuitemLabel {
  color: #fff;
}
#Menu .Lights div {
  animation: ebPulse 2.6s ease-in-out infinite;
}
/* czcionka menu: Cinzel (styl napisu ERA z logo) zamiast obrazkow z napisami Tibii */
#Menu .Label {
  background-image: none !important;
  display: flex;
  align-items: center;
  font-family: 'Cinzel', 'Times New Roman', serif;
  font-weight: 800;
  font-size: 15px;
  letter-spacing: 1.5px;
  color: #dfe8f5;
  text-shadow: 0 0 6px rgba(38, 150, 255, .7), 0 1px 1px #000;
  transition: color .2s ease, text-shadow .2s ease;
}
#Menu .MenuButton:hover .Label {
  color: #fff;
  text-shadow: 0 0 10px rgba(70, 170, 255, 1), 0 1px 1px #000;
}
#news_Label::after { content: "News"; }
#account_Label::after { content: "Account"; }
#community_Label::after { content: "Community"; }
#forum_Label::after { content: "Forum"; }
#library_Label::after { content: "Library"; }
#shops_Label::after { content: "Shop"; }
#Menu .SubmenuitemLabel {
  font-family: 'Cinzel', 'Times New Roman', serif;
  font-weight: 700;
  font-size: 12px;
  letter-spacing: .4px;
}
#Loginbox, #Menu {
  filter: drop-shadow(0 0 8px rgba(38, 150, 255, .22));
}

/* ===== ZYWA STRONA ===== */
#ArtworkHelper {
  position: relative;
}
#eb-particles {
  position: fixed;
  inset: 0;
  width: 100%;
  height: 100%;
  pointer-events: none;
  z-index: 1;
}
#eb-logo-glow {
  position: absolute;
  top: -40px;
  left: 50%;
  width: 560px;
  height: 320px;
  margin-left: -280px;
  pointer-events: none;
  z-index: 1;
  background: radial-gradient(ellipse at center, rgba(60, 160, 255, .42) 0%, rgba(38, 120, 255, .16) 38%, rgba(0, 0, 0, 0) 70%);
  mix-blend-mode: screen;
  animation: ebBreathe 4.5s ease-in-out infinite;
}
#ContentRow {
  z-index: 2;
}
#ContentColumn .Box, #Themeboxes > div, #Loginbox, #Menu {
  animation: ebRise .7s ease both;
}
#ContentColumn .Box:nth-of-type(2) { animation-delay: .12s; }
#ContentColumn .Box:nth-of-type(3) { animation-delay: .24s; }
#Themeboxes > div:nth-child(2) { animation-delay: .15s; }
#Menu { animation-delay: .1s; }

/* polysk na przycisku POBIERZ GRE */
a.eb-download-btn {
  position: relative;
  overflow: hidden;
}
a.eb-download-btn::after {
  content: "";
  position: absolute;
  top: 0;
  left: -60%;
  width: 40%;
  height: 100%;
  background: linear-gradient(100deg, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, .55) 50%, rgba(255, 255, 255, 0) 100%);
  transform: skewX(-20deg);
  animation: ebShine 3.8s ease-in-out infinite;
}

/* licznik graczy online */
#PlayersOnline #players {
  animation: ebOnline 2.2s ease-in-out infinite;
}

/* linki i nagłówki newsów */
#ContentColumn a {
  transition: color .2s ease, text-shadow .2s ease;
}
#ContentColumn a:hover {
  text-shadow: 0 0 6px rgba(70, 170, 255, .5);
}

/* ===== SWIECENIE ===== */
/* poswiata wokol bokow z trescia */
#ContentColumn .Box {
  animation: ebRise .7s ease both, ebBoxGlow 5s ease-in-out .7s infinite;
}
/* blysk przesuwajacy sie po paskach tytulowych bokow */
.Content .BorderTitleText {
  overflow: hidden;
}
.Content .BorderTitleText::after {
  content: "";
  position: absolute;
  top: 0;
  left: -30%;
  width: 22%;
  height: 100%;
  background: linear-gradient(100deg, rgba(160, 215, 255, 0) 0%, rgba(160, 215, 255, .5) 50%, rgba(160, 215, 255, 0) 100%);
  transform: skewX(-20deg);
  animation: ebSweep 6s ease-in-out infinite;
}
/* swiecace tytuly newsow */
.NewsHeadlineText {
  text-shadow: 0 0 8px rgba(70, 170, 255, .9), 0 0 2px rgba(255, 255, 255, .6);
}
/* plynaca swiecaca ramka wokol boksu POBIERZ GRE */
.eb-download-inner {
  border: 2px solid transparent;
  border-bottom: none;
  background:
    linear-gradient(180deg, #0b1630 0%, #060b18 100%) padding-box,
    linear-gradient(90deg, #145fb4, #2696ff, #d8eeff, #2696ff, #145fb4, #2696ff, #d8eeff, #2696ff, #145fb4) border-box;
  background-size: 100% 100%, 200% 100%;
  animation: ebFlow 5s linear infinite, ebDlGlow 3.5s ease-in-out infinite;
}
.eb-download-logo {
  animation: ebLogoGlow 3.5s ease-in-out infinite;
}

@keyframes ebBoxGlow { 0%, 100% { box-shadow: 0 0 10px rgba(38, 150, 255, .18); } 50% { box-shadow: 0 0 22px rgba(70, 170, 255, .45); } }
@keyframes ebSweep { 0% { left: -30%; } 45%, 100% { left: 130%; } }
@keyframes ebFlow { from { background-position: 0 0, 0 0; } to { background-position: 0 0, -200% 0; } }
@keyframes ebDlGlow { 0%, 100% { box-shadow: inset 0 0 18px rgba(38, 150, 255, .18), 0 0 8px rgba(38, 150, 255, .35); } 50% { box-shadow: inset 0 0 22px rgba(38, 150, 255, .3), 0 0 20px rgba(110, 195, 255, .75); } }
@keyframes ebLogoGlow { 0%, 100% { filter: drop-shadow(0 0 3px rgba(70, 170, 255, .5)); } 50% { filter: drop-shadow(0 0 12px rgba(120, 200, 255, 1)); } }
@keyframes ebPulse { 0%, 100% { opacity: 1; } 50% { opacity: .35; } }
@keyframes ebBreathe { 0%, 100% { opacity: .55; transform: scale(1); } 50% { opacity: 1; transform: scale(1.06); } }
@keyframes ebRise { from { opacity: 0; transform: translateY(14px); } to { opacity: 1; transform: none; } }
@keyframes ebShine { 0% { left: -60%; } 55%, 100% { left: 130%; } }
@keyframes ebOnline { 0%, 100% { color: inherit; text-shadow: none; } 50% { color: #bfe3ff; text-shadow: 0 0 8px rgba(70, 170, 255, .9); } }

@media (prefers-reduced-motion: reduce) {
  #eb-particles { display: none; }
  #eb-logo-glow, #Menu .Lights div, a.eb-download-btn::after, #PlayersOnline #players,
  .Content .BorderTitleText::after, .eb-download-inner, .eb-download-logo,
  #ContentColumn .Box, #Themeboxes > div, #Loginbox, #Menu { animation: none !important; }
}
