/* MAP & LAYOUT */
body { -webkit-tap-highlight-color: transparent; }
#map { height: 35vh; width: 100%; border-bottom: 1px solid rgba(0,0,0,0.1); }
@media (min-width: 1024px) { 
    #map { height: 100vh; position: fixed; right: 0; width: 55%; border-bottom: none; } 
    .sidebar-container { width: 45%; min-height: 100vh; }
}
.sidebar-container { 
    min-height: 65vh; 
    touch-action: pan-y;
}

/* UI COMPONENTS */
.suggestions { 
    position: absolute; z-index: 9999; width: 100%; 
    border-radius: 1rem; margin-top: 4px; overflow: hidden; 
    box-shadow: 0 10px 25px rgba(0,0,0,0.2); border: 1px solid rgba(0,0,0,0.1);
}
.suggestion-item { 
    padding: 12px; cursor: pointer; font-size: 13px; 
    border-bottom: 1px solid rgba(0,0,0,0.05); 
    display: flex; justify-content: space-between; align-items: center;
}
.suggestion-item:last-child { border-bottom: none; }

.dist-badge { 
    font-size: 10px; font-weight: bold; padding: 2px 6px; 
    border-radius: 4px; background: rgba(59, 130, 246, 0.1); color: #3b82f6; 
}

/* CARDS & BADGES */
.import-card.taken { opacity: 0.4; pointer-events: none; filter: grayscale(1); }
.storage-badge { 
    font-size: 9px; font-weight: 900; text-transform: uppercase; 
    padding: 2px 6px; border-radius: 4px; background: #3b82f6; 
    color: white; position: absolute; top: -6px; left: -6px; 
    z-index: 10; box-shadow: 0 2px 5px rgba(0,0,0,0.2); 
}
.time-badge { 
    font-size: 9px; font-weight: 900; text-transform: uppercase; 
    padding: 2px 6px; border-radius: 4px; background: #f59e0b; 
    color: white; position: absolute; top: -6px; left: 80px; 
    z-index: 10; box-shadow: 0 2px 5px rgba(0,0,0,0.2); cursor: pointer; 
}

.blurred {
    filter: blur(5px);
    transition: filter 0.3s ease-in-out;
}