@import 'tippy.js/dist/tippy.css';
@import 'highlight.js/styles/monokai-sublime.css';
/* @import 'swiper/swiper-bundle.min.css'; */
@import '../../../node_modules/swiper/swiper-bundle.min.css';
@import 'ngx-lightbox/lightbox.css';
@import '@ng-select/ng-select/themes/default.theme.css';
@import 'quill/dist/quill.snow.css';
@import 'file-upload-with-preview/dist/style.css';
@import 'flatpickr/dist/flatpickr.min.css';
@import 'nouislider/dist/nouislider.min.css';
@import 'tailwind.css';


/* Aggiungi in app.css */
#map {
    width: 100% !important;
    height: 400px !important;
    position: relative !important;
    background: #f8fafc !important;
    min-height: 400px !important;
}

.leaflet-container {
    all: revert !important;
    width: 100% !important;
    height: 100% !important;
    isolation: isolate !important;
}

.leaflet-marker-icon {
    filter: hue-rotate(120deg) !important;
    position: absolute !important;
    z-index: 1000 !important;
}

.leaflet-tile {
    position: absolute !important;
    max-width: none !important;
    max-height: none !important;
}

.leaflet-pane {
    z-index: 1 !important;
}

.leaflet-container {
    cursor: crosshair !important;
}

.leaflet-marker-icon {
    cursor: grab !important;
    transition: transform 0.2s ease;
}

.leaflet-marker-icon.leaflet-dragging {
    cursor: grabbing !important;
    transform: scale(1.2);
}

.leaflet-marker-draggable {
    z-index: 1000 !important;
}

.map-wrapper {
    position: relative;
}

.leaflet-control-coords {
    position: absolute;
    bottom: 10px;
    left: 10px;
    z-index: 1000;
    background: rgba(255, 255, 255, 0.9);
    padding: 5px 10px;
    border-radius: 4px;
    box-shadow: 0 1px 5px rgba(0,0,0,0.15);
    font-family: monospace;
}

.divider-info {
    position: relative;
    margin: 2rem 0;
}

.divider-info:before {
    content: "";
    position: absolute;
    top: -2px;
    left: 0;
    right: 0;
    border-top: 2px dashed #e5e7eb;
}


.custom-multiselect .ng-option img {
    object-fit: cover;
}

.custom-multiselect .ng-value-label {
    display: flex;
    align-items: center;
}

.custom-multiselect .ng-value img {
    margin-right: 8px;
}

.custom-multiselect .ng-option {
    padding: 8px 12px !important;
    border-bottom: 1px solid #f3f4f6;
}

.custom-multiselect .ng-value-container {
    padding: 8px 12px !important;
}

.custom-multiselect .ng-input input {
    padding: 8px 12px !important;
}

.custom-multiselect .ng-option {
    transition: all 0.2s ease;
}

.custom-multiselect .ng-menu {
    max-height: 300px;
    overflow-y: auto;
}