/****************************************************************************/
/* NHIE — MESSAGGI PRIVATI | UNSUPERVISED PALETTE DROP-IN
   Palette bloccata: nero/antracite, rosa, blu desaturato, testi chiari.
   Nessun verde/teal/giallo. Può sostituire il vecchio CSS o essere caricato dopo.
/****************************************************************************/

/* =========================
   PALETTE LOCALE
========================= */
div.pagina_messages_center{
  --us-bg: #06070a;
  --us-bg-2: #0b0c10;
  --us-panel: #101118;
  --us-panel-2: #151620;
  --us-panel-3: #1b1a24;
  --us-glass: rgba(12, 13, 18, .86);
  --us-glass-soft: rgba(20, 19, 27, .72);
  --us-line: #30222c;
  --us-line-soft: rgba(255, 236, 245, .10);
  --us-line-blue: rgba(63, 123, 164, .36);
  --us-line-pink: rgba(255, 89, 173, .42);
  --us-ink: #ffecf5;
  --us-text: #d8d2dc;
  --us-muted: #a8a2ad;
  --us-faint: #706a78;
  --us-pink: #ff59ad;
  --us-pink-soft: #ffa1d1;
  --us-blue: #3f7ba4;
  --us-blue-dark: #1b3c5a;
  --us-shadow: rgba(0, 0, 0, .62);
  background:
    radial-gradient(circle at 12% 0%, rgba(255, 89, 173, .08), transparent 27%),
    radial-gradient(circle at 88% 8%, rgba(63, 123, 164, .10), transparent 32%),
    linear-gradient(180deg, rgba(6, 7, 10, .94), rgba(9, 9, 13, .98));
  margin: 0;
  padding: 0;
  height: 632px;
  width: 100%;
  font-family: 'Outfit', sans-serif;
  color: var(--us-text);
  box-sizing: border-box;
  overflow: hidden;
}

div.pagina_messages_center *,
div.pagina_messages_center *::before,
div.pagina_messages_center *::after{
  box-sizing: border-box;
}

div.pagina_messages_center div.page_body{
  height: 100%;
}

/* =========================
   LINK / BOTTONI GLOBALI
========================= */
#messaggi_side a,
#messaggi_side a:visited,
div.pagina_messages_center a,
div.pagina_messages_center a:visited{
  color: var(--us-muted);
  font-variant: small-caps;
  font-weight: 600;
  font-size: 12px;
  letter-spacing: 1px;
  text-decoration: none;
  transition: color .22s ease, text-shadow .22s ease, opacity .22s ease;
}

#messaggi_side a:hover,
div.pagina_messages_center a:hover{
  color: var(--us-pink-soft);
  text-shadow: 0 0 7px rgba(255, 89, 173, .38);
}

div.pagina_messages_center button{
  background-color: transparent;
  cursor: pointer;
  padding: 0;
  border: 0;
  color: var(--us-muted);
  width: auto;
  height: auto;
  font-variant: small-caps;
  font-weight: 600;
  font-size: 12px;
  letter-spacing: 1px;
  margin: 0;
  transition: color .22s ease, text-shadow .22s ease, transform .22s ease, opacity .22s ease;
}

div.pagina_messages_center button:hover{
  color: var(--us-pink-soft);
  text-shadow: 0 0 7px rgba(255, 89, 173, .38);
  transform: translateY(-1px);
}

div.pagina_messages_center input[type='submit']:hover{
  background-color: var(--us-panel-3);
}

div.pagina_messages_center input[type='image']{
  background-color: transparent;
  border: none;
  margin: 0;
}

div.pagina_messages_center table{
  width: 100%;
}

/* =========================
   SCROLLBAR
========================= */
div.pagina_messages_center *::-webkit-scrollbar{
  width: 6px;
  height: 6px;
}

div.pagina_messages_center *::-webkit-scrollbar-track{
  background: rgba(6, 7, 10, .72);
}

div.pagina_messages_center *::-webkit-scrollbar-thumb{
  background: linear-gradient(180deg, rgba(255, 89, 173, .48), rgba(63, 123, 164, .50));
  border-radius: 999px;
}

