/**
 * Default Template Theme CSS
 * Professional dark gaming theme with cyan/blue accents
 * Modern tech aesthetic with 3-column layout
 * Based on test template structure
 */

/* === RESET & BASE === */
* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

body, div, dl, dt, dd, ul, ol, li, h1, h2, h3, h4, h5, h6, pre, form, fieldset, input, textarea, p, blockquote, th, td {
    margin: 0;
    padding: 0;
    outline: none;
}

/* === BODY & BACKGROUND === */
html {
    overflow-x: hidden !important;
}

body {
    width: 100% !important;
    background-color: #0a0603 !important;
    color: #d9c48f !important;
    font-family: 'Open Sans', 'Segoe UI', Arial, Tahoma, sans-serif !important;
    overflow-x: hidden !important;
    overflow-y: scroll !important;
    font-size: 12px !important;
    line-height: 1.4 !important;
    margin: 0 !important;
    padding: 0 !important;
}

/* === TYPOGRAPHY === */
h1, h2, h3, h4, h5, h6 {
    color: #c9a15c !important;
    font-weight: 600 !important;
    text-shadow: 0 0 10px rgba(201, 161, 92, 0.3) !important;
    line-height: 1.5 !important;
    margin-bottom: 15px !important;
}

h1 { font-size: 24px !important; }
h2 { font-size: 22px !important; }
h3 { font-size: 18px !important; }
h4 { font-size: 16px !important; }
h5 { font-size: 14px !important; }
h6 { font-size: 12px !important; }

p {
    margin-bottom: 7px !important;
    line-height: 1.6 !important;
}

/* === LINKS === */
a {
    color: #4a2f15 !important;
    text-decoration: none !important;
    transition: all 0.3s ease !important;
}

a:hover {
    color: #c9a15c !important;
    text-shadow: 0 0 8px rgba(201, 161, 92, 0.5) !important;
}

/* === LAYOUT STRUCTURE === */
.wrapper {
    width: 1400px !important;
    margin: 0 auto !important;
    position: relative !important;
    min-width: 1400px !important;
    padding: 0 !important;
    overflow: visible !important;
    display: flow-root !important;
}

.flex-center {
    display: flex !important;
    justify-content: space-between !important;
    align-items: center !important;
}

.clear {
    clear: both !important;
    font-size: 0px !important;
    line-height: 0px !important;
    display: block !important;
}

/* === TOP PANEL - NAVIGATION === */
.top-panel {
    height: auto !important;
    background: transparent !important;
    width: 100% !important;
    position: absolute !important;
    top: 300px !important;
    left: 0 !important;
    right: 0 !important;
    z-index: 10 !important;
    padding: 10px 0 0 0 !important;
}

/* Elegancki zloty divider PONIZEJ menu — linia z gradientem */
.top-panel::after {
    content: "" !important;
    display: block !important;
    width: 100% !important;
    max-width: 1300px !important;
    margin: 22px auto 0 auto !important;
    height: 1px !important;
    background: linear-gradient(90deg,
        transparent 0%,
        rgba(138, 106, 42, 0.5) 15%,
        rgba(201, 161, 92, 0.9) 50%,
        rgba(138, 106, 42, 0.5) 85%,
        transparent 100%) !important;
    box-shadow: 0 0 8px rgba(201, 161, 92, 0.3) !important;
}

/* Maly sapphire diament w srodku linii (pod menu) */
.top-panel::before {
    content: "" !important;
    position: absolute !important;
    bottom: -3.5px !important;
    left: 50% !important;
    width: 7px !important;
    height: 7px !important;
    margin-left: -3.5px !important;
    background: linear-gradient(135deg, #85c0d8, #4a98c9) !important;
    transform: rotate(45deg) !important;
    box-shadow: 0 0 8px rgba(74, 152, 201, 0.6), inset 0 0 2px rgba(15, 10, 5, 0.4) !important;
    border: 1px solid rgba(133, 192, 216, 0.8) !important;
    z-index: 2 !important;
}

.top-panel .top-panel-container {
    width: 1400px !important;
    margin: 0 auto !important;
    display: flex !important;
    justify-content: center !important;
    align-items: center !important;
}

.menu {
    list-style: none !important;
    margin: 0 !important;
    padding: 0 !important;
    display: flex !important;
    gap: 32px !important;
    justify-content: center !important;
}

.menu li {
    display: inline-block !important;
    margin: 0 !important;
    padding: 0 !important;
    background: none !important;
}

.menu li a {
    display: block !important;
    text-transform: uppercase !important;
    padding: 12px 20px !important;
    font-weight: 600 !important;
    letter-spacing: 1px !important;
    font-size: 13px !important;
    border-radius: 6px !important;
    position: relative !important;
    overflow: hidden !important;
    transition: all 0.4s ease !important;
    width: 145px !important;
    text-align: center !important;
    box-sizing: border-box !important;

    /* Gradient złoto/niebieski/czarny */
    background: linear-gradient(135deg, #1a120a 0%, #0a0603 50%, #1a120a 100%) !important;
    border: 2px solid transparent !important;
    background-clip: padding-box !important;
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.4), inset 0 1px 0 rgba(255, 255, 255, 0.1) !important;

    /* Tekst sapphire */
    color: #4a98c9 !important;
    text-shadow: 0 0 10px rgba(74, 152, 201, 0.5), 0 2px 4px rgba(0, 0, 0, 0.8) !important;
}

.menu li a:before {
    content: "" !important;
    position: absolute !important;
    top: 0 !important;
    left: -100% !important;
    width: 100% !important;
    height: 100% !important;
    background: linear-gradient(90deg, transparent, rgba(212, 175, 55, 0.3), transparent) !important;
    transition: left 0.5s ease !important;
}

.menu li a:hover:before {
    left: 100% !important;
}

.menu li a:hover {
    background: linear-gradient(135deg, #2a1e10 0%, #1f140a 50%, #2a1e10 100%) !important;
    border: 2px solid rgba(138, 106, 42, 0.4) !important;
    color: #85c0d8 !important;
    text-shadow: 0 0 15px rgba(74, 152, 201, 0.6), 0 2px 4px rgba(0, 0, 0, 0.8) !important;
    box-shadow: 0 6px 25px rgba(138, 106, 42, 0.3), inset 0 1px 0 rgba(255, 255, 255, 0.2) !important;
}

.menu li a:active {
    box-shadow: 0 2px 10px rgba(212, 175, 55, 0.3), inset 0 1px 0 rgba(255, 255, 255, 0.1) !important;
}

/* === HEADER === */
.header {
    /* Wysokosc proporcjonalna do aspektu obrazu (1424:533), nie wiecej niz 340 px.
       auto 100% = tlo zachowuje proporcje (bez zniekszcen i bez kropowania gora/dol),
       boki headera sa transparentne, body (#0a0603) zlewa sie z baza grafiki. */
    /* Tlo w 100% naturalnych wymiarow (1424x533) — uzytkownik dostosuje w obrazie */
    height: 533px !important;
    position: absolute !important;
    top: 0 !important;
    left: calc(50% - 50vw) !important;
    right: auto !important;
    width: 100vw !important;
    background: url(../../images/logobg.png) center top no-repeat !important;
    background-size: auto !important;
    background-color: transparent !important;
    z-index: 5 !important;
    display: flex !important;
    justify-content: center !important;
    align-items: flex-start !important;
    padding-top: 10px !important;
    box-sizing: border-box !important;
}

.site-logo {
    display: block !important;
    max-width: 538px !important;
    max-height: 280px !important;
    height: auto !important;
    width: auto !important;
    filter: drop-shadow(0 0 20px rgba(201, 161, 92, 0.35)) !important;
}

.logo {
    width: 100% !important;
    text-align: center !important;
    top: 110px !important;
    position: absolute !important;
    filter: drop-shadow(0 0 20px rgba(201, 161, 92, 0.5)) !important;
}

.logo img {
    max-width: 600px !important;
    filter: drop-shadow(0 0 15px rgba(201, 161, 92, 0.4)) !important;
}

/* === SERVER TIME - ABSOLUTE POSITION === */
html #timer_div_title,
body > #timer_div_title,
#timer_div_title {
    position: absolute !important;
    height: auto !important;
    width: auto !important;
    top: 20px !important;
    right: 430px !important;
    left: auto !important;
    bottom: auto !important;
    z-index: 999 !important;
    color: #8a6a2a !important;
    font-size: 11px !important;
    text-align: center !important;
    font-weight: 600 !important;
    pointer-events: none !important;
    font-family: 'Open Sans', sans-serif !important;
    text-shadow: 0 1px 2px rgba(0, 0, 0, 0.5) !important;
    background: rgba(26, 18, 10, 0.9) !important;
    padding: 8px 16px !important;
    border-radius: 20px !important;
    border: 1px solid rgba(138, 106, 42, 0.3) !important;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.3) !important;
    margin: 0 !important;
}

