/* ========================================
   Elementor Loop Grid Filters
   Based on provided UI design
   ======================================== */

   .elementor-filter-container {
    display: flex;
    flex-wrap: wrap;
    gap: 15px;
    margin-bottom: 30px;
    align-items: center;
    background-color: #FBF8F4; /* Light beige background - matches design */
    padding: 20px;
    border-radius: 8px;
	font-family: "Interstate Condensed Bold", Sans-serif;
}

.filter-search-wrapper,
.filter-category-wrapper,
.filter-diet-wrapper {
    position: relative;
    flex: 1;
    min-width: 200px;
}

/* Filter action buttons - Find a Location & Menu with Prices */
.filter-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    padding: 12px 20px;
    border-radius: 6px;
    font-size: 16px;
    font-weight: 600;
    text-transform: uppercase;
    text-decoration: none;
    cursor: pointer;
    transition: all 0.2s ease;
    box-sizing: border-box;
    white-space: nowrap;
    border: 1px solid rgba(0, 0, 0, 0.12);
}

.filter-btn .filter-btn-icon {
    flex-shrink: 0;
}

/* Find a Location - white bg, gray border */
.filter-btn-location {
    background-color: #fff;
    color: #52463C;
}

.filter-btn-location:hover {
    background-color: #f8f6f3;
    border-color: rgba(0, 0, 0, 0.18);
}

/* Menu with Prices - dark reddish-brown */
.filter-btn-menu {
    background-color: #8B3E2F;
    color: #fff;
    border-color: #8B3E2F;
}

.filter-btn-menu:hover {
    background-color: #76352a;
    border-color: #76352a;
    color: #fff;
}

.filter-search-input,
.filter-category-select,
.filter-diet-select {
    width: 100%;
    padding: 12px 45px 12px 20px;
    border: none;
    border-radius: 6px;
    background-color: #fff;
    font-size: 16px;
    line-height: 1.5;
    color: #333;
    box-sizing: border-box;
    appearance: none;
    -webkit-appearance: none;
    -moz-appearance: none;
    cursor: pointer;
    transition: all 0.2s ease;
    font-weight: 600;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
}

.filter-search-input {
    padding-left: 45px !important;
    cursor: text;
	font-size: 16px;
	border-radius: 4px;
}

.filter-search-input:focus,
.filter-category-select:focus,
.filter-diet-select:focus {
    outline: none;
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.15);
    border-color: #728a75;
}

.filter-search-input::placeholder {
    color: #999;
    font-weight: 400;
}

/* Search icon - using Font Awesome or Unicode */
.filter-search-wrapper::before {
    content: '\f002';
    font-family: 'Font Awesome 5 Free', 'FontAwesome';
    font-weight: 900;
    position: absolute;
    left: 15px;
    top: 50%;
    transform: translateY(-50%);
    color: #999;
    pointer-events: none;
    z-index: 1;
    font-size: 16px;
}

/* If Font Awesome not available, use Unicode search icon */
@supports not (font-family: 'Font Awesome 5 Free') {
    .filter-search-wrapper::before {
        content: '🔍';
        font-family: Arial, sans-serif;
    }
}

/* Dropdown arrow */
.filter-category-wrapper::after,
.filter-diet-wrapper::after {
    content: '\f078';
    font-family: 'Font Awesome 5 Free', 'FontAwesome';
    font-weight: 900;
    position: absolute;
    right: 15px;
    top: 50%;
    transform: translateY(-50%);
    color: #999;
    pointer-events: none;
    z-index: 1;
    font-size: 12px;
}

/* If Font Awesome not available, use Unicode arrow */
@supports not (font-family: 'Font Awesome 5 Free') {
    .filter-category-wrapper::after,
    .filter-diet-wrapper::after {
        content: '▼';
        font-family: Arial, sans-serif;
        font-size: 10px;
    }
}

/* Responsive */
@media (max-width: 992px) {
    .filter-btn {
        flex: 1;
        min-width: 160px;
    }
}

@media (max-width: 768px) {
    .elementor-filter-container {
        flex-direction: column;
    }
    
    .filter-search-wrapper,
    .filter-category-wrapper,
    .filter-diet-wrapper {
        width: 100%;
        min-width: 100%;
    }
    
    .filter-btn {
        width: 100%;
        min-width: 100%;
    }
}

/* Loading state */
.elementor-filter-container.loading .filter-search-input,
.elementor-filter-container.loading .filter-category-select,
.elementor-filter-container.loading .filter-diet-select {
    opacity: 0.6;
    pointer-events: none;
}

