:root {
  /* 基础颜色 */
  --my-site-green: #4caf50;
  /* 主色-清新绿 */
  --my-site-green-rgb: 76, 175, 80;
  --my-family: #ffc000;
  /* 家庭-琥珀橙 */
  --my-family-rgb: 255, 192, 0;
  --my-school: #74c5b4;
  /* 学校-薄荷蓝 */
  --my-school-rgb: 116, 197, 180;
  --my-social: #cfa9ca;
  /* 社会-浅藕紫 */
  --my-social-rgb: 207, 169, 202;
  --nanhai: #00bcd4;
  /* 男孩-天空蓝 */
  --nanhai-rgb: 0, 188, 212;
  --nvhai: #ff6b9e;
  /* 女孩-樱花粉 */
  --nvhai-rgb: 255, 107, 158;

  /* 品格分类色*/
  --tansuo: #3a7bd5;
  /* 探索-深海蓝 */
  --tansuo-rgb: 58, 123, 213;
  --xingdong: #ff5252;
  /* 行动-烈焰红 */
  --xingdong-rgb: 255, 82, 82;
  --lianjie: #6A5ACD;
  /* 联结-石板蓝紫 */
  --lianjie-rgb: 106, 90, 205;
  --xinzhi: #00CC99;
  /* 心智-海蓝宝石 */
  --xinzhi-rgb: 0, 204, 153;
}

  /* 自定义btn-primary鼠标悬停颜色 */
  .btn-primary:hover {
    background-color: #388e3c !important;
    border-color: #388e3c !important; /* 比 #4caf50 更深的绿色 */
  }


/* 可调节的呼吸灯类 */
.breth {
  --breathing-color: currentColor;
  --breathing-size: 5px;
  --breathing-duration: 2s;
  --breathing-rgb: 0, 0, 0;
  /* 新增：定义RGB颜色值 */

  position: relative;
}

.breth::after {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  border-radius: inherit;
  animation: pulse var(--breathing-duration) infinite;
  pointer-events: none;
}

@keyframes pulse {
  0% {
    box-shadow: 0 0 0 0 rgba(var(--breathing-rgb), 0.7);
  }

  70% {
    box-shadow: 0 0 0 var(--breathing-size) rgba(var(--breathing-rgb), 0);
  }

  100% {
    box-shadow: 0 0 0 0 rgba(var(--breathing-rgb), 0);
  }
}