/* tienda-legado.css · Piezas de la hoja antigua (css/style.css) que la tienda sigue necesitando con el diseño de PEIG:
   panel de edición del administrador, vista previa SEO, galerías de ficheros y selector de artículos de la home.
   Copiado tal cual de style.css (líneas 5405-5903 y 6528-6606) el 4/11/2026. El resto de style.css ya no se carga en la parte pública. */

.modal {
	z-index: 1000010;
}

.modal-backdrop {
	z-index: 1000000;
}

/* ===== panel de edicion administrador ===== */
#Modal .modal-dialog {
	max-width: 1100px;
	width: 95%;
}

#Modal .modal-body {
	max-height: 78vh;
	overflow-y: auto;
}

.ls_panel_edicion h4 {
	margin-bottom: 4px;
}

.ls_ayuda {
	font-size: 12px;
	color: #8a8a8a;
	font-weight: normal;
}

.ls_badge {
	display: inline-block;
	padding: 3px 12px;
	border-radius: 12px;
	font-size: 12px;
	font-weight: 600;
	color: #fff;
	vertical-align: middle;
}

.ls_badge_n0 {
	background-color: #12986f;
}

.ls_badge_n1 {
	background-color: #e67e22;
}

.ls_badge_n2 {
	background-color: #3498db;
}

.ls_tabla_menu td, .ls_tabla_menu th {
	vertical-align: middle;
	padding: 6px 8px;
}

.ls_fila_menu:hover {
	background-color: #eef8f4;
}

.ls_fila_familia {
	background-color: #f7f7f7;
}

.ls_desplegar {
	cursor: pointer;
	color: #12986f;
	font-size: 14px;
	padding: 6px;
	transition: transform 0.2s;
}

.ls_btn_accion {
	display: inline-block;
	width: 32px;
	height: 32px;
	line-height: 32px;
	text-align: center;
	border-radius: 50%;
	color: #fff;
	cursor: pointer;
	margin-left: 5px;
	font-size: 14px;
	transition: opacity 0.2s;
}

	.ls_btn_accion:hover {
		opacity: 0.75;
	}

.ls_btn_editar {
	background-color: #3498db;
}

.ls_btn_add {
	background-color: #27ae60;
}

.ls_btn_borrar {
	background-color: #c0392b;
}

.ls_thumb {
	width: 52px;
	height: 52px;
	object-fit: cover;
	border-radius: 8px;
	border: 1px solid #ddd;
	background-color: #fff;
}

.ls_thumb_grande {
	max-width: 100%;
	max-height: 160px;
	object-fit: cover;
	border-radius: 8px;
	border: 1px solid #ddd;
	margin-bottom: 6px;
}

.ls_caja_imagen {
	min-height: 40px;
	margin-bottom: 4px;
}

.ls_pendiente {
	color: #c9c9c9;
}

.ls_ok {
	color: #27ae60;
}

.ls_caja_nueva {
	background-color: #f2f9f6;
	border: 1px solid #cfe8dd;
	border-radius: 8px;
	padding: 10px;
	margin: 8px 0;
}

.ls_form_grupo {
	margin-bottom: 12px;
}

	.ls_form_grupo label {
		font-weight: 600;
		margin-bottom: 3px;
		display: block;
	}

.ls_contador {
	font-size: 12px;
	color: #8a8a8a;
}

.ls_cont_ok {
	color: #27ae60;
}

.ls_cont_aviso {
	color: #e67e22;
}

.ls_cont_error {
	color: #c0392b;
	font-weight: bold;
}

.ls_chip_seccion {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	border: 1px solid #d9d9d9;
	border-radius: 18px;
	padding: 5px 12px;
	margin: 4px 6px 4px 0;
	background-color: #fff;
	cursor: pointer;
	font-size: 14px;
	transition: all 0.2s;
}

	.ls_chip_seccion:hover {
		border-color: #12986f;
	}

	.ls_chip_seccion.activa {
		background-color: #eaf7f1;
		border-color: #12986f;
		font-weight: 600;
	}

	.ls_chip_seccion input[type=checkbox] {
		accent-color: #12986f;
		width: 16px;
		height: 16px;
	}

.ls_chip_orden {
	width: 70px;
	border: 1px solid #ddd;
	border-radius: 10px;
	padding: 2px 6px;
	font-size: 13px;
}

