/* Mu-Shiland - rendimiento al hacer scroll.
   Cargado al final (index.php). Para quitarlo: borra la linea que carga perf.css. */

/* 1) Fondo fijo en capa propia: el navegador ya no lo repinta en cada paso del scroll */
body.is-inner-page { background: #070506 !important; }
body.is-inner-page::after {
	content: '';
	position: fixed;
	inset: 0;
	z-index: -1;
	pointer-events: none;
	background:
		linear-gradient(rgba(2, 2, 6, 0.80), rgba(4, 3, 4, 0.95)),
		url('../img/halloween-hero-bg.jpg') center top / cover no-repeat;
	transform: translateZ(0);
}

/* 2) Los murcielagos de las paginas internas animaban background-position sin parar
      (repintado constante de toda la pantalla). Se dejan quietos; la telarana se mantiene. */
body.is-inner-page::before { animation: none !important; }

/* 3) Desenfoque (blur) detras de todo el contenido de la pagina: muy caro y casi no se nota */
#container.container-inner {
	backdrop-filter: none !important;
	box-shadow: 0 16px 40px rgba(0, 0, 0, 0.5), inset 0 0 0 1px rgba(0, 0, 0, 0.78) !important;
}

/* 4) Sombras (filter) en cada imagen de item: cientos de capas en Donaciones y Tienda */
#automatic-itemshop .itemshop-product__image img,
#automatic-itemshop .itemshop-configurator__preview img { filter: none !important; }

/* Donaciones: boton de WhatsApp compacto (icono + "Comprar") y linea de detalle */
#automatic-itemshop .donaciones-whatsapp-btn {
	display: flex !important;
	align-items: center;
	justify-content: center;
	gap: 8px;
	width: 100%;
	height: 40px;
	box-sizing: border-box;
	padding: 0 12px !important;
	border-radius: 8px;
	font-size: 14px !important;
	font-weight: 700 !important;
	line-height: 1 !important;
	letter-spacing: .02em;
	text-align: center !important;
}
#automatic-itemshop .donaciones-whatsapp-btn svg { width: 18px; height: 18px; flex: 0 0 auto; fill: currentColor; }
#automatic-itemshop .donaciones-whatsapp-btn,
#automatic-itemshop .donaciones-whatsapp-btn:link,
#automatic-itemshop .donaciones-whatsapp-btn:visited,
#automatic-itemshop .donaciones-whatsapp-btn:hover,
#automatic-itemshop .donaciones-whatsapp-btn:focus,
#automatic-itemshop .donaciones-whatsapp-btn span {
	color: #06210f !important;
	opacity: 1 !important;
	text-shadow: none !important;
}
#automatic-itemshop .donaciones-whatsapp-btn { background: #25D366 !important; }
#automatic-itemshop .donaciones-whatsapp-btn:hover { background: #3be07a !important; }

#automatic-itemshop .donaciones-product__list { list-style: none; margin: 8px 0 0; padding: 0; text-align: left; font-size: 12.5px; line-height: 1.35; color: #cfc4a8; }
#automatic-itemshop .donaciones-product__list li { position: relative; padding: 3px 0 3px 16px; border-top: 1px solid rgba(255,255,255,.07); }
#automatic-itemshop .donaciones-product__list li:first-child { border-top: 0; }
#automatic-itemshop .donaciones-product__list li::before { content: ''; position: absolute; left: 3px; top: 9px; width: 5px; height: 5px; border-radius: 50%; background: #d9a441; }
#automatic-itemshop .donaciones-product__detail { display: block; margin-top: 4px; font-size: 12px; color: #b9ad92; }

/* Donaciones: packs con dos imagenes lado a lado */
#automatic-itemshop .itemshop-product__image--multi { display: flex; align-items: center; justify-content: center; gap: 6px; }
#automatic-itemshop .itemshop-product__image--multi img { max-width: 46%; max-height: 96px; }
#automatic-itemshop .itemshop-product__image--tri img { max-width: 24%; max-height: 72px; }

/* Donaciones: el filtro de raza solo se ve cuando el script lo muestra (antes un !important lo dejaba siempre visible) */
#automatic-itemshop .donaciones-subtabs[style*="display: none"],
#automatic-itemshop .donaciones-subtabs[style*="display:none"] { display: none !important; }

/* Joyas: las imagenes son muy pequenas, se agrandan para que se vean */
#automatic-itemshop .categoria_shop_item[data-category="joyeria"] .itemshop-product__image img { width: 58px; height: auto; max-height: none; }
#automatic-itemshop .itemshop-product__image--tri img { width: 36px; max-width: 24%; }

/* Celular: filtros y tarjetas en 2 columnas, textos y boton mas compactos */
@media (max-width: 480px) {
	#automatic-itemshop .itemshop-filter-grid,
	#automatic-itemshop .donaciones-subtabs { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
	#automatic-itemshop .itemshop-grid { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; gap: 10px; }
	#automatic-itemshop .itemshop-product__image { height: 104px; padding: 6px; }
	#automatic-itemshop .itemshop-product__image img { max-height: 84px; }
	#automatic-itemshop .itemshop-product__body { padding: 8px 6px; }
	#automatic-itemshop .itemshop-product__body h3 { font-size: 14px; line-height: 1.25; }
	#automatic-itemshop .itemshop-product__body p,
	#automatic-itemshop .donaciones-product__detail { font-size: 11.5px; line-height: 1.3; }
	#automatic-itemshop .itemshop-product__price strong { font-size: 14px; }
	#automatic-itemshop .donaciones-whatsapp-btn { height: 36px; font-size: 13px !important; }
	#automatic-itemshop .donaciones-set-table__pieces td:last-child { white-space: nowrap; }
}