/* =========================
   LAYOUT PRINCIPALE
========================= */
div.msg_read_page{
}

div.msg_container_all{
  width: 100%;
  display: flex;
  flex-direction: row;
  align-items: flex-start;
  flex-wrap: wrap;
  justify-content: flex-start;
}

div.msg_riga_dati_container{
  width: 385px;
  max-height: 491px;
  overflow: auto;
  padding: 4px 0 0 4px;
}

div.messaggio_singolo{
  width: 602px;
  height: 632px;
  position: absolute;
  top: 0px;
  right: 0;
  margin: 0 auto 0;
  outline: none;
  box-sizing: border-box;
  background:
    linear-gradient(180deg, rgba(6, 7, 10, .10), rgba(16, 17, 24, .82) 18%, rgba(15, 15, 21, .92) 76%, rgba(6, 7, 10, .18)),
    radial-gradient(circle at 100% 0%, rgba(255, 89, 173, .07), transparent 33%),
    radial-gradient(circle at 0% 100%, rgba(63, 123, 164, .08), transparent 36%);
  border-left: 1px solid var(--us-line-soft);
  box-shadow: -22px 0 38px rgba(0, 0, 0, .34) inset;
}

/* =========================
   ELENCO CONVERSAZIONI
========================= */
div.elementi_elenco_msg{
}

div.elementi_elenco_msg a,
div.elementi_elenco_msg a:visited{
}

div.elementi_elenco_msg a:hover{
}

div.msg_create_new{
  height: 25px;
  display: flex;
  align-items: center;
  justify-content: space-evenly;
  flex-direction: row;
  font-size: 10px;
  width: 38%;
  margin: 10px auto 14px 0px;
  box-sizing: border-box;
  padding: 5px;
  color: var(--us-muted);
}

div.msg_riga_dati{
  background:
    linear-gradient(90deg, rgba(21, 22, 32, .92), rgba(10, 11, 16, .86));
  display: flex;
  align-items: center;
  flex-direction: row;
  text-align: left;
  justify-content: space-between;
  border-bottom: 1px solid rgba(255, 236, 245, .08);
  border-left: 2px solid transparent;
  min-height: 48px;
  padding: 4px 7px;
  transition: background .22s ease, border-color .22s ease, box-shadow .22s ease;
}

div.msg_riga_dati:hover{
  background:
    linear-gradient(90deg, rgba(255, 89, 173, .09), rgba(63, 123, 164, .08)),
    linear-gradient(90deg, rgba(21, 22, 32, .96), rgba(10, 11, 16, .90));
  border-left-color: var(--us-pink);
  box-shadow: 0 0 14px rgba(0, 0, 0, .28) inset;
}

div.msg_riga_dati a,
div.msg_riga_dati a:visited{
  font-size: 11px;
  color: var(--us-ink);
}

div.msg_riga_dati a:hover{
  color: var(--us-pink-soft);
}

div.msg_partecipanti{
  font-size: 9px;
  color: var(--us-muted);
  letter-spacing: .4px;
}

div.msg_type{
  width: 391px;
  text-align: center;
  background: linear-gradient(90deg, rgba(255, 89, 173, .28), rgb(48 82 111));
  color: var(--us-ink);
  padding: 0px 5px;
  margin: 4px 0px;
  font-size: 8px;
  letter-spacing: 2px;
  text-transform: uppercase;
}

div.controllo_elenco_msg{
  display: inline-flex;
  flex-wrap: wrap;
  justify-content: space-around;
  align-items: center;
  font-size: 12px;
  margin: 0 3px;
  color: var(--us-muted);
}

/* =========================
   FORM MESSAGGI
========================= */
.form_messaggi{
  overflow: auto !important;
  max-height: 498px;
  text-align: center;
  padding: 0;
  box-sizing: border-box;
}

