/* ===== 全局：浅色渐变背景 + 柔和光晕 ===== */
:root {
  --accent: #0ea5e9;
  --accent-2: #8b5cf6;
  --card-bg: rgba(255, 255, 255, 0.72);
  --card-border: rgba(15, 23, 42, 0.07);
  --text-main: #1e293b;
  --text-sub: #64748b;
}

html, body {
  background: #f5f7fb !important;
  color: var(--text-main);
  font-family: -apple-system, BlinkMacSystemFont, "PingFang SC", "Hiragino Sans GB",
    "Microsoft YaHei", "Segoe UI", Roboto, sans-serif !important;
}

body::before {
  content: "";
  position: fixed;
  inset: 0;
  z-index: 0;
  pointer-events: none;
  background:
    radial-gradient(900px 520px at 8% -10%, rgba(14, 165, 233, 0.16), transparent 60%),
    radial-gradient(800px 520px at 100% 0%, rgba(139, 92, 246, 0.14), transparent 60%),
    radial-gradient(700px 500px at 50% 115%, rgba(16, 185, 129, 0.10), transparent 60%);
}

#page_wrapper, #inner_wrapper {
  background: transparent !important;
}

/* 内容区限宽，大屏不再拉得太散 */
#inner_wrapper > .container {
  max-width: 1280px;
}

/* ===== 顶部信息栏 ===== */
#information-widgets {
  margin-top: 2.5rem !important;
  padding: 0.9rem 1.4rem !important;
  border: 1px solid var(--card-border) !important;
  border-radius: 18px !important;
  background: rgba(255, 255, 255, 0.65) !important;
  backdrop-filter: blur(14px);
  -webkit-backdrop-filter: blur(14px);
  box-shadow: 0 10px 30px -14px rgba(15, 23, 42, 0.18);
}

.information-widget-resource .resource-icon {
  color: var(--accent) !important;
}

.information-widget-resource .resource-value,
.information-widget-resource .text-xs {
  color: var(--text-main) !important;
  font-variant-numeric: tabular-nums;
}

.information-widget-label {
  color: var(--text-sub) !important;
  letter-spacing: 0.08em;
}

/* 资源进度条：渐变色 */
.resource-usage {
  height: 5px !important;
  background: rgba(15, 23, 42, 0.08) !important;
  overflow: hidden;
}
.resource-usage > div {
  height: 5px !important;
  background: linear-gradient(90deg, var(--accent), var(--accent-2)) !important;
}

/* ===== 分组标题 ===== */
.services-group {
  margin-top: 1.2rem;
}

.service-group-name {
  position: relative;
  padding-left: 0.85rem;
  font-size: 1.15rem !important;
  font-weight: 600 !important;
  letter-spacing: 0.06em;
  color: var(--text-main) !important;
}
.service-group-name::before {
  content: "";
  position: absolute;
  left: 0;
  top: 18%;
  bottom: 18%;
  width: 4px;
  border-radius: 4px;
  background: linear-gradient(180deg, var(--accent), var(--accent-2));
}

/* ===== 服务卡片 ===== */
.service-card {
  position: relative;
  display: flex !important;
  flex-direction: column;
  justify-content: center;
  padding: 0.6rem 0.4rem !important;
  border: 1px solid var(--card-border) !important;
  border-radius: 16px !important;
  background: var(--card-bg) !important;
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
  box-shadow: 0 4px 16px -8px rgba(15, 23, 42, 0.15) !important;
  transition: transform 0.2s ease, border-color 0.2s ease, box-shadow 0.2s ease,
    background 0.2s ease;
  overflow: hidden;
}

.service-card:hover {
  transform: translateY(-3px);
  border-color: rgba(14, 165, 233, 0.4) !important;
  background: #ffffff !important;
  box-shadow: 0 14px 30px -12px rgba(14, 165, 233, 0.35) !important;
}

/* 图标：放进圆角方块 */
.service-icon {
  width: 48px !important;
  height: 48px !important;
  min-width: 48px;
  margin: 0 0.4rem 0 0.35rem !important;
  display: flex !important;
  align-items: center;
  justify-content: center;
  border-radius: 12px;
  background: linear-gradient(135deg, #f0f9ff, #f5f3ff);
  border: 1px solid rgba(15, 23, 42, 0.05);
  color: #475569;
  transition: transform 0.2s ease;
}
.service-icon img,
.service-icon svg,
.service-icon > div {
  width: 28px !important;
  height: 28px !important;
}
.service-card:hover .service-icon {
  transform: scale(1.06);
}

/* 图标和文字垂直居中，文字区上下内边距收小，避免图标贴顶、下方留白 */
.service-title {
  align-items: center !important;
}

.service-name {
  padding-top: 0.2rem !important;
  padding-bottom: 0.2rem !important;
  font-size: 1rem !important;
  font-weight: 600 !important;
  color: var(--text-main) !important;
}

.service-description {
  margin-top: 2px;
  font-size: 0.8rem !important;
  color: var(--text-sub) !important;
  opacity: 1 !important;
}

/* 站点监控标签 */
.service-tag,
.site-monitor-status {
  border-radius: 999px !important;
}

/* ===== 页脚 ===== */
#footer, #version {
  color: var(--text-sub) !important;
  opacity: 0.7;
}
#revalidate {
  color: var(--text-sub) !important;
  transition: transform 0.4s ease;
}
#revalidate:hover {
  transform: rotate(180deg);
}

/* ===== 滚动条 ===== */
::-webkit-scrollbar { width: 8px; height: 8px; }
::-webkit-scrollbar-thumb { background: rgba(15, 23, 42, 0.15); border-radius: 8px; }
::-webkit-scrollbar-track { background: transparent; }