/* 内容区域样式 */
.content-container {
    margin-left: 60px;
    padding: 20px;
	margin: 0 auto;
	width: 70%;
	padding: 20px;
    font-size: 16px;
}

.content-container.w70 {
	width: 70%;
}

.content-container img {
    max-width: 100%;
    height: auto;
}

body {
    font-family: 'Lato', 'Microsoft YaHei', 'Noto Sans CJK SC', "微软雅黑", sans-serif;
}

/* Prism 代码块的样式 */
pre[class*="language-"],
code[class*="language-"] {
    background: #f5f2f0;
    border-radius: 0.3em;
    color: #333;
    padding: 0.3em;
    font-family: Consolas, Monaco, 'Andale Mono', 'Ubuntu Mono', monospace;
}

@media (max-width: 768px) {
    .content-container {
        width: 80%;
    }
}

@media (max-width: 1024px) {
    .content-container {
        width: 85%;
    }
}

#author {
	display: flex;
	align-items: center;
}

#meta {
	display: flex;
	justify-content: space-between;
}

pre.line-numbers {
    position: relative;
    padding-left: 3.8em;
    counter-reset: linenumber;
}

/* .shiki { font-size: 1.2em; } */

.code-container {
    position: relative;
    margin-bottom: 20px;
}
pre {
    padding: 10px;
    border-radius: 8px;
    overflow-x: auto;
    counter-reset: line-number;
    background-color: #f5f5f5;
}
.shiki {
    padding: 15px;
    border-radius: 8px;
    background-color: #f5f5f5 !important;
    position: relative;
}
code {
    counter-reset: line-number;
    font-family: 'Fira Code', Consolas, Monaco, 'Andale Mono', 'Ubuntu Mono', monospace;
    font-size: 15px;
}
.shiki span.line::before {
    content: counter(line-number);
    counter-increment: line-number;
    display: inline-block;
    width: 2em;
    margin-right: 10px;
    color: gray;
    text-align: right;
}
/* 复制按钮 */
.copy-btn {
    position: absolute !important;
    top: 10px !important;
    right: 10px !important;
    background: rgba(0, 0, 0, 0.7);
    color: white;
    border: none;
    padding: 5px 10px;
    font-size: 12px;
    border-radius: 5px;
    cursor: pointer;
    opacity: 0.7;
    transition: opacity 0.3s;
	display: inline-block !important;
}
.copy-btn:hover {
    opacity: 1;
}
.copy-btn:active {
    background: rgba(0, 0, 0, 0.9);
}

pre, code {
    tab-size: 4; /* 将 Tab 显示为 4 个空格的宽度 */
    -moz-tab-size: 4; /* 兼容 Firefox */
    -o-tab-size: 4; /* 兼容老版本 Opera */
}

a {
    text-decoration: none;
}

.ui.glowing-gold.label {
  color: white;
  background: linear-gradient(135deg, 
    rgba(255, 215, 0, 1) 43%, 
    rgba(255, 215, 0, 0.3) 50%, 
    rgba(255, 215, 0, 1) 57%);
  animation: glowing-background 3s ease-in-out infinite;
  background-size: 250% 250%;
  box-shadow: 0 0 20px rgba(255, 215, 0, 0.8);
  transition: box-shadow 0.3s ease-in-out, background 0.3s ease-in-out;
}

.ui.glowing-gold.label:hover {
  color: white;
  background: linear-gradient(135deg, 
    rgb(245, 208, 0) 43%, 
    rgba(245, 208, 0, 0.3) 50%, 
    rgb(245, 208, 0) 57%);
  animation: glowing-background 3s ease-in-out infinite;
  background-size: 250% 250%;
  box-shadow: 0 0 30px rgba(245, 208, 0, 0.8);
  transition: box-shadow 0.3s ease-in-out, background 0.3s ease-in-out;
}

@keyframes glowing-background {
  0% {
    background-position: 0% 0%;
  }
  100% {
    background-position: 100% 100%;
  }
}
