.weather-card {
    @apply bg-white p-4 rounded-lg shadow text-center;
}

.weather-card span {
    @apply text-gray-500 text-sm block;
}

.weather-card strong {
    @apply text-xl block mt-1;
}

.weather-card small {
    @apply text-gray-400 text-xs block mt-1;
}

.forecast-day {
    transition: all 0.3s ease;
}

.forecast-day:hover {
    @apply shadow-md transform scale-105;
}

@media (max-width: 640px) {
    .mausam-container {
        @apply p-2;
    }
    
    #city-input, #get-weather, #current-location {
        @apply w-full;
    }
}