/*
Theme Name: Twenty Twenty-Four Child
Theme URI: https://wordpress.org/themes/twentytwentyfour/
Template: twentytwentyfour
Author: the WordPress team
Author URI: https://wordpress.org
Description: Twenty Twenty-Four is designed to be flexible, versatile and applicable to any website. Its collection of templates and patterns tailor to different needs, such as presenting a business, blogging and writing or showcasing work. A multitude of possibilities open up with just a few adjustments to color and typography. Twenty Twenty-Four comes with style variations and full page designs to help speed up the site building process, is fully compatible with the site editor, and takes advantage of new design tools introduced in WordPress 6.4.
Tags: one-column,custom-colors,custom-menu,custom-logo,editor-style,featured-images,full-site-editing,block-patterns,rtl-language-support,sticky-post,threaded-comments,translation-ready,wide-blocks,block-styles,style-variations,accessibility-ready,blog,portfolio,news
Version: 1.1.1713295797
Updated: 2024-04-16 21:29:57

*/

.wfs-search-container {
    display: none;
}

.map-container {
    position: relative;
    padding-bottom: 56.25%; /* Aspect Ratio: 16:9 */
    height: 0;
    overflow: hidden;
}

.map-container iframe {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    border: 0;
}

@media (max-width: 480px) {
    .wfs-food-item-description {
        display: block !important;
        font-size: 18px; 
    }
}

/* Sticky category nav bar (Food Store) */
.xian-mobile-header-spacer,
.xian-mobile-filter-spacer,
.xian-desktop-filter-spacer {
    display: none;
    width: 100%;
}

#wfs-sticky-sidebar.xian-mobile-filter {
    z-index: 1200;
    box-sizing: border-box;
    max-width: 100%;
    margin: 0 !important;
    padding: 0;
    background: #f9f8f5;
    border-top: 1px solid rgba(0, 0, 0, 0.08);
    border-bottom: 1px solid rgba(0, 0, 0, 0.12);
    box-shadow: none;
    transform: none !important;
    -webkit-transform: none !important;
}

#wfs-sticky-sidebar.xian-mobile-filter.is-fixed {
    box-shadow: 0 6px 16px rgba(0, 0, 0, 0.10);
}

#wfs-sticky-sidebar.xian-mobile-filter .theiaStickySidebar {
    position: static !important;
    transform: none !important;
    width: 100% !important;
    min-height: 0 !important;
    padding: 0 !important;
}

#wfs-sticky-sidebar.xian-mobile-filter .wfs-sidebar-menu {
    width: 100%;
    overflow-x: auto;
    overflow-y: hidden;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
    cursor: grab;
}

#wfs-sticky-sidebar.xian-mobile-filter .wfs-sidebar-menu.is-dragging {
    cursor: grabbing;
}

#wfs-sticky-sidebar.xian-mobile-filter .wfs-sidebar-menu::-webkit-scrollbar {
    display: none;
}

#wfs-sticky-sidebar.xian-mobile-filter .wfs-sidebar-menu ul {
    display: flex;
    flex-wrap: nowrap;
    align-items: center;
    justify-content: center;
    gap: 0;
    min-width: max-content;
    margin: 0;
    padding: 0;
    list-style: none !important;
}

#wfs-sticky-sidebar.xian-mobile-filter .wfs-sidebar-menu li {
    flex: 0 0 auto;
    margin: 0;
}

#wfs-sticky-sidebar.xian-mobile-filter .wfs-sidebar-menu ul a {
    display: inline-flex;
    align-items: center;
    min-height: 44px;
    padding: 0 14px;
    border: 0;
    border-bottom: 3px solid transparent;
    color: #222;
    background: transparent;
    font-size: 14px;
    line-height: 1.2;
    white-space: nowrap;
}

#wfs-sticky-sidebar.xian-mobile-filter .wfs-sidebar-menu ul a:hover,
#wfs-sticky-sidebar.xian-mobile-filter .wfs-sidebar-menu ul a.active {
    background: rgba(0, 0, 0, 0.05);
    border-bottom-color: #d73301;
    font-weight: 700;
}

#wfs-sticky-sidebar.xian-mobile-filter .wfs-sidebar-menu ul a span.wfs-items-count {
    display: none;
}

