/*
 * Orderable Plugin Kompatibilität CSS
 * MINIMAL - Nur Barbarossa Branding-Farben
 * 
 * Lässt Orderable seine eigenen Styles verwenden
 * Überschreibt nur notwendige Markenfarben
 */

/* ===== FONT FAMILY ===== */
.orderable-container,
.orderable-modal,
.orderable-popup,
.orderable-cart-widget,
.orderable-sidebar,
.orderable-panel {
    font-family: 'Inter', sans-serif !important;
}

/* ===== BUTTON FARBEN (Nur Barbarossa-Rot) ===== */
body .orderable-button[class*="add"],
body .orderable-product-add-to-cart,
body .orderable-add-to-cart,
body .orderable-cart-button,
body .orderable-checkout-button,
body button[class*="orderable"][class*="add"],
body .orderable-btn-primary {
    background-color: #eb101e !important;
}

body .orderable-button[class*="add"]:hover,
body .orderable-product-add-to-cart:hover,
body .orderable-add-to-cart:hover,
body .orderable-cart-button:hover,
body .orderable-checkout-button:hover,
body button[class*="orderable"][class*="add"]:hover,
body .orderable-btn-primary:hover {
    background-color: #c40e1a !important;
}

/* ===== PREIS FARBEN ===== */
body .orderable-product-price,
body .orderable-price,
body [class*="orderable"][class*="price"] {
    color: #eb101e !important;
}

/* ===== AKTIVE KATEGORIE FARBEN ===== */
body .orderable-category-button.active,
body .orderable-category-button.is-active,
body .orderable-tabs__link.is-active,
body .orderable-filter-button.active {
    background-color: #eb101e !important;
    color: #ffffff !important;
    border-color: #eb101e !important;
}

/* ===== STEUER ANZEIGE ERZWINGEN ===== */
/* Stelle sicher, dass Steuer-Elemente immer angezeigt werden */
.orderable-cart-total [class*="tax"],
.orderable-cart-total [class*="vat"],
.orderable-cart-total [class*="steuer"],
.orderable-cart-total [class*="MwSt"],
.orderable-cart-total [class*="mwst"],
.orderable-order-summary [class*="tax"],
.orderable-order-summary [class*="vat"],
.orderable-order-summary [class*="steuer"],
.orderable-order-summary [class*="MwSt"],
.orderable-order-summary [class*="mwst"],
[class*="orderable"] [class*="tax"],
[class*="orderable"] [class*="vat"],
[class*="orderable"] [class*="steuer"],
[class*="orderable"] [class*="MwSt"],
[class*="orderable"] [class*="mwst"] {
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
}

/* ===== RESPONSIVE ===== */
@media (max-width: 768px) {
    /* Keine Layout-Änderungen, nur Font */
    .orderable-container,
    .orderable-modal,
    .orderable-popup {
        font-family: 'Inter', sans-serif !important;
    }
    
    /* ===== MOBILE CART LAYOUT FIX ===== */
    /* Nur für die Bestellübersicht (Cart/Order Summary) - sehr spezifisch */
    .orderable-cart-widget .orderable-cart-item,
    .orderable-sidebar .orderable-cart-item,
    .orderable-panel .orderable-cart-item,
    [class*="orderable-cart-widget"] [class*="cart-item"],
    [class*="orderable-sidebar"] [class*="cart-item"],
    [class*="orderable-panel"] [class*="cart-item"] {
        display: flex !important;
        flex-direction: column !important;
        gap: 0.75rem !important;
        position: relative !important;
        padding: 1rem !important;
        padding-right: 3rem !important; /* Platz für Delete-Button */
    }
    
    /* Item Name - Platz für Delete-Button */
    .orderable-cart-widget .orderable-cart-item h3,
    .orderable-cart-widget .orderable-cart-item h4,
    .orderable-sidebar .orderable-cart-item h3,
    .orderable-sidebar .orderable-cart-item h4,
    .orderable-panel .orderable-cart-item h3,
    .orderable-panel .orderable-cart-item h4 {
        padding-right: 2rem !important;
        margin-bottom: 0.5rem !important;
    }
    
    /* Item Details - Mehr Abstand nach unten */
    .orderable-cart-widget .orderable-cart-item [class*="details"],
    .orderable-sidebar .orderable-cart-item [class*="details"],
    .orderable-panel .orderable-cart-item [class*="details"],
    .orderable-cart-widget .orderable-cart-item p,
    .orderable-sidebar .orderable-cart-item p,
    .orderable-panel .orderable-cart-item p {
        margin-bottom: 0.75rem !important;
    }
    
    /* Quantity und Price Container - Mehr Abstand nach unten */
    .orderable-cart-widget .orderable-cart-item [class*="quantity"],
    .orderable-sidebar .orderable-cart-item [class*="quantity"],
    .orderable-panel .orderable-cart-item [class*="quantity"],
    .orderable-cart-widget .orderable-cart-item [class*="price"],
    .orderable-sidebar .orderable-cart-item [class*="price"],
    .orderable-panel .orderable-cart-item [class*="price"] {
        margin-bottom: 1rem !important;
    }
    
    /* Edit Button - KEINE absolute Position, normaler Flow */
    .orderable-cart-widget button[class*="edit"],
    .orderable-cart-widget [class*="edit-button"],
    .orderable-sidebar button[class*="edit"],
    .orderable-sidebar [class*="edit-button"],
    .orderable-panel button[class*="edit"],
    .orderable-panel [class*="edit-button"],
    [class*="orderable-cart-widget"] button[class*="edit"],
    [class*="orderable-sidebar"] button[class*="edit"],
    [class*="orderable-panel"] button[class*="edit"] {
        position: relative !important; /* NICHT absolute */
        align-self: flex-start !important;
        margin-top: 0.75rem !important; /* Mehr Abstand nach oben */
        margin-bottom: 0.5rem !important;
        width: auto !important;
        min-width: 100px !important;
        z-index: 1 !important;
    }
    
    /* Delete Button - Nur in Cart-Widget/Sidebar/Panel */
    .orderable-cart-widget button[class*="delete"],
    .orderable-cart-widget [class*="delete-button"],
    .orderable-sidebar button[class*="delete"],
    .orderable-sidebar [class*="delete-button"],
    .orderable-panel button[class*="delete"],
    .orderable-panel [class*="delete-button"] {
        position: absolute !important;
        top: 1rem !important;
        right: 1rem !important;
        background: transparent !important;
        border: none !important;
        padding: 0.5rem !important;
        z-index: 10 !important;
    }
}
