.msg_control .hidden{ display:none; }
.msg_control .ion { font-size: 22px; vertical-align: middle; }
.msg_control .checkall-wrap { width: 38px; }
.msg_control .checkall-wrap .layui-form-checkbox { position: absolute; top: 6px; left: 10px; }
.msg_control .msg-btn-readall { margin-left: 5px !important; }
.msg-type .layui-btn-group .layui-btn{
  display: inline-block;
  border: 1px solid #eeeeee;
  background-color: #FFFFFF !important;
  color: #838383;
  min-width: 80px;
}
.msg-type .layui-btn-group .layui-btn.checked{
  border: 1px solid var(--secondary-color-light);
  background-color: var(--secondary-color-light) !important;
  color: #ffffff;
}

/*msg面板*/
.msg_panel {
  margin-top: 10px;
}
.msg_panel .nav_control{
  display: block;
  height: 39px;
  background: #F9F9F9;
  border: 1px solid #e2e2e2;
}
.msg_panel .nav_control .layui-btn{
  background: #F9F9F9 !important;
}
.dataTables_filter label:before{
  line-height: 26px;
}
.msg_panel .layui-input{
  line-height: 26px;
  height: 26px;
}
.cpanel .layui-btn-group .layui-form-checkbox {
  margin-left: 10px;
}
.msg-btn {
  background: #F9F9F9 !important;
  color: #aaa !important;
  size: 14px;
  font-size: 14px;
}
.msg-btn:hover {
  color: #333 !important;
}
.msg-btn i{
  font-size: 14px !important;
}
.layout.layout--mobile #canvas {
  top: 0px;
}
.msg-type-mobile {
  z-index: 9999;
  margin: 0;
  text-align: left!important;
}
.msg-type-mobile ul {
  z-index: 9999;
  background-color: #fff;
  border: 1px solid #E1E1E1;
}
.msg-type-mobile h2 {
  font-size: 16px;
  color: #333333;
  margin: 14px 11px;
  display:none;
}
.msg-type-mobile li{
  padding: 0 6px;
}
.msg-type-mobile li button{
  width: 80px;
  height:34px;
  border:none;
  /* background: #fff; */
  font-size: 16px;
  color: #838383;
  background-color: #fff;
}
.layui-tab-title .layui-this:after {
  border: none;
}
.msg-type-mobile .layui-this button {
  color: #bb1a1f;
  border:none;
}
.msg-type-mobile .layui-this span {
  display: inline-block;
  height: 34px;
  border-bottom: 2px #bb1a1f solid;
}
.msg-type-mobile .layui-tab-bar {
  /* background-color: #f9f9f9; */
  border: none;
  width: 45px;
}
.msg-type-mobile .layui-tab-more {
  position: absolute;
  background-color: #fff;
  padding-right: 0px;
}
.msg-type-mobile .layui-tab-more+.msg-type-mobile-mask {
  background: rgba(0, 0, 0, 0.33);
  position: absolute;
  width: 100%;
  height: calc(100% + 888px);
  z-index: 8888;
}
.layui-tab-more+.msg-type-mobile-mask+.msg-type-placeholder{
  height:42px;
}
.msg-type-mobile .layui-tab-more li button{
  font-size: 14px;
  color: #838383;
  border-radius: 2px;
  border:1px solid #838383;
  background-color: #fff;
}
.msg-type-mobile .layui-tab-more li button span{
  display: inline-block;
  max-width: 58px;
  overflow: hidden;
  text-overflow:ellipsis;
  white-space: nowrap;
}
.msg-type-mobile .layui-tab-more .layui-this button {
  color: #bb1a1f; /* 这里是否需要替换成公共颜色，即各种主题色*/
  border:1px solid #bb1a1f;
}
.msg-type-mobile .layui-tab-more .layui-this span {
  border:none;
}
.msg-type-mobile .layui-tab-more h2 {
  display:block;
  width: 100%;
}
.msg_panel .nav_view{
  background: #fff;
  /* margin-top: 5px; */
}
.msg_panel img{
  max-width: 200px;
}
.msg_panel .list .loading,.msg_panel .list .end{
  display: none;
  background: #f6f6f6;
}
.msg_panel .list .more{
  cursor: pointer;
  background: #f6f6f6;
}
.msg-badge-wrap {
  display: inline-block;
  padding: 8px 5px 0 5px;
}
.list .view_content .item{
  border-bottom: 1px solid #e2e2e2;
  padding: 5px;
  position: relative;
  color: #888;
}
.list .view_content .unread .content {
  font-weight: 600;
}
.list .view_content .item:hover, .list .view_content .item:hover .item-actions { background: #f2f2f2; }
.list .view_content .item:last-child{
  border-bottom:none;
}
.list .view_content .item .layui-badge{
  background: #ccc;
  border-radius: 7px;
  padding: 0 5px;
  min-width: auto;
}
.list .view_content .item .layui-mini-badge{
  height: 8px;
  width: 8px;
  padding: 0;
}
.list .view_content .unread .msg-badge-wrap .layui-badge {
  background-color: #FF5722;
}
.list .view_content .item .nodata{
  text-align: center;
  color: #888;
}
.list .view_content .item .ext{
  font-size: 13px;
  text-align: right;
}
.list .view_content .item .ext .date{
  color:#AAA;
  margin-top:3px;
  font-size:12px;
}
.list .view_content .item .item-actions { position: absolute; top: 10px; right: 0; background: #fff; display: none; padding: 0 10px; }
.list .view_content .item:hover .item-actions { display: block; }
.item-actions .layui-btn+.layui-btn { margin-left: 0; }
.item-actions .msg-item-read { display: none; }
.unread .item-actions .msg-item-read { display: inline-block; }
.unread .item-actions .msg-item-unread { display: none; }
.list .view_content .item .cont{ padding: 5px 10px 5px 50px; }
#flow_box .list .view_content .item .cont{padding: 5px 10px 5px 30px;}
#flow_box .layui-form-checkbox[lay-skin=primary]{ display: none;}
.list .view_content .msg-ctrl {
  position: absolute;
  width: 40px;
  top: 4px;
  left: 10px;
  white-space: nowrap;
}
.list .view_content .item .cont .content{
  font-size: 14px;
  color: #333;
  word-wrap: break-word;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  text-align: left;
  cursor: pointer;
}
.list .view_content .item .msg-usr{
  font-size: 14px;
  color: #333;
}
.list .view_content .item .checkbox{
  position: absolute;
  display: block;
  top: 20px;
}
.topmsgbg{
  background:#fffdf5;
}

.topmsgbg .sticky{
  height: 0px;
  position: absolute;
  top: 0;
  left: 0;
  border-top: 12px solid #ffda41;
  border-right: 12px solid transparent;
}

/*首页widget模式*/
.widget .list .view_content .item .cont { padding: 0 70px 0 20px; }
.widget .list .view_content .item .cont .layui-row { white-space: nowrap; overflow: hidden; text-overflow: ellipsis;line-height: 30px; }
.widget .list .view_content .msg-ctrl { left: 0; width: 20; }
.widget .layui-form-checkbox { display: none; }
.widget .list .view_content .item .ext { position: absolute; top: 5px; right: 10px; }
.widget .list .view_content .item .item-actions { top: 5px; }
#flow_box .widget .list .view_content .msg-ctrl {left: 10px !important; width: 20; }
#flow_box .widget .list .view_content .item .cont .layui-row { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; line-height: unset !important;}
.list .view_content .item .line1{
  margin-top: 5px;
  margin-bottom: 5px;
}
.list .view_content .item .line2{
  margin-bottom: 5px;
}
.list .view_content .item .content {
  display: inline-block;
}
.list .view_content .item .doc-file-icon{
	font-size: 20px;
	display: inline-block;
	color: #555;
  margin-left: 2px;
}
.list .view_content .item .doc-ext{
	font-size: 13px;
  text-align: left;
  line-height: 20px;
  float: right;
  margin-right:5px;
}
.list .view_content .item .doc-file{
  font-weight: normal;
  margin-top: 8px;
  margin-left: -5px;
}
.list .view_content .item .doc-file-name{
	vertical-align: middle;
  display: inline-block;
  width: 10rem;
}
.doc-name {
  top: 2px;
  width: 10rem;
  height: 22px;
  line-height: 22px;
  position: relative;
  display: inline-block;
  width: 100%;
  vertical-align: text-bottom;
  overflow: hidden; text-overflow:ellipsis; white-space: nowrap;
}
.list .view_content .item .doc-file-size{
    font-size: 14px;
    position: relative;
    bottom: 0px;
    color:gray;
}
.list .view_content .item img.fileicon{
  width:46px;
  height:48px;
}

.list .view_content .item img.fileicon-m{
  width:36px;
  height:36px;
}
.doc-name-m {
  top: 11px;
  left: 7px;
  width: 10rem;
  height: 22px;
  line-height: 22px;
  position: relative;
  display: inline-block;
  width: 100%;
  vertical-align: text-bottom;
  overflow: hidden; text-overflow:ellipsis; white-space: nowrap;
}
.list .view_content .item .doc-file-size-m{
    font-size: 13px;
    color:gray;
    position: relative;
    bottom: 9px;
    text-align: right
}

@media (max-width:480px){
  .list .view_content .item .cont { padding-right: 80px; }
  .list .view_content .item .cont .content { white-space: normal; }
  .msg_control {
    text-align: left;
  }
  .msg_control button span {
    display: none;
  }
  .list .view_content .item .ext {
    position: absolute;
    top: 10px;
    right: 10px;
  }
  .layui-form-checkbox[lay-skin=primary] {
    float: none;
  }
}

.elem-new.msg-wrapper {
}

.ajax_block #msg-list-wrapper {
  margin-top: 0;
}

.elem-new.msg-wrapper .msg-action-group {
  display: flex;
  position: fixed;
  height: 70px;
  width: 100%;

  top: calc(var(--menuh-height) + 8px);

  background: var(--elem-white);
  z-index: 9999999;
}

.elem-new.msg-wrapper .msg-action-group .msg-action__btn {
  display: flex;
  justify-content: center;
  align-items: center;
  flex-direction: column;

  flex: 1;


}
.elem-new.msg-wrapper .msg-action-group .msg-action__btn .msg-action-btn__icon {
  color: var(--pepm-red);
  font-size: 20px;
}
.elem-new.msg-wrapper .msg-action-group .msg-action__btn.disabled .msg-action-btn__icon,
.elem-new.msg-wrapper .msg-action-group .msg-action__btn.disabled .msg-action-btn__text
{
  color: var(--disabled-color);
}
.elem-new.msg-wrapper .msg-action-group .msg-action__btn .msg-action-btn__text {
  color: var(--pepm-text-color);
  font-weight: bold;
  font-size: var(--pepm-secondary-font-size);
}

#toolbar~.layout #canvas .elem-new.msg-wrapper .msg-list-wrapper {
  margin-top: 0 !important;
}
#toolbar~.layout #canvas .ajax_block #msg-list-wrapper {
  margin-top: 0 !important;
}
.elem-new.msg-wrapper .msg-list-wrapper {
  height: 100%;
  width: calc(100% - 16px);
  border-radius: 5px;
  margin-left: 8px;
  margin-right: 8px;
  background: var(--elem-white);
}