/* Post items styling (fallback) */
.elementor-posts-container.filter-loading {
    opacity: 0.5;
    pointer-events: none;
    transition: opacity 0.3s ease;
}

.elementor-post-item {
    margin-bottom: 20px;
}

.elementor-post__thumbnail {
    overflow: hidden;
    border-radius: 6px;
    margin-bottom: 15px;
}

.elementor-post__thumbnail img {
    width: 100%;
    height: auto;
    display: block;
    transition: transform 0.3s ease;
}

.elementor-post__thumbnail:hover img {
    transform: scale(1.05);
}

.elementor-post__title {
    margin: 0 0 10px 0;
    font-size: 18px;
    font-weight: 600;
}

.elementor-post__title a {
    color: #222;
    text-decoration: none;
    transition: color 0.2s ease;
}

.elementor-post__title a:hover {
    color: #892c36;
}

.elementor-post__price {
    font-size: 18px;
    font-weight: 700;
    color: #222;
    margin: 10px 0;
}

.elementor-post__price .price-amount {
    color: #B59460;
}

.elementor-post__description {
    font-size: 14px;
    color: #666;
    margin: 8px 0;
    line-height: 1.5;
}

.elementor-post__meta {
    font-size: 12px;
    color: #666;
    margin-bottom: 10px;
}

.elementor-post__order-button {
    margin-top: 15px;
}

.elementor-post__order-button .btn.btn-order {
    display: inline-block;
    background-color: #B59460;
    color: #fff;
    font-family: "Interstate Condensed Bold", Sans-serif;
    font-size: 18px;
    font-weight: 700;
    text-transform: uppercase;
    line-height: 100%;
    border: none;
    border-radius: 0px 20px 0px 20px;
    padding: 12px 24px;
    text-decoration: none;
    text-align: center;
    transition: all 0.2s ease;
    cursor: pointer;
    width: 100%;
    box-sizing: border-box;
}

.elementor-post__order-button .btn.btn-order:hover {
    background-color: #9a7d4f;
    color: #fff;
    transform: translateY(-1px);
    box-shadow: 0 2px 8px rgba(181, 148, 96, 0.3);
}

.elementor-post__categories,
.elementor-post__diets,
.elementor-post__tags {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-top: 10px;
}

.elementor-post-category,
.elementor-post-diet,
.elementor-post-tag {
    display: inline-block;
    padding: 4px 12px;
    background-color: #f0f0f0;
    border-radius: 4px;
    font-size: 12px;
    color: #666;
}

.elementor-posts-empty {
    text-align: center;
    padding: 40px 20px;
    color: #666;
}

.elementor-pagination {
    margin-top: 30px;
    text-align: center;
}

.elementor-pagination .page-numbers {
    display: inline-block;
    padding: 8px 12px;
    margin: 0 4px;
    background-color: #fff;
    border: 1px solid #ddd;
    border-radius: 4px;
    text-decoration: none;
    color: #222;
    transition: all 0.2s ease;
}

.elementor-pagination .page-numbers:hover,
.elementor-pagination .page-numbers.current {
    background-color: #892c36;
    color: #fff;
    border-color: #892c36;
}


/* ========================================
   Tray / Menu Category Group Headings
   (Same style for taxonomy=tray and taxonomy=menu_categories)
   ======================================== */

.tray-group-heading,
.category-group-heading {
    grid-column: 1 / -1;
    width: 100%;
    margin: 40px 0 30px 0;
    padding: 20px 0;
    background-image: url('/wp-content/uploads/2026/01/vector-105-1024x221.png');
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
    text-align: center;
    position: relative;
}

.tray-group-heading:first-child,
.category-group-heading:first-child {
    margin-top: 0;
}

.tray-group-heading-title,
.category-group-heading-title {
    font-family: "Interstate Condensed Bold", "Interstate Condensed", sans-serif;
    font-style: normal;
    font-weight: 400;
    font-size: 40px;
    line-height: 36px;
    color: rgb(151, 57, 33);
    margin: 0;
    padding: 0;
    text-transform: uppercase;
    position: relative;
    padding: 17px !important;
    z-index: 1;
}

/* Responsive adjustments for tray / menu category headings */
@media (max-width: 768px) {
    .tray-group-heading-title,
    .category-group-heading-title {
        font-size: 32px;
        line-height: 28px;
    }
}

@media (max-width: 480px) {
    .tray-group-heading-title,
    .category-group-heading-title {
        font-size: 28px;
        line-height: 24px;
    }
}

