/* 
* Mujahid Shaikh
* Gupshup Technology 2017
*/
html {
    height: auto;
}
body{overflow:visible;}
.form-menu-holder #smartForm {
    height:350px;
}
@-ms-viewport {
    width: auto;
}
input.inline-input {
    /*font-size: 18px;*/
    border: 1px solid #C0C0C0;
    display: inline;
    background:transparent;
}
.tag {
    font-size: 10px;
    padding: 2px 5px;
    border-radius: 4px;
    background-color: #CCECD0;
}
.members-header {
    padding:16px 10px;
}
/*.media-heading {zoom:.8;}*/
.wrap {margin: 20px 0px 50px 0px;padding: 0px;}
#tab-messages-list.loading { background: url("../img/loader.gif") no-repeat center center fixed;background-color:#ffffff}
.mobile-menu{bottom:43px !important;}
.mobile-frmOpt{width: 32.5% !important;min-height:85px;}
.frmOpt a.btn {width: auto;margin:0 auto;}
.users-list {padding-top:0!important;padding-left:0!important;}
.users-list li{padding-left:10px;}
.users-list li:active{background-color: #F5F5F5;}
.nav-header{background-color:#f0f0f0;border-bottom:2px solid;border-color: #E4E4E4 !important;position: fixed;width: 100%;margin-bottom: 0px;top:0px;z-index: 1;left: 0;height: auto;-webkit-box-shadow: 0px 1px 5px 0px rgba(228,228,228,0.85);-moz-box-shadow: 0px 1px 5px 0px rgba(228,228,228,0.85);box-shadow: 0px 1px 5px 0px rgba(228,228,228,0.85);opacity: 0.95;text-align: center;
    z-index: 100;
}
.nav-header-body{margin-top:50px;}
.back{font-size: 12px;font-weight: normal;line-height: 18px;}
.btn-leave{width:100%;}
.leave{padding:10px;}
.avatar{margin-right: 15px;line-height: 15px;float: right;margin-top: 0px;margin-bottom: 0;}
.members-header{margin: 0;}
.select2-search-field input{min-width:220px;}
.input-m{display: inline-flex;}
.select2-container{float:left;}
.form-menu {position: fixed !important;bottom:42px;}
.form-menu-holder {position: fixed !important;bottom:0;}
.navbar-nav .open .dropdown-menu{background-color: #fff;}
.btn {
    white-space: normal;
    border-radius: 0 0;
    background-color: #fff;
    color: #3498db;
    border: 1px solid #3498db;
    font-size: inherit;
    border-radius: 4px;
    padding: 5px 10px;
}
.navbar-inverse .navbar-nav>.open>a, .navbar-inverse .navbar-nav>.open>a:hover, .navbar-inverse .navbar-nav>.open>a:focus {float: right;}
@media (max-width: 767px){
	.navbar-inverse .navbar-nav .open .dropdown-menu>li>a:hover {color: #999;}
}
.form-horizontal .form-group {margin-right: 0;margin-left: 0; margin-bottom:10px;}
.full-height {position: absolute;width: 100%;height:auto;}
.chat-team-icon {margin: 0px 10px;color: #42B7DA;font-size: 16px;vertical-align: middle;}
.page-title{padding:0;}
.info{font-size: 18px;padding: 0;top:8px;}
.form-fields h4 {background-color: #EBEBEB;color: #555;}
.change-group-name{padding: 0px 10px 0px 10px;display: block;}
.change-group-name a{padding: 2px 10px;}
.remove {padding: 0;width: auto;margin: 0;}
.remove:hover{background-color:transparent;border:none;color:#999;}
#mainbox {height: 100%;margin-top: 0px;}
/*body{background: url("../img/loader.gif") no-repeat center center fixed;}*/
.nobg{background:transparent !important;background-image: none;}
.profile{padding:10px 15px;color:#515151; text-align:left;border-bottom:0 none;}
.profile-holder{border-bottom:1px solid #d8d8d8;display:block;padding-bottom:10px;}
.loggedin-user-img {margin-top:10px;margin-left:5px;width: 70px;height: 70px;margin-right:0;}
.lists {padding: 0 0 5px 15px;border-bottom: 1px solid #ececec;}
.lists li{list-style-type: none;margin: 5px 0 5px 0;}
.lists li a{padding: 5px 0;color:#515151;display:block; outline: medium none;}
.lists li a img {margin:0 5px 0 0;}
.title{
    color: #ffffff;
    font-size: 18px;
    margin: 6px 0;
    display: inline-block;
}
.loggedin-user-org{color:#888;}
.glyphicon-align-justify{color:#2a2a2a;margin-top:3px;}
.header-img-margin{margin-top:7px;}
.nleft{
    padding: 9px;
    font-size: 14px;
    margin-left:-20px;
    display: inline-block;
}
.nright{
    /*margin: 3px 2px;*/
    padding: 10px;
}
.nav-pills>li>a .mini {
width: auto;
}
.nav-pills>li>a p {
	font-weight:normal;
	font-size:14px;
	color: #888888;
	text-overflow: ellipsis;
    white-space: nowrap;
    width: 80%;
    overflow-x: hidden;
}
.form-group .heading {
    font-weight: bold;
    font-size: 14px;
}
#phone-msg {
    color: rgb(255, 155, 0);
    background: inherit;
    padding: 0px;
    font-size: 12px;
    display:none;
	text-align: left;
}
.form-horizontal .control-label {
	font-size: 10pt;
}
.location {
	width:275px;
}
.loc-address {
	width:165px;
	word-wrap:break-word;
}
.drawer{color:#42B7DA;}
body.modal-open {
    overflow: hidden;
    width: 100%;
}
.no-msg {
	padding: 30px !important;
	text-align: center;
}
.add-members {
	height: 250px;
	/*padding: 0 10px 0 0 !important;*/
	overflow-y: scroll;
}
#footer input {
    height:50px;
    padding: 6px 0;
}
#smart-form-holder .form-group small {
    text-transform:capitalize;
}
.form-menu-holder {
    box-shadow: 3px 0px 6px #999;
}
.btn-group-justified li.btn {
    display: inline-table;
    width: auto;
}
.bot-avatar {
    overflow: hidden;
    width: 25px;
    float: left;
    margin-right: 10px;
    -webkit-animation: scaleIn 1s cubic-bezier(0.68, -0.55, 0.265, 1.55);
    -moz-animation: scaleIn 1s cubic-bezier(0.68, -0.55, 0.265, 1.55);
    animation: scaleIn 1s cubic-bezier(0.68, -0.55, 0.265, 1.55);
    -webkit-transform-origin: left bottom;
    -moz-transform-origin: left bottom;
    -ms-transform-origin: left bottom;
    -o-transform-origin: left bottom;
    transform-origin: left bottom;
}
.user-avatar {
    float: right;
    margin-right: 0;
    margin-left: 10px;
    -webkit-animation: scaleIn 1s cubic-bezier(0.68, -0.55, 0.265, 1.55);
    -moz-animation: scaleIn 1s cubic-bezier(0.68, -0.55, 0.265, 1.55);
    animation: scaleIn 1s cubic-bezier(0.68, -0.55, 0.265, 1.55);
    -webkit-transform-origin: left bottom;
    -moz-transform-origin: left bottom;
    -ms-transform-origin: left bottom;
    -o-transform-origin: left bottom;
    transform-origin: left bottom;
    display: none;
}
.modal-header .close {
    font-size: 30px;
}
#file-chooser {
    max-width: 100%;
}
.blank{width:36px;height:28px;display:inline-block;}
.ip{background:url("../img/mobile/profile.png");}
.ij{background:url("../img/mobile/join.png")}
.iev{background:url("../img/mobile/email-invite.png");}
.isv{background:url("../img/mobile/sms-invite.png")}
.id{background:url("../img/mobile/document.png");}
.ipp{background:url("../img/mobile/privacy.png");}
.itc{background:url("../img/mobile/terms.png");}
.ih{background:url("../img/mobile/help.png");}
.ifaq{background:url("../img/mobile/faq.png");}
.il{background:url("../img/mobile/logout.png");}
.icons {width: 30px;display:none;height: 30px;background-size: 100% 100%;background-repeat: no-repeat;display: inline-block;margin-right: 10px;}
.action-icons {width: 24px;height: 24px;background-size: 100% 100%;background-repeat: no-repeat;display: inline-block;}
.comment-wrap{width:200px;word-wrap:break-word;}
.select2-container-multi .select2-choices{background-image: none !important;border-radius: 2px;border: 1px solid #ccc !important;}
.form-control {
	border-radius: 0;
	-webkit-box-shadow: none;
	box-shadow: none;
    color: #737373;
}
.fix-width-profile {
    display: inline-block;
    margin-bottom: 5px;
    width: 180px;
    word-wrap: break-word;
    vertical-align: top;
}
.title-wrap-ellipsis{
    width: 80%;
    text-overflow: ellipsis;
    overflow: hidden;
    float: left;
    white-space: nowrap;
    text-align: left;
}
.middle-title {
    width: 83%;
}
.new-chat-bubble {
	position: fixed;
	bottom: 0;
	right: 0;
	background-color: #0086ca;
	border-radius: 50%;
	width: 50px;
	height: 50px;
	text-align: center;
	line-height: 50px;
	margin: 0 15px 15px 0;
}
.new-chat-bubble img {
	width: 24px;
	height: 24px;
	background-size: 100% 100%;
	background-repeat: no-repeat;
	display: inline-block;
 }
 .media .expire{
    visibility: visible;
}
.comments-label {display:none;}
.nleft.back-history {margin-left:-20px;}
.option-btn{
    display: inline-block;
    margin: 10px 0 5px 0;
    border-radius: 20px;
    min-width: 75px;
}
.input-group-addon {
    
    border-radius: 0;
    border-bottom: transparent;
    border-right: transparent;
    border-left: transparent;
    padding: 0 12px;
}
.ic_send {
    color: #3498db;
    border: transparent;
    outline: 0;
    text-shadow: 0 1px 2px rgba(123, 123, 123, 0.9);
    border-radius: 50px;
    width: 32px;
    height: 32px;
    vertical-align: middle;
   
}
.ic_attach {
    display: inline-block;
    padding: 0 2px 0 0;
    position: relative;
}
.ic_mic {
    color: #3498db;
    border: transparent;
    border-radius: 4px 0 0 4px;
    outline: 0;
    text-shadow: 0 1px 2px rgba(123, 123, 123, 0.9);
    height: 37px;
    width: 37px;
    vertical-align: middle;
    background: #fff0;
    border-right: 1px solid #fff;
}

.mic_active{
    border-radius: 4px 0 0 4px;
}
.gs-pulse, .pulse-background, .pulse-border {
    position: absolute;
    border-radius: 50%;
    width: 80%;
    height: 80%;
    top: 10%;
    left: 10%;
    
}

.pulse-background {
    background: rgb(80 75 75 / 87%); /* Background pulse color */
    animation: pulse-background 1.5s infinite;
    z-index: 1; /* Behind the border */
}

.pulse-border {
    border: 2px solid #fff; /* Border pulse color and thickness */
    box-sizing: border-box;
    animation: pulse-border 1s infinite;
    z-index: 2; /* Ensure it's above the background pulse */
}

.gs-pulse {
    background: rgb(80 75 75 / 18%); /* Inner pulse color */
    animation: pulse-inner 1.5s infinite;
    z-index: 3; /* Ensure this is above other pulses */
}

@keyframes pulse-background {
    0% {
        transform: scale(1);
        opacity: 0.5;
    }
    50% {
        transform: scale(1.2); /* Smaller zoom effect */
        opacity: 0.3;
    }
    100% {
        transform: scale(1);
        opacity: 0.5;
    }
}

@keyframes pulse-border {
    0% {
        transform: scale(1);
        opacity: 0.5;
    }
    50% {
        transform: scale(1.1); /* Even smaller zoom effect for the border */
        opacity: 0.3;
    }
    100% {
        transform: scale(1);
        opacity: 0.5;
    }
}

@keyframes pulse-inner {
    0% {
        transform: scale(1);
        opacity: 0.5;
    }
    50% {
        transform: scale(1.1); /* Smaller zoom for the inner pulse */
        opacity: 0.3;
    }
    100% {
        transform: scale(1);
        opacity: 0.5;
    }
}


.media {
    margin-top: 0px;
    margin-bottom: 10px;
    flex-wrap: wrap;
}
.user{
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 4px;
}
.media-heading {
    margin: 0;
    line-height: 24px;
}
.media-heading ul{
    list-style-type: disc;
    padding-inline-start: 22px;
}
.media-heading ol{
    padding-inline-start: 22px;
}
.bot-name, .user-name {
    font-weight: bold;
}
.bot-name {
    color: #565656;
}
.user-name {
    color: #fff;
}
.text-question {
    /*font-size: 18px;*/
}
.document-body {
    border-radius: 0;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    align-items: center;
    text-decoration: none;
    cursor: pointer;
    font-size: 14px;
    font-weight: bold;
    word-wrap: break-word;
    color: #666666;
    margin: 0 0 5px 0;
}
.document-body:hover {
     color: #565656;
}
a:hover.document-body .download-icon {
    display: block;
}
.icon-doc {
    background-image: url(../img/ic_file.png);
    width: 26px;
    height: 30px;
    background-repeat: no-repeat;
    background-size: contain;
}
.document-text {
    margin: 0 15px;
    overflow: hidden;
    max-width: 125px;
}
.ellipsify {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    display: inline-block;
    width: 100%;
}
.emojitext {
    vertical-align: middle;
}
.doc-state {
    position: relative;
    width: 28px;
    height: 28px;
}
.file-description {
  font-size: 11px;
  display: flex;
  gap: 4px;
}
.audio-position {
    position: absolute;
    margin-top: -16px;
    right: 128px;
    color: #000;
}
.download-icon {
    height: 24px;
    background-image: url(../img/ic_download.png);
    background-repeat: no-repeat;
    background-position: center right;
 	width: 24px;
	float: right;
}
.media-heading:hover .richmedia-text .download-icon {
    display: block;
}
.richmedia-body {
    width: 100%;
    border-radius: 8px;
}
video.richmedia-body {
    zoom:0.8;
}
video.intro-video {
    zoom:1;
}
.richmedia-state-icon {
    border-radius: 0;
    /*background-color: #f1f1f1;*/
    padding: 5px;
    display: block;
    text-align: left;
    width: auto;
    height: 100%;
}
.audio, .video {
    max-width: 90%;
    border-radius: 10px;
 }
  .video-filename {
    margin-top: -7px;
 }
 .image {
    margin-top: 0;
 }
.richmedia-text {
    color: #ffffff;
    font-size: 14px;
}
.richmedia-text:hover {
    color: #565656;
    text-decoration: none;
}
.ic-loader {
    display: table;
    background-image: url(../../static/img/loading.svg);
    background-repeat: no-repeat;
    background-position: center center;
    border-radius: 50%;
    margin: 0 auto;
    min-height: 32px;
    min-width: 32px;
    max-width: 300px;
    text-align: center;
}
/*.dropdown-menu:before {
    position: absolute;
    bottom: -14px;
    left: 18px;
    display: inline-block;
    border-right: 7px solid transparent;
    border-bottom: 7px solid transparent;
    border-left: 7px solid transparent;
    border-top-color: rgba(0,0,0,0.2);
    content: '';
    border-top: 7px solid #a9a9a9;
}
.dropdown-menu:after {
    position: absolute;
    bottom: -12px;
    left: 19px;
    display: inline-block;
    border-right: 6px solid transparent;
    border-bottom: 6px solid transparent;
    border-left: 6px solid transparent;
    content: '';
    border-top: 6px solid #fff;
}*/
.persistence-dropdown-menu {
    position: fixed;
    box-shadow: none;
    padding: 0;
    width: 100%;
    bottom:52px !important;
    margin: 0;
    border-radius: 0;
    margin-bottom: -2px !important;
    box-shadow: 0px -8px 14px 0px #0000001F;
    border-radius: 16px 16px 0 0;
    background: #fff !important;
    max-height: 91vh;
    height: fit-content;
    overflow-y: auto;
}
.persistence-dropdown-menu>li>b {
    display: block;
    padding: 10px 20px;
    clear: both;
    font-weight: normal;
    line-height: 1.428571429;
    color: #333;
    white-space: nowrap;
    font-size: 16px;
}
.persistence-dropdown-menu>li>a {
	/*color: #3498db;*/
    padding: 10px 20px;
    font-size: 14px;
    line-height: 24px;
}
.persistence-dropdown-menu>li>a:hover, .persistence-dropdown-menu>li>a:focus {
    background-color: transparent;
}
#persistMenu li {
    list-style: none;
    transition: background-color 0.3s ease; /* Smooth transition for hover effect */
    overflow: hidden; /* Ensures content stays within bounds */
}

#persistMenu li:hover {
    background-color: rgb(220, 220, 220); /* Light grey background on hover */
}

#persistMenu li a {
    text-decoration: none;
    color: inherit; /* Keep the text color consistent */
    display: block;
}

video.video-reply{
	height:220px;
}
div.interim{
    display: none;
    bottom: 0px;
    height: 50px;
    z-index: 999;
    position: fixed;
    left: 0px;
    white-space: nowrap;
    /*font-size: 18px;*/
    line-height: 50px;
    background:white;
    width: 100%;
    padding-right:80px;
    border-top:1px solid rgba(75,75,75,0.15);
}
span.interim-text{
	float:left;	
	display:inline-block;
	width:100%;
	padding: 0px 15px;
	min-width: 100%;
    height: 50px;
}
span.interim-actions{
	display:inline-block;
	width:80px;
	text-align:center;
}
.interim-actions span{
	display:inline-block;
	width:40px;
	vertical-align: middle;
	font-weight:400;
	font-size:16px;
	color: grey;
}
.quick-reply {
	display: block;
	text-align: left;
	clear: both;
    padding-left: 35px;
}
.btn-qr {
	border-radius: 20px;
    padding: 5px 10px;
	min-width: 80px;
    margin-right: 5px;
}
.btn-qr img {
    width: 20px;
    border-radius: 100%;
    height: 20px;
    margin: auto 5px auto 0;
    vertical-align: middle;
}
.text_action_wrapper{
    padding: 10px;
}
.date_time_submit_btn{
    display: flex;
    justify-content: center;
    align-items: center;
    background: #fff;
    padding: 10px;
}

#submitAppointment{
width: 75%;
}

@-webkit-keyframes scaleIn {
  from {
    opacity:0;
    -webkit-transform: translate(0,40px);
  }
  to {
    opacity:1;
    -webkit-transform: translate(0,0px);
  }
}
@-moz-keyframes scaleIn {
  from { opacity:0;
    -moz-transform: translate(0,40px);
  }
  to {
    opacity:1;
    -moz-transform: translate(0,0px);
  }
}
@keyframes scaleIn {
  from {
    opacity:0;
    -webkit-transform: translate(0,40px);
    -moz-transform: translate(0,40px);
    -ms-transform: translate(0,40px);
    -o-transform: translate(0,40px);
    transform: translate(0,40px);
  }
  to {
    opacity:1;
    -webkit-transform: translate(0,0px);
    -moz-transform: translate(0,0px);
    -ms-transform: translate(0,0px);
    -o-transform: translate(0,0px);
    transform: translate(0,0px);
  }
}
.loading span {
    animation-name: blink;
    animation-duration: 1.4s;
    animation-iteration-count: infinite;
    animation-fill-mode: both;
    font-size: 50px;
    line-height: 0px;
    vertical-align: middle;
    display: inline-block;
    border-radius: 50px;
    margin-right: 5px;
    width: 8px;
    height: 8px;
    background: #333;
}
.loading span:nth-child(2) {
  animation-delay: .2s;
}
.loading span:nth-child(3) {
  animation-delay: .4s;
}
@keyframes blink {
  0% {
    opacity: .2;
  }
  20% {
    opacity: 1;
  }
  100% {
    opacity: .2;
  }
}
::-webkit-scrollbar {
    width: 6px;
    height: 6px;
}
::-webkit-scrollbar-thumb {
    background-color: rgba(0,0,0,.2);
}
::-webkit-scrollbar-track {
    background: rgba(255,255,255,.08);
}
iframe {border:0;}
.wv-modal {
	overflow: auto;
}
.wv-modal .modal-dialog {
    padding: 0;
    width: 100%;
    margin: 0 auto;
}
.wv-modal .modal-content {
    box-shadow: none;
    border: none;
    border-radius: 0;
}
.wv-modal .modal-body {
    padding: 0;
}
.wv-modal .modal-header {
    padding: 10px 15px;
    box-shadow: none;
    background-color: #fff;
    border-radius: 0px 0px 0 0;
    color: #404040;
    position: relative;
    text-align: center;
}
.wv-modal .modal-header .close {
    font-size: 30px;
    position: absolute;
    right: 10px;
    top: 50%;
    transform: translateY(-50%);
    float: none;
    margin: 0;
    color: #404040;
    opacity: 1;
    z-index: 1;
    line-height: 1;
}
.wv-modal .modal-title {
    color: #404040;
    margin: 0 auto;
    padding: 0 36px;
    text-align: center;
    width: 100%;
    box-sizing: border-box;
    font-family: inherit;
    font-size: 1rem;
    font-weight: bold;
    line-height: 1.35;
}
.ic_back--multimenu {
    background-image: url(../img/ic_navigation_arrow_back.png);
    background-position: -8px -8px;
    height: 18px;
    width: 16px;
    display: inline-block;
    background-repeat: no-repeat;
    vertical-align: middle;
    margin-right: 10px;
}
.ic_next--multimenu {
	background-image: url(../img/ic_navigation_arrow_next.png);
    background-position: -11px -4px;
    height: 24px;
    width: 10px;
    display: inline-block;
    background-repeat: no-repeat;
    float: right;
}
.multimenu-header {
	/*color: #363636 !important;*/
	display: inline-block !important;
    font-weight: bold !important;
}
.close-multimenu {
    float: right;
    /*padding: 6px;*/
}
.cursor {
	cursor: pointer;
}
.bgimage:after{
    content:"";
    background-size:cover;
    background-attachment: scroll;
    background-position: center center;
    background-repeat: no-repeat;
    min-height:100%;
    position: fixed;
    min-width: 100%;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    z-index: -1;
    overflow: hidden;
}
.ms-get-started {
    background: transparent;
    border: none;
    width: 100%;
    color: #3498db;
    font-size: 16px;
    border-top: 1px solid #eaeaea;
    position: fixed;
    bottom: 0;
    left: 0;
    padding: 10px;
}
.sprite {
    background-image: url("../img/ic_download_icon.svg");
    background-repeat: no-repeat;
    display: inline-block;
}
.sprite-cancel {
    background-position: -104px -294px ;
    width: 40px;
    height: 40px;
}

.sprite-default {
    background-position: -214px -313px ;
    width: 24px;
    height: 24px;
}

.sprite-ic_bot {
    background-position: -312px -310px ;
    width: 24px;
    height: 24px;
}

.sprite-ic_content_add {
    background-position: -257px -58px ;
    width: 32px;
    height: 32px;
}

.sprite-ic_del {
    background-position: -63px -261px ;
    width: 24px;
    height: 24px;
}

.sprite-ic_download {
    cursor: pointer;
    width: 26px;
    height: 26px;
    vertical-align: top;
    float: right;
}

.sprite-ic_file {
    background-image: url(../img/page-file-icon.svg);
    background-repeat: no-repeat;
    display: inline-block;
    width: 26px;
    height: 30px;
    vertical-align: middle;
}

.sprite-ic_hardware_keyboard_arrow_down {
    background-position: -261px -260px ;
    width: 30px;
    height: 30px;
}

.sprite-ic_microphone {
    background-position: -10px -209px ;
    width: 32px;
    height: 32px;
}

.sprite-ic_navigation_arrow_back {
    background-position: -216px -10px ;
    width: 32px;
    height: 32px;
    vertical-align: middle;
    margin-right: 10px;
}

.sprite-ic_navigation_arrow_back_black {
    background-position: -108px -210px ;
    width: 32px;
    height: 32px;
}

.sprite-ic_navigation_arrow_next {
    background-position: -198px -108px ;
    width: 32px;
    height: 32px;
    display: inline-block;
    float: right;
}

.sprite-ic_navigation_arrow_next_black {
    background-position: -159px -160px ;
    width: 32px;
    height: 32px;
}

.sprite-ic_navigation_close {
    background-position: -152px -50px;
    width: 44px;
    height: 52px;
}

.sprite-ic_navigation_menu {
    background-position: -107px -9px ;
    width: 32px;
    height: 32px;
}

.sprite-ic_persistence_menu {
    background-position: -58px -159px ;
    width: 32px;
    height: 32px;
}

.sprite-ic_send {
    background-position: -14px -114px ;
    width: 24px;
    height: 24px;
}

.sprite-ic_user {
    background-position: -112px -109px ;
    width: 24px;
    height: 24px;
}

.sprite-mic {
    background-position: -55px -54px ;
    width: 40px;
    height: 40px;
}
.sprite-userdefault {
    background-position: -13px -13px ;
    width: 24px;
    height: 24px;
}
.scroll-to-bottom {
    width: 32px;
    height: 32px;
    position: fixed;
    bottom: 60px;
    right: 5px;
    cursor: pointer;
}
.getStarted{
    text-align:center;
    line-height:48px;
    color:#0084ff;
}
.getStarted span{
    cursor: pointer;
}
.hidden{
    display: none;
}
#attachment > g > path {
    fill: #6b6b6b !important;
}

.hide, .thide {
    display: none;
}

/* —— List message: carousel-style card; host replaces .media-body for layout next to avatar —— */
.list-message-host {
    flex: 1;
    min-width: 0;
}
.list-message-host .media-heading {
    padding: 0;
}
.list-message-carousel-card {
    width: 100%;
    max-width: 100%;
    margin: 0;
}
.list-message-carousel-card .list-message-item-contents.item-contents-wrap {
    width: 100%;
    max-width: 100%;
    margin: 0 auto;
    box-sizing: border-box;
}
.list-message-carousel-card .item-title-wrap {
    max-height: none;
}
/* White action row like carousel .btn-options (override .item-contents-wrap .btn.btn-options gray from style.css) */
.list-message-carousel-card .item-options-wrap .btn.btn-default.btn-options.list-message-open-sheet-btn {
    background: #fff !important;
    background-color: #fff !important;
    text-align: center;
    font-weight: 600;
}

body.bw-list-sheet-body-lock {
    overflow: hidden;
}

#bw-list-sheet-root.bw-list-sheet {
    position: fixed;
    inset: 0;
    z-index: 10050;
    pointer-events: none;
    visibility: hidden;
    opacity: 0;
    transition: opacity 0.22s ease, visibility 0.22s ease;
}
#bw-list-sheet-root.bw-list-sheet.bw-list-sheet--open {
    pointer-events: auto;
    visibility: visible;
    opacity: 1;
}

.bw-list-sheet-backdrop {
    position: absolute;
    inset: 0;
    /* align with .cover-all-bg (style.css) */
    background: rgba(33, 33, 33, 0.48);
    pointer-events: auto;
}

/* Panel: defaults match .bot-bubble (style.css) until JS sets --bw-sheet-* from runtime theme */
.bw-list-sheet-panel {
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    height: 75vh;
    max-height: 75vh;
    background-color: var(--bw-sheet-bg, #eeeeee);
    color: var(--bw-sheet-fg, #565656);
    border-radius: 16px 16px 0 0;
    box-shadow: 0 -8px 24px rgba(0, 0, 0, 0.12);
    display: flex;
    flex-direction: column;
    transform: translateY(100%);
    transition: transform 0.28s cubic-bezier(0.32, 0.72, 0, 1);
    pointer-events: auto;
    padding-bottom: env(safe-area-inset-bottom, 0);
}
#bw-list-sheet-root.bw-list-sheet--open .bw-list-sheet-panel {
    transform: translateY(0);
}

.bw-list-sheet-grabber-wrap {
    flex-shrink: 0;
    padding: 8px 0 4px;
    display: flex;
    justify-content: center;
}
.bw-list-sheet-grabber {
    width: 40px;
    height: 4px;
    border-radius: 4px;
    background: currentColor;
    opacity: 0.22;
}

.bw-list-sheet-header {
    position: relative;
    flex-shrink: 0;
    padding: 4px 44px 12px;
    text-align: center;
}
.bw-list-sheet-title {
    margin: 0;
    font-size: 17px;
    font-weight: 600;
    letter-spacing: 0.02em;
    color: var(--bw-sheet-fg, #565656);
}
.bw-list-sheet-close {
    position: absolute;
    left: 8px;
    top: 0;
    width: 40px;
    height: 40px;
    border: none;
    background: transparent;
    color: var(--bw-sheet-muted, var(--bw-sheet-fg, #565656));
    opacity: 0.85;
    font-size: 26px;
    line-height: 1;
    padding: 0;
    cursor: pointer;
    border-radius: 8px;
}
.bw-list-sheet-close:active {
    opacity: 1;
    background: rgba(0, 0, 0, 0.06);
}
@supports (background: color-mix(in srgb, red, blue)) {
    .bw-list-sheet-close:active {
        background: color-mix(in srgb, var(--bw-sheet-fg, #565656) 10%, transparent);
    }
}

.bw-list-sheet-body {
    flex: 1;
    min-height: 0;
    position: relative;
    padding: 0 12px;
}

.bw-list-sheet-state {
    display: none;
    text-align: center;
    padding: 32px 16px;
    color: var(--bw-sheet-muted, var(--bw-sheet-fg, #565656));
    opacity: 0.9;
    font-size: 14px;
}
.bw-list-sheet-loading .bw-list-sheet-spinner {
    width: 32px;
    height: 32px;
    margin: 0 auto 12px;
    border: 3px solid rgba(0, 0, 0, 0.12);
    border-top-color: var(--bw-sheet-accent, #3498db);
    border-radius: 50%;
    animation: bw-list-sheet-spin 0.75s linear infinite;
}
@supports (border-color: color-mix(in srgb, red, blue)) {
    .bw-list-sheet-loading .bw-list-sheet-spinner {
        border-color: color-mix(in srgb, var(--bw-sheet-fg, #565656) 14%, transparent);
        border-top-color: var(--bw-sheet-accent, #3498db);
    }
}
@keyframes bw-list-sheet-spin {
    to {
        transform: rotate(360deg);
    }
}

.bw-list-sheet-scroll {
    display: none;
    position: absolute;
    inset: 0;
    overflow-y: auto;
    overflow-x: hidden;
    -webkit-overflow-scrolling: touch;
    padding-bottom: 8px;
}

.bw-list-sheet-section {
    display: flex;
    gap: 12px;
    align-items: flex-start;
    padding: 14px 4px 8px;
    border-bottom: 1px solid rgba(0, 0, 0, 0.08);
}
@supports (border-color: color-mix(in srgb, red, blue)) {
    .bw-list-sheet-section {
        border-bottom-color: color-mix(in srgb, var(--bw-sheet-fg, #565656) 10%, transparent);
    }
}
.bw-list-sheet-section-icon {
    width: 40px;
    height: 40px;
    border-radius: 10px;
    background-size: cover;
    background-position: center;
    flex-shrink: 0;
    background-color: rgba(0, 0, 0, 0.05);
}
@supports (background: color-mix(in srgb, red, blue)) {
    .bw-list-sheet-section-icon {
        background-color: color-mix(in srgb, var(--bw-sheet-fg, #565656) 6%, var(--bw-sheet-bg, #eee));
    }
}
.bw-list-sheet-section-icon--placeholder {
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: 700;
    font-size: 15px;
    color: var(--bw-sheet-accent, #3498db);
}
.bw-list-sheet-section-title {
    font-weight: 600;
    font-size: 15px;
    color: var(--bw-sheet-fg, #565656);
}
.bw-list-sheet-section-sub {
    font-size: 13px;
    color: var(--bw-sheet-muted, var(--bw-sheet-fg, #565656));
    opacity: 0.88;
    margin-top: 4px;
}

.bw-list-sheet-row,
a.bw-list-sheet-row--link {
    display: flex;
    align-items: center;
    gap: 12px;
    width: 100%;
    text-align: left;
    padding: 14px 10px;
    margin: 0 0 6px;
    border: none;
    border-radius: 12px;
    background-color: var(--bw-sheet-bg, #eeeeee);
    box-shadow: inset 0 0 0 9999px rgba(0, 0, 0, 0.04);
    color: inherit;
    font: inherit;
    cursor: pointer;
    text-decoration: none;
    -webkit-tap-highlight-color: transparent;
    box-sizing: border-box;
}
@supports (background: color-mix(in srgb, red, blue)) {
    .bw-list-sheet-row,
    a.bw-list-sheet-row--link {
        background: color-mix(in srgb, var(--bw-sheet-accent, #3498db) 6%, var(--bw-sheet-bg, #eeeeee));
        box-shadow: none;
    }
}
.bw-list-sheet-row:active,
a.bw-list-sheet-row--link:active {
    box-shadow: inset 0 0 0 9999px rgba(0, 0, 0, 0.06);
}
@supports (background: color-mix(in srgb, red, blue)) {
    .bw-list-sheet-row:active,
    a.bw-list-sheet-row--link:active {
        background: color-mix(in srgb, var(--bw-sheet-accent, #3498db) 11%, var(--bw-sheet-bg, #eeeeee));
        box-shadow: none;
    }
}

.bw-list-sheet-row-icon--dot {
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: var(--bw-sheet-accent, #3498db);
    flex-shrink: 0;
}
.bw-list-sheet-row-main {
    flex: 1;
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 4px;
}
.bw-list-sheet-row-title {
    font-size: 15px;
    font-weight: 600;
    color: var(--bw-sheet-fg, #565656);
    line-height: 1.3;
}
.bw-list-sheet-row-sub {
    font-size: 12px;
    color: var(--bw-sheet-muted, var(--bw-sheet-fg, #565656));
    opacity: 0.88;
}
.bw-list-sheet-row-radio {
    width: 20px;
    height: 20px;
    border-radius: 50%;
    border: 2px solid rgba(0, 0, 0, 0.2);
    flex-shrink: 0;
}
@supports (border-color: color-mix(in srgb, red, blue)) {
    .bw-list-sheet-row-radio {
        border-color: color-mix(in srgb, var(--bw-sheet-fg, #565656) 32%, transparent);
    }
}

.bw-list-sheet-footer {
    flex-shrink: 0;
    padding: 8px 16px 16px;
    border-top: 1px solid rgba(0, 0, 0, 0.08);
}
@supports (border-color: color-mix(in srgb, red, blue)) {
    .bw-list-sheet-footer {
        border-top-color: color-mix(in srgb, var(--bw-sheet-fg, #565656) 10%, transparent);
    }
}
.bw-list-sheet-global-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    justify-content: center;
    margin-bottom: 8px;
}
.bw-list-sheet-global-actions:empty {
    display: none;
}
button.bw-list-sheet-global-link,
a.bw-list-sheet-global-link {
    background: none;
    border: none;
    color: var(--bw-sheet-accent, #3498db);
    font-size: 14px;
    padding: 6px 8px;
    cursor: pointer;
    text-decoration: underline;
    font-family: inherit;
}
.bw-list-sheet-hint {
    margin: 0;
    text-align: center;
    font-size: 12px;
    color: var(--bw-sheet-muted, var(--bw-sheet-fg, #565656));
    opacity: 0.88;
}