/*!
 * DK Testimonials — front-end styles
 *
 * Ported (and trimmed) from the old plugin's wtwp-public.css so existing
 * theme-level overrides keep targeting the same class names. `!important`
 * is kept in a handful of places that the old CSS relied on, because some
 * site themes (e.g. Kalium) have competing defaults.
 */

/* ---------- clear-fix ---------- */
.wptww-clearfix:before,
.wptww-clearfix:after { content: ""; display: table; }
.wptww-clearfix:after  { clear: both; }

/* ---------- shared ---------- */
.wptww-avtar-image { text-align: center; }
.wptww-avtar-image img { display: inline-block !important; max-width: 100%; height: auto; }

.wptww-testimonials-list,
.wptww-testimonials-slidelist,
.wptww-testimonials-slide-widget { clear: both; box-sizing: border-box; }

.wptww-testimonial-client { font-weight: bold; }
.wptww-testimonial-job a,
.wptww-testimonial-cdec a { text-decoration: none; }
.wptww-testimonial-job a:active,
.wptww-testimonial-job a:focus,
.wptww-testimonial-cdec a:active,
.wptww-testimonial-cdec a:focus { outline: none; text-decoration: none; }

.wptww-testimonials-list h4,
.wptww-testimonials-slidelist h4,
.wptww-testimonials-slide-widget h4 { font-size: 20px; line-height: 22px; padding: 0; margin: 8px 0; }

.wptww-testimonials-list .wptww-testimonials-text p,
.wptww-testimonials-slidelist .wptww-testimonials-text p,
.wptww-testimonials-slide-widget .wptww-testimonials-text p { font-size: 15px; text-align: center; margin-bottom: 5px; }

