.weather-container-small {
    max-width: 250px;
    margin: auto;
    padding: 5px; 
    background-image: radial-gradient(circle, #00c6ff, #004e92); /* Blue gradient */
    border-radius: 6px;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2); 
    color: #ffffff; /* White font color */
    font-family: Tahoma, Geneva, Verdana, sans-serif;
    text-align: center; 
}

.weather-info-small {
    display: flex; 
    align-items: center; 
    justify-content: center; 
    gap: 8px; 
}

.weather-icon-small {
    flex-shrink: 0; 
}

.weather-icon-small img {
    max-width: 35px; 
    border-radius: 4px; 
}

.weather-temp-small {
    font-size: 1.3em; 
    font-weight: bold;
    color: #fff; /* Keep this for temperature */
    text-shadow: 3px 3px 6px rgba(0, 0, 0, 0.4); /* Increased shadow for depth */
}

.temp-unit-small {
    font-size: 0.8em; 
    font-weight: normal;
    color: #ffffff; /* White font color */
    text-shadow: 1px 1px 2px rgba(0, 0, 0, 0.4); /* Added shadow */
}

.weather-description-small {
    font-size: 0.8em; 
    color: #ffffff; /* White font color */
    text-shadow: 1px 1px 2px rgba(0, 0, 0, 0.4); /* Added shadow */
}