/**
 * LuckySong · 共用样式（主样式走 Tailwind CDN，本文件只放 Tailwind 不好表达的少量自定义）
 *
 * 用法：<link rel="stylesheet" href="/assets/site.css">
 *
 * 提供的类（供页面与 ui.js 使用）：
 *   .ls-accordion-panel              FAQ 手风琴内容面板的展开/收起过渡
 *   .ls-accordion-item[data-open]    由 ui.js 的手风琴模块维护 open 状态
 *   .ls-highlight                    问卷 ?for= 参数命中选项的高亮（partner/parents）
 *   .ls-spinner                      loading 转圈（配合 Tailwind 尺寸类使用）
 *   .ls-fade-in                      区块入场淡入
 *   .ls-countdown-bar                等待页倒计时条
 */

/* FAQ 手风琴：ui.js 切换 [data-open]，面板用 max-height 过渡 */
.ls-accordion-panel {
  overflow: hidden;
  max-height: 0;
  transition: max-height 0.25s ease-in-out;
}
.ls-accordion-item[data-open="true"] .ls-accordion-panel {
  max-height: 20rem;
}
.ls-accordion-item[data-open="true"] .ls-accordion-chevron {
  transform: rotate(180deg);
}
.ls-accordion-chevron {
  transition: transform 0.2s ease-in-out;
}

/* 问卷场景预选高亮（?for=partner / parents 命中但未选中的选项） */
.ls-highlight {
  outline: 2px solid #f97316;
  outline-offset: 2px;
  border-radius: 0.5rem;
}

/* loading 转圈 */
.ls-spinner {
  display: inline-block;
  border: 2px solid currentColor;
  border-right-color: transparent;
  border-radius: 9999px;
  width: 1em;
  height: 1em;
  animation: ls-spin 0.6s linear infinite;
  vertical-align: -0.125em;
}
@keyframes ls-spin {
  to { transform: rotate(360deg); }
}

/* 区块入场淡入 */
.ls-fade-in {
  animation: ls-fade-in 0.3s ease-in;
}
@keyframes ls-fade-in {
  from { opacity: 0; transform: translateY(4px); }
  to { opacity: 1; transform: none; }
}

/* 等待页倒计时条（配色走 Tailwind，这里只管语义化标记，无样式需求时保持空壳亦可） */
.ls-countdown-bar {
  font-variant-numeric: tabular-nums;
}