.form_messaggi .form_label{
  color: var(--us-ink);
  background:
    linear-gradient(90deg, transparent, rgba(255, 89, 173, .18), rgba(63, 123, 164, .14), transparent);
  font-size: 10px;
  text-transform: uppercase;
  margin: 20px auto;
  letter-spacing: 1.4px;
  padding: 5px 0 4px;
  box-shadow: 0 8px 18px rgba(0, 0, 0, .45);
  border-top: 1px solid rgba(255, 236, 245, .06);
  border-bottom: 1px solid rgba(255, 236, 245, .08);
}

.form_messaggi .form_field{
}

.form_messaggi textarea,
textarea.msg_textarea{
  width: 400px;
  height: 64px;
  resize: none;
  background: rgba(12, 13, 18, .84);
  border: 1px solid rgba(255, 236, 245, .10);
  border-bottom-color: rgba(255, 89, 173, .34);
  box-shadow: 0 0 22px rgba(0, 0, 0, .55) inset;
  margin: 10px auto;
  color: var(--us-text);
  outline: 0 none transparent;
  font-size: 12px;
  font-family: 'Hind Siliguri', 'Outfit', sans-serif;
  padding: 8px 10px;
  transition: border-color .22s ease, box-shadow .22s ease, background .22s ease;
}

textarea.msg_textarea{
  margin: 4px 12px;
  height: 55px;
}

.form_messaggi textarea:focus,
textarea.msg_textarea:focus{
  background: rgba(16, 17, 24, .96);
  border-color: rgba(255, 89, 173, .55);
  box-shadow:
    0 0 22px rgba(0, 0, 0, .58) inset,
    0 0 10px rgba(255, 89, 173, .16);
}

.form_messaggi input[type='text'],
.form_messaggi select{
  width: 390px;
  background: rgba(8, 9, 13, .96);
  height: 21px;
  border: 1px solid rgba(255, 236, 245, .12);
  border-bottom-color: rgba(63, 123, 164, .44);
  margin: 4px auto;
  color: var(--us-ink);
  padding: 0 6px;
  font-size: 10px;
  outline: 0;
}

.form_messaggi input[type='text'].crea,
.form_messaggi select.crea{
  padding: 0 6px;
  font-size: 10px;
  background: rgba(16, 17, 24, .94);
  border: 1px solid rgba(255, 89, 173, .32);
  color: var(--us-text);
}

.form_messaggi input[type='text']:focus,
.form_messaggi select:focus,
.form_messaggi input[type='text'].crea:focus,
.form_messaggi select.crea:focus{
  border-color: rgba(255, 89, 173, .62);
  box-shadow: 0 0 9px rgba(255, 89, 173, .14);
}

.title_crea{
  font-family: 'Hind Siliguri', sans-serif;
  text-transform: uppercase;
  letter-spacing: 1.2px;
  font-size: 9px;
  font-weight: 800;
  color: var(--us-pink-soft);
}

.form_messaggi .form_submit input[type='submit']{
  padding: 6px 14px;
  font-size: 11px;
  background:
    linear-gradient(180deg, rgba(255, 89, 173, .13), rgba(63, 123, 164, .10)),
    rgba(16, 17, 24, .96);
  color: var(--us-ink);
  border: 1px solid rgba(255, 89, 173, .45);
  border-radius: 999px;
  font-family: 'Outfit', 'Menlo', monospace;
  text-shadow: 0 0 4px rgba(255, 89, 173, .28);
  cursor: pointer;
  letter-spacing: .7px;
  text-transform: uppercase;
  transition: background .22s ease, border-color .22s ease, box-shadow .22s ease, transform .22s ease;
}

.form_messaggi .form_submit input[type='submit']:hover{
  background:
    linear-gradient(180deg, rgba(255, 89, 173, .20), rgba(63, 123, 164, .14)),
    rgba(20, 19, 27, .98);
  border-color: rgba(255, 161, 209, .72);
  box-shadow: 0 0 14px rgba(255, 89, 173, .18);
  transform: translateY(-1px);
}

