/* ============================================================
   DISAN3D — estilos globales
   ============================================================ */
/* version 2.0 */
[x-cloak] {
  display: none !important;
}

html {
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  scroll-behavior: smooth;
}

/* Acento turquesa en controles nativos */
:root {
  accent-color: #4d888e;
}

/* Ocultar scrollbar pero mantener scroll (menús/chips) */
.no-scrollbar::-webkit-scrollbar {
  display: none;
}
.no-scrollbar {
  -ms-overflow-style: none;
  scrollbar-width: none;
}

/* Inputs range (filtro de precio) */
input[type='range'].brand-range {
  -webkit-appearance: none;
  appearance: none;
  width: 100%;
  height: 4px;
  border-radius: 9999px;
  background: linear-gradient(to right, #4d888e var(--fill, 50%), #e2e4e0 var(--fill, 50%));
  outline: none;
}
input[type='range'].brand-range::-webkit-slider-thumb {
  -webkit-appearance: none;
  appearance: none;
  width: 18px;
  height: 18px;
  border-radius: 9999px;
  background: #ffffff;
  border: 3px solid #4d888e;
  cursor: pointer;
  box-shadow: 0 1px 4px rgba(0, 0, 0, 0.25);
}
input[type='range'].brand-range::-moz-range-thumb {
  width: 18px;
  height: 18px;
  border-radius: 9999px;
  background: #ffffff;
  border: 3px solid #4d888e;
  cursor: pointer;
}

/* Placeholder de producto cuando aún no hay fotografía real */
.product-ph {
  display: flex;
  align-items: center;
  justify-content: center;
  background:
    radial-gradient(120% 120% at 20% 0%, #eaf3f3 0%, #f4f6f3 55%, #e6e9e4 100%);
}
.dark .product-ph {
  background:
    radial-gradient(120% 120% at 20% 0%, #1f3a3d 0%, #22303a 55%, #191f26 100%);
}

/* Animación suave al aparecer el grid */
@keyframes d3-fade-up {
  from { opacity: 0; transform: translateY(10px); }
  to   { opacity: 1; transform: translateY(0); }
}
.d3-fade-up {
  animation: d3-fade-up 0.5s ease both;
}

/* Detalle técnico "capas" de impresión 3D (decorativo, sutil) */
.d3-lines {
  background-image: repeating-linear-gradient(
    to bottom,
    rgba(77, 136, 142, 0.08) 0px,
    rgba(77, 136, 142, 0.08) 2px,
    transparent 2px,
    transparent 7px
  );
}

/* Cabecera, pie y contenido "legacy" de la plantilla se ocultan: el
   contenido nuevo de Disan3D vive en #page-root y la cabecera/pie se
   inyectan en #site-header / #site-footer (elementos anidados). */
body > header,
body > footer,
body > main {
  display: none;
}

/* El desplegable nativo de <select> (p. ej. ordenar por en el catálogo)
   heredaba texto claro en fondo claro en modo oscuro. Se fuerza un fondo
   y color explícitos por tema para que las opciones sean legibles. */
select {
  color-scheme: light;
}
.dark select {
  color-scheme: dark;
}
select option {
  color: #1f2937;
  background-color: #ffffff;
}
.dark select option {
  color: #f3f4f6;
  background-color: #1f2937;
}