****************************************************************************/
/* STILE DELLA CHAT E DEI PANNELLI */

/* HELP: Da qui è possibile modificare:
- I font ed i colori della chat
- Le dimensioni e la posizione della chat
- Lo sfondo della chat*/

   @import url('https://fonts.googleapis.com/css2?family=Exo+2:ital,wght@0,400;0,600;1,400&display=swap');

/* Font ABEL */
@font-face {
    font-family: 'Abel';
    src: url('../../css/font/Abel-Regular.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
}

/* Font Indie Flower */
@font-face {
    font-family: 'Indie Flower';
    src: url('../../css/font/IndieFlower-Regular.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
}

/* Font SOURCE CODE PRO (Regular) */
@font-face {
    font-family: 'Source Code Pro';
    src: url('../../css/font/SourceCodePro-Regular.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
}

/* Font SOURCE CODE PRO (Bold) */
@font-face {
    font-family: 'Source Code Pro';
    src: url('../../css/font/SourceCodePro-Bold.ttf') format('truetype');
    font-weight: bold;
    font-style: normal;
}



   
iframe.iframe_chat{
   border: none;
   width: 1px;
   height: 1px;
   margin: 0px;
}
div.chat_window{
  text-align: center;
}

/**	* Fix per layout elastico
	* @author Blancks
*/
div.chat_box{
	position:absolute;
	top:40px;
	bottom:120px;
	left:0px;
	right:10px;
	overflow:auto;
	font-size: 12px;
	text-align:justify;
    padding:10px;
    background-image: url(/themes/advanced/imgs/textureCS.jpg)}

.form_chat {
  	bottom: 0;
    position: absolute;
    width: 100%;
} 

div.pagina_frame_chat div.page_body div.panels_box{
	position:absolute;
	bottom:9px;
	left:5px;
	right:5px;
}
/**	* Fine fix */



/** * Avatar di chat
	* @author Blancks
*/
img.chat_avatar{
	margin:8px;
    display: block;
    float: left;
    position: relative;
    border-radius: 50px 50px 50px 0px;
    border: 1px solid #191813; 
}

/*Icone presenti*/
img.chat_ico{
  margin-left: 2px;
  width: 15px;
  height: 15px;
  border:none;
  vertical-align: middle;
}


/***** testo della chat *****/



/* Tipi messaggio: (L Off, A azione, P parlato, N PNG, M Master, I Immagine, S sussurro, D dado, C skill check, O uso oggetto) */


div.chat_row_P	span.color3{
color: #5afddd;
margin: 1px;
font-family: 'Exo 2', sans-serif;
text-align:justify;
text-transform:uppercase;
letter-spacing:1px;
font-size:11px;
opacity:1;
}

div.chat_row_P	span.color4{
margin: 1px;
color: #c7baff;
font-family: 'Exo 2', sans-serif;
text-align:justify;
font-size:12px;
font-weight:bold;
opacity:1.0;
}

div.chat_row_P span.color5 {
   margin: 2px;
   color:#ff8425;
   text-align:justify;
   font-size:14.0px;
   font-style:italic;
   font-family: 'Indie Flower';
   letter-spacing:0.5px;
   font-weight: 500;
   opacity:1.0
}

div.chat_row_P {
    margin-left: 0px;
    margin-right: 5px;
    margin-top: 5px;
    margin-bottom: 9px;
    padding:5px; 
    color:#655736; 
    font-weight:normal; 
    font-size:13px; 
    font-family: raleway; 
    opacity:0.9; 
    letter-spacing:0px; 
    word-spacing:-1px; 
    line-height:18.5px; 
    background-color: #101010;
   /* border-radius: 50px 0px 0px 0px; */
    border-left: 1px solid #394d5c;
    box-shadow:  5px  5px 15px #000;}


div.chat_row_P	span.color2{margin-top: 3px; color:#f0cfa1; font-weight:normal; font-size:13px;  font-family: raleway; opacity: 0.8; letter-spacing:0px; word-spacing:0px; line-height:18.5px}
div.chat_row_P	span.color6{margin-top: 3px; color:#b8b2a5; font-weight:bold;  font-size:13px;  font-family: 'Source Code Pro'; font-style:italic; opacity: 0.4; letter-spacing:-0.5px; line-height:18.5px}
div.chat_row_P	span.color7{margin-top: 3px; color: #d2abff; font-weight: normal;  font-size:13px; font-family: raleway; text-transform: uppercase; opacity: 1; letter-spacing: 0.5px; line-height:18.5px}
 

div.chat_row_M{ 
   margin-top: 3px;
   font-size: 13px;
   font-family: raleway;
   padding:15px;
   border: 0.5px solid #7a6599;
   text-align: justify;
   background-color:#101010;
   color: #b8b8b8;
   
   line-height:18.5px;
   opacity:0.9;
   
   /* border-radius: 50px 0px 0px 0px; */
     
    box-shadow:  5px  5px 15px #000;}

div.chat_row_M	.c_master_2{color:#f0cfa1; font-weight:normal; opacity:0.7;}
div.chat_row_M	.c_master_3{color:#8db0dc; font-weight:bold;  font-size:11.5px; font-family:'Exo 2', sans-serif; letter-spacing:0px; text-transform:uppercase;}
div.chat_row_M	.c_master_5{color:#ff8425; font-weight:500; font-size:14px; font-style:italic; font-family:'Indie Flower'; letter-spacing:0.5px; opacity: 1.0;}
div.chat_row_M	.c_master_6{color:#b8b2a5; font-weight:bold; font-size:12px; font-family:  'Source Code Pro'; font-style:italic; opacity: 0.4; letter-spacing:-0.5px;}
div.chat_row_M  .c_master_7{color:#a1dcf0; font-weight:bold; font-size:11px; font-family: 'Exo 2', sans-serif; text-transform:uppercase; letter-spacing: 0.5px;}



div.chat_row_N{margin-top: 3px; }

div.chat_row_N	span.color2{color:#000; font-weight:bolder;}

div.chat_row_I{
	margin-top: 3px;
   text-align: center;
color:#3b779a;
}

div.chat_row_I img.chat_img { max-width:500px; height:auto;}

div.chat_row_S{margin-top: 3px;font-style:italic; font-size:12px; color:#8e877f; }

div.chat_row_D{
margin-top: 3px;

   color: #FFF;
}

div.chat_row_Z{
text-align: center}

div.chat_row_O{
margin-top: 3px;
}

div.chat_row_C{
    color: #a5b5af;
}

span.chat_time{
   font-size: 11.5px;
   font-family: 'Exo 2', sans-serif;
   font-weight: normal;
   margin-right: 3px;
   color:#9e9e9e;
   opacity:0.7;
   text-transform: uppercase;
}

span.chat_name {
   font-size: 13.0px;
   font-family: 'Exo 2', sans-serif;
   text-transform: uppercase;
   font-weight: bold;
   display: inline-block;

   /* Gradiente in diagonale a 45 gradi */
   background-image: linear-gradient(45deg, #d16ba5, #be83cb, #a29ce4, #87b1f0, #79c3f0, #5acff5, #38dbf2, #25e5e7, #00efd6, #00f6b6, #00fb88, #5bfd4b);
   
   /* Dimensione dello sfondo scalata per la diagonale */
   background-size: 300% 300%;
   
   -webkit-background-clip: text;
   background-clip: text;
   -webkit-text-fill-color: transparent;

   /* Rallentato portandolo a 12 secondi (puoi alzare a 15s/20s per rallentare ancora) */
   animation: landGradient 6s linear infinite;
}

@keyframes landGradient {
   0% { background-position: 0% 0%; }
   50% { background-position: 100% 100%; }
   100% { background-position: 0% 0%; }
}

.chat_name a {
   color: inherit !important;
   -webkit-text-fill-color: inherit !important;
   text-decoration: none;
}

span.chat_tag {
   font-family: 'Exo 2', sans-serif;
   font-weight: normal;   
   font-size: 12px;
   color: #ff78c7 !important;
   opacity: 1;
   
   /* Aggiungi queste due righe: */
   -webkit-background-clip: border-box;
   -webkit-text-fill-color: hsl(325, 100%, 65%);
color: hsl(325, 100%, 65%) !important;
}

span.chat_msg{
    color: #b8b8b8;
	font-size:13px;
	opacity:0.9;
    font-family: raleway;
    font-weight: 500;
}

span.chat_master{


 }



/***** form inserimento *****/

div.form_row{
  margin-left: -30px;
}
div.casella_chat{
  float: left;  
}

/*Casella Tag*/
input#tag{
   width: 90px;
}
/*Casella Messaggio*/
input#message{
   width: 190px;
}

/****************************************************************************/
/*Allineamento elementi per barra chat*/
#chat_form_messages > div:nth-child(3) > input[type=submit]:nth-child(1),#chat_form_actions > div:nth-child(4) > input[type=submit]:nth-child(1){margin:0;}

#chat_form_actions > div:nth-child(1) > span {margin-left:44px}

#chat_form_actions > div:nth-child(2) > span{margin-left:10px}