/* Old Flatsome content in the new theme (inc/legacy-content.php). Simple, token-based renderings of the old page
   builder's parts, so posts, UX Blocks, term descriptions and old pages read cleanly until they are rebuilt. */

.fs-row { display: flex; flex-wrap: wrap; gap: var(--space-5); margin-block: var(--space-4); }
.fs-col { flex: 1 1 calc(var(--fs-span, 100%) - var(--space-5)); min-width: 0; }
.fs-col > :last-child { margin-bottom: 0; }
.fs-section { padding-block: var(--space-6); }
.fs-section--bg { padding-inline: var(--space-5); border-radius: var(--radius); background-size: cover; background-position: center; }
.fs-section--dark, .fs-section--dark h2, .fs-section--dark h3, .fs-section--dark a { color: #fff; }
.fs-gap { display: block; max-height: 60px; }
.fs-divider { margin: var(--space-5) 0; border: 0; border-top: var(--line); }
.fs-title { display: flex; flex-wrap: wrap; align-items: baseline; justify-content: space-between; gap: var(--space-3); margin: var(--space-5) 0 var(--space-3); }
.fs-title__text { margin: 0; }
.fs-text-box > :last-child, .fs-text > :last-child { margin-bottom: 0; }

.fs-image { max-width: var(--fs-width, 100%); margin: 0 0 var(--space-4); }
.fs-image img { width: 100%; height: auto; border-radius: var(--radius); }
.fs-image figcaption { margin-top: var(--space-2); }
.fs-image-box { margin-bottom: var(--space-4); }
.fs-image-box__body { padding-top: var(--space-2); }

.fs-banner {
	position: relative; display: flex; align-items: center; overflow: hidden;
	min-height: var(--fs-banner-h, 300px); margin-block: var(--space-4);
	border-radius: var(--radius); background: var(--color-cream); color: #fff;
}
.fs-banner__bg { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.fs-banner:not(.fs-banner--plain)::after { content: ""; position: absolute; inset: 0; background: rgba(0, 0, 0, .38); }
.fs-banner__content { position: relative; z-index: 1; max-width: 720px; padding: var(--space-6); }
.fs-banner__content h1, .fs-banner__content h2, .fs-banner__content h3, .fs-banner__content p, .fs-banner__content a { color: inherit; }
.fs-banner__link { position: absolute; inset: 0; z-index: 2; }
.fs-banner--plain, .fs-banner:has(.fs-text-box--dark) { color: var(--color-ink); }
.fs-banner:has(.fs-text-box--dark)::after { display: none; }

.fs-feature { display: flex; flex-direction: column; gap: var(--space-3); margin-block: var(--space-4); }
.fs-feature--side { flex-direction: row; align-items: flex-start; }
.fs-feature__img { flex-shrink: 0; height: auto; border-radius: var(--radius); }
.fs-feature__title { margin: 0 0 var(--space-2); font-size: var(--text-md); }
.fs-message { margin-block: var(--space-4); padding: var(--space-5); border-radius: var(--radius); background: var(--color-cream); }
.fs-member { text-align: center; }
.fs-member__img { width: 160px; height: 160px; margin: 0 auto var(--space-3); border-radius: 50%; object-fit: cover; }
.fs-member__name { margin: 0; font-weight: var(--weight-bold); color: var(--color-ink-strong); }
.fs-member__role { margin: 0 0 var(--space-3); color: var(--color-muted); font-size: var(--text-sm); }
.fs-follow { display: flex; flex-wrap: wrap; gap: var(--space-4); }
.fs-follow a { font-weight: var(--weight-semibold); }
.fs-search { max-width: 520px; margin-block: var(--space-4); }
.fs-video { margin-block: var(--space-3); }

.fs-slider { display: flex; gap: var(--space-4); overflow-x: auto; scroll-snap-type: x mandatory; padding-bottom: var(--space-2); }
.fs-slider > * { flex: 0 0 100%; scroll-snap-align: start; margin-block: 0; }
.fs-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); gap: var(--space-4); margin-block: var(--space-4); }
.fs-grid__item > .fs-banner { height: 100%; margin: 0; }
.fs-posts { margin-block: var(--space-5); }
.fs-products { margin-block: var(--space-5); }

/* WooCommerce lists inside old content: [products columns="4"] and category tiles */
.woocommerce.columns-4 ul.products { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.fs-categories .product-category a { display: block; }
.fs-categories .product-category img { width: 100%; aspect-ratio: 1; object-fit: contain; border: var(--line); border-radius: var(--radius); background: var(--color-surface); }
.fs-categories .woocommerce-loop-category__title { margin: var(--space-3) 0 0; font-size: var(--text-base); }
.fs-categories .count { background: none; color: var(--color-muted); font-weight: var(--weight-regular); }

/* Footer: the payments image from the old footer block */
.site-footer__payments { margin-top: var(--space-6); }
.site-footer__payments img { float: none; max-width: min(700px, 100%); height: auto; margin: 0; }
.site-footer__payments p { margin: 0; }

@media (max-width: 1100px) {
	.woocommerce.columns-4 ul.products { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
@media (max-width: 760px) {
	.fs-col { flex-basis: 100%; }
	.fs-image { max-width: var(--fs-width-sm, 100%); }
	.fs-feature--side { flex-direction: column; }
	.fs-banner__content { padding: var(--space-5); }
	.woocommerce.columns-4 ul.products { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}