/* Snacks1 menu pricing layout normalization.
 * Keeps item names flexible and aligns Ta med / Spis inne prices consistently
 * across all embedded Elementor menu templates on desktop, tablet, and mobile.
 */

/* Shared menu heading row: Menu | Ta med | Spis inne */
#accordian .eael-tabs-content .elementor-element-3af8096 > .elementor-container {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) 160px 160px !important;
    align-items: center !important;
    column-gap: 0 !important;
    padding-left: 20px !important;
    padding-right: 32px !important;
}

#accordian .eael-tabs-content .elementor-element-3af8096 .elementor-element-bb97744,
#accordian .eael-tabs-content .elementor-element-3af8096 .elementor-element-b14e646 {
    display: none !important;
}

#accordian .eael-tabs-content .elementor-element-3af8096 .elementor-element-f0ccc50,
#accordian .eael-tabs-content .elementor-element-3af8096 .elementor-element-9586a11,
#accordian .eael-tabs-content .elementor-element-3af8096 .elementor-element-174b10d {
    width: auto !important;
    max-width: none !important;
    margin: 0 !important;
}

#accordian .eael-tabs-content .elementor-element-3af8096 .elementor-element-f0ccc50 {
    min-width: 0 !important;
}

#accordian .eael-tabs-content .elementor-element-3af8096 .elementor-element-9586a11,
#accordian .eael-tabs-content .elementor-element-3af8096 .elementor-element-174b10d {
    text-align: center !important;
}

#accordian .eael-tabs-content .elementor-element-3af8096 .elementor-element-9586a11 .elementor-widget-container,
#accordian .eael-tabs-content .elementor-element-3af8096 .elementor-element-174b10d .elementor-widget-container {
    text-align: center !important;
    margin: 0 !important;
}

/* Shared menu item row. */
#accordian .eael-tabs-content .eael-accordion-header {
    display: flex !important;
    align-items: center !important;
    min-width: 0 !important;
}

#accordian .eael-tabs-content h2.eael-accordion-tab-title {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) 320px !important;
    align-items: center !important;
    column-gap: 16px !important;
    flex: 1 1 auto !important;
    min-width: 0 !important;
    width: auto !important;
    margin: 0 !important;
}

#accordian .eael-tabs-content h2.eael-accordion-tab-title > .title {
    min-width: 0 !important;
    overflow-wrap: anywhere;
}

#accordian .eael-tabs-content span.main-spic {
    float: none !important;
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    align-items: center !important;
    max-width: none !important;
    width: 100% !important;
    margin: 0 !important;
    text-align: center !important;
}

#accordian .eael-tabs-content span.main-spic > span,
#accordian .eael-tabs-content span.main-spic > span:first-child {
    display: block !important;
    width: auto !important;
    min-width: 0 !important;
    margin: 0 !important;
    text-align: center !important;
    white-space: nowrap !important;
}

#accordian .eael-tabs-content .eael-accordion-header .fa-toggle,
#accordian .eael-tabs-content .eael-accordion-header > .fa-toggle-svg {
    flex: 0 0 24px !important;
    width: 24px !important;
    margin-left: 8px !important;
    text-align: center !important;
}

#accordian .eael-tabs-content .snacks1-duplicate-price-row {
    display: none !important;
}

#accordian .eael-tabs-content .snacks1-price-unconfirmed {
    opacity: 0.65;
    font-weight: 600;
}

/* Expanded allergen/details content must stay inside the menu width.
 * This also overrides the legacy global `.eael-accordion-content p { display: ruby-text !important; }`
 * rule that causes long allergen lists to overflow horizontally on mobile.
 */
#accordian .eael-tabs-content,
#accordian .eael-tabs-content .eael-tab-content-item,
#accordian .eael-tabs-content .eael-adv-accordion,
#accordian .eael-tabs-content .eael-accordion-list,
#accordian .eael-tabs-content .eael-accordion-content {
    min-width: 0 !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
}

#accordian .eael-tabs-content .eael-accordion-content {
    overflow-x: hidden !important;
}

#accordian .eael-tabs-content .eael-accordion-content p,
#accordian .eael-tabs-content .eael-accordion-content div,
#accordian .eael-tabs-content .eael-accordion-content span {
    display: block !important;
    min-width: 0 !important;
    max-width: 100% !important;
    white-space: normal !important;
    overflow-wrap: anywhere !important;
    word-break: normal !important;
    box-sizing: border-box !important;
}

/* Tablet: keep the same three-column model with narrower price columns. */
@media (max-width: 991px) {
    #accordian .eael-tabs-content .elementor-element-3af8096 > .elementor-container {
        grid-template-columns: minmax(0, 1fr) 110px 110px !important;
        padding-left: 0 !important;
        padding-right: 32px !important;
    }

    #accordian .eael-tabs-content h2.eael-accordion-tab-title {
        grid-template-columns: minmax(0, 1fr) 220px !important;
        column-gap: 12px !important;
    }

    #accordian .eael-tabs-content span.main-spic {
        margin: 0 !important;
    }
}

