
html{
    font-size: 14px;
}
/*@font-face {
  font-family: 'fontello';
  src: url('../fonts/fontello.eot');
  src: url('../fonts/fontello.eot') format('embedded-opentype'),
       url('../fonts/fontello.woff2') format('woff2'),
       url('../fonts/fontello.woff') format('woff'),
       url('../fonts/fontello.ttf') format('truetype'),
       url('../fonts/fontello.svg') format('svg');
  font-weight: normal;
  font-style: normal;
}*/
@font-face {
        font-family: 'fontello';
        src: url('../fonts/fontello.ttf?id=41');
        /* src: url('../fonts/fontello.eot') format('embedded-opentype'),
       url('../fonts/fontello.woff2') format('woff2'),
       url('../fonts/fontello.woff') format('woff'),
       url('../fonts/fontello.ttf?id=2') format('truetype'),
       url('../fonts/fontello.svg') format('svg');*/
        font-weight: normal;
        font-style: normal;
}
[class^="icon-"]:before, [class*=" icon-"]:before {
        font-family: "fontello";
        font-style: normal;
        font-weight: normal;
        speak-as: none;
        display: inline-block;
        text-decoration: inherit;
        width: 1em;
        margin-right: .2em;
        text-align: center;
        /* opacity: .8; */
        /* For safety - reset parent styles, that can break glyph codes*/
        font-variant: normal;
        text-transform: none;
        /* fix buttons height, for twitter bootstrap */
        line-height: 1em;
        /* Animation center compensation - margins should be symmetric */
        /* remove if not needed */
        margin-left: .2em;
        /* you can be more comfortable with increased icons size */
        /* font-size: 120%; */
        /* Font smoothing. That was taken from TWBS */
        -webkit-font-smoothing: antialiased;
        -moz-osx-font-smoothing: grayscale;
        /* Uncomment for 3D effect */
        /* text-shadow: 1px 1px 1px rgba(127, 127, 127, 0.3); */
}
.icon-normal {
    color: var(--bs-navbar-color);
}
.icon-big {
    font-size: 2.4rem;
}
.icon-exit:before {
        content: '\e803';
}/*退出*/
.icon-user:before {
        content: '\e806';
}/*用户图标*/
.icon-logo:before {
        content: '\f511';
}/*安森LOGO*/
.icon-ok:before {
        content: '\e80f';
}/*确定*/
.icon-exclamation:before {
        content: '\f900';
}/*感叹号：提醒*/
.icon-cancel:before {
        content: '\e805';
}
/*感叹号：提醒带三角形背景*/
.icon-attention:before {
        content: '\e807';
}/*取消*/
.icon-cogfig:before {
        content: '\e80a';
}/*设置*/
.icon-refresh:before {
        content: '\e80d';
}/*刷新*/
.icon-edit:before {
        content: '\e812';
}/*编辑*/
.icon-uncheck:before {
        content: '\f096';
}/*方形复选框：未选中*/
.icon-check:before {
        content: '\e811';
}/*方形复选框：选中*/
.icon-minus:before {
        content: '\e810';
} /*减号*/
.icon-plus:before {
        content: '\e804';
} /*加号*/
.icon-previous:before {
        content: '\e814';
} /* 前一页 */
.icon-next:before {
        content: '\e815';
} /* 后一页 */
.icon-lock:before {
    content: "\e80b"
}/* 锁定 */
.icon-unlock:before {
    content: "\e80c"
}/* 解除锁定 */
.icon-colock:before {
    content: "\eb17"
}/* 闹钟时间 */
.icon-att:before {
    content: "\f901"
}/* 考勤时间 */
.icon-date-progress:before {
    content: "\f903"
}/* 激活 */
.icon-expired:before {
    content: "\f904"
}/* 有效期内 */
.icon-visitor:before {
    content: "\f905"
}/* 访客 */
.icon-filter:before {
    content: "\f906"
}/* 访客 */
.icon-user-card:before {
    content: "\f907"
}/* 禁止用户通行 */
.icon-door-trouble:before {
    content: "\f908"
}/* 设备损坏 */
.icon-help:before {
    content: "\f128"
}/* 帮助 */
.icon-info:before {
    content: "\f129"
}/* 提示信息 */
.icon-download:before {
    content: "\e800"
}/* 下载 */
.icon-point:before {
    content: "\f25a"
}/* 指向 */
.icon-folder:before {
    content: "\e81a"
}/* 文件夹 */
.icon-progress:before {
    content: "\e838"
}/* 进程 */
.icon-schedule-unlock:before {
    content: "\d610"
}/* 计划解锁 */
.icon-clock:before {
    content: "\e817"
}/* 时钟 */
.icon-camera:before {
    content: "\e808"
}/* 抓拍 */
.icon-card:before {
    content: "\d626"
}/* 卡片 */
.icon-visitor-2:before {
    content: "\d627"
}/* 访客2 */
.icon-lock-2:before {
    content: "\d628"
}/* 关门2 */
.icon-unlock-2:before {
    content: "\d629"
}/* 开门2 */
.icon-alarm-2:before {
    content: "\d611"
}/* 报警2 */
.icon-alarm-3:before {
    content: "\d612"
}/* 报警3 */
.icon-holiday:before {
    content: "\d613"
}/* 假日 */
.icon-access-level:before {
    content: "\d614"
}/* 权限组 */
.icon-controller:before {
    content: "\d615"
}/* 控制器 */
.icon-area:before {
    content: "\d616"
}/* 区域 */
.icon-access-level-2:before {
    content: "\d617"
}/* 权限组2 */
.icon-card-2:before {
    content: "\d618"
}/* 卡片2 */
.icon-door-open:before {
    content: "\d619"
}/* 开门3 */
.icon-door-close:before {
    content: "\d631"
}/* 关门3 */
.icon-arm:before {
    content: "\d632"
}/* arm布防状态 */
.icon-disarm:before {
    content: "\d633"
}/* disarm撤防状态 */
.icon-schedule:before {
    content: "\e802"
}/* 计划 */