/* Keep Food Store content full width after the sidebar becomes the top sticky bar. */
#foodstore > .fs-row {
    display: block;
    margin-right: 0;
    margin-left: 0;
}

#foodstore > .fs-row > .xian-mobile-filter-spacer,
#foodstore > .fs-row > #wfs-food-items {
    float: none !important;
    width: 100% !important;
    max-width: 100%;
    flex: 0 0 100% !important;
}

#foodstore > .fs-row > #wfs-food-items {
    display: block;
}

.xian-sticky-mobile {
    z-index: 1300;
    margin: 0 !important;
    background: #f9f8f5;
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.08);
    transform: translate3d(0, 0, 0) !important;
    -webkit-transform: translate3d(0, 0, 0) !important;
    opacity: 1 !important;
    visibility: visible !important;
}

@media only screen and (max-width: 899px) {
    .xian-sticky-mobile {
        background: #111111;
        box-shadow: 0 2px 10px rgba(0, 0, 0, 0.20);
    }
}

/* Panda Takeaway visual theme */
:root {
    --panda-ink: #101010;
    --panda-ink-soft: #242424;
    --panda-paper: #f6f1e8;
    --panda-card: #fffdf8;
    --panda-line: rgba(16, 16, 16, 0.12);
    --panda-muted: #6a6259;
    --panda-red: #d73301;
    --panda-red-dark: #a82400;
}

body.wp-theme-twentytwentyfour.wp-child-theme-twentytwentyfour-child {
    background: var(--panda-paper);
    color: var(--panda-ink);
}

.wp-site-blocks {
    background: var(--panda-paper);
}

header.wp-block-template-part {
    position: relative;
    z-index: 1400;
}

header.wp-block-template-part > .wp-block-group {
    background: var(--panda-ink) !important;
    border-bottom: 4px solid var(--panda-red);
    color: #ffffff;
    padding-top: 12px !important;
    padding-bottom: 12px !important;
}

header.wp-block-template-part .wp-block-site-logo a {
    display: inline-flex;
    align-items: center;
    background: #ffffff;
    border: 2px solid #ffffff;
    border-radius: 8px;
    padding: 5px 9px;
}

header.wp-block-template-part .custom-logo {
    width: auto;
    max-width: 150px;
    max-height: 70px;
}

header.wp-block-template-part .wp-block-navigation a {
    color: #ffffff;
    font-weight: 800;
    text-decoration: none;
}

header.wp-block-template-part .wp-block-navigation-item__content {
    border-radius: 6px;
    padding: 10px 13px;
}

header.wp-block-template-part .current-menu-item .wp-block-navigation-item__content,
header.wp-block-template-part .wp-block-navigation-item__content:hover {
    background: var(--panda-red);
    color: #ffffff;
}

header.wp-block-template-part .wp-block-navigation__responsive-container-open,
header.wp-block-template-part .wp-block-navigation__responsive-container-close {
    color: #ffffff;
}

header.wp-block-template-part .wp-block-navigation__responsive-container.is-menu-open {
    background: var(--panda-card);
    color: var(--panda-ink);
}

header.wp-block-template-part .wp-block-navigation__responsive-container.is-menu-open a,
header.wp-block-template-part .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-close {
    color: var(--panda-ink);
}

header.wp-block-template-part .wp-block-navigation__responsive-container.is-menu-open .current-menu-item .wp-block-navigation-item__content {
    color: #ffffff;
}

main.wp-block-group {
    margin-block-start: 0;
}

main.wp-block-group > .wp-block-group:first-child {
    max-width: none;
    background: var(--panda-ink);
    color: #ffffff;
    padding-bottom: 34px;
}

main.wp-block-group > .wp-block-group:first-child > .wp-block-spacer:first-child {
    height: 28px !important;
}

main.wp-block-group > .wp-block-group:first-child > .wp-block-spacer:nth-of-type(2) {
    height: 18px !important;
}

.wp-block-post-title {
    color: #ffffff;
    font-family: Inter, sans-serif;
    font-size: 3rem;
    font-weight: 900;
    letter-spacing: 0;
    line-height: 1.05;
    margin-bottom: 0;
    text-transform: uppercase;
}

.wp-block-post-title::after {
    display: block;
    width: 72px;
    height: 4px;
    margin: 18px auto 0;
    background: var(--panda-red);
    border-radius: 4px;
    content: "";
}

