/* AVDB - avstar card (theme-friendly version) */

/* 卡片外框：用主題變數，不硬編碼顏色 */
.avstar-card{
  max-width:1100px;
  margin:16px auto;
  padding:24px;
  border:1px solid var(--colorBorder);
  border-radius:16px;
  background:var(--colorLight);
  color:inherit; /* 跟隨主題文字色 */
  box-shadow:0 6px 20px rgba(0,0,0,.06);
}
.avstar-card--block{display:block}
.avstar-card-empty{opacity:.6}

/* 版面配置（維持原本兩欄） */
.avstar-grid{
  display:grid;
  grid-template-columns:260px 1fr;
  gap:24px;
  align-items:start;
}
@media (max-width:980px){
  .avstar-card{padding:16px}
  .avstar-grid{grid-template-columns:1fr; row-gap:16px}
}

/* 側欄：頭像 & 社群 */
.avstar-headshot{
  width:100%;
  border-radius:8px;
  overflow:hidden;
  background:var(--colorBackground);
}
.avstar-headshot img{width:100%; height:auto; display:block}

.avstar-sns{display:flex; gap:8px; margin-top:12px; padding:0; list-style:none}
.avstar-sns li{display:inline-block}
.avstar-sns a{
  display:inline-flex; align-items:center; justify-content:center;
  width:40px; height:40px; border-radius:8px;
  background:var(--colorBackground);
  border:1px solid var(--colorBorder);
  color:var(--colorDarkMuted);
  text-decoration:none;
}
.avstar-sns a:hover{opacity:.85}
.avstar-sns a svg{width:18px;height:18px;fill:currentColor} /* icon 跟著文字色 */

/* Facts / Names 外框 */
.avstar-facts,
.avstar-names{
  margin-top:12px;
  border:1px solid var(--colorBorder);
  background:var(--colorLight);
  border-radius:6px;
  padding:8px;
  text-align:initial !important; /* 避免父層 text-align 影響 */
}

/* 單列：嚴格兩欄（左 3.5em／右自適應） */
.avstar-card .avstar-facts > .row,
.avstar-card .avstar-names > .row{
  display:grid !important;
  grid-template-columns:3.5em 1fr !important;
  align-items:start;
  justify-items:start;
  gap:.25rem;
  padding:6px 8px;
  border-bottom:1px dashed var(--colorBorder);
  font-size:14px;
}
.avstar-card .avstar-facts > .row:last-child,
.avstar-card .avstar-names > .row:last-child{border-bottom:0}

/* 固定左右欄位，全部靠左 */
.avstar-card .avstar-facts > .row > span,
.avstar-card .avstar-names  > .row > span{
  grid-column:1 !important;
  text-align:left !important;
  font-weight:600;
  margin:0 !important;
  white-space:nowrap; overflow:hidden; text-overflow:ellipsis;
}
.avstar-card .avstar-facts > .row > strong,
.avstar-card .avstar-names  > .row > strong{
  grid-column:2 !important;
  text-align:left !important;
  justify-self:start !important;
  margin:0 !important; padding:0 !important;
}

/* Traits 標籤 */
.avstar-traits{margin-top:10px}
.avstar-traits .chip{
  display:inline-block; padding:4px 8px; margin:4px;
  border-radius:999px;
  background:var(--colorBackground);
  font-size:12px; color:var(--colorDarkMuted); text-decoration:none;
}

/* 主要內容標題 & 簡介 */
.avstar-section-title{font-size:26px; margin:0 0 10px; font-weight:700}
.avstar-bio{
  background:var(--colorLight);
  border:1px solid var(--colorBorder);
  border-radius:8px;
  padding:14px; margin-bottom:16px;
}

/* Badge ─ 依賴主題變數 */
.avdb-badge{
  display:inline-block;
  padding:0 .5em;
  line-height:1.6;
  border-radius:.5rem;
  border:1px solid var(--colorBorder);
  background:var(--colorBackground);
  font-weight:700;
  font-size:.85em; /* 可要可不要 */
}

/* 暗色模式：主題在 body 會加 .i */
.i .avdb-badge{
  background:rgba(var(--colorLightRGB), .06);
  border-color:rgba(var(--colorLightRGB), .15);
  color:var(--colorLight);
}

