:root.dark {
--body-bg-color: #273346;
--card-background:#0d1725;
--chat-text-color: #f1f2f6;
--sent-background: #80c9c200;
--sent-color: #f5f5f5;
 
}

:root.light {
 --sent-background: #80c9c200;
--sent-color: #f5f5f5;
    --body-bg-color: #e5ecef;
   --card-background:#fff;
   --chat-text-color: #273346;
  --settings-icon-hover: #9fa7ac;
  --developer-color: #f9fafb;
  --input-bg: #f8f8fa;
  --input-chat-color: #a2a2a2;
  --border-color: #eef2f4;
  --body-font: "Manrope", sans-serif;
  --body-color: #273346;
  --settings-icon-color: #c1c7cd;
  --msg-message: #969eaa;
  --chat-text-bg: #f1f2f6;
  --theme-color: #878a92;
  --msg-date: #c0c7d2;
  --button-bg-color: #f8f8fa;
  --button-color: var(--theme-color);
  --detail-font-color: #919ca2;
  --msg-hover-bg: rgba(238, 242, 244, 0.4);
   --color-hue: 220;
  --active-conversation-bg: linear-gradient(
   to right,
   rgba(238, 242, 244, 0.4) 0%,
   rgba(238, 242, 244, 0) 100%
  );
  --overlay-bg: linear-gradient(
   to bottom,
   rgba(255, 255, 255, 0) 0%,
   rgba(255, 255, 255, 1) 65%,
   rgba(255, 255, 255, 1) 100%
  );
  --chat-header-bg: linear-gradient(
   to bottom,
   rgba(255, 255, 255, 1) 0%,
   rgba(255, 255, 255, 1) 78%,
   rgba(255, 255, 255, 0) 100%
  );
}
ul.nav.nav-pills.nav-justified.nav-sidebar {
    background: transparent;
}
.bottom-login-section {
    background: transparent;
    border-top: 1px solid #dedede00;
    padding: 0;
}
.selected-chat{
 padding: 0.25rem;   
}
.nav-sidebar li.nav-item {
    height: 25px !important;
}
.selected-chat-toggle {
    margin-left: 0px;
}
.room-sel-item {
    border-left: 5px solid var(--msg-hover-bg);
    backdrop-filter: blur(16px) saturate(180%);
    -webkit-backdrop-filter: blur(16px) saturate(180%);
    background-color: rgb(255 255 255 / 44%);
    border-radius: 12px;
    border: 1px solid rgba(209, 213, 219, 0.3);
}
.room-sel-go {
    border-bottom: 70px solid var(--indigo);
}
.room-sel-go-icon {
    color: var(--light);
}
.chat-messages-col {
    border-right: 1px solid #dedede00;
    border-left: 1px solid #dedede00;
}
.messages, .right-panel-messages {
    padding: 0;
    border-top: 1px solid #d8dbdd00;
}
.messages {
-webkit-backdrop-filter: blur(1em);
    backdrop-filter: blur(1em);
    background-color: rgba(0, 1, 63, 0.26);
    grid-column-start: 1;
    grid-column-end: 2;
    grid-row-start: 1;
    grid-row-end: 2;
    border-radius: 1em;
    color: white;
    padding: 0;
    border: 1px solid rgba(255, 255, 255, 0.1);
    transition-duration: 0.5s;
    transition-timing-function: cubic-bezier(0.4, 0.01, 0.15, 1.1);
}
.truncate {
    max-width: 100%;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.valign {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
}
#wrapper #content-wrapper {
    background-color: transparent;
    overflow-y: hidden;
    margin-left: 6px;
    margin-right: 6px;
}
.lite-shadow {
    /* box-shadow: 0 1px 2px 0 rgb(0 0 0 / 10%); */
    box-shadow: 0 8px 8px -8px rgb(0 0 0 / 10%);
}
.selected-chat-col {
}

.mini-user-list{
	     backdrop-filter: initial !important;
 }