#server-time-display {
    color: #c9a15c !important;
    font-size: 10px !important;
    font-weight: 600 !important;
    display: block !important;
    margin-top: 3px !important;
}

/* === CONTAINER - 3 COLUMN LAYOUT === */
.container {
    min-height: 1050px !important;
    display: flex !important;
    position: relative !important;
    gap: 20px !important;
    justify-content: space-between !important;
    margin-top: 400px !important;
    padding: 0 !important;
    z-index: 50 !important;
}

/* stare ozdobne ikonki w rogach i na srodku — ukryte */
.container:before,
.container:after,
main.content:before,
main.content:after {
    content: none !important;
    display: none !important;
    background: none !important;
}

/* Sidebary — bez clipowania zeby box-shadow poszczegolnych p-blockow byl widoczny */
aside.left-sidebar,
aside.right-sidebar {
    overflow: visible !important;
}

.left-sidebar .p-block,
.right-sidebar .p-block,
.left-sidebar .download-block {
    border-radius: 8px !important;
    overflow: visible !important;
}

.container:before {
    content: "" !important;
    background: url(images/left-container-icon.png) no-repeat !important;
    left: -35px !important;
    top: -34px !important;
    width: 74px !important;
    height: 73px !important;
    position: absolute !important;
    z-index: 1 !important;
}

.container:after {
    content: "" !important;
    background: url(images/right-container-icon.png) no-repeat !important;
    right: -35px !important;
    top: -34px !important;
    width: 74px !important;
    height: 73px !important;
    position: absolute !important;
}

/* === LEFT SIDEBAR === */
aside.left-sidebar {
    width: 285px !important;
    background: transparent !important;
    margin-bottom: 50px !important;
    position: relative !important;
    flex-shrink: 0 !important;
}

/* usuniecie starej ikonki dekoracyjnej w rogu */
aside.left-sidebar:after {
    content: none !important;
    display: none !important;
    background: none !important;
}

.download-block {
    background: linear-gradient(135deg, rgba(201, 161, 92, 0.3) 0%, rgba(138, 106, 42, 0.2) 100%) !important;
    height: 90px !important;
    box-shadow: 0px 5px 20px -2px rgba(201, 161, 92, 0.3) !important;
    border: 1px solid rgba(201, 161, 92, 0.3) !important;
    display: flex !important;
    align-items: center !important;
}

.download-block a {
    display: block !important;
    position: relative !important;
    z-index: 3 !important;
    font-size: 11px !important;
    color: #4a2f15 !important;
    line-height: 1.5 !important;
    padding: 23px 0px 23px 90px !important;
    width: 100% !important;
}

.download-block a span {
    display: block !important;
    color: #c9a15c !important;
    font-size: 18px !important;
    text-transform: uppercase !important;
    font-weight: 700 !important;
    text-shadow: 0 0 8px rgba(201, 161, 92, 0.5) !important;
}

.p-block {
    padding: 10px !important;
    overflow: visible !important;
    background: linear-gradient(135deg, rgba(15, 10, 5, 0.95), rgba(12, 8, 4, 0.95)) !important;
    border: 1px solid rgba(138, 106, 42, 0.3) !important;
    border-radius: 8px !important;
    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.3) !important;
    margin-bottom: 20px !important;
}

.p-block:last-child {
    margin-bottom: 0 !important;
}

.events-block {
    overflow: visible !important;
}

.login-block {
    background: linear-gradient(135deg, rgba(15, 10, 5, 0.95) 0%, rgba(5, 3, 2, 0.95) 100%) !important;
    border: 1px solid rgba(201, 161, 92, 0.3) !important;
    border-radius: 8px !important;
    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.3), 0 0 10px rgba(201, 161, 92, 0.15) !important;
    margin-bottom: 20px !important;
}

.login-block .login-block-title {
    margin-bottom: 20px !important;
}

.login-block .login-block-title span {
    font-size: 14px !important;
    text-transform: uppercase !important;
    font-weight: bold !important;
    color: #c9a15c !important;
    text-shadow: 0 0 8px rgba(201, 161, 92, 0.5) !important;
}

.login-block .login-block-title a {
    color: #4a2f15 !important;
    font-size: 12px !important;
}

/* User Menu Styles */
.user-menu {
    position: relative !important;
    z-index: 10 !important;
}

