/* public/style.css */

/* Global Reset - Add this at the top */
* {
    margin: 0;
    padding: 0;
    box-sizing: border-box; /* This is the "Magic Fix" for padding */
}

html, body {
    width: 100%;
    overflow-x: hidden; /* Prevents accidental horizontal scrolling */
    background-color: #121212;
    color: white;
    font-family: sans-serif;
}

/* Ensure the navbar doesn't inherit weird centering from pages */
#global-nav {
    width: 100%;
    display: block;
}

/* This is where your page content goes */
.page-content {
    padding: 20px;
    max-width: 1200px;
    margin: 0 auto; /* Centers the content, but not the header */
}

.dropdown { position: relative; display: inline-block; }
.dropbtn { background-color: #00ff44; color: black; padding: 10px 20px; font-weight: bold; border: none; cursor: pointer; border-radius: 4px; }
.dropdown-content { 
    display: none; position: absolute; right: 0; background-color: #1e1e1e; 
    min-width: 160px; box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.5); z-index: 99; 
}
.dropdown-content a, .dropdown-content button { 
    color: white; padding: 12px 16px; text-decoration: none; display: block; 
    width: 100%; text-align: left; background: none; border: none; cursor: pointer; 
}
.dropdown-content a:hover, .dropdown-content button:hover { background-color: #333; }
.dropdown:hover .dropdown-content { display: block; }