.elem-new.msg-wrapper .msg-list-wrapper .msg-item__detail,
.elem-new.msg-wrapper .msg-list-wrapper .msg-item__radio
{
  transition: 200ms;
}

.elem-new.msg-wrapper .msg-list-wrapper .msg-list__search {
  height: 40px;
  border-bottom: 1px solid var(--border-color);
}
.elem-new.msg-wrapper .msg-list-wrapper .msg-list__search:after {
  -webkit-transform: scaleY(0.5);
  transform: scaleY(0.5);
}
.elem-new.msg-wrapper .msg-list-wrapper .msg-list__search .msg-search__icon {
  display: inline-block;
  height: 40px;
  width: 100%;
}
.elem-new.msg-wrapper .msg-list-wrapper .msg-list__search .msg-search__icon:before {
  content: "";
  background: url("/static/images/new/search.png") no-repeat center center;
  -webkit-background-size: 25px 25px;
  background-size: var(--primary-font-size);

  float: left;
  position: absolute;
  line-height: 40px;
  height: 40px;
  width: 50px;
}
.elem-new.msg-wrapper .msg-list-wrapper .msg-list__search .msg-search__input {
  height: 40px;
  width: calc(100% - 50px);

  padding-left: 50px;

  font-size: var(--primary-font-size);

  background: transparent;
  border: 0;
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
}
.elem-new.msg-wrapper .msg-list .msg-list__search .msg-search__input::-webkit-input-placeholder {
  line-height: 1em;
}

