/* ZelCraft Custom Styles - CATA GOLD Theme */

:root {
    --gold: #FFD700;
    --dark-gold: #B8860B;
    --gold-glow: rgba(255, 215, 0, 0.4);
    --molten: #ff4500;
    --dark-bg: #0a0a0a;
    --card-bg: rgba(15, 15, 15, 0.95);
    --text-color: #f0f0f0;
}

@import url('https://fonts.googleapis.com/css2?family=Cinzel:wght@400;700&display=swap');

html {
    background: var(--dark-bg) url('../img/cataclysm/bg-main.png') no-repeat fixed center top / cover !important;
}

body {
    background: transparent;
    color: var(--text-color);
    font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
}

/* Typography */
h1, h2, h3, h4, h5, h6, .uk-h1, .uk-h2, .uk-h3, .uk-h4, .uk-h5, .uk-h6, .uk-card-title {
    color: var(--gold) !important;
    font-family: 'Cinzel', serif !important;
    text-transform: uppercase;
    text-shadow: 2px 2px 4px rgba(0,0,0,0.8);
    letter-spacing: 1px;
}

.uk-text-meta {
    color: #aaa !important;
}

/* Navbar */
.uk-navbar-transparent {
    background: rgba(0, 0, 0, 0.8) url('../img/cataclysm/header-background.jpg') no-repeat center / cover !important;
    border-bottom: 3px solid var(--gold) !important;
    box-shadow: 0 5px 20px rgba(0,0,0,0.9);
}

.uk-navbar-container:not(.uk-navbar-transparent) {
    background: rgba(20, 20, 20, 0.95) url('../img/cataclysm/navbar-background.jpg') repeat !important;
    border-bottom: 1px solid var(--dark-gold);
}

.uk-logo {
    color: var(--gold) !important;
    font-size: 1.8rem !important;
    font-weight: 700 !important;
    text-shadow: 0 0 10px var(--gold-glow), 2px 2px 2px #000 !important;
}

.uk-navbar-nav > li > a {
    color: #fff !important;
    font-weight: 700;
    font-size: 0.95rem;
    transition: 0.3s ease;
}

.uk-navbar-nav > li:hover > a, 
.uk-navbar-nav > li.uk-active > a {
    color: var(--gold) !important;
    text-shadow: 0 0 8px var(--gold-glow);
}

/* Cards */
.uk-card-default {
    background: var(--card-bg) url('../img/cataclysm/card-background-2.jpg') repeat !important;
    border: 1px solid var(--dark-gold) !important;
    box-shadow: 0 15px 35px rgba(0,0,0,0.7);
    color: var(--text-color);
}

.uk-card-header {
    border-bottom: 2px solid var(--gold) !important;
    background: rgba(0,0,0,0.4);
}

.uk-card-body {
    color: #e0e0e0;
}

/* Buttons */
.uk-button-primary, .uk-button-default {
    background: linear-gradient(135deg, var(--gold) 0%, var(--dark-gold) 100%) !important;
    color: #000 !important;
    border: 1px solid #443300 !important;
    font-weight: 800;
    text-transform: uppercase;
    border-radius: 2px;
    box-shadow: 0 4px 6px rgba(0,0,0,0.3);
    transition: 0.3s;
}

.uk-button-primary:hover, .uk-button-default:hover {
    background: linear-gradient(135deg, #fff700 0%, var(--gold) 100%) !important;
    box-shadow: 0 0 15px var(--gold-glow);
    transform: translateY(-1px);
}

/* Store & Lists */
.uk-nav-default > li > a {
    color: #ccc !important;
    border-left: 3px solid transparent;
}

.uk-nav-default > li > a:hover, .uk-nav-default > li.uk-active > a {
    color: var(--gold) !important;
    background: rgba(255, 215, 0, 0.1);
    border-left: 3px solid var(--gold);
}

.bc-status-dot { background: #00ff00 !important; box-shadow: 0 0 8px #00ff00; }
.bc-status-dot.is-offline { background: #ff0000 !important; box-shadow: 0 0 8px #ff0000; }

.bc-realmlist {
    border: 1px solid var(--gold) !important;
    color: var(--gold) !important;
    background: rgba(0,0,0,0.6) !important;
    font-weight: bold;
}

/* Fix for broken store images container */
.uk-cover-container {
    background: #151515;
    border: 1px solid #333;
}

/* News Section */
.uk-card-media-left {
    border-right: 1px solid var(--dark-gold);
}

/* Footer */
.bc-footer-section {
    background: rgba(0,0,0,0.95) url('../img/cataclysm/footer-background.jpg') repeat !important;
    border-top: 3px solid var(--gold) !important;
}

.bc-footer-section p, .bc-footer-section a {
    color: #888 !important;
}

.bc-footer-section a:hover {
    color: var(--gold) !important;
}

/* Scrollbar */
::-webkit-scrollbar { width: 10px; }
::-webkit-scrollbar-track { background: #0a0a0a; }
::-webkit-scrollbar-thumb { background: var(--dark-gold); }
::-webkit-scrollbar-thumb:hover { background: var(--gold); }