.wp-block-post-featured-image {
    overflow: hidden;
    border: 1px solid rgba(255, 255, 255, 0.16);
    border-radius: 8px;
    box-shadow: 0 20px 42px rgba(0, 0, 0, 0.34);
}

.wp-block-post-featured-image img {
    display: block;
    width: 100%;
}

.entry-content.wp-block-post-content {
    max-width: none;
    margin-block-start: 0;
    padding-top: 34px;
    padding-bottom: 80px;
}

.xian-sticky-mobile {
    background: var(--panda-ink) !important;
}

#foodstore {
    max-width: 1120px;
    margin-right: auto;
    margin-left: auto;
}

#wfs-sticky-sidebar.xian-mobile-filter {
    background: var(--panda-ink);
    border-top: 1px solid rgba(255, 255, 255, 0.10);
    border-bottom: 3px solid var(--panda-red);
    color: #ffffff;
}

#wfs-sticky-sidebar.xian-mobile-filter .wfs-sidebar-menu ul a {
    min-height: 50px;
    padding: 0 18px;
    color: #ffffff;
    border-bottom: 0;
    font-weight: 800;
}

#wfs-sticky-sidebar.xian-mobile-filter .wfs-sidebar-menu ul a:hover,
#wfs-sticky-sidebar.xian-mobile-filter .wfs-sidebar-menu ul a.active {
    background: var(--panda-red);
    color: #ffffff;
}

.wfs-category-title-container {
    margin-top: 32px;
}

.wfs-category-title {
    display: block;
    margin: 0 0 14px;
    padding: 15px 18px;
    background: var(--panda-ink);
    border-left: 6px solid var(--panda-red);
    border-radius: 8px;
    color: #ffffff !important;
    font-family: Inter, sans-serif;
    font-size: 1.35rem;
    font-weight: 900;
    letter-spacing: 0;
    line-height: 1.25;
}

#wfs-food-items > .fs-row {
    margin-bottom: 12px;
}

.wfs-food-item-container {
    overflow: hidden;
    background: var(--panda-card);
    border: 1px solid var(--panda-line);
    border-radius: 8px;
    box-shadow: 0 10px 24px rgba(16, 16, 16, 0.07);
    transition: border-color 160ms ease, box-shadow 160ms ease, transform 160ms ease;
}

.wfs-food-item-container:hover {
    border-color: rgba(215, 51, 1, 0.38);
    box-shadow: 0 14px 32px rgba(16, 16, 16, 0.10);
    transform: translateY(-1px);
}

.wfs-food-item-summery {
    padding: 18px 20px;
}

.wfs-food-item-title {
    color: var(--panda-ink) !important;
    font-family: Inter, sans-serif;
    font-size: 1.15rem;
    font-weight: 900;
    letter-spacing: 0;
    text-decoration: none;
}

.wfs-food-item-title:hover {
    color: var(--panda-red) !important;
}

.wfs-food-item-description {
    margin-top: 7px;
    color: var(--panda-muted);
    font-size: 0.98rem;
    line-height: 1.45;
}

.wfs-food-item-container .price,
.wfs-food-item-container .woocommerce-Price-amount {
    color: var(--panda-red);
    font-weight: 900;
}

.fs-btn-primary,
.fs-btn-md.fs-btn-primary,
.button-add-to-cart,
.wfsmodal-footer .wfs-modal-add-to-cart a,
.wfs-service-modal-container button.wfs-update-service,
.wfs-cart-purchase-actions .wfs-proceed-to-checkout {
    background: var(--panda-ink) !important;
    border: 1px solid var(--panda-ink) !important;
    border-radius: 6px !important;
    color: #ffffff !important;
    font-weight: 900;
}

.fs-btn-primary:hover,
.fs-btn-md.fs-btn-primary:hover,
.button-add-to-cart:hover,
.wfsmodal-footer .wfs-modal-add-to-cart a:hover,
.wfs-service-modal-container button.wfs-update-service:hover,
.wfs-cart-purchase-actions .wfs-proceed-to-checkout:hover {
    background: var(--panda-red) !important;
    border-color: var(--panda-red) !important;
    color: #ffffff !important;
}

