/* creato con il cuore da rosario cinque */
/* Fivetech — Assistente vocale AI in tempo reale (Google Gemini Live). */

#ftva-fab,#ftva-panel,#ftva-fab *,#ftva-panel *{box-sizing:border-box;}

:root{
  --ftva-navy:#050b18;
  --ftva-navy-2:#0b1526;
  --ftva-blue:#1a6fd4;
  --ftva-blue-2:#2a85f5;
  --ftva-amber:#f59e0b;
  --ftva-amber-2:#f97316;
  --ftva-txt:#eaf1fb;
  --ftva-txt-dim:rgba(234,241,251,.62);
  --ftva-line:rgba(255,255,255,.12);
  --ftva-font:Inter,system-ui,-apple-system,"Segoe UI",Arial,sans-serif;
}

/* ───────────────── pulsante flottante ───────────────── */
#ftva-fab{
  position:fixed;right:24px;bottom:24px;z-index:9997;
  width:60px;height:60px;padding:0;border:none;border-radius:50%;cursor:pointer;
  background:linear-gradient(140deg,#0b1526 0%,var(--ftva-blue) 62%,var(--ftva-blue-2) 120%);
  color:#fff;display:flex;align-items:center;justify-content:center;
  box-shadow:0 10px 28px rgba(26,111,212,.48),inset 0 0 0 1px rgba(42,133,245,.45);
  -webkit-tap-highlight-color:transparent;
  transition:transform .25s cubic-bezier(.34,1.56,.64,1),box-shadow .25s,opacity .2s;
}
#ftva-fab svg{width:26px;height:26px;position:relative;z-index:2;}
#ftva-fab:hover{transform:translateY(-4px) scale(1.05);box-shadow:0 16px 36px rgba(42,133,245,.55),inset 0 0 0 1px rgba(42,133,245,.7);}
#ftva-fab:active{transform:scale(.94);}
#ftva-fab:focus-visible{outline:3px solid var(--ftva-amber);outline-offset:3px;}
#ftva-fab[hidden]{display:none;}
#ftva-fab.ftva-off{opacity:0;pointer-events:none;transform:scale(.6);}
#ftva-fab::before{
  content:"";position:absolute;inset:0;border-radius:50%;pointer-events:none;
  border:2px solid rgba(42,133,245,.5);animation:ftva-pulse 2.8s ease-out infinite;
}
@keyframes ftva-pulse{0%{transform:scale(1);opacity:.7;}70%{transform:scale(1.7);opacity:0;}100%{opacity:0;}}

#ftva-tip{
  position:absolute;right:72px;top:50%;transform:translateY(-50%) translateX(8px);
  background:rgba(5,11,24,.96);color:#fff;font:600 13px/1 var(--ftva-font);
  padding:9px 13px;border-radius:9px;white-space:nowrap;opacity:0;pointer-events:none;
  border:1px solid rgba(42,133,245,.34);transition:opacity .25s,transform .25s;
}
#ftva-fab:hover #ftva-tip{opacity:1;transform:translateY(-50%) translateX(0);}
@media(max-width:768px){#ftva-tip{display:none;}}

/* ───────────────── pannello ───────────────── */
#ftva-panel{
  position:fixed;right:24px;bottom:24px;z-index:9998;
  width:min(340px,calc(100vw - 32px));
  background:linear-gradient(165deg,rgba(11,21,38,.98),rgba(5,11,24,.98));
  border:1px solid var(--ftva-line);border-radius:20px;
  box-shadow:0 26px 70px rgba(0,0,0,.6),0 0 0 1px rgba(42,133,245,.14);
  -webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);
  color:var(--ftva-txt);font-family:var(--ftva-font);
  padding:18px 18px 16px;
  display:none;opacity:0;transform:translateY(14px) scale(.97);
  transition:opacity .28s ease,transform .28s cubic-bezier(.34,1.3,.64,1);
}
#ftva-panel.ftva-open{display:block;opacity:1;transform:translateY(0) scale(1);}

.ftva-head{display:flex;align-items:center;gap:10px;margin-bottom:14px;}
.ftva-dot{width:9px;height:9px;border-radius:50%;background:var(--ftva-blue-2);flex:none;
  box-shadow:0 0 0 4px rgba(42,133,245,.18);animation:ftva-blink 2s ease-in-out infinite;}
@keyframes ftva-blink{0%,100%{opacity:1;}50%{opacity:.35;}}
.ftva-head h2{margin:0;font-size:.95rem;font-weight:700;letter-spacing:.01em;flex:1;}
.ftva-head h2 span{color:var(--ftva-blue-2);}
#ftva-x{
  width:30px;height:30px;flex:none;border-radius:9px;border:1px solid var(--ftva-line);
  background:rgba(255,255,255,.05);color:var(--ftva-txt-dim);font-size:15px;line-height:1;
  cursor:pointer;transition:background .2s,color .2s;
}
#ftva-x:hover{background:rgba(255,255,255,.12);color:#fff;}
#ftva-x:focus-visible,.ftva-btn:focus-visible{outline:3px solid var(--ftva-amber);outline-offset:2px;}

