/* ============================================================
   LATINDOMO — Design System (ui-ux-pro-max: Swiss/Minimal + brand)
   Marca: azul #68A8D8 / verde #78B080 · Tipografía: Rubik + Nunito Sans
   ============================================================ */
@import url('https://fonts.googleapis.com/css2?family=Nunito+Sans:wght@400;600;700&family=Rubik:wght@400;500;600;700&display=swap');

:root{
  /* Marca */
  --ld-blue:#68A8D8;
  --ld-blue-dark:#4f8fc0;
  --ld-green:#78B080;
  --ld-green-dark:#5f9568;
  /* Tinta / texto */
  --ld-ink:#1E293B;
  --ld-ink-soft:#475569;
  --ld-muted:#64748B;
  /* Superficies */
  --ld-bg:#F5F8FC;
  --ld-surface:#FFFFFF;
  --ld-border:#E6EEF6;
  /* Sistema */
  --ld-radius:14px;
  --ld-radius-sm:10px;
  --ld-shadow:0 1px 3px rgba(30,41,59,.06), 0 6px 16px rgba(30,41,59,.05);
  --ld-shadow-h:0 12px 30px rgba(104,168,216,.22);
  --ld-trans:.18s ease;
}

/* ---------- Base tipográfica ---------- */
html,body{overflow-x:hidden;max-width:100%;}
img{max-width:100%;height:auto;}
body{
  font-family:'Nunito Sans',-apple-system,BlinkMacSystemFont,'Segoe UI',Arial,sans-serif;
  color:var(--ld-ink);
  background:var(--ld-bg);
  -webkit-font-smoothing:antialiased;
}
h1,h2,h3,h4,h5,h6,.h1,.h2,.h3,.h4,.page-header,.product-title,
.btn,.navbar,.ld-section-title,.ld-home-intro h2{
  font-family:'Rubik',-apple-system,BlinkMacSystemFont,'Segoe UI',Arial,sans-serif;
}
a,a:visited{color:var(--ld-blue);transition:color var(--ld-trans);}
a:hover{color:var(--ld-blue-dark);}
*:focus-visible{outline:2px solid var(--ld-blue);outline-offset:2px;}
.tabular,.price,.current-price span,.product-price{font-variant-numeric:tabular-nums;}

/* ---------- Botones ---------- */
.btn{border-radius:10px;font-weight:600;transition:all var(--ld-trans);}
.btn-primary,.btn-primary:focus{background-color:var(--ld-blue);border-color:var(--ld-blue);}
.btn-primary:hover,.btn-primary:active,.btn-primary.active{background-color:var(--ld-blue-dark);border-color:var(--ld-blue-dark);}
.add-to-cart,.btn-secondary.add-to-cart,#submit-search{
  background-color:var(--ld-green);border-color:var(--ld-green);color:#fff;
}
.add-to-cart:hover,#submit-search:hover{background-color:var(--ld-green-dark);border-color:var(--ld-green-dark);}

