/* GP Asistente de Voz — UI */
.gpv-fab {
    position: fixed; right: 18px; bottom: 84px; z-index: 99990;
    background: linear-gradient(135deg, #7c3aed, #4f46e5); color: #fff; border: none;
    padding: 12px 18px; border-radius: 999px; font-size: 15px; font-weight: 700; cursor: pointer;
    box-shadow: 0 10px 28px -8px rgba(79, 70, 229, .7); display: flex; align-items: center; gap: 8px;
    font-family: system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
}
.gpv-fab:hover { filter: brightness(1.06); }
.gpv-fab span { font-size: 14px; }
@media (max-width: 520px) { .gpv-fab span { display: none; } .gpv-fab { padding: 14px; font-size: 20px; } }

/* Cartel inicial "tocá para empezar" */
.gpv-start-overlay {
    position: fixed; inset: 0; z-index: 99995; display: flex; align-items: center; justify-content: center;
    background: rgba(15, 23, 42, .6); padding: 18px; animation: gpv-fade .2s ease;
    font-family: system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
}
@keyframes gpv-fade { from { opacity: 0; } to { opacity: 1; } }
.gpv-start-card {
    background: #fff; border-radius: 18px; max-width: 380px; width: 100%; text-align: center;
    padding: 26px 22px; box-shadow: 0 20px 60px rgba(2, 6, 23, .4);
}
.gpv-start-ico { font-size: 46px; }
.gpv-start-card h3 { margin: 8px 0 6px; font-size: 21px; color: #0f172a; }
.gpv-start-card p { margin: 0 0 18px; font-size: 14px; color: #475569; line-height: 1.5; }
.gpv-start-btn {
    display: block; width: 100%; background: linear-gradient(135deg, #7c3aed, #4f46e5); color: #fff;
    border: none; padding: 14px; border-radius: 12px; font-size: 17px; font-weight: 800; cursor: pointer;
    box-shadow: 0 10px 26px -8px rgba(79, 70, 229, .7);
}
.gpv-start-btn:hover { filter: brightness(1.06); }
.gpv-start-skip {
    display: block; width: 100%; background: transparent; border: none; color: #94a3b8;
    padding: 12px; margin-top: 6px; font-size: 14px; cursor: pointer;
}

/* Botón arriba del formulario */
.gpv-top-btn {
    display: block; width: 100%; box-sizing: border-box; margin: 0 0 14px;
    background: linear-gradient(135deg, #7c3aed, #4f46e5); color: #fff; border: none;
    padding: 13px 16px; border-radius: 12px; font-size: 16px; font-weight: 700; cursor: pointer;
    box-shadow: 0 8px 22px -10px rgba(79, 70, 229, .7);
    font-family: system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
}
.gpv-top-btn:hover { filter: brightness(1.06); }

/* Resaltado del campo activo */
.gp-fill-field.gpv-active {
    outline: 3px solid #7c3aed; outline-offset: 3px; border-radius: 10px;
    background: rgba(124, 58, 237, .05); transition: outline-color .2s;
}

/* Panel conversacional */
.gpv-panel {
    position: fixed; left: 50%; bottom: -240px; transform: translateX(-50%);
    width: 460px; max-width: 94vw; z-index: 99991;
    background: #0f172a; color: #fff; border-radius: 16px 16px 0 0;
    box-shadow: 0 -12px 40px rgba(2, 6, 23, .5); padding: 14px 16px 18px;
    font-family: system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
    transition: bottom .3s cubic-bezier(.4, 0, .2, 1);
}
.gpv-panel.open { bottom: 0; }
.gpv-panel-head { display: flex; justify-content: space-between; align-items: center; font-size: 13px; font-weight: 700; opacity: .85; margin-bottom: 8px; }
.gpv-x { background: rgba(255,255,255,.12); border: none; color: #fff; width: 26px; height: 26px; border-radius: 8px; cursor: pointer; font-size: 13px; }
.gpv-q { font-size: 18px; font-weight: 700; line-height: 1.3; min-height: 26px; }
.gpv-h { font-size: 14px; color: #a5b4fc; min-height: 20px; margin-top: 6px; font-style: italic; }
.gpv-actions { display: flex; gap: 8px; margin-top: 14px; }
.gpv-b { flex: 1; background: rgba(255,255,255,.12); border: none; color: #fff; padding: 11px 8px; border-radius: 10px; font-weight: 700; font-size: 14px; cursor: pointer; }
.gpv-b.gpv-mic { background: #7c3aed; }
.gpv-b:hover { filter: brightness(1.1); }

/* Estado "escuchando": el botón mic pulsa */
.gpv-panel.gpv-listening .gpv-mic { animation: gpv-pulse 1s infinite; background: #dc2626; }
@keyframes gpv-pulse { 0%,100% { box-shadow: 0 0 0 0 rgba(220,38,38,.6); } 50% { box-shadow: 0 0 0 10px rgba(220,38,38,0); } }