/* stato + onda */
.ftva-stage{
  display:flex;flex-direction:column;align-items:center;gap:12px;
  padding:14px 8px 16px;border-radius:15px;
  background:radial-gradient(120% 90% at 50% 0%,rgba(26,111,212,.16),transparent 70%);
}
.ftva-wave{display:flex;align-items:center;justify-content:center;gap:4px;height:42px;}
.ftva-wave i{
  display:block;width:4px;height:8px;border-radius:3px;
  background:linear-gradient(180deg,var(--ftva-blue-2),var(--ftva-blue));
  transform-origin:center;
}
#ftva-panel[data-state="listening"] .ftva-wave i{animation:ftva-bar 1.1s ease-in-out infinite;}
#ftva-panel[data-state="speaking"] .ftva-wave i{animation:ftva-bar .62s ease-in-out infinite;
  background:linear-gradient(180deg,var(--ftva-amber),var(--ftva-amber-2));}
#ftva-panel[data-state="thinking"] .ftva-wave i{animation:ftva-bar 1.8s ease-in-out infinite;opacity:.55;}
.ftva-wave i:nth-child(1){animation-delay:0s;}
.ftva-wave i:nth-child(2){animation-delay:.09s;}
.ftva-wave i:nth-child(3){animation-delay:.18s;}
.ftva-wave i:nth-child(4){animation-delay:.27s;}
.ftva-wave i:nth-child(5){animation-delay:.36s;}
.ftva-wave i:nth-child(6){animation-delay:.45s;}
.ftva-wave i:nth-child(7){animation-delay:.54s;}
@keyframes ftva-bar{0%,100%{height:8px;}50%{height:34px;}}

.ftva-state{font-size:.86rem;font-weight:600;color:var(--ftva-txt);text-align:center;margin:0;}
.ftva-sub{font-size:.76rem;line-height:1.45;color:var(--ftva-txt-dim);text-align:center;margin:0;}
.ftva-live{
  min-height:0;font-size:.78rem;line-height:1.5;color:var(--ftva-txt-dim);
  text-align:center;margin:0;max-height:64px;overflow:hidden;
}

/* bottoni */
.ftva-acts{display:flex;flex-direction:column;gap:8px;margin-top:14px;}
.ftva-btn{
  display:flex;align-items:center;justify-content:center;gap:8px;
  width:100%;padding:11px 14px;border-radius:12px;cursor:pointer;
  font:600 .84rem/1.2 var(--ftva-font);text-decoration:none;
  border:1px solid transparent;transition:transform .2s,background .2s,box-shadow .2s,border-color .2s;
}
.ftva-btn:active{transform:scale(.98);}
.ftva-primary{background:linear-gradient(135deg,var(--ftva-blue),var(--ftva-blue-2));color:#fff;
  box-shadow:0 8px 22px rgba(26,111,212,.38);}
.ftva-primary:hover{transform:translateY(-2px);box-shadow:0 12px 28px rgba(42,133,245,.48);}
.ftva-call{background:rgba(245,158,11,.12);border-color:rgba(245,158,11,.42);color:var(--ftva-amber);}
.ftva-call:hover{background:rgba(245,158,11,.2);border-color:var(--ftva-amber);}
.ftva-wa{background:rgba(37,211,102,.1);border-color:rgba(37,211,102,.36);color:#25d366;}
.ftva-wa:hover{background:rgba(37,211,102,.18);}
.ftva-ghost{background:rgba(255,255,255,.05);border-color:var(--ftva-line);color:var(--ftva-txt-dim);}
.ftva-ghost:hover{background:rgba(255,255,255,.11);color:#fff;}

.ftva-note{margin:10px 0 0;font-size:.68rem;line-height:1.45;color:rgba(234,241,251,.38);text-align:center;}
.ftva-err{margin:0;font-size:.78rem;line-height:1.45;color:#fca5a5;text-align:center;}

/* schermate */
.ftva-view{display:none;}
.ftva-view.ftva-on{display:block;}
.ftva-ico{
  width:52px;height:52px;margin:0 auto 12px;border-radius:50%;
  display:flex;align-items:center;justify-content:center;
  background:radial-gradient(circle at 35% 30%,rgba(42,133,245,.34),rgba(26,111,212,.12));
  border:1px solid rgba(42,133,245,.4);color:var(--ftva-blue-2);
}
.ftva-ico svg{width:24px;height:24px;}

/* mobile: sopra sticky-bar e back-top, senza coprire lo showcase 3D */
@media(max-width:768px){
  #ftva-fab{right:14px;bottom:142px;width:54px;height:54px;}
  #ftva-fab svg{width:23px;height:23px;}
  #ftva-panel{right:12px;left:12px;bottom:206px;width:auto;padding:16px 15px 14px;border-radius:18px;}
  .ftva-stage{padding:10px 6px 12px;}
  .ftva-wave{height:36px;}
  @keyframes ftva-bar{0%,100%{height:7px;}50%{height:28px;}}
}
@media(max-width:768px) and (max-height:700px){
  #ftva-panel{bottom:196px;}
  .ftva-live{max-height:40px;}
}

@media(prefers-reduced-motion:reduce){
  #ftva-fab,#ftva-fab::before,.ftva-dot,.ftva-wave i,#ftva-panel,.ftva-btn{
    animation:none!important;transition:none!important;
  }
  #ftva-panel{transform:none!important;}
  .ftva-wave i{height:20px;}
}