@import url("bootstrap.min.css");
@import url("typo.css");
@import url("tables.css");

code{ color:#1abc9c; }
html{ background:#eee; }
body{ 
	width:90%; 
	max-width: 960px; 
	background:#fff; 
	margin:3em auto 0; 
	padding-top:2em;
	border:1px solid #ddd;
	border-width:0 1px;
	font-size: 16px;
}
blockquote{font-size:16px;}
pre{white-space:pre-wrap;}

i.serif{ text-transform:lowercase; color:#1abc9c; }
:-moz-any(h1, h2, h3, h4, h5, h5) i.serif{ text-transform: capitalize; }
i.serif:hover{ color:inherit; }

#wrapper{ padding:5% 10%; position:relative;}
#tagline{ color:#999; font-size:1em; margin:-2em 0 2em; padding-bottom:2em; border-bottom:3px double #eee; }
#fork{ position:fixed; top:0; right:0; _position:absolute; }
#table{ margin-bottom:2em; color:#888; }
#github{ position:absolute;top:1em;}
#github iframe{ display:inline;margin-right:1em; }

@media only screen and (max-width: 640px) {
  table{ word-break:break-all;word-wrap:break-word;font-size:12px; }
  .typo table th, .typo table td, .typo-table th, .typo-table td .typo table caption {
	padding: 0.5em;
  }
  #fork{ display:none; }
}

.chat-me{ color:#1abc9c; }
.chat-hint{ color:#6b5d6e; background-color: rgb(255, 244, 196);}
.chat-gpt{ color:#17201e; }
.chat-server{ color:#451abc; }
.chat-voice{ color:#230041; }
.chat-reasoning{ color:#6a5bf8; font-size: small;}

.circle-btn {
  border-radius: 50%;
  width: 50px;
  height: 50px;
  font-size: x-large;
}

.prompt-container {
	border: 1px solid black; /* 细边框 */
	padding: 10px;
	box-sizing: border-box;
}

.prompt-top-part {
	width: 100%; /* 宽度占满 */
	height: auto; /* 高度自动 */
	/* 添加任何需要的样式 */
}

.prompt-bottom-part {
	display: flex; /* 使用flex布局 */
	align-items: center;
}

.prompt-bottom-part button {
	background-color: transparent; /* 透明背景 */
	border: none; /* 无边框 */
	cursor: pointer; /* 手形光标 */
}

.prompt-bottom-part button img {
	width: 24px; /* 图标大小 */
	height: 24px;
}

.prompt-bottom-part textarea {
	flex-grow: 1; /* textarea占满剩余空间 */
	margin: 0 10px; /* 与按钮之间的间隔 */
	resize: none; /* 禁止调整大小 */
	border: none; /* 无边框 */
}
.prompt-bottom-part textarea:focus {
    outline: none; /* 聚焦时无轮廓线 */
}

.model_cost {
	color: #00cb00;
}
.model_powerful {
	color: blueviolet;
}
.model_not_recommend {
	color: lightgrey;
}

.invalid {
	text-decoration: line-through;
}

.copy_button {
	width: 20px;  
	height: 20px; 
	padding: 2px;
	background-color: white;  /* 设置按钮的背景颜色 */
	border: none;  /* 移除按钮的默认边框 */
	cursor: pointer;  /* 鼠标悬停时显示手型光标 */
	fill: darkgray;  /* 设置 SVG 图标的颜色 */
}

/* 设置 SVG 的大小 */
.copy_button svg {
	width: 100%;  /* 让 SVG 图标占满按钮 */
	height: 100%; /* 让 SVG 图标占满按钮 */
}

.ratio-container {
	display: flex;
	align-items: center;
	gap: 10px; /* 设置选项之间的间距 */
}

.ratio-option {
	display: flex;
	align-items: center;
}

.ratio-box {
	display: inline-block;
	border: 1px solid #000;
	margin: 0 2px;
}

.box-0-0 {
	border: none; /* 不显示边框 */
	width: 0px;
	height: 0px;
}

.box-16-9 {
	width: 32px;
	height: 18px;
}

.box-3-2 {
	width: 32px;
	height: 21px;
}

.box-4-3 {
	width: 32px;
	height: 24px;
}

.box-1-1 {
	width: 30px;
	height: 30px;
}

.box-3-4 {
	width: 24px;
	height: 32px;
}

.box-2-3 {
	width: 21px;
	height: 32px;
}

.box-9-16 {
	width: 18px;
	height: 32px;
}

think {
	color:#18a90b;
	font-size: small;
}