body {
    padding: 0;
    margin: 0;
    background-color: #f4f4f4;
    color: #333;
    overflow-x: hidden; /* Prevent horizontal scrolling */
    width: 100%;
    max-width: 100vw; /* Ensure body doesn’t exceed viewport */
    box-sizing: border-box; /* Include padding/border in width */
}

html, #map {
    height: 100%;
    width: 100%;
    max-width: 100vw; /* Prevent overflow */
    box-sizing: border-box;
}

/* Ensure map doesn’t cause overflow */
#map {
    position: relative; /* Ensure map stays within bounds */
    overflow: hidden; /* Prevent map content from spilling out */
}

/* Label styling */
.label {
    text-align: center;
    pointer-events: none;
}

/* Dropdown styling */
.dropdown {
    position: relative;
    display: inline-block;
}

.dropdown > a {
    cursor: pointer;
    color: white;
}

.dropdown-content {
    display: none;
    position: absolute;
    background-color: #f9f9f9;
    min-width: 160px;
    /* Removed max-width: 100vw to allow natural expansion */
    box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
    z-index: 1000;
    max-height: 300px;
    overflow-y: auto; /* Vertical scroll only if needed */
    overflow-x: hidden; /* Prevent horizontal scroll */
    box-sizing: border-box;
}

.dropdown:hover .dropdown-content {
    display: block; /* Main dropdown appears on hover */
}

.dropdown-content a {
    color: black;
    padding: 12px 16px;
    text-decoration: none;
    display: block;
    text-align: left;
    white-space: nowrap;
}

.dropdown-content a:hover {
    background-color: #f1f1f1;
}

/* Nested dropdowns for subdivisions */
.sub-dropdown {
    position: relative;
    display: block; /* Full-width item in dropdown */
}

.country-toggle {
    cursor: pointer;
    display: block;
    padding: 12px 16px;
    color: black;
    text-decoration: none;
    white-space: nowrap;
}

.country-toggle:hover {
    background-color: #e0e0e0; /* Visual feedback on hover */
}

.sub-dropdown-content {
    display: none;
    position: static; /* Changed from absolute to flow within parent */
    background-color: #f9f9f9;
    min-width: 160px;
    box-shadow: none; /* Remove shadow since it’s nested */
    z-index: 1001;
    padding-left: 20px; /* Indent subdivisions for clarity */
    box-sizing: border-box;
}

.sub-dropdown:hover .sub-dropdown-content {
    display: block; /* Subdivisions appear on hover */
}

.sub-dropdown-content a {
    color: black;
    padding: 12px 16px;
    text-decoration: none;
    display: block;
    text-align: left;
    white-space: nowrap;
}

.sub-dropdown-content a:hover {
    background-color: #f1f1f1;
}

/* Navigation hover effects */
nav a:hover, nav .dropdown:hover > a {
    background-color: #5d6d7e;
}

/* Global box-sizing to prevent overflow */
*, *:before, *:after {
    box-sizing: border-box;
}   