/* --- START OF CUSTOM POPUP CSS --- */
        
        /* Main popup window */
        .leaflet-popup-content-wrapper {
            border-radius: 8px;
            padding: 0;
            overflow: hidden; /* Ensures banner corners stay rounded */
        }

        .leaflet-popup-content {
            margin: 0 !important; /* Removes default leaflet padding */
            width: 300px !important; /* Sets a fixed width */
        }
        
        /* 1. The Title Banner */
        .popup-banner {
            background-color: #333; /* Dark background for the title */
            color: #fff;
            font-size: 1.2em;
            font-weight: bold;
            padding: 12px 15px;
            text-align: center;
        }

        /* 2. The Description */
        .popup-description {
            font-size: 0.95em;
            padding: 12px 15px;
            border-bottom: 1px solid #eee; /* Separator line */
            color: #333;
        }
        
        /* 3. The Table for other info */
        .popup-table {
            border-collapse: collapse; /* Cleans up table borders */
            width: 100%;
            margin-top: 5px;
        }
        .popup-table th {
            text-align: left;
            padding: 8px 10px 8px 15px;
            font-weight: bold;
            color: #555;
            width: 70px; /* Gives a fixed width to the 'Type' label */
        }
        .popup-table td {
            padding: 8px 15px 8px 10px;
        }
        
        /* 4. The "Type" Badge */
        .popup-badge {
            background-color: #eee;
            color: #333;
            padding: 4px 8px;
            border-radius: 4px;
            font-size: 0.9em;
            font-weight: bold;
        }
        
        /* 5. & 6. The Buttons */
        .gmaps-button-container {
            text-align: center;
            padding: 0 15px 15px 15px !important; /* Overrides other padding */
        }
        .gmaps-button {
            display: block; /* Makes the link fill the container */
            background-color: #4A89F3; /* Google Blue */
            color: #fff !important; /* Overrides link color */
            padding: 10px;
            border-radius: 5px;
            text-align: center;
            text-decoration: none !important;
            font-weight: bold;
            font-size: 0.95em;
            transition: background-color 0.2s;
        }
        .gmaps-button:hover {
            background-color: #3A79E3;
            color: #fff !important;
        }
        
        /* "Learn More" button styling */
        .learn-more {
            background-color: #777;
        }
        .learn-more:hover {
            background-color: #666;
        }
        
        /* --- END OF CUSTOM POPUP CSS --- */