.elem-new.msg-wrapper .msg-list .msg-item {
  box-sizing: border-box;
  border-bottom: 1px solid var(--border-color);
  min-height: 80px;
  padding-top: 8px;
}
.elem-new.msg-wrapper .msg-list .msg-item[data-is-doc="1"] .msg-item__radio {
    height: auto;
    top: 12px;
}
.elem-new.msg-wrapper .msg-list .msg-item .msg-item__radio {
  float: left;
  transform: translateX(calc(50px / 2 - 18px / 2));

  position: relative;
  top: 4px;
  width: 50px;
}
.elem-new.msg-wrapper:not(.edit-mode) .msg-list .msg-item .msg-item__radio {
  transform: translateX(calc(-25px - 8px));
}
.elem-new.msg-wrapper .msg-list .msg-item .msg-item__radio .check-radio {
  position: absolute;
  top: calc((24px + 16px + 3em - 9px) / 4 - 2px);
  width: 18px;
  height: 18px;

  border: 2px solid var(--control-border-color);
  -webkit-border-radius: 50%;
  -moz-border-radius: 50%;
  border-radius: 50%;
}
.elem-new.msg-wrapper .msg-list .msg-item[data-is-doc="1"] .msg-item__radio .check-radio {
  top: calc((24px + 16px + 4.5em) / 4);
}
.elem-new.msg-wrapper .msg-list .msg-item.selected .msg-item__radio .check-radio {
  background: url("/static/images/new/radio-checked.png");
  background-size: 22px;

  border-width: 0;
  width: 22px;
  height: 22px;
}

