/* ============================================================
   Floating FAB Group — Apple HIG Glass Style
   位置:右上音乐 / 左下语言 / 右下主题
   设计:iOS 风格玻璃模糊 + 大圆角 + 14px 紧凑
   创建:2026-06-18 Hermes (Phase 1 浮动按钮重设计)
   ============================================================ */

/* ====== 通用变量(可被主题覆盖) ====== */
:root {
  --fab-glass-bg: rgba(255, 255, 255, 0.55);
  --fab-glass-bg-strong: rgba(255, 255, 255, 0.75);
  --fab-glass-border: rgba(0, 0, 0, 0.08);
  --fab-glass-text: #1c1c1e;
  --fab-glass-text-muted: rgba(60, 60, 67, 0.6);
  --fab-glass-shadow: 0 8px 32px rgba(0, 0, 0, 0.12);
  --fab-glass-accent: #0a84ff;
  --fab-glass-accent-glow: rgba(10, 132, 255, 0.35);
  --fab-glass-radius-sm: 14px;
  --fab-glass-radius-full: 999px;
}

[data-theme="dark"],
.theme-sakura-dark {
  --fab-glass-bg: rgba(20, 20, 28, 0.55);
  --fab-glass-bg-strong: rgba(40, 40, 52, 0.78);
  --fab-glass-border: rgba(255, 255, 255, 0.12);
  --fab-glass-text: #ffffff;
  --fab-glass-text-muted: rgba(235, 235, 245, 0.6);
  --fab-glass-shadow: 0 8px 32px rgba(0, 0, 0, 0.4);
}

/* ====== 音乐 FAB 已删除(2026-06-18) ====== */
/* 之前 .music-glass-fab / .music-glass-icon / .music-glass-label 规则已清除 */

/* ====== 关闭按钮 (1:1 抄 music_control_new.js 紫色按钮 .music-close-btn 标准设计) ====== */
.fab-close-btn {
    position: absolute;
    top: -4px;
    right: -4px;
    width: 16px;
    height: 16px;
    min-width: 0;
    min-height: 0;
    appearance: none;
    -webkit-appearance: none;
    border: none;
    border-radius: 50%;
    background: linear-gradient(135deg, #ff9abf, #ffc1d6);
    color: white;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 9px;
    font-weight: bold;
    box-shadow: 0 1px 4px rgba(255, 154, 191, 0.3);
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    opacity: 0;            /* 桌面默认隐藏, 学紫色按钮 hover 才出现 */
    transform: scale(0.8);
    z-index: 2147483647 !important;
    user-select: none;
    outline: none;
    font-family: 'M PLUS 1p', 'Arial', sans-serif;
    touch-action: manipulation;
    -webkit-tap-highlight-color: transparent;
}
/* 移动端 768 以下: 24px 永久显示, 永远不挡 (因为图标/月亮本身在主按钮中心, X 在角落) */
@media (max-width: 768px) {
    .fab-close-btn {
        width: 24px !important;
        height: 24px !important;
        min-width: 24px !important;
        min-height: 24px !important;
        top: -8px !important;
        right: -8px !important;
        font-size: 11px !important;
        opacity: 1 !important;
        transform: scale(1) !important;
    }
}
.fab-close-btn:hover {
    background: linear-gradient(135deg, #ff84b0, #ffb1cf);
    box-shadow: 0 2px 8px rgba(255, 154, 191, 0.5);
    transform: scale(1.05) rotate(90deg);
}
/* 桌面: 父 wrap hover 时 X 弹出 (学紫色按钮 #music-controller:hover .music-close-btn) */
.theme-fab-wrap:hover .fab-close-btn,
.lang-switcher-outer:hover .fab-close-btn,
.lcs-pill-outer:hover .fab-close-btn {
    opacity: 1;
    transform: scale(1);
    animation: fab-close-bounceIn 0.5s ease-out;
}
@keyframes fab-close-bounceIn {
    0%   { transform: scale(0) rotate(0deg);   opacity: 0; }
    50%  { transform: scale(1.2) rotate(45deg); opacity: 0.8; }
    100% { transform: scale(1) rotate(0deg);    opacity: 1; }
}
.fab-hidden {
    display: none !important;
}

/* ====== 主题 FAB(右下)— 纯圆按钮 ====== */
.theme-fab-wrap {
    position: fixed;
    bottom: 24px;
    right: 24px;
    z-index: 2147483647;       /* 2026-06-19 抬高到跟 lang-switcher-outer 同档,防被覆盖 */
    display: inline-block;
    cursor: grab;              /* 拖动反馈 — 鼠标悬停显示抓手 */
    touch-action: none;        /* iOS Safari 防止拖动时 scroll 抢手势 */
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    user-select: none;
}
.theme-fab-wrap:active,
.theme-fab-wrap.dragging {
    cursor: grabbing;
}
.theme-glass-fab {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 52px;
    height: 52px;
    border-radius: 50%;
    background: var(--fab-glass-bg);
    backdrop-filter: blur(30px) saturate(180%);
    -webkit-backdrop-filter: blur(30px) saturate(180%);
    border: 1px solid var(--fab-glass-border);
    color: var(--fab-glass-text);
    cursor: pointer;
    box-shadow: var(--fab-glass-shadow);
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    user-select: none;
    -webkit-user-select: none;
}
.theme-glass-fab:hover {
  background: var(--fab-glass-bg-strong);
  transform: scale(1.08) rotate(15deg);
}
.theme-glass-fab:active {
  transform: scale(0.92);
}

/* ====== 语言 FAB(左下)— 2026-06-18 抽到 components/lang-switcher.{js,css} ====== */
/* 旧 .lang-fab-wrap / .lang-glass / .lang-btn 段已删除,见 components/lang-switcher.css */

/* ====== Mobile 适配(iPhone 375 / 390 / 428) ====== */
@media (max-width: 480px) {
  .theme-fab-wrap {
    bottom: 20px;
    right: 20px;
  }
  .theme-glass-fab {
    width: 48px;
    height: 48px;
  }
  /* .lang-fab-wrap / .lang-btn 旧段已删除,见 components/lang-switcher.css */
}

/* ====== 防止 mobile.css 误伤的覆盖 ====== */
button.music-glass-fab,
button.theme-glass-fab {
  min-width: 40px !important;
  flex-shrink: 0;
}