/* Shared XCOM palette for standard Flatsome pages. Focused landing pages have their own styles. */
:root {
    --xcom-paper: #fffdf8;
    --xcom-cream: #f4f0e6;
    --xcom-surface: #ffffff;
    --xcom-ink: #173228;
    --xcom-muted: #52645a;
    --xcom-forest: #0a5c3a;
    --xcom-orange: #f26522;
    --xcom-orange-readable: #b84415;
    --xcom-line: rgba(23, 50, 40, .16);
}

body.theme-flatsome {
    background: var(--xcom-paper);
    color: var(--xcom-ink);
}

body.theme-flatsome #main {
    background: var(--xcom-paper);
}

body.theme-flatsome .header-bg-color,
body.theme-flatsome .nav-dropdown {
    background-color: var(--xcom-paper);
}

body.theme-flatsome .header-bottom {
    background-color: var(--xcom-cream);
}

body.theme-flatsome .nav-dropdown {
    border-color: var(--xcom-line);
}

body.theme-flatsome .header-bottom .nav > li > a {
    color: var(--xcom-forest);
}

body.theme-flatsome .breadcrumb,
body.theme-flatsome .breadcrumbs,
body.theme-flatsome .widget,
body.theme-flatsome .woocommerce-result-count {
    color: var(--xcom-muted);
}

body.theme-flatsome .product-small .box {
    border: 1px solid var(--xcom-line);
    background: var(--xcom-surface);
}

body.theme-flatsome .product-small .box-image,
body.theme-flatsome .woocommerce-product-gallery {
    background: var(--xcom-surface);
}

/* Neutral content panels from older pages share the same warm surfaces. */
body.theme-flatsome .xcom-project-card-media,
body.theme-flatsome .xcom-media-card,
body.theme-flatsome .xcom-reasons,
body.theme-flatsome .xcom-toc-wrapper,
body.theme-flatsome .info-card-v2,
body.theme-flatsome .transparent-card-v2 {
    background-color: var(--xcom-cream) !important;
}

body.theme-flatsome .xcom-vision-box,
body.theme-flatsome .xcom-press-section,
body.theme-flatsome .xcom-pillar-intro-v2 {
    background-color: var(--xcom-paper) !important;
}

/* Category introduction and closing copy use one matching cream band each. */
body.tax-product_cat #main .term-description > .section,
body.tax-product_cat #main .shop-container > .section {
    background-color: var(--xcom-cream) !important;
}

body.tax-product_cat #main .term-description > .section ~ .section,
body.tax-product_cat #main .shop-container > .section ~ .section {
    background-color: var(--xcom-paper) !important;
}

body.tax-product_cat #main .shop-container > .section {
    padding: 30px !important;
}

/* Inox, accessories and restaurant categories render their introductions as HTML blocks. */
body.tax-product_cat #main .term-description > :is(.xcom-category-header-v2, .xcom-restaurant-header) {
    max-width: none !important;
    padding: 30px !important;
    background-color: var(--xcom-cream) !important;
}

/* The guide and news archives use a separate WordPress category template. */
body:is(.category-kinh-nghiem-su-dung-ghe-su-kien, .category-tin-tuc) #main .taxonomy-description > .section {
    padding: 30px !important;
    background-color: var(--xcom-cream) !important;
}

body:is(.category-kinh-nghiem-su-dung-ghe-su-kien, .category-tin-tuc) #main .taxonomy-description > .section .section-bg > .is-border {
    display: none !important;
}

body:is(.category-kinh-nghiem-su-dung-ghe-su-kien, .category-tin-tuc) #main .taxonomy-description > .section .col-inner[style*="background-color:#f8fcf9"] {
    background-color: var(--xcom-paper) !important;
}

/* Remove the extra UX Builder card from closing copy; the section is its surface. */
html body.tax-product_cat #main .shop-container > .section .col-inner.box-shadow-2 {
    padding: 0 !important;
    border: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
}

/* Policy pages use a mix of inline white wrappers and older grey content boxes. */
body:is(.page-id-8657, .page-id-2004, .page-id-7498, .page-id-7496, .page-id-7500) #content .row-main > .col > .col-inner > div:first-child,
body.page-id-2042 #main .policy-box,
body.page-id-2042 #main .grey-box,
body.page-id-2044 #main .xcom-return-policy,
body.page-id-2046 #main .payment-box,
body.page-id-1996 #main .xp-box {
    background-color: var(--xcom-cream) !important;
}

body:is(.page-id-8657, .page-id-2004, .page-id-7498, .page-id-7496, .page-id-7500) #content div[style*="background-color: #f9f9f9"],
body:is(.page-id-8657, .page-id-2004, .page-id-7498, .page-id-7496, .page-id-7500) #content div[style*="background-color:#f9f9f9"],
body:is(.page-id-8657, .page-id-2004, .page-id-7498, .page-id-7496, .page-id-7500) #content div[style*="background-color: #f5f5f5"],
body:is(.page-id-8657, .page-id-2004, .page-id-7498, .page-id-7496, .page-id-7500) #content div[style*="background-color:#f5f5f5"],
body.page-id-2004 #content div[style*="border: 1px dashed #bbb"] {
    background-color: var(--xcom-paper) !important;
}

body.theme-flatsome .widget-title,
body.theme-flatsome .product-title,
body.theme-flatsome .entry-title {
    color: var(--xcom-ink);
}

body.theme-flatsome :where(input[type="text"], input[type="search"], input[type="email"], input[type="tel"], input[type="number"], textarea, select) {
    background-color: var(--xcom-surface);
}

@media (max-width: 849px) {
    body.theme-flatsome #main-menu,
    body.theme-flatsome #main-menu .sidebar-menu {
        background: var(--xcom-paper);
    }

    html body.tax-product_cat #main .shop-container > section.section {
        padding: 30px 10px !important;
    }

    html body.tax-product_cat #main .term-description > :is(.xcom-category-header-v2, .xcom-restaurant-header) {
        padding: 30px 10px !important;
    }

    html body:is(.category-kinh-nghiem-su-dung-ghe-su-kien, .category-tin-tuc) #main .taxonomy-description > .section {
        padding: 30px 10px !important;
    }
}