/* 醒吾中文教材 共用視覺主題：棕色主色 + 藍色波浪紋裝飾 + 木牌按鈕 + 地標/吉祥物素材 */

:root {
  --xw-brand: #a15c2b;
  --xw-brand-dark: #7a3b12;
  --xw-cream: #fdf6ec;
  --xw-wave-blue: #1f6f8b;
  --xw-wave-blue-light: #4aa9c6;
}

.xw-wave-band {
  background-image: url("../shared/img/wave-pattern.svg");
  background-repeat: repeat;
  background-size: 100px 100px;
  position: relative;
}

.xw-wave-band::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, rgba(31,111,139,0) 55%, rgba(31,111,139,0.95) 100%);
}

.xw-landmark-row {
  display: flex;
  align-items: flex-end;
  justify-content: center;
  gap: 6px;
  position: relative;
  z-index: 2;
}
.xw-landmark-row img { height: 84px; width: auto; }
.xw-landmark-row img.xw-lm-sm { height: 60px; }

.xw-mascot { display: block; }

/* 木牌招牌風格按鈕 / 標籤 */
.xw-wood-btn {
  display: inline-block;
  background: linear-gradient(180deg, #b3792f 0%, #8a5a1f 100%);
  color: #fff8ec;
  border: 3px solid #6b4315;
  border-radius: 10px;
  padding: 10px 18px;
  font-weight: 700;
  text-shadow: 0 1px 1px rgba(0,0,0,0.35);
  box-shadow: 0 3px 0 #5a380f;
}
.xw-wood-btn.xw-active {
  background: linear-gradient(180deg, #e0a94f 0%, #b3792f 100%);
}

/* 彩色圓形圖示徽章 */
.xw-icon-badge {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 40px;
  height: 40px;
  border-radius: 50%;
  font-size: 20px;
  background: var(--xw-brand);
  color: #fff;
  flex-shrink: 0;
}
.xw-icon-badge.xw-badge-blue { background: var(--xw-wave-blue); }
.xw-icon-badge.xw-badge-gold { background: #d9a441; }
.xw-icon-badge.xw-badge-green { background: #4f8f5b; }