/* ═══ template7/floating.css ══════════════════════
 * 플로팅 버튼 전용 스타일 (.floating-*)
 * 클린 내비게이션 스타일 — 오렌지 액센트
 * ═══════════════════════════════════════════════ */

.floating-wrap {
  position: fixed;
  right: 16px;
  bottom: 16px;
  display: flex;
  flex-direction: column;
  gap: 8px;
  z-index: 100;
}

.floating-btn {
  width: 44px;
  height: 44px;
  border: none;
  border-radius: 50%;
  background: var(--color-card-bg);
  color: var(--color-text);
  box-shadow: var(--shadow-md);
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  position: relative;
  transition: background 0.15s, transform 0.15s;
}
.floating-btn:hover { 
  background: black;
  color: white;
  weight: 700;;
}
.floating-btn.is-hidden { display: none; }

.floating-btn__toast {
  position: absolute;
  right: 100%;
  top: 50%;
  transform: translateY(-50%);
  margin-right: 8px;
  padding: 4px 8px;
  background: var(--color-text);
  color: var(--color-bg);
  border-radius: var(--radius-sm);
  font-size: var(--fs-xs);
  white-space: nowrap;
  opacity: 0;
  pointer-events: none;
  transition: opacity 0.15s;
}
.floating-btn__toast.is-visible { opacity: 1; }

/* 색상 토큰화 — 카카오/공유 등 브랜드 색이 필요하면 modifier 별 override */
.floating-btn--kakao:hover { background: #FEE500; color: #3C1E1E; }

.floating-btn__toast {
  position: absolute;
  right: 100%;
  top: 50%;
  transform: translateY(-50%);
  margin-right: 8px;
  padding: 4px 8px;
  background: var(--color-text);
  color: var(--color-bg);
  border-radius: var(--radius-sm);
  font-size: var(--fs-xs);
  white-space: nowrap;
  opacity: 0;
  pointer-events: none;
  transition: opacity 0.18s;
}
.floating-btn__toast.is-visible { opacity: 1; }

/* ─── floating-btn 호버 툴팁 ──────────────
 * aria-label 을 데이터 소스로 자동 사용. 좌측 표시.
 * .floating-btn__toast (공유 버튼 클립보드 토스트) 와 같은 위치라 충돌 방지 위해
 * .floating-btn--share 는 자체 toast 가 우선되도록 호버 툴팁 비활성. */
.floating-wrap .floating-btn[aria-label] {
  position: relative;
}

.floating-wrap .floating-btn[aria-label]::after {
  content: attr(aria-label);
  position: absolute;
  right: calc(100% + 8px);
  top: 50%;
  transform: translateY(-50%);
  padding: 4px 8px;
  background: var(--color-text);
  color: var(--color-bg);
  border-radius: var(--radius-sm);
  font-size: var(--fs-xs);
  white-space: nowrap;
  opacity: 0;
  pointer-events: none;
  transition: opacity 0.15s ease;
  z-index: 1;
}

.floating-wrap .floating-btn[aria-label]:hover::after,
.floating-wrap .floating-btn[aria-label]:focus-visible::after {
  opacity: 1;
}

/* 공유 버튼은 자체 .floating-btn__toast 가 위치를 점유 — 호버 툴팁 비활성 */
.floating-wrap .floating-btn--share::after { content: none; }