:root {
	--wcps-border-color: #29baf1;
	--wcps-shadow-color: #29baf1;
	--wcps-radius: 9px;
	--wcps-bg: #ffffff;
}

.wcps-slider-container {
	position: relative;
	width: 100%;
	margin: 0 auto 16px;
	display: flex;
	flex-direction: column;
	align-items: stretch;
	padding-bottom: 0;
}

.wcps-slider-title {
	font-size: 20px;
	font-weight: 700;
	margin: 0 10px 18px;
	color: var(--wcps-title-color, #0f1f2d);
	text-transform: none;
	padding-bottom: 6px;
	border-bottom: 2px solid #29baf1;
	padding-top: 10px;
}


.wcps-slider {
	display: flex;
	gap: 16px;
	overflow-x: auto;
	scroll-snap-type: x mandatory;
	scroll-behavior: smooth;
	align-items: stretch; /* igualar alturas */
	padding: 0 10px 0;
	box-sizing: border-box;
	scroll-padding: 0 10px;
	flex-direction: row-reverse;
}
.wcps-slider::-webkit-scrollbar { display: none; }
.wcps-slider { cursor: grab; }
.wcps-slider.is-dragging { cursor: grabbing; }

.wcps-card {
	flex: 0 0 calc((100% - 16px) / 2);
	scroll-snap-align: start;
	/*padding: 8px;*/
	box-sizing: border-box;
	display: flex;
	height: 100%;
}

.wcps-inner {
	background: var(--wcps-bg);
	border: var(--wcps-border-width, 1px) solid var(--wcps-border-color);
	border-bottom: calc(var(--wcps-border-width, 1px) + 2px) solid var(--wcps-border-color);
	border-radius: var(--wcps-radius);
	box-shadow: 0px 5px 25px -10px var(--wcps-shadow-color);
	--wcps-media-width: 100%;
	--wcps-media-max-height: none;
	/*padding: var(--wcps-card-padding, 12px);*/
	padding-left: 5px;
    padding-right: 5px;
    padding-top: 5px;
    padding-bottom: 5px;
	transition: transform .2s ease, box-shadow .2s ease;
	display:flex;
	flex-direction:column;
	box-sizing:border-box;
	height: 100%;
	min-height: var(--wcps-card-min-height, 360px);
}
.wcps-inner:hover { transform: translateY(-2px); box-shadow: 0px 8px 30px -12px var(--wcps-shadow-color); }
.wcps-image {
	max-height: var(--wcps-media-max-height, none);
	position: relative;
	width: 100%;
	aspect-ratio: var(--wcps-image-aspect, 4 / 3);
	border-radius: var(--wcps-image-radius, calc(var(--wcps-radius) - 2px));
	max-height: var(--wcps-image-max-height, none);
	overflow: hidden;
	flex: 0 0 auto;
}
.wcps-image a {
	display: block;
	width: 100%;
	height: 100%;
}

.wcps-image img {
	width: 100%;
	height: 100%;
	display: block;
	object-fit: var(--wcps-image-fit, cover);
}

.wcps-title {
	font-size: 16px;
	font-weight: 600;
	margin-top: 8px;
	margin-bottom: 4px;
	line-height: 1.3;
	min-height: 2.6em; /* reserva espacio para dos líneas */
}
.wcps-title a { 
    display:-webkit-box;
    -webkit-line-clamp:2;
    -webkit-box-orient:vertical;
    overflow:hidden; /* limitar líneas para altura consistente */
    line-clamp:2; 
    text-align: center;
    
} 
.wcps-title a { color: var(--wcps-title-color, inherit); text-decoration: none; }
.wcps-title a:hover { color: #29baf1; }

.wcps-rating {
	display: flex;
	align-items: center;
	gap: 0;
	margin-bottom: 4px;
	justify-content: center;
	min-height: 18px;
}
.wcps-rating .star-rating {
	float: none;
	margin: 0;
	position: relative;
	display: inline-block;
	font-size: 16px;
	line-height: 1;
	width: auto;
	height: 1em;
}
.wcps-rating .star-rating::before {
	content: "★★★★★";
	font-family: star, Arial, sans-serif;
	letter-spacing: 1px;
	display: block;
	color: #e0e0e0;
}
.wcps-rating .star-rating span {
	position: absolute;
	top: 0;
	left: 0;
	width: 0;
	height: 100%;
	overflow: hidden;
}
.wcps-rating .star-rating span::before {
	content: "★★★★★";
	font-family: star, Arial, sans-serif;
	letter-spacing: 1px;
	display: block;
	color: #f5ad02;
}
.wcps-rating-count {
	font-size: 13px;
	color: #000;
	margin-left: 0;
}

.wcps-price { font-size: 15px; color: var(--wcps-price-color, #111); margin-bottom: 6px; text-align: center; }


.wcps-badges { 
	margin-bottom: 6px; 
    display: flex; 
    justify-content: center; 
    gap: 6px; 
    flex-wrap: wrap; 
    text-align: center;
}
.wcps-badge {
	display: inline-block;
	padding: 3px 8px;
	font-size: 12px;
	border-radius: 999px;
	font-weight: 600;
}
.wcps-badge--in {
	background: #e6f9ec;
	color: #1f7a35;
	border: 1px solid #bce8c7;
}
/*.wcps-badge--out {
	background: #fff3e6;
	color: #9a4a00;
	border: 1px solid #ffd4a8;
}*/


.wcps-actions .button, .wcps-actions button, .wcps-actions a.button {
	background: var(--wcps-btn-bg, #29baf1);
	border-color: var(--wcps-btn-bg, #29baf1);
	color: var(--wcps-btn-color, #fff);
	border-radius: var(--wcps-btn-radius, 6px);
	box-shadow: 0 6px 14px -6px var(--wcps-btn-shadow, #29baf1);
	font-size: 14px;
	padding: 8px 16px;
}
.wcps-actions .button:hover, .wcps-actions a.button:hover { filter: brightness(0.98); }
/* Mantener borde verde y anular border gris inline */
.wcps-actions .button,
.wcps-actions button,
.wcps-actions a.button {
  border: 1px solid var(--wcps-btn-bg, #29baf1) !important;
}

/* Si ves un contorno gris, es el outline del foco: */
.wcps-actions .button:focus,
.wcps-actions a.button:focus {
  outline: none !important;
}

/* Empujar acciones al fondo y centrar botones */
.wcps-actions { margin-top:auto; padding-top: 4px; }
/* Asegurar misma fila y alineación para todos los botones */
.wcps-actions { display:flex; justify-content:center; align-items:stretch; width:100%; }
.wcps-actions .button, .wcps-actions button, .wcps-actions a.button {
	display:inline-flex;
	align-items:center;
	justify-content:center;
	width:100%;
	max-width:240px;
}
.wcps-actions .wcps-disabled-btn[aria-disabled="true"] { pointer-events:none; }
/* Configuración flexible para el botón de fuera de temporada */
.wcps-actions .wcps-disabled-btn {
	background: var(--wcps-disabled-bg, var(--wcps-btn-bg, #29baf1));
	color: var(--wcps-disabled-color, var(--wcps-btn-color, #fff));
	border: 1px solid var(--wcps-disabled-border, var(--wcps-btn-bg, #29baf1)) !important;
	box-shadow: 0 6px 14px -6px var(--wcps-disabled-shadow, var(--wcps-btn-shadow, #29baf1));
	font-size: var(--wcps-disabled-font-size, 14px);
	padding: var(--wcps-disabled-padding, 8px 16px) !important;
	max-width: var(--wcps-disabled-max-width, 240px);
	width: var(--wcps-disabled-width, 100%);
	margin-left: var(--wcps-disabled-margin-left, auto);
	margin-right: var(--wcps-disabled-margin-right, auto);
	opacity: var(--wcps-disabled-opacity, 1);
}
.wcps-actions--center { justify-content:center; }

/* Estado deshabilitado con mismo diseño (usar aria-disabled) */
.wcps-actions .button[aria-disabled="true"] {
	cursor: not-allowed;
	pointer-events: none;
}


.wcps-controls {
	display: flex;
	gap: 10px;
	justify-content: center;
	align-items: center;
	margin-top: 4px;
	padding: 0 10px;
}
.wcps-btn {
	display: inline-flex;
	justify-content: center;
	align-items: center;
	/* Botón dimensionado en función del tamaño del icono */
	width: calc(var(--wcps-nav-icon-size, 16px) * 1.8);
	height: calc(var(--wcps-nav-icon-size, 16px) * 1.8);
	min-width: 36px;
	min-height: 36px;
	border-radius: 50%;
	border: 1px solid var(--wcps-nav-bg, #29baf1);
	background: var(--wcps-nav-bg, #29baf1);
	color: var(--wcps-nav-color, #fff);
	cursor: pointer;
	box-shadow: 0 6px 14px -6px var(--wcps-nav-bg, #29baf1);
	font-size: var(--wcps-nav-icon-size, 16px);
	line-height: 1;
	padding: 0;
	box-sizing: border-box;
	overflow: hidden;
}
.wcps-btn:hover { filter: brightness(1.05); }

/* Responsive moderno: 1 / 2 / 3 / 4 por vista */
@media (min-width: 480px) {
	.wcps-card { flex-basis: calc((100% - 16px) / 2); padding: 10px; }
}
@media (min-width: 640px) {
	.wcps-card { flex-basis: calc((100% - 32px) / 3); padding: 12px; }
}
@media (min-width: 900px) {
	.wcps-card { flex-basis: calc((100% - 48px) / 4); }
}
@media (min-width: 1280px) {
	.wcps-card { flex-basis: calc((100% - 64px) / 5); }
}

@media (max-width: 639px) {
	.wcps-slider { padding: 0 18px 12px; scroll-padding: 0 18px; }
	.wcps-card {/* padding: 10px;*/ }
	.wcps-price { margin-bottom: 4px; }
	.wcps-badges { margin-bottom: 4px; }
	.wcps-actions { /*margin-top: 6px;*/ }
	.wcps-inner { min-height: var(--wcps-card-min-height-mobile, 320px); }
	.wcps-actions .wcps-disabled-btn {
		max-width: var(--wcps-disabled-max-width-mobile, min(var(--wcps-disabled-max-width, 240px), 160px));
		width: var(--wcps-disabled-width-mobile, var(--wcps-disabled-width, 100%));
		padding: var(--wcps-disabled-padding-mobile, var(--wcps-disabled-padding, 8px 16px)) !important;
		margin-left: var(--wcps-disabled-margin-left-mobile, var(--wcps-disabled-margin-left, auto));
		margin-right: var(--wcps-disabled-margin-right-mobile, var(--wcps-disabled-margin-right, auto));
	}
}

/* Admin: campos de diseño verticales */
.wcps-admin-fields label { display:block; margin:8px 0 4px; font-weight:600; }
.wcps-admin-fields { display:flex; flex-direction:column; gap:4px; }
.wcps-field-group { display:flex; flex-direction:column; }
.wcps-admin-fields input[type=text],
.wcps-admin-fields input[type=number],
.wcps-admin-fields select { display:block; width:100%; max-width:520px; }
.wcps-admin-fields .wp-picker-container { display:block; }
.wcps-admin-fields h4 { margin:14px 0 6px; font-size:14px; font-weight:700; }
.wcps-admin-fields .description { margin-top:12px; }

/* Forzar cada campo de diseño a ocupar toda la fila */
.wcps-admin-fields input[type=text],
.wcps-admin-fields input[type=number],
.wcps-admin-fields .wp-picker-container .wp-color-result { width:100% !important; max-width:520px; }
.wcps-admin-fields input[type=number] { box-sizing:border-box; }
.wcps-admin-fields label + input,
.wcps-admin-fields label + select { margin-bottom:8px; }

/* Admin: forzar vertical en Categorías y Etiquetas */
#wcps_sel_cats,
#wcps_sel_tags,
#wcps_clear_cats,
#wcps_clear_tags,
select[name="wcps_categories[]"],
select[name="wcps_tags[]"] {
	display:block;
	width:100% !important;
	max-width:520px;
}
#wcps_clear_cats,#wcps_clear_tags { width:auto !important; margin:0 0 8px 0; }

/* Custom hero slider */
.wcps-slider-container--media {
	--wcps-media-border-color: rgba(255,255,255,0.3);
	--wcps-media-border-width: 0px;
	--wcps-media-radius: 18px;
	--wcps-media-bg: #0b0b0b;
	--wcps-media-shadow: rgba(0,0,0,0.25);
	--wcps-media-padding: 32px;
	--wcps-media-overlay: linear-gradient(120deg, rgba(0,0,0,0.55), rgba(0,0,0,0.15));
	--wcps-media-text-color: #ffffff;
	--wcps-media-btn-bg: #ffffff;
	--wcps-media-btn-color: #000000;
	--wcps-media-aspect: 16 / 9;
	--wcps-media-fit: cover;
	--wcps-media-position: 50% 50%;
}
.wcps-slider--media {
	flex-direction: row;
	padding-bottom: 8px;
}
.wcps-card--media {
	flex: 0 0 min(100%, var(--wcps-media-width, 100%));
	max-width: min(100%, var(--wcps-media-width, 100%));
	margin-left: auto;
	margin-right: auto;
	padding: 0 10px;
	box-sizing: border-box;
}
.wcps-media-frame {
	position: relative;
	width: 100%;
	aspect-ratio: var(--wcps-media-aspect, 16 / 9);
	border-radius: var(--wcps-media-radius, 18px);
	border: var(--wcps-media-border-width, 0px) solid var(--wcps-media-border-color, transparent);
	background: var(--wcps-media-bg, #0b0b0b);
	box-shadow: 0 20px 40px -18px var(--wcps-media-shadow, rgba(0,0,0,0.25));
	overflow: hidden;
}
.wcps-media-frame img,
.wcps-media-frame a img {
	width: 100%;
	height: 100%;
	object-fit: var(--wcps-media-fit, cover);
	object-position: var(--wcps-media-position, 50% 50%);
	display: block;
}
.wcps-media-frame a.wcps-media-link { display:block; width:100%; height:100%; }
.wcps-media-overlay {
	position: absolute;
	inset: 0;
	display: flex;
	flex-direction: column;
	justify-content: flex-end;
	gap: 10px;
	padding: var(--wcps-media-padding, 32px);
	background: var(--wcps-media-overlay, rgba(0,0,0,0.4));
	color: var(--wcps-media-text-color, #fff);
}
.wcps-media-heading {
	font-size: clamp(20px, 4vw, 34px);
	font-weight: 700;
	line-height: 1.2;
}
.wcps-media-description {
	font-size: clamp(15px, 2vw, 18px);
	max-width: 720px;
	line-height: 1.4;
}
.wcps-media-btn {
	align-self: flex-start;
	display: inline-flex;
	padding: 10px 22px;
	border-radius: 999px;
	background: var(--wcps-media-btn-bg, #fff);
	color: var(--wcps-media-btn-color, #000);
	text-decoration: none;
	font-weight: 600;
	box-shadow: 0 8px 20px -12px rgba(0,0,0,0.5);
}
.wcps-media-btn:hover { filter: brightness(1.05); }

@media (max-width: 768px) {
	.wcps-media-overlay { padding: 20px; }
	.wcps-card--media { padding: 0 4px; }
}

/* Admin: custom slider builder */
.wcps-custom-slider-fields .wcps-field-grid {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
	gap: 12px 18px;
	margin-bottom: 14px;
}
.wcps-custom-slides {
	display: flex;
	flex-direction: column;
	gap: 14px;
	margin: 12px 0;
}
.wcps-custom-slide-row {
	border: 1px solid #ccd0d4;
	border-radius: 8px;
	background: #f9fafb;
	padding: 12px;
}
.wcps-custom-slide-toolbar {
	display: flex;
	justify-content: space-between;
	align-items: center;
	margin-bottom: 10px;
}
.wcps-custom-slide-grid {
	display: grid;
	grid-template-columns: minmax(200px, 260px) 1fr;
	gap: 18px;
	align-items: flex-start;
}
.wcps-slide-preview {
	border: 1px dashed #b1b1b1;
	border-radius: 8px;
	padding: 10px;
	text-align: center;
	background: #fff;
}
.wcps-slide-preview.has-image { border-style: solid; }
.wcps-slide-preview img {
	width: 100%;
	height: auto;
	max-height: 160px;
	object-fit: cover;
	margin-bottom: 8px;
}
.wcps-slide-fields textarea { min-height: 80px; }
.wcps-slide-field-split {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
	gap: 12px;
}
.wcps-hidden { display: none !important; }

@media (max-width: 720px) {
	.wcps-custom-slide-grid { grid-template-columns: 1fr; }
}