/* ============================================================
 * kaimai-theme.css — 开麦广场全站主题变量与基线样式
 * 来源: 从 home-campus-festival-v3.html 抽取 + 新增身份色
 * 单一真相源: 所有页面通过 <link rel="stylesheet"> 引用
 * ============================================================ */

/* ---------- 主题变量层 ---------- */
@layer theme {
  :root {
    /* 基础色板 - 暖色调（音乐节风格） */
    --kaimai-festival-background: #fff8e7;
    --kaimai-festival-foreground: #2d1f0f;
    --kaimai-festival-card: #ffffff;
    --kaimai-festival-card-foreground: #2d1f0f;
    --kaimai-festival-popover: #ffffff;
    --kaimai-festival-popover-foreground: #2d1f0f;
    --kaimai-festival-primary: #ff6b00;
    --kaimai-festival-primary-foreground: #ffffff;
    --kaimai-festival-muted: #f2e8d0;
    --kaimai-festival-muted-foreground: #7a6a55;
    --kaimai-festival-border: #e6dac0;
    --kaimai-festival-input: #ffffff;
    --kaimai-festival-ring: #ff6b00;

    /* 圆角 */
    --kaimai-festival-radius-small: 4px;
    --kaimai-festival-radius-medium: 12px;
    --kaimai-festival-radius-large: 24px;
    --kaimai-festival-radius-sm: 4px;
    --kaimai-festival-radius-md: 12px;
    --kaimai-festival-radius-lg: 24px;

    /* 状态色 */
    --kaimai-festival-state-success: #22c55e;
    --kaimai-festival-state-warning: #eab308;
    --kaimai-festival-state-error: #ef4444;
    --kaimai-festival-state-info: #0ea5e9;

    /* 字体 */
    --kaimai-festival-title: "Bebas Neue", "Noto Sans SC", system-ui, sans-serif;
    --kaimai-festival-body: "Inter", "Noto Sans SC", system-ui, sans-serif;

    /* 身份色（五身份体系） */
    --kaimai-festival-actor: #ff6b00;       /* 演员 = 橙 */
    --kaimai-festival-writer: #10b981;      /* 编剧 = emerald */
    --kaimai-festival-organizer: #2d1f0f;   /* 主办 = 深棕 */
    --kaimai-festival-audience: #a855f7;    /* 衣食父母 = purple */
    --kaimai-festival-vip: #6366f1;         /* 虚拟IP = indigo（新增） */

    /* 风险分级色 */
    --kaimai-festival-risk-low: #22c55e;    /* 低风险-绿 */
    --kaimai-festival-risk-mid: #eab308;    /* 中风险-黄 */
    --kaimai-festival-risk-high: #ef4444;   /* 高风险-红 */
  }

  .dark {
    --kaimai-festival-background: #1f1810;
    --kaimai-festival-foreground: #fff8e7;
    --kaimai-festival-card: #2e2419;
    --kaimai-festival-card-foreground: #fff8e7;
    --kaimai-festival-popover: #2e2419;
    --kaimai-festival-popover-foreground: #fff8e7;
    --kaimai-festival-primary: #ff8533;
    --kaimai-festival-primary-foreground: #2d1f0f;
    --kaimai-festival-muted: #3d3225;
    --kaimai-festival-muted-foreground: #b0a390;
    --kaimai-festival-border: #554936;
    --kaimai-festival-input: #2e2419;
    --kaimai-festival-ring: #ff8533;
  }
}

/* ---------- 语义令牌映射层 ---------- */
@layer tokens {
  :root {
    --color-background: var(--kaimai-festival-background);
    --color-foreground: var(--kaimai-festival-foreground);
    --color-card: var(--kaimai-festival-card);
    --color-card-foreground: var(--kaimai-festival-card-foreground);
    --color-popover: var(--kaimai-festival-popover);
    --color-popover-foreground: var(--kaimai-festival-popover-foreground);
    --color-primary: var(--kaimai-festival-primary);
    --color-primary-foreground: var(--kaimai-festival-primary-foreground);
    --color-muted: var(--kaimai-festival-muted);
    --color-muted-foreground: var(--kaimai-festival-muted-foreground);
    --color-border: var(--kaimai-festival-border);
    --color-input: var(--kaimai-festival-input);
    --color-ring: var(--kaimai-festival-ring);
    --radius-sm: var(--kaimai-festival-radius-small);
    --radius-md: var(--kaimai-festival-radius-medium);
    --radius-lg: var(--kaimai-festival-radius-large);
    --color-radius-sm: var(--kaimai-festival-radius-small);
    --color-radius-md: var(--kaimai-festival-radius-medium);
    --color-radius-lg: var(--kaimai-festival-radius-large);
    --font-title: var(--kaimai-festival-title);
    --font-body: var(--kaimai-festival-body);
  }
}

