/* Enhanced Map Container */
.map-container {
    height: 400px;
    border-radius: 0.5rem;
    overflow: hidden;
    border: 2px solid #dee2e6;
    position: relative;
    transition: all 0.3s ease;
    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
}

    .map-container:hover {
        border-color: #007bff;
        box-shadow: 0 6px 12px rgba(0, 123, 255, 0.15);
    }

/* Fullscreen Map */
.fullscreen-map {
    position: fixed !important;
    top: 0;
    left: 0;
    width: 100vw !important;
    height: 100vh !important;
    z-index: 9999;
    border-radius: 0 !important;
    border: none !important;
}

/* Custom Marker */
.custom-marker {
    background: transparent !important;
    border: none !important;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    background: radial-gradient(circle, rgba(0,123,255,0.2) 0%, rgba(0,123,255,0.1) 70%, transparent 100%) !important;
}

/* Address Search */
.address-suggestions {
    position: absolute;
    top: 100%;
    left: 0;
    right: 0;
    background: white;
    border: 1px solid #dee2e6;
    border-top: none;
    border-radius: 0 0 0.5rem 0.5rem;
    max-height: 300px;
    overflow-y: auto;
    z-index: 1000;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
}

.suggestion-item {
    padding: 1rem;
    cursor: pointer;
    border-bottom: 1px solid #f8f9fa;
    transition: all 0.2s ease;
    position: relative;
}

    .suggestion-item:hover,
    .suggestion-item.active {
        background-color: #f8f9fa;
        border-left: 3px solid #007bff;
        padding-left: calc(1rem - 3px);
    }

    .suggestion-item:last-child {
        border-bottom: none;
    }

    .suggestion-item .badge {
        font-size: 0.7rem;
    }

/* Location Input Group */
.location-input-group {
    position: relative;
}

    .location-input-group .form-control:focus {
        border-color: #007bff;
        box-shadow: 0 0 0 0.2rem rgba(0, 123, 255, 0.25);
    }

/* Verification Status */
.verification-badge {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.75rem 1.25rem;
    border-radius: 0.5rem;
    font-size: 0.9rem;
    font-weight: 500;
    transition: all 0.3s ease;
    animation: slideIn 0.3s ease-out;
}

