.czat-window{
bottom:50px;
right:50px;
width:350px;
position:fixed;
z-index:999;
background:#fff;
border-radius:4px;
-webkit-box-shadow: 0px 0px 10px -1px rgba(0, 0, 0, 0.3);
-moz-box-shadow: 0px 0px 10px -1px rgba(0, 0, 0, 0.3);
box-shadow: 0px 0px 10px -1px rgba(0, 0, 0, 0.3);
padding:24px 0px 20px 0px;
display:none;
}

.czat-window.open{
display:block;
}

.czat-window-button{
width:70px;
height:70px;
bottom:30px;
right:30px;
position:fixed;
border-radius:50%;
background:#2d304e url('../images/dymek.png') no-repeat center center;
background-size:30px auto;
cursor:pointer;
z-index:1000;
display:block;
}

.czat-window-button.close{
display:none;
}

.czat-window-top{
padding:0px 24px 24px 24px;
border-bottom:1px solid #e5eaea;
}

.czat-window-top-content{
display:flex;
justify-content:space-between;
align-items:center;
flex-wrap:nowrap;
}

.czat-window-top-content-left{
display:flex;
justify-content:flex-start;
align-items:center;
flex-wrap:nowrap;
}

.czat-window-top-content-left-img{
width:47px;
height:47px;
margin-right:15px;
background:#2d304e;
border-radius:50%;
overflow:hidden;
}

.czat-window-top-content-left-img.status{
border:4px solid green;
}

.czat-window-top-content-left-img img{
width:100%;
height:100%;
object-position:center;
object-fit:cover;
}

.czat-window-top-content-left-text{
font-size:18px;
font-weight:400;
line-height:normal;
color:#2d304f;
margin-left:10px;
}

.czat-window-top-content-right-close{
width:20px;
height:20px;
background:url('../images/zam.png') no-repeat center center;
cursor:pointer;
z-index:99;
}

.czat-window-product{
padding:20px 24px; 
}

.czat-window-product-content{
display:flex;
justify-content:flex-start;
align-items:center;
flex-wrap:nowrap;
}

.czat-window-product-content-img{
width:51px;
height:45px;
border:1px solid #e5eaea;
margin-right:15px;
}

.czat-window-product-content-img img{
width:100%;
height:100%;
object-fit:contain;
object-position:center;
}

.czat-window-product-content-text{
font-size:14px;
font-weight:400;
line-height:18px;
color:#4b4b4b;
}

.czat-window-text-info{
padding:24px 0px;
background:#fafbfb url('../images/znak-wodny.jpg') no-repeat center center;
height:210px;
overflow-y:auto;
}

.czat-window-text-info-content{
padding:0px 24px;
}

.czat-window-text-info-content-text-a{
width:calc(100% - 30px);
margin-bottom:20px;
}

.czat-window-text-info-content-text-a-con{
border-radius:4px;
padding:10px;
background:#f2f4f5;
font-size:14px;
font-weight:400;
line-height:18px;
color:#4b4b4b;
}

.czat-window-text-info-content-text-data-a{
font-size:12px;
font-weight:400;
line-height:18px;
color:#4b4b4b;
padding-top:10px;  
}

.czat-window-text-info-content-text-b{
width:calc(100% - 30px);
padding-left:30px;
margin-bottom:20px;
}

.czat-window-text-info-content-text-b-con{
border-radius:4px;
padding:10px;
background:#ceddff;
font-size:14px;
font-weight:400;
line-height:18px;
color:#4b4b4b;
}

.czat-window-text-info-content-text-data-b{
font-size:12px;
font-weight:400;
line-height:18px;
color:#4b4b4b;
padding-top:10px;
text-align:right; 
}

.czat-window-text-down{
padding:20px 24px 0px 24px;
}

.czat-window-text-down-content{
display:flex;
justify-content:space-between;
align-items:center;
flex-wrap:nowrap;
}

.czat-window-text-down-content-block{
position:relative;
width:calc(100% - 30px);
}

.czat-window-text-down-content-block::after{
content:attr(data-textarea-value) " ";
white-space:pre-wrap;
visibility:hidden;
overflow-wrap:break-word;
word-break:break-word;
max-height:130px;
width:100%;
line-height:normal;
font-size:14px;
font-weight:400;
color:#4b4b4b;
padding:0px 0px;
overflow:hidden;
display:block;
}

.czat-window-text-down-content-textarea{
position:absolute;
top:0px;
left:0px;
height:100%;
outline:none;
line-height:normal;
font-size:14px;
font-weight:400;
color:#4b4b4b;
padding:0px 0px;
margin:0px;
border:0px;
width:100%;
resize:none;
overflow:hidden; 
}

