/* gp-helper.css — componente de «David», el asistente de ayuda de GP (GP-DAVID-IN-APP-INTERFACE-01).
   Prefijo propio: .gph-* (no se usa .gpv-fab, que ya existe como regla huérfana en community-ui.css). Solo usa las variables de color que ya define la app
   (--accent, --bg-elevated, --surface, --ink, --muted, --border…): así sigue el Claro/Oscuro de GP y, dentro de Comunidad, la apariencia visible de body.cm-mode / body.cm-dark,
   sin leer ni escribir ningún ajuste. Ningún archivo ni regla existente se modifica. */
.gph-root{display:contents}
/* Relleno de botones y burbuja propia: SIEMPRE oscuro respecto al acento elegido (acento 2 oscurecido) para que el texto blanco cumpla ≥ 4,5:1 con cualquiera de los 12 «Estilo de fondo» (amarillo, naranja, verde… incluidos). */
.gph-root{--gph-fill-a:var(--accent-2);--gph-fill-b:var(--accent-2)}
@supports (background:color-mix(in srgb,red 50%,blue)){.gph-root{--gph-fill-a:color-mix(in srgb,var(--accent-2) 80%,#000);--gph-fill-b:color-mix(in srgb,var(--accent-2) 64%,#000)}}
.gph-root [hidden]{display:none !important}
.gph-sprite,.gph-probe{position:absolute;width:0;height:0;overflow:hidden;pointer-events:none}
.gph-probe{padding:env(safe-area-inset-top,0px) env(safe-area-inset-right,0px) env(safe-area-inset-bottom,0px) env(safe-area-inset-left,0px);visibility:hidden}
.gph-ic{width:100%;height:100%;display:block}

/* Capas: el botón (30) queda por encima de las barras de GP (20) y por debajo de avisos (60) y modales (70); el panel (58) por debajo de los avisos. */
.gph-fabcol,.gph-panelcol{position:fixed;top:0;bottom:0;left:0;width:100%;pointer-events:none}
.gph-fabcol{z-index:30}
.gph-panelcol{z-index:58}

.gph-fab{position:absolute;left:0;top:0;width:48px;height:48px;padding:0;border:0;border-radius:50%;display:grid;place-items:center;
  background:linear-gradient(120deg,var(--gph-fill-a),var(--gph-fill-b));color:#fff;cursor:grab;pointer-events:auto;
  box-shadow:0 0 0 2px var(--bg-elevated),0 6px 16px rgba(0,0,0,.3);
  touch-action:none;-webkit-user-select:none;user-select:none;-webkit-touch-callout:none;-webkit-tap-highlight-color:transparent;-webkit-user-drag:none}
.gph-fab .gph-ic{width:27px;height:27px}
.gph-fab:focus-visible{outline:3px solid var(--ink);outline-offset:3px}
.gph-fab.gph-dragging{cursor:grabbing;box-shadow:0 0 0 2px var(--bg-elevated),0 10px 24px rgba(0,0,0,.38)}

.gph-scrim{position:absolute;inset:0;background:rgba(10,14,31,.38);pointer-events:auto;touch-action:none}
.gph-shield{position:absolute;inset:0;pointer-events:auto;touch-action:none;background:transparent}
.gph-panel{position:absolute;left:0;right:0;bottom:var(--gph-kb,0px);height:min(calc(var(--gph-vh,100dvh) * .7),560px);
  display:flex;flex-direction:column;background:var(--bg-elevated);color:var(--ink);border-radius:20px 20px 0 0;
  box-shadow:0 -10px 40px rgba(0,0,0,.28);pointer-events:auto;overscroll-behavior:contain;outline:none}
.gph-head{display:flex;align-items:center;gap:10px;padding:6px 6px 2px 16px;touch-action:none;flex:none}
.gph-head-ic{width:30px;height:30px;border-radius:50%;display:grid;place-items:center;padding:5px;box-sizing:border-box;flex:none;
  background:linear-gradient(120deg,var(--gph-fill-a),var(--gph-fill-b));color:#fff}
.gph-title{flex:1;margin:0;font-size:1.05rem;font-weight:800;color:var(--ink)}
.gph-close{width:44px;height:44px;flex:none;padding:11px;box-sizing:border-box;border:0;border-radius:50%;background:transparent;color:var(--ink);cursor:pointer}
.gph-close:focus-visible,.gph-chip:focus-visible,.gph-send:focus-visible,.gph-input:focus-visible,.gph-log:focus-visible{outline:3px solid var(--accent);outline-offset:2px}

.gph-log{flex:1;min-height:0;overflow-y:auto;overscroll-behavior:contain;-webkit-overflow-scrolling:touch;padding:8px 16px 12px;display:flex;flex-direction:column;gap:10px}
.gph-msg{display:flex;flex-direction:column;max-width:90%}
.gph-david{align-self:flex-start}
.gph-user{align-self:flex-end}
.gph-bubble{padding:10px 13px;border-radius:16px;font-size:.92rem;line-height:1.38;white-space:pre-line;overflow-wrap:anywhere;-webkit-user-select:text;user-select:text}
.gph-david .gph-bubble{background:var(--surface-2);color:var(--ink);border:1px solid var(--border);border-bottom-left-radius:5px}
.gph-user .gph-bubble{background:linear-gradient(120deg,var(--gph-fill-a),var(--gph-fill-b));color:#fff;border-bottom-right-radius:5px}
.gph-sub{font-size:.8rem;font-weight:700;color:var(--ink-soft,var(--ink));margin:2px 0 6px}
.gph-sugg{align-self:stretch}
.gph-actions{display:flex;flex-wrap:wrap;gap:8px;margin-top:8px}
.gph-sugg .gph-actions{margin-top:0}
.gph-chip{min-height:44px;max-width:100%;padding:8px 14px;border-radius:22px;border:1.5px solid var(--border);background:var(--surface);color:var(--ink);
  font-size:.88rem;font-weight:600;line-height:1.25;text-align:left;cursor:pointer;-webkit-tap-highlight-color:transparent}
.gph-chip.gph-go{border:0;background:linear-gradient(120deg,var(--gph-fill-a),var(--gph-fill-b));color:#fff;font-weight:700}

.gph-form{display:flex;gap:8px;flex:none;padding:10px 12px calc(10px + env(safe-area-inset-bottom,0px));border-top:1px solid var(--border);background:var(--bg-elevated)}
.gph-root.gph-kb .gph-form{padding-bottom:10px}
.gph-input{flex:1;min-width:0;height:44px;box-sizing:border-box;padding:0 14px;border-radius:22px;border:1.5px solid var(--border);background:var(--surface);color:var(--ink);
  font-size:16px;-webkit-user-select:text;user-select:text}
.gph-input::placeholder{color:var(--muted);opacity:1}
.gph-send{flex:none;min-width:44px;height:44px;padding:0 16px;border:0;border-radius:22px;background:linear-gradient(120deg,var(--gph-fill-a),var(--gph-fill-b));color:#fff;font-weight:700;font-size:.92rem;cursor:pointer}
.gph-sr{position:absolute !important;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}

@media (prefers-reduced-motion:no-preference){
  .gph-panel{animation:gphUp .18s ease}
  .gph-scrim{animation:gphFade .18s ease}
}
@keyframes gphUp{from{transform:translateY(24px);opacity:.6}to{transform:none;opacity:1}}
@keyframes gphFade{from{opacity:0}to{opacity:1}}