.user-menu ul {
    list-style: none !important;
    padding: 0 !important;
    margin: 0 !important;
}

.user-menu ul li {
    display: block !important;
    margin: 0 !important;
    padding: 0 !important;
}

.user-menu ul li a {
    display: block !important;
    padding: 10px 12px !important;
    color: #d9c48f !important;
    text-decoration: none !important;
    border-bottom: 1px solid rgba(201, 161, 92, 0.15) !important;
    transition: all 0.3s ease !important;
    position: relative !important;
    z-index: 10 !important;
}

.user-menu ul li a:hover {
    background: rgba(201, 161, 92, 0.1) !important;
    color: #c9a15c !important;
    padding-left: 18px !important;
}

.user-menu ul li:last-child a {
    border-bottom: none !important;
}

.login-block input[type="text"],
.login-block input[type="password"] {
    background: rgba(18, 12, 6, 0.8) !important;
    border: 1px solid rgba(201, 161, 92, 0.3) !important;
    color: #d9c48f !important;
    background-repeat: no-repeat !important;
    background-position: 10px center !important;
    height: 36px !important;
    padding: 0px 10px 0px 45px !important;
    width: 100% !important;
    border-radius: 4px !important;
    margin-bottom: 10px !important;
    transition: all 0.3s ease !important;
}

.login-block input:focus {
    border-color: #c9a15c !important;
    box-shadow: 0 0 10px rgba(201, 161, 92, 0.3) !important;
    outline: none !important;
}

.login-in input {
    background-image: url(images/login-icon.png) !important;
}

.password-in input {
    background-image: url(images/password-icon.png) !important;
}

.login-block .checkbox-block {
    margin-bottom: 15px !important;
    display: flex !important;
    align-items: center !important;
}

.login-block .login-button {
    margin-bottom: 10px !important;
    text-align: center !important;
}

