/* Common
-----------------------------------------------------------------------------*/
* {margin: 0;padding: 0;}
html {height: 100%;font-size: 16px;}
article, aside, details, figcaption, figure, footer, header, hgroup, main, nav, section, summary {display: block;}

body {font-family: 'Source Sans Pro', sans-serif;font-weight: 400;height: 100%;background: url(../images/bg_pattern.png) left top #ededed ;}
@media(max-width: 767px){
   body {
       background: #fff;
   }
}

a {color: #2032ae;outline: none !important;}
p {margin: 0 0 18px;}
strong {letter-spacing: 1px;}
.table {color: #727272;}

.container-1700 {max-width: 1700px;width: 100%;padding: 0 15px;margin: 0 auto;}

/* Headers */
h1 {font-weight: 300;font-size: 3rem;line-height: 1.1em;margin: 0 0 2rem;}
h2 {font-size: 2.5rem;line-height: 1.1em;margin: 0 0 20px;font-weight: 700;}
@media (max-width: 991px){
    h1 {font-size: 2.25rem;}
    h2 {font-size: 2rem;}
}

/* Badges */
.badge-default {background: #bbbbbb}
.badge-info {background: #009fff;}
.badge-danger {background: #ff6161;}
.badge-success {background: #7ac943;}
.badge-warning {background: #ff8562;}

/* Alert */
.alert-info {color: #333;border-color: rgba(63, 169, 245, .25);background-color: rgba(63, 169, 245, .25);}

/* Accordion */
.accordion .card-header .btn {width: 100%;display: block;text-align: left;color: #333;text-decoration: underline;}

/*Buttons*/
.btn {padding: .5rem 2rem;border-radius: .25rem;font-size: 1rem;}
.btn:hover {color: #333;}
.btn:focus {box-shadow: none !important;}
.btn-sm {padding: .35rem 1rem;font-size: .875rem;}
.btn-lg {font-size: 1.125rem;padding: .75rem 3rem;}

.btn-plus {background-image: url(/images/icons/icon_plus_round.svg);background-size: 24px auto;background-repeat: no-repeat;background-position: left .5rem center;padding-left: 2.5rem;}

.btn-warning {background-color: #ff8562;border-color: #ff8562;color: #fff;}
.btn-warning:hover {color: #000;border-color: #ff8562;background-color: #ff8562;}

.btn-primary {color: #fff;border-color: #2032ae;background-color: #2032ae;}
.btn-primary:hover {color: #2032ae;border-color: #2032ae;background-color: transparent;}
.btn-outline-primary {color: #2032ae;border-color: #2032ae;background-color: transparent;}
.btn-outline-primary:hover {color: #fff;border-color: #2032ae;background-color: #2032ae;}
.btn-danger {color: #fff;background-color: #ff6161;border-color: #ff6161;}
.btn-success, .btn-success:hover {background-color: #7ac943;border-color: #7ac943;}
.btn-success:hover {color: #333;}
.btn-link {color: #2032ae;}

/* Form */
.form-control {color: #999;font-size: .875rem;background: #f2f2f2;border-radius: .25rem;border: 0;}
.form-control:focus {box-shadow: none;background: #f2f2f2;}
.input-group {margin-bottom: .5rem;}
.input-group-append .btn {background: #f2f2f2;padding: .25rem .75rem;}
.form-controls {margin-top: 3rem;}
form label {font-size: .875rem;margin-bottom: 0.25rem;}


/* Loader */
.loader {display: none;}
.loading .loader {display: flex;width: 100%; height: 100%;position: absolute;left: 0;top: 0;background: rgba(255,255,255,.8);z-index: 999; align-items: center;justify-content: center;}


/* Balloons*/
.balloons .owl-item {padding: 0 15px;}
.balloons .item .text {color: #fff;background: rgba(41, 171, 226, .8);font-size: 1.125rem;padding: 1rem 2rem 2rem;border-radius: 20px;background-size: 100% auto;position: relative;margin-bottom: 2rem;}
.balloons .item .text:after {position: absolute;bottom: -22px;left: 55%;content: "";width: 30px;height: 25px;background: url(../images_OLD/media/baloon_corner.png) center center no-repeat;}
.balloons .item .text a {text-decoration: underline;color: #fff;}
.balloons .item .text a:hover {text-decoration: none;}
.balloons .item .name {text-align: center;font-size: 1.5rem;line-height: 1.2;}


/* wrapper
-----------------------------------------------------------------------------*/
.wrapper {width: 100%;height: 100%;}
.wrapper-left {position: fixed;}

@media(min-width: 768px) {
    .wrapper {
        overflow: hidden;
    }
}


/* Header
-----------------------------------------------------------------------------*/
header {margin: 1rem 1rem .5rem 0;max-width: 1140px;}
header .dropdown-toggle {background: url(/images/icons/icon_user.svg) left center no-repeat;background-size: 18px auto;padding-left: 1.5rem;font-size: .875rem;}
header .dropdown .dropdown-item {color: #29abe2;font-size: .875rem;}

header .help {margin: 2rem auto 0;padding: 1.25rem;background: url(/images/media/okibot_half.png) right top no-repeat #ff8562;background-size: 200px auto; color: #fff;border-radius: 1rem;}
header .help .title {margin-bottom: 1rem;font-weight: 600;line-height: 1.2;font-size: 1rem;}
header .help .text {font-size: .875rem;margin-bottom: 1rem;}
header .help ul {list-style-type: none;}
header .help ul a {color: #fff;text-decoration: underline;}

@media(max-width: 767px){
    header {margin:  0;}
    header .navbar {padding: 1.5rem 1rem;border-bottom: 1px solid rgba(0, 0, 0, .1);}
    header .navbar .navbar-nav {margin-top: 1rem;}
    header .navbar .nav-link {color: #000;background-position: left .75rem center;background-repeat: no-repeat;background-size: auto 16px;padding: .5rem 2rem .5rem 2.5rem;}
}

/* Sidebar
-----------------------------------------------------------------------------*/
.sidebar {height: 100%;}
.sidebar .part {display: flex;justify-content: end;}
.sidebar .inner {padding: 2rem 2rem 1rem;width: 320px;border-bottom: 1px solid rgba(0, 0, 0, .1);}


/* Top */
.sidebar .sidebar-top {}
.sidebar-top .inner {text-align: center;}
.sidebar .sidebar-top img {margin-bottom: 1.25rem;}
.sidebar .sidebar-top .btn i {margin-right: 1rem;}
.sidebar .sidebar-center {}
.sidebar .sidebar-center .inner {overflow-y: scroll;}

.sidebar .sidebar-center .help {margin: 2rem auto 0;max-width: 200px;padding: 1.25rem;background:  #2032ae;background-size: 200px auto; color: #fff;border-radius: .25rem;}
.sidebar .sidebar-center .help .title {margin-bottom: 1rem;font-weight: 600;line-height: 1.2;font-size: 1rem;}
.sidebar .sidebar-center .help .text {font-size: .875rem;margin-bottom: 1rem;}
.sidebar .sidebar-center .help ul {list-style-type: none;}
.sidebar .sidebar-center .help ul a {color: #fff;text-decoration: underline;}

    /* Nav */
.sidebar .sidebar-center nav {max-width: 200px;margin: 0 auto;}
.sidebar .sidebar-center nav .nav-link {color: #000;background-position: left .75rem center;background-repeat: no-repeat;background-size: auto 16px;padding: .5rem 2rem .5rem 2.5rem;border-radius: .25rem;}
.sidebar .sidebar-center nav .nav-link.active {background-color: rgba(0, 0, 0, .1);}
.sidebar .sidebar-center nav .nav-link.active:hover {text-decoration: none;}
.sidebar .sidebar-center nav .nav-link:hover {text-decoration: underline;}

nav .nav-link.nav-bots {background-image: url(/images/icons/icon_bot.svg);}
nav .nav-link.nav-dialogs {background-image: url(/images/icons/icon_dialog.svg);}
nav .nav-link.nav-clients {background-image: url(/images/icons/icon_clients.svg);}
nav .nav-link.nav-orders {background-image: url(/images/icons/icon_order.svg);}
nav .nav-link.nav-sender {background-image: url(/images/icons/icon_chat_black.svg);}
nav .nav-link.nav-blog {background-image: url(/images/icons/icon_blog.svg);}
nav .nav-link.nav-help {background-image: url(/images/icons/icon_help_black.svg);}
nav .nav-link.nav-feed {background-image: url(/images/icons/icon_news.svg);}

@media (max-width: 767px){
    .sidebar .sidebar-top {padding-left: 1rem;padding-right: 1rem;}
}


/* Filter */
.filter {margin-bottom: 3rem;}
.filter .form-control {background: transparent;border: 0;border-radius: 0;border-bottom: 1px solid #FF671D;}
.filter .input-group {margin-bottom: 0;}
.filter .input-group .form-control {margin-right: .5rem;}
.filter .input-group .form-control:last-child {margin-right: 0;}
.filter .btn-link {padding-left: .5rem;padding-right: .5rem;}
.filter .btn-link i {color: #000;}


/* Pagination */
.pagination {justify-content: center;margin-top: 3rem;}
.pagination .page-link {color: #2032ae;}
.pagination .page-item.active .page-link {background-color: #2032ae;border-color: #2032ae;}



/* Content
-----------------------------------------------------------------------------*/
.content {margin: 0 1rem 0 0;max-width: 1140px;}
.content .page {background: #fff;padding: 2rem 2rem;border-radius: .25rem;box-shadow: 0 0 10px rgba(0,0,0,.1);}
.content .page .page-controls {text-align: right;margin-bottom: 1rem;}
.content .page .page-top {display: flex;align-items: center;
    margin-bottom: 2rem;}
.content .page .page-top h1 {
    margin-bottom: 0;
}
.content .page .page-description {margin: 0 auto;/*font-size: 1.125rem;*/font-weight: 300;margin-bottom: 2rem;}

@media(min-width: 768px){
    .content {overflow: hidden;}
    .content .page .page-content {
        overflow-y: scroll;
        padding-right: 1rem;
        padding-top: .5rem;
    }
}
@media(max-width: 767px){
    .content {margin: 0; padding: 0 1rem;}
    .content .page {padding: 2rem 0;box-shadow: none;}
}
@media(max-width: 575px) {
    .content .page .page-top {display: block;}
}


/* Chat
-----------------------------------------------------------------------------*/
.chat {overflow-y: scroll;padding-right: 1rem;max-height: 600px;}
.chat .datetime {font-size: .75em;}

.chat .message {margin-bottom: 1.5rem;}
.chat .message .inner {min-height: 50px;position: relative;width: 100%;display: inline-block;max-width: 400px; border-radius: 1rem;padding: 1rem;}
.chat .message .inner .top {display: flex;justify-content: space-between;padding-right: 1rem;}
.chat .message .inner .top .date {font-size: .75rem;}
.chat .message .inner .text {font-size: .875rem;padding: 1rem;}
.chat .message .inner .top .bot {padding-left: 1.5rem;}
.chat .message .inner .top .bot.bot-telegram {background-image: url(/images/icons/icon_tg_white.svg);background-size: auto 14px;}

.chat .question {text-align: right;margin: 1rem 0 1.5rem;z-index: 2;position: relative;}
.chat .question .inner {color: #fff;background: #2032ae;text-align: left;}
.chat .question .inner:before {display: inline-block;width: 0;height: 0;border-style: solid;border-width: 0 17px 17px 0;border-color: transparent #2032ae transparent transparent;position: absolute;right: 2rem;bottom: -17px;content: "";}
.chat .question .inner .top .bot {padding-top: 5px;font-size: .75rem;padding-left: 2rem;}
.chat .question .inner .text {}

.chat .answer {}
.chat .answer .inner{text-align: left;color: #000;background: #f2f2f2;}
.chat .answer .inner:before {display: inline-block;width: 0;height: 0;border-style: solid; border-width: 17px 17px 0 0;border-color: #f2f2f2 transparent transparent transparent;width: 0;height: 0;position: absolute;left: 2rem; bottom: -17px;content: "";}
.chat .answer .inner .top .username {color: rgba(0, 0, 0, .6); background: url(/images/icons/icon_user_grey_1.svg) left center no-repeat; color: #2032ae;background-size: 12px auto;padding-left: 1rem;}
.chat .answer .inner .text{color: rgba(0, 0, 0, .6);}
.chat .username {font-size: .875rem;color: #555;}



/* List common
-----------------------------------------------------------------------------*/
.list .item > .row {align-items: center;}

.list .item .username {flex: auto;display: flex;text-decoration: none;: flex;align-items: center;}
.list .item .username span {line-height: 25px;box-shadow: 0 0 1px rgba(0, 0, 0, .5);border-radius: 50%;margin-right: .35rem;border: 3px solid #fff;width: 41px;display: inline-block;height: 41px;color: #fff;text-align: center;padding: .25rem 0;font-size: 1.375rem;font-weight: 600;}
.list .item .username-1 span {background: #ff8562;}
.list .item .username-2 span {background: #ff6161;}
.list .item .username-3 span {background: #9ca6ff;}
.list .item .username-4 span {background: #d19cff;}
.list .item .username-5 span {background: #61a3ff;}

.list .item .date {display: inline-block;color: #000;font-size: .875rem;}
.list .item .time {display: inline-block;color: rgba(0, 0, 0, .5);font-size: .875rem;}
.list .item .name {font-size: 1rem;font-weight: 600;}

.list .item .bot {background-size: 24px auto;   line-height: 1.2;color: #000;font-size: .875rem;font-weight: 400;padding-top: .3rem;padding-left: 2rem;}

/* Detail common
-----------------------------------------------------------------------------*/
.show .part {border-radius: 1rem;padding: 1.5rem;}
.show .part h5 {font-weight: 600;font-size: 1.125rem;margin-bottom: 1rem;}
.show .part h5 span {font-weight: 300;}
.show .part .btn-link {font-size: .875rem;padding: 0;}
.show .part .not-found {font-size: .875rem;}
.show .part .inner {max-height: 300px;overflow-y: scroll; padding-right: 1rem;}

/* Data */
.show .data {min-height: 300px;background: #fafafa;}
.show .data .bot {margin-bottom: 1rem;font-size: .875rem;padding-top: 2px;font-weight: normal;padding-left: 1.5rem;background-size: 20px auto;}
.show .data .table {font-size: .875rem;color: #000;}
.show .data .table tr:first-child td {border-top: none;}
.show .data .table tr td {padding: .25rem;}
.show .data .table tr td:first-child {font-weight: 600;}

.show .user {margin-bottom: .5rem;}
.show .user .top {display: flex;align-items: center;margin-bottom: .5rem;}
.show .user .top .avatar {box-shadow: 0 0 1px 1px rgba(0, 0, 0, .2);background: #ff8562;align-items: center;justify-content: center;border-radius: 50%;margin-right: 2rem;border: 3px solid #fff;width: 4rem;display: flex;height: 4rem;color: #fff;text-align: center;font-size: 1.5rem;font-weight: 600;}
.show .user .top .name {font-weight: 600;font-size: 1.125rem;}
.show .user .top .datetime {font-size: .875rem;color: rgba(0, 0, 0, .5);}
.show .user .info {padding-left: 6.5rem;font-size: .875rem;font-weight: normal;position: relative;padding-bottom: 2rem;}
.show .user .info:before {content: "";position: absolute;left: 36px;top: 0;width: 1px;height: 100%;background: rgba(0, 0, 0, .1);}

@media(max-width: 991px) {
    .show .user .info:before {display: none;}
    .show .user .info {padding-left: 2rem;}
}


/* Bots
-----------------------------------------------------------------------------*/
.bots .page-header {margin-bottom: 2rem;}

.bot {font-weight: 600;background-size: 28px auto;background-position: left center;background-repeat: no-repeat;display: block;padding-left: 3rem;min-height: 28px;}
.bot.bot-telegram {background-image: url(/images/icons/icon_tg_blue.svg);}

/* Page demo*/
.welcome .page {}
.welcome .page section {font-weight: 300;}
.welcome .page .description {margin-bottom: 2rem;}

/*Bots page top*/
.bots:not(.list) .page-top {margin-bottom: 1rem;}
.bots:not(.list) h1 {font-weight: 600;font-size: 1.375rem;margin-bottom: 0;}
.bots .page-top .btn-link {padding: .5rem;margin-right: .5rem;}


/* Bot navbar */
.bot-navbar {padding: 0;display: flex;}
.bot-navbar .navbar-nav {flex-direction: row;flex-wrap: wrap;background: rgba(0, 0, 0, .1);border: 1px solid rgba(0, 0, 0, .1);padding: .15rem 0;width: 100%;}
.bot-navbar .navbar-nav .nav-link {margin: 0 .25rem;border-radius: 1rem;padding: .25rem .75rem;color: #000;border: 1px solid transparent;}
.bot-navbar .navbar-nav .nav-link:hover {background: rgba(0, 0, 0, .15);border: 1px solid rgba(0, 0, 0, .05);}
.bot-navbar .navbar-nav .nav-link.active {color: #fff;background: #29ABE2;border: 1px solid rgba(0, 0, 0, .05);}

.bot-navbar .bot-settings {padding-left: 2rem;display: flex;align-items: center;}
.bot-navbar .bot-settings a {margin-right: 1rem;}
.bot-navbar .bot-settings a:last-child {margin-right: 0;}

@media(max-width: 991px){
    .bot-navbar .bot-settings {
        padding-left: 0;
        margin-top: 1rem;
    }
}

.bots .indicator {margin-right: .25rem;display: inline-block;height: 8px;width: 20px;border-radius: 4px;}
.bots .date {color: rgba(0, 0, 0, .5);}


/* List
------------------------*/
.bots.list .item {border: 1px solid #e6e6e6;margin-bottom: 1rem;border-radius: 1rem;padding: 1rem 2rem;}
.bots.list .item .welcome-text {padding-left: 2rem;background: url(/images/icons/icon_quote.svg) left center no-repeat;background-size: 14px auto;font-size: .875rem;font-weight: 300;line-height: 1.2;color: rgba(0, 0, 0, .6);}
.bots.list .item .controls a {margin-right: .5rem;}
.bots.list .item .controls img {height: 24px;width: auto;}
.bots.list .item .bot {padding-left: 2.5rem;background-size: 28px auto;}

@media(max-width: 767px){
    .page-bots .bots {overflow-x: scroll;}
}

/* Show
------------------------*/
.bots.show .details {margin-bottom: 3rem;}
.bots.show .details .name {font-size: 2.25rem;margin-bottom: 1.5rem;font-weight: 300;
    line-height: 1.2;}
.bots.show .details .welcome-text {font-weight: 300;background: url('/images/icons/icon_quote.svg') left 1rem top .5rem no-repeat #f2f2f2;background-size: 14px auto ;padding: 1rem 3rem;border-radius: 1rem;margin-bottom: 2rem;}
.bots.show .details table {width: 100%;margin-bottom: 1rem;   }
.bots.show .details table tr td {padding: .25rem;}
.bots.show .details table tr td:first-child {padding-left: 0;font-weight: 700;}
.bots.show .details table tr td:last-child {font-weight: 300;}

.bots.show .control-panel .item-wrapper {display: flex;align-items: stretch;}
.bots.show .control-panel .item {cursor: pointer;margin: 0 0 2rem;flex: auto;overflow: hidden;display: flex;align-items: stretch;border-radius: 1rem;box-shadow: 0 0 15px rgba(0, 0, 0, .2);}
.bots.show .control-panel .item .img {flex: 0 0 auto;background-size: cover;background-position: center;background-repeat: no-repeat;: #b3b3b3;width: 90px;min-height: 150px;}
.bots.show .control-panel .item.constructor .img {background-image: url(/images/media/students.jpg);}
.bots.show .control-panel .item.dialogs .img {background-image: url(/images/media/shoes.jpg);}
.bots.show .control-panel .item.clients .img {background-image: url(/images/media/people.jpg);}
.bots.show .control-panel .item.orders .img {background-image: url(/images/media/orders.jpg);}
.bots.show .control-panel .item .info {max-width: 70%; word-break: break-word;flex: 0 0 auto;padding: 2rem;display: flex;align-items: center;}
.bots.show .control-panel .item .info .title {margin-bottom: 1rem;font-weight: 600;font-size: 1.125rem;line-height: 1.2;}
.bots.show .control-panel .item .info .description {line-height: 1.2;font-weight: 300;}

.bots.show .payments .btn-primary {background-image: url(/images/icons/icon_card_white.svg);background-repeat: no-repeat;background-position: left .5rem center;background-size: 24px auto;padding-left: 2.5rem;}
.bots.show .payments .btn-primary:hover {}

@media(max-width: 575px){
    .bots.show .details .name {font-size: 1.75rem;}

    .bots.show .payments .btn-primary {
        margin-top: 1rem;
    }
}

/* Edit
 ------------------------*/
.bots .edit {}
.bots .edit .lead {font-weight: 600;margin-bottom: 2rem;}


/* Page payment
------------------------*/
.page-payment {}
.page-payment .result {border-top: 1px solid #eee;border-bottom: 1px solid #eee;margin: 0 -1rem 1rem;padding: 1rem 1rem 0;}
.page-payment .result label {margin-bottom: 0;}
.page-payment .result .value {font-weight: bold;font-size: 1.5rem;color: #ff8562;}
.page-payment .result .value span {font-size: 1.25rem;}
.page-payment form {max-width: 450px;}
.page-payment form .btn {width: 100%;}

.page-payment .history {border-radius: 1rem;background: #f2f2f2;padding: 2rem;margin-top: 3rem;}
.page-payment .history .table {font-size: .875rem;color: #000;}
.page-payment .history h5 {font-weight: 600;font-size: 1.375rem;margin-bottom: 1.5rem;}



[v-cloak]{display: none;}


/* Page shop-edit
------------------------*/
.shop-edit .card {border: none;}
.shop-edit .card .card-header {background-color: transparent;padding-left: 0;}
.shop-edit .card:last-child .card-header {border-bottom: none;}


/* Bot menu
------------------------*/
.bot-menu .page-content {position: relative;}
.bot-menu .page #app_menu {position: absolute;left: 0;top: 0;width: 100%;height: 100%; border-radius: 1rem;border: 1px solid rgba(0, 0, 0, .15);background: #fff;width: 100%;position: relative;overflow: hidden;}
.bot-menu .page #app_menu .tools {padding: .15rem;background: rgba(0, 0, 0, .1);border: 1px solid rgba(0, 0, 0, .15);border-radius: 2rem;position: absolute;z-index: 9999;right: 20px;bottom: 20px;}
.bot-menu .page #app_menu .tools .btn {margin-bottom: .25rem;background: #fff;border-radius: 50%;border: 1px solid rgba(0, 0, 0, .15);padding: .4rem;background: #fff;}
.bot-menu .page #app_menu .tools .btn:last-child {margin-bottom: 0;}
.bot-menu .page #app_menu .tools .btn:hover {background: #333;color: #fff;}
.bot-menu .page #app_menu .modal textarea {font-size: .875rem;height: 120px;}
.bot-menu .page #app_menu .modal .form-check-label {display:flex;align-items: center;}
.bot-menu .page #app_menu .modal .form-check-label * {margin-left: .15rem;}
.bot-menu .page #app_menu .modal .form-check-label input {margin-right: .25rem;}
.bot-menu .page #app_menu .modal .files-list {margin-bottom: 1rem;}
.bot-menu .page #app_menu .modal .file-wrapper {display: inline-block;margin-right: 1rem;}
.bot-menu .page #app_menu .modal .file-wrapper a {margin-right: .5rem;}
.bot-menu .page #app_menu .modal .file-wrapper button {border: 0;background: transparent;}

.bot-menu .page #app_menu.expanded {border-radius: 0;position: fixed;top: 0;left: 0;width: 100%;height: 100% !important;z-index: 9999;}
.bot-menu .page #app_menu .codes span{cursor: pointer;border-bottom: 1px dotted;}




/* Dialogs
-----------------------------------------------------------------------------*/

/* List
------------------------*/
.dialogs .list .item {line-height: 1.2;font-size: .875rem;position: relative;padding: 2rem;background: #f2f2f2;border-radius: 1rem;margin-bottom: 2rem;}
.dialogs .list .item:after {position: absolute;left: 2rem;bottom: -20px;content: "";display: block;width: 0;height: 0;border-style: solid;border-width: 20px 20px 0 0;border-color: #f2f2f2 transparent transparent transparent;}

.dialogs .list .item .username {font-weight: 600;font-size: 1rem;}
.dialogs .list .item .client {background: url(/images/icons/icon_user_grey_1.svg) left center no-repeat;padding-left: 1.5rem;background-size: auto 18px;}
.dialogs .list .btn-light {text-transform: none;border: 2px solid #237f8e;border-radius: .5rem;}
.dialogs .list .item .messages {line-height: 30px;display: inline-block;background: url(/images/icons/icon_dialog_grey.svg) left center no-repeat;background-size: 28px auto;padding-left: 33px;padding-bottom: 5px;margin-right: auto;}

@media(max-width: 767px) {
    .dialogs .list .item .name {
        margin: .5rem 0;
    }

}
@media(max-width: 575px) {
    .dialogs .list .item .messages {
        margin-bottom: 2rem;}
}


/* Show
------------------------*/
.dialogs.show .detail {margin-bottom: 3rem;display: flex;align-items: center;justify-content: space-between;}
.dialogs.show .detail .name {font-size: 2.25rem;font-weight: 300;}
.dialogs.show .detail .user {display: flex;align-items: center;}
.dialogs.show .detail .user:before {margin-right: .75rem;content: "";display: block;width: 45px;height: 45px;border-radius: 50%;background: url(/images/icons/icon_user_white.svg) center center #ff8562 no-repeat;background-size: 15px auto;}
.dialogs.show .detail .messages-count {display: inline-block;background: url(/images/icons/icon_dialog_grey.svg) left center no-repeat;background-size: 28px auto;padding-left: 33px;padding-bottom: 5px;}
.dialogs.show .detail .btn-link {color: #ff6161;}

.dialogs.show .data {background: #fafafa;border-radius: 1rem;padding: 1.5rem;}
.dialogs.show .data h5 {font-weight: 600;font-size: 1.125rem;margin-bottom: 1rem;}
.dialogs.show .data .table {color: #000;}
.dialogs.show .data .table tr:first-child td {border-top: none;}
.dialogs.show .data .table tr td {padding: .25rem;}
.dialogs.show .data .table tr td:first-child {font-weight: 600;}

@media(max-width: 575px) {
    .dialogs.show .detail {display: block;}
}

/* Clients
-----------------------------------------------------------------------------*/

/* List
------------------------*/
.clients .list .item {padding: 1.5rem 1rem;border-bottom: 1px solid rgba(0, 0, 0, .1);}
.clients .list .item:hover {background: #f2f2f2;}

@media(max-width: 765px){
    .clients .list .item .bot {margin-left: .5rem;}
}
@media(max-width: 575px) {
    .clients .list .item .date, .clients .list .item .bot {margin-left: 3rem;}
}

/* Detail
------------------------*/
.clients.show .user .info a {margin-bottom: .25rem;}

/* Orders */
.clients.show .orders {padding-left: 0;padding-right: 0;}
.clients.show .orders .item {margin-bottom: 1rem;border-radius: 1rem;padding: 1.5rem 2rem;border: 1px solid rgba(0, 0, 0, .1);}
.clients.show .orders .item .datetime {font-size: .875rem;}
.clients.show .orders .item .datetime .date {display: inline-block;color: #000;}
.clients.show .orders .item .datetime .time {display: inline-block;color: rgba(0, 0, 0, .5);}
.clients.show .orders .item .name {font-weight: 600;margin-bottom: .75rem;}
.clients.show .orders .item .product {font-weight: 600;margin-bottom: .5rem;}
.clients.show .orders .item .price {font-weight: 600;}
.clients.show .orders .item .bot {margin-bottom: .5rem;padding-left: 2rem;background-size: 24px auto;font-weight: normal;color: #000;font-size: .875rem;}
.clients.show .orders .item .status {font-size: .875rem;margin-bottom: .75rem;}

/* Dialogs */
.clients.show .dialogs {padding-left: 0;padding-right: 0;}
.clients.show .dialogs .item {font-size: .875rem;position: relative;background: #f2f2f2;padding: 1rem;border-radius: 1rem;margin-bottom: 2rem;}
.clients.show .dialogs .item:after {position: absolute;left: 2rem;bottom: -20px;content: "";display: block;width: 0;height: 0;border-style: solid;border-width: 20px 20px 0 0;border-color: #f2f2f2 transparent transparent transparent;}
.clients.show .dialogs .item .name {margin-bottom: .5rem;font-weight: 600;}
.clients.show .dialogs .item .datetime {margin-bottom: 1rem;}


/* Orders
-----------------------------------------------------------------------------*/


/* List
------------------------*/
.orders .list .item {font-size: .875rem;padding: 1.5rem 1rem;border-bottom: 1px solid rgba(0, 0, 0, .1);}
.orders .list .item:hover {background: #f2f2f2;}
.orders .list .item .product {font-weight: 600;}
.orders .list .item .price {font-weight: 600;}



/* Detail */
.orders.show .user table {width: 100%;}
.orders.show .user .table td {border: none;padding: 0;color: #000;}
.orders.show .user .table td:first-child {font-weight: 600;}



/* Send message
-----------------------------------------------------------------------------*/
.send_messages h1 {margin-bottom: 0;}
.send_messages .page-header {margin-bottom: 3rem;}
.send_messages .item {font-size: .875rem;border-bottom: 1px solid rgba(0, 0, 0, .1);padding: 1rem 0;}
.send_messages .indicator {margin-right: .25rem;display: inline-block;height: 8px;width: 20px;border-radius: 4px;}
.send_messages .text {color: rgba(0, 0, 0, .6);padding-left: 2rem;background: url(/images/icons/icon_quote.svg) left center no-repeat;background-size: auto;background-size: 14px auto;font-size: .875rem;}


@media(max-width: 575px) {
    .send_messages h1 {margin-bottom: 1rem;}
}


/* News feed
-----------------------------------------------------------------------------*/
.news-feed .page-top {
    justify-content: space-between;
}

.news-feed .list .item .rss-link {
    background: url(/images/icons/icon_rss_orange.svg) left center no-repeat;
    background-size: 24px auto;
    padding-left: 2rem;
}

.news-feed .news.list .item .status {
    font-size: .875rem;
}

.news-feed .news.list .item .description {
    font-size: .875rem;
    color: rgba(0, 0, 0, .5);
    margin: 1rem 0;
}


/* Footer
-----------------------------------------------------------------------------*/
.footer {font-size: .875rem;padding: 1rem 0;color: rgba(0, 0, 0, .4);}