/**
 * SPW-Testimonials — modern styles.
 *
 * Tightly scoped to selectors prefixed with `.spw-`, plus the minimum Swiper
 * integration rules needed to coexist with the legacy `.testimonial_rotator`
 * markup the renderer still emits.
 */

/* Outer wrap + Swiper container both forced to 100 % width so they always
   have a measurable size for Swiper to read at init. The legacy class
   .testimonial_rotator_wrap is also fixed in legacy-classes.css; this rule
   covers the spw-rotator-wrap variant in case the legacy stylesheet is
   dequeued or overridden by a theme. */
/* Outer wrap: takes parent's natural width, hides any horizontal overflow
   from broken Swiper slide widths so the page never gets a horizontal
   scrollbar even if the JS layout heal hasn't run yet. */
.spw-rotator-wrap { display: block; width: auto; max-width: 100%; margin-left: auto; margin-right: auto; box-sizing: border-box; overflow-x: hidden; }
.testimonial_rotator_wrap { overflow-x: hidden; }

/* Swiper integration. Container has `swiper` class so swiper-bundle.min.css
   applies its layout rules (position:relative, overflow:hidden, flex wrapper,
   etc.). Slides retain the legacy `.slide` class — Swiper finds them via
   `slideClass: 'slide'` in the JSON config and writes width via inline style. */
.testimonial_rotator.spw-engine-swiper { display: block; width: 100%; max-width: 100%; overflow: hidden; }
.testimonial_rotator.spw-engine-swiper .slide { box-sizing: border-box; height: auto; }

/* Override Swiper's inline `style="width: …px"` on slides. When Swiper boots
   while its container has 0 computed width (e.g. inside a hidden tab, a flex
   parent that hasn't laid out yet, or anything that defers display), Swiper
   falls back to 2^25 ≈ 33,554,432 px per slide and the slider becomes
   permanently invisible. Forcing 100 % of the wrapper width with !important
   makes the layout self-heal once layout settles, regardless of what Swiper
   wrote to the inline style. */
.testimonial_rotator.spw-engine-swiper .swiper-wrapper > .slide { width: 100% !important; max-width: 100%; flex-shrink: 0; }

/* Belt-and-braces: even with autoHeight on, give the wrapper a natural height
   so it's never collapsed before Swiper's first transition. */
.testimonial_rotator.spw-engine-swiper .swiper-wrapper { height: auto; min-height: 1px; }

.spw-swiper-pagination { text-align: center; margin-top: 10px; }
.spw-swiper-pagination .swiper-pagination-bullet { background: #ccc; opacity: 1; }
.spw-swiper-pagination .swiper-pagination-bullet-active { background: #444; }

/* Fallback: before Swiper boots OR if it fails to load, show first slide
   so the page is never blank. Once Swiper initialises it adds
   `.swiper-initialized` and manages slide visibility itself. */
.testimonial_rotator.spw-engine-swiper:not(.swiper-initialized) .swiper-wrapper > .slide { display: none; }
.testimonial_rotator.spw-engine-swiper:not(.swiper-initialized) .swiper-wrapper > .slide:first-child { display: block; }

.spw-swiper-prev, .spw-swiper-next { -webkit-tap-highlight-color: transparent; }

/* Enhanced theme cards */
.spw-card { background: #fff; }
.spw-card-inner { display: flex; gap: 16px; padding: 20px; border: 1px solid #e8e8e8; border-radius: 10px; box-shadow: 0 1px 3px rgba(0,0,0,0.04); }
.spw-card .spw-avatar img { width: 64px; height: 64px; border-radius: 50%; object-fit: cover; }
.spw-card .spw-body { flex: 1; min-width: 0; }
.spw-card .spw-stars { padding: 0 0 8px; }
.spw-card .spw-stars .testimonial_rotator_star { float: none; display: inline-block; }
.spw-card .spw-quote { margin: 0 0 10px; font-style: italic; line-height: 1.5; padding-left: 12px; border-left: 3px solid #efefef; }
.spw-card .spw-name { font-size: 1.05em; margin: 0; }
.spw-card .spw-cite { font-size: 0.9em; color: #666; }
.spw-card .spw-cite p { margin: 0; }
.spw-card-footer { margin-top: 6px; }

@media (max-width: 540px) {
	.spw-card-inner { flex-direction: column; align-items: flex-start; }
	.spw-card .spw-avatar img { width: 48px; height: 48px; }
}

/* Archive page */
.spw-archive { margin: 30px 0; }
.spw-archive-toolbar { display: flex; gap: 12px; flex-wrap: wrap; align-items: center; padding: 12px 16px; background: #f6f6f6; border-radius: 8px; margin-bottom: 24px; }
.spw-archive-toolbar > * { margin: 0; }
.spw-archive-toolbar label { font-weight: 600; font-size: 0.9em; }
.spw-archive-toolbar select, .spw-archive-toolbar input[type="search"] { padding: 6px 10px; border: 1px solid #d0d0d0; border-radius: 6px; background: #fff; }

.spw-archive-layout { display: inline-flex; gap: 4px; border: 1px solid #d0d0d0; border-radius: 6px; padding: 2px; background: #fff; }
.spw-archive-layout button { background: transparent; border: 0; cursor: pointer; padding: 6px 10px; border-radius: 4px; font-size: 0.85em; }
.spw-archive-layout button.is-active { background: #222; color: #fff; }

.spw-archive-grid.spw-layout-grid { display: grid; gap: 20px; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); }
.spw-archive-grid.spw-layout-list { display: flex; flex-direction: column; gap: 16px; }
.spw-archive-grid.spw-layout-list .spw-card-inner { max-width: 800px; }
.spw-archive-grid.spw-layout-masonry { column-count: 3; column-gap: 20px; }
.spw-archive-grid.spw-layout-masonry > * { break-inside: avoid; margin-bottom: 20px; display: inline-block; width: 100%; }
@media (max-width: 900px) { .spw-archive-grid.spw-layout-masonry { column-count: 2; } }
@media (max-width: 560px) { .spw-archive-grid.spw-layout-masonry { column-count: 1; } }

.spw-archive-pagination { margin-top: 30px; text-align: center; }
.spw-archive-pagination .page-numbers { display: inline-block; padding: 6px 12px; margin: 0 3px; border: 1px solid #d0d0d0; border-radius: 4px; text-decoration: none; }
.spw-archive-pagination .page-numbers.current { background: #222; color: #fff; border-color: #222; }

.spw-empty { text-align: center; padding: 60px 20px; color: #777; }