.ls_caja_contenido {
	background-color: #fafafa;
	border: 1px solid #e5e5e5;
	border-radius: 10px;
	padding: 14px;
	margin-bottom: 14px;
}

.ls_caja_contenido_nueva {
	background-color: #f2f9f6;
	border: 1px dashed #12986f;
	border-radius: 10px;
	padding: 14px;
	margin-top: 10px;
}

	.ls_caja_contenido_nueva h6 {
		color: #12986f;
		font-weight: 600;
	}

/* ===== botón "Ver la web" en la cabecera del editor ===== */
.ls_btn_ver {
	border: 1px solid #12986f;
	color: #12986f !important;
	background-color: #fff;
	border-radius: 20px;
	padding: 6px 16px;
	font-weight: 600;
}

	.ls_btn_ver:hover {
		background-color: #12986f;
		color: #fff !important;
	}

/* ===== vista previa de resultado en Google (SEO en vivo) ===== */
.ls_seo_preview {
	background-color: #f7f9fa;
	border: 1px solid #e3e8ea;
	border-radius: 10px;
	padding: 14px 16px;
}

.ls_seo_preview_cab {
	font-size: 12px;
	font-weight: 600;
	color: #5f6368;
	text-transform: uppercase;
	letter-spacing: 0.4px;
	margin-bottom: 10px;
}

.ls_seo_card {
	background-color: #fff;
	border: 1px solid #ebebec;
	border-radius: 8px;
	padding: 12px 14px;
	font-family: arial, sans-serif;
}

.ls_seo_url {
	color: #202124;
	font-size: 12px;
	line-height: 1.3;
	margin-bottom: 3px;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}

.ls_seo_title {
	color: #1a0dab;
	font-size: 18px;
	line-height: 1.3;
	margin-bottom: 3px;
	overflow: hidden;
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
}

.ls_seo_desc {
	color: #4d5156;
	font-size: 13px;
	line-height: 1.45;
	overflow: hidden;
	display: -webkit-box;
	-webkit-line-clamp: 3;
	-webkit-box-orient: vertical;
}

.ls_seo_nota {
	margin-top: 8px;
}

/* iconos de tipo de sección en chips y pestañas */
.ls_chip_seccion .ls_ico_seccion {
	margin-right: 4px;
	opacity: 0.75;
}

/* ===== secciones activas: lista arrastrable para ordenar ===== */
.ls_titulo_zona {
	font-weight: 600;
	color: #333;
	margin-bottom: 8px;
}

	.ls_titulo_zona > i {
		color: #12986f;
		margin-right: 4px;
	}

.ls_lista_orden {
	list-style: none;
	margin: 0;
	padding: 0;
}

.ls_item_orden {
	display: flex;
	align-items: center;
	gap: 10px;
	background-color: #fff;
	border: 1px solid #d9e6e0;
	border-left: 4px solid #12986f;
	border-radius: 8px;
	padding: 8px 12px;
	margin-bottom: 6px;
	transition: box-shadow 0.15s;
}

	.ls_item_orden:hover {
		box-shadow: 0 2px 8px rgba(0,0,0,0.08);
	}

	.ls_item_orden .ls_arrastrar {
		cursor: grab;
		cursor: -webkit-grab;
		color: #9aa5a0;
		padding: 2px 4px;
		font-size: 16px;
	}

	.ls_item_orden[draggable="true"] {
		cursor: grab;
		cursor: -webkit-grab;
	}

	.ls_item_orden.ls_arrastrando {
		opacity: 0.45;
		border-style: dashed;
	}

.ls_num_orden {
	width: 24px;
	height: 24px;
	line-height: 24px;
	text-align: center;
	border-radius: 50%;
	background-color: #12986f;
	color: #fff;
	font-size: 12px;
	font-weight: 600;
	flex: none;
}

.ls_nombre_seccion {
	flex: 1 1 auto;
	font-weight: 500;
	color: #333;
}

.ls_quitar_seccion {
	cursor: pointer;
	color: #c0392b;
	padding: 4px 6px;
	border-radius: 6px;
}

	.ls_quitar_seccion:hover {
		background-color: #fbece9;
	}

.ls_item_orden_placeholder {
	border: 1px dashed #12986f;
	background-color: #eef8f4;
	border-radius: 8px;
	height: 44px;
	margin-bottom: 6px;
	list-style: none;
}

.ls_item_orden_vacio {
	list-style: none;
	color: #8a8a8a;
	background-color: #fafafa;
	border: 1px dashed #ddd;
	border-radius: 8px;
	padding: 12px;
}

