/* RestaurantDirect – Speisekarte Frontend */

/* ── Farben ─────────────────────────────────────────────────────────── */
:root {
    --rd-primary:      #e84c00;
    --rd-primary-dark: #c43d00;
    --rd-bg:           #f8f9fa;
    --rd-card-bg:      #ffffff;
    --rd-border:       #e5e7eb;
    --rd-text:         #1a1a1a;
    --rd-text-muted:   #6b7280;
    --rd-header-bg:    #ffffff;
    --rd-nav-bg:       #ffffff;
    --rd-nav-active:   var(--rd-primary);
    --rd-cart-bg:      var(--rd-primary);
    --rd-cart-text:    #ffffff;
}

body.rd-fullscreen-page { margin: 0; padding: 0; }

/* Verhindert horizontales Scrollen */
html:has(.rd-menu-wrap),
body:has(.rd-menu-wrap) {
    overflow-x: hidden !important;
    max-width: 100vw !important;
    width: 100% !important;
}

/* Enfold-Sidebar auf Speisekarte-Seite ausblenden */
body:has(.rd-menu-wrap) .sidebar,
body:has(.rd-menu-wrap) #sidebar,
body:has(.rd-menu-wrap) .av-sidebar,
body:has(.rd-menu-wrap) .av-column-sidebar,
body:has(.rd-menu-wrap) .av-layout-cell.av-sidebar-cell,
body:has(.rd-menu-wrap) aside.widget-area,
body:has(.rd-menu-wrap) [class*="sidebar-right"],
body:has(.rd-menu-wrap) [class*="sidebar-left"] {
    display: none !important;
}

/* Enfold-Inhaltsspalte auf volle Breite wenn Sidebar weg */
body:has(.rd-menu-wrap) .av-content-main,
body:has(.rd-menu-wrap) [class*="av-content-main"] {
    width: 100% !important;
    max-width: 100% !important;
    flex: none !important;
}

/* Enfold-Container auf Speisekarte-Seite zurücksetzen */
body:has(.rd-menu-wrap) #wrap_all,
body:has(.rd-menu-wrap) #main,
body:has(.rd-menu-wrap) #top,
body:has(.rd-menu-wrap) #content,
body:has(.rd-menu-wrap) .container,
body:has(.rd-menu-wrap) .av-content-area,
body:has(.rd-menu-wrap) .entry-content,
body:has(.rd-menu-wrap) .post-entry,
body:has(.rd-menu-wrap) [class*="av-section"],
body:has(.rd-menu-wrap) [class*="avia-section"] {
    max-width: 100% !important;
    width: 100% !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    box-sizing: border-box !important;
    overflow-x: hidden !important;
}

/* WooCommerce-Notices auf der Speisekarte-Seite ausblenden */
.rd-menu-wrap ~ .woocommerce-message,
.rd-menu-wrap ~ .woocommerce-notices-wrapper,
.woocommerce-notices-wrapper:has(+ .rd-menu-wrap),
.entry-content > .woocommerce-message,
.entry-content > .woocommerce-notices-wrapper {
    display: none !important;
}

/* ── Speisekarte-Wrapper ─────────────────────────────────────────── */
.rd-menu-wrap {
    width: 100%;
    max-width: 100%;
    margin: 0;
    padding: 0 !important;
    box-sizing: border-box;
    overflow-x: hidden;
}

/* ── Header ──────────────────────────────────────────────────────── */
.rd-menu-header {
    padding: 12px 16px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    position: sticky;
    top: 0;
    z-index: 100;
    background: var(--rd-header-bg);
    border-bottom: 1px solid var(--rd-border);
    box-shadow: 0 1px 4px rgba(0,0,0,.08);
}
body:not(.rd-fullscreen-page) .rd-menu-header { top: 0; }
@media (min-width: 769px) {
    body:not(.rd-fullscreen-page) .rd-menu-header { top: 0; }
}
.rd-menu-header h1 { margin: 0; font-size: 1.05rem; font-weight: 700; flex: 1; }