/* ========================================
   Elementor loop template 32084
   Used for menu (and catering) filter results so design matches desired template
   ======================================== */

.elementor-32084 .elementor-element.elementor-element-e1e2dbb {
    --display: flex;
    --flex-direction: column;
    --container-widget-width: 100%;
    --container-widget-height: initial;
    --container-widget-flex-grow: 0;
    --container-widget-align-self: initial;
    --flex-wrap-mobile: wrap;
    border-style: none;
    --border-style: none;
    --border-radius: 20px 0 20px 0;
    box-shadow: 8px 8px 36px 0 rgba(0, 0, 0, 0.15);
    --margin-top: 0;
    --margin-bottom: 0;
    --margin-left: 0;
    --margin-right: 0;
    --padding-top: 0;
    --padding-bottom: 20px;
    --padding-left: 0;
    --padding-right: 0;
    --z-index: 10;
}

.elementor-32084 .elementor-element.elementor-element-e1e2dbb.e-con {
    --align-self: stretch;
}

.elementor-32084 .elementor-element.elementor-element-fa54dab > .elementor-widget-container {
    border-radius: 20px 0 0 0;
    box-shadow: 2.47px 2.47px 19.79px 0 rgba(0, 0, 0, 0.15);
}

.elementor-32084 .elementor-element.elementor-element-fa54dab img {
    border-style: none;
    border-radius: 20px 0 0 0;
}

/* Menu image container - fixed height, image covers */
.menu-image .elementor-widget-container {
    height: 14rem !important;
    overflow: hidden;
}

.menu-image .elementor-widget-container img {
    object-fit: cover;
    height: 100%;
    width: 100%;
}

/* Excerpt/description - remove extra margins */
.catering.type-catering p,
.menu.type-menu p {
    margin-block: 0;
}

/* ========================================
   Card hover effects - filtered results & Elementor loop cards
   Scale image when hovering anywhere on card, slight lift, enhanced shadow
   ======================================== */

.elementor-loop-container .e-loop-item {
    transition: transform 0.3s ease;
}

.elementor-loop-container .e-loop-item:hover {
    transform: translateY(-0.25rem);
}

/* Ensure image container has overflow hidden for scale effect */
.elementor-loop-container .e-loop-item .elementor-element-fa54dab > .elementor-widget-container,
.elementor-loop-container .e-loop-item .menu-image .elementor-widget-container {
    overflow: hidden;
}

/* Image scale on CARD hover (not just image) - overrides Elementor e-transform */
.elementor-loop-container .e-loop-item .elementor-element-fa54dab img,
.elementor-loop-container .e-loop-item .menu-image img {
    transition: transform 0.3s ease;
}

/* Trigger image scale when hovering anywhere on the card */
.elementor-loop-container .e-loop-item:hover .elementor-element-fa54dab img,
.elementor-loop-container .e-loop-item:hover .menu-image img,
.elementor-loop-container .elementor-element-e1e2dbb:hover .elementor-element-fa54dab img,
.elementor-loop-container .elementor-element-e1e2dbb:hover .menu-image img {
    transform: scale(1.05) !important;
}

/* Card inner container hover shadow (for elementor-32084 cards) */
.elementor-loop-container .e-loop-item .elementor-element-e1e2dbb {
    transition: box-shadow 0.3s ease;
}

.elementor-loop-container .e-loop-item:hover .elementor-element-e1e2dbb,
.elementor-loop-container .elementor-element-e1e2dbb:hover {
    box-shadow: 8px 12px 40px 0 rgba(0, 0, 0, 0.18);
}

.elementor-32084 .elementor-element.elementor-element-a018bf0 {
    --display: flex;
    --position: absolute;
    --flex-direction: row;
    --container-widget-width: initial;
    --container-widget-height: 100%;
    --container-widget-flex-grow: 1;
    --container-widget-align-self: stretch;
    --flex-wrap-mobile: wrap;
    --justify-content: center;
    top: 0;
}

body:not(.rtl) .elementor-32084 .elementor-element.elementor-element-a018bf0 {
    left: 0;
}

body.rtl .elementor-32084 .elementor-element.elementor-element-a018bf0 {
    right: 0;
}

.elementor-32084 .elementor-element.elementor-element-48e8803 {
    width: var(--container-widget-width, 180px);
    max-width: 180px;
    --container-widget-width: 180px;
    --container-widget-flex-grow: 0;
    text-align: center;
}

