:root {
    --primary-green: #0d47a1;
    --masjid-green: #0a3d2e;
    --dark-green: #05261c;
    --gold: #d4af37;
}

body {
    background-color: var(--dark-green) !important;
    font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
}

.bg-emerald {
    background-color: var(--masjid-green);
}

.bg-secondary-dark {
    background-color: rgba(10, 61, 46, 0.85);
}

.text-gold {
    color: var(--gold) !important;
}

.bg-gold {
    background-color: var(--gold) !important;
}

.border-gold {
    border: 1px solid var(--gold) !important;
}

.card-header {
    font-size: 1.1rem;
    letter-spacing: 1px;
}

.sholat-box {
    background: rgba(255, 255, 255, 0.05);
    border: 1px solid rgba(212, 175, 55, 0.3);
    border-radius: 8px;
    padding: 8px;
}

.sholat-box.active {
    background: var(--gold);
    color: #000 !important;
    font-weight: bold;
    transform: scale(1.05);
}

.sholat-box.active * {
    color: #000 !important;
}