:root {
  --norush-background-color: #e0f7fa; /* 定义新的 CSS 变量 */
  --norush-hover-color-1: #f4d10c87;
  --norush-background-color-1: #ecf9fb; /* 定义新的 CSS 变量 */
  --norush-button-download-background-color-1:#007bff71;
}


body {
    font-family: Arial, sans-serif;
    position: relative; /* 使其相对定位 */
    overflow: hidden;   /* 防止内容溢出 */
    background-color: #fafafa !important;
    
   
    overflow-y: auto; /* 超出内容时显示垂直滚动条 */
    border: 1px solid #ccc; /* 可选：边框样式 */
    padding: 10px; /* 可选：内边距 */
}


  .btn-toggle {
    padding: .25rem .5rem;
    font-weight: 600 !important;
    color: var(--bs-emphasis-color);
    background-color: transparent;
  }
  .btn-toggle:hover,
  .btn-toggle:focus {
    color: rgba(var(--bs-emphasis-color-rgb), .85);
    background-color: var(--norush-background-color);
  }
  
  .btn-toggle::before {
    width: 1.25em;
    line-height: 0;
    content: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 16 16'%3e%3cpath fill='none' stroke='rgba%280,0,0,.5%29' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M5 14l6-6-6-6'/%3e%3c/svg%3e");
    transition: transform .35s ease;
    transform-origin: .5em 50%;
  }
  
  [data-bs-theme="dark"] .btn-toggle::before {
    content: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 16 16'%3e%3cpath fill='none' stroke='rgba%28255,255,255,.5%29' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M5 14l6-6-6-6'/%3e%3c/svg%3e");
  }
  
  .btn-toggle[aria-expanded="true"] {
    color: rgba(var(--bs-emphasis-color-rgb), .85);
  }
  .btn-toggle[aria-expanded="true"]::before {
    transform: rotate(90deg);
  }
  
  .btn-toggle-nav a {
    padding: .1875rem .5rem;
    margin-top: .125rem;
    margin-left: 1.25rem;
  }
  .btn-toggle-nav a:hover,
  .btn-toggle-nav a:focus {
    background-color: var(--norush-background-color);
  }
  
  .scrollarea {
    overflow-y: auto;
  }
  




  .products-container{
    display: grid;
    grid-template-columns: 1fr 1fr 1fr 1fr 1fr;
    padding-top: 40px;
    padding-bottom: 8px;
    width: 95%;
    gap: 10px;
}

.card{
  border-radius: 8px;
  overflow: hidden;
  align-items: center;
  cursor: pointer; /* 使其看起来像按钮 */
  transition: transform 0.2s; /* 添加过渡效果 */
}

.card:hover {
  transform: scale(1.05); /* 鼠标悬停时放大 */
  background-color: var(--norush-hover-color-1); /* 鼠标悬停时改变背景颜色 */
}

.down-container{
  display: flex;
  flex-direction: column; /* 设置为纵向排列 */
  justify-content: space-between; /* 在垂直方向上两端分布 */
  background-color:  var(--norush-background-color-1);
  padding-top: 16px;
  padding-left: 16px;
  padding-right: 16px;
  width: 100%; /* 设置宽度为父元素的100% */
}


.norush-card-body{
  padding-left: 0px;
  padding-right: 0px;
  padding-top: 0px;
  padding-bottom: 16px;
  justify-content: space-between; /* 在主轴上分配空间，元素之间均匀分布 */
  align-items: center; /* 垂直居中对齐 */
}


.category {
  display: inline-block; /* 使其成为块级元素，以便能够设置宽度和高度 */
  background-color: var(--norush-button-download-background-color-1); /* 按钮的背景颜色 */
  color: black; /* 字体颜色 */
  padding: 5px 15px; /* 上下和左右的内边距 */
  border: none; /* 去掉边框 */
  border-radius: 5px; /* 圆角边框 */
  text-align: center; /* 文本居中对齐 */
  cursor: pointer; /* 鼠标悬停时显示为指针 */
  text-decoration: none; /* 去掉文本下划线 */
  transition: background-color 0.3s; /* 添加过渡效果 */
}


.filter-result{
  margin-bottom: -40px;
  padding-bottom: 10px;
}

.filter-result span{
  margin-left: 10px;
  margin-right: 10px;
  background-color: var(--norush-background-color) !important;
  color:black !important;
}


.active {
  background-color: var(--norush-background-color); /* 选中的背景颜色 */
  color: #007bff; /* 选中的文本颜色 */
}





.contents-container{
  display: flex;

}


.right-container{
  margin-left: 50px; 
  display: flex;
  flex-grow: 1;
  background-color: white;
}

.left-label{
  padding-left: 10px;
  padding-right: 10px;
  padding-top: 24px;
}

.person-info{
  flex-grow: 1;
}

.info-item{
  padding-top: 24px;
  padding-bottom: 24px;
  padding-left: 30px;
  padding-right: 30px;
  border-bottom: solid rgb(232, 232, 232) 1px;
  display: flex;
  justify-content:space-between;
}


.left-label{
  padding-left: 30px;
}

.item-left{
  flex-grow: 1;
}

.item-right{
  display: flex;
  justify-content:space-between;
  flex-grow: 6;
  padding-right: 20px;

}

.edit{
  color:#1356BD;

  cursor: pointer; /* 鼠标悬停时显示为手型光标 */
  padding: 5px 10px; /* 添加一些内边距 */
  transition: background-color 0.3s, color 0.3s; /* 添加过渡效果 */
}

.edit:hover {
  background-color: #f0f0f0; /* 鼠标悬停时改变背景颜色 */
  color: #007bff; /* 鼠标悬停时改变字体颜色 */
}


/* productmanage.html */
.items-container{
  flex-grow: 1;
}

.item-container{
  display: flex;
  border-bottom: solid rgb(232, 232, 232) 1px;
}

.items-container img{
  height: 105px;
  width: 160px;
}

.text-container{
  width: 100%;
  display: flex;
  flex-direction: column;
}

.title-wrap{
  display: flex;
  justify-content:space-between;  
}

.title-wrap a{
  text-decoration: none;
  color: black;
  font-weight: bold;
  font-size: large;
  
}

.count{
  display:flex;
  list-style-type: none;
  padding-left: 0px;
}

.count li{
  padding-right: 30px;
}

.data-wrap{
  display: flex;
  justify-content:space-between;
}

.product-actions span{
  padding-left: 20px;
  
}

.space-left-right-50{
  padding-left: 50px;
  padding-right: 50px;
}

.space-top{
  padding-top: 50px;
}

/* modal style */
.modal-dialog{
  max-width: 50% !important;
  width: 50% !important;
}

.modal-dialog-custom {
  position: absolute !important;
  right: 0;
}