/* ---------- 基线样式 ---------- */
@layer base {
  body {
    background: var(--kaimai-festival-background);
    color: var(--kaimai-festival-foreground);
  }
  td, th { break-words: break-all; word-break: auto-phrase; }
  th { white-space: nowrap; }
  .font-title { font-family: var(--font-title); }
  .font-body { font-family: var(--font-body); }
}

/* ---------- 语义令牌 Fallback 类 ---------- */
/* 当 Tailwind 浏览器构建未及时处理时的保底样式 */
.bg-background { background-color: var(--kaimai-festival-background); }
.text-background { color: var(--kaimai-festival-background); }
.border-background { border-color: var(--kaimai-festival-background); }
.ring-background { --tw-ring-color: var(--kaimai-festival-background); }
.bg-foreground { background-color: var(--kaimai-festival-foreground); }
.text-foreground { color: var(--kaimai-festival-foreground); }
.border-foreground { border-color: var(--kaimai-festival-foreground); }
.ring-foreground { --tw-ring-color: var(--kaimai-festival-foreground); }
.bg-card { background-color: var(--kaimai-festival-card); }
.text-card { color: var(--kaimai-festival-card); }
.border-card { border-color: var(--kaimai-festival-card); }
.ring-card { --tw-ring-color: var(--kaimai-festival-card); }
.bg-card-foreground { background-color: var(--kaimai-festival-card-foreground); }
.text-card-foreground { color: var(--kaimai-festival-card-foreground); }
.border-card-foreground { border-color: var(--kaimai-festival-card-foreground); }
.ring-card-foreground { --tw-ring-color: var(--kaimai-festival-card-foreground); }
.bg-popover { background-color: var(--kaimai-festival-popover); }
.text-popover { color: var(--kaimai-festival-popover); }
.border-popover { border-color: var(--kaimai-festival-popover); }
.ring-popover { --tw-ring-color: var(--kaimai-festival-popover); }
.bg-popover-foreground { background-color: var(--kaimai-festival-popover-foreground); }
.text-popover-foreground { color: var(--kaimai-festival-popover-foreground); }
.border-popover-foreground { border-color: var(--kaimai-festival-popover-foreground); }
.ring-popover-foreground { --tw-ring-color: var(--kaimai-festival-popover-foreground); }
.bg-primary { background-color: var(--kaimai-festival-primary); }
.text-primary { color: var(--kaimai-festival-primary); }
.border-primary { border-color: var(--kaimai-festival-primary); }
.ring-primary { --tw-ring-color: var(--kaimai-festival-primary); }
.bg-primary-foreground { background-color: var(--kaimai-festival-primary-foreground); }
.text-primary-foreground { color: var(--kaimai-festival-primary-foreground); }
.border-primary-foreground { border-color: var(--kaimai-festival-primary-foreground); }
.ring-primary-foreground { --tw-ring-color: var(--kaimai-festival-primary-foreground); }
.bg-muted { background-color: var(--kaimai-festival-muted); }
.text-muted { color: var(--kaimai-festival-muted); }
.border-muted { border-color: var(--kaimai-festival-muted); }
.ring-muted { --tw-ring-color: var(--kaimai-festival-muted); }
.bg-muted-foreground { background-color: var(--kaimai-festival-muted-foreground); }
.text-muted-foreground { color: var(--kaimai-festival-muted-foreground); }
.border-muted-foreground { border-color: var(--kaimai-festival-muted-foreground); }
.ring-muted-foreground { --tw-ring-color: var(--kaimai-festival-muted-foreground); }
.bg-border { background-color: var(--kaimai-festival-border); }
.text-border { color: var(--kaimai-festival-border); }
.border-border { border-color: var(--kaimai-festival-border); }
.ring-border { --tw-ring-color: var(--kaimai-festival-border); }
.bg-input { background-color: var(--kaimai-festival-input); }
.text-input { color: var(--kaimai-festival-input); }
.border-input { border-color: var(--kaimai-festival-input); }
.ring-input { --tw-ring-color: var(--kaimai-festival-input); }
.bg-ring { background-color: var(--kaimai-festival-ring); }
.text-ring { color: var(--kaimai-festival-ring); }
.border-ring { border-color: var(--kaimai-festival-ring); }
.ring-ring { --tw-ring-color: var(--kaimai-festival-ring); }

/* ---------- 工具类 ---------- */
.no-scrollbar::-webkit-scrollbar { display: none; }
.no-scrollbar { -ms-overflow-style: none; scrollbar-width: none; }

[data-icon] {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  -webkit-mask-size: contain;
  mask-size: contain;
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-position: center;
  mask-position: center;
  background-color: currentColor;
}