/* 方案三的图标_t */
.icon-user-active-t:before {
    content: "\d634"
}/* 激活用户 */
.icon-user-inactive-t:before {
    content: "\d635"
}/* 非激活用户 */
.icon-user-progress-t:before {
    content: "\d636"
}/* 用户在有效期内 */
.icon-user-expiry-t:before {
    content: "\d637"
}/* 用户过期或者未到激活日期 */
.icon-user-visitor-t:before {
    content: "\d638"
}/* 访客 */
.icon-card-active-t:before {
    content: "\d639"
}/* 卡片激活 */
.icon-card-inactive-t:before {
    content: "\d640"
}/* 卡片未激活 */
.icon-mobile-active-t:before {
    content: "\d641"
}/* 手机激活 */
.icon-mobile-inactive-t:before {
    content: "\d642"
}/* 手机未激活 */
.icon-qr-active-t:before {
    content: "\d644"
}/* 二维码激活 */
.icon-qr-inactive-t:before {
    content: "\d643"
}/* 二维码未激活 */
.icon-unassign-user-t:before {
    content: "\d645"
}/* 未指定人员 */
.icon-close-door-t:before {
    content: "\d649"
}/* 关门 */
.icon-open-door-t:before {
    content: "\d650"
}/* 开门 */
.icon-o-open-door-t:before {
    content: "\d652"
}/* 强制开门 */
.icon-o-close-door-t:before {
    content: "\d651"
}/* 强制关门 */
.icon-alarm-door-t:before {
    content: "\d653"
}/* 报警 */
.icon-disable-door-t:before {
    content: "\d654"
}/* 禁用 */
.icon-help-t:before {
    content: "\d655"
}/* 未知 */
.icon-trouble-door-t:before {
    content: "\d656"
}/* 问题 */
.icon-temper-door-t:before {
    content: "\d657"
}/* 防拆 */
.icon-open-door-schedule-t:before {
    content: "\d658"
}/* 计划开门 */
.icon-open-door-delay-t:before {
    content: "\d659"
}/* 延迟开门 */
.icon-cancel-t:before {
    content: "\d660"
}/* 延迟开门 */
.icon-controller-active-t:before {
    content: "\d661"
}/* 控制器激活状态 */
.icon-controller-inactive-t:before {
    content: "\d662"
}/* 控制器非激活状态 */
.icon-schedual-active-t:before {
    content: "\d663"
}/* 计划激活状态 */
.icon-schedual-inactive-t:before {
    content: "\d664"
}/* 计划非激活状态 */
.icon-holiday-active-t:before {
    content: "\d665"
}/* 假日激活状态 */
.icon-holiday-inactive-t:before {
    content: "\d666"
}/* 假日非激活状态 */
.icon-access-level-active-t:before {
    content: "\d667"
}/* 权限激活状态 */
.icon-access-level-inactive-t:before {
    content: "\d668"
}/* 权限非激活状态 */
.icon-config-t:before {
    content: "\d669"
}/* 设置 */