.ls_chip_add {
	cursor: pointer;
}

	.ls_chip_add:hover {
		border-color: #12986f;
		background-color: #f2f9f6;
	}

#Modal .nav-tabs .nav-link {
	cursor: pointer;
}

	#Modal .nav-tabs .nav-link.active {
		font-weight: 600;
		color: #12986f;
		border-bottom: 3px solid #12986f;
	}

/* los editores TinyMCE ocupan siempre el ancho disponible del modal, respetando margenes */
#Modal .mceEditor {
	display: block;
	width: 100% !important;
	max-width: 100%;
}

#Modal table.mceLayout {
	width: 100% !important;
	table-layout: fixed;
}

#Modal .mceIframeContainer iframe {
	width: 100% !important;
}

#Modal .mceToolbar {
	max-width: 100%;
	overflow: hidden;
}

/* mejoras genericas para todos los apartados de edicion del modal */
#div_modificar .row {
	margin-bottom: 8px;
}

#div_modificar .form-control,
#div_modificar textarea,
#div_modificar select {
	max-width: 100%;
	margin-top: 2px;
}

#div_modificar img:not([class*="mce"]):not(.ls_thumb):not(.ls_thumb_grande) {
	display: block;
	max-width: 100%;
	max-height: 110px;
	height: auto;
	border: 1px solid #ddd;
	background-color: #fff;
	padding: 2px;
	margin-top: 6px;
}

#div_modificar h4 {
	border-bottom: 2px solid #eef4f0;
	padding-bottom: 6px;
}

#div_modificar h5 {
	margin-top: 6px;
}

#div_modificar .btn {
	margin-left: 4px;
}

/* encabezado h1 solo para seo, oculto visualmente (solo se usa en la home) */
.seo_oculto {
	position: absolute;
	width: 1px;
	height: 1px;
	margin: -1px;
	padding: 0;
	overflow: hidden;
	clip: rect(0 0 0 0);
	white-space: nowrap;
	border: 0;
}


/* Galeria de ficheros (front): lista de descargas */
.ls_ficheros { list-style: none; margin: 0; padding: 0; }
.ls_ficheros li { border-bottom: 1px solid #e6e6e6; }
.ls_ficheros li a {
	display: block;
	padding: 12px 8px;
	color: #2a2a2a;
	text-decoration: none;
	transition: background .15s, padding-left .15s;
}
.ls_ficheros li a:hover { background: #f2f8f5; padding-left: 16px; color: #1f7a4d; }
.ls_ficheros li a i { color: #1f7a4d; margin-right: 8px; }

/* Galeria de imagenes/ficheros (administrador): rejilla con borrado */
.ls_galeria_admin_item {
	position: relative;
	overflow: hidden;
	border-radius: 8px;
	background: #f0f0f0;
}
.ls_galeria_admin_item img {
	display: block;
	width: 100%;
	height: 130px;
	object-fit: cover;
}
.ls_galeria_admin_item .ls_pendiente {
	display: flex;
	align-items: center;
	justify-content: center;
	height: 130px;
	color: #aaa;
	font-size: 26px;
}
.ls_galeria_admin_borrar {
	position: absolute;
	top: 6px;
	right: 6px;
	width: 30px;
	height: 30px;
	line-height: 30px;
	text-align: center;
	border-radius: 50%;
	background: rgba(200,0,0,0.85);
	color: #fff;
	cursor: pointer;
}
.ls_galeria_admin_borrar:hover { background: #b00000; }
/* editor "Nuestros productos" de la home (utilidades_home opcion 33): resultados del buscador y lista de seleccionados */
.ls_busqueda_articulos {
	max-height: 260px;
	overflow-y: auto;
}
.ls_busqueda_item {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 10px;
	padding: 6px 10px;
	border-bottom: 1px solid #eee;
	background: #fff;
}
.ls_busqueda_item:hover { background: #f5f5f5; }
.ls_seleccion_img {
	width: 40px;
	height: 40px;
	object-fit: cover;
	margin-right: 8px;
	border: 1px solid #eee;
	vertical-align: middle;
}
/* aviso que solo ve el administrador cuando un apartado esta vacio y por tanto oculto al visitante */
.ls_aviso_admin {
	padding: 18px;
	text-align: center;
	color: #777;
	background: #fafafa;
	border: 1px dashed #ccc;
}