/* =========================
   HEADER CONVERSAZIONE
========================= */
#top_conv_block{
  display: flex;
  flex-direction: row;
  box-sizing: border-box;
  background:
    linear-gradient(0deg, rgba(6, 7, 10, .96), rgba(16, 17, 24, .76)),
    radial-gradient(circle at 0% 0%, rgba(255, 89, 173, .10), transparent 28%),
    radial-gradient(circle at 100% 0%, rgba(63, 123, 164, .13), transparent 34%);
  height: 59px;
  align-items: center;
  box-shadow: 9px 35px 40px rgba(0, 0, 0, .62);
  border-style: solid;
  border-image-source: linear-gradient(to left, rgba(255, 89, 173, .72), rgba(63, 123, 164, .62));
  border-image-slice: 1;
  border-width: 0 0 10px 0;
}

div.imggroup{
  margin: 0 0 0 20px;
}

div.imggroup img{
  width: 50px;
  height: 50px;
  border-radius: 14px;
  object-fit: cover;
  filter: brightness(.82) contrast(1.04);
  box-shadow:
    0 6px 14px rgba(0, 0, 0, .56),
    0 0 0 1px rgba(255, 236, 245, .10);
}

div.imggroup_mitt{
  width: 40px;
  height: 40px;
  margin: 5px 6px 4px 0;
}

div.imggroup_mitt img{
  object-fit: cover;
  filter: brightness(.84) contrast(1.03);
  width: 40px;
  height: 40px;
  border: 1px solid rgba(255, 236, 245, .12);
  border-radius: 10px;
  background: transparent;
  box-shadow: 0 5px 10px rgba(0, 0, 0, .42);
}

div.msg_empty_avatar{
  border-radius: 10px;
  color: var(--us-muted);
  text-align: center;
  font-size: 10px;
  line-height: 40px;
  object-fit: cover;
  filter: brightness(.9);
  width: 40px;
  height: 40px;
  background: rgba(255, 236, 245, .04);
  border: 1px solid rgba(255, 236, 245, .12);
}

div.elementi_elenco_msg_mitt{
  width: 50%;
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: flex-start;
}

div.iconcine_msg{
  width: 17%;
  display: inline-flex;
  font-size: 15px;
  flex-direction: row;
  justify-content: space-around;
  color: var(--us-pink-soft);
}

/* Testo delle colonne */
div.pagina_messages_center div.elementi_elenco{
}

/* Pulsanti elenco */
div.pagina_messages_center div.pulsanti_elenco{
  position: absolute;
  top: -5px;
  right: 9px;
  width: 35%;
  height: 25px;
  color: var(--us-muted);
  margin: 0 auto;
  display: flex;
  flex-direction: row;
  font-size: 15px;
  justify-content: space-evenly;
  align-items: center;
  z-index: 2;
}

div.pagina_messages_center div.pulsanti_elenco form{
  float: left;
}

/* =========================
   THREAD / BOLLE CHAT
========================= */
div.msggroup_wrapper{
  max-height: 505px;
  overflow: auto;
  display: flex;
  flex-direction: column-reverse;
  padding: 10px 14px 18px;
}

div.dsgroup{
  padding: 0;
  color: var(--us-muted);
  width: 90%;
  margin: 4px 0 0 25px;
  font-size: 10px;
  text-align: left;
}

div.msggroup_container{
  max-width: 80%;
  margin: 0 auto;
}

div.msggroup_container .dsgroup{
}

div.msggroup_wrapper .alredyRead{
  font-weight: 600;
  color: var(--us-pink-soft);
  font-family: 'Outfit', 'Neucha', sans-serif;
  background-color: transparent;
  font-size: 13px;
  padding: 20px 0 0;
  margin: auto;
  border-top: 0;
  border-left: 0;
  border-right: 0;
  font-variant: all-petite-caps;
  border-style: solid;
  border-color: rgba(255, 89, 173, .30);
  letter-spacing: 2px;
  text-shadow: 0 0 8px rgba(255, 89, 173, .16);
}

div.msggroup_container_off{
  font-family: Verdana, sans-serif;
  line-height: 20px;
  color: var(--us-muted);
  font-size: 11.5px;
}

div.msggroup_container_off b{
  color: var(--us-pink-soft);
  text-transform: uppercase;
  letter-spacing: 1px;
  font-size: 9px;
}

div.msggroup_container_off i{
  color: var(--us-blue);
  letter-spacing: 1px;
}