/* 手机确认OK 开始*/
.icon-mobile-ok {
    position: relative; /* 使 ::after 可以相对于此元素定位 */
}
/* 手机确认OK */
.icon-mobile-ok:before {
    content: "\d620"
}
/* 新增用于创建绿色小方块的 ::after 伪元素 */
.icon-mobile-ok::after {
    content: "";
    position: absolute;
    top: 50%;
    left: 50%;
    width: 20px; /* 小方块的宽度 */
    height: 40px; /* 小方块的高度 */
    background-color: rgba(var(--bg-dark-green-rgb), var(--bg-panel-opacity))!important;
    transform: translate(-50%, -50%); /* 居中 */
    border-radius: 2px; /* 圆角处理 */
    z-index: -1; /* 确保在图标之下 */
}
/* 手机确认OK 结束*/

/* 手机禁用 开始*/
.icon-mobile-disabled {
    position: relative; /* 使 ::after 可以相对于此元素定位 */
}
/* 手机禁用 */
.icon-mobile-disabled:before {
    content: "\d620"
}
/* 新增用于创建绿色小方块的 ::after 伪元素 */
.icon-mobile-disabled::after {
    content: "";
    position: absolute;
    top: 50%;
    left: 50%;
    width: 20px; /* 小方块的宽度 */
    height: 40px; /* 小方块的高度 */
    background-color: rgba(var(--bg-gray-rgb), var(--bg-panel-opacity))!important;
    transform: translate(-50%, -50%); /* 居中 */
    border-radius: 2px; /* 圆角处理 */
    z-index: -1; /* 确保在图标之下 */
}
/* 手机禁用 结束*/

.icon-mobile-alarm:before {
    content: "\d630"
}/* 手机设置有错误 */
.icon-mobile-qr:before {
    content: "\d621"
}/* 二维码 */
.icon-mobile-nfc:before {
    content: "\d622"
}/* NFC */
.icon-xls-import:before {
    content: "\d623"
}/* excel导入 */
.icon-xls-export:before {
    content: "\d624"
}/* excel导出 */
.icon-print:before {
    content: "\e80e"
}/* 打印 */
.icon-file-error:before {
    content: "\d625"
}/* 文件错误 */
/*背景*/
/*用户背景 开始*/
.user-circle {
        border-radius: 100%;
        width: 50px;
        height: 50px;
        border: 2px solid #333;
        float: left;
        background-color: #DDD;
        text-align: center;
        padding-top: 6px;
}
.user-circle.active {
        background-color: green;
        color: white;
}
.user-circle.inactive {
        background-color: darkgrey;
        color: white;
}
/*用户背景 结束*/
.item-panel .title {
        font-size: 0.8rem;
}

/*项目样式：1080p时，一行4个 结束*/
/*普通按钮开始*/
.normal-button {
        position: relative;
        display: block;
        padding: var(--bs-pagination-padding-y) var(--bs-pagination-padding-x);
        font-size: var(--bs-pagination-font-size);
        color: var(--bs-pagination-color);
        text-decoration: none;
        background-color: var(--bs-pagination-bg);
        border: var(--bs-pagination-border-width) solid var(--bs-pagination-border-color);
        transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
        border-top-left-radius: var(--bs-pagination-border-radius);
        border-bottom-left-radius: var(--bs-pagination-border-radius);
}
.normal-button:hover {
        z-index: 2;
        color: var(--bs-pagination-hover-color);
        background-color: var(--bs-pagination-hover-bg);
        border-color: var(--bs-pagination-hover-border-color);
}
.normal-button:focus {
        z-index: 3;
        color: var(--bs-pagination-focus-color);
        background-color: var(--bs-pagination-focus-bg);
        outline: 0;
        box-shadow: var(--bs-pagination-focus-box-shadow);
}
/*普通按钮结束*/