/* Warenkorb-Button */
.rd-menu-cart-btn {
    border: none;
    border-radius: 20px;
    padding: 8px 14px;
    font-weight: 700;
    font-size: .9rem;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    gap: 6px;
    text-decoration: none !important;
    transition: opacity .15s;
    flex-shrink: 0;
    background: var(--rd-primary);
    color: #fff;
}
.rd-menu-cart-btn:hover { opacity: .88; color: #fff; }
.rd-menu-cart-count {
    background: rgba(255,255,255,.25);
    border-radius: 50%;
    min-width: 20px;
    height: 20px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: .72rem;
    font-weight: 700;
    padding: 0 3px;
}

/* ── Kategorie-Navigation ────────────────────────────────────────── */
.rd-menu-nav {
    border-bottom: 1px solid var(--rd-border);
    overflow-x: auto;
    white-space: nowrap;
    padding: 0 12px;
    scrollbar-width: none;
    -webkit-overflow-scrolling: touch;
    position: sticky;
    top: 49px;
    z-index: 99;
    background: var(--rd-nav-bg);
}
.rd-menu-nav::-webkit-scrollbar { display: none; }
.rd-menu-nav a {
    display: inline-block;
    padding: 11px 14px;
    text-decoration: none;
    font-size: .88rem;
    font-weight: 500;
    border-bottom: 2px solid transparent;
    transition: border-color .15s, color .15s;
    color: var(--rd-text-muted);
}
.rd-menu-nav a:hover,
.rd-menu-nav a.active {
    color: var(--rd-nav-active);
    border-bottom-color: var(--rd-nav-active);
}

/* ── Kategorien + Produkte ───────────────────────────────────────── */
.rd-menu-body { padding: 0 12px 100px; background: var(--rd-bg); }
.rd-menu-section { margin-top: 24px; }
.rd-menu-section-title {
    font-size: 1.1rem;
    font-weight: 700;
    padding: 8px 0 10px;
    border-bottom: 2px solid var(--rd-border);
    margin-bottom: 12px;
    color: var(--rd-text);
}

.rd-menu-item {
    display: flex;
    gap: 12px;
    border-radius: 10px;
    padding: 14px;
    margin-bottom: 10px;
    transition: box-shadow .15s;
    position: relative;
    background: var(--rd-card-bg);
    border: 1px solid var(--rd-border);
    box-shadow: 0 1px 3px rgba(0,0,0,.06);
}
.rd-menu-item:hover { box-shadow: 0 3px 10px rgba(0,0,0,.1); }
.rd-menu-item.rd-sold-out { opacity: .55; }

.rd-menu-img {
    width: 90px; height: 90px;
    border-radius: 8px;
    object-fit: cover;
    flex-shrink: 0;
    align-self: flex-start;
}
.rd-menu-img-placeholder {
    width: 90px; height: 90px;
    border-radius: 8px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 2.2rem;
    flex-shrink: 0;
    align-self: flex-start;
    background: #f3f4f6;
    border: 1px solid var(--rd-border);
}

.rd-menu-info { flex: 1; min-width: 0; }

/* Kopfzeile: Nummer-Badge + Name */
.rd-menu-item-header { display: flex; align-items: center; gap: 8px; margin-bottom: 4px; flex-wrap: wrap; }

.rd-menu-nr {
    font-size: var(--rd-fs-nr, .85rem);
    font-weight: 700;
    padding: 3px 9px;
    border-radius: 6px;
    flex-shrink: 0;
    line-height: 1.4;
    background: var(--rd-nr-bg, var(--rd-primary));
    color: var(--rd-nr-color, #ffffff);
}

.rd-menu-name { font-size: var(--rd-fs-name, 1.08rem); font-weight: 700; color: var(--rd-text); line-height: 1.3; }
.rd-menu-desc { font-size: var(--rd-fs-desc, .83rem); margin: 4px 0 7px; line-height: 1.5; color: var(--rd-text-muted); }
.rd-menu-badges { display: flex; flex-wrap: wrap; gap: 4px; margin-bottom: 6px; }
.rd-menu-badge { font-size: .68rem; padding: 2px 7px; border-radius: 10px; font-weight: 600; background: #ecfdf5; color: #166534; }
.rd-menu-allergens { font-size: .72rem; margin-bottom: 6px; line-height: 1.5; color: var(--rd-text-muted); }

/* Footer: [+ Hinzufügen] [Preis] */
.rd-menu-item-footer { display: flex; align-items: center; gap: 10px; margin-top: 6px; flex-wrap: wrap; }
.rd-menu-price { font-size: var(--rd-fs-price, 1.05rem); font-weight: 700; color: var(--rd-text); white-space: nowrap; }
.rd-menu-price-orig { text-decoration: line-through; font-size: .85rem; margin-right: 4px; color: var(--rd-text-muted); }

.rd-add-btn {
    border: none;
    border-radius: 8px;
    padding: 8px 18px;
    font-weight: 700;
    font-size: var(--rd-fs-btn, .9rem);
    cursor: pointer;
    transition: opacity .15s;
    white-space: nowrap;
    background: var(--rd-primary);
    color: #fff;
}
.rd-add-btn:hover { opacity: .88; }
.rd-add-btn:disabled,
.rd-sold-out .rd-add-btn { cursor: not-allowed; opacity: .5; }
.rd-sold-out-label {
    font-size: .78rem;
    font-weight: 600;
    padding: 8px 12px;
    border-radius: 8px;
    background: #f3f4f6;
    color: var(--rd-text-muted);
}

/* ── Toast-Nachricht ─────────────────────────────────────────────── */
.rd-toast {
    position: fixed;
    bottom: 80px;
    left: 50%;
    transform: translateX(-50%) translateY(20px);
    padding: 10px 20px;
    border-radius: 20px;
    font-size: .88rem;
    font-weight: 600;
    opacity: 0;
    transition: opacity .25s, transform .25s;
    z-index: 200;
    pointer-events: none;
    white-space: nowrap;
}
.rd-toast.show { opacity: 1; transform: translateX(-50%) translateY(0); }

/* ── Modus-Banner ────────────────────────────────────────────────── */
.rd-mode-banner {
    padding: 10px 16px;
    font-size: .88rem;
    text-align: center;
    border-bottom: 1px solid rgba(0,0,0,.08);
}
.rd-delivery-mode { background: #dcfce7; color: #15803d; }
.rd-pickup-mode   { background: #fef9c3; color: #854d0e; }

/* ── Geschlossen-Banner ──────────────────────────────────────────── */
.rd-closed-banner {
    border-radius: 8px;
    padding: 12px 16px;
    margin: 12px 0;
    font-weight: 600;
    text-align: center;
    font-size: .9rem;
    background: #fee2e2;
    color: #991b1b;
    border: 1px solid #fca5a5;
}

/* ── Warenkorb-Button (Mitte unten, immer sichtbar) ─────────────────── */
.rd-cart-bar {
    position: fixed;
    bottom: 20px;
    left: 50%;
    transform: translateX(-50%);
    display: inline-flex;
    align-items: center;
    gap: 10px;
    padding: 13px 22px;
    border-radius: 50px;
    z-index: 150;
    cursor: pointer;
    background: #f59e0b;
    color: #1a1a1a;
    box-shadow: 0 4px 18px rgba(0,0,0,.22);
    white-space: nowrap;
    transition: opacity .15s, box-shadow .15s;
    min-width: 160px;
    justify-content: center;
}
.rd-cart-bar:hover { opacity: .92; box-shadow: 0 6px 22px rgba(0,0,0,.28); }

/* Warenkorb-Icon + roter Zahl-Badge */
.rd-cart-bar-icon {
    position: relative;
    display: flex;
    align-items: center;
    flex-shrink: 0;
}
.rd-cart-bar-badge {
    position: absolute;
    top: -9px;
    right: -10px;
    background: #dc2626;
    color: #fff;
    border-radius: 50%;
    min-width: 18px;
    height: 18px;
    font-size: .68rem;
    font-weight: 700;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0 3px;
    line-height: 1;
}
.rd-cart-bar-badge.rd-cart-bar-badge-empty { display: none; }

.rd-cart-bar-total { font-size: .95rem; font-weight: 600; }
.rd-cart-bar-cta   { font-weight: 700; font-size: .95rem; display: none; }
.rd-cart-bar.rd-has-items .rd-cart-bar-cta   { display: block; }
.rd-cart-bar.rd-has-items .rd-cart-bar-total { font-weight: 700; }

/* ── Mobile (≤ 520px) ────────────────────────────────────────────── */
@media (max-width: 520px) {
    /* Header kompakter */
    .rd-menu-header { padding: 10px 12px; }
    .rd-menu-header h1 { font-size: .95rem; }
    .rd-menu-cart-btn { padding: 7px 11px; font-size: .82rem; }

    /* Sticky Nav startet direkt unter dem Header (~45px) */
    .rd-menu-nav { top: 45px; padding: 0 8px; }
    .rd-menu-nav a { padding: 9px 10px; font-size: .82rem; }

    /* Produkt-Body Abstand */
    .rd-menu-body { padding: 0 8px 100px; }
    .rd-menu-section-title { font-size: 1rem; }

    /* Produkt-Karte: kleineres Bild auf sehr kleinen Screens */
    .rd-menu-item { padding: 10px; gap: 10px; }
    .rd-menu-img,
    .rd-menu-img-placeholder { width: 72px; height: 72px; }

    /* iOS: verhindert Auto-Zoom bei Input-Focus */
    input, select, textarea { font-size: 16px !important; }

    /* Namen + Preis */
    .rd-menu-name { font-size: 1rem; }
    .rd-menu-price { font-size: 1rem; }
    .rd-add-btn { padding: 7px 14px; font-size: .85rem; }

    /* Modus-Banner */
    .rd-mode-banner { font-size: .82rem; padding: 8px 12px; }

    /* Cart-Button kompakter auf Mobile */
    .rd-cart-bar { padding: 12px 18px; bottom: 16px; min-width: 140px; }
    .rd-cart-bar-total { font-size: .88rem; }
    .rd-cart-bar-cta { font-size: .85rem; }
}

/* ── Sehr kleine Screens (≤ 360px) ──────────────────────────────── */
@media (max-width: 360px) {
    .rd-menu-img,
    .rd-menu-img-placeholder { width: 60px; height: 60px; }
    .rd-menu-name { font-size: .95rem; }
    .rd-add-btn { padding: 6px 10px; font-size: .8rem; }
}
