/* Flex布局基础类 */
.flex { display: flex; }
.flex-column {
  display: flex;
  flex-direction: column; /* 垂直排列子元素 */
  overflow: hidden; /* 防止内容溢出 */
}

/* 垂直方向对齐方式 (Y轴) */
.flex-y-start,
.align-start {
  display: flex;
  align-items: start; /* 子元素顶部对齐 */
}

.flex-y-center,
.align-center {
  display: flex;
  align-items: center; /* 子元素垂直居中 */
}

/* 水平方向对齐方式 (X轴) */
.flex-x-center,
.justify-center {
  display: flex;
  justify-content: center; /* 子元素水平居中 */
}

.flex-x-between,
.justify-between {
  display: flex;
  justify-content: space-between; /* 子元素两端对齐，中间间距平均分布 */
}

.flex-x-around {
  display: flex;
  justify-content: space-around; /* 子元素周围平均分布间距 */
}

/* 弹性占比 */
.flex1 {
  flex: 1; /* 子元素弹性占比为1，即平均分配剩余空间 */
  overflow: hidden; /* 防止内容溢出 */
}

/* 组合类 - 同时定义水平和垂直对齐方式 */
.f-c-c {
  display: flex;
  justify-content: center; /* 水平居中 */
  align-items: center; /* 垂直居中 */
}

.f-b-c {
  display: flex;
  justify-content: space-between; /* 水平两端对齐 */
  align-items: center; /* 垂直居中 */
}

.f-c-e {
  display: flex;
  justify-content: flex-end; /* 水平靠右对齐 */
  align-items: center; /* 垂直居中 */
}

.f-b-e {
  display: flex;
  justify-content: space-between; /* 水平两端对齐 */
  align-items: flex-end; /* 垂直底部对齐 */
}

.f-b-s {
  display: flex;
  justify-content: space-between; /* 水平两端对齐 */
  align-items: stretch; /* 子元素高度拉伸以填充容器 */
}

/* Grid网格布局 */
.g-c-2 {
  display: grid;
  grid-template-columns: repeat(2, 1fr); /* 创建两列等宽的网格 */
  column-gap: 20px; /* 列间距为20px */
}

.g-c-8 {
  display: grid;
  grid-template-columns: 70px 110px 115px 110px 115px 90px 80px; /* 自定义7列宽度 */
  column-gap: 6px; /* 列间距为6px */
}


.overflow-hidden {
  overflow: hidden;
}

.ellipsis {
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}

.inline-block {
  display: inline-block;
}

.navbar-toggler[aria-expanded="true"] .navbar-toggler-icon {
  background-image: url("../img/nav-close.png");
  width: 2rem;
  height: 2rem;
  background-size: cover;
}