div.msggroup_container details{
  position: sticky;
  top: 0;
  margin: 0 auto;
  width: 433px;
  z-index: 100;
  background: rgba(12, 13, 18, .96);
  border-width: 0 1px 1px 1px;
  border-style: solid;
  border-image-source: linear-gradient(to top, rgba(255, 89, 173, .32), rgba(63, 123, 164, .20), rgba(0, 0, 0, 0));
  border-image-slice: 1;
  box-shadow: 0 8px 18px rgba(0, 0, 0, .35);
}

div.msggroup_container summary{
  text-align: left;
  cursor: pointer;
  font-variant: all-petite-caps;
  padding: 5px;
  font-size: 13px;
  letter-spacing: 1px;
  margin: 0 auto;
  color: var(--us-ink);
}

div.msggroup_container fieldset{
  border-color: rgba(255, 236, 245, .10);
  border-style: solid;
  border-width: 1px;
  width: 90%;
  margin: 0 auto;
  background: rgba(6, 7, 10, .35);
}

div.msg_container{
  width: auto;
  min-width: 250px;
  max-width: 95%;
  padding: 13px 14px;
  margin: 4px auto;
  background-color: rgba(12, 13, 18, .78);
  border-radius: 12px;
  color: var(--us-text);
  line-height: 1.55;
}

div.msg_container.me{
  position: relative;
  background:
    linear-gradient(135deg, rgba(255, 89, 173, .10), rgba(21, 22, 32, .92) 34%, rgba(12, 13, 18, .94));
  box-shadow: 0 8px 18px rgba(0, 0, 0, .42);
  border-radius: 14px 4px 14px 14px;
  text-align: justify;
  float: right;
  border-right: 4px solid var(--us-pink);
  border-top: 1px solid rgba(255, 236, 245, .08);
  border-bottom: 1px solid rgba(255, 236, 245, .06);
}

div.msg_container.me:after{
  content: '';
  position: absolute;
  width: 0;
  height: 0;
  border-left: 0;
  border-top: 0;
  border-style: solid;
  border-width: 13px 0 0 16px;
  border-color: transparent transparent transparent var(--us-pink);
  top: 80%;
  right: -16px;
  margin-top: -14px;
  margin-right: -4px;
}

div.msg_container.other,
div.msg_container.fromsystem{
  position: relative;
  background:
    linear-gradient(135deg, rgba(63, 123, 164, .12), rgba(21, 22, 32, .92) 34%, rgba(12, 13, 18, .94));
  box-shadow: 0 8px 18px rgba(0, 0, 0, .42);
  border-radius: 4px 14px 14px 14px;
  border-left: 4px solid var(--us-blue);
  border-top: 1px solid rgba(255, 236, 245, .08);
  border-bottom: 1px solid rgba(255, 236, 245, .06);
  text-align: justify;
  float: left;
}

div.msg_container.other:after,
div.msg_container.fromsystem:after{
  content: '';
  position: absolute;
  left: 0;
  top: 73%;
  width: 0;
  height: 0;
  border-left: 0;
  border-top: 0;
  margin-top: -10px;
  margin-left: -19px;
  border-style: solid;
  border-width: 0 0 16px 17px;
  border-color: transparent transparent var(--us-blue) transparent;
}

div.msg_container.system{
  font-style: italic;
  color: var(--us-muted);
  padding: 15px 5px;
  margin: auto;
  background-color: transparent;
  border: transparent;
  clear: both;
  text-align: center;
}

div.msg_container.other a,
div.msg_container.fromsystem a,
div.msg_container.other a:visited,
div.msg_container.fromsystem a:visited{
  color: var(--us-blue);
  font-size: 10px;
}

div.msg_container.other a:hover,
div.msg_container.fromsystem a:hover{
  color: var(--us-pink-soft);
}

span.msg_container_mitt,
span.msg_container_other{
  font-size: 10px;
  letter-spacing: 2px;
  color: var(--us-pink-soft);
}

span.name_group_chat{
  font-size: 12px;
  line-height: 16px;
  font-weight: normal;
  color: var(--us-ink);
}

