/* 1-A  Fuente corporativa  — solo una línea  */
@import url('https://fonts.googleapis.com/css2?family=Montserrat:wght@400;600&display=swap');

/* 1-B  Variables de color sacadas del pantone */
:root{
  --c-primary:  #132048; /* PANTONE 2768 C */
  --c-teal:     #00aea5; /* PANTONE 326 C  */
  --c-blue:     #005487; /* PANTONE 7692 C */
  --c-yellow:   #fdd900; /* PANTONE 108 C  */
  --c-gray-10:  #e6e6e6; /* BLACK 10 %     */
  --radius: 14px;
  --shadow: 0 4px 24px rgba(0,0,0,.25);
  --font: 'Montserrat', system-ui, sans-serif;
}

/* 1-C  Burbuja flotante */
/* ==== LAUNCHER ESPECÍFICO (burbuja) ==== */
#scb-bubble{
  all:unset;            /* reinicia estilos de button */
  position:fixed; top:50%; right:24px; transform:translateY(-50%);
  display:flex; align-items:center;
  width:60px; height:60px; cursor:pointer;
  border-radius:60px;   /* redondo inicialmente */
  background:var(--c-primary); box-shadow:var(--shadow);
  overflow:hidden; transition:width .35s ease;
  animation:scb-pulse 3s infinite;
  z-index:9999;
  font-family:var(--font); font-size:.8rem; font-weight:600; line-height:1.1;
  color:#fff;
}
#scb-bubble:hover{
  width:190px;          /* se convierte en píldora */
  animation:none;       /* detiene pulso al hover */
}
#scb-bubble .scb-ico{
  flex:none; width:60px; height:60px;
}
#scb-bubble .scb-label{
  opacity:0; margin-left:4px; text-align:left;
  transition:opacity .25s .05s;   /* un pequeño delay */
}
#scb-bubble:hover .scb-label{ opacity:1; }

/* Pulso suave alrededor de la burbuja */
@keyframes scb-pulse{
  0%   { box-shadow:0 0 0 0 rgba(0,174,165,.6); }
  70%  { box-shadow:0 0 0 14px rgba(0,174,165,0); }
  100% { box-shadow:0 0 0 0 rgba(0,174,165,0); }
}


/* 1-D  Ventana */
#scb-window{
  position:fixed; top:50%; right:96px; transform:translateY(-50%);
  width:340px; max-height:80vh; display:flex; flex-direction:column;
  background:#fff; border:2px solid var(--c-teal); border-radius:var(--radius);
  box-shadow:var(--shadow); overflow:hidden; z-index:9999;
  font-family:var(--font);
}
#scb-window.scb-hidden{display:none;}

/* 1-E  Cabecera */
#scb-window header{
  background:var(--c-primary); color:#fff;
  padding:.8rem 1rem; display:flex; justify-content:space-between; align-items:center;
  font-weight:600; font-size:1rem;
}
#scb-close{
  background:none;border:none;color:#fff;font-size:1.25rem;cursor:pointer;
}

/* 1-F  Zona de mensajes */
#scb-messages{flex:1;padding:1rem;overflow-y:auto;font-size:.9rem;line-height:1.35;}
#scb-messages .bot{
  background:var(--c-teal); color:#fff;
  padding:.6rem .75rem; border-radius:var(--radius) var(--radius) var(--radius) 0;
  margin:.25rem 0; white-space:pre-wrap;
}
#scb-messages .user{
  background:var(--c-blue); color:#fff; text-align:right;
  padding:.6rem .75rem; border-radius:var(--radius) 0 var(--radius) var(--radius);
  margin:.25rem 0 .25rem auto; white-space:pre-wrap;
}

/* 1-G  Formulario */
#scb-form{border-top:1px solid var(--c-gray-10); display:flex;}
#scb-form input{
  flex:1; border:none; padding:.9rem .95rem; font-family:var(--font);
  font-size:.9rem; border-radius:0 0 var(--radius) var(--radius);
}
#scb-form input:focus{outline:none;}

/* 1-H  Barra de scroll sutil */
#scb-messages::-webkit-scrollbar{width:6px;}
#scb-messages::-webkit-scrollbar-thumb{
  background:var(--c-gray-10); border-radius:3px;
}

/* Fallback cuando icon.svg no existe o para pantallas táctiles */
#scb-bubble .scb-ico{
  display:flex; align-items:center; justify-content:center;
  font-size:1.4rem;            /* emoji o texto si no hay svg */
  color:#fff;
}

/* En móviles (sin hover) el texto debe ser visible siempre */
@media (hover:none){
  #scb-bubble .scb-label{ opacity:1; }
}

/* Desactiva el hover / expansión cuando la ventana está abierta */
#scb-bubble.chat-open:hover{
  width:60px;
}
#scb-bubble.chat-open:hover .scb-label{
  opacity:0;
}

.scb-header{
    background:var(--c-teal); color:#132048;
    color: #fff;
    text-transform: uppercase;
    padding:.8rem 1rem;
    display:flex;
    align-items:center;
}

.scb-header span{
  font-weight:600;
  font-size:1rem;
}
#scb-close{
  margin-left:auto;
  background:none;
  border:none;
  color:#fff;
  font-size:1.25rem;
  cursor:pointer;
}