/* =========================
   Seinto WhatsApp - FRONT
   ========================= */
:root {
  --seinto-wa-bg: #25d366;
  --seinto-wa-fg: #fff;
}

.seinto-wa-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: .5rem;
  border-radius: 4px;
  text-decoration: none;
  font-weight: 400;
  line-height: 1;
  white-space: nowrap;
  cursor: pointer;
  transition: background-color .2s ease, transform .1s ease;
}

/* === Header === */
.seinto-wa-btn--header {
  background: transparent !important;
  color: inherit !important;
  padding: 0 !important;
  margin: 0 0 0 30px !important; /* separación izquierda en Nav1 */
  border-radius: 0;
  box-shadow: none;
  line-height: inherit;
  gap: .35rem;
}
.seinto-wa-btn--header:hover {
  background: transparent !important;
  opacity: 1;
  text-decoration: underline;
  transform: none;
}

/* === Producto === */
.seinto-wa-btn--product {
  background-color: var(--seinto-wa-bg) !important;
  color: var(--seinto-wa-fg) !important;
  padding: 1rem 1.5rem;
  margin: 1rem 0;
  width: auto;
}
.seinto-wa-btn--product:hover {
  background-color: #20ba5a !important;
  transform: translateY(-1px);
  text-decoration: none !important;
}

/* === Flotante === */
.seinto-wa-btn--floating {
  position: fixed;
  right: 16px;
  bottom: 60px;
  width: 68px;          
  height: 68px;         
  border-radius: 50%;
  padding: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  background: var(--seinto-wa-bg);
  color: var(--seinto-wa-fg);
  box-shadow: 0 6px 20px rgba(0,0,0,.2);
  z-index: 999999;
}
.seinto-wa-btn--floating:hover {
  background-color: #20ba5a;
}

/* === Icono general === */
.seinto-wa-ico {
  width: 15px;     
  height: 15px;
  display: inline-block;
  background:
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='%23fff' viewBox='0 0 24 24'%3E%3Cpath d='M20.52 3.48A11.9 11.9 0 0012.05 0 11.94 11.94 0 000 12a12 12 0 001.64 6.05L0 24l6.17-1.6A11.94 11.94 0 0012 24h.01A11.94 11.94 0 0024 12a11.9 11.9 0 00-3.48-8.52zM12 21.8a9.73 9.73 0 01-4.95-1.35l-.36-.21-3.65.95.98-3.56-.24-.37A9.76 9.76 0 1121.77 12 9.78 9.78 0 0112 21.8zm5.36-7.29c-.3-.15-1.77-.87-2.04-.97s-.48-.15-.68.15-.78.97-.96 1.16-.36.22-.66.07a7.95 7.95 0 01-2.34-1.44 8.82 8.82 0 01-1.63-2c-.17-.3 0-.47.13-.62l.38-.45c.15-.15.2-.26.3-.45a.53.53 0 000-.52c-.07-.15-.68-1.63-.93-2.21s-.5-.5-.68-.5h-.57a1.1 1.1 0 00-.8.37 3.38 3.38 0 00-1.07 2.51 5.86 5.86 0 001.22 3.13 13.34 13.34 0 005.11 4.91 17.66 17.66 0 001.75.64 4.2 4.2 0 001.93.12 3.15 3.15 0 002.07-1.46 2.58 2.58 0 00.18-1.46c-.09-.14-.27-.23-.57-.37z'/%3E%3C/svg%3E")
    no-repeat center/contain;
}

/* Icono verde para header */
.seinto-wa-btn--header .seinto-wa-ico {
  background-image:
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='%2325d366' viewBox='0 0 24 24'%3E%3Cpath d='M20.52 3.48A11.9 11.9 0 0012.05 0 11.94 11.94 0 000 12a12 12 0 001.64 6.05L0 24l6.17-1.6A11.94 11.94 0 0012 24h.01A11.94 11.94 0 0024 12a11.9 11.9 0 00-3.48-8.52zM12 21.8a9.73 9.73 0 01-4.95-1.35l-.36-.21-3.65.95.98-3.56-.24-.37A9.76 9.76 0 1121.77 12 9.78 9.78 0 0112 21.8zm5.36-7.29c-.3-.15-1.77-.87-2.04-.97s-.48-.15-.68.15-.78.97-.96 1.16-.36.22-.66.07a7.95 7.95 0 01-2.34-1.44 8.82 8.82 0 01-1.63-2c-.17-.3 0-.47.13-.62l.38-.45c.15-.15.2-.26.3-.45a.53.53 0 000-.52c-.07-.15-.68-1.63-.93-2.21s-.5-.5-.68-.5h-.57a1.1 1.1 0 00-.8.37 3.38 3.38 0 00-1.07 2.51 5.86 5.86 0 001.22 3.13 13.34 13.34 0 005.11 4.91 17.66 17.66 0 001.75.64 4.2 4.2 0 001.93.12 3.15 3.15 0 002.07-1.46 2.58 2.58 0 00.18-1.46c-.09-.14-.27-.23-.57-.37z'/%3E%3C/svg%3E");
}

/* Icono más grande dentro del flotante */
.seinto-wa-btn--floating .seinto-wa-ico {
  width: 30px;   /* antes 20px */
  height: 30px;
}
