/* ═══════════════════════════════════════════════════════════
   Aqua Fav v1 · 收藏胶囊 / 个人中心收藏列表 / 轻提示
   造型语言跟着卡片底部现有的动作条走（同宽同圆角同玻璃描边），
   这样「收藏」摆在「在线观看 / 站内直接下载 / 夸克网盘下载」旁边不像外来件。
   已收藏态用本站主蓝实填，未收藏态保持玻璃空心——不靠颜色也能靠文案分辨。
   ═══════════════════════════════════════════════════════════ */

.fav-btn {
  display: inline-flex; align-items: center; gap: 6px;
  padding: 7px 14px; border-radius: var(--r-pill, 999px);
  border: 1px solid rgba(255, 255, 255, .9);
  background: linear-gradient(140deg, rgba(255, 255, 255, .76), rgba(214, 234, 255, .44));
  box-shadow: 0 10px 24px rgba(26, 73, 196, .1), inset 0 1px 0 #fff;
  color: var(--azure-deep, #1a49c4);
  font: inherit; font-size: 12px; font-weight: 900; letter-spacing: .05em;
  cursor: pointer; -webkit-appearance: none; appearance: none;
  transition: transform .5s var(--e-expo, cubic-bezier(.16, 1, .3, 1)),
    box-shadow .5s var(--e-expo, cubic-bezier(.16, 1, .3, 1)),
    background .45s ease, color .45s ease;
}
.fav-btn:hover {
  transform: translateY(-3px); background: rgba(255, 255, 255, .86);
  box-shadow: 0 16px 30px rgba(26, 73, 196, .2), inset 0 1px 0 #fff;
}
.fav-btn:active { transform: translateY(-1px) scale(.985); }
.fav-btn:focus-visible {
  outline: 2px solid var(--azure, #2f6cf6); outline-offset: 3px;
}

.fav-ico { width: 14px; height: 14px; flex: none; display: block; }
.fav-mark {
  fill: none; stroke: currentColor; stroke-width: 1.7;
  stroke-linejoin: round; stroke-linecap: round;
  transition: fill .4s ease;
}

/* 已收藏：主蓝实填，书签里的缺口反白成一条光，一眼看出这条已经收了 */
.fav-btn[aria-pressed="true"] {
  color: #fff; border-color: rgba(255, 255, 255, .96);
  background: linear-gradient(140deg, var(--sky, #4fb2f0), var(--azure, #2f6cf6) 58%, var(--azure-deep, #1a49c4));
  box-shadow: 0 14px 30px rgba(26, 73, 196, .3), inset 0 1px 0 rgba(255, 255, 255, .5);
}
.fav-btn[aria-pressed="true"] .fav-mark { fill: currentColor; }

/* 请求在途：文案在换，图标轻轻呼吸；不置灰，避免被读成「这个功能不能点」 */
.fav-btn[data-busy] { pointer-events: none; }
.fav-btn[data-busy] .fav-ico { animation: favPulse 1.05s var(--e-expo, ease) infinite; }
@keyframes favPulse {
  0% { transform: scale(1); opacity: .55; }
  50% { transform: scale(1.16); opacity: 1; }
  100% { transform: scale(1); opacity: .55; }
}

/* ── 个人中心：一行一条收藏 ── */
.fav-list { display: grid; gap: 12px; margin-top: 16px; }
.fav-row {
  display: flex; align-items: center; gap: 16px;
  padding: 16px 18px; border-radius: 18px;
  background: linear-gradient(150deg, rgba(255, 255, 255, .6), rgba(206, 228, 255, .34));
}
.fav-row-main { flex: 1 1 auto; min-width: 0; }
.fav-name { margin: 0; font-size: 16px; font-weight: 900; letter-spacing: .01em; }
.fav-sum {
  margin: 6px 0 0; font-size: 12.5px; line-height: 1.7; opacity: .8;
  display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden;
}
.fav-meta { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 8px; font-size: 11.5px; opacity: .72; }
.fav-kind {
  padding: 3px 10px; border-radius: var(--r-pill, 999px);
  border: 1px solid rgba(255, 255, 255, .9); background: rgba(255, 255, 255, .5);
  font-weight: 800; letter-spacing: .06em; opacity: 1;
}
.fav-rows { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 12px; }
.fav-link, .fav-note, .fav-off {
  display: inline-flex; align-items: center; gap: 6px;
  padding: 6px 13px; border-radius: var(--r-pill, 999px);
  border: 1px solid rgba(255, 255, 255, .9);
  background: linear-gradient(140deg, rgba(255, 255, 255, .76), rgba(214, 234, 255, .44));
  box-shadow: 0 8px 20px rgba(26, 73, 196, .08), inset 0 1px 0 #fff;
  color: var(--azure-deep, #1a49c4); font: inherit; font-size: 12px; font-weight: 900;
  letter-spacing: .05em; text-decoration: none; cursor: pointer;
  transition: transform .5s var(--e-expo, ease), box-shadow .5s var(--e-expo, ease);
}
.fav-link:hover { transform: translateY(-2px); box-shadow: 0 14px 26px rgba(26, 73, 196, .18), inset 0 1px 0 #fff; }
.fav-note, .fav-off { cursor: default; font-weight: 800; opacity: .82; }
.fav-off {
  background: rgba(255, 255, 255, .42); border-style: dashed;
  font-size: 11.5px; letter-spacing: .02em; line-height: 1.7; padding: 8px 13px;
}
.fav-btn--row { flex: none; }

/* 课程页抬头动作条：收藏跟下载链接排同一行，得是行内块才对齐 */
.crs-fav { display: inline-flex; }

.fav-count-line { display: flex; align-items: center; gap: 10px; margin-top: 4px; }
.fav-count {
  display: inline-flex; align-items: center;
  padding: 5px 14px; border-radius: var(--r-pill, 999px);
  border: 1px solid rgba(255, 255, 255, .92);
  background: linear-gradient(140deg, rgba(255, 255, 255, .8), rgba(214, 234, 255, .5));
  box-shadow: inset 0 1px 0 #fff, 0 8px 18px rgba(26, 73, 196, .08);
  font-size: 12px; font-weight: 900; letter-spacing: .06em;
  color: var(--azure-deep, #1a49c4);
}

.fav-empty {
  padding: 22px 20px; border-radius: 18px;
  border: 1px dashed rgba(255, 255, 255, .9);
  background: rgba(255, 255, 255, .4);
  font-size: 13px; line-height: 2;
}
.fav-skel { opacity: .62; }

/* ── 轻提示 ── */
.fav-toast {
  position: fixed; left: 50%; bottom: 28px; z-index: 90;
  display: flex; align-items: center; gap: 12px; flex-wrap: wrap;
  max-width: min(560px, 88vw);
  padding: 12px 18px; border-radius: 16px;
  border: 1px solid rgba(255, 255, 255, .92);
  background: linear-gradient(150deg, rgba(255, 255, 255, .9), rgba(206, 228, 255, .82));
  box-shadow: 0 22px 48px rgba(16, 46, 122, .26), inset 0 1px 0 #fff;
  color: #16307a; font-size: 12.5px; font-weight: 800; line-height: 1.7;
  opacity: 0; transform: translate(-50%, 18px); pointer-events: none;
  transition: opacity .42s var(--e-expo, ease), transform .5s var(--e-spring, cubic-bezier(.16, 1, .3, 1));
}
.fav-toast[data-show] { opacity: 1; transform: translate(-50%, 0); pointer-events: auto; }
.fav-toast-act {
  padding: 5px 13px; border-radius: var(--r-pill, 999px);
  background: linear-gradient(140deg, var(--sky, #4fb2f0), var(--azure, #2f6cf6) 58%, var(--azure-deep, #1a49c4));
  color: #fff; font-size: 12px; font-weight: 900; text-decoration: none; white-space: nowrap;
}

@media (max-width: 768px) {
  .fav-btn { padding: 6px 12px; font-size: 11px; }
  .fav-row { flex-direction: column; align-items: stretch; gap: 12px; }
  .fav-btn--row { align-self: flex-start; }
  .fav-toast { left: 6vw; right: 6vw; bottom: 18px; max-width: none; transform: translateY(18px); }
  .fav-toast[data-show] { transform: translateY(0); }
}

@media (prefers-reduced-motion: reduce) {
  .fav-btn, .fav-link, .fav-toast, .fav-mark { transition: none; }
  .fav-btn[data-busy] .fav-ico { animation: none; }
}
