/*
*  html5resetcss
*/
html,body,div,span,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,abbr,address,cite,code,del,dfn,em,img,ins,kbd,q,samp,small,strong,sub,sup,var,b,i,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,figcaption,figure,footer,header,hgroup,menu,nav,section,summary,time,mark,audio,video{margin:0;padding:0;border:0;outline:0;font-size:100%;vertical-align:baseline;background:transparent}
body{line-height:1}
article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section{display:block}
nav ul{list-style:none}
blockquote,q{quotes:none}
blockquote:before,blockquote:after,q:before,q:after{content:none}
a{margin:0;padding:0;font-size:100%;vertical-align:baseline;background:transparent}
ins{background-color:#ff9;color:#000;text-decoration:none}
mark{background-color:#ff9;color:#000;font-style:italic;font-weight:bold}
del{text-decoration:line-through}
abbr[title],dfn[title]{border-bottom:1px dotted;cursor:help}
table{border-collapse:collapse;border-spacing:0}
hr{display:block;height:1px;border:0;border-top:1px solid #ccc;margin:1em 0;padding:0}
input,select{vertical-align:middle}

/*border box*/
*{box-sizing: border-box;}

/* fonts - Open Sans */

/* open-sans-regular - latin */
@font-face {
	font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
	font-family: 'Open Sans';
	font-style: normal;
	font-weight: 400;
	src: url('../fonts/open-sans-v40-latin-regular.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}
/* open-sans-italic - latin */
@font-face {
	font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
	font-family: 'Open Sans';
	font-style: italic;
	font-weight: 400;
	src: url('../fonts/open-sans-v40-latin-italic.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}
/* open-sans-500 - latin */
@font-face {
	font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
	font-family: 'Open Sans';
	font-style: normal;
	font-weight: 500;
	src: url('../fonts/open-sans-v40-latin-500.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}
/* open-sans-500italic - latin */
@font-face {
	font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
	font-family: 'Open Sans';
	font-style: italic;
	font-weight: 500;
	src: url('../fonts/open-sans-v40-latin-500italic.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}
/* open-sans-600 - latin */
@font-face {
	font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
	font-family: 'Open Sans';
	font-style: normal;
	font-weight: 600;
	src: url('../fonts/open-sans-v40-latin-600.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}
/* open-sans-600italic - latin */
@font-face {
	font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
	font-family: 'Open Sans';
	font-style: italic;
	font-weight: 600;
	src: url('../fonts/open-sans-v40-latin-600italic.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}


 /* utilities */

.u-hideVisually {
	position: absolute;
	width: 1px !important;
	height: 1px;
	padding: 0;
	margin: -1px;
	overflow: hidden;
	clip: rect(0, 0, 0, 0);
	border: 0;
}

/* ======== */

html, body {
  margin: 0;
  padding: 0;
  height: 100%;
  overflow: hidden; /* Evita scroll en todo el iframe */
}

body {
	font-family: 'Open Sans', sans-serif; 
	font-size: 16px;
}

h6 {
	font-weight: 500; 
	font-size: 16px; 
	line-height: 1.25;
}

a {
	color: #003DA5;
}

/* Contenedor */
.chat-wrapper {
  display: flex;
  flex-direction: column;
  height: 100%;
}

/* Cabezal - header */
.avdgi-header {
	display: flex;
	flex-shrink: 0; /* Asegura que no se reduzcan de tamaño */
	justify-content: space-between;
	align-items: center;
	padding: 14px 16px 15px;
	background-color: #003DA5;
	border-top: 2px solid;
	border-left: 2px solid;
	border-right: 2px solid;
	border-color: #003DA5;
}

.avdgi-header h6 {
  color: #fff;
}

.avdgi-header .close {
  background-color: #fff;
  border-radius: 40px;
  display: flex;
  justify-content: center;
  align-items: center;
  width: 40px;
  height: 40px;
}


/* Contenido - chat */
.avdgi-chat {
  background-color: #fff;
  border-left: 2px solid;
  border-right: 2px solid;
  border-bottom: 2px solid;
  border-color: #003DA5;
  padding: 24px 18px;
  gap: 24px;
  scrollbar-width: thin;
  position: relative;
	
	flex-grow: 1; /* Ocupa el espacio restante */
  overflow-y: auto; /* Permite scroll solo si es necesario */
	overflow-x: hidden;
}

.avdgi-chat .sticky {
	width: calc(100% + 36px);
	height: 60px;
	position: sticky;
	bottom: -30px;
	/* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#ffffff+0,ffffff+100&0+0,1+100 */
	background: linear-gradient(to bottom,  rgba(255,255,255,0) 0%,rgba(255,255,255,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
	margin-left: -18px;
}

.item-message {
  padding: 16px 18px;
  display: flex;
  justify-content: flex-start;
  align-items: flex-start;
  gap: 12px;
  margin-top: 20px;
}

.item-message:first-child { 
	margin-top: 0;
}

.item-message .message {
  flex-grow: 1;
}

.item-message .message p {
  font-size: 16px;
  line-height: 1.5;
  color: #191919;
  text-align: left;
  padding-bottom: 8px;
}

.item-message .message p:last-child {
  padding-bottom: 0;
}

.item-message .message ol, 
.item-message .message ul {
  padding-bottom: 10px;
  margin-left: 20px;
}

.item-message .message ol li, 
.item-message .message ul li {
  padding-bottom: 6px;
  color: #191919;
  line-height: 1.5;
}

.item-message .message p.date {
  font-size: 14px;
  text-align: right;
  line-height: 1.4;
	margin-bottom: -2px;
}

.item-message.bot-message {
  background-color: #EBF2FF;
  border-radius: 15px 15px 15px 0;
	padding-left: 15px;
}

.item-message.bot-message img {
	height: 24px;
	width: 24px;
}

.item-message.user-message {
  background-color: #C2D8FF;
  border-radius: 15px 0 15px 15px;
}

.item-message.system-message {
  background-color: #FFF;
  padding: 0;
  justify-content: center;
}

.item-message.system-message p {
	text-align: center;
	line-height: 1.5;
	color: #191919;
}

.item-message.system-message.end-chat {
  padding-bottom: 32px;
  border-bottom: 1px solid #B2B2B2;
  justify-content: flex-start;
  margin-bottom: 32px;
}

.item-message.system-message.end-chat p {
  text-align: left!important;
  color: #484649;
 }

/* Pie - input */
.avdgi-input {
	flex-shrink: 0; /* Asegura que no se reduzcan de tamaño */
  border: 2px solid #003DA5;
  background-color: #003DA5;
  padding: 14px 12px;
  border-top: none;
}

.avdgi-input form {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 16px;
  background-color: #fff;
  padding: 8px 8px 8px 12px;
  border-radius: 4px;
}

.avdgi-input form .Form-group {
	flex-grow: 1; 
}

.avdgi-input form .Form-group input.Form-widget {
  width: 100%;
  font-size: 16px;
  font-weight: 400;
	font-family: 'Open Sans', sans-serif; 
  color: #333;
  border: none;
}

.avdgi-input form .Form-group input.Form-widget:focus,
.avdgi-input form .Form-group input.Form-widget:focus-visible,
.avdgi-input form .Form-group input.Form-widget:focus-within {
  border: none;
  outline: none;
}

.avdgi-input form button {
  background-color: transparent;
  display: flex;
  justify-content: center;
  align-items: center;
  width: 32px;
  height: 32px;
  border-radius: 40px;
  border: none;
}

.avdgi-input form button:hover {
  cursor: pointer;
  background-color: #f4f4f4;
}

/* spinner */
.spinner-wrap {
	padding: 4px; 
	width: 16px; 
	height: 24px;
}

.spinner {
  width: 16px;
  height: 16px;
  border-radius: 50%;
  border: 2px solid transparent;
  border-top-color: #36815D; 
  animation: spin 1s linear infinite;
}

@keyframes spin {
  0% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(360deg);
  }
}