/*用户样式 开始*/
/*列表模式*/
.list_item_box {
    margin: 0;
    display: grid;
    padding: 1em;
    grid-template-columns: repeat(auto-fit, minmax(325px, 1fr)); 
    gap: 1em 3em;
    justify-content: start;
    justify-items: center; /*start | end | center | stretch;*/
}
.list_item_box > div {
    padding-left: 24px;
}
/*鼠标经过项目背景变浅灰色，表示可点击*/
.list_item_box .panel_hover {
    cursor: pointer;
}
.list_item_box .panel_hover:hover {
    background-color: rgba(var(--bg-light-gray-rgb), var(--bg-panel-opacity))!important;
}
/*点击选中样式*/
.list_item_box .selected_panel {
    cursor: pointer;
    background-color: rgba(var(--bg-light-gray-rgb), var(--bg-panel-opacity))!important;
}
.list_item {
  /*min-width: 300px;
  max-width: 480px;*/
  width: 325px;
  border: 1px solid #000;
  border-width: 1px 1px 1px 0px;
  border-radius: 5px;
  height: var(--bg-list-item-height);
  display: flex;
  flex-wrap:nowrap;
  margin: 0 auto 0 auto;
  align-items: center;
  background-color: rgba(var(--bs-body-color-rgb), 0.03);
  box-shadow: var(--pn-box-shadow-ssm) !important;
}
/*只用于人员位置信息的报表的list*/
.list_item_h {
  padding: 0.2rem 0.4rem;
  width: 325px;
  border: 1px solid #000;
  border-width: 1px 1px 1px 1px;
  border-radius: 5px;
  height: 70px;
  display: flex;
  flex-wrap:nowrap;
  margin: 0 auto 0 auto;
  align-items: center;
  background-color: rgba(var(--bs-body-color-rgb), 0.03);
  box-shadow: var(--pn-box-shadow-ssm) !important;
}
.list_item_sm {
  min-width: 180px;
  max-width: 300px;
  border: 1px solid #000;
  border-width: 1px 1px 1px 0px;
  border-radius: 5px;
  width: var(--bg-list-item-height);
  display: flex;
  flex-wrap:nowrap;
  margin: 0 auto 0 auto;
  align-items: center;
}
/*项目类型通用样式 标准方案*/ 
.list_item_type {
  flex: 0 0 auto;
  height: var(--bg-list-item-height);
  width: var(--bg-list-item-width);
  margin: 0 0 0 var(--bg-list-item-margin-left);
  border-radius: var(--bg-list-item-radius);
  /*容器里的icon左右上下居中*/
  display:flex;
  align-items: center;
  justify-content: center;
  font-size:1.8rem;
}
/*项目类型通用样式 方案二*/ 
.list_item_type_2 {
  flex: 0 0 auto;
  height: var(--bg-list-item-height);
  width: var(--bg-list-item-width);
  margin: 0 0 0 var(--bg-list-item-margin-left);
  border-radius: var(--bg-list-item-ex-radius);
  /*容器里的icon左右上下居中*/
  display:flex;
  align-items: center;
  justify-content: center;
  font-size:1.8rem;
}/*项目类型通用样式 方案二*/ 
.list_item_type_3 {
  flex: 0 0 auto;
  height: var(--bg-list-item-height);
  width: var(--bg-list-item-width);
  margin: 0 0 0 var(--bg-list-item-margin-left);
  border-radius: var(--bg-list-item-ex-radius);
  /*容器里的icon左右上下居中*/
  display:flex;
  align-items: center;
  justify-content: center;
  font-size:1.8rem;
}
.list_item_type_view{
   margin: 0 0 0 0; 
  font-size: 3rem;
}
/*项目类型通用未设置边距0*/ 
.list_item_type_ex {
  flex: 0 0 auto;
  height: var(--bg-list-item-height);
  width: var(--bg-list-item-width);
  border-radius: var(--bg-list-item-radius);
  /*容器里的icon左右上下居中*/
  display:flex;
  align-items: center;
  justify-content: center;
  font-size:1.8rem;
}
.list_item_type_icon {
  flex: 0 0 auto;
  height: var(--bg-list-item-width);
  width: var(--bg-list-item-width);
  margin: 0px;
  border-radius: 50%;
  /*容器里的icon左右上下居中*/
  display:flex;
  align-items: center;
  justify-content: center;
  font-size: 1.8rem;
}
.list_item .visitor-type{
   font-size:1.8rem; 
   color: rgb(51, 51, 51);
}
.list_item .visitor-type-t{
   font-size:2rem; 
   color: rgb(51, 51, 51);
}
/*启用的用户类型*/ 
.list_item_active{
   /*icon类型通过这里设置背景和前景颜色来区分*/
  background-color: rgba(var(--bg-dark-green-rgb), var(--bg-panel-opacity))!important; /*圆背景色*/
  border:1px solid rgb(var(--bo-dark-gray-rgb)); /*圆边框色*/
  color:rgba(var(--fg-white-rgb), var(--bg-panel-opacity))!important; /*圆前景色*/      
}
/*启用的用户类型 绿色镂空*/ 
.list_item_active_2{
   /*icon类型通过这里设置背景和前景颜色来区分*/
  background-color: rgba(var(--bg-white-rgb), var(--bg-panel-opacity))!important; /*圆背景色*/
  border:1px solid rgb(var(--bo-dark-green-rgb)); /*圆边框色*/
  color:rgba(var(--bo-dark-green-rgb), var(--bg-panel-opacity))!important; /*圆前景色*/      
}
/* */ 
.list_item_user_active_3{
   /*icon类型通过这里设置背景和前景颜色来区分*/
  background-color: rgba(var(--bg-white-rgb), var(--bg-panel-opacity))!important; 
  border:1px solid rgb(var(--bo-dark-green-rgb)); /*圆边框色*/
  color:rgba(var(--fg-white-rgb), var(--bg-panel-opacity))!important; /*圆前景色*/   
}
.list_item_internal_user_active_3{
  /*background-color: rgba(var(--bg-dark-green-rgb), var(--bg-panel-opacity))!important; */
  background: linear-gradient(45deg, rgb(var(--bg-dark-green-rgb)) 30%, rgb(var(--bg-green-rgb)));
  border-radius: 16%; 
  font-size:1.9rem;
}
/* */ 
.list_item_user_inactive_3{
   /*icon类型通过这里设置背景和前景颜色来区分*/
  background-color: rgba(var(--bg-white-rgb), var(--bg-panel-opacity))!important; 
  border:1px solid rgb(var(--bg-item-user-inactive-rgb)); /*边框色*/
  color:rgba(var(--fg-white-rgb), var(--bg-panel-opacity))!important; /*前景色*/   
}
.list_item_internal_user_inactive_3{
  /*background-color: rgb(var(--bg-item-user-inactive-rgb))!important; */
  background: linear-gradient(45deg, rgb(var(--bg-item-user-inactive-rgb)) 20%, rgb(var(--bg-item-user-inactive-s-rgb)));
  border-radius: 16%; 
  font-size:1.9rem;
}
/* */ 
.list_item_user_no_access_level_3{
   /*icon类型通过这里设置背景和前景颜色来区分*/
  background-color: rgba(var(--bg-white-rgb), var(--bg-panel-opacity))!important; 
  border:1px solid rgb(var(--bg-item-user-no-access-level-rgb)); /*边框色*/
  color:rgba(var(--fg-white-rgb), var(--bg-panel-opacity))!important; /*前景色*/   
}
.list_item_internal_user_no_access_level_3{
  /*background-color: rgb(var(--bg-item-user-inactive-rgb))!important; */
  background: linear-gradient(45deg, rgb(var(--bg-item-user-no-access-level-rgb)) 20%, rgb(var(--bg-item-user-no-access-level-s-rgb)));
  border-radius: 16%; 
  font-size:1.9rem;
}
/* */ 
.list_item_user_expiry_3{
   /*icon类型通过这里设置背景和前景颜色来区分*/
  background-color: rgba(var(--bg-white-rgb), var(--bg-panel-opacity))!important; 
  border:1px solid rgb(var(--bg-item-user-expiry-rgb)); /*边框色*/
  color:rgba(var(--fg-white-rgb), var(--bg-panel-opacity))!important; /*前景色*/   
}
.list_item_internal_expiry_3{
  /*background-color: rgb(var(--bg-item-user-inactive-rgb))!important; */
  background: linear-gradient(45deg, rgb(var(--bg-item-user-expiry-rgb)) 20%, rgb(var(--bg-item-user-expiry-s-rgb)));
  border-radius: 16%; 
  font-size:1.9rem;
}
/* */ 
.list_item_user_pending_3{
   /*icon类型通过这里设置背景和前景颜色来区分*/
  background-color: rgba(var(--bg-white-rgb), var(--bg-panel-opacity))!important; 
  border:1px solid rgb(var(--bg-item-user-pending-rgb)); /*边框色*/
  color:rgba(var(--fg-white-rgb), var(--bg-panel-opacity))!important; /*前景色*/   
}
.list_item_internal_pending_3{
  /*background-color: rgb(var(--bg-item-user-inactive-rgb))!important; */
  background: linear-gradient(45deg, rgb(var(--bg-item-user-pending-rgb)) 20%, rgb(var(--bg-item-user-pending-s-rgb)));
  border-radius: 16%; 
  font-size:1.9rem;
}
/* */ 
.list_item_user_progress_3{
   /*icon类型通过这里设置背景和前景颜色来区分*/
  background-color: rgba(var(--bg-white-rgb), var(--bg-panel-opacity))!important; 
  border:1px solid rgb(var(--bo-dark-green-rgb)); /*圆边框色*/
  color:rgba(var(--fg-white-rgb), var(--bg-panel-opacity))!important; /*圆前景色*/   
}
.list_item_internal_user_progress_3{
  /*background-color: rgba(var(--bg-dark-green-rgb), var(--bg-panel-opacity))!important; */
  background: linear-gradient(45deg, rgb(var(--bg-dark-green-rgb)) 30%, rgb(var(--bg-green-rgb)));
  border-radius: 16%; 
  font-size:1.9rem;
}


