/* Error-Styles */
.widget-error {
    background-color: var(--color-danger);
    color: var(--color-text);
    padding: 20px;
    border-radius: 8px;
    margin: 20px 0;
    text-align: center;
}

.widget-error h1 {
    font-size: var(--font-size-3xl);
    font-weight: var(--font-weight-bold);
    margin-bottom: 15px;
}

.widget-error p {
    font-size: var(--font-size-lg);
    margin-bottom: 10px;
}

.widget-error-code {
    font-size: var(--font-size-2xl);
    font-weight: var(--font-weight-bold);
    color: var(--color-text);
    margin-bottom: 20px;
}

.widget-error-message {
    background-color: rgba(255, 255, 255, 0.1);
    padding: 15px;
    border-radius: 6px;
    margin-top: 20px;
    font-family: monospace;
    font-size: var(--font-size-small);
    text-align: left;
    overflow-x: auto;
}

/* Responsive Design */
@media (max-width: 768px) {
    .widget-error {
        padding: 15px;
    }
    
    .widget-error h1 {
        font-size: var(--font-size-2xl);
    }
    
    .widget-error p {
        font-size: var(--font-size-base);
    }
    
    .widget-error-code {
        font-size: var(--font-size-xl);
    }
}