/* Smooth transitions for condition cards */
#conditions .bg-gray-800 {
    transition: background-color 0.3s;
}
#conditions .bg-gray-800:hover {
    background-color: rgb(55 65 81);
}

/* Wind compass arrow smooth rotation */
#wind-arrow {
    transition: transform 0.5s ease;
}

/* Image popup animation */
#image-popup {
    transition: opacity 0.2s;
}
#image-popup.show {
    display: flex;
    opacity: 1;
}

/* Viewer / Highlights lightbox is shown by toggling .show; this overrides the
   Tailwind `hidden` (display:none) it carries by default. */
#lightbox.show {
    display: flex;
}

/* Active range button */
.range-btn.active {
    background-color: rgb(37 99 235);
}