/* */ 
.list_item_door_open_3{
   /*icon类型通过这里设置背景和前景颜色来区分*/
  background-color: rgba(var(--bg-white-rgb), var(--bg-panel-opacity))!important; 
  border:1px solid rgb(var(--bg-item-door-open-rgb)); /*边框色*/
  color:rgba(var(--fg-white-rgb), var(--bg-panel-opacity))!important; /*圆前景色*/   
}
.list_item_internal_door_open_3{
  /*background-color: rgba(var(--bg-dark-green-rgb), var(--bg-panel-opacity))!important; */
  background: linear-gradient(45deg, rgb(var(--bg-item-door-open-rgb)) 30%, rgb(var(--bg-item-door-open-s-rgb)));
  border-radius: 16%; 
  font-size:1.9rem;
}
/* */ 
.list_item_door_close_3{
   /*icon类型通过这里设置背景和前景颜色来区分*/
  background-color: rgba(var(--bg-white-rgb), var(--bg-panel-opacity))!important; 
  border:1px solid rgb(var(--bg-item-door-close-s-rgb)); /*边框色*/
  color:rgba(var(--fg-white-rgb), var(--bg-panel-opacity))!important; /*前景色*/   
}
.list_item_internal_door_close_3{
  background: linear-gradient(45deg, rgb(var(--bg-item-door-close-rgb)) 20%, rgb(var(--bg-item-door-close-s-rgb)));
  /*background-color: rgb(var(--bg-item-door-close-s-rgb));*/
  border-radius: 16%; 
  font-size:1.9rem;
}
/* */ 
.list_item_door_trouble_3{
   /*icon类型通过这里设置背景和前景颜色来区分*/
  background-color: rgba(var(--bg-white-rgb), var(--bg-panel-opacity))!important; 
  border:1px solid rgb(var(--bg-item-door-trouble-rgb)); /*边框色*/
  color:rgba(var(--fg-white-rgb), var(--bg-panel-opacity))!important; /*前景色*/   
}
.list_item_internal_door_trouble_3{
  background: linear-gradient(45deg, rgb(var(--bg-item-door-trouble-rgb)) 20%, rgb(var(--bg-item-door-trouble-s-rgb)));
  border-radius: 16%; 
  font-size:1.9rem;
}
.list_item_door_trouble_fg_3{
  color:rgba(var(--fg-item-door-trouble-rgb), var(--bg-panel-opacity)); /*前景色*/   
}
/* */ 
.list_item_door_alarm_3{
   /*icon类型通过这里设置背景和前景颜色来区分*/
  background-color: rgba(var(--bg-white-rgb), var(--bg-panel-opacity))!important; 
  border:1px solid rgb(var(--bg-item-door-alarm-rgb)); /*边框色*/
  color:rgba(var(--fg-white-rgb), var(--bg-panel-opacity))!important; /*前景色*/   
}
.list_item_internal_door_alarm_3{
  background: linear-gradient(45deg, rgb(var(--bg-item-door-alarm-rgb)) 20%, rgb(var(--bg-item-door-alarm-s-rgb)));
  border-radius: 16%; 
  font-size:1.9rem;
}
/**/ 
.list_item_lockdown_3{
   /*icon类型通过这里设置背景和前景颜色来区分*/
  /*background-color: rgba(var(--bg-white-rgb), var(--bg-panel-opacity))!important; */ 
  background-color: rgba(var(--bg-white-rgb), var(--bg-panel-opacity))!important;   
  border:1px solid rgb(var(--bg-lockdown-s-rgb)); /*边框色*/
  color:rgba(var(--fg-red-rgb), var(--bg-panel-opacity))!important; /*前景色*/      
}
/**/ 
.list_item_lockdown_s_3{
   /*icon类型通过这里设置背景和前景颜色来区分
  background: linear-gradient(45deg, rgb(var(--bg-item-door-trouble-rgb)) 20%, rgb(var(--bg-item-door-trouble-s-rgb)));*/
  background-color: rgba(var(--bg-lockdown-rgb), var(--bg-panel-opacity))!important;
  border:1px solid rgba(var(--bg-lockdown-s-rgb), var(--bg-panel-opacity-6)); /*边框色ccce06 rgb(var(--bg-item-door-trouble-s-rgb))*/
  border-radius: 16%; 
  font-size:1.9rem; 
}
/**/ 
.list_item_internal_area_inactive_s_3{
   /*icon类型通过这里设置背景和前景颜色来区分
  background: linear-gradient(45deg, rgb(var(--bg-item-door-trouble-rgb)) 20%, rgb(var(--bg-item-door-trouble-s-rgb)));*/
  background-color: rgba(var(--bg-item-area-inactive-rgb), var(--bg-panel-opacity))!important;
  border-radius: 16%; 
  font-size:1.9rem; 
}
/* */ 
.list_item_control_upgrade_3{
   /*icon类型通过这里设置背景和前景颜色来区分*/
  background-color: rgba(var(--bg-white-rgb), var(--bg-panel-opacity))!important; 
  border:1px solid rgb(var(--bg-orange-rgb)); /*边框色*/
  color:rgba(var(--fg-white-rgb), var(--bg-panel-opacity))!important; /*前景色*/   
}
.list_item_internal_control_upgrade_3{
  background-color: rgba(var(--bg-orange-rgb), var(--bg-panel-opacity))!important;;
  border-radius: 16%; 
  font-size:1.9rem;
}

