/* VW Social Feeds. Defaults pull from Elementor global colors when present. */
.vwsf {
	--vwsf-card-bg: #fff;
	--vwsf-text: var(--e-global-color-text, #333);
	--vwsf-muted: #70757a;
	--vwsf-star: #fbbc04;
	--vwsf-accent: var(--e-global-color-accent, #1a73e8);
	--vwsf-button-text: #fff;
	--vwsf-radius: 10px;
	--vwsf-gap: 20px;
	position: relative;
	color: var(--vwsf-text);
}
.vwsf *, .vwsf *::before, .vwsf *::after { box-sizing: border-box; }

.vwsf-header {
	display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between;
	gap: 12px; margin-bottom: var(--vwsf-gap);
}
.vwsf-summary { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 10px; }
.vwsf-biz { font-weight: 700; font-size: 1.1em; color: inherit; text-decoration: none; }
.vwsf-score { font-weight: 700; font-size: 1.3em; }
.vwsf-count { color: var(--vwsf-muted); font-size: .9em; text-decoration: none; }
a.vwsf-count:hover { text-decoration: underline; }

.vwsf-button {
	display: inline-block; padding: 10px 20px; border-radius: 6px; border: 0; cursor: pointer;
	background: var(--vwsf-accent); color: var(--vwsf-button-text) !important;
	font-weight: 600; text-decoration: none; line-height: 1.2;
}
.vwsf-button:hover, .vwsf-button:focus { filter: brightness(.92); }
.vwsf-subscribe { background: #c00; }

/* Layouts */
.vwsf-track {
	display: grid; gap: var(--vwsf-gap);
	grid-template-columns: repeat(var(--vwsf-cols-e, var(--vwsf-cols, 3)), minmax(0, 1fr));
}
.vwsf-layout-list .vwsf-track { grid-template-columns: 1fr; }
@media (max-width: 1024px) { .vwsf-layout-grid:not(.vwsf-cols-1) .vwsf-track { grid-template-columns: repeat(var(--vwsf-cols-e, 2), minmax(0, 1fr)); } }
@media (max-width: 767px)  { .vwsf-layout-grid .vwsf-track { grid-template-columns: repeat(var(--vwsf-cols-e, 1), minmax(0, 1fr)); } }

.vwsf-layout-carousel .vwsf-track {
	display: flex; overflow-x: auto; scroll-snap-type: x mandatory; scroll-behavior: smooth;
	scrollbar-width: none; padding-bottom: 4px;
}
.vwsf-layout-carousel .vwsf-track::-webkit-scrollbar { display: none; }
.vwsf-layout-carousel .vwsf-card {
	flex: 0 0 calc((100% - (var(--vwsf-cols-e, var(--vwsf-cols, 3)) - 1) * var(--vwsf-gap)) / var(--vwsf-cols-e, var(--vwsf-cols, 3)));
	scroll-snap-align: start;
}
@media (max-width: 767px) { .vwsf-layout-carousel .vwsf-card { flex-basis: 85%; } }
.vwsf-nav { display: flex; justify-content: center; gap: 10px; margin-top: 14px; }
.vwsf-nav button {
	width: 40px; height: 40px; border-radius: 50%; border: 1px solid #ddd; background: #fff;
	font-size: 24px; line-height: 1; cursor: pointer; color: var(--vwsf-text);
}
.vwsf-nav button:hover { border-color: var(--vwsf-accent); color: var(--vwsf-accent); }

/* Cards */
.vwsf-card {
	background: var(--vwsf-card-bg); border-radius: var(--vwsf-radius);
	box-shadow: 0 1px 3px rgba(0,0,0,.12); padding: 20px; min-width: 0;
}
.vwsf-hidden { display: none; }

/* Reviews */
.vwsf-review-head { display: flex; align-items: center; gap: 10px; margin-bottom: 8px; }
.vwsf-review-head .vwsf-g { margin-left: auto; flex: 0 0 auto; }
.vwsf-avatar { width: 40px; height: 40px; border-radius: 50%; object-fit: cover; flex: 0 0 auto; }
.vwsf-initial {
	display: inline-flex; align-items: center; justify-content: center;
	background: var(--vwsf-accent); color: #fff; font-weight: 700;
}
.vwsf-who { display: flex; flex-direction: column; min-width: 0; }
.vwsf-author { font-weight: 700; color: inherit; text-decoration: none; overflow-wrap: break-word; line-height: 1.3; }
a.vwsf-author:hover { text-decoration: underline; }
.vwsf-date { color: var(--vwsf-muted); font-size: .85em; }
.vwsf-stars { display: inline-flex; gap: 2px; vertical-align: middle; }
.vwsf-star { position: relative; width: 18px; height: 18px; background: #dadce0; -webkit-mask: var(--vwsf-star-shape) center/contain no-repeat; mask: var(--vwsf-star-shape) center/contain no-repeat; }
.vwsf-star > span { position: absolute; inset: 0 auto 0 0; background: var(--vwsf-star); }
.vwsf { --vwsf-star-shape: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 17.3l6.2 3.7-1.6-7 5.4-4.7-7.1-.6L12 2 9.1 8.7 2 9.3l5.4 4.7-1.6 7z'/%3E%3C/svg%3E"); }
.vwsf-text { margin-top: 8px; line-height: 1.55; white-space: pre-line; color: var(--vwsf-text); }
.vwsf-more { background: none; border: 0; padding: 0; margin-top: 6px; color: var(--vwsf-accent); cursor: pointer; font: inherit; font-size: .9em; }
.vwsf-powered { margin-top: 12px; font-size: .8em; color: var(--vwsf-muted); text-align: right; }

/* YouTube */
.vwsf-youtube .vwsf-card { padding: 0; overflow: hidden; }
.vwsf-youtube .vwsf-title, .vwsf-youtube .vwsf-date, .vwsf-youtube .vwsf-text { padding: 0 14px; }
.vwsf-youtube .vwsf-title { font-size: 1em; line-height: 1.35; margin: 12px 0 4px; }
.vwsf-youtube .vwsf-card > :last-child { padding-bottom: 14px; }
.vwsf-thumb { position: relative; display: block; aspect-ratio: 16 / 9; background: #000; overflow: hidden; }
.vwsf-thumb img { width: 100%; height: 100%; object-fit: cover; display: block; transition: transform .3s; }
.vwsf-thumb:hover img { transform: scale(1.04); }
.vwsf-thumb iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; }
.vwsf-play {
	position: absolute; top: 50%; left: 50%; width: 64px; height: 44px; transform: translate(-50%, -50%);
	background: rgba(0,0,0,.7); border-radius: 12px; transition: background .2s;
}
.vwsf-play::after {
	content: ""; position: absolute; top: 50%; left: 54%; transform: translate(-50%, -50%);
	border-style: solid; border-width: 10px 0 10px 17px; border-color: transparent transparent transparent #fff;
}
.vwsf-thumb:hover .vwsf-play { background: #f00; }
.vwsf-duration {
	position: absolute; right: 8px; bottom: 8px; background: rgba(0,0,0,.8); color: #fff;
	font-size: 12px; padding: 2px 6px; border-radius: 4px;
}
.vwsf-loadmore-wrap { text-align: center; margin-top: var(--vwsf-gap); }
.vwsf-layout-list.vwsf-youtube .vwsf-card { display: grid; grid-template-columns: minmax(160px, 40%) 1fr; align-content: start; }
.vwsf-layout-list.vwsf-youtube .vwsf-thumb { grid-row: span 3; }
@media (max-width: 767px) { .vwsf-layout-list.vwsf-youtube .vwsf-card { grid-template-columns: 1fr; } }

/* Lightbox */
.vwsf-lightbox {
	position: fixed; inset: 0; z-index: 99999; background: rgba(0,0,0,.85);
	display: flex; align-items: center; justify-content: center; padding: 16px;
}
.vwsf-lightbox-inner { position: relative; width: min(1100px, 100%); aspect-ratio: 16 / 9; }
.vwsf-lightbox iframe { width: 100%; height: 100%; border: 0; }
.vwsf-lightbox-close {
	position: absolute; top: -44px; right: 0; background: none; border: 0; color: #fff;
	font-size: 36px; line-height: 1; cursor: pointer;
}

.vwsf-error { padding: 12px 16px; border-left: 4px solid #d63638; background: #fcf0f1; color: #1d2327; }

/* Review filters */
.vwsf-filters { display: flex; flex-wrap: wrap; gap: 10px 20px; margin-bottom: var(--vwsf-gap); }
.vwsf-filter-group { display: flex; flex-wrap: wrap; gap: 8px; }
.vwsf-filter {
	padding: 7px 14px; border-radius: 999px; border: 1px solid #d0d4dc; background: #fff;
	color: var(--vwsf-text); font: inherit; font-size: .9em; line-height: 1.2; cursor: pointer;
}
.vwsf-filter:hover { border-color: var(--vwsf-accent); color: var(--vwsf-accent); }
.vwsf-filter.is-active { background: var(--vwsf-accent); border-color: var(--vwsf-accent); color: var(--vwsf-button-text); }
.vwsf-filter-meta { opacity: .8; font-size: .9em; }
.vwsf-loc {
	display: inline-block; margin-left: 6px; padding: 2px 8px; border-radius: 999px; vertical-align: middle;
	background: rgba(0,0,0,.06); color: var(--vwsf-muted); font-size: .75em;
}
.vwsf-empty { color: var(--vwsf-muted); }
.vwsf-layout-carousel .vwsf-card.vwsf-hidden { display: none; }

/* Shared: heading, dots, button icon */
.vwsf-heading { font-weight: 700; font-size: 2em; line-height: 1; margin-right: 4px; }
.vwsf-btn-icon { vertical-align: -3px; margin-right: 6px; }
.vwsf-dots { display: flex; justify-content: center; gap: 8px; margin-top: 14px; }
.vwsf-dots:empty { display: none; }
.vwsf-dots button { width: 12px; height: 12px; padding: 0; border: 0; border-radius: 50%; background: #d6d6d6; cursor: pointer; }
.vwsf-dots button.is-active { background: #333; }

/* Masonry */
.vwsf-layout-masonry .vwsf-track { display: block; column-count: var(--vwsf-cols-e, var(--vwsf-cols, 3)); column-gap: var(--vwsf-gap); }
.vwsf-layout-masonry .vwsf-card { break-inside: avoid; margin-bottom: var(--vwsf-gap); display: inline-block; width: 100%; }
@media (max-width: 1024px) { .vwsf-layout-masonry:not(.vwsf-cols-1) .vwsf-track { column-count: var(--vwsf-cols-e, 2); } }
@media (max-width: 767px)  { .vwsf-layout-masonry .vwsf-track { column-count: var(--vwsf-cols-e, 1); } }

/* ---------- Template: Classic (matches the current verticalweb.com reviews feed) ---------- */
.vwsf-tpl-classic {
	--vwsf-star: #ed4944; --vwsf-accent: #ed4944; --vwsf-text: #434960; --vwsf-muted: #434960;
	--vwsf-card-bg: #fff; --vwsf-radius: 4px; --vwsf-gap: 20px; --vwsf-ink: #141b38;
	font-family: inherit;
}
.vwsf-tpl-classic .vwsf-header { margin-bottom: 18px; }
.vwsf-tpl-classic .vwsf-summary { gap: 6px 8px; align-items: baseline; }
.vwsf-tpl-classic .vwsf-heading { font-size: 36px; line-height: 36px; font-weight: 700; color: var(--vwsf-ink); }
.vwsf-tpl-classic .vwsf-score { font-size: 20px; font-weight: 600; line-height: 30px; color: var(--vwsf-ink); }
.vwsf-tpl-classic .vwsf-summary .vwsf-star { width: 18px; height: 18px; }
.vwsf-tpl-classic .vwsf-count { font-size: 16px; line-height: 24px; color: rgba(0,0,0,.93); }
.vwsf-tpl-classic .vwsf-button { font-size: 14px; font-weight: 600; line-height: 22px; padding: 8px 20px 8px 12px; border-radius: 4px; }
.vwsf-tpl-classic .vwsf-card { border: 1px solid #eee; box-shadow: none; padding: 10px 10px 20px; }
.vwsf-tpl-classic .vwsf-review-head { align-items: flex-start; gap: 12px; margin-bottom: 14px; }
.vwsf-tpl-classic .vwsf-avatar { width: 56px; height: 56px; }
.vwsf-tpl-classic .vwsf-initial { background: #8d6e63; font-size: 26px; font-weight: 400; }
.vwsf-tpl-classic .vwsf-who { padding-top: 2px; }
.vwsf-tpl-classic .vwsf-author { font-size: 14px; font-weight: 600; line-height: 21px; color: var(--vwsf-ink); white-space: normal; }
.vwsf-tpl-classic .vwsf-date { font-size: 13px; line-height: 19.5px; color: var(--vwsf-muted); }
.vwsf-tpl-classic .vwsf-review-head .vwsf-g { width: 26px; height: 26px; }
.vwsf-tpl-classic .vwsf-review > .vwsf-stars .vwsf-star { width: 16px; height: 16px; }
.vwsf-tpl-classic .vwsf-review > .vwsf-stars { margin-bottom: 4px; }
.vwsf-tpl-classic .vwsf-text { font-size: 16px; line-height: 24px; margin-top: 14px; color: var(--vwsf-text); }
.vwsf-tpl-classic .vwsf-more { color: #2c4ea8; font-weight: 600; }
.vwsf-tpl-classic.vwsf-layout-carousel .vwsf-track { align-items: flex-start; padding: 2px 0; }
.vwsf-tpl-classic .vwsf-nav { position: absolute; inset: 50% -14px auto -14px; margin: 0; justify-content: space-between; pointer-events: none; transform: translateY(-50%); }
.vwsf-tpl-classic.vwsf-reviews .vwsf-nav { top: calc(50% + 30px); }
.vwsf-tpl-classic .vwsf-nav button {
	pointer-events: auto; width: 28px; height: 29px; font-size: 20px; font-weight: 700; border: 0;
	background: rgba(255,255,255,.9); color: #000; box-shadow: 0 0 5px rgba(0,0,0,.2);
}
@media (max-width: 767px) { .vwsf-tpl-classic .vwsf-nav { inset-inline: -4px; } }

/* ---------- Template: Cards (the plugin's own look) ---------- */
/* Uses the base styles. */

/* ---------- Template: Spotlight ---------- */
.vwsf-tpl-spotlight .vwsf-header { justify-content: center; text-align: center; flex-direction: column; }
.vwsf-tpl-spotlight .vwsf-card { text-align: center; padding: 40px 48px; box-shadow: none; background: transparent; }
.vwsf-tpl-spotlight .vwsf-review-head { flex-direction: column; justify-content: center; order: 3; }
.vwsf-tpl-spotlight .vwsf-review { display: flex; flex-direction: column; align-items: center; }
.vwsf-tpl-spotlight .vwsf-review-head .vwsf-g { margin: 0; }
.vwsf-tpl-spotlight .vwsf-text { font-size: 1.35em; line-height: 1.5; font-style: italic; order: 2; margin: 14px 0 20px; max-width: 820px; }
.vwsf-tpl-spotlight .vwsf-text::before { content: "\201C"; } .vwsf-tpl-spotlight .vwsf-text::after { content: "\201D"; }
.vwsf-tpl-spotlight .vwsf-stars { order: 1; }
.vwsf-tpl-spotlight .vwsf-loc { order: 4; margin: 8px 0 0; }
.vwsf-tpl-spotlight .vwsf-who { align-items: center; }

/* ---------- Template: Minimal list ---------- */
.vwsf-tpl-minimal .vwsf-card { box-shadow: none; border-radius: 0; border-left: 3px solid var(--vwsf-star); padding: 4px 0 4px 18px; background: transparent; }
.vwsf-tpl-minimal .vwsf-review-head { margin-bottom: 2px; }
.vwsf-tpl-minimal .vwsf-review-head .vwsf-g { display: none; }

/* ---------- Template: Badge ---------- */
.vwsf-tpl-badge { display: inline-block; }
.vwsf-tpl-badge .vwsf-header { margin: 0; padding: 12px 18px; background: var(--vwsf-card-bg); border-radius: 999px; box-shadow: 0 2px 10px rgba(0,0,0,.12); }
.vwsf-tpl-badge .vwsf-track, .vwsf-tpl-badge .vwsf-powered, .vwsf-tpl-badge .vwsf-filters { display: none; }
