/**
 * Weather Display Plugin Frontend Styles
 */

.wdp-weather-widget {
    margin-bottom: 2em;
    border: 1px solid #e0e0e0;
    padding: 15px;
    border-radius: 4px;
    background-color: #f9f9f9;
}

.wdp-weather-widget h3 {
    margin-top: 0;
    margin-bottom: 1em;
    border-bottom: 1px solid #e0e0e0;
    padding-bottom: 0.5em;
}

.wdp-forecast-date {
    margin-top: 1.5em;
    margin-bottom: 0.5em;
    font-size: 1.1em;
    font-weight: bold;
}

.wdp-table {
    width: 100%;
    border-collapse: collapse;
    margin-bottom: 1em;
}

.wdp-table th,
.wdp-table td {
    text-align: left;
    padding: 8px 10px;
    border: 1px solid #ddd;
}

.wdp-table thead th {
    background-color: #f2f2f2;
    font-weight: bold;
}

.wdp-table tbody tr:nth-child(even) {
    background-color: #fdfdfd;
}

/* Traffic Light Colors */
.wdp-condition-light {
    background-color: #fff9c4 !important; /* Yellowish */
    color: #5d4037; /* Darker text for contrast */
}

.wdp-condition-good {
    background-color: #c8e6c9 !important; /* Greenish */
    color: #1b5e20;
}

.wdp-condition-strong {
    background-color: #ffcdd2 !important; /* Reddish */
    color: #b71c1c;
}

/* Wind Arrow Icon Styling */
.wdp-table td i.fas {
    margin-right: 5px;
    /* Adjust size or color if needed */
    /* font-size: 1.1em; */
    /* color: #555; */
    width: 1.2em; /* Ensure fixed width helps alignment */
    text-align: center;
}

/* Error/Info Messages */
.wdp-error {
    color: #dc3232;
    font-weight: bold;
    border-left: 4px solid #dc3232;
    padding: 5px 10px;
    background-color: #fef7f7;
}

.wdp-info {
    color: #00529B;
    border-left: 4px solid #00529B;
    padding: 5px 10px;
    background-color: #f0f5fa;
}

/* Responsive adjustments if needed */
@media screen and (max-width: 600px) {
	/* Add styles for smaller screens if necessary */
    /* e.g., make table cells display as blocks */
}