.grid_quote {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 20px;
	width: 100%;
	height: 100%;
	border-radius: 10px;
	position:relative;
  }

  .grid_quote::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
	border-radius:10px;
	/* background: #fef9c3; */
	background: linear-gradient( to top left, #fdfcc4,#fff);
	/* background: url('https://picsum.photos/id/830/5000/3333') center/cover; */
	/* background: url('https://picsum.photos/id/756/5000/3333') center/cover; */
	/* background: url('https://picsum.photos/id/450/4288/2848') center/cover; */
	/* background: url('https://picsum.photos/id/313/3888/2592') center/cover; */
	/* background: url('https://picsum.photos/id/206/2880/1800') center/cover; */
	/* background: url('https://picsum.photos/id/185/3995/2662') center/cover; */
    /* background: url('https://picsum.photos/1200/800?grayscale') center/cover; */
	/* background: url('https://picsum.photos/500/1200?grayscale') center/cover; */
    /* opacity: 0.1;  */
    z-index: -1; /* 将伪元素置于内容下方 */
  }
  
  #grid_quote_show {
	position: relative;
	overflow-x:auto;
	height: 100%;
	padding:0 2em;
	/* background: url('https://picsum.photos/1200/800?grayscale') center/cover; */
	/* opacity: 0.3; */
	/* padding: 20px; */
	/* border-radius: 10px; */
	/* box-shadow: 0 0 10px rgba(0,0,0,0.1); */
  }
  
  #grid_quote_status {
	position: relative;
	overflow: hidden;
	height: 100%;
	/* border-left:solid 1px rgb(202, 198, 198); */
	/* padding:20px; */
	/* background: rgba(255,255,255,0.1); */
	/* border-radius: 10px; */
	/* box-shadow: 0 0 10px rgba(0,0,0,0.1); */
  }
  #grid_quote_status::after {
    content: '';
    position: absolute;
    top: 5%;
    left: 0;
    width: 100%;
    height: 90%;
	
	background:#fff;
	/* background: rgb(254, 255, 212); */
    opacity: 0.5; /* 设置透明度 */
    z-index: -1; /* 将伪元素置于内容下方 */
  }
  
  .carousel-container {
	position: relative;
	width: 100%;
	height: 100%;
	overflow: hidden;
  }
  
  .carousel-inner {
	display: flex;
	align-items: center;
	height: 100%;
	transition: transform 0.5s ease;
  }
  
  .carousel-item {
	flex: 0 0 100%;
	display: flex;
	position:relative;
	/* height: 100%;  */
  }

  .carousel-item > .quote_icon{
	flex: 0 0 70px;       /* 不放大、不缩小，固定 70px */
	width: 70px;
	height: 70px;
	align-self: flex-start; /* 覆盖父容器的 align-items: center，单独设置顶端对齐 */
  }


  .carousel-item > .quote-text{
	flex: 1 1 0;          /* 占剩余全部宽度 */
	padding-left: 10px;
  }
 
  .carousel-item .quote_site{
	color:#5b9af8;
	font-size: 1.2em;
  }
 
  .carousel-item .quote_content{
	margin-top: 10px;
  }

  .carousel-item > .quote_like{
	top:-5%;
	right:20px;
  }

  #grid_quote_status .carousel-item {
	height: 100%; 
  }

  #grid_quote_status  .carousel-inner{
	
  }

	#grid_quote_status .carousel-link{
    	display: flex;               /* 让子元素排成一行 */
		flex-wrap: wrap;             /* 空间不够就换行 */
		justify-content: flex-start; /* 左对齐（默认就是，写出来易读） */
		gap: 5px 0;                  /* 行间距 5px，列间距由子元素自己留 5px 即可 */
		font-size: 0;                /* 去掉行内块之间的空白字符间隙 */
		overflow-y: auto;            /* 垂直方向可滚动 */
		overflow-x: hidden;          /* 水平方向隐藏滚动条 */
		padding-top: 5%;
		max-height: 95%;            /* 限制最大高度 */
		/* background-color: #fecdd3; */

		-ms-overflow-style: none;          /* IE 10+ */
    	scrollbar-width: none;             /* Firefox 64+ */
	}
	
	/* Webkit浏览器滚动条样式 */
	#grid_quote_status .carousel-link::-webkit-scrollbar {
		display: none;                     /* Chrome Safari Edge */
	}
	
	#grid_quote_status .carousel-link::-webkit-scrollbar-track {
		background: #f1f5f9;         /* 滚动条轨道背景 */
		border-radius: 1px;
	}
	
	#grid_quote_status .carousel-link::-webkit-scrollbar-thumb {
		background: #cbd5e1;         /* 滚动条滑块颜色 */
		border-radius: 1px;
	}
	
	#grid_quote_status .carousel-link::-webkit-scrollbar-thumb:hover {
		background: #94a3b8;         /* 鼠标悬停时滚动条滑块颜色 */
	}
	#grid_quote_status .carousel-link > a{
		margin: 0 4px 2px 0;   /* 只留左、下边距，上边距交给父级 gap */
		height: 35px;
		display: inline-flex;
		align-items: center;
		/* min-width: 100px; */
		/* max-width: 300px; */
		border-radius: 10px;
		/* background: #ff6d6d; */
		font-size: 13px;      /* 把字体大小重新写回来 */
		text-decoration: none;
		white-space: nowrap;
		overflow: hidden;
		text-overflow: ellipsis;
	}

	#grid_quote_status .carousel-link > a > img{
		height: 20px;
		width: 20px;
		display: inline-block;
		vertical-align: middle;
		object-fit: contain;
		margin-left:8px;
	}
	#grid_quote_status .carousel-link > a > span{
		display: inline-block;
		vertical-align: middle;
		line-height: normal;
		white-space: nowrap;
		overflow: hidden;
		text-overflow: ellipsis;
		padding-left:5px;
		padding-right:10px;
	}
  
  .quote-text {
	/* line-height: 1.6; */
	/* font-size: 1.2em; */
	/* color:#be123c; */
	/* color: #1e509c; */
	/* color: rgba(0,0,0,0.6); */
	/* font-weight: bold; */
	/* color:#ec4899; */
	/* font-style: italic; */
  }
  
  .quote-author {
	margin-top: 15px;
	display:flex;
	align-items: center;
	justify-content: flex-end;
	/* font-size: 1em; */
	/* font-weight: bold; */
  }
  .quote-author .line{
	width: 80px;
	height: 1px;
	background-color: #fecdd3;
	margin-right: 10px;
  }
  .quote-author-avatar{ 
	width:30px; 
	height:30px; 
	border-radius:50%; 
	margin-right:10px; 
  }

  .quote-author .quote-author-alias{
	font-size:1.1em;
	color:#bd1c44;
	/* color: #3c75cc; */
  }
  
  .carousel-control {
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
	background: rgba(0,0,0,0.5);
	color: white;
	border: none;
	padding: 10px;
	cursor: pointer;
	z-index: 10;
	border-radius: 50%;
	width: 40px;
	height: 40px;
	display: flex;
	align-items: center;
	justify-content: center;
  }
  
  .carousel-control.prev {
	left: 10px;
  }
  
  .carousel-control.next {
	right: 10px;
  }
  
  @media (max-width: 768px) {
	.grid_quote {
	  grid-template-columns: 1fr;
	}
	#grid_quote_status {
	  display: none;
	}
  }