div.msg img{
  max-width: 400px;
  max-height: 220px;
  border-radius: 8px;
  border: 1px solid rgba(255, 236, 245, .10);
}

div.pagina_messages_center div.pager{
  clear: both;
  padding: 7px 0;
  position: absolute;
  bottom: 0;
  width: 200px;
  color: var(--us-muted);
}

div.msg_bar_bottom{
  background:
    linear-gradient(90deg, rgba(6, 7, 10, .96), rgba(16, 17, 24, .86), rgba(6, 7, 10, .82));
  border-style: solid;
  border-image-source: linear-gradient(to right, rgba(63, 123, 164, .62), rgba(255, 89, 173, .66) 30%, rgba(255, 89, 173, .54) 70%, rgba(63, 123, 164, .56));
  border-image-slice: 1;
  border-width: 2px 0 0 0;
  height: 75px;
  display: flex;
  align-items: center;
  justify-content: space-evenly;
  flex-direction: row;
  font-size: 16px;
  color: var(--us-ink);
  position: absolute;
  bottom: 0;
  width: 100%;
  right: 0;
  box-shadow: 0 -10px 22px rgba(0, 0, 0, .34);
}

div.mittenti{
  text-overflow: ellipsis;
  white-space: nowrap;
  overflow: hidden;
}

/* =========================
   RUBRICA
========================= */
.rubrica_mod{
  width: 20px;
  height: 20px;
  margin-top: -7px;
}

div.rubrica_mod details summary::-webkit-details-marker,
div.rubrica_mod details summary::marker{
  display: none;
  content: '';
}

div.rubrica_mod details[open]{
  background: rgba(12, 13, 18, .98);
  box-sizing: border-box;
  padding: 0 10px 15px;
  position: sticky;
  width: 300px;
  z-index: 999;
  border: 1px solid rgba(255, 236, 245, .10);
  box-shadow: 0 12px 28px rgba(0, 0, 0, .56);
}

div.rubrica_mod summary{
  text-align: left;
  cursor: pointer;
  font-variant: all-petite-caps;
  font-size: 9px;
  color: var(--us-pink-soft);
  letter-spacing: 1px;
}

div.rubrica_mod fieldset{
  border-color: rgba(255, 89, 173, .30);
  border-style: solid;
  border-width: 1px;
  width: 90%;
  margin: 0 auto;
  background: linear-gradient(180deg, rgba(16, 17, 24, .96), rgba(8, 9, 13, .96));
}

div.rubrica_mod input[type='text'],
div.rubrica_mod .form_messaggi select{
  width: 240px;
  background: rgba(21, 22, 32, .92);
  height: 19px;
  border: 1px solid rgba(255, 236, 245, .10);
  border-bottom-color: rgba(255, 89, 173, .34);
  box-shadow: 0 0 4px rgba(0, 0, 0, .50) inset;
  margin: 10px auto;
  color: var(--us-ink);
}

.rubrica_box{
  width: 90%;
  margin: 0 auto;
  height: 349px;
  overflow: auto;
}

.rubrica_record_flex{
  display: flex;
  flex-direction: row;
  justify-content: space-evenly;
  flex-wrap: wrap;
  align-items: center;
}

.rubrica_contatto_name{
  margin: 0 5px;
  font-size: 12px;
  letter-spacing: 1px;
  color: var(--us-ink);
  width: 68%;
  height: 30px;
  text-align: left;
  display: flex;
  padding: 0 10px;
  flex-direction: row;
  align-items: center;
  justify-content: flex-start;
}

.miniavatar_msg_img,
.miniavatar_msg_img_other{
  width: 20px;
  height: 20px;
  border-radius: 5px;
  object-fit: cover;
  border: 1px solid rgba(255, 236, 245, .12);
}

.miniavatar_msg_img{
  margin-left: 10px;
  float: right;
}

.miniavatar_msg_img_other{
  margin-right: 10px;
}