.wfs-text-out-of-stock {
    display: inline-flex;
    align-items: center;
    min-height: 34px;
    padding: 0 11px;
    background: #eee7dc;
    border-radius: 6px;
    color: var(--panda-muted);
    font-weight: 800;
}

.wfs-cart-wrapper,
.wfs-cart-overview {
    background: var(--panda-ink) !important;
    color: #ffffff;
}

.wfs-cart-wrapper {
    border-top: 3px solid var(--panda-red);
    box-shadow: 0 -10px 28px rgba(0, 0, 0, 0.20);
}

.wfs-cart-wrapper a,
.wfs-cart-wrapper strong,
.wfs-cart-wrapper .woocommerce-Price-amount {
    color: #ffffff !important;
}

.wfsmodal-container {
    overflow: hidden;
    border-radius: 8px;
}

.wfsmodal-header {
    background: var(--panda-ink);
    color: #ffffff;
}

.wfsmodal-title {
    color: #ffffff;
}

footer.wp-block-template-part {
    margin-block-start: 0;
    background: var(--panda-ink);
    color: #ffffff;
}

@media only screen and (max-width: 899px) {
    header.wp-block-template-part .custom-logo {
        max-width: 112px;
        max-height: 54px;
    }

    .wp-block-post-title {
        font-size: 2rem;
    }

    .entry-content.wp-block-post-content {
        padding-top: 22px;
        padding-bottom: 72px;
    }

    #wfs-sticky-sidebar.xian-mobile-filter .wfs-sidebar-menu ul {
        justify-content: flex-start;
    }

    #wfs-sticky-sidebar.xian-mobile-filter .wfs-sidebar-menu ul a {
        min-height: 48px;
        padding: 0 15px;
        font-size: 13px;
    }

    .wfs-category-title {
        font-size: 1.12rem;
    }

    .wfs-food-item-summery {
        padding: 16px;
    }
}

/* Lighter first-screen treatment */
header.wp-block-template-part > .wp-block-group {
    background: rgba(255, 253, 248, 0.96) !important;
    border-bottom: 1px solid rgba(16, 16, 16, 0.10);
    box-shadow: 0 8px 22px rgba(16, 16, 16, 0.06);
    color: var(--panda-ink);
}

.xian-sticky-mobile {
    background: rgba(255, 253, 248, 0.96) !important;
}

header.wp-block-template-part .wp-block-site-logo a {
    background: #ffffff;
    border-color: rgba(16, 16, 16, 0.10);
    box-shadow: 0 6px 16px rgba(16, 16, 16, 0.08);
}

header.wp-block-template-part .wp-block-navigation a,
header.wp-block-template-part .wp-block-navigation__responsive-container-open,
header.wp-block-template-part .wp-block-navigation__responsive-container-close {
    color: var(--panda-ink);
}

header.wp-block-template-part .wp-block-navigation-item__content:hover {
    background: rgba(215, 51, 1, 0.10);
    color: var(--panda-red);
}

header.wp-block-template-part .current-menu-item .wp-block-navigation-item__content {
    background: var(--panda-red);
    color: #ffffff;
}

main.wp-block-group > .wp-block-group:first-child {
    background: var(--panda-paper);
    color: var(--panda-ink);
    padding-bottom: 28px;
}

.wp-block-post-title {
    color: var(--panda-ink);
}

.wp-block-post-featured-image {
    border-color: rgba(16, 16, 16, 0.10);
    box-shadow: 0 16px 34px rgba(16, 16, 16, 0.16);
}

@media only screen and (max-width: 899px) {
    .xian-sticky-mobile {
        background: rgba(255, 253, 248, 0.98) !important;
    }
}

/* Footer: force all text to white so "Developed by" credit is readable on dark bg */
footer.wp-block-template-part p,
footer.wp-block-template-part li {
    color: rgba(255, 255, 255, 0.72) !important;
}

footer.wp-block-template-part a {
    color: rgba(255, 255, 255, 0.85) !important;
    text-decoration-color: rgba(255, 255, 255, 0.4);
}

/* Checkout: make WooCommerce content fill the constrained container width */
body.woocommerce-checkout .entry-content .woocommerce,
body.woocommerce-cart .entry-content .woocommerce {
    max-width: 100% !important;
    width: 100% !important;
    box-sizing: border-box;
}