.czat-window-text-down-content-textarea::-webkit-input-placeholder{ 
color:#4b4b4b;
opacity:1;
}
.czat-window-text-down-content-textarea::-moz-placeholder{
color:#4b4b4b;
opacity:1;
}
.czat-window-text-down-content-textarea:-ms-input-placeholder{
color:#4b4b4b;
opacity:1;
}
.czat-window-text-down-content-textarea:-moz-placeholder{
color:#4b4b4b;
opacity:1;
}

.czat-window-text-down-content-send{
width:25px;
height:25px;
background:url('../images/send.png') no-repeat center center;
background-size:100% 100%;
cursor:pointer;
}


.czat-conteiner{
width:calc(100% - 40px);
max-width:1240px;
padding:0px 20px;
margin:0px auto;	
}


.czat-admin-top{
background:#fff;
padding:32px 0px;
margin-bottom:35px;
}

.czat-admin-top h1{
font-size:30px;
font-weight:600;
color:#2d304e;
line-height:normal;	
}


.czat-admin-block{
display:flex;
justify-content:space-between;
align-items:stretch;
flex-wrap:wrap;
margin-bottom:60px;
}

.czat-admin-block-left{
width:400px;
overflow-y:auto;
background:#fff;
}

.czat-admin-block-right{
width:calc(100% - 415px);
}

.czat-admin-block-right-content{
display:flex;
justify-content:flex-start;
align-items:flex-start;
flex-wrap:nowrap;
flex-direction:column;
background:#fff;
}

.czat-admin-block-right-content-blank{
width:100%;
height:900px;
}

.czat-admin-block-left-top{
padding:15px;
}

.czat-admin-block-left-top-content{
display:flex;
justify-content:flex-end;
align-items:center;
flex-wrap:nowrap;
}


.czat-admin-block-left-top-content-satus{
margin-right:20px;
}

.satus-red{
color:red;
}

.satus-green{
color:green;
}

.czat-admin-block-left-top-content-trash{
display:flex;
justify-content:flex-start;
align-items:center;
flex-wrap:nowrap;
}

.czat-admin-block-left-top-content-trash img{
margin-right:10px;
}

.czat-admin-block-left-top-content-trash span{
font-size:14px;
font-weight:400;
color:#2d304e;
line-height:22px;
}

.czat-admin-block-left-info{
padding:15px;
background:#fafbfb;	
}

.czat-admin-block-left-info-item{
display:inline-block;
vertical-align:middle;
padding:5px 15px;
background:#ffe3b1;	
font-size:14px;
font-weight:400;
color:#2d304e;
line-height:normal;
}

.czat-admin-block-left-header{
border-top:1px solid #e5eaea;
padding:10px 15px;
background:#fff;
font-size:14px;
font-weight:500;
color:#2d304e;
line-height:normal;
text-transform:uppercase;
}

.czat-admin-block-left-list{
background:#fafbfb;
}

.czat-admin-block-left-list-item{
display:flex;
justify-content:space-between;
align-items:center;
flex-wrap:nowrap;
background:#fafbfb;
border-top:1px solid #e5eaea;
-webkit-transition: 0.4s;
-moz-transition: 0.4s;
-o-transition: 0.4s;
transition: 0.4s;
}

.czat-admin-block-left-list-item:hover{
background:#ffe3b1;	
}


.czat-admin-block-left-list-item-left{
margin:15px;
display:flex;
justify-content:flex-start;
align-items:center;
flex-wrap:nowrap;
}

.czat-admin-block-left-list-item-left img{
margin-right:15px;
}

.czat-admin-block-left-list-item-left-text{
font-size:14px;
font-weight:400;
color:#2d304e;
line-height:normal;	
}

.czat-admin-block-left-list-item-right{
font-size:14px;
font-weight:400;
color:#2d304e;
line-height:normal;	
margin-right:15px;
text-align:right;	
}

.czat-admin-block-left-list-empty{
padding:15px;
text-align:center;
border-top:1px solid #e5eaea;
}

.czat-admin-block-left-list-empty img{
display:inline-block;
vertical-align:middle;
margin: 0px 5px;
}

.czat-admin-block-left-list-empty span{
font-size:14px;
font-weight:500;
color:#2d304e;
line-height:normal;	
}

.czat-admin-block-right-delete{
background:#fff;
padding:12px 22px;
border-bottom:7px solid #f2f4f5;
width:calc(100% - 44px);
}

.czat-admin-block-right-delete-content{
display:flex;
justify-content:flex-end;
align-items:center;
flex-wrap:nowrap;
}

.czat-admin-block-right-product{
background:#fff;
padding:15px 22px;
border-bottom:7px solid #f2f4f5;
width:calc(100% - 44px);
}

