/*
 * MONDA WEBSITE STYLE SHEET
 * Aesthetic: 1999 Windows 98 Look
 * Font: Georgia
 */

/* --- 1999 GLOBAL STYLES --- */

body {
    /* Classic 90s light-gray Windows background */
    background-color: #C0C0C0; 
    color: #000000; 
    
    /* Georgia font and legible size */
    font-family: Georgia, 'Times New Roman', Times, serif; 
    font-size: 16px; 
    line-height: 1.5;
    margin: 0;
    padding: 0;
    max-width: none;
}

/* Ensure the main content area has the classic 3D border and white background */
main {
    max-width: 800px; /* Fixed width for 90s feel */
    margin: 20px auto;
    padding: 15px;
    background-color: #FFFFFF;
    
    /* Classic 3D window border effect */
    border-style: outset;
    border-width: 3px;
    border-color: #FFFFFF #808080 #808080 #FFFFFF;
}

/* Link Colors */
a {
    color: #0000CC; /* Default bright blue link */
    text-decoration: underline;
}

a:hover {
    color: #FF0000; /* BRIGHT RED HOVER! */
    text-decoration: underline;
}

/* --- HEADER AND NAVIGATION --- */

header {
    background-color: #008080; /* Teal/Cyan header bar */
    color: #FFFFFF;
    padding: 5px 15px;
    text-align: left;
    border-bottom: 5px solid #000000;
}

/* Styles for the transparent wordmark image */
#wordmark-logo {
    max-height: 50px; 
    max-width: 300px;
    height: auto;
    width: auto;
    margin: 5px 0 0 0; 
}

nav {
    text-align: center;
    padding: 10px 0;
    margin-bottom: 20px;
    background-color: #808080; /* Gray separator bar */
    border-bottom: 3px solid #000000;
}

/* 90s Button Look */
nav a {
    display: inline-block;
    background-color: #D4D4D4; 
    color: #000000;
    font-weight: bold;
    padding: 3px 10px;
    margin: 0 5px;
    text-transform: uppercase;
    text-decoration: none;
    border-style: outset;
    border-width: 3px;
    border-color: #FFFFFF #808080 #808080 #FFFFFF;
}

nav a:hover {
    background-color: #EAEAEA;
    border-style: inset; /* 'Pressed' look on hover */
    color: #000000;
}

/* Major Headings */
h2, h3, h4 {
    font-family: Georgia, 'Times New Roman', Times, serif; 
    color: #800080; /* Deep Purple Heading Color */
    border-bottom: 2px solid #D4D4D4;
    padding-bottom: 3px;
    margin-top: 15px;
}
.release-year {
    color: #000000;
    font-size: 1.1em;
    border-bottom: none;
    padding-bottom: 0;
}

/* --- LIVE GIG ENTRIES --- */

.gig-entry {
    border-style: outset;
    border-width: 3px;
    border-color: #FFFFFF #808080 #808080 #FFFFFF;
    padding: 10px;
    margin-bottom: 15px;
    background-color: #F0F0F0;
}

.gig-date {
    font-size: 1.1em;
    color: #0000CC;
    margin-bottom: 5px;
    font-weight: bold;
    border-bottom: 1px dotted #808080;
}

/* CTA Button */
.cta-button {
    display: inline-block;
    background-color: #D4D4D4;
    color: #000000;
    font-weight: bold;
    padding: 3px 10px;
    margin-top: 10px;
    text-decoration: none;
    border-radius: 0;
    border-style: outset;
    border-width: 3px;
    border-color: #FFFFFF #808080 #808080 #FFFFFF;
}

.cta-button:hover {
    background-color: #EAEAEA;
    border-style: inset;
    color: #000000;
}

/* --- MUSIC DIRECTORY STYLES --- */

.music-directory {
    margin-bottom: 20px;
    padding: 10px;
    border: 1px dashed #A0A0A0;
    background-color: #FFFFFF;
}

/* Music directory headings (Windows title bar look) */
.music-directory h3 {
    color: #FFFFFF; 
    background-color: #0000CC; 
    padding: 2px 5px;
    border: 1px solid #808080;
    margin: -10px -10px 10px -10px;
    font-family: Arial, sans-serif; /* Use Arial for the system bar look */
    font-size: 1.1em;
}

.music-directory ul {
    list-style-type: disc; 
    padding-left: 20px;
}
.music-directory li {
    padding: 2px 0;
    border-bottom: 1px dotted #ccc; 
}

/* --- ALBUM DETAIL PAGE LAYOUT FIX --- */

/* 1. Ensure all floated items are contained (Fixes the collapse/wrap issue) */
#sidebar-content {
    overflow: hidden; 
    margin-bottom: 15px;
}

/* 2. Float the image container left (35% width) */
#cover-container {
    float: left;
    width: 35%; 
    padding-right: 15px; 
}

/* 3. The actual image now uses 100% of its container width */
#detail-cover {
    width: 100%;
    height: auto; 
    /* The 90s border styles */
    border: 5px groove #D4D4D4;
}

/* 4. Float the tracklist container left (60% width) */
#tracklist-container {
    float: left;
    width: 60%; 
}

/* --- DETAIL PAGE ADDITIONAL STYLES --- */

/* Prevent the embed player and summary from sneaking up next to the float */
#detail-embed-player {
    clear: both;
    padding-top: 15px; /* Add space below the sidebar area */
}

.album-summary {
    padding-bottom: 10px;
}

/* Ensure audio players and Bandcamp embed fit */
.exclusive-content audio, .embed-player-box iframe {
    display: block;
    width: 100%;
    margin: 10px auto;
}

/* Other music grid styles (still disabled) */
.music-grid, .release-item, .cover-