/* Custom Mobile-Optimized Opacity Slider */
        .custom-opacity-control {
            position: absolute;
            top: 120px;
            right: 2px;
            display: flex;
            flex-direction: column;
            align-items: center;
            gap: 4px;
            background: linear-gradient(180deg, rgba(255,255,255,0.92) 0%, rgba(255,255,255,0.82) 100%);
            border-radius: 4px;
            padding: 10px 10px 9px;
            box-shadow: 0 10px 26px rgba(0,0,0,0.2), 0 2px 6px rgba(0,0,0,0.1), inset 0 1px 0 rgba(255,255,255,0.6);
            z-index: 1000;
            backdrop-filter: blur(12px) saturate(160%);
            -webkit-backdrop-filter: blur(12px) saturate(160%);
            border: 1px solid rgba(255,255,255,0.55);
        }

        .opacity-icon {
            font-size: 12px;
            color: #2d8659;
            opacity: 0.85;
        }

        .custom-slider-container {
            position: relative;
            width: 10px;
            height: 130px;
            background: linear-gradient(180deg, rgba(0,0,0,0.10) 0%, rgba(0,0,0,0.05) 100%);
            border-radius: 10px;
            box-shadow: inset 0 2px 4px rgba(0,0,0,0.18);
            cursor: pointer;
            touch-action: none;
        }

        .slider-track {
            position: absolute;
            bottom: 0;
            left: 0;
            width: 100%;
            background: linear-gradient(180deg, #34a06e 0%, #ffb84d 55%, #ff6b35 100%);
            border-radius: 10px;
            transition: height 0.15s cubic-bezier(0.4, 0, 0.2, 1);
            box-shadow: 0 0 10px rgba(255, 107, 53, 0.4);
        }

        .slider-thumb {
            position: absolute;
            width: 20px;
            height: 20px;
            background: #ffffff;
            border: 3px solid #2d8659;
            border-radius: 50%;
            left: 50%;
            transform: translateX(-50%);
            cursor: grab;
            box-shadow: 0 3px 8px rgba(0,0,0,0.28), 0 0 0 4px rgba(255,255,255,0.55);
            transition: transform 0.15s cubic-bezier(0.4, 0, 0.2, 1), box-shadow 0.15s ease, border-color 0.15s ease;
            display: flex;
            align-items: center;
            justify-content: center;
            z-index: 2;
        }

        .slider-thumb:hover {
            transform: translateX(-50%) scale(1.08);
        }

        .slider-thumb:active {
            cursor: grabbing;
            transform: translateX(-50%) scale(1.18);
            box-shadow: 0 4px 14px rgba(0,0,0,0.32), 0 0 0 5px rgba(255,255,255,0.65);
        }

        .slider-thumb-dot {
            width: 6px;
            height: 6px;
            background: #2d8659;
            border-radius: 50%;
            transition: background-color 0.15s ease;
        }

        .opacity-value {
            position: absolute;
            top: 0px;
            right: calc(100% + 9px);
            transform: translateY(-50%);
            background: var(--badge-color, #2d8659);
            color: #fff;
            font: 700 0px/1 Arial, Helvetica, sans-serif;
            box-shadow: 0 2px 8px rgba(0,0,0,0.28);
            white-space: nowrap;
            pointer-events: none;
            transition: top 0.15s cubic-bezier(0.4, 0, 0.2, 1), background-color 0.15s ease;
        }

        .opacity-value::after {
            content: '';
            position: absolute;
            top: 50%;
            right: -4px;
            transform: translateY(-50%);
            border-width: 4px 0 4px 4px;
            border-style: solid;
            border-color: transparent transparent transparent var(--badge-color, #2d8659);
        }

        /* Mobile specific adjustments */
        @media (max-width: 768px) {
            .custom-opacity-control {
                top: 120px;
                right: 8px;
                padding: 9px 9px 8px;
            }

            .custom-slider-container {
                width: 8px;
                height: 105px;
            }

            .slider-thumb {
                width: 18px;
                height: 18px;
            }
        }

        /* Hide default opacity control */
        .leaflet-control-opacity {
            display: none !important;
        }