.czat-admin-block-right-product-content{
display:flex;
justify-content:flex-start;
align-items:center;
flex-wrap:nowrap;
}

.czat-admin-block-right-product-content-image{
width:46px;
height:41px;
border:1px solid #ecf0f1;
}

.czat-admin-block-right-product-content-image img{
width:100%;
height:100%;
object-position:center;
object-fit:contain;
}

.czat-admin-block-right-product-content-text{
padding-left:16px;
font-size:14px;
font-weight:400;
color:#2d304e;
line-height:18px;	
}

.czat-admin-block-right-coment{
height:804px;
width:100%;
overflow-y:auto;
background:#fafbfb;
}

.czat-admin-block-right-coment-p{
padding:15px 22px;
}



.czat-admin-block-right-coment-p-text-a{
width:70%;
margin-bottom:20px;
}

.czat-admin-block-right-coment-p-text-a-con{
border-radius:4px;
padding:10px;
background:#f2f4f5;
font-size:14px;
font-weight:400;
line-height:18px;
color:#4b4b4b;
}

.czat-admin-block-right-coment-p-text-data-a{
font-size:12px;
font-weight:400;
line-height:18px;
color:#4b4b4b;
padding-top:10px;  
}

.czat-admin-block-right-coment-p-text-b{
width:70%;
padding-left:30%;
margin-bottom:20px;
}

.czat-admin-block-right-coment-p-text-b-con{
border-radius:4px;
padding:10px;
background:#ceddff;
font-size:14px;
font-weight:400;
line-height:18px;
color:#4b4b4b;
}

.czat-admin-block-right-coment-p-text-data-b{
font-size:12px;
font-weight:400;
line-height:18px;
color:#4b4b4b;
padding-top:10px;
text-align:right; 
}

.czat-admin-block-right-coment-p-line-data{
padding:30px 0px 10px 0px;
position:relative;
text-align:center;
}

.czat-admin-block-right-coment-p-line-data::before{
content:'';
position:absolute;
top:13px;
left:0px;
width:100%;
height:1px;
background:#e3e8e9;
z-index:0;
}

.czat-admin-block-right-coment-p-line-data-text{
position:absolute;
top:0px;
left:50%;
width:100px;
text-align:center;
background:#fafbfb;
font-size:12px;
font-weight:500;
line-height:normal;
color:#2d304e;
margin-left:-50px;
z-index:1;
}

#czat-admin-block-right-text-down-form{
width:100%;
}

.czat-admin-block-right-text-down{
padding:20px 22px 15px 22px;
width:calc(100% - 44px);
}

.czat-admin-block-right-text-down-content{
display:flex;
justify-content:space-between;
align-items:center;
flex-wrap:nowrap;
}

.czat-admin-block-right-text-down-content-block{
position:relative;
width:calc(100% - 30px);
}

.czat-admin-block-right-text-down-content-block::after{
content:attr(data-textarea-value) " ";
white-space:pre-wrap;
visibility:hidden;
overflow-wrap:break-word;
word-break:break-word;
max-height:130px;
width:100%;
line-height:normal;
font-size:14px;
font-weight:400;
color:#4b4b4b;
padding:0px 0px;
overflow:hidden;
display:block;
}

.czat-admin-block-right-text-down-content-textarea{
position:absolute;
top:0px;
left:0px;
height:100%;
outline:none;
line-height:normal;
font-size:14px;
font-weight:400;
color:#4b4b4b;
padding:0px 0px;
margin:0px;
border:0px;
width:100%;
resize:none;
overflow:hidden; 
}

.czat-admin-block-right-text-down-content-textarea::-webkit-input-placeholder{ 
color:#4b4b4b;
opacity:1;
}
.czat-admin-block-right-text-down-content-textarea::-moz-placeholder{
color:#4b4b4b;
opacity:1;
}
.czat-admin-block-right-text-down-content-textarea:-ms-input-placeholder{
color:#4b4b4b;
opacity:1;
}
.czat-admin-block-right-text-down-content-textarea:-moz-placeholder{
color:#4b4b4b;
opacity:1;
}

.czat-admin-block-right-text-down-content-send{
width:25px;
height:25px;
background:url('../images/send.png') no-repeat center center;
background-size:100% 100%;
cursor:pointer;
border:0px;
margin:0px;
padding:0px;
}

.czat-window-took{
display:none;
}

.czat-window-form{
padding:20px 24px;
}

.czat-window-form-input{
border:1px solid #e5eaea;
width:calc(100% - 12px);
padding:6px 5px;
margin:0px 0px 10px 0px;
outline:none;
display:block;
}

.czat-window-form-input-send{
background:#2d304e;
text-align:center;
padding:12px 14px;
font-size:16px;
font-weight:400;
line-height:normal;
cursor:pointer;
color:#fff;
}