.msg_empty_avatar_rubrica{
  background:
    radial-gradient(circle at top left, rgba(255, 89, 173, .22), transparent 58%),
    rgba(16, 17, 24, .94);
  border-radius: 5px;
  border: 1px solid rgba(255, 89, 173, .28);
  color: var(--us-ink);
  text-align: center;
  width: 20px;
  font-size: 10px;
  height: 20px;
  line-height: 20px;
  margin: 0 0 0 10px;
  text-transform: uppercase;
}

/* =========================
   LEGACY: MESSAGGIO SINGOLO
========================= */
div.read_message_box{
  width: 90%;
  margin-left: auto;
  margin-right: auto;
}

div.read_message_box div.infos{
  clear: both;
  text-align: left;
  color: var(--us-muted);
}

div.read_message_box div.infos span.title{
  font-style: italic;
  color: var(--us-pink-soft);
}

div.read_message_box div.infos span.body{
  font-weight: bold;
  color: var(--us-ink);
}

div.read_message_box_text{
  clear: both;
  border: solid 1px rgba(255, 236, 245, .10);
  background-color: rgba(16, 17, 24, .90);
  padding: 10px;
  margin: 20px 0 5px;
  border-radius: 10px;
  color: var(--us-text);
}

div.read_message_box_forms{
  clear: both;
  margin-bottom: 40px;
}

div.read_message_box_form{
  float: right;
}

div.read_message_box_form input{
  height: 20px;
  width: 20px;
}

/* =========================
   LEGACY: CONVERSAZIONI
========================= */
div.read_message_box_conversation_container{
  height: 65vh;
  overflow-y: scroll;
  border: solid 1px rgba(255, 236, 245, .10);
  border-radius: 10px;
  margin-bottom: 10px;
  background: rgba(6, 7, 10, .46);
}

div.read_message_box_conversation{
  width: 80%;
  margin: 5px auto;
}

div.read_message_box_conversation div.infos{
  clear: both;
  text-align: left;
  color: var(--us-muted);
}

div.read_message_box_conversation div.infos span.title{
  font-style: italic;
  color: var(--us-pink-soft);
}

div.read_message_box_conversation div.infos span.body{
  font-weight: bold;
  color: var(--us-ink);
}

div.infos.left_side{
  text-align: left;
  float: left;
}

div.infos.right_side{
  text-align: right;
  float: right;
}

div.infos.actions{
  display: flex;
}

div.read_message_box_conversation_text{
  width: auto;
  max-width: 80%;
  clear: both;
  border: solid 1px rgba(255, 236, 245, .10);
  background-color: rgba(16, 17, 24, .92);
  padding: 20px;
  margin: 5px 0;
  border-radius: 12px;
  color: var(--us-text);
}

div.read_message_box_conversation_text.left_side{
  text-align: left;
  float: left;
  border-left: 4px solid var(--us-blue);
}

div.read_message_box_conversation_text.right_side{
  text-align: right;
  float: right;
  border-right: 4px solid var(--us-pink);
}

/* =========================
   NOTE / ICONE SPECIALI
========================= */
.glow-note{
  color: var(--us-pink-soft);
  animation: pulseGlow 1.6s infinite ease-in-out;
  text-shadow:
    0 0 5px rgba(255, 89, 173, .42),
    0 0 10px rgba(255, 89, 173, .28),
    0 0 20px rgba(63, 123, 164, .18);
}

@keyframes pulseGlow{
  0%, 100%{
    text-shadow:
      0 0 5px rgba(255, 89, 173, .42),
      0 0 10px rgba(255, 89, 173, .28),
      0 0 20px rgba(63, 123, 164, .18);
    transform: scale(1);
  }
  50%{
    text-shadow:
      0 0 9px rgba(255, 89, 173, .54),
      0 0 18px rgba(255, 89, 173, .34),
      0 0 25px rgba(63, 123, 164, .24);
    transform: scale(1.08);
  }
}

.msg_symbol_other{
  position: absolute;
  left: -46px;
  top: 52px;
  font-size: 16px;
  color: var(--us-blue);
}

.msg_symbol_me{
  position: absolute;
  right: -48px;
  top: 61px;
  font-size: 16px;
  color: var(--us-pink-soft);
}
