/**
 * Mühle Meißner – Custom Utilities & Accessibility Tweaks
 * Ergänzt das UIkit-Theme mit Design-Tokens und WCAG 2.2 Optimierungen.
 */

:root {
    --mm-color-primary: #a27b3b;
    --mm-color-primary-hover: #8f692a;
    --mm-color-notice-bg: #fff8e6;
    --mm-color-notice-border: #d99a26;
    --mm-color-notice-title: #8c610d;
    --mm-color-notice-text: #343434;
    --mm-color-holiday-text: #9e5200;
}

/* --- Hinweis-Boxen & Banner --- */
.mm-notice-box {
    background: var(--mm-color-notice-bg);
    border-left: 5px solid var(--mm-color-notice-border);
    padding: 20px 25px;
    border-radius: 4px;
}

.mm-notice-box-compact {
    background: var(--mm-color-notice-bg);
    border-left: 4px solid var(--mm-color-notice-border);
    padding: 16px 20px;
    border-radius: 4px;
}

.mm-notice-icon {
    color: var(--mm-color-notice-border);
}

.mm-notice-title {
    color: var(--mm-color-notice-title);
    font-weight: 600;
    font-family: Lato, sans-serif;
    font-size: 17px;
    line-height: 1.4;
    text-transform: none;
}

.mm-notice-text {
    color: var(--mm-color-notice-text);
    line-height: 1.6;
    font-size: 15px;
}

/* --- Vorschau künftige Öffnungszeiten --- */
.mm-hours-preview-card {
    background: #fafafa;
    border: 1px solid #e0e0e0;
    border-left: 4px solid var(--mm-color-notice-border);
    border-radius: 4px;
    padding: 16px 20px;
}

.mm-holiday-note {
    color: var(--mm-color-holiday-text);
    line-height: 1.5;
}

/* --- Barrierefreiheit: Skip-Link --- */
.mm-skip-link {
    position: absolute;
    top: -9999px;
    left: 10px;
    z-index: 10000;
    background: #222;
    color: #fff;
    padding: 10px 16px;
    border-radius: 4px;
    font-weight: 600;
    text-decoration: none;
    box-shadow: 0 4px 10px rgba(0,0,0,0.2);
}

.mm-skip-link:focus {
    top: 10px;
    outline: 2px solid var(--mm-color-primary);
}

/* --- Barrierefreiheit: Tastatur-Fokus --- */
a:focus-visible,
button:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible {
    outline: 2px solid var(--mm-color-primary) !important;
    outline-offset: 2px !important;
}

/* --- Barrierefreiheit: Reduzierte Bewegung --- */
@media (prefers-reduced-motion: reduce) {
    *,
    *::before,
    *::after {
        animation-duration: 0.01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: 0.01ms !important;
        scroll-behavior: auto !important;
    }
}

/* --- Mobiles Menü: WCAG 2.2 Kontrast & Lesbarkeit --- */
.uk-nav-primary > li:not(.uk-active) > a {
    color: #343434 !important;
}

.uk-nav-primary > li:not(.uk-active) > a:hover {
    color: var(--mm-color-primary) !important;
}

.uk-nav-primary > li.uk-active > a {
    color: #111 !important;
    font-weight: 500;
}

/* --- Mobiler Status- und Anruf-Button: Saubere Proportionen & Mehrzeiligkeit --- */
.tm-header-mobile-actions .uk-button {
    white-space: normal !important;
    line-height: 1.35 !important;
    height: auto !important;
    min-height: 38px;
    padding: 8px 18px !important;
    border-radius: 24px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    text-align: center;
}

/* --- Hintergrund: Vertikale Streifen des Standard-Themes entfernen --- */
.uk-section-default {
    background-image: none !important;
}

/* --- H1 Unterzeile (SEO & harmonische Typografie) --- */
.mm-heading-subline {
    display: block;
    text-transform: none;
    letter-spacing: normal;
    font-size: 1.25rem;
    font-weight: 400;
    line-height: 1.4;
    color: #555;
    margin-top: 10px;
}
@media (max-width: 639px) {
    .mm-heading-subline {
        font-size: 1.05rem;
    }
}

/* --- Inline-CSS Auslagerung --- */
#page\#0 .el-image {
    padding: 5px;
}