@keyframes slideIn {
    from {
        opacity: 0;
        transform: translateY(-10px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}

.verification-success {
    background: linear-gradient(135deg, #d1e7dd, #c3e6cb);
    color: #0f5132;
    border: 1px solid #badbcc;
    box-shadow: 0 2px 4px rgba(15, 81, 50, 0.1);
}

.verification-warning {
    background: linear-gradient(135deg, #fff3cd, #ffeaa7);
    color: #664d03;
    border: 1px solid #ffecb5;
    box-shadow: 0 2px 4px rgba(102, 77, 3, 0.1);
}

.verification-error {
    background: linear-gradient(135deg, #f8d7da, #f5c2c7);
    color: #721c24;
    border: 1px solid #f5c2c7;
    box-shadow: 0 2px 4px rgba(114, 28, 36, 0.1);
}

/* Map Controls */
.map-controls {
    position: absolute;
    top: 10px;
    right: 10px;
    z-index: 1000;
}

    .map-controls .btn {
        width: 40px;
        height: 40px;
        display: flex;
        align-items: center;
        justify-content: center;
        border: none;
        backdrop-filter: blur(10px);
        background: rgba(255, 255, 255, 0.9) !important;
        transition: all 0.2s ease;
    }

        .map-controls .btn:hover {
            background: rgba(0, 123, 255, 0.1) !important;
            transform: translateY(-1px);
            box-shadow: 0 4px 8px rgba(0, 0, 0, 0.15);
        }

        .map-controls .btn:active {
            transform: translateY(0);
        }

/* Radius Control */
.radius-control {
    margin-top: 1rem;
    padding: 1rem;
    background: linear-gradient(135deg, #f8f9fa, #e9ecef);
    border-radius: 0.5rem;
    border: 1px solid #dee2e6;
}

.radius-control-content {
    max-width: 400px;
}

.form-range::-webkit-slider-thumb {
    background: #007bff;
    border: 2px solid white;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2);
}

.form-range::-moz-range-thumb {
    background: #007bff;
    border: 2px solid white;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2);
}

/* Loading States */
.loading-spinner {
    display: none;
    width: 1rem;
    height: 1rem;
}

    .loading-spinner.show {
        display: inline-block;
    }

/* Button Location Enhancement */
.btn-location {
    position: relative;
    overflow: hidden;
    transition: all 0.3s ease;
}

    .btn-location:hover {
        transform: translateY(-1px);
        box-shadow: 0 4px 8px rgba(0, 123, 255, 0.3);
    }

    .btn-location:disabled {
        opacity: 0.7;
        cursor: not-allowed;
    }

/* Form Field Animation */
.field-populated {
    animation: fieldHighlight 2s ease-out;
}

@keyframes fieldHighlight {
    0% {
        background-color: rgba(40, 167, 69, 0.1);
        border-color: #28a745;
    }

    100% {
        background-color: transparent;
        border-color: #ced4da;
    }
}

/* Map Feedback */
.map-feedback {
    position: absolute;
    top: 60px;
    left: 50%;
    transform: translateX(-50%);
    padding: 0.5rem 1rem;
    border-radius: 2rem;
    font-size: 0.875rem;
    font-weight: 500;
    z-index: 1000;
    opacity: 0;
    transition: all 0.3s ease;
    backdrop-filter: blur(10px);
    white-space: nowrap;
}

    .map-feedback.show {
        opacity: 1;
        transform: translateX(-50%) translateY(10px);
    }

.map-feedback-success {
    background: rgba(40, 167, 69, 0.9);
    color: white;
    box-shadow: 0 2px 8px rgba(40, 167, 69, 0.3);
}

.map-feedback-info {
    background: rgba(0, 123, 255, 0.9);
    color: white;
    box-shadow: 0 2px 8px rgba(0, 123, 255, 0.3);
}

.map-feedback-warning {
    background: rgba(255, 193, 7, 0.9);
    color: #212529;
    box-shadow: 0 2px 8px rgba(255, 193, 7, 0.3);
}

/* Coordinates Display Enhancement */
.coordinates-display {
    background: linear-gradient(135deg, #f8f9fa, #e9ecef);
    border-radius: 0.5rem;
    padding: 1rem;
    font-family: 'Courier New', monospace;
    font-size: 0.875rem;
    border: 1px solid #dee2e6;
    position: relative;
    overflow: hidden;
}

    .coordinates-display::before {
        content: '';
        position: absolute;
        top: 0;
        left: 0;
        width: 4px;
        height: 100%;
        background: linear-gradient(to bottom, #007bff, #0056b3);
    }

/* Enhanced Phone Input */
.indian-phone:focus {
    border-color: #28a745;
    box-shadow: 0 0 0 0.2rem rgba(40, 167, 69, 0.25);
}

.indian-phone:valid {
    border-color: #28a745;
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 8 8'%3e%3cpath fill='%2328a745' d='m2.3 6.73.94-.94 1.06.94 2.5-2.5L6.23 4l-2.97 2.97-.94-.94z'/%3e%3c/svg%3e");
    background-repeat: no-repeat;
    background-position: right calc(0.375em + 0.1875rem) center;
    background-size: calc(0.75em + 0.375rem) calc(0.75em + 0.375rem);
    padding-right: calc(1.5em + 0.75rem);
}

/* Service Area Circle Enhancement */
.leaflet-interactive {
    cursor: pointer;
}

    .leaflet-interactive:hover {
        fill-opacity: 0.3 !important;
        stroke-width: 3 !important;
    }

/* Map Layer Control Enhancement */
.leaflet-control-layers {
    background: rgba(255, 255, 255, 0.95) !important;
    backdrop-filter: blur(10px);
    border-radius: 0.5rem !important;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15) !important;
}

.leaflet-control-layers-toggle {
    background-image: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><polygon points="12 2 2 7 12 12 22 7 12 2"></polygon><polyline points="2,17 12,22 22,17"></polyline><polyline points="2,12 12,17 22,12"></polyline></svg>') !important;
}

/* Address Verification Checkbox */
.form-check {
    padding: 1rem;
    background: linear-gradient(135deg, #f8f9fa, #e9ecef);
    border-radius: 0.5rem;
    transition: all 0.3s ease;
}

    .form-check:has(.form-check-input:checked) {
        background: linear-gradient(135deg, #d1e7dd, #c3e6cb);
        border-left: 4px solid #28a745;
    }

.form-check-input:checked {
    background-color: #28a745;
    border-color: #28a745;
}

/* Responsive Enhancements */
@media (max-width: 768px) {
    .map-container {
        height: 300px;
    }

    .fullscreen-map {
        height: 100vh !important;
    }

    .map-controls {
        top: 5px;
        right: 5px;
    }

        .map-controls .btn {
            width: 35px;
            height: 35px;
            font-size: 0.8rem;
        }

    .suggestion-item {
        padding: 0.75rem;
    }

    .radius-control {
        padding: 0.75rem;
    }

    .map-feedback {
        font-size: 0.8rem;
        padding: 0.4rem 0.8rem;
        max-width: calc(100vw - 2rem);
    }
}

/* Dark Mode Support */
@media (prefers-color-scheme: dark) {
    .address-suggestions {
        background: #343a40;
        border-color: #495057;
        color: #fff;
    }

    .suggestion-item:hover,
    .suggestion-item.active {
        background-color: #495057;
    }

    .verification-badge {
        color: #fff;
    }

    .coordinates-display {
        background: linear-gradient(135deg, #495057, #343a40);
        color: #fff;
    }

    .radius-control {
        background: linear-gradient(135deg, #495057, #343a40);
        border-color: #6c757d;
        color: #fff;
    }
}

/* Print Styles */
@media print {
    .map-container {
        height: 200px;
        border: 1px solid #000;
    }

    .map-controls,
    .address-suggestions,
    .map-feedback {
        display: none !important;
    }
}

.font-monospace {
    font-family: 'Courier New', monospace !important;
}

.btn-location:hover {
    transform: translateY(-1px);
    box-shadow: 0 4px 8px rgba(0, 123, 255, 0.3);
}

#locationAccuracy {
    transition: color 0.3s ease;
}

.input-group .btn:hover {
    z-index: 3;
}