.chat-list-col {
grid-column-start: 1;
    grid-column-end: 2;
    grid-row-start: 1;
    grid-row-end: 2;
}
.videochat-panel {
    padding: 0px;
    overflow: hidden;
}
.videochat-list {
    height: calc(100vh - 144px);
    overflow-y: scroll;
}

.chat-header {
    max-width: 100%;
    width: max-content;
    overflow: hidden;
    white-space: nowrap;
}

.emojionearea.form-control {
    display: inline-block;
    border-radius: 20px;
}
.emojionearea .emojionearea-editor {
    border-radius: 20px;
}
/*modals*/
.modal-backdrop {
    backdrop-filter: blur(16px) saturate(180%);
    -webkit-backdrop-filter: blur(16px) saturate(180%);
    background-color: rgb(255 255 255 / 57%);
    border-radius: 12px;
    border: 1px solid rgba(209, 213, 219, 0.3);
}
.radio-container {
    margin-top: 5px;
    margin-bottom: 5px;
}
.modal button.close {
    background: var(--primary);
}
/* giftbox*/
.gift_list::-webkit-scrollbar { width: 10px; } 
.gift_list::-webkit-scrollbar-track { background: #f1f1f1; }
.gift_list::-webkit-scrollbar-thumb { background: #888; } /* Handle on hover */ 
.gift_list::-webkit-scrollbar-thumb:hover { background: #555; } 
.top-text-wrapper { margin: 6px 0 6px 0; } 
.top-text-wrapper h4{ font-size: 24px; margin-bottom: 10px; } 
.top-text-wrapper code{ font-size: .85em; background: linear-gradient(90deg,#fce3ec,#ffe8cc); color: #ff2200; padding: .1rem .3rem .2rem; border-radius: .2rem; }
.tab-section-wrapper{ padding: 30px 0; }

/* ******************* Selection Radio Item */
.selected-content{ text-align: center; border: solid 2px transparent; padding: 1px; display: grid; grid-gap: 1px; place-content: center; transition: .3s ease-in-out all; box-shadow: 0 5px 30px rgb(0 0 0 / 8%); border-radius: 10px; } .selected-content img {width: 50%; margin: 0 auto;} .selected-content img{display: block; vertical-align: middle; } .selected-content h4 { font-size: 14px; letter-spacing: -0.24px; text-align: center; color: #7269ef; } .selected-content i { text-align: center; color: #efa700; } .selected-content h5 { font-size: 14px; line-height: 1.4; text-align: center; color: #686d73; } .selected-label{ position: relative; } .selected-label input{ display: none; } .selected-label .icon{ width: 20px; height: 20px; border: solid 2px #e3e3e3; border-radius: 50%; position: absolute; top: 15px; left: 15px; transition: .3s ease-in-out all; transform: scale(1); z-index: 1; } .selected-label .icon:before{ content: "\f00c"; position: absolute; width: 100%; height: 100%; font-family: "Font Awesome 5 Free"; font-weight: 900; font-size: 12px; color: #000; text-align: center; opacity: 0; transition: .2s ease-in-out all; transform: scale(2); } .selected-label input:checked + .icon{ background: #3057d5; border-color: #3057d5; transform: scale(1.2); } .selected-label input:checked + .icon:before{ color: #fff; opacity: 1; transform: scale(.8); } .selected-label input:checked ~ .selected-content{color: var(--teal); font-style: oblique;} .gift_app{ position: relative; /* height: 390px;*/  border-radius: 15px; } .gift_app header { padding: 0px; position: relative; height: 50px; line-height: 4px; text-align: center; } .gift_app header h1 { position: relative; font-size: 20px; text-transform: uppercase; text-align: center; color: #1c222b; } .gifts_box { display: -webkit-box; display: flex; padding:3px 3px; height: 33vh; } .gift_app label, input{ cursor: pointer; } .gift_app h2,h3,h4,h5{ font-weight: 600; line-height: 1.3;} .gift_list{ overflow: auto; } .margin-auto{ margin: 0 auto; }
.re-gift img{ max-width: 100%; height: 50px; }
#gift_bar{ position: absolute; top: 2px; z-index: 10; height: 52px; left: 0; }
.box_u { /*   background: #efefef; */ width: 50px; height: 50px; margin-left: 5px; margin-right: 5px; display: inline-block; text-align: center; } .user-image > img { width: 40px; height: 40px; border-radius: 50%; margin-bottom: 1px; padding: 5px; border: 3px solid burlywood; } .user-name { font-size: 11px; text-align: center; color: var(--primary); } #recever_list{ display: inline-flex; max-width: 480px; overflow: auto; overflow-x: auto; overflow-y: hidden; cursor: pointer; height: 79px; padding: 6px; } #recever_list::-webkit-scrollbar { width: 4px; height: 7px; } #recever_list::-webkit-scrollbar-thumb { background: #7269ef; }
#g_media{max-width: 50px;}
/*user mockup*/
/***********Multi skin **************/

/* basic bubble background */
.bot{color:#cc369f}.bcolor1{color:#f33}.bcolor2{color:#f63}.bcolor3{color:#f93}.bcolor4{color:#fc3}.bcolor5{color:#cc0}.bcolor6{color:#9c0}.bcolor7{color:#59b300}.bcolor8{color:#829356}.bcolor9{color:green}.bcolor10{color:#00e639}.bcolor11{color:#00e673}.bcolor12{color:#00e6ac}.bcolor13{color:#0cc}.bcolor14{color:#03add8}.bcolor15{color:#36f}.bcolor16{color:#107896}.bcolor17{color:#004d99}.bcolor18{color:#63f}.bcolor19{color:#93f}.bcolor20{color:#c3f}.bcolor21{color:#f3f}.bcolor22{color:#f3c}.bcolor23{color:#f39}.bcolor24{color:#f36}.bcolor25{color:#604439}.bcolor26{color:#795548}.bcolor27{color:#a97f70}.bcolor28{color:#bc9b8f}.bcolor29{color:#9e9e9e}.bcolor30{color:#879fab}.bcolor31{color:#698796}.bcolor32{color:#495f69}
/* basic name colors background */
.bcback1{background:#f33}.bcback2{background:#f63}.bcback3{background:#f93}.bcback4{background:#fc3}.bcback5{background:#cc0}.bcback6{background:#9c0}.bcback7{background:#59b300}.bcback8{background:#829356}.bcback9{background:green}.bcback10{background:#00e639}.bcback11{background:#00e673}.bcback12{background:#00e6ac}.bcback13{background:#0cc}.bcback14{background:#03add8}.bcback15{background:#36f}.bcback16{background:#107896}.bcback17{background:#004d99}.bcback18{background:#63f}.bcback19{background:#93f}.bcback20{background:#c3f}.bcback21{background:#f3f}.bcback22{background:#f3c}.bcback23{background:#f39}.bcback24{background:#f36}.bcback25{background:#604439}.bcback26{background:#795548}.bcback27{background:#a97f70}.bcback28{background:#bc9b8f}.bcback29{background:#9e9e9e}.bcback30{background:#879fab}.bcback31{background:#698796}.bcback32{background:#495f69}
/* gradient colors */
.backgrad1,.bgrad1{background:linear-gradient(to right,#40e0d0,#ff8c00,#ff0080)}.backgrad2,.bgrad2{background:linear-gradient(to right,#11998e,#38ef7d)}.backgrad3,.bgrad3{background:linear-gradient(to right,#fc466b,#3f5efb)}.backgrad4,.bgrad4{background:linear-gradient(to right,#00f260,#0575e6)}.backgrad5,.bgrad5{background:linear-gradient(to right,#fc4a1a,#f7b733)}.backgrad6,.bgrad6{background:linear-gradient(to right,#22c1c3,#fdbb2d)}.backgrad7,.bgrad7{background:linear-gradient(to right,#7f00ff,#e100ff)}.backgrad8,.bgrad8{background:linear-gradient(to right,#ee0979,#ff6a00)}.backgrad9,.bgrad9{background:linear-gradient(to right,#00c3ff,#ffff1c)}.backgrad10,.bgrad10{background:linear-gradient(to right,#fc00ff,#00dbde)}.backgrad11,.bgrad11{background:linear-gradient(to right,#833ab4,#fd1d1d,#fcb045)}.backgrad12,.bgrad12{background:linear-gradient(to right,#bdc3c7,#2c3e50)}.backgrad13,.bgrad13{background:linear-gradient(to right,#373b44,#4286f4)}.backgrad14,.bgrad14{background:linear-gradient(to right,#f09,#493240)}.backgrad15,.bgrad15{background:linear-gradient(to right,#f953c6,#b91d73)}.backgrad16,.bgrad16{background:linear-gradient(to right,#dd3e54,#6be585)}.backgrad17,.bgrad17{background:linear-gradient(to right,#8360c3,#2ebf91)}.backgrad18,.bgrad18{background:linear-gradient(to right,#544a7d,#ffd452)}.backgrad19,.bgrad19{background:linear-gradient(to right,#009fff,#ec2f4b)}.backgrad20,.bgrad20{background:linear-gradient(to right,#59c173,#a17fe0,#5d26c1)}.backgrad21,.bgrad21{background:linear-gradient(to right,#a8c0ff,#3f2b96)}.backgrad22,.bgrad22{background:linear-gradient(45deg,red 0,#ffa600 50%,red 100%)}.backgrad23,.bgrad23{background:linear-gradient(to right,#108dc7,#ef8e38)}.backgrad24,.bgrad24{background:linear-gradient(to right,#f09,#0575e6)}.backgrad25,.bgrad25{background:linear-gradient(to right,#667db6,#0082c8,#ec38bc,#fdeff9)}.backgrad26,.bgrad26{background:linear-gradient(to right,#03001e,#7303c0,#ec38bc,#fdeff9)}.backgrad27,.bgrad27{background:linear-gradient(to right,#1a2a6c,#b21f1f,#fdbb2d)}.backgrad28,.bgrad28{background:linear-gradient(to right,#3a1c71,#d76d77,#ffaf7b)}.backgrad29,.bgrad29{background:linear-gradient(to right,#eb5757,#333)}.backgrad30,.bgrad30{background:linear-gradient(to right,#20002c,#cbb4d4)}.backgrad31,.bgrad31{background:linear-gradient(to right,#34e89e,#0f3443)}.backgrad32,.bgrad32{background:linear-gradient(to right,#bdc3c7,#2c3e50)}.backgrad33,.bgrad33{background:linear-gradient(to right,#a80077,#6f0)}.backgrad34,.bgrad34{background:linear-gradient(to bottom,#6db3f2 0,#54a3ee 50%,#3690f0 51%,#1e69de 100%)}.backgrad35,.bgrad35{background:linear-gradient(to top,#a241b7,#7f68d7,#5186e9,#1b9eef,#12b2eb)}.backgrad36,.bgrad36{background:linear-gradient(to bottom,#845ec2 0,#d65db1 0,#ff6f91 51%,#ff9671 100%)}.backgrad37,.bgrad37{ background-image: linear-gradient(120deg, #89f7fe 0%, #66a6ff 100%);}.backgrad38,.bgrad38{background-image: linear-gradient(135deg, #667eea 0%, #764ba2 100%);}.backgrad39,.bgrad39{background:linear-gradient(to bottom,#051937,#004d7a,#008793,#00bf72,#a8eb12)}.backgrad40,.bgrad40{background:linear-gradient(45deg,#222 0,#ffa600 50%,#222 100%)}
.backgrad41,.bgrad41{background-image: radial-gradient( circle farthest-corner at 10% 20%, rgba(37,145,251,0.98) 0.1%, rgba(0,7,128,1) 99.8% );}
/* special color */
.bgrad1, .bgrad2, .bgrad3, .bgrad4, .bgrad5, .bgrad6, .bgrad7, .bgrad8, .bgrad9, .bgrad10,
.bgrad11, .bgrad12, .bgrad13, .bgrad14, .bgrad15, .bgrad16, .bgrad17, .bgrad18, .bgrad19,
.bgrad20, .bgrad21, .bgrad22, .bgrad23, .bgrad24, .bgrad25, .bgrad26, .bgrad27, .bgrad28,
.bgrad29, .bgrad30, .bgrad31, .bgrad32, .bgrad33, .bgrad34, .bgrad35, .bgrad36, .bgrad37,
.bgrad38, .bgrad39, .bgrad40 {  color:transparent; -webkit-background-clip:text; background-clip:text; }

/* basic name colors */
.bneon1{color:#fff;text-shadow:1px 1px 1px #e60000,1px 1px 3px #f33,1px 1px 5px #f33}.bneon2{color:#fff;text-shadow:1px 1px 1px #e63900,1px 1px 3px #f63,1px 1px 5px #f63}.bneon3{color:#fff;text-shadow:1px 1px 1px #e67300,1px 1px 3px #f93,1px 1px 5px #f93}.bneon4{color:#fff;text-shadow:1px 1px 1px #b38600,1px 1px 3px #fc3,1px 1px 5px #fc3}.bneon5{color:#fff;text-shadow:1px 1px 1px olive,1px 1px 3px #cc0,1px 1px 5px #cc0}.bneon6{color:#fff;text-shadow:1px 1px 1px #739900,1px 1px 3px #9c0,1px 1px 5px #9c0}.bneon7{color:#fff;text-shadow:1px 1px 1px #408000,1px 1px 3px #59b300,1px 1px 5px #59b300}.bneon8{color:#fff;text-shadow:1px 1px 1px #637042,1px 1px 3px #829356,1px 1px 5px #829356}.bneon9{color:#fff;text-shadow:1px 1px 1px #004d00,1px 1px 3px green,1px 1px 5px green}.bneon10{color:#fff;text-shadow:1px 1px 1px #009926,1px 1px 3px #00e639,1px 1px 5px #00e639}.bneon11{color:#fff;text-shadow:1px 1px 1px #00994d,1px 1px 3px #00e673,1px 1px 5px #00e673}.bneon12{color:#fff;text-shadow:1px 1px 1px #009973,1px 1px 3px #00e6ac,1px 1px 5px #00e6ac}.bneon13{color:#fff;text-shadow:1px 1px 1px teal,1px 1px 3px #0cc,1px 1px 5px #0cc}.bneon14{color:#fff;text-shadow:1px 1px 1px #027997,1px 1px 3px #03add8,1px 1px 5px #03add8}.bneon15{color:#fff;text-shadow:1px 1px 1px #0040ff,1px 1px 3px #36f,1px 1px 5px #36f}.bneon16{color:#fff;text-shadow:1px 1px 1px #0c5d73,1px 1px 3px #107896,1px 1px 5px #107896}.bneon17{color:#fff;text-shadow:1px 1px 1px #036,1px 1px 3px #004d99,1px 1px 5px #004d99}.bneon18{color:#fff;text-shadow:1px 1px 1px #2d00b3,1px 1px 3px #63f,1px 1px 5px #63f}.bneon19{color:#fff;text-shadow:1px 1px 1px #7300e6,1px 1px 3px #93f,1px 1px 5px #93f}.bneon20{color:#fff;text-shadow:1px 1px 1px #ac00e6,1px 1px 3px #c3f,1px 1px 5px #c3f}.bneon21{color:#fff;text-shadow:1px 1px 1px #c0c,1px 1px 3px #f3f,1px 1px 5px #f3f}.bneon22{color:#fff;text-shadow:1px 1px 1px #e600ac,1px 1px 3px #f3c,1px 1px 5px #f3c}.bneon23{color:#fff;text-shadow:1px 1px 1px #c06,1px 1px 3px #f39,1px 1px 5px #f39}.bneon24{color:#fff;text-shadow:1px 1px 1px #e60039,1px 1px 3px #f36,1px 1px 5px #f36}.bneon25{color:#fff;text-shadow:1px 1px 1px #503930,1px 1px 3px #604439,1px 1px 5px #604439}.bneon26{color:#fff;text-shadow:1px 1px 1px #604439,1px 1px 3px #795548,1px 1px 5px #795548}.bneon27{color:#fff;text-shadow:1px 1px 1px #805a4d,1px 1px 3px #a97f70,1px 1px 5px #a97f70}.bneon28{color:#fff;text-shadow:1px 1px 1px #9f7160,1px 1px 3px #bc9b8f,1px 1px 5px #bc9b8f}.bneon29{color:#fff;text-shadow:1px 1px 1px grey,1px 1px 3px #9e9e9e,1px 1px 5px #9e9e9e}.bneon30{color:#fff;text-shadow:1px 1px 1px #5e7a87,1px 1px 3px #879fab,1px 1px 5px #879fab}.bneon31{color:#fff;text-shadow:1px 1px 1px #495f69,1px 1px 3px #698796,1px 1px 5px #698796}.bneon32{color:#fff;text-shadow:1px 1px 1px #2a363c,1px 1px 3px #495f69,1px 1px 5px #495f69}
/* basic name colors background */
.bnback1{background:#f33}.bnback2{background:#f63}.bnback3{background:#f93}.bnback4{background:#fc3}.bnback5{background:#cc0}.bnback6{background:#9c0}.bnback7{background:#59b300}.bnback8{background:#829356}.bnback9{background:green}.bnback10{background:#00e639}.bnback11{background:#00e673}.bnback12{background:#00e6ac}.bnback13{background:#0cc}.bnback14{background:#03add8}.bnback15{background:#36f}.bnback16{background:#107896}.bnback17{background:#004d99}.bnback18{background:#63f}.bnback19{background:#93f}.bnback20{background:#c3f}.bnback21{background:#f3f}.bnback22{background:#f3c}.bnback23{background:#f39}.bnback24{background:#f36}.bnback25{background:#604439}.bnback26{background:#795548}.bnback27{background:#a97f70}.bnback28{background:#bc9b8f}.bnback29{background:#9e9e9e}.bnback30{background:#879fab}.bnback31{background:#698796}.bnback32{background:#495f69}
/*select color*/
.color_switch,.bubble_switch {width: 35px; height: 35px; float: left; margin: 3px; background-size: 100% 100%; border-radius: 50%; border: 3px solid var(--light); text-align: center;}
.bccheck { font-size:20px; color:#fff;margin-top: 5px;}
.cflagcheck {font-size: 20px; color: #e83e8c; position: absolute; top: 0; left: 0;}
#picker_box{height:auto;width:auto;position:relative;flex-direction:column;display:inline-block}
#preview_text{backdrop-filter: blur(16px) saturate(180%); -webkit-backdrop-filter: blur(16px) saturate(180%); background-color: rgb(255 255 255 / 84%); border-radius: 12px; border: 1px solid rgba(209, 213, 219, 0.3); padding: 2px;}
/***************** avatar pack****************/
.bubbleWrapper{padding:0;display:flex;justify-content:flex-end;flex-direction:column;align-self:flex-end}.inlineContainer{display:inline-flex}.inlineContainer img{border-radius:20%;padding:4px;background:#ffe4c4}.inlineIcon{width:50px;object-fit:contain;height:50px;}.other{align-self:flex-start}#selected_bubb,.otherBubble{min-width: 60px; max-width: 700px; padding: 10px 9px; margin: 2px; background-color: var(--white); border-radius: 16px 16px 16px 0; border: 1px solid var(--border-color);}.avatar_container{width:100%;margin:0 auto;padding-top: 1px !important;}.items-container{margin-top:9px;min-height:150px;list-style:none;height:auto;width: 99%;position:relative;flex-direction:column;display:inline-block}.items-container li.avatar_item{cursor: grab;width:50px;height:50px;float:left;background-size:100% 100%;border-radius:20%;border:3px solid var(--light);text-align:center}.items-container li.avatar_item span{font-size:11px;color:#bdbdbd}.items-container li.avatar_item img{border-radius:20%;width:100%;height:100%}.pagination-indicator{font-size:12px;color:#7269ef;text-align:center}.pagination-container{list-style:none;padding:5px 0;margin:0 auto;text-align:center}.pagination-container .pagination__item{margin:0 10px 0 0;padding:0;display:inline-block}.pagination-container .pagination__item .pagination__link{display:block;padding:10px;background-color:rgba(85,85,85,.1);color:#7269ef;text-decoration:none;border-radius:27px}.pagination-container .pagination__item--current .pagination__link{color:#fff;background-color:#7269ef;font-weight:700}
/*********Users badges********/
.admin,.sadmin,.modo,.user,.vip{font-weight:700}.admin{color:#c03}.sadmin{color:#9C27B0}.modo{color:var(--green)!important}.vip{color:#b400ff}.user{color:#331ce6}.guest{color:#50a5f1}.sadmin{color:transparent;background-clip:text;background:linear-gradient(to right,#03add8,#013d4b);color:transparent;-webkit-background-clip:text;font-size:15px}.admin{color:transparent;background-clip:text;background:linear-gradient(to right,#f33,maroon);color:transparent;-webkit-background-clip:text;font-size:14px}

/*gift slider*/
.recent_gift_slider{width:100%;top:0;position:absolute!important;z-index:1}
.recent_gift{line-height:10px;background:#00acee;background:linear-gradient(0deg,var(--primary) 0,var(--purple) 100%);border:none;border-radius:20px;min-width:150px!important;max-width:160px}
.recent_gift.active{background:#fb2175;background:linear-gradient(0deg,#fb2175 0,#ea4c89 100%);color:#fff!important;overflow:hidden}
.recent_gift .recent_gift_img{max-width:26px;max-height:26px;margin-left:5px}
.gift_n p{margin:0;padding:1px}
/* fix video chat toggle*/
@media (min-width: 1445px) { .nav-width-fix{ width: 85%; } }
@media (min-width: 1024px) { .nav-width-fix{ width: 85%; } .selected-chat-col { flex: 0 0 20%; max-width: 24%; } }
.panel-content-right { margin-top: 0; margin-left: 12px; margin-right: 12px; } .chat-nav { width: 100%; z-index: 99; position: absolute; }
/*fix input msgs*/
.gse-row { border-bottom: 1px solid #ffffff; backdrop-filter: blur(16px) saturate(180%); -webkit-backdrop-filter: blur(16px) saturate(180%); background-color: rgba(255, 255, 255, 0.75); border-radius: 12px; border: 1px solid rgba(209, 213, 219, 0.3); }
/*sticker and gif*/
.sticker-tab-content .tab-pane{background:#ffffff40;border-radius:12px}.gif-search-area input{border-radius:20px!important;padding:4px!important;margin:5px!important}.reply-msg-row-show{visibility:visible!important}.reply-msg-row{visibility:hidden}.reply-msg-row-hide{transform:translateY(108%)}.mobile-act-row{background-color:transparent}.mobile-act-row-hide{visibility:hidden}
.forwarding .selected,.forwarding li:hover{backdrop-filter:blur(16px) saturate(180%);-webkit-backdrop-filter:blur(16px) saturate(180%);background-color:rgb(238 242 244 / 33%)!important;border-radius:12px;border:1px solid rgba(209,213,219,.3)}.forward-selection{backdrop-filter:blur(16px) saturate(180%);-webkit-backdrop-filter:blur(16px) saturate(180%);background:#20c9a6e8;border-radius:12px;border:1px solid rgba(209,213,219,.3);font-weight:700}
/*leftside*/
.services-container {
    width: 100%;
    padding: 14px;
    margin: 0 0;
    border-radius: 10px;
}
.online-list, .dm-list {
    overflow: visible;
    border-radius: 20px;
}
.online-list>div, .fav-list>div, .dm-list>div {
    border-radius: 20px;
}
.chat-name {
    font-weight: bold;
   display: flow-root;
    justify-content: space-between;

}
.chat-preview span {
    max-width: 200px;
}
.mini-user-list .services-container{
    padding: 0;
    background: none;
    margin: 0 auto;	
}
img.img-profile {
    background: var(--received-background);
    padding: 4px;
}
.fu_search_toggle{
    position: absolute;
    top: 0;
    z-index: 1000;
    padding: 9px;
    border-radius: 10px;	
	display: none;
}
.fu_search_toggle input {
    border-radius: 17px !important;
}.fu_search_toggle .btn-room-user-search {
	background: var(--body-color);
    color: white;
    border-radius: 25px !important;
}
.non-login-message, .non-join-message, .non-chat-select {
    background-color: black;
    border-radius: 12px;
    border: 1px solid black;
}

.non-login-message p, .non-join-message p, .non-chat-select p {
    font-size: 14px;
    text-transform: capitalize;
    text-align: center;
    margin: 0 auto;
    right: 0;
    left: 0;
}
.non-login-message p > a{
     color: var(--warning);
    font-family: system-ui;
    font-weight: 800;   
}
.chat-link {
    color: var(--sent-color);
}
.message-html, .chat-img, .chat-txt, .chat-gif, .chat-sticker {
    border-radius: 10px 10px 0px 10px;
}
.messages ul li.replies .message-data small {
    display: initial;
}
.new-date p {
    text-align: center;
    width: auto;
    max-width: unset !important;
    background: var(--indigo);
    margin: 0 auto;
    border-radius: 20px;
    padding: 4px;
}
.message-time {
   color: white;
}
.chat-txt {
    color: white;
}
.mention {
    color: var(--white) !important;
    cursor: pointer;
    transition: 0.3s;
    background: darkblue;
    padding: inherit;
    border-radius: 20px 0px;
}
/*radio*/

.radio-panel {
    backdrop-filter: blur(16px) saturate(180%);
    -webkit-backdrop-filter: blur(16px) saturate(180%);
    background-color: rgba(255, 255, 255, 0.75);
    border-radius: 12px;
    border: 1px solid rgba(209, 213, 219, 0.3);
    left: 0;
    right: 0;
    width: 90%;
    margin: 0 auto;
}
/* Blink for Webkit and others
(Chrome, Safari, Firefox, IE, ...)
*/

@-webkit-keyframes blinker {
  from {opacity: 1.0;}
  to {opacity: 0.0;}
}
.blink{
	text-decoration: blink;
	-webkit-animation-name: blinker;
	-webkit-animation-duration: 0.6s;
	-webkit-animation-iteration-count:infinite;
	-webkit-animation-timing-function:ease-in-out;
	-webkit-animation-direction: alternate;
}
/*pro icon*/
.list_pro_icon{
     backdrop-filter: blur(16px) saturate(180%);
    -webkit-backdrop-filter: blur(16px) saturate(180%);
    background-color: rgba(255, 255, 255, 0.75) !important;
    border-radius: 12px;
    border: 1px solid rgba(209, 213, 219, 0.3);   
}
.star {
    fill: #21d4fd;
    background-color: #21D4FD;
    background-image: linear-gradient(19deg, #21D4FD 0%, #B721FF 100%) !important;
}
.hot{
    background-color: #85FFBD;
    background-image: linear-gradient(45deg, #85FFBD 0%, #FFFB7D 100%) !important;
    fill: #0bd06e;	
}.vip {
    background-color: #FBDA61;
    background-image: linear-gradient(45deg, #FBDA61 0%, #FF5ACD 100%) !important;
    fill: #FBDA61;
}.ultima{
    background-color: #00DBDE;
    background-image: linear-gradient(90deg, #00DBDE 0%, #FC00FF 100%) !important;
    fill: #dd1818;	
}
/*fix mobile bugs*/
@media (max-width: 768px) {
	.chat-list-col {
	display: none;	
	}	
	.services-container {
		    padding: 0;
	}
 }
 @media screen and (max-width: 576px) {
    .chat-nav{
        width: calc( 100vw - 13px) !important;
    }
    h1.chat-title{
        font-size: 10px;
    }
    
}
@media (max-width: 768px) {

    .chat-nav{
        width: 100% !important;
    }
}