@import url('https://cdn.jsdelivr.net/npm/@n8n/chat/dist/style.css');


html {
    scroll-behavior: smooth;
    scroll-padding-top: 100px;
}
body {
    font-family: 'Inter', sans-serif;
}
.hero-slide {
    background-size: cover;
    background-position: center;
    transition: opacity 1s ease-in-out;
}
.wpool-cyan { color: #00A9C1; }
.bg-wpool-cyan { background-color: #00A9C1; }
.hover\:bg-wpool-cyan-dark:hover { background-color: #008a9f; }
.wpool-teal { color: #007A8A; }
.bg-wpool-teal { background-color: #007A8A; }
.hover\:bg-wpool-teal-dark:hover { background-color: #005f6b; }
.bg-wpool-cyan-footer { background-color: rgba(0, 169, 193, 0.9); }
.scrolled {
    background-color: rgba(255, 255, 255, 0.9);
    backdrop-filter: blur(10px);
    box-shadow: 0 2px 4px rgba(0,0,0,0.05);
}
.scrolled .nav-link { color: #374151; }
.scrolled .nav-link:hover { color: #00A9C1; }
.scrolled .contact-btn {
    background-color: #007A8A;
    border-color: #007A8A;
    color: white;
}
.scrolled .contact-btn:hover { background-color: #005f6b; }
.scroll-container {
    scroll-snap-type: x mandatory;
    scroll-behavior: smooth;
}
.scroll-container::-webkit-scrollbar { display: none; }
.scroll-item { scroll-snap-align: center; }
.scrolled #mobile-menu-button {
    color: white; /* Color inicial del icono */
}
.scrolled #mobile-menu-button {
    color: #374151; /* Este es un gris oscuro, como el de los otros enlaces */
}
:root{
    /*Colores chat n8n */
    --chat--color-primary: #00A9C1; /*Color circulo pequeño*/
    --chat--color-primary-shade-50: #00A9C1; /*Color hover*/
    --chat--color-primary-shade-100: #F2F2F2; /*Color hover clic*/

    --chat--color-dark: rgba(0, 169, 193, 1); /*Color encabezado y texto*/
    --chat--color-light: #F2F2F2; /*Color background chat*/

    --chat--message--bot--background: #d4ede3; /*Color background texto bot*/
    --chat--message--bot--color: #000000; /*Color texto bot*/

    --chat--message--user--background: #6597aa;/*Color background texto user*/
    --chat--message--user--color: #ffffff; /*Color texto user*/

    --chat--color-secondary: #65aaa1; /*Color boton enviar*/
    --chat--color-white: #F2F2F2; /*Color chat pequeño*/
    --chat--toggle--size: 80px;

    --chat--border-radius: 1rem; 
    --chat--heading--font-size: 3em;
    
}

/* Solo afectar al div principal del chat, no a sus hijos */
body > div[class*="chat"]:last-child,
#n8n-chat > div[class*="chat"]:last-child {
    bottom: 50px !important;
    right: 30px !important;
}

/* Asegurar que los elementos internos mantengan su posición */
div[class*="chat"] div[class*="chat"] {
    position: relative !important;
    bottom: auto !important;
    right: auto !important;
}