.wptww-testimonials-text em::before { color: #ccc; content: "\201C"; font-size: 4em; line-height: 0.1em; margin-right: 0.25em; vertical-align: -0.4em; }
.wptww-testimonials-text em::after  { content: "\201D"; font-size: 4em; line-height: 0.1em; margin-left: 3px; vertical-align: -0.5em; color: #ccc; }
.rtl .wptww-testimonials-text em::before { content: "\201D"; margin: 0 0 0 3px; }
.rtl .wptww-testimonials-text em::after  { content: "\201C"; margin: 0 12px 0 0; }

.wptww-quote { margin-bottom: 30px; float: left; width: 100%; box-sizing: border-box; }
.wptww-testimonial-author { color: #000; clear: both; }
.wptww-testimonial-content { clear: both; text-align: center; width: 100%; }

.wptww-avtar-image-img.wptww-circle,
img.wptww-circle { border-radius: 50% !important; }
.wptww-avtar-image-img.wptww-square,
img.wptww-square { border-radius: 0; }

/* Legacy decorative quote glyph — hidden by default. Set
 * `.wtwp-testimonials-slider-wrp.show-quote-icon` or override this rule to bring it back.
 */
.wptww-quote-icon,
.fa-quote-left { display: none; }

/* Space between quote body and the author/company line; use the site's body font (inherited), but bold. */
.wptww-testimonial-author {
	margin-top: 18px;
	clear: both;
	font-family: inherit;
	font-size: inherit;
	line-height: inherit;
	font-weight: bold;
}
.wptww-testimonial-author .wptww-testimonial-client,
.wptww-testimonial-author .wptww-testimonial-job,
.wptww-testimonial-author .wptww-testimonial-job a,
.wptww-testimonial-author .wptww-testimonial-job a:hover,
.wptww-testimonial-author .wptww-testimonial-job a:focus {
	font-family: inherit;
	font-size: inherit;
	line-height: inherit;
	font-weight: bold;
}
.wptww-testimonial-author .wptww-testimonial-client { margin-bottom: 2px; }
.wptww-testimonial-author .wptww-testimonial-job { margin-top: 0; }

/* ---------- DK slider (vanilla JS replacement for Slick) ---------- */
.wtwp-testimonials-slider-wrp { position: relative; padding: 0 55px; box-sizing: border-box; }
.wptww-testimonials-slidelist,
.wptww-testimonials-slide-widget {
	position: relative;
	overflow: hidden;
	opacity: 0;
	visibility: hidden;
	transition: opacity .3s linear;
}
.wptww-testimonials-slidelist.dk-ready,
.wptww-testimonials-slide-widget.dk-ready,
.wptww-testimonials-slidelist:not([data-dk-init]),
.wptww-testimonials-slide-widget:not([data-dk-init]) {
	/* .dk-ready is set by the JS as it initialises; fallback: visible when no JS inits */
}
.wptww-testimonials-slidelist.dk-ready,
.wptww-testimonials-slide-widget.dk-ready { opacity: 1; visibility: visible; }

/* Non-JS fallback: show first slide if JS never ran */
.wptww-testimonials-slidelist:not(.dk-ready) .wptww-quote ~ .wptww-quote,
.wptww-testimonials-slide-widget:not(.dk-ready) .wptww-quote ~ .wptww-quote { display: none; }
.wptww-testimonials-slidelist:not(.dk-ready),
.wptww-testimonials-slide-widget:not(.dk-ready) { opacity: 1; visibility: visible; }

.wptww-testimonials-slidelist .dk-slide,
.wptww-testimonials-slide-widget .dk-slide { padding: 0 15px; box-sizing: border-box; }

.wtwp-testimonials-slider-wrp .dk-arrow {
	position: absolute; top: 50%; transform: translateY(-50%); z-index: 9;
	width: 32px; height: 32px; padding: 0; margin: 0;
	background: transparent; border: 0; cursor: pointer; color: currentColor;
	display: flex; align-items: center; justify-content: center;
}
.wtwp-testimonials-slider-wrp .dk-arrow[hidden] { display: none !important; }
.wtwp-testimonials-slider-wrp .dk-prev { left: 8px; }
.wtwp-testimonials-slider-wrp .dk-next { right: 8px; }
.wtwp-testimonials-slider-wrp .dk-arrow:focus-visible { outline: 2px solid currentColor; outline-offset: 2px; }
.wtwp-testimonials-slider-wrp .dk-arrow svg { width: 18px; height: 26px; opacity: .6; }
.wtwp-testimonials-slider-wrp .dk-arrow:hover svg { opacity: 1; }

.wtwp-testimonials-slider-wrp .dk-dots {
	list-style: none; padding: 0; margin: 10px 0 0; text-align: center;
}
.wtwp-testimonials-slider-wrp .dk-dots li {
	list-style: none !important; list-style-type: none !important;
	display: inline-block !important; width: 10px; height: 10px; margin: 0 3px;
	padding: 0;
}
.wtwp-testimonials-slider-wrp .dk-dots li::marker,
.wtwp-testimonials-slider-wrp .dk-dots li::before { content: none !important; display: none !important; }
.wtwp-testimonials-slider-wrp .dk-dots button {
	-webkit-appearance: none; -moz-appearance: none; appearance: none;
	width: 10px; height: 10px; padding: 0; margin: 0;
	background: #fff; border: 1px solid #000; border-radius: 50%;
	font-size: 0; line-height: 0; color: transparent;
	text-indent: -99999px; cursor: pointer; box-shadow: none;
}
.wtwp-testimonials-slider-wrp .dk-dots li.is-active button { background: #444; }
.wtwp-testimonials-slider-wrp .dk-dots button:focus-visible { outline: 2px solid #444; outline-offset: 2px; }

/* ---------- design-1 ---------- */
.wptww-testimonials-slidelist.design-1,
.wptww-testimonials-list.design-1 { margin-bottom: 30px; }
.wptww-testimonials-slidelist.design-1 .wptww-testimonial-client,
.wptww-testimonials-list.design-1 .wptww-testimonial-client,
.wptww-testimonials-list.design-1 .wptww-testimonial-job,
.wptww-testimonials-slidelist.design-1 .wptww-testimonial-job,
.wptww-testimonials-slide-widget.design-1 .wptww-testimonial-client,
.wptww-testimonials-slide-widget.design-1 .wptww-testimonial-job { text-align: center; }
.wptww-testimonials-slidelist.design-1 .wptww-testimonials-text p,
.wptww-testimonials-list.design-1 .wptww-testimonials-text p,
.wptww-testimonials-slide-widget.design-1 .wptww-testimonials-text p { margin-bottom: 5px; }

/* Keep legacy Font-Awesome rule working for anyone who still loads FA */
.wptww-testimonials-slidelist.design-1 .fa-quote-left,
.wptww-testimonials-list.design-1 .fa-quote-left,
.wptww-testimonials-slide-widget.design-1 .fa-quote-left { width: 30px; height: 35px; font-size: 30px; padding: 10px 0; color: #94c523; }

/* ---------- design-2 ---------- */
.wptww-testimonials-slidelist.design-2,
.wptww-testimonials-list.design-2 { margin-bottom: 30px; }
.wptww-testimonials-slidelist.design-2 .wptww-testimonial-client,
.wptww-testimonials-list.design-2 .wptww-testimonial-client,
.wptww-testimonials-list.design-2 .wptww-testimonial-job,
.wptww-testimonials-slidelist.design-2 .wptww-testimonial-job,
.wptww-testimonials-slide-widget.design-2 .wptww-testimonial-client,
.wptww-testimonials-slide-widget.design-2 .wptww-testimonial-job { text-align: center; }
.wptww-testimonials-slidelist.design-2 .wptww-avtar-image,
.wptww-testimonials-list.design-2 .wptww-avtar-image,
.wptww-testimonials-slide-widget.design-2 .wptww-avtar-image { margin-bottom: 10px; }

/* ---------- design-3 (bubble card with avatar above) ---------- */
.wptww-testimonials-list.design-3 .wptww-testimonial-box { margin-bottom: 60px; }
.wptww-testimonials-slidelist.design-3 .wptww-testimonial-inner,
.wptww-testimonials-list.design-3 .wptww-testimonial-inner,
.wptww-testimonials-slide-widget.design-3 .wptww-testimonial-inner {
	border: 1px solid #ddd; position: relative; margin-top: 60px; padding: 65px 15px 15px; text-align: center;
}
.wptww-testimonials-slidelist.design-3 .wptww-testimonial-inner .wptww-testimonial_avatar,
.wptww-testimonials-list.design-3 .wptww-testimonial-inner .wptww-testimonial_avatar,
.wptww-testimonials-slide-widget.design-3 .wptww-testimonial-inner .wptww-testimonial_avatar {
	position: absolute; top: -60px; left: 0; right: 0; height: 120px;
}
.wptww-testimonials-slidelist.design-3 .wptww-testimonial-inner .wptww-testimonial_avatar .wptww-avtar-image,
.wptww-testimonials-list.design-3 .wptww-testimonial-inner .wptww-testimonial_avatar .wptww-avtar-image,
.wptww-testimonials-slide-widget.design-3 .wptww-testimonial-inner .wptww-testimonial_avatar .wptww-avtar-image { width: 120px; margin: 0 auto; }
.wptww-testimonials-slidelist.design-3 .wptww-testimonial-inner .wptww-testimonial_avatar img,
.wptww-testimonials-list.design-3 .wptww-testimonial-inner .wptww-testimonial_avatar img,
.wptww-testimonials-slide-widget.design-3 .wptww-testimonial-inner .wptww-testimonial_avatar img {
	width: 100%; max-width: 100%; height: auto; border: 1px solid #ddd; padding: 5px; background: #fff;
}

/* ---------- design-4 (bubble card with avatar to the left) ---------- */
.wptww-testimonials-list.design-4 .wptww-testimonial-box { margin-bottom: 60px; }
.wptww-testimonials-slidelist.design-4 .wptww-testimonial-inner,
.wptww-testimonials-list.design-4 .wptww-testimonial-inner,
.wptww-testimonials-slide-widget.design-4 .wptww-testimonial-inner {
	border: 1px solid #ddd; position: relative; margin-left: 50px; padding: 15px 15px 15px 70px;
}
.wptww-testimonials-slidelist.design-4 .wptww-testimonial-inner .wptww-testimonial_avatar,
.wptww-testimonials-list.design-4 .wptww-testimonial-inner .wptww-testimonial_avatar,
.wptww-testimonials-slide-widget.design-4 .wptww-testimonial-inner .wptww-testimonial_avatar {
	position: absolute; top: 10px; left: -50px; width: 100px;
}
.wptww-testimonials-list.design-4 .wptww-testimonial-content,
.wptww-testimonials-slidelist.design-4 .wptww-testimonial-content,
.wptww-testimonials-slide-widget.design-4 .wptww-testimonial-content { text-align: left; }

/* ---------- responsive grid helpers (ported) ---------- */
.wpcolumn, .wpcolumns,
.wptww-testimonials-list *,
.wptww-testimonials-slidelist *,
.wptww-testimonials-slide-widget * { -webkit-box-sizing: border-box; box-sizing: border-box; }
.wpcolumn, .wpcolumns {
	padding-left: .9375em; padding-right: .9375em; float: left; width: 100%; position: relative;
}
@media only screen and (min-width: 40.0625em) {
	.wp-medium-1  { width:  8.33333%; }
	.wp-medium-2  { width: 16.66667%; }
	.wp-medium-3  { width: 25%; }
	.wp-medium-4  { width: 33.33333%; }
	.wp-medium-5  { width: 41.66667%; }
	.wp-medium-6  { width: 50%; }
	.wp-medium-7  { width: 58.33333%; }
	.wp-medium-8  { width: 66.66667%; }
	.wp-medium-9  { width: 75%; }
	.wp-medium-10 { width: 83.33333%; }
	.wp-medium-11 { width: 91.66667%; }
	.wp-medium-12 { width: 100%; }
}
.wptww-testimonials-list .wptww-first { clear: both !important; }
