/* FGC BUILD 0.14.60 */ /* v0.7: one independent floating Community panel. It never covers FooGallery's navigation rail. */ .fgc-floating{position:absolute!important;z-index:70!important;display:flex!important;align-items:center!important;gap:var(--fgc-bar-gap,6px)!important;padding:var(--fgc-bar-pad-y,6px) var(--fgc-bar-pad-x,8px)!important;background:rgba(255,255,255,.96)!important;border:1px solid rgba(0,0,0,.10)!important;border-radius:var(--fgc-bar-radius,5px)!important;box-shadow:0 2px 10px rgba(0,0,0,.18)!important;pointer-events:auto!important;box-sizing:border-box!important;direction:ltr!important;max-width:calc(100% - 90px)!important} .fgc-pos-top-center{top:12px!important;left:50%!important;transform:translateX(-50%)!important}.fgc-pos-top-left{top:12px!important;left:12px!important}.fgc-pos-top-right{top:12px!important;right:58px!important}.fgc-pos-bottom-center{bottom:78px!important;left:50%!important;transform:translateX(-50%)!important}.fgc-pos-bottom-left{bottom:78px!important;left:12px!important}.fgc-pos-bottom-right{bottom:78px!important;right:58px!important} .fgc-share-actions,.fgc-action-actions{display:flex!important;align-items:center!important;gap:var(--fgc-bar-gap,6px)!important}.fgc-share-icon{width:calc(var(--fgc-bar-icon-size,24px) + (var(--fgc-bar-pad-x,8px) * 2))!important;height:var(--fgc-bar-height,54px)!important;border:0!important;border-radius:0!important;background:transparent!important;color:#66717d!important;font:700 var(--fgc-bar-icon-size,24px)/var(--fgc-bar-height,54px) Arial,sans-serif!important;text-align:center!important;cursor:pointer!important;padding:0!important;margin:0!important}.fgc-share-icon:hover{filter:none!important;background:transparent!important} .fgc-action{height:var(--fgc-bar-height,54px)!important;min-width:64px!important;border:0!important;border-radius:3px!important;background:#f5f5f5!important;color:#666!important;padding:2px 8px!important;margin:0!important;display:flex!important;align-items:center!important;justify-content:center!important;gap:4px!important;cursor:pointer!important;font:13px Arial,sans-serif!important}.fgc-action:hover{background:#eaeaea!important}.fgc-action-icon{font-size:21px!important;line-height:21px!important}.fgc-action-count{font-size:11px!important;opacity:.8!important}.fgc-like.is-liked{color:#ef5b75!important}.fgc-action.is-busy{opacity:.55!important} .fgc-comments-panel{position:absolute!important;z-index:80!important;top:62px!important;left:50%!important;transform:translateX(-50%)!important;width:min(380px,calc(100% - 100px))!important;height:min(70%,520px)!important;background:rgba(20,20,20,.98)!important;color:#fff!important;border-radius:5px!important;box-shadow:0 3px 16px rgba(0,0,0,.35)!important;overflow:hidden!important;display:none!important;box-sizing:border-box!important}.fgc-comments-panel.is-open{display:block!important}.fgc-comments-inner{height:100%!important;display:flex!important;flex-direction:column!important}.fgc-comments-head{height:48px!important;min-height:48px!important;display:flex!important;align-items:center!important;justify-content:space-between!important;padding:0 12px!important;border-bottom:1px solid rgba(255,255,255,.12)!important}.fgc-comments-close{background:none!important;border:0!important;color:#fff!important;font-size:27px!important;cursor:pointer!important}.fgc-comments-list{flex:1!important;min-height:0!important;overflow:auto!important;padding:12px!important}.fgc-comment{padding:10px 0!important;border-bottom:1px solid rgba(255,255,255,.1)!important}.fgc-comment-meta{display:flex!important;justify-content:space-between!important;gap:8px!important;font-size:12px!important;margin-bottom:5px!important}.fgc-comment-meta time{opacity:.55!important}.fgc-comment-body{font-size:14px!important;line-height:1.5!important}.fgc-form{padding:10px!important;border-top:1px solid rgba(255,255,255,.12)!important;display:flex!important;flex-direction:column!important;gap:6px!important;background:rgba(0,0,0,.16)!important}.fgc-form input,.fgc-form textarea{width:100%!important;box-sizing:border-box!important;background:rgba(255,255,255,.09)!important;color:#fff!important;border:1px solid rgba(255,255,255,.2)!important;border-radius:3px!important;padding:7px!important}.fgc-form textarea{min-height:65px!important;resize:vertical!important}.fgc-form button{border:0!important;border-radius:3px!important;padding:8px!important;cursor:pointer!important}.fgc-msg{font-size:11px!important;opacity:.8!important}.fgc-empty,.fgc-loading{text-align:center!important;opacity:.65!important;padding:22px 8px!important} @media(max-width:700px){.fgc-floating{top:56px!important;left:50%!important;right:auto!important;bottom:auto!important;transform:translateX(-50%)!important;width:calc(100% - 20px)!important;max-width:calc(100% - 20px)!important;min-width:0!important;display:flex!important;flex-wrap:wrap!important;justify-content:center!important;align-items:center!important;gap:var(--fgc-bar-gap,6px)!important;padding:var(--fgc-bar-pad-y,6px) var(--fgc-bar-pad-x,8px)!important;box-sizing:border-box!important;overflow:visible!important}.fgc-share-actions,.fgc-action-actions{flex-wrap:wrap!important;justify-content:center!important;min-width:0!important}.fgc-share-icon{width:calc(var(--fgc-bar-icon-size,24px) + (var(--fgc-bar-pad-x,8px) * 2))!important;height:var(--fgc-bar-height,34px)!important;font-size:var(--fgc-bar-icon-size,24px)!important;line-height:var(--fgc-bar-height,34px)!important;flex:0 0 auto!important}.fgc-action{height:var(--fgc-bar-height,34px)!important;min-height:var(--fgc-bar-height,34px)!important;min-width:58px!important;max-width:100%!important;padding:2px 5px!important;flex:0 1 auto!important}.fgc-action-icon{font-size:calc(var(--fgc-bar-icon-size,24px) * .75)!important;line-height:1!important}.fgc-action-label{font-size:11px!important}.fgc-comments-panel{width:calc(100% - 20px)!important;max-width:calc(100% - 20px)!important}.fgc-pos-top-right,.fgc-pos-bottom-right,.fgc-pos-top-left,.fgc-pos-bottom-left,.fgc-pos-top-center,.fgc-pos-bottom-center{left:50%!important;right:auto!important;top:56px!important;bottom:auto!important;transform:translateX(-50%)!important}} .fgc-share-icon img,.fgc-share-icon svg{display:block!important;margin:auto!important;max-width:var(--fgc-bar-icon-size,24px)!important;max-height:var(--fgc-bar-icon-size,24px)!important;box-sizing:border-box!important;pointer-events:none!important} /* v0.14.12: global Floating Bar sizing. Individual SVG dimensions are no longer used. */ .fgc-floating{min-height:var(--fgc-bar-height,54px)!important;max-width:calc(100% - 20px)!important;flex-wrap:wrap!important;box-sizing:border-box!important} .fgc-share-icon img,.fgc-share-icon svg{display:block!important;width:auto!important;height:auto!important;max-width:var(--fgc-bar-icon-size,24px)!important;max-height:var(--fgc-bar-icon-size,24px)!important;object-fit:contain!important;box-sizing:border-box!important;pointer-events:none!important} /* Icons render as-is with no button surface: no fill, no border, no shadow. The only interaction is a 1px hover/focus lift. --fgc-rgb is kept only to colour the Like/Comments text labels below, not any background. */ .fgc-floating .fgc-share-icon, .fgc-floating .fgc-action{ --fgc-rgb:102,113,125; width:auto!important; height:var(--fgc-bar-height,54px)!important; min-height:var(--fgc-bar-height,54px)!important; border:0!important; background:transparent!important; color:rgb(var(--fgc-rgb))!important; box-shadow:none!important; transition:transform .18s ease!important; /* Horizontal spacing around the icon is the configured Horizontal padding, not a fixed number - button width is fully icon size + this padding. */ padding:0 var(--fgc-bar-pad-x,8px)!important; margin:0!important; box-sizing:border-box!important; } /* Hover / keyboard focus: lift only, no tint. */ .fgc-floating .fgc-share-icon:hover, .fgc-floating .fgc-action:hover, .fgc-floating .fgc-share-icon:focus-visible, .fgc-floating .fgc-action:focus-visible{ transform:translateY(-1px)!important; outline:none!important; } /* Keyboard focus still needs a visible indicator with no background to lean on; an outline (not a box-shadow "fill") does that without adding a tint. */ .fgc-floating .fgc-share-icon:focus-visible, .fgc-floating .fgc-action:focus-visible{outline:2px solid rgba(var(--fgc-rgb),.45)!important;outline-offset:2px!important} @media(prefers-reduced-motion:reduce){ .fgc-floating .fgc-share-icon, .fgc-floating .fgc-action{transition:none!important} .fgc-floating .fgc-share-icon:hover,.fgc-floating .fgc-action:hover, .fgc-floating .fgc-share-icon:focus-visible,.fgc-floating .fgc-action:focus-visible{transform:none!important} } .fgc-floating .fgc-share-icon .fgc-icon-wrap{display:flex!important;align-items:center!important;justify-content:center!important;width:100%!important;height:100%!important;pointer-events:none!important} .fgc-floating .fgc-share-icon svg, .fgc-floating .fgc-share-icon img, .fgc-floating .fgc-action-icon svg{display:block!important;width:var(--fgc-bar-icon-size,24px)!important;height:var(--fgc-bar-icon-size,24px)!important;max-width:var(--fgc-bar-icon-size,24px)!important;max-height:var(--fgc-bar-icon-size,24px)!important;object-fit:contain!important;pointer-events:none!important} .fgc-floating .fgc-action{display:flex!important;align-items:center!important;justify-content:center!important;gap:4px!important;font:500 13px/1 Arial,sans-serif!important} .fgc-floating .fgc-action-icon{display:flex!important;align-items:center!important;justify-content:center!important;font-size:0!important;line-height:1!important} .fgc-floating .fgc-action-label{font-size:13px!important;line-height:1!important;color:inherit!important} .fgc-floating .fgc-action-count{font-size:11px!important;line-height:1!important;color:inherit!important;opacity:.85!important} .fgc-floating .fgc-fb{--fgc-rgb:24,119,242!important}.fgc-floating .fgc-wa{--fgc-rgb:37,211,102!important}.fgc-floating .fgc-x{--fgc-rgb:39,44,51!important}.fgc-floating .fgc-ig{--fgc-rgb:79,107,138!important}.fgc-floating .fgc-share-link,.fgc-floating .fgc-share{--fgc-rgb:102,113,125!important}.fgc-floating .fgc-like{--fgc-rgb:102,113,125!important}.fgc-floating .fgc-comments{--fgc-rgb:102,113,125!important}.fgc-floating .fgc-like .fgc-action-label,.fgc-floating .fgc-like .fgc-action-count,.fgc-floating .fgc-comments .fgc-action-label,.fgc-floating .fgc-comments .fgc-action-count{color:rgb(102,113,125)!important;opacity:1!important}.fgc-floating .fgc-like.is-liked .fgc-action-icon{color:rgb(24,119,242)!important} .fgc-floating .fgc-like.is-busy{opacity:.75!important} @media(max-width:700px){ .fgc-floating .fgc-share-icon,.fgc-floating .fgc-action{height:var(--fgc-bar-height,34px)!important;min-height:var(--fgc-bar-height,34px)!important;padding:0 var(--fgc-bar-pad-x,6px)!important} .fgc-floating .fgc-action-label{font-size:11px!important}.fgc-floating .fgc-action-count{font-size:10px!important} } /* v0.14.33: Like and Comments are intentionally unshaped. They do not inherit the global Round/Square or Soft Fill button treatment. */ .fgc-floating .fgc-action.fgc-like, .fgc-floating .fgc-action.fgc-comments{ width:auto!important; min-width:0!important; height:auto!important; min-height:0!important; padding:2px 3px!important; margin:0!important; border:0!important; border-radius:0!important; background:transparent!important; box-shadow:none!important; transform:none!important; color:rgb(var(--fgc-rgb))!important; transition:opacity .2s ease,transform .2s ease!important; } .fgc-floating .fgc-action.fgc-like:hover, .fgc-floating .fgc-action.fgc-comments:hover, .fgc-floating .fgc-action.fgc-like:focus-visible, .fgc-floating .fgc-action.fgc-comments:focus-visible{ background:transparent!important; border:0!important; border-radius:0!important; box-shadow:none!important; transform:scale(1.05)!important; opacity:.78!important; outline:none!important; } .fgc-floating .fgc-action.fgc-like.is-clicked, .fgc-floating .fgc-action.fgc-comments.is-clicked{ background:transparent!important; border:0!important; border-radius:0!important; box-shadow:none!important; transform:none!important; } .fgc-floating .fgc-action.fgc-like .fgc-action-icon, .fgc-floating .fgc-action.fgc-comments .fgc-action-icon{width:auto!important;height:auto!important;background:transparent!important} .fgc-floating .fgc-action.fgc-like .fgc-action-label, .fgc-floating .fgc-action.fgc-comments .fgc-action-label{font-weight:500!important} /* v0.14.33 icon rendering: no nested circles; icon color is supplied by the action. */ .fgc-floating .fgc-share-icon svg, .fgc-floating .fgc-share-icon img{background:transparent!important} .fgc-floating .fgc-share-icon svg{overflow:visible!important} .fgc-floating .fgc-share-icon img{display:block!important} /* v0.14.34 FINAL: Like and Comments are text actions, NEVER button surfaces. This intentionally does not use the global Rounded/Square or Soft Fill rules. */ .fgc-floating .fgc-action.fgc-like, .fgc-floating .fgc-action.fgc-comments, .fgc-floating .fgc-action.fgc-like:hover, .fgc-floating .fgc-action.fgc-comments:hover, .fgc-floating .fgc-action.fgc-like:focus, .fgc-floating .fgc-action.fgc-comments:focus, .fgc-floating .fgc-action.fgc-like:focus-visible, .fgc-floating .fgc-action.fgc-comments:focus-visible, .fgc-floating .fgc-action.fgc-like.is-clicked, .fgc-floating .fgc-action.fgc-comments.is-clicked, .fgc-floating .fgc-action.fgc-like.is-liked { width:auto !important; min-width:0 !important; height:auto !important; min-height:0 !important; padding:2px 3px !important; margin:0 !important; border:0 !important; border-radius:0 !important; background:transparent !important; background-color:transparent !important; box-shadow:none !important; outline:0 !important; transform:none !important; } .fgc-floating .fgc-action.fgc-like::before, .fgc-floating .fgc-action.fgc-like::after, .fgc-floating .fgc-action.fgc-comments::before, .fgc-floating .fgc-action.fgc-comments::after { display:none !important; content:none !important; } .fgc-floating .fgc-action.fgc-like .fgc-action-icon, .fgc-floating .fgc-action.fgc-comments .fgc-action-icon { width:auto !important; height:auto !important; min-width:0 !important; min-height:0 !important; padding:0 !important; margin:0 !important; border:0 !important; border-radius:0 !important; background:transparent !important; box-shadow:none !important; } .fgc-floating .fgc-action.fgc-like .fgc-action-icon svg, .fgc-floating .fgc-action.fgc-comments .fgc-action-icon svg { background:transparent !important; border:0 !important; border-radius:0 !important; box-shadow:none !important; } .fgc-floating .fgc-action.fgc-like:hover, .fgc-floating .fgc-action.fgc-comments:hover { opacity:.78 !important; cursor:pointer !important; } /* v0.14.35 final visual spec: share arrow replaces old chain/copy icon; Like/Comments stay text-only. */ .fgc-floating .fgc-share{--fgc-rgb:102,113,125!important;color:rgb(102,113,125)!important} .fgc-floating .fgc-like .fgc-action-icon,.fgc-floating .fgc-comments .fgc-action-icon{color:rgb(102,113,125)!important} .fgc-floating .fgc-like.is-liked .fgc-action-icon{color:rgb(24,119,242)!important} .fgc-floating .fgc-like .fgc-action-label,.fgc-floating .fgc-like .fgc-action-count,.fgc-floating .fgc-comments .fgc-action-label,.fgc-floating .fgc-comments .fgc-action-count{color:rgb(102,113,125)!important} /* v0.14.37 final visual rules: share arrow + custom SVG reliability */ .fgc-floating .fgc-action.fgc-like, .fgc-floating .fgc-action.fgc-comments { background:transparent!important; border:0!important; border-radius:0!important; box-shadow:none!important; } /* v0.14.46: no button surface on share icons at all - transparent, borderless, at every state including is-clicked. Only the shared hover/focus lift above applies. */ .fgc-floating .fgc-share-actions .fgc-share-icon, .fgc-floating .fgc-share-actions .fgc-share-icon:hover, .fgc-floating .fgc-share-actions .fgc-share-icon:focus-visible, .fgc-floating .fgc-share-actions .fgc-share-icon.is-clicked{ background:transparent!important; border:0!important; box-shadow:none!important; } /* v0.14.51: sleek vertical separators between social/share/action groups. */ .fgc-floating .fgc-share-actions{position:relative!important} .fgc-floating .fgc-share-actions .fgc-share{border-left:1px solid rgba(102,113,125,.22)!important} /* Like/Comments have an inline border reset for their unshaped design, so the separators are pseudo-elements rather than borders on those buttons. */ .fgc-floating .fgc-action-actions .fgc-like, .fgc-floating .fgc-action-actions .fgc-comments{position:relative!important} .fgc-floating .fgc-action-actions .fgc-like::before, .fgc-floating .fgc-action-actions .fgc-comments::before{ content:""!important; position:absolute!important; left:0!important; top:20%!important; bottom:20%!important; width:1px!important; background:rgba(102,113,125,.22)!important; pointer-events:none!important; } @media(max-width:700px){ .fgc-floating .fgc-share-actions .fgc-share{border-left-color:rgba(102,113,125,.18)!important} .fgc-floating .fgc-action-actions .fgc-like::before, .fgc-floating .fgc-action-actions .fgc-comments::before{background:rgba(102,113,125,.18)!important} } /* v0.14.52: Like-section separators + equal visual envelope sizing. The previous v0.14.51 separator was on the Share button and on both Like/Comments actions. Remove those and frame the Like action itself. */ .fgc-floating .fgc-share-actions .fgc-share, .fgc-floating .fgc-share-actions .fgc-share:hover, .fgc-floating .fgc-share-actions .fgc-share:focus-visible, .fgc-floating .fgc-share-actions .fgc-share.is-clicked{ border-left:0!important; } /* Clear the old separator rules on Like/Comments, then frame Like on both sides. */ .fgc-floating .fgc-action-actions .fgc-like::before, .fgc-floating .fgc-action-actions .fgc-like::after, .fgc-floating .fgc-action-actions .fgc-comments::before, .fgc-floating .fgc-action-actions .fgc-comments::after{ display:none!important; content:none!important; } .fgc-floating .fgc-action-actions .fgc-like{ position:relative!important; } .fgc-floating .fgc-action-actions .fgc-like::before, .fgc-floating .fgc-action-actions .fgc-like::after{ display:block!important; content:""!important; position:absolute!important; top:20%!important; bottom:20%!important; width:1px!important; background:rgba(102,113,125,.22)!important; pointer-events:none!important; } .fgc-floating .fgc-action-actions .fgc-like::before{left:0!important} .fgc-floating .fgc-action-actions .fgc-like::after{right:0!important} /* The source envelope SVG is wider than it is tall. The previous square 24x24 image box made it render visibly smaller than the square social icons. Give only Email enough width to use the same visual height while preserving the SVG artwork/aspect ratio. */ .fgc-floating .fgc-share-actions .fgc-ig .fgc-icon-wrap img{ width:32px!important; max-width:32px!important; height:24px!important; max-height:24px!important; object-fit:contain!important; } @media(max-width:700px){ .fgc-floating .fgc-action-actions .fgc-like::before, .fgc-floating .fgc-action-actions .fgc-like::after{ background:rgba(102,113,125,.18)!important; } } /* v0.14.57: the configured bar gap is used literally on BOTH sides of each Like separator. The flex gap supplies the outer 3px and the Like padding supplies the inner 3px; the separator itself is never included in, or split across, the configured gap. With a configured gap of 3px the geometry is exactly: previous group -> separator = 3px separator -> Like content = 3px Like content -> separator = 3px separator -> next group = 3px */ .fgc-floating .fgc-action-actions .fgc-like{ padding-left:var(--fgc-bar-gap,6px)!important; padding-right:var(--fgc-bar-gap,6px)!important; } /* v0.14.59: literal visual gap between every item. The configured Gap is applied between item boxes, not combined with horizontal button padding. This makes the visible spacing predictable. For Gap = 3px: icon -> icon = 3px last share icon -> Like separator = 3px Like separator -> Like content = 3px Like content -> Like separator = 3px Like separator -> Comments content = 3px */ .fgc-floating{ gap:var(--fgc-bar-gap,6px)!important; } .fgc-floating .fgc-share-actions, .fgc-floating .fgc-action-actions{ gap:var(--fgc-bar-gap,6px)!important; } .fgc-floating .fgc-share-actions .fgc-share-icon{ flex:0 0 auto!important; width:auto!important; min-width:0!important; padding:0!important; margin:0!important; box-sizing:border-box!important; } .fgc-floating .fgc-share-actions .fgc-share-icon .fgc-icon-wrap{ width:auto!important; min-width:0!important; } .fgc-floating .fgc-action-actions .fgc-action{ flex:0 0 auto!important; min-width:0!important; width:auto!important; margin:0!important; } .fgc-floating .fgc-action-actions .fgc-like{ padding-left:var(--fgc-bar-gap,6px)!important; padding-right:var(--fgc-bar-gap,6px)!important; } @media(max-width:700px){ .fgc-floating .fgc-share-actions .fgc-share-icon{ padding:0!important; } .fgc-floating .fgc-action-actions .fgc-action{ min-width:0!important; } } /* v0.14.60: exact configured gap geometry. Every share icon gets exactly one fixed icon-sized flex item, so the configured Gap is measured between identical item boxes. The Like separators remain part of the Like item, with the same configured gap used as the padding on both sides of each separator. IMPORTANT: do not widen individual share icons (Email used to be 32px), because that changes the visible gap on either side of that icon. */ .fgc-floating .fgc-share-actions, .fgc-floating .fgc-action-actions{ display:contents!important; } .fgc-floating{ gap:var(--fgc-bar-gap,6px)!important; } .fgc-floating .fgc-share-actions .fgc-share-icon{ flex:0 0 var(--fgc-bar-icon-size,24px)!important; width:var(--fgc-bar-icon-size,24px)!important; min-width:var(--fgc-bar-icon-size,24px)!important; max-width:var(--fgc-bar-icon-size,24px)!important; padding:0!important; margin:0!important; box-sizing:border-box!important; } .fgc-floating .fgc-share-actions .fgc-share-icon .fgc-icon-wrap{ width:100%!important; min-width:0!important; max-width:100%!important; height:100%!important; } .fgc-floating .fgc-share-actions .fgc-share-icon img, .fgc-floating .fgc-share-actions .fgc-share-icon svg{ flex:0 0 var(--fgc-bar-icon-size,24px)!important; width:var(--fgc-bar-icon-size,24px)!important; height:var(--fgc-bar-icon-size,24px)!important; max-width:var(--fgc-bar-icon-size,24px)!important; max-height:var(--fgc-bar-icon-size,24px)!important; object-fit:contain!important; } /* The Like button is one flex item in the same outer gap system. Its separators are positioned on the two edges of that item, while the configured gap is also used as its left/right internal spacing. Therefore Gap=N produces Npx on every side of each vertical separator. */ .fgc-floating .fgc-action-actions .fgc-like{ padding-left:var(--fgc-bar-gap,6px)!important; padding-right:var(--fgc-bar-gap,6px)!important; } /* Remove the old Email-only width exception; it was the direct source of unequal visual gaps around that icon. */ .fgc-floating .fgc-share-actions .fgc-ig .fgc-icon-wrap img{ width:var(--fgc-bar-icon-size,24px)!important; max-width:var(--fgc-bar-icon-size,24px)!important; height:var(--fgc-bar-icon-size,24px)!important; max-height:var(--fgc-bar-icon-size,24px)!important; } /* v0.14.61: the configured Gap is the complete horizontal rhythm. The sequence starts and ends with the same Gap value, so there is no separate Horizontal Padding added outside the first/last item. For Gap=3px the bar is exactly: 3px -> icon -> 3px -> icon -> 3px -> icon -> 3px -> separator -> 3px -> Like -> 3px -> separator -> 3px -> Comments -> 3px */ .fgc-floating{ padding-left:var(--fgc-bar-gap,6px)!important; padding-right:var(--fgc-bar-gap,6px)!important; } @media(max-width:700px){ .fgc-floating{ padding-left:var(--fgc-bar-gap,6px)!important; padding-right:var(--fgc-bar-gap,6px)!important; } } /* v0.14.64: rich email composer. Email now sends an HTML message through WordPress wp_mail(), with the selected image as a clickable preview. */ .fgc-email-modal{position:fixed;inset:0;z-index:2147483647;display:flex;align-items:center;justify-content:center;padding:20px;background:rgba(0,0,0,.62);box-sizing:border-box} .fgc-email-dialog{position:relative;width:min(520px,100%);max-height:90vh;overflow:auto;background:#fff;border-radius:10px;padding:20px;box-sizing:border-box;box-shadow:0 12px 40px rgba(0,0,0,.3);font-family:Arial,sans-serif;color:#222} .fgc-email-close{position:absolute;top:8px;right:10px;border:0;background:transparent;font-size:28px;line-height:1;cursor:pointer;color:#666} .fgc-email-title{font-size:20px;font-weight:600;margin:0 34px 16px 0} .fgc-email-preview{margin:0 0 16px}.fgc-email-preview img{display:block;width:100%;height:auto;max-height:320px;object-fit:contain;border-radius:6px} .fgc-email-label{display:block;font-size:13px;font-weight:600;margin-bottom:8px}.fgc-email-to{display:block;width:100%;margin-top:6px;padding:10px 11px;border:1px solid #ccc;border-radius:5px;box-sizing:border-box;font:inherit} .fgc-email-msg{min-height:20px;margin:10px 0;font-size:13px}.fgc-email-send{width:100%;padding:10px 14px;border:0;border-radius:5px;background:#222;color:#fff;cursor:pointer;font:inherit}.fgc-email-send:disabled{opacity:.55;cursor:wait} /* Isolated lightbox zoom. Uses CSS scale only; FooGallery keeps ownership of transform/positioning. */ .fg-panel .fgc-is-zoomed { cursor: grab !important; touch-action: none; } .fg-panel .fgc-is-zoomed:active { cursor: grabbing !important; } .fg-panel img:not(.fg-panel-thumb-image).fgc-is-zoomed { touch-action: none; } /* v0.14.81: logged-in user based Likes/Comments */ .fgc-login-required{padding:12px;border-top:1px solid rgba(255,255,255,.12);font-size:12px;line-height:1.45;opacity:.9}.fgc-auth-links{display:flex;gap:8px;margin-top:8px}.fgc-auth-links a{display:inline-block;padding:6px 10px;border-radius:3px;background:#fff;color:#111!important;text-decoration:none!important}.fgc-auth-links a.fgc-register-link{background:rgba(255,255,255,.14);color:#fff!important}.fgc-signed-in{padding:8px 10px 0;font-size:11px;opacity:.75}.fgc-form button.is-busy{opacity:.55;pointer-events:none}