.elem-new.msg-wrapper .msg-list .msg-item .msg-item__detail {
  position: relative;
  transform: translateX(50px);
  padding: 0 17px 8px 0;
  width: calc(100% - 50px - 17px);
  display: flex;
  flex-direction: column;
}

.elem-new.msg-wrapper:not(.edit-mode) .msg-list .msg-item .msg-item__detail {
  transform: translateX(18px);
  width: calc(100% - 17px * 2);
}

.elem-new.msg-wrapper .msg-list .msg-item .msg-item__detail:after {
  -webkit-transform: scaleY(0.5);
  transform: scaleY(0.5);
}

.elem-new.msg-wrapper .msg-list .msg-item .msg-item__detail .msg-detail__top {
  display: flex;
  justify-content: space-between;
  flex: 1;
  height: 24px;
  line-height: 24px;
}
.elem-new.msg-wrapper .msg-list .msg-item .msg-item__detail .msg-detail__top .msg-detail__bnw {
  flex: 1;
}
.elem-new.msg-wrapper .msg-list .msg-item .msg-item__detail .msg-detail__top .msg-detail__badge {
  width: 8px;
  height: 8px;
  background: #ff002a;
  -webkit-border-radius: 50%;
  -moz-border-radius: 50%;
  border-radius: 50%;
  position: relative;
  top: calc(24px / 2 - 8px / 2);

  float: left;
}
.elem-new.msg-wrapper .msg-list .msg-item[data-is-read="1"] .msg-item__detail .msg-detail__top .msg-detail__badge  {
  display: none;
}
.elem-new.msg-wrapper .msg-list .msg-item .msg-item__detail .msg-detail__top .msg-detail__name {
  font-size: 16px;
  font-weight: bold;
  color: var(--pepm-text-color);
  margin-left: 12px;
  height: 24px;
  line-height: 24px;
  vertical-align: middle;
  text-overflow: ellipsis;
  width: 10em;
  overflow: hidden;
  word-break: keep-all;
}
.elem-new.msg-wrapper .msg-list .msg-item[data-is-read="1"] .msg-item__detail .msg-detail__top .msg-detail__name {
  margin-left: 0;
}

