/* Basic Reset & Box Sizing - Kept for consistent element sizing across browsers, essential for menu layout */
* {
    box-sizing: border-box;
    margin: 0;
    padding: 0;
}

/* Basic body adjustments for fixed menu; no aesthetic styling */


/* Menu Container - Fixed to Top-Right */
.menu-container {
    position: fixed; /* Stays in place when scrolling */
    top: 5px;       /* Distance from top */
    right: 5px;     /* Distance from right */
    z-index: 1000;   /* Ensure it's on top of other content */
    background-color: #333; /* Background for the button/dropdown area */
    border-radius: 5px;
    box-shadow: 0 2px 8px rgba(0,0,0,0.3);
}

/* Menu Button */
.menu-button {
    background-color: #dec11b;
    color: white;
    border: none;
    padding: 10px 15px;
    cursor: pointer;
    font-size: 1em;
    font-weight: bold;
    border-radius: 5px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px; /* Space between text and icon, if any */
    transition: background-color 0.3s ease;
    /* Ensure button is touch-friendly size */
    min-width: 44px;
    min-height: 44px;
}

.menu-button:hover {
    background-color: #c4b039;
}

/* Navigation Links (Dropdown) */
.nav-links {
    list-style: none; /* Remove bullet points */
    display: none; /* Hidden by default */
    flex-direction: column;
    position: absolute; /* Positioned relative to .menu-container */
    top: 100%; /* Starts just below the button */
    right: 0;  /* Aligns to the right edge of the button */
    background-color: #444; /* Darker background for dropdown content */
    min-width: 150px; /* Minimum width of the dropdown */
    max-width: calc(100vw - 40px); /* Full width of viewport minus padding on sides */
    box-shadow: 0 5px 10px rgba(0,0,0,0.3);
    border-radius: 0 0 5px 5px; /* Rounded bottom corners */
    overflow: hidden; /* Ensures borders/shadows within are clipped */
}

/* JavaScript will add this class when menu is active */
.nav-links.active {
    display: flex; /* Show menu when active */
}

.nav-links li {
    border-bottom: 1px solid #555; /* Separator for menu items */
}

.nav-links li:last-child {
    border-bottom: none; /* No border for the last item */
}

.nav-links a {
    color: white;
    text-decoration: none; /* Remove underline */
    padding: 12px 20px;
    display: block; /* Make the entire link area clickable */
    transition: background-color 0.3s ease;
    white-space: nowrap; /* Prevent text wrapping within menu items */
}

.nav-links a:hover {
    background-color: #666;
}

/* Content Area - Completely removed all specific styling */
.content {
    /* All padding, max-width, margin, background, border-radius, box-shadow removed */
}

/* Responsive adjustments for very small screens - These apply only to menu elements */
 @media (max-width: 380px) {
    .menu-container {
        top: 15px;
        right: 15px;
    }

    .menu-button {
        padding: 8px 12px;
        font-size: 0.9em;
    }

    .nav-links {
        min-width: unset;
        width: calc(100vw - 30px);
        right: -15px;
    }

    .nav-links a {
        padding: 10px 15px;
        font-size: 0.9em;
    }
}