.login-block .login-button button,
.green-button {
    background: linear-gradient(135deg, #c9a15c 0%, #4a2f15 100%) !important;
    color: #ffffff !important;
    border: 1px solid #8a6a2a !important;
    font-weight: 600 !important;
    text-transform: uppercase !important;
    letter-spacing: 0.5px !important;
    padding: 10px 30px !important;
    cursor: pointer !important;
    transition: all 0.3s ease !important;
    border-radius: 4px !important;
    width: 100% !important;
    display: block !important;
    box-shadow: 0 3px 8px rgba(138, 106, 42, 0.3) !important;
}

.login-block .login-button button:hover,
.green-button:hover {
    background: linear-gradient(135deg, #4a2f15 0%, #c9a15c 100%) !important;
    box-shadow: 0 5px 15px rgba(201, 161, 92, 0.5) !important;
    border-color: #c9a15c !important;
}

/* Checkbox styling */
.checkbox {
    display: none !important;
}

.checkbox-custom {
    position: relative !important;
    width: 16px !important;
    height: 16px !important;
    border: 1px solid rgba(201, 161, 92, 0.5) !important;
    border-radius: 3px !important;
    background: rgba(18, 12, 6, 0.8) !important;
    display: inline-block !important;
}

.label {
    margin-left: 9px !important;
    margin-bottom: -2px !important;
    color: #d9c48f !important;
    font-size: 11px !important;
}

.checkbox:checked + .checkbox-custom::before {
    content: "" !important;
    display: block !important;
    position: absolute !important;
    width: 16px !important;
    height: 16px !important;
    top: 0px !important;
    left: 0px !important;
    background: url(images/check.png) center no-repeat !important;
}

/* === SIDEBAR TITLE — matcha home-panel-title === */
.sidebar-title {
    color: transparent !important; /* ukrywa subtitle text */
    font-size: 0 !important;
    line-height: 0 !important;
    padding-bottom: 6px !important;
    margin-bottom: 8px !important;
    border-bottom: 1px solid rgba(138, 106, 42, 0.3) !important;
    font-family: 'Open Sans', 'Segoe UI', Arial, Tahoma, sans-serif !important;
    position: relative !important;
    z-index: 1 !important;
    pointer-events: none !important;
}

.sidebar-title a,
.sidebar-title span {
    pointer-events: auto !important;
}

/* Fix for clickable links in dashboard grid */
.p-block > div[style*="padding"] {
    position: relative !important;
    z-index: 5 !important;
}

.p-block > div[style*="padding"] a {
    position: relative !important;
    z-index: 10 !important;
    pointer-events: auto !important;
}

.sidebar-title span {
    display: block !important;
    font-size: 12px !important;
    color: #4a98c9 !important;
    font-weight: 600 !important;
    text-transform: uppercase !important;
    letter-spacing: 0.5px !important;
    line-height: 1.4 !important;
    text-shadow: none !important;
    font-family: 'Open Sans', 'Segoe UI', Arial, Tahoma, sans-serif !important;
}

.sidebar-title span i {
    color: #c9a15c !important;
    margin-right: 4px !important;
}

.sidebar-title .title-t {
    flex: 1 !important;
}

.sidebar-title .title-t span {
    font-size: 12px !important;
    line-height: 1.4 !important;
}

/* stare ozdobne badge przy tytule — ukryte */
.sidebar-title .top-title-img,
.sidebar-title .forum-img {
    display: none !important;
}

.sidebar-title.sidebar-forum-title .forum-img {
    background: url(images/forum-title-bg.png) no-repeat !important;
}

/* === TOP PLAYERS BLOCK === */
.top-players-block {
    background: linear-gradient(135deg, rgba(15, 10, 5, 0.9) 0%, rgba(5, 3, 2, 0.9) 100%) !important;
    border: 1px solid rgba(201, 161, 92, 0.25) !important;
    border-radius: 8px !important;
    box-shadow: inset 0 0 20px rgba(0, 0, 0, 0.5), 0 0 10px rgba(201, 161, 92, 0.2) !important;
    margin-bottom: 20px !important;
}

.players {
    color: #d9c48f !important;
}

.players-block {
    padding: 10px 15px !important;
}

.players-block ul {
    list-style: none !important;
    margin: 0 !important;
    padding: 0 !important;
}

.players-block ul li {
    display: block !important;
    padding: 8px 0 !important;
    border-bottom: 1px dashed rgba(201, 161, 92, 0.2) !important;
    color: #d9c48f !important;
}

.players-block ul li:last-child {
    border-bottom: none !important;
}

.players-block ul li a {
    color: #c9a15c !important;
    font-weight: bold !important;
}

.players-block ul li img {
    margin-right: 5px !important;
    vertical-align: middle !important;
}

/* Tables in sidebar */
.players-block table {
    width: 100% !important;
    border-collapse: collapse !important;
}

.players-block table.tables {
    font-size: 11px !important;
}

.players-block table thead tr.tables_top {
    background: linear-gradient(135deg, rgba(201, 161, 92, 0.2) 0%, rgba(138, 106, 42, 0.1) 100%) !important;
}

.players-block table th,
.players-block table td {
    text-align: center !important;
    padding: 6px 4px !important;
    color: #d9c48f !important;
}

.players-block table th {
    color: #c9a15c !important;
    font-weight: bold !important;
    border-bottom: 1px solid rgba(201, 161, 92, 0.3) !important;
}

.players-block table tbody tr.tables_bottom {
    border-bottom: 1px dashed rgba(201, 161, 92, 0.1) !important;
}

.players-block table tbody tr:hover {
    background: rgba(201, 161, 92, 0.1) !important;
}

/* === CONTENT - MIDDLE COLUMN === */
main.content {
    width: 790px !important;
    padding: 30px 20px 40px 20px !important;
    position: relative !important;
    background: linear-gradient(135deg, rgba(15, 10, 5, 0.95) 0%, rgba(5, 3, 2, 0.95) 100%) !important;
    border: 1px solid rgba(201, 161, 92, 0.3) !important;
    border-radius: 8px !important;
    line-height: 1.6 !important;
    flex-shrink: 0 !important;
    margin-bottom: 110px !important;
}

main.content:before {
    content: "" !important;
    background: url(images/top-content-icon.png) no-repeat !important;
    left: 50% !important;
    margin-left: -70px !important;
    top: -41px !important;
    width: 143px !important;
    height: 74px !important;
    position: absolute !important;
    z-index: 11 !important;
}

main.content:after {
    content: "" !important;
    background: url(images/bottom-content-icon.png) no-repeat !important;
    left: -30px !important;
    bottom: -12px !important;
    width: 890px !important;
    height: 40px !important;
    position: absolute !important;
}

main.content img {
    max-width: 100% !important;
    height: auto !important;
}

/* === SLIDER === */
.slider {
    overflow: hidden !important;
    position: relative !important;
    width: 630px !important;
    height: 214px !important;
    margin: -30px -20px 20px -20px !important;
    z-index: 10 !important;
    border: 2px solid rgba(201, 161, 92, 0.3) !important;
    box-shadow: 0 0 20px rgba(201, 161, 92, 0.2) !important;
}

.slider .slides {
    position: relative !important;
    transition: 1s !important;
    display: flex !important;
}

.slider .slides .active .slider-text {
    transition: all 2s ease !important;
    bottom: 20px !important;
}

.slider .slides .slide {
    float: left !important;
    display: block !important;
    position: relative !important;
    min-width: 630px !important;
}

.slider .slides .slide:after {
    content: "" !important;
    position: absolute !important;
    height: 100% !important;
    width: 100% !important;
    left: 0 !important;
    top: 0 !important;
    box-shadow: inset 0px 0px 40px 20px rgba(0, 0, 0, 0.6) !important;
}

.slider .slides .slide .slider-text {
    position: absolute !important;
    bottom: -200px !important;
    left: 0px !important;
    padding: 15px 30px !important;
    width: calc(100% - 60px) !important;
    color: #e0f0ff !important;
    line-height: 1.4 !important;
    text-shadow: 2px 2px 10px rgba(0, 0, 0, 0.8) !important;
    text-align: center !important;
    z-index: 4 !important;
    background: rgba(0, 0, 0, 0.5) !important;
}

.slider .slides .slide h1 {
    margin-bottom: 5px !important;
    color: #c9a15c !important;
    font-size: 36px !important;
    text-shadow: 0 0 20px rgba(201, 161, 92, 0.8) !important;
}

.slider .slides .slide p {
    color: #e0f0ff !important;
    font-size: 14px !important;
    margin: 0 !important;
}

.slider .slides .slide img {
    width: 630px !important;
    max-width: 630px !important;
    height: 214px !important;
    display: block !important;
}

.slider .next {
    position: absolute !important;
    background: url(images/arrow-right.png) no-repeat !important;
    height: 30px !important;
    width: 30px !important;
    right: 20px !important;
    top: 95px !important;
    z-index: 12 !important;
    cursor: pointer !important;
    opacity: 0 !important;
    transition: all 0.7s ease !important;
}

.slider .prev {
    position: absolute !important;
    background: url(images/arrow-left.png) no-repeat !important;
    height: 30px !important;
    width: 30px !important;
    left: 20px !important;
    top: 95px !important;
    z-index: 12 !important;
    cursor: pointer !important;
    opacity: 0 !important;
    transition: all 0.7s ease !important;
}

.slider:hover .next,
.slider:hover .prev {
    opacity: 1 !important;
}

.slider .navigation {
    position: absolute !important;
    left: 50% !important;
    bottom: 15px !important;
    transform: translateX(-50%) !important;
    z-index: 12 !important;
    display: flex !important;
    gap: 8px !important;
}

.slider .navigation .dot {
    display: inline-block !important;
    width: 12px !important;
    height: 12px !important;
    background: rgba(255, 255, 255, 0.3) !important;
    border: 1px solid rgba(201, 161, 92, 0.5) !important;
    cursor: pointer !important;
    border-radius: 50% !important;
    transition: all 0.3s ease !important;
}

.slider .navigation .dot.active {
    background: rgba(201, 161, 92, 0.8) !important;
    box-shadow: 0 0 10px rgba(201, 161, 92, 0.6) !important;
}

/* === TABS === */
.tabs {
    padding: 20px !important;
    box-shadow: 0px 25px 30px -5px rgba(0, 0, 0, 0.2) !important;
    background: linear-gradient(135deg, rgba(15, 10, 5, 0.8) 0%, rgba(5, 3, 2, 0.8) 100%) !important;
    margin: 0px -20px 20px -20px !important;
    border-top: 1px solid rgba(201, 161, 92, 0.3) !important;
    min-height: 400px !important;
}

/* === CAROUSEL === */
.carousel {
    position: relative !important;
    width: 590px !important;
    padding: 0px 40px !important;
    margin: 0 auto !important;
}

.carousel .gallery {
    overflow: hidden !important;
    width: 510px !important;
}

.carousel .gallery .images {
    display: flex !important;
    transition: transform 0.5s ease !important;
    list-style: none !important;
    margin: 0 !important;
    padding: 0 !important;
}

.carousel .gallery .images li {
    min-width: 170px !important;
    margin-right: 0px !important;
    padding: 15px !important;
    background: linear-gradient(135deg, rgba(15, 10, 5, 0.9) 0%, rgba(5, 3, 2, 0.9) 100%) !important;
    border: 1px solid rgba(201, 161, 92, 0.2) !important;
    border-radius: 8px !important;
    text-align: center !important;
}

.shop-img {
    text-align: center !important;
    padding: 10px 0 !important;
}

.shop-img img {
    max-width: 64px !important;
    max-height: 64px !important;
    filter: drop-shadow(0 0 10px rgba(201, 161, 92, 0.3)) !important;
}

.shop-title {
    color: #c9a15c !important;
    font-size: 12px !important;
    margin: 10px 0 5px 0 !important;
    text-transform: uppercase !important;
    font-weight: bold !important;
}

.shop-price {
    color: #d9c48f !important;
    font-size: 14px !important;
    font-weight: bold !important;
    margin: 5px 0 !important;
}

.shop-button {
    margin-top: 10px !important;
}

.arrow {
    position: absolute !important;
    top: 50% !important;
    transform: translateY(-50%) !important;
    padding: 0 !important;
    height: 30px !important;
    width: 30px !important;
    display: block !important;
    cursor: pointer !important;
    opacity: 0.7 !important;
    transition: opacity 0.3s ease !important;
}

.arrow:hover {
    opacity: 1 !important;
}

.arrow.prev {
    left: 0px !important;
    background: url(images/nav-left.png) no-repeat !important;
}

.arrow.next {
    right: 0px !important;
    background: url(images/nav-right.png) no-repeat !important;
}

/* === RIGHT SIDEBAR === */
aside.right-sidebar {
    width: 285px !important;
    background: transparent !important;
    margin-bottom: 50px !important;
    position: relative !important;
    flex-shrink: 0 !important;
}

aside.right-sidebar:after {
    content: none !important;
    display: none !important;
    background: none !important;
}

/* === SERVER BLOCK === */
.server-block {
    background: linear-gradient(135deg, rgba(15, 10, 5, 0.9) 0%, rgba(5, 3, 2, 0.9) 100%) !important;
    border: 1px solid rgba(201, 161, 92, 0.25) !important;
    border-radius: 8px !important;
    box-shadow: inset 0 0 20px rgba(0, 0, 0, 0.5), 0 0 10px rgba(201, 161, 92, 0.2) !important;
    margin-bottom: 20px !important;
}

.servers {
    padding: 20px !important;
}

.server {
    margin-bottom: 15px !important;
    text-align: center !important;
}

.server .server-x {
    font-size: 24px !important;
    font-weight: bold !important;
    margin-bottom: 10px !important;
}

.server.online .server-x {
    color: #22c55e !important;
    text-shadow: 0 0 15px rgba(34, 197, 94, 0.6) !important;
}

.server.off .server-x {
    color: #ef4444 !important;
    text-shadow: 0 0 15px rgba(239, 68, 68, 0.6) !important;
}

.server-info {
    margin-top: 15px !important;
}

.server-name {
    color: #d9c48f !important;
    font-size: 12px !important;
    line-height: 1.8 !important;
}

.server-name span {
    display: block !important;
}

.server-name b {
    color: #c9a15c !important;
    font-weight: bold !important;
}

.server-description {
    margin-top: 10px !important;
}

.server-description a {
    color: #4a2f15 !important;
    text-decoration: underline !important;
}

.server-description a:hover {
    color: #c9a15c !important;
}

/* === FORUM BLOCK === */
.forum-block.fast-links-block {
    background: linear-gradient(135deg, rgba(15, 10, 5, 0.9) 0%, rgba(5, 3, 2, 0.9) 100%) !important;
    border: 1px solid rgba(201, 161, 92, 0.25) !important;
    border-radius: 8px !important;
    box-shadow: inset 0 0 20px rgba(0, 0, 0, 0.5), 0 0 10px rgba(201, 161, 92, 0.2) !important;
    margin-bottom: 20px !important;
}

#lattest_items {
    padding: 10px 15px !important;
}

.rsss {
    margin-bottom: 10px !important;
    padding-bottom: 10px !important;
    border-bottom: 1px dashed rgba(201, 161, 92, 0.2) !important;
}

.rsss:last-child {
    border-bottom: none !important;
}

.theme {
    display: flex !important;
    align-items: flex-start !important;
}

.theme_icon {
    margin-right: 10px !important;
}

.theme_icon img {
    width: 20px !important;
    height: 20px !important;
}

.theme_title {
    flex: 1 !important;
}

.theme_title a {
    color: #4a2f15 !important;
    font-size: 11px !important;
    line-height: 1.4 !important;
}

.theme_title a:hover {
    color: #c9a15c !important;
}

/* === FOOTER === */
footer.footer {
    background: linear-gradient(180deg, rgba(5, 3, 2, 0.8) 0%, rgba(15, 10, 5, 0.95) 100%) !important;
    border-top: 2px solid rgba(201, 161, 92, 0.3) !important;
    padding: 15px 0 10px 0 !important;
    clear: both !important;
    height: auto !important;
    overflow: visible !important;
    border-radius: 0 0 12px 12px !important;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.5) !important;
}