/* Mobile: reserve two stable price columns and allow only the item name to wrap. */
@media (max-width: 600px) {
    #accordian .eael-tabs-content .elementor-element-3af8096 > .elementor-container {
        grid-template-columns: minmax(0, 1fr) 66px 66px !important;
        padding-left: 10px !important;
        /* 24px toggle + 6px gap + 10px row edge = exact price alignment. */
        padding-right: 40px !important;
    }

    #accordian .eael-tabs-content .elementor-element-3af8096 .elementor-heading-title {
        margin-left: 0 !important;
        font-size: 15px !important;
        line-height: 1.25 !important;
    }

    #accordian .eael-tabs-content .elementor-element-3af8096 .elementor-element-9586a11,
    #accordian .eael-tabs-content .elementor-element-3af8096 .elementor-element-174b10d {
        font-size: 11px !important;
        line-height: 1.2 !important;
    }

    /* The legacy frontend script inserts an unclassed `Allergener` span between
     * the title grid and toggle icon. Keep the label visible, but remove it from
     * the flex row so it cannot collapse long item names (especially Tallerken).
     */
    /* Elementor has the menu accordion column (6b0f0c9) saved as 67% wide on
     * mobile in Tallerken. Force the shared menu accordion column to occupy the
     * full row so category changes never collapse the item-name column.
     */
    #accordian .eael-tabs-content .elementor-element-3d6af47 > .elementor-container,
    #accordian .eael-tabs-content .elementor-element-6b0f0c9,
    #accordian .eael-tabs-content .elementor-element-6b0f0c9 > .elementor-widget-wrap,
    #accordian .eael-tabs-content .elementor-element-6b0f0c9 .elementor-widget-container,
    #accordian .eael-tabs-content .eael-adv-accordion,
    #accordian .eael-tabs-content .eael-accordion-list,
    #accordian .eael-tabs-content .eael-accordion-header {
        width: 100% !important;
        max-width: 100% !important;
        flex: 0 0 100% !important;
        box-sizing: border-box !important;
    }

    #accordian .eael-tabs-content .elementor-element-6b0f0c9 {
        flex-basis: 100% !important;
    }

    /* Mobile row layout: title/prices live in their own grid and the toggle gets
     * a dedicated column. This prevents long names from ever pushing prices or
     * dropping the arrow below the row. */
    #accordian .eael-tabs-content .eael-accordion-header {
        display: grid !important;
        grid-template-columns: minmax(0, 1fr) 24px !important;
        grid-template-rows: auto auto !important;
        column-gap: 6px !important;
        row-gap: 3px !important;
        align-items: start !important;
        flex-wrap: nowrap !important;
        position: relative !important;
        padding: 13px 10px 7px !important;
    }

    #accordian .eael-tabs-content .eael-accordion-header > .fa-accordion-icon,
    #accordian .eael-tabs-content .eael-accordion-header > .fa-accordion-icon-svg {
        display: none !important;
    }

    #accordian .eael-tabs-content h2.eael-accordion-tab-title {
        grid-column: 1 !important;
        grid-row: 1 !important;
        display: grid !important;
        grid-template-columns: minmax(0, 1fr) 132px !important;
        column-gap: 7px !important;
        align-items: start !important;
        width: 100% !important;
        min-width: 0 !important;
        font-size: 11px !important;
        line-height: 1.28 !important;
        margin: 0 !important;
    }

    #accordian .eael-tabs-content h2.eael-accordion-tab-title > .title {
        min-width: 0 !important;
        margin: 0 !important;
        padding: 0 2px 0 0 !important;
        overflow-wrap: normal !important;
        word-break: normal !important;
        hyphens: none !important;
    }

    #accordian .eael-tabs-content span.main-spic {
        display: grid !important;
        grid-template-columns: 66px 66px !important;
        width: 132px !important;
        min-width: 132px !important;
        margin: 0 !important;
        align-self: start !important;
    }

    #accordian .eael-tabs-content span.main-spic > span,
    #accordian .eael-tabs-content span.main-spic > span:first-child {
        margin: 0 !important;
        padding: 0 !important;
        font-size: 11px !important;
        line-height: 1.28 !important;
        text-align: center !important;
        white-space: nowrap !important;
    }

    /* Legacy script inserts the Allergener label between the h2 and toggle. It
     * now occupies row two instead of stealing horizontal space from the title. */
    #accordian .eael-tabs-content .eael-accordion-header > h2.eael-accordion-tab-title + span {
        grid-column: 1 !important;
        grid-row: 2 !important;
        position: static !important;
        justify-self: start !important;
        width: auto !important;
        max-width: 100% !important;
        margin: 0 !important;
        padding: 0 !important;
        font-size: 10px !important;
        line-height: 1.15 !important;
        font-weight: 400 !important;
        text-transform: none !important;
        white-space: nowrap !important;
    }

    #accordian .eael-tabs-content .eael-accordion-header .fa-toggle,
    #accordian .eael-tabs-content .eael-accordion-header > .fa-toggle-svg {
        grid-column: 2 !important;
        grid-row: 1 !important;
        align-self: center !important;
        justify-self: center !important;
        flex: none !important;
        width: 24px !important;
        min-width: 24px !important;
        margin: 0 !important;
        text-align: center !important;
    }
}

@media (max-width: 360px) {
    #accordian .eael-tabs-content .elementor-element-3af8096 > .elementor-container {
        grid-template-columns: minmax(0, 1fr) 62px 62px !important;
        padding-left: 8px !important;
        padding-right: 28px !important;
    }

    #accordian .eael-tabs-content h2.eael-accordion-tab-title {
        grid-template-columns: minmax(0, 1fr) 124px !important;
        column-gap: 6px !important;
        font-size: 11px !important;
    }

    #accordian .eael-tabs-content span.main-spic {
        grid-template-columns: 62px 62px !important;
    }

    #accordian .eael-tabs-content span.main-spic > span,
    #accordian .eael-tabs-content span.main-spic > span:first-child {
        font-size: 11px !important;
    }
}