@charset "UTF-8";

/**
 * Fancy Custom Shortcodes — Floating Icons
 */

.floating-icons {
    position: fixed;
    right: var(--fi-offset-x, 16px);
    bottom: var(--fi-offset-y, 16px);
    z-index: 9999;
}
.floating-icons.floating-icons-bl { right: auto; left: var(--fi-offset-x, 16px); bottom: var(--fi-offset-y, 16px); }
.floating-icons.floating-icons-tr { right: var(--fi-offset-x, 16px); bottom: auto; top: var(--fi-offset-y, 16px); }
.floating-icons.floating-icons-tl { right: auto; left: var(--fi-offset-x, 16px); bottom: auto; top: var(--fi-offset-y, 16px); }
.floating-icons { --fi-size: var(--fi-size-desktop, 48px); }
@media screen and (max-width: 768px) {
    .floating-icons { --fi-size: var(--fi-size-mobile, 44px); }
}
.floating-icons .fi-stack { display: flex; flex-direction: column; gap: var(--fi-gap, 10px); }
.floating-icons .fi-item { position: relative; }
.floating-icons .fi-btn {
    box-sizing: border-box;
    min-width: 0;
    min-height: 0;
    margin: 0;
    padding: 0;
    border: 0;
    font: inherit;
    cursor: pointer;
    width: var(--fi-size, 48px);
    height: var(--fi-size, 48px);
    border-radius: var(--fi-radius, 50%);
    background: var(--fi-bg, #ffffff);
    color: var(--fi-icon-color, #333);
    text-decoration: none;
    display: flex;
    align-items: center;
    justify-content: center;
    box-shadow: 0 6px 20px rgba(0,0,0,0.15);
    transition: transform .2s ease, box-shadow .2s ease, background-color .2s ease, color .2s ease;
}
.floating-icons .fi-btn i { font-size: calc(var(--fi-size, 48px) * 0.55); }
.floating-icons .fi-btn .fi-dot { width: 50%; height: 50%; border-radius: 50%; background: #0073aa; }
.floating-icons .fi-item.fi-show .fi-btn {
    background: var(--fi-active-bg, #0073aa);
    color: var(--fi-icon-hover-color, #fff);
}
.floating-icons .fi-item.fi-show .fi-btn .fi-dot {
    background: #fff;
}
.floating-icons .fi-item.fi-show .fi-btn i {
    color: var(--fi-icon-hover-color, #fff);
}
.floating-icons .fi-btn svg,
.floating-icons .fi-btn svg * {
    fill: currentColor !important;
    stroke: currentColor !important;
}
.floating-icons .fi-popover {
    box-sizing: border-box;
    position: absolute;
    z-index: 2;
    right: calc(100% + 8px);
    top: calc(50% + var(--fi-popover-shift, 0px));
    max-width: var(--fi-popover-max-width, max(0px, calc(100vw - var(--fi-offset-x, 16px) - var(--fi-size, 48px) - 20px)));
    max-height: var(--fi-popover-max-height, calc(100dvh - 24px));
    transform: translate(-4px, -50%);
    transform-origin: right center;
    opacity: 0;
    visibility: hidden;
    border-radius: 8px;
    overflow: auto;
    overscroll-behavior: contain;
    box-shadow: 0 4px 14px rgba(23, 43, 77, 0.10), 0 1px 3px rgba(23, 43, 77, 0.04);
    transition: opacity .16s ease, transform .16s ease, visibility .16s;
    pointer-events: none;
    background: #ffffff;
}
.floating-icons .fi-popover img { display: block; width: 100%; height: auto; }
.floating-icons-bl .fi-item:not([data-fi-side]) .fi-popover,
.floating-icons-tl .fi-item:not([data-fi-side]) .fi-popover,
.floating-icons .fi-item[data-fi-side="right"] .fi-popover {
    right: auto;
    left: calc(100% + 8px);
    transform: translate(4px, -50%);
    transform-origin: left center;
}
.floating-icons .fi-item.fi-show .fi-popover {
    opacity: 1;
    visibility: visible;
    transform: translate(0, -50%);
    pointer-events: auto;
}
.floating-icons .fi-popover.fi-text {
    width: max-content;
    max-width: min(240px, var(--fi-popover-max-width, max(0px, calc(100vw - var(--fi-offset-x, 16px) - var(--fi-size, 48px) - 20px))));
    min-width: 0;
    padding: 7px 13px;
    border: 1px solid #e5eaf1;
    color: #334155;
    font-size: 14px;
    font-weight: 500;
    line-height: 20px;
    text-align: center;
    white-space: normal;
    overflow-wrap: anywhere;
}
.floating-icons .fi-popover.fi-text span {
    font: inherit;
    color: inherit;
    white-space: inherit;
}
/* Keep the pointer path between the trigger and its popover continuous. */
.floating-icons .fi-item.fi-show::before {
    content: "";
    position: absolute;
    right: 100%;
    top: 0;
    width: 8px;
    height: 100%;
}
.floating-icons .fi-item.fi-show[data-fi-side="right"]::before {
    right: auto;
    left: 100%;
}
.floating-icons .fi-btn:focus-visible {
    outline: 2px solid var(--fi-active-bg, #0073aa);
    outline-offset: 3px;
}
@media (hover: hover) and (pointer: fine) {
    .floating-icons .fi-btn:hover { transform: translateY(-2px); }
    .floating-icons .fi-item:hover .fi-btn {
        background: var(--fi-active-bg, #0073aa);
        color: var(--fi-icon-hover-color, #fff);
    }
    .floating-icons .fi-item:hover .fi-btn .fi-dot { background: #fff; }
    /* Preserve basic hover support while deferred scripts are loading. */
    .floating-icons:not(.fi-ready) .fi-item:hover .fi-popover {
        opacity: 1;
        visibility: visible;
        transform: translate(0, -50%);
        pointer-events: auto;
    }
}
.floating-icons.fi-layout-panel {
    background: var(--fi-panel-bg, rgba(0,0,0,0.6));
    border-radius: 8px;
    padding: 0;
    box-shadow: 0 4px 16px rgba(23, 43, 77, 0.10), 0 1px 4px rgba(23, 43, 77, 0.04);
}
.floating-icons.fi-layout-panel .fi-stack { gap: 0; }
.floating-icons.fi-layout-panel .fi-btn {
    border-radius: 0;
    background: transparent;
    box-shadow: none;
}
.floating-icons.fi-layout-panel .fi-item.fi-show .fi-btn {
    background: var(--fi-active-bg, rgba(255,255,255,0.18));
}
.floating-icons.fi-layout-panel .fi-btn:hover,
.floating-icons.fi-layout-panel .fi-item.fi-show .fi-btn {
    transform: none;
    box-shadow: none;
}
.floating-icons.fi-layout-panel .fi-item:first-child .fi-btn {
    border-top-left-radius: 8px;
    border-top-right-radius: 8px;
}
.floating-icons.fi-layout-panel .fi-item:last-child .fi-btn {
    border-bottom-left-radius: 8px;
    border-bottom-right-radius: 8px;
}
.floating-icons.fi-layout-panel .fi-item:not(:first-child) {
    border-top: 1px solid var(--fi-separator-color, transparent);
}

@media (prefers-reduced-motion: reduce) {
    .floating-icons .fi-btn,
    .floating-icons .fi-popover { transition: none; }
    .floating-icons .fi-btn:hover { transform: none; }
}

/* 手机端隐藏 */
@media screen and (max-width: 768px) {
    .floating-icons.fi-hide-mobile {
        display: none !important;
    }
}