/* Bottom nav w jednej bryle z footerem — gorne rogi zaokraglone */
nav.bottom-nav {
    border-radius: 12px 12px 0 0 !important;
}

.footer-info {
    text-align: center !important;
    max-width: 1400px !important;
    margin: 0 auto !important;
}

.copyright {
    color: #d9c48f !important;
    font-size: 11px !important;
    line-height: 1.8 !important;
    margin-bottom: 7px !important;
}

.f-menu {
    margin-top: 15px !important;
}

.f-menu ul {
    list-style: none !important;
    padding: 0 !important;
    margin: 0 !important;
}

.f-menu li {
    display: inline-block !important;
    margin: 0 10px !important;
}

.f-menu a {
    color: #4a2f15 !important;
    font-size: 11px !important;
}

.f-menu a:hover {
    color: #c9a15c !important;
    text-shadow: 0 0 8px rgba(201, 161, 92, 0.5) !important;
}

/* === BUTTONS === */
button,
button[type="submit"],
.button,
.btn-primary,
.bg-gradient-to-r {
    transition: all 0.3s ease !important;
    cursor: pointer !important;
    background: linear-gradient(135deg, #c9a15c 0%, #4a2f15 100%) !important;
    border: 1px solid #c9a15c !important;
    color: #0f0a05 !important;
    text-transform: uppercase !important;
    position: relative !important;
    z-index: 1 !important;
    padding: 10px 20px !important;
    display: inline-block !important;
    font-weight: 600 !important;
    letter-spacing: 0.5px !important;
    border-radius: 4px !important;
    text-shadow: none !important;
}

button:hover,
button[type="submit"]:hover,
.button:hover,
.btn-primary:hover,
.bg-gradient-to-r:hover {
    background: linear-gradient(135deg, #4a2f15 0%, #0099cc 100%) !important;
    box-shadow: 0 0 20px rgba(201, 161, 92, 0.6) !important;
}

.button-small {
    padding: 6px 15px !important;
    font-size: 11px !important;
}

/* === FORM INPUTS === */
input[type="text"],
input[type="email"],
input[type="password"],
input[type="number"],
textarea,
select {
    background: rgba(18, 12, 6, 0.8) !important;
    border: 1px solid rgba(201, 161, 92, 0.3) !important;
    color: #d9c48f !important;
    padding: 8px 12px !important;
    font-size: 12px !important;
    border-radius: 4px !important;
    transition: all 0.3s ease !important;
    width: 100% !important;
}

input[type="text"]:focus,
input[type="email"]:focus,
input[type="password"]:focus,
input[type="number"]:focus,
textarea:focus,
select:focus {
    border-color: #c9a15c !important;
    box-shadow: 0 0 10px rgba(201, 161, 92, 0.3) !important;
    outline: none !important;
}

::placeholder {
    color: rgba(217, 196, 143, 0.4) !important;
}

/* === TABLES === */
table {
    width: 100% !important;
    border-collapse: collapse !important;
}

table thead {
    background: linear-gradient(135deg, rgba(201, 161, 92, 0.2) 0%, rgba(138, 106, 42, 0.1) 100%) !important;
}

table thead th {
    color: #c9a15c !important;
    border-bottom: 2px solid rgba(201, 161, 92, 0.3) !important;
    font-weight: 600 !important;
    text-transform: uppercase !important;
    letter-spacing: 0.5px !important;
    padding: 12px 8px !important;
}

table tbody tr {
    background: rgba(18, 12, 6, 0.5) !important;
    border-bottom: 1px solid rgba(201, 161, 92, 0.1) !important;
}

table tbody tr:hover {
    background: rgba(201, 161, 92, 0.1) !important;
}

table tbody td {
    padding: 10px 8px !important;
    color: #d9c48f !important;
}

/* === BADGES === */
.badge,
.bg-mu-gold {
    background: linear-gradient(135deg, #c9a15c 0%, #4a2f15 100%) !important;
    color: #0f0a05 !important;
    font-weight: 600 !important;
    box-shadow: 0 0 10px rgba(201, 161, 92, 0.3) !important;
    padding: 4px 8px !important;
    border-radius: 4px !important;
    font-size: 11px !important;
}

.bg-green-500 {
    background: #22c55e !important;
    color: #fff !important;
}

.bg-red-500 {
    background: #ef4444 !important;
    color: #fff !important;
}

/* === TEXT COLORS === */
.text-mu-gold {
    color: #c9a15c !important;
}

.text-mu-text {
    color: #d9c48f !important;
}

.text-mu-light {
    color: #e0f0ff !important;
}

/* === SCROLLBAR === */
::-webkit-scrollbar {
    width: 12px !important;
}

::-webkit-scrollbar-track {
    background: #0a0603 !important;
}

::-webkit-scrollbar-thumb {
    background: linear-gradient(135deg, #c9a15c 0%, #8a6a2a 100%) !important;
    border-radius: 6px !important;
    border: 2px solid rgba(138, 106, 42, 0.2) !important;
}

::-webkit-scrollbar-thumb:hover {
    background: linear-gradient(135deg, #8a6a2a 0%, #c9a15c 100%) !important;
    box-shadow: 0 0 8px rgba(201, 161, 92, 0.4) !important;
}

/* === SELECTION === */
::selection {
    background: rgba(201, 161, 92, 0.3) !important;
    color: #e0f0ff !important;
}

/* === RESPONSIVE === */
@media (max-width: 1200px) {
    .wrapper {
        width: 100% !important;
        padding: 0 20px !important;
        min-width: 100% !important;
    }

    .container {
        flex-direction: column !important;
        gap: 20px !important;
    }

    aside.left-sidebar,
    aside.right-sidebar,
    main.content {
        width: 100% !important;
    }

    .slider {
        width: 100% !important;
        margin: -30px 0 20px 0 !important;
    }

    .slider .slides .slide {
        min-width: 100% !important;
    }

    .slider .slides .slide img {
        width: 100% !important;
    }

    .carousel {
        width: 100% !important;
        padding: 0px 20px !important;
    }

    .carousel .gallery {
        width: calc(100% - 40px) !important;
    }
}

/* === ANIMATIONS === */
@keyframes glow-pulse {
    0% {
        filter: hue-rotate(0deg) brightness(1);
        box-shadow: 0 0 5px rgba(201, 161, 92, 0.5);
    }
    50% {
        filter: hue-rotate(10deg) brightness(1.3);
        box-shadow: 0 0 10px rgba(201, 161, 92, 0.8);
    }
    100% {
        filter: hue-rotate(0deg) brightness(1);
        box-shadow: 0 0 5px rgba(201, 161, 92, 0.5);
    }
}

.fire-border {
    background: linear-gradient(90deg, transparent, #c9a15c, #4a2f15, #c9a15c, transparent) !important;
    height: 2px !important;
    animation: glow-pulse 3s linear infinite !important;
}

@keyframes pulse {
    0%, 100% {
        opacity: 1;
    }
    50% {
        opacity: 0.7;
    }
}

.animate-pulse {
    animation: pulse 2s cubic-bezier(0.4, 0, 0.6, 1) infinite !important;
}

/* === HOME PAGE LAYOUT === */
/* Hide old layout when home page is active */
body.home-page .container {
    display: none !important;
}

.home-container {
    display: flex !important;
    gap: 20px !important;
    width: 1400px !important;
    margin: 0 auto !important;
    margin-top: 400px !important;
    margin-bottom: 50px !important;
    min-height: auto !important;
    position: relative !important;
    z-index: 50 !important;
}

/* News Panel - Left Side (500px) */
.home-news-panel {
    width: 500px !important;
    background: linear-gradient(135deg, rgba(15, 10, 5, 0.95), rgba(12, 8, 4, 0.95)) !important;
    border: 1px solid rgba(138, 106, 42, 0.3) !important;
    border-radius: 8px !important;
    padding: 10px !important;
    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.3) !important;
    height: 500px !important;
    max-height: 500px !important;
    overflow-y: auto !important;
    display: flex !important;
    flex-direction: column !important;
}

.home-news-title {
    font-size: 12px !important;
    font-weight: 700 !important;
    color: #4a98c9 !important;
    text-transform: uppercase !important;
    letter-spacing: 0.5px !important;
    margin-bottom: 8px !important;
    padding-bottom: 6px !important;
    border-bottom: 1px solid rgba(138, 106, 42, 0.3) !important;
    display: flex !important;
    align-items: center !important;
    gap: 8px !important;
    flex-shrink: 0 !important;
}

.home-news-title i {
    color: #c9a15c !important;
    font-size: 12px !important;
    flex-shrink: 0 !important;
}

.home-news-content {
    flex: 1 !important;
    overflow-y: auto !important;
    min-height: 0 !important;
}

.news-item {
    transition: all 0.3s ease !important;
}

.news-item:hover {
    box-shadow: 0 4px 12px rgba(138, 106, 42, 0.3) !important;
}

/* Right Sidebar - Horizontal Layout (3 panels side by side) */
.home-sidebar {
    display: flex !important;
    flex-direction: row !important;
    gap: 10px !important;
    width: 880px !important;
    flex: 1 !important;
}

.home-panel {
    background: linear-gradient(135deg, rgba(15, 10, 5, 0.95), rgba(12, 8, 4, 0.95)) !important;
    border: 1px solid rgba(138, 106, 42, 0.3) !important;
    border-radius: 8px !important;
    padding: 10px !important;
    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.3) !important;
    display: flex !important;
    flex-direction: column !important;
}

/* Sidebar panels - 3 panels side by side with equal width */
.home-sidebar .home-panel {
    flex: 1 !important;
    min-width: 0 !important;
    display: flex !important;
    flex-direction: column !important;
    height: 500px !important;
    max-height: 500px !important;
}

/* Top 10 Players - must fit in 500px, no scroll */
.home-sidebar .home-panel:first-child {
    overflow: visible !important;
}

/* News and Events panels - 500px with scroll if needed */
.home-sidebar .home-panel:nth-child(2),
.home-sidebar .home-panel:nth-child(3) {
    overflow-y: auto !important;
    overflow-x: hidden !important;
}

.home-panel-title {
    font-size: 12px !important;
    font-weight: 600 !important;
    color: #4a98c9 !important;
    text-transform: uppercase !important;
    letter-spacing: 0.5px !important;
    margin-bottom: 8px !important;
    padding-bottom: 6px !important;
    border-bottom: 1px solid rgba(138, 106, 42, 0.3) !important;
    flex-shrink: 0 !important;
}

.home-panel-content {
    flex: 1 !important;
    overflow-y: auto !important;
    overflow-x: hidden !important;
    padding-right: 4px !important;
}

.home-panel-content::-webkit-scrollbar {
    width: 6px !important;
}

.home-panel-content::-webkit-scrollbar-track {
    background: rgba(0, 0, 0, 0.2) !important;
    border-radius: 3px !important;
}

.home-panel-content::-webkit-scrollbar-thumb {
    background: rgba(138, 106, 42, 0.5) !important;
    border-radius: 3px !important;
}

.home-panel-content::-webkit-scrollbar-thumb:hover {
    background: rgba(138, 106, 42, 0.7) !important;
}

/* Top Players Panel */
.top-players-list {
    list-style: none !important;
    padding: 0 !important;
    margin: 0 !important;
    flex: 1 !important;
    display: flex !important;
    flex-direction: column !important;
    overflow: visible !important;
    min-height: 0 !important;
}

.top-player-item {
    display: flex !important;
    justify-content: space-between !important;
    align-items: center !important;
    padding: 6px 8px !important;
    border-bottom: 1px dashed rgba(138, 106, 42, 0.2) !important;
    transition: background 0.2s !important;
}

.top-player-item:hover {
    background: rgba(138, 106, 42, 0.05) !important;
}

.top-player-item:last-child {
    border-bottom: 1px dashed rgba(138, 106, 42, 0.2) !important;
}

/* Top 10 panel: usun podwojny padding (li + a maja oba po 6px 8px) i scisnij wiersz,
   inaczej 10 wierszy nie miesci sie w panelu 500px wysokosci. */
.home-sidebar .home-panel:first-child .top-player-item {
    padding: 0 !important;
}

.top-player-name {
    color: #4a98c9 !important;
    font-weight: 600 !important;
    font-size: 11px !important;
}

/* Ikony w tytulach paneli zostaja zlote (kontrast z niebieskim tekstem) */
.home-panel-title i {
    color: #c9a15c !important;
}

.top-player-level {
    color: #d9c48f !important;
    font-weight: 500 !important;
    font-size: 10px !important;
}

/* Market Panel */
.market-items-list {
    list-style: none !important;
    padding: 0 !important;
    margin: 0 !important;
}

.market-item {
    display: flex !important;
    justify-content: space-between !important;
    align-items: center !important;
    padding: 8px 0 !important;
    border-bottom: 1px dashed rgba(138, 106, 42, 0.2) !important;
    font-size: 11px !important;
}

.market-item:last-child {
    border-bottom: none !important;
}

.market-item-name {
    color: #c9a15c !important;
    font-weight: 500 !important;
}

.market-item-price {
    color: #8a6a2a !important;
    font-weight: 600 !important;
}

/* Login Panel */
.home-login-form {
    display: flex !important;
    flex-direction: column !important;
    gap: 10px !important;
}

.home-login-input {
    background: rgba(15, 10, 5, 0.8) !important;
    border: 1px solid rgba(138, 106, 42, 0.4) !important;
    color: #d9c48f !important;
    padding: 10px 12px !important;
    border-radius: 4px !important;
    font-size: 12px !important;
    transition: all 0.3s ease !important;
}

/* Select serwera w wierszu z linkiem — kompaktowy, niższy niż inputy tekstowe */
select.home-login-input {
    padding: 5px 8px !important;
    font-size: 11px !important;
    height: 28px !important;
    line-height: 1 !important;
}

.home-login-input:focus {
    border-color: #c9a15c !important;
    box-shadow: 0 0 10px rgba(201, 161, 92, 0.4) !important;
    outline: none !important;
    background: rgba(15, 10, 5, 0.9) !important;
}

.home-login-input::placeholder {
    color: rgba(201, 161, 92, 0.5) !important;
}

.home-login-input:-webkit-autofill,
.home-login-input:-webkit-autofill:hover,
.home-login-input:-webkit-autofill:focus,
.home-login-input:-webkit-autofill:active,
.login-form input.form-input:-webkit-autofill,
.login-form input.form-input:-webkit-autofill:hover,
.login-form input.form-input:-webkit-autofill:focus,
.login-form input.form-input:-webkit-autofill:active {
    -webkit-box-shadow: 0 0 0 1000px rgba(15, 10, 5, 0.9) inset !important;
    -webkit-text-fill-color: #e8d9a8 !important;
    caret-color: #e8d9a8 !important;
    border: 1px solid rgba(138, 106, 42, 0.4) !important;
    transition: background-color 600000s ease-in-out 0s, color 600000s ease-in-out 0s !important;
}

.home-login-button {
    background: linear-gradient(135deg, #4a2f15 0%, #c9a15c 100%) !important;
    color: #ffffff !important;
    border: 1px solid #8a6a2a !important;
    padding: 10px 20px !important;
    border-radius: 6px !important;
    font-size: 12px !important;
    font-weight: 600 !important;
    text-transform: uppercase !important;
    cursor: pointer !important;
    transition: all 0.3s ease !important;
    text-decoration: none !important;
    display: inline-block !important;
    text-align: center !important;
    box-shadow: 0 3px 8px rgba(138, 106, 42, 0.3) !important;
}

.home-login-button:hover {
    background: linear-gradient(135deg, #c9a15c 0%, #4a2f15 100%) !important;
    box-shadow: 0 5px 15px rgba(201, 161, 92, 0.5) !important;
    border-color: #c9a15c !important;
}

/* Event Timer Tab Buttons */
.home-event-tab-btn {
    padding: 6px 12px !important;
    font-size: 10px !important;
    font-weight: 600 !important;
    border-radius: 4px !important;
    border: 1px solid rgba(138, 106, 42, 0.3) !important;
    cursor: pointer !important;
    transition: all 0.3s ease !important;
    text-transform: uppercase !important;
    letter-spacing: 0.5px !important;
}

.home-event-tab-btn.active {
    background: linear-gradient(135deg, #8a6a2a 0%, #c9a15c 100%) !important;
    color: #ffffff !important;
    border-color: #8a6a2a !important;
    box-shadow: 0 2px 6px rgba(138, 106, 42, 0.4) !important;
}

.home-event-tab-btn.inactive {
    background: rgba(0, 0, 0, 0.2) !important;
    color: #c9a15c !important;
    border-color: rgba(138, 106, 42, 0.2) !important;
}

.home-event-tab-btn.inactive:hover {
    background: rgba(138, 106, 42, 0.3) !important;
    color: #d9c48f !important;
    border-color: rgba(138, 106, 42, 0.5) !important;
}

.home-login-links {
    display: flex !important;
    justify-content: space-between !important;
    margin-top: 8px !important;
}

.home-login-link {
    color: #c9a15c !important;
    font-size: 11px !important;
    text-decoration: none !important;
    transition: color 0.2s !important;
}

.home-login-link:hover {
    color: #8a6a2a !important;
}

/* === HOME PAGE FOOTER === */
.home-footer {
    width: 1400px !important;
    margin: 40px auto 20px auto !important;
    padding: 20px 0 !important;
    border-top: 1px solid rgba(138, 106, 42, 0.3) !important;
}

.footer-content {
    display: flex !important;
    justify-content: space-between !important;
    align-items: center !important;
    gap: 20px !important;
}

.footer-left {
    flex: 1 !important;
}

.footer-center {
    flex: 1 !important;
    text-align: center !important;
}

.footer-center p {
    margin: 0 !important;
    color: rgba(201, 161, 92, 0.8) !important;
    font-size: 11px !important;
}

.footer-right {
    flex: 1 !important;
    display: flex !important;
    justify-content: flex-end !important;
    gap: 15px !important;
}

.footer-right a {
    color: #c9a15c !important;
    font-size: 11px !important;
    text-decoration: none !important;
    transition: all 0.3s ease !important;
    border-bottom: 1px solid transparent !important;
}

.footer-right a:hover {
    color: #8a6a2a !important;
    border-bottom-color: #8a6a2a !important;
}

.discord-button {
    background: linear-gradient(135deg, #5865F2 0%, #4752C4 100%) !important;
    color: #ffffff !important;
    padding: 8px 16px !important;
    border-radius: 6px !important;
    font-size: 12px !important;
    font-weight: 600 !important;
    text-decoration: none !important;
    display: inline-flex !important;
    align-items: center !important;
    gap: 8px !important;
    transition: all 0.3s ease !important;
    border: 1px solid rgba(88, 101, 242, 0.3) !important;
    box-shadow: 0 2px 6px rgba(88, 101, 242, 0.3) !important;
}

.discord-button:hover {
    background: linear-gradient(135deg, #4752C4 0%, #3c45a5 100%) !important;
    box-shadow: 0 4px 12px rgba(88, 101, 242, 0.4) !important;
}

.discord-button i {
    font-size: 16px !important;
}

/* Event Timer Tabs - flex-shrink */
.home-event-tab-nav {
    flex-shrink: 0 !important;
}

/* Event Timer Content Areas */
#home-events-content,
#home-invasion-content {
    flex: 1 !important;
    overflow-y: auto !important;
    min-height: 0 !important;
}

/* Custom Scrollbar for News and Panels */
.home-news-content::-webkit-scrollbar,
.top-players-list::-webkit-scrollbar,
#home-events-content::-webkit-scrollbar,
#home-invasion-content::-webkit-scrollbar,
.home-panel::-webkit-scrollbar {
    width: 8px !important;
}

.home-news-content::-webkit-scrollbar-track,
.top-players-list::-webkit-scrollbar-track,
#home-events-content::-webkit-scrollbar-track,
#home-invasion-content::-webkit-scrollbar-track,
.home-panel::-webkit-scrollbar-track {
    background: rgba(0, 0, 0, 0.2) !important;
    border-radius: 4px !important;
}

.home-news-content::-webkit-scrollbar-thumb,
.top-players-list::-webkit-scrollbar-thumb,
#home-events-content::-webkit-scrollbar-thumb,
#home-invasion-content::-webkit-scrollbar-thumb,
.home-panel::-webkit-scrollbar-thumb {
    background: linear-gradient(135deg, #8a6a2a, #c9a15c) !important;
    border-radius: 4px !important;
}

.home-news-content::-webkit-scrollbar-thumb:hover,
.top-players-list::-webkit-scrollbar-thumb:hover,
#home-events-content::-webkit-scrollbar-thumb:hover,
#home-invasion-content::-webkit-scrollbar-thumb:hover,
.home-panel::-webkit-scrollbar-thumb:hover {
    background: linear-gradient(135deg, #c9a15c, #8a6a2a) !important;
}