/*没有通行权限的用户类型*/ 
.list_item_orange{
   /*icon类型通过这里设置背景和前景颜色来区分*/
  background-color: rgba(var(--bg-orange-rgb), var(--bg-panel-opacity))!important; /*圆背景色*/
  border:1px solid rgb(var(--bo-dark-gray-rgb)); /*圆边框色*/
  color:rgba(var(--fg-white-rgb), var(--bg-panel-opacity))!important; /*圆前景色*/      
}
/*门lockdown类型*/ 
.list_item_yellow{
   /*icon类型通过这里设置背景和前景颜色来区分*/
  background-color: rgba(var(--bg-yellow-rgb), var(--bg-panel-opacity))!important; /*圆背景色*/
  border:1px solid rgb(var(--bo-dark-gray-rgb)); /*圆边框色*/
  color:rgba(var(--fg-dark-gray-rgb), var(--bg-panel-opacity))!important; /*圆前景色*/      
}
/*防拆报警Tamper Alarm类型*/ 
.list_item_blue{
   /*icon类型通过这里设置背景和前景颜色来区分*/
  background-color: rgba(var(--bg-blue-rgb), var(--bg-panel-opacity))!important; /*圆背景色*/
  border:1px solid rgb(var(--bo-dark-gray-rgb)); /*圆边框色*/
  color:rgba(var(--fg-white-rgb), var(--bg-panel-opacity))!important; /*圆前景色*/      
}
/*防拆报警Tamper Alarm类型*/ 
.list_item_white{
   /*icon类型通过这里设置背景和前景颜色来区分*/
  background-color: rgba(var(--bg-white-rgb), var(--bg-panel-opacity))!important; /*圆背景色*/
  border:1px solid rgb(var(--bo-dark-gray-rgb)); /*圆边框色*/
  color:rgba(var(--fg-dark-gray-rgb), var(--bg-panel-opacity))!important; /*圆前景色*/      
}
/*禁用的用户类型*/ 
.list_item_inactive{
   /*icon类型通过这里设置背景和前景颜色来区分*/
  background-color: rgba(var(--bg-light-gray-rgb), var(--bg-panel-opacity))!important; /*圆背景色*/
  border:1px solid rgb(var(--bo-dark-gray-rgb)); /*圆边框色*/
  color:rgba(var(--fg-dark-gray-rgb), var(--bg-panel-opacity))!important; /*圆前景色*/     
}
.list_item_inactive_2{
   /*icon类型通过这里设置背景和前景颜色来区分*/
  background-color: rgba(var(--bg-gray-rgb-3), var(--bg-panel-opacity))!important; /*圆背景色*/
  border:1px solid rgb(var(--bo-dark-gray-rgb)); /*圆边框色*/
  color:rgba(var(--fg-gray-rgb-2), var(--bg-panel-opacity))!important; /*圆前景色*/     
}
/*项目出现未知错误*/ 
.list_item_trouble{
   /*icon类型通过这里设置背景和前景颜色来区分*/
  background-color: rgba(var(--bg-light-gray-rgb), var(--bg-panel-opacity))!important; /*圆背景色*/
  border:1px solid rgb(var(--bo-dark-gray-rgb)); /*圆边框色*/
  color:rgba(var(--fg-red-rgb), var(--bg-panel-opacity))!important; /*圆前景色*/     
}
/**/ 
.list_item_lockdown{
   /*icon类型通过这里设置背景和前景颜色来区分*/
  background-color: rgba(var(--bg-yellow-rgb), var(--bg-panel-opacity))!important; /*圆背景色*/
  border:1px solid rgb(var(--bo-dark-gray-rgb)); /*圆边框色*/
  color:rgba(var(--fg-red-rgb), var(--bg-panel-opacity))!important; /*圆前景色*/     
}
/*过期的用户类型*/ 
.list_item_red{
   /*icon类型通过这里设置背景和前景颜色来区分*/
  background-color: rgba(var(--bg-red-rgb), var(--bg-panel-opacity))!important; /*圆背景色*/
  border:1px solid rgb(var(--bo-dark-gray-rgb)); /*圆边框色*/
  color:rgba(var(--fg-white-rgb), var(--bg-panel-opacity))!important; /*圆前景色*/     
}
.list_item .item_text_panel {
  flex: 1 1 auto;
  margin-left:5px;
  overflow:hidden;
  text-overflow: ellipsis;
   -webkit-user-select: none; /* Safari/Chrome */
   -moz-user-select: none;    /* Firefox */
   -ms-user-select: none;     /* IE/Edge */
   user-select: none;         /* 标准语法 */
}
.list_item .item_text_panel .text {
    display: inline; 
    white-space: nowrap;
    font-weight: 500;
    color:#000000;
}
.list_item .item_text_panel .cur_edit_item_style{
    display: inline; 
    white-space: nowrap;
    font-weight: 500;
    color:rgba(var(--fg-logo-blue-rgb));
}
.list_item .item_text_panel .sub_text {
    display: inline; 
    white-space: nowrap;
    font-size: 0.8em;
    color:#000000;
}
.list_item_sm .item_text_panel {
  flex: 1 1 auto;
  margin-left:5px;
  overflow:hidden;
  text-overflow: ellipsis;
   -webkit-user-select: none; /* Safari/Chrome */
   -moz-user-select: none;    /* Firefox */
   -ms-user-select: none;     /* IE/Edge */
   user-select: none;         /* 标准语法 */
}

.list_item .list_item_setting {
  flex: 0 0 auto;
  margin-left: auto;
  align-content: right;
}
/*用户样式 结束*/