/* ---------- Header / Nav ---------- */
.header-top{background:var(--ld-surface);padding-top:6px;padding-bottom:6px;}
.header-nav{background:linear-gradient(90deg,var(--ld-blue) 0%,var(--ld-blue-dark) 100%);}
.header-nav a,.header-nav .expand-more{color:#fff;}
header .header-top{box-shadow:0 1px 0 var(--ld-border);}
/* logo más presente */
#_desktop_logo img,.header-top .logo{max-height:64px;width:auto;}
/* barra superior de contacto */
.header-top .header-top-row,.header-banner{font-size:.9rem;color:var(--ld-muted);}
/* menú principal */
#_desktop_top_menu .top-menu a.dropdown-item,
.menu .top-menu a{font-weight:500;}
.top-menu .sub-menu{border:0;border-radius:var(--ld-radius-sm);box-shadow:var(--ld-shadow-h);padding:6px;}
.top-menu .sub-menu a{border-radius:8px;}
.top-menu .sub-menu a:hover{background:var(--ld-bg);color:var(--ld-blue-dark);}
/* buscador */
#search_widget form{border:1px solid var(--ld-border);border-radius:999px;background:#fff;overflow:hidden;box-shadow:var(--ld-shadow);}
#search_widget input[type=text]{border:0;padding:11px 16px;}
#search_widget input[type=text]:focus{box-shadow:none;outline:none;}
#search_widget button[type=submit]{border-radius:999px;}
/* carrito */
.blockcart.cart-preview .header{color:#fff;}
.header-nav .cart-preview .body{color:var(--ld-ink);}

/* Precio */
.product-price,.current-price span,.price{color:var(--ld-green-dark);font-weight:700;}

/* Footer */
.footer-container{border-top:3px solid var(--ld-green);background:var(--ld-surface);}

/* Badges / etiquetas */
.product-flag.discount,.discount-percentage{background-color:var(--ld-green);}
.product-flag{border-radius:8px;font-weight:600;letter-spacing:.02em;box-shadow:var(--ld-shadow);font-size:.72rem;padding:5px 9px;}
/* Todo el catálogo se cargó nuevo: ocultar el flag "Nuevo" para que no sea ruido visual */
.product-flag.new{display:none !important;}

/* ============================================================
   TARJETAS DE PRODUCTO (featured + novedades + listados)
   ============================================================ */
.product-miniature .thumbnail-container,
.js-product-miniature .thumbnail-container{width:100%;}
.product-miniature{margin-bottom:8px;}

.product-miniature .thumbnail-container .product-thumbnail,
.js-product-miniature .product-thumbnail{display:block;background:#fff;}

.product-miniature .product-description,
.js-product-miniature .product-description{
  padding:14px 14px 16px;
}
.product-title{font-size:.95rem;line-height:1.3;font-weight:500;margin:0 0 6px;}
.product-title a{color:var(--ld-ink);}
.product-title a:hover{color:var(--ld-blue-dark);}

/* contenedor tipo card */
#js-product-list .product-miniature,
.featured-products .product-miniature,
.products .product-miniature{
  background:var(--ld-surface);
  border:1px solid var(--ld-border);
  border-radius:var(--ld-radius);
  overflow:hidden;
  box-shadow:var(--ld-shadow);
  transition:transform var(--ld-trans),box-shadow var(--ld-trans),border-color var(--ld-trans);
}
#js-product-list .product-miniature:hover,
.featured-products .product-miniature:hover,
.products .product-miniature:hover{
  transform:translateY(-4px);
  box-shadow:var(--ld-shadow-h);
  border-color:var(--ld-blue);
}
.product-miniature img{transition:transform .25s ease;}
.product-miniature:hover img{transform:scale(1.03);}

/* Títulos de sección (Productos destacados / Novedades) */
.products-section-title,
h2.products-section-title,
.featured-products .h2,
.h2.products-section-title{
  text-align:center;color:var(--ld-ink);font-weight:700;
  font-size:1.6rem;margin:42px 0 6px;letter-spacing:-.01em;
}
.featured-products,.tab-content .tab-pane{padding-top:0;}

/* ============================================================
   HOME — intro + franja de confianza
   ============================================================ */
.ld-home-intro{text-align:center;max-width:880px;margin:30px auto 6px;}
.ld-home-intro h2{color:var(--ld-ink);font-weight:700;font-size:1.7rem;letter-spacing:-.01em;}
.ld-home-intro .ld-lead{color:var(--ld-muted);font-size:1.08rem;line-height:1.6;}

.ld-features{
  display:flex;flex-wrap:wrap;gap:16px;justify-content:center;
  margin:22px auto 36px;max-width:1140px;
}
.ld-features .ld-feature{
  flex:1 1 220px;max-width:260px;background:var(--ld-surface);border:1px solid var(--ld-border);
  border-radius:var(--ld-radius);padding:20px 16px;text-align:center;
  box-shadow:var(--ld-shadow);
  display:flex;flex-direction:column;align-items:center;gap:6px;
  border-top:3px solid var(--ld-green);
  transition:transform var(--ld-trans),box-shadow var(--ld-trans);
}
.ld-features .ld-feature:hover{transform:translateY(-3px);box-shadow:var(--ld-shadow-h);}
.ld-features .ld-ico{color:var(--ld-blue);line-height:1;}
.ld-features .ld-ico svg{stroke:var(--ld-blue);width:30px;height:30px;}
.ld-features .ld-feature strong{color:var(--ld-ink);font-size:1rem;font-family:'Rubik',sans-serif;}
.ld-features .ld-feature small{color:var(--ld-muted);font-size:.86rem;line-height:1.45;}

/* ---------- Grilla de categorías ---------- */
.ld-cat-grid{
  display:grid;grid-template-columns:repeat(4,1fr);gap:18px;
  max-width:1140px;margin:26px auto 10px;
}
@media (max-width:991px){ .ld-cat-grid{grid-template-columns:repeat(3,1fr);} }
@media (max-width:575px){ .ld-cat-grid{grid-template-columns:repeat(2,1fr);} }
.ld-cat-card{
  display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px;
  background:var(--ld-surface);border:1px solid var(--ld-border);border-radius:var(--ld-radius);padding:28px 14px;
  text-align:center;text-decoration:none;color:var(--ld-ink);
  box-shadow:var(--ld-shadow);transition:transform var(--ld-trans),box-shadow var(--ld-trans),border-color var(--ld-trans);
}
.ld-cat-card:hover{
  transform:translateY(-4px);border-color:var(--ld-blue);
  box-shadow:var(--ld-shadow-h);color:var(--ld-ink);
}
.ld-cat-ico{
  width:66px;height:66px;border-radius:50%;
  display:flex;align-items:center;justify-content:center;
  background:linear-gradient(135deg,#eaf3fb,#e8f4ec);color:var(--ld-blue);
}
.ld-cat-ico svg{stroke:var(--ld-blue);width:32px;height:32px;}
.ld-cat-name{font-weight:600;font-size:.98rem;line-height:1.2;font-family:'Rubik',sans-serif;}

/* Encabezado de sección genérico */
.ld-section-title{text-align:center;color:var(--ld-ink);font-weight:700;margin:40px 0 4px;font-size:1.6rem;letter-spacing:-.01em;}

/* ---------- Newsletter / bloque inferior ---------- */
.block_newsletter{background:var(--ld-surface);border:1px solid var(--ld-border);border-radius:var(--ld-radius);padding:22px;box-shadow:var(--ld-shadow);}
.block_newsletter .btn{background:var(--ld-blue);border-color:var(--ld-blue);}

/* ============================================================
   BANNER responsive (desktop horizontal / mobile vertical)
   ============================================================ */
#carousel{border-radius:var(--ld-radius);overflow:hidden;box-shadow:var(--ld-shadow);margin-top:14px;}
/* el texto ya viene dentro de la imagen del banner: ocultar caption en todas las pantallas */
#carousel .carousel-item .caption,
#carousel .caption-description,
#carousel .caption-title{display:none !important;}
#carousel .carousel-item img{width:100%;height:auto;display:block;}
@media (max-width:767px){
  #carousel .carousel-item img{display:none !important;}
  #carousel .carousel-inner > .carousel-item figure{
    position:relative;width:100%;margin:0;padding-bottom:131%;
    background-position:center;background-size:cover;background-repeat:no-repeat;
    border-radius:var(--ld-radius);
  }
  /* cada slide muestra su imagen vertical propia */
  #carousel .carousel-inner > .carousel-item:nth-child(1) figure{background-image:url('https://latindomo.com/modules/ps_imageslider/images/ld-slide-1-mobile.jpg');}
  #carousel .carousel-inner > .carousel-item:nth-child(2) figure{background-image:url('https://latindomo.com/modules/ps_imageslider/images/ld-camaras-mobile-v2.jpg');}
  #carousel .carousel-inner > .carousel-item:nth-child(3) figure{background-image:url('https://latindomo.com/modules/ps_imageslider/images/ld-domotica-mobile-v2.jpg');}
  #carousel .carousel-inner > .carousel-item:nth-child(4) figure{background-image:url('https://latindomo.com/modules/ps_imageslider/images/ld-autos-mobile-v2.jpg');}
}

/* ============================================================
   BOTÓN FLOTANTE WHATSAPP
   ============================================================ */
.ld-wa{
  position:fixed; z-index:9999;
  right:24px; bottom:calc(24px + env(safe-area-inset-bottom,0px));
  height:60px; padding:0 24px 0 16px; border-radius:999px;
  background:#25D366; color:#fff; text-decoration:none;
  display:inline-flex; align-items:center; gap:11px;
  box-shadow:0 8px 22px rgba(37,211,102,.45);
  transition:transform var(--ld-trans), box-shadow var(--ld-trans), background var(--ld-trans);
}
.ld-wa:hover{ transform:translateY(-2px); box-shadow:0 12px 28px rgba(37,211,102,.55); background:#1ebe5b; color:#fff; }
.ld-wa:focus-visible{ outline:3px solid #128C7E; outline-offset:3px; }
.ld-wa svg{ width:32px; height:32px; fill:#fff; flex:0 0 auto; }
.ld-wa .ld-wa-label{ font-family:'Rubik',sans-serif; font-weight:600; font-size:1rem; white-space:nowrap; }
/* En mobile colapsa a círculo (solo icono) para no tapar contenido */
@media (max-width:767px){
  .ld-wa{ right:16px; bottom:calc(16px + env(safe-area-inset-bottom,0px)); width:56px; height:56px; padding:0; justify-content:center; }
  .ld-wa .ld-wa-label{ display:none; }
  .ld-wa svg{ width:30px; height:30px; }
}
@media (prefers-reduced-motion:reduce){ .ld-wa:hover{ transform:none; } }

/* prefers-reduced-motion */
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{transition:none !important;animation:none !important;}
  .product-miniature:hover img{transform:none;}
}
