/* 🌑 Set the entire page background to black */
html, body {
    background-color: #000 !important; /* Fully black background */
    color: #fff !important; /* White text for readability */
    margin: 0;
    padding: 0;
}

/* 📜 Style all post sections */
.news-post, .release-post, .concert-post, .shop-item {
    background-color: #222; /* Dark gray background for contrast */
    padding: 20px;
    margin: 20px auto;
    max-width: 800px;
    border-radius: 10px;
    box-shadow: 0px 4px 8px rgba(255, 255, 255, 0.1);
}

/* 🖼️ Style images */
.news-image, .release-cover, .shop-image {
    max-width: 100%;
    height: auto;
    border-radius: 5px;
    margin-bottom: 15px;
}

/* 🎥 Style video embeds */
.news-video iframe, .release-video iframe {
    max-width: 100%;
    border-radius: 8px;
}

/* 🎶 Special styling for shop products */
.shop-price {
    font-size: 1.2rem;
    color: #ffcc00; /* Yellow */
}

.shop-buy-button {
    display: inline-block;
    background-color: #ff6600; /* Orange */
    color: white;
    padding: 10px 15px;
    border-radius: 5px;
    text-decoration: none;
    font-weight: bold;
}

.shop-buy-button:hover {
    background-color: #ff3300; /* Darker orange */
}

/* 🌐 Default Link Styling */
a {
    color: #ffcc00; /* Bright yellow */
    text-decoration: none; /* No underline */
    font-weight: bold;
    transition: color 0.3s ease-in-out;
}

/* 🔥 Hover Effect: Turns Red */
a:hover {
    color: #d40909; /* Red-ish */
    text-decoration: underline; /* Subtle underline on hover */
}

/* 🎯 Special Styling for Buttons */
a.button-link {
    display: inline-block;
    background-color: #ff6600; /* Orange */
    color: black;
    padding: 8px 12px;
    border-radius: 5px;
    text-decoration: none;
    font-weight: bold;
    transition: background-color 0.3s ease-in-out;
}

a.button-link:hover {
    background-color: #cc0000; /* Darker Red */
    color: white;
}