@charset "UTF-8";
/* tonypanopoulos.gr - "tp takeoff" chat launcher. v2 (06/10/2026). Animates the existing SVG inside #tpc-fab (no HTML/JS changes).
   Must load AFTER tp.*.css (that file sets #tpc-fab{overflow:hidden} and svg.tpc-mark{border-radius:50%}). Tested WebKit+Chromium 390px.
   v2: WebKit/Safari clips a replaced <svg> to its border-radius even with overflow:visible -> plane vanished at the circle edge.
       Rotations use an explicit pivot (translate-rotate-translate, origin 0 0) instead of transform-origin in px, which older iOS Safari resolves differently. */
#tpc-fab{overflow:visible}
#tpc-fab .tpc-mark{overflow:visible;border-radius:0}
#tpc-fab .tpc-mark text{transform-box:view-box;transform-origin:0 0;animation:tpcSquash 3.4s ease-in-out infinite}
#tpc-fab .tpc-mark > path{stroke-dasharray:22;stroke-dashoffset:22;animation:tpcDraw 3.4s ease-in-out infinite}
#tpc-fab .tpc-mark > g{transform-box:view-box;transform-origin:0 0;animation:tpcFly 3.4s ease-in-out infinite}
@keyframes tpcDraw{0%,8%{stroke-dashoffset:22}35%,85%{stroke-dashoffset:0}100%{stroke-dashoffset:-22}}
/* pivot = bottom-centre of "tp" (19, 21.5) */
@keyframes tpcSquash{0%,36%,60%,100%{transform:translate(0,0)}42%{transform:translate(19px,21.5px) scale(1.15,.85) translate(-19px,-21.5px)}50%{transform:translate(19px,21.5px) translateY(-1.5px) scale(.92,1.1) translate(-19px,-21.5px)}}
/* pivot = end of the copper line (26.14, 26.34) */
@keyframes tpcFly{
0%,30%{opacity:0;transform:translate(26.14px,26.34px) rotate(-14deg) scale(.4) translate(-26.14px,-26.34px)}
38%{opacity:1;transform:translate(26.14px,26.34px) rotate(-14deg) scale(1.15) translate(-26.14px,-26.34px)}
46%{opacity:1;transform:translate(26.14px,26.34px) rotate(-14deg) scale(1) translate(-26.14px,-26.34px)}
62%{opacity:1;transform:translate(40.14px,6.34px) rotate(-30deg) scale(1) translate(-26.14px,-26.34px)}
63%,100%{opacity:0;transform:translate(40.14px,6.34px) rotate(-30deg) scale(1) translate(-26.14px,-26.34px)}}
/* συννεφάκι */
#tpc-fab::before{content:"\03A0 \03BF \03CD  \03BD \03B1  \03C4 \03B1 \03BE \03B9 \03B4 \03AD \03C8 \03C9 ;";position:absolute;right:calc(100% + 14px);top:50%;margin-top:-17px;height:34px;line-height:28px;padding:0 12px;white-space:nowrap;background:#fff;color:#0A2540;border:3px solid #0A2540;border-radius:17px;box-shadow:3px 3px 0 #E28743;font:700 14px/28px Inter,system-ui,Arial,sans-serif;pointer-events:none;transform-origin:100% 50%;transform:scale(0);opacity:0;animation:tpcPop 3.4s infinite;box-sizing:border-box}
html[lang^="en"] #tpc-fab::before{content:"Where to next?"}
@keyframes tpcPop{0%,62%{transform:scale(0);opacity:0}68%{transform:scale(1.2);opacity:1}74%,94%{transform:scale(1);opacity:1}100%{transform:scale(0);opacity:0}}
/* ανοιχτό chat: χωρίς συννεφάκι, ακίνητο σήμα */
#tpc-fab[aria-expanded="true"]::before,html.tpc-open #tpc-fab::before{display:none}
#tpc-fab[aria-expanded="true"] .tpc-mark *,html.tpc-open #tpc-fab .tpc-mark *{animation:none!important;opacity:1;stroke-dashoffset:0}
/* παύση μόνο με αληθινό ποντίκι: στην αφή το :hover «κολλάει» μετά το πάτημα και θα πάγωνε το κινούμενο */
@media (hover:hover) and (pointer:fine){#tpc-fab:hover .tpc-mark *,#tpc-fab:hover::before{animation-play-state:paused}}
@media (max-width:319px){#tpc-fab::before{display:none}}