/* Night Skiing Status - Mobile Responsive CSS */

.night-skiing-status-container {
    display: flex;
    justify-content: center;
    align-items: center;
    margin: 0 auto;
    padding: 10px;
    text-align: center;
}

.night-skiing-svg {
    max-width: 100%;
    height: auto;
    flex-shrink: 0;
}

.night-skiing-text {
    font-weight: bold;
    color: #333;
    text-align: center;
    padding: 5px 0;
    font-size: 1.4em;
}

/* Mobile-first responsive styles */
@media (max-width: 768px) {
    .night-skiing-status-container {
        padding: 5px;
    }

    .night-skiing-svg {
        width: 36px !important;
        height: 36px !important;
    }

    .night-skiing-text {
        font-size: 0.9em;
    }
}

@media (max-width: 480px) {
    .night-skiing-status-container {
        padding: 3px;
    }

    .night-skiing-svg {
        width: 32px !important;
        height: 32px !important;
    }

    .night-skiing-text {
        font-size: 0.8em;
    }
}

/* Widget styles */
.widget-night-skiing-content {
    text-align: center;
}

.night-skiing-error {
    color: #dc3545;
    font-weight: bold;
    text-align: center;
    padding: 10px;
}

/* For better touch targets on mobile */
.night-skiing-status-container {
    min-height: 40px;
}

/* Smooth transitions for any interactive states */
.night-skiing-svg {
    transition: all 0.2s ease;
}

/* Accessibility focus styles */
.night-skiing-status-container:focus {
    outline: 2px solid #007cba;
    outline-offset: 2px;
}