.elem-new.msg-wrapper .msg-list .msg-item .msg-detail__time {
  font-size: 14px;
  color: var(--placeholder-color);
  position: absolute;
  right: 17px;
}


.elem-new.msg-wrapper .msg-list .msg-item .msg-item__detail .msg-detail__bottom {
  line-height: 1.5em;
  overflow: hidden;
  text-overflow: ellipsis;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  word-break: break-all;
  padding-right: 3px;
}
.elem-new.msg-wrapper .msg-list .msg-item[data-is-doc="1"] .msg-item__detail .msg-detail__bottom {
    min-height: 4.5em;
}

.elem-new.msg-wrapper .msg-list .msg-item .msg-item__detail .msg-detail__bottom .doc-file {
    height: 2.7em;
    margin-top: 0.3em;
    display: flex;
}
.elem-new.msg-wrapper .msg-list .msg-item .msg-item__detail .msg-detail__bottom .doc-file .doc-file-img-wrapper {
  display:inline-block;
  height: 100%;
}
.elem-new.msg-wrapper .msg-list .msg-item .msg-item__detail .msg-detail__bottom .doc-file .doc-file-img-wrapper img {
  height: 100%;
}
.elem-new.msg-wrapper .msg-list .msg-item .msg-item__detail .msg-detail__bottom .doc-file .doc-ns-wrapper {
  display: inline-flex;
  flex-direction: column;
  height: 3em;
  line-height: 1.4em;
}

/*首页的话暂时显示十条*/
.elem-new .msg-list.msg-widget .msg-item:nth-child(10)~.msg-item {
  display: none;
}
.elem-new.msg-wrapper.widget+div {
  display: none;
}
.elem-new .msg-list.msg-widget .msg-item__radio {
  display: none;
}
.elem-new .msg-list.msg-widget .msg-item__detail {
  left: 0 !important;
  padding: 8px 8px 8px 8px !important;
  width: calc(100% - 16px) !important;
  transform: translateX(0px) !important;
}
.elem-new.msg-wrapper.widget .no-message {
  background: #fff !important;
}
.elem-new.msg-wrapper.widget .no-message+div {
  display: none;
}

.elem-new.msg-wrapper.widget .msg-list-wrapper .msg-item__detail,
.elem-new.msg-wrapper.widget .msg-list-wrapper .msg-item__radio {
  transition: 0ms !important;
}
.elem-new.msg-wrapper .msg-list .msg-item{
  position: relative;
}

/* task/2024-12490 消息中心改造 */
[dataroom-mode] .elem-new.msg-wrapper .msg-list .msg-item .msg-item__detail {
  transform: translateX(12px);
  width: calc(100% - 24px) !important;
  padding: 0 12px 8px 0;
}
[dataroom-mode] .elem-new.msg-wrapper:not(.edit-mode)  .msg-list .msg-item .msg-item__detail {
  transform: translateX(12px);
  padding: 0 12px 8px 0;
}

[dataroom-mode] .elem-new.msg-wrapper .msg-list .msg-item .msg-item__radio {
  transform: translateX(calc(100% - 30px));
  width: 100%;
  z-index: 99999;
}
[dataroom-mode] .elem-new.msg-wrapper:not(.edit-mode) .msg-list .msg-item .msg-item__radio {
  transform: translateX(calc(100% - 30px));
  width: 100%;
  z-index: 99999;
}

[dataroom-mode] .elem-new.msg-wrapper .msg-list .msg-item .msg-item__radio .check-radio {
  top: 30px;
  width: 10px;
  height: 10px;
  border: 1px solid var(--control-border-color);
}
[dataroom-mode] .elem-new.msg-wrapper .msg-list .msg-item.selected .msg-item__radio .check-radio {
  transform: translate(-2px, -2px);
  border: 0;
  background-size: 18px;
  width: 18px;
  height: 18px;
  background-position: center;

  background-image: url(/static/images/new/radio-checked-black.png), linear-gradient(var(--primary-color), var(--primary-color));
  background-blend-mode: lighten;
  background-size: cover;
}