.elementor-32084 .elementor-element.elementor-element-48e8803 > .elementor-widget-container {
    background-color: var(--e-global-color-2cd823f);
    padding: 10px;
    border-radius: 0 0 19.79px 19.79px;
}

.elementor-32084 .elementor-element.elementor-element-48e8803 .elementor-heading-title {
    font-family: "Interstate Condensed Bold", "Interstate Condensed", sans-serif;
    font-size: 16px;
    font-weight: 700;
    text-transform: uppercase;
    color: var(--e-global-color-astglobalcolor6);
}

.elementor-32084 .elementor-element.elementor-element-f803ae5 {
    text-align: center;
}

.elementor-32084 .elementor-element.elementor-element-f803ae5 .elementor-heading-title {
    font-family: "Interstate Condensed Bold", sans-serif;
    font-size: 28px;
    font-weight: 700;
    text-transform: uppercase;
    color: var(--e-global-color-astglobalcolor4);
}

.elementor-32084 .elementor-element.elementor-element-b5b881f .elementor-button {
    background-color: var(--e-global-color-accent);
    font-family: "Interstate Condensed Bold", sans-serif;
    font-size: 20px;
    font-weight: 700;
    line-height: 100%;
    border-radius: 20px 0 20px 0;
    padding: 12px 24px;
}

.elementor-32084 .elementor-element.elementor-element-b5b881f .elementor-button:hover,
.elementor-32084 .elementor-element.elementor-element-b5b881f .elementor-button:focus {
    background-color: var(--e-global-color-61decf3);
    color: var(--e-global-color-13193ca);
}

.elementor-32084 .elementor-element.elementor-element-b5b881f {
    width: 100%;
    max-width: 100%;
}

.elementor-32084 .elementor-element.elementor-element-b5b881f.elementor-element {
    --align-self: flex-start;
}

.elementor-32084 .elementor-element.elementor-element-b5b881f .elementor-button:hover svg,
.elementor-32084 .elementor-element.elementor-element-b5b881f .elementor-button:focus svg {
    fill: var(--e-global-color-13193ca);
}

@media (max-width: 1200px) {
    .elementor-32084 .elementor-element.elementor-element-a018bf0 {
        --flex-direction: row;
        --container-widget-width: calc((1 - var(--container-widget-flex-grow)) * 100%);
        --container-widget-height: 100%;
        --container-widget-flex-grow: 1;
        --container-widget-align-self: stretch;
        --flex-wrap-mobile: wrap;
        --justify-content: center;
        --align-items: center;
        --gap: 0;
        --row-gap: 0;
        --column-gap: 0;
        --margin-top: 0;
        --margin-bottom: 0;
        --margin-left: 0;
        --margin-right: 0;
        --padding-top: 0;
        --padding-bottom: 0;
        --padding-left: 0;
        --padding-right: 0;
    }

    .elementor-32084 .elementor-element.elementor-element-48e8803 > .elementor-widget-container {
        margin: 0 auto;
    }

    .elementor-32084 .elementor-element.elementor-element-48e8803 {
        --container-widget-width: 130px;
        --container-widget-flex-grow: 0;
        width: var(--container-widget-width, 130px);
        max-width: 130px;
    }

    .elementor-32084 .elementor-element.elementor-element-48e8803 .elementor-heading-title {
        font-size: 20px;
        line-height: 120%;
    }

    .elementor-32084 .elementor-element.elementor-element-f803ae5 .elementor-heading-title {
        font-size: 24px;
        line-height: 120%;
    }

    .elementor-32084 .elementor-element.elementor-element-b5b881f .elementor-button {
        font-size: 18px;
        padding: 12px;
    }
}

@media (max-width: 900px) {
    .elementor-32084 .elementor-element.elementor-element-48e8803 {
        --container-widget-width: 135px;
        --container-widget-flex-grow: 0;
        width: var(--container-widget-width, 135px);
        max-width: 135px;
    }
}

@media (max-width: 600px) {
    .elementor-32084 .elementor-element.elementor-element-48e8803 {
        --container-widget-width: 135px;
        --container-widget-flex-grow: 0;
        width: var(--container-widget-width, 135px);
        max-width: 135px;
    }

    .elementor-32084 .elementor-element.elementor-element-48e8803 .elementor-heading-title {
        font-size: 20px;
    }

    .elementor-32084 .elementor-element.elementor-element-f803ae5 .elementor-heading-title {
        font-size: 22px;
    }

    .elementor-32084 .elementor-element.elementor-element-b5b881f .elementor-button {
        font-size: 20px;
    }
}