/* Prediagnóstico guiado: widget (página /prediagnostico y panel deslizante),
   lanzador flotante y aviso. Hand-written, no pasa por Tailwind. */

/* ---------- Widget ---------- */
.pd-widget{background:linear-gradient(180deg,#0E172A,#0B1120);border:1px solid #1F2937;border-radius:18px;overflow:hidden;box-shadow:0 20px 60px rgba(0,0,0,.45);display:flex;flex-direction:column;position:relative}
.pd-head{display:flex;align-items:center;gap:12px;padding:14px 18px;border-bottom:1px solid #1F2937;background:rgba(2,6,23,.55);flex-shrink:0}
.pd-head img{width:38px;height:38px;border-radius:50%;object-fit:cover;border:2px solid rgba(220,38,38,.6)}
.pd-head strong{display:block;font-size:.9rem;color:#F9FAFB;line-height:1.2}
.pd-head span.pd-sub{font-size:.72rem;color:#8b94a7}
.pd-head .pd-online{display:inline-block;width:7px;height:7px;border-radius:50%;background:#34D399;margin-right:5px;vertical-align:middle;box-shadow:0 0 8px rgba(52,211,153,.7)}
.pd-progress{margin-left:auto;font-size:.68rem;color:#8b94a7;letter-spacing:.08em;text-transform:uppercase;white-space:nowrap}
.pd-bar{height:3px;background:#1F2937;flex-shrink:0}
.pd-bar > span{display:block;height:100%;width:0;background:linear-gradient(90deg,#DC2626,#F97316);transition:width .4s ease}
.pd-log{padding:22px 18px 8px;display:flex;flex-direction:column;gap:12px;min-height:280px}
.pd-row{display:flex;align-items:flex-end;gap:8px;max-width:92%}
.pd-row.pd-from-bot{align-self:flex-start}
.pd-row.pd-from-user{align-self:flex-end;flex-direction:row-reverse}
.pd-row img{width:26px;height:26px;border-radius:50%;object-fit:cover;flex-shrink:0;border:1px solid rgba(220,38,38,.5)}
.pd-msg{padding:12px 16px;border-radius:16px;font-size:.95rem;line-height:1.55;animation:pd-in .25s ease}
.pd-msg p{margin:0}
.pd-bot{background:#111827;border:1px solid #1F2937;color:#E5E7EB;border-bottom-left-radius:4px}
.pd-user{background:rgba(220,38,38,.16);border:1px solid rgba(220,38,38,.35);color:#F9FAFB;border-bottom-right-radius:4px}
@keyframes pd-in{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}
.pd-typing{display:flex;gap:5px;align-items:center;min-height:44px}
.pd-typing span{width:7px;height:7px;border-radius:50%;background:#6B7280;animation:pd-blink 1s infinite}
.pd-typing span:nth-child(2){animation-delay:.2s}.pd-typing span:nth-child(3){animation-delay:.4s}
@keyframes pd-blink{0%,80%,100%{opacity:.25}40%{opacity:1}}
@media(prefers-reduced-motion:reduce){.pd-typing span{animation:none;opacity:.6}.pd-msg{animation:none}}
.pd-input{padding:12px 18px 18px;display:flex;flex-direction:column;gap:12px;border-top:1px solid rgba(31,41,55,.6);background:rgba(2,6,23,.35);flex-shrink:0}
.pd-options{display:flex;flex-wrap:wrap;gap:8px}
.pd-btn{appearance:none;border:1px solid #374151;background:#111827;color:#E5E7EB;border-radius:999px;padding:10px 16px;font-size:.9rem;font-weight:500;cursor:pointer;transition:border-color .15s ease,background .15s ease,color .15s ease,transform .15s ease;text-decoration:none;display:inline-flex;align-items:center;justify-content:center;gap:8px;line-height:1.2;font-family:inherit}
.pd-btn:hover{border-color:#DC2626;color:#fff}
.pd-btn:focus-visible{outline:2px solid #F87171;outline-offset:2px}
.pd-btn:disabled{opacity:.45;cursor:not-allowed}
.pd-primary{background:#DC2626;border-color:#DC2626;color:#fff;align-self:flex-start}
.pd-primary:hover:not(:disabled){background:#b91c1c;transform:translateY(-1px)}
.pd-chip.pd-on{background:rgba(220,38,38,.18);border-color:#DC2626;color:#fff}
.pd-chip.pd-on::before{content:'✓';font-size:.8em}
.pd-link{border:none;background:transparent;color:#9CA3AF;text-decoration:underline;text-underline-offset:3px;padding:6px 4px;align-self:flex-start;font-size:.85rem}
.pd-link:hover{color:#fff}
.pd-wa{background:#25D366;border-color:#25D366;color:#073b1f;font-weight:600}
.pd-wa:hover{background:#1fb457;color:#052b17}
.pd-form{display:flex;flex-wrap:wrap;gap:8px;align-items:center}
.pd-text{flex:1 1 220px;min-width:0;background:#0B1120;border:1px solid #374151;color:#F9FAFB;border-radius:12px;padding:11px 14px;font-size:.95rem;font-family:inherit}
.pd-text:focus{outline:none;border-color:#DC2626;box-shadow:0 0 0 3px rgba(220,38,38,.18)}
.pd-foot{display:flex;justify-content:space-between;align-items:center;gap:8px;flex-wrap:wrap}
.pd-foot .pd-link{padding:4px 0}

/* Ficha de resultado */
.pd-card{background:#0B1120;border:1px solid rgba(220,38,38,.35);border-radius:16px;padding:22px 20px;display:flex;flex-direction:column;gap:12px;box-shadow:0 0 40px rgba(220,38,38,.08);align-self:stretch;animation:pd-in .3s ease}
.pd-kicker{font-size:.68rem;letter-spacing:.2em;text-transform:uppercase;color:#8b94a7;margin:8px 0 0}
.pd-title{font-family:'Space Grotesk','Space Grotesk Fallback',system-ui,sans-serif;font-size:1.35rem;font-weight:600;color:#F9FAFB;margin:0;line-height:1.25}
.pd-svc{color:#F87171;text-decoration:underline;text-underline-offset:4px}
.pd-why,.pd-notas,.pd-puntos{color:#CBD5E1;font-size:.93rem;line-height:1.55;margin:0}
.pd-notas{padding-left:18px;list-style:disc}
.pd-notas li{margin:4px 0}
.pd-ficha{display:grid;grid-template-columns:max-content 1fr;gap:6px 14px;margin:0;font-size:.9rem;line-height:1.5}
.pd-ficha dt{color:#8b94a7;white-space:nowrap}
.pd-ficha dd{margin:0;color:#E5E7EB}
.pd-ficha dd strong{color:#fff}
.pd-coste{display:flex;gap:14px;flex-wrap:wrap}
.pd-coste div{flex:1 1 120px;background:#111827;border:1px solid #1F2937;border-radius:12px;padding:12px 14px}
.pd-coste b{display:block;font-size:1.35rem;color:#fff;font-family:'Space Grotesk','Space Grotesk Fallback',system-ui,sans-serif;line-height:1.1}
.pd-coste small{font-size:.72rem;color:#8b94a7;text-transform:uppercase;letter-spacing:.06em}
.pd-details{border:1px solid #1F2937;border-radius:12px;background:#020617}
.pd-details summary{cursor:pointer;padding:10px 14px;font-size:.85rem;color:#CBD5E1;list-style:none;display:flex;align-items:center;gap:8px}
.pd-details summary::-webkit-details-marker{display:none}
.pd-details summary::before{content:'▸';color:#F87171;transition:transform .2s}
.pd-details[open] summary::before{transform:rotate(90deg)}
.pd-texto{width:100%;background:#020617;border:none;border-top:1px solid #1F2937;color:#E5E7EB;padding:12px 14px;font-size:.86rem;line-height:1.5;font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;resize:vertical;display:block}
.pd-texto:focus{outline:none}
.pd-actions{display:flex;flex-wrap:wrap;gap:8px;margin-top:4px}
.pd-hint{font-size:.75rem;color:#8b94a7;margin:0}

/* ---------- Página /prediagnostico ---------- */
.pd-wrap{display:grid;gap:40px;align-items:start}
@media(min-width:1024px){.pd-wrap{grid-template-columns:minmax(0,1.5fr) minmax(280px,1fr)}}
.pd-side{display:flex;flex-direction:column;gap:18px}
.pd-side-card{background:#0B1120;border:1px solid #1F2937;border-radius:16px;padding:22px}
.pd-side-card h2{font-size:.72rem;letter-spacing:.2em;text-transform:uppercase;color:#8b94a7;margin:0 0 14px}
.pd-side-card ul{margin:0;padding:0;list-style:none;display:flex;flex-direction:column;gap:10px}
.pd-side-card li{display:flex;gap:10px;font-size:.9rem;color:#CBD5E1;line-height:1.5}
.pd-side-card li i{color:#F87171;margin-top:4px;flex-shrink:0}
.pd-side-card p{font-size:.88rem;color:#CBD5E1;line-height:1.55;margin:0}
.pd-side-card a{color:#fff;text-decoration:underline;text-underline-offset:3px}

/* ---------- Panel deslizante ---------- */
#pd-drawer{position:fixed;inset:0;z-index:10000;display:none}
#pd-drawer.pd-open{display:block}
#pd-drawer .pd-backdrop{position:absolute;inset:0;background:rgba(2,6,23,.7);backdrop-filter:blur(3px);-webkit-backdrop-filter:blur(3px);animation:pd-fade .2s ease}
@keyframes pd-fade{from{opacity:0}to{opacity:1}}
#pd-drawer .pd-panel{position:absolute;top:0;right:0;bottom:0;width:min(480px,100%);background:#0B1120;border-left:1px solid #1F2937;box-shadow:-20px 0 60px rgba(0,0,0,.5);display:flex;flex-direction:column;animation:pd-slide .28s ease}
@keyframes pd-slide{from{transform:translateX(40px);opacity:0}to{transform:none;opacity:1}}
@media(prefers-reduced-motion:reduce){#pd-drawer .pd-panel,#pd-drawer .pd-backdrop{animation:none}}
#pd-drawer .pd-close{position:absolute;top:12px;right:12px;z-index:2;width:36px;height:36px;border-radius:50%;border:1px solid #374151;background:#111827;color:#E5E7EB;cursor:pointer;font-size:1rem;display:flex;align-items:center;justify-content:center}
#pd-drawer .pd-close:hover{border-color:#DC2626;color:#fff}
#pd-drawer .pd-widget{border:none;border-radius:0;box-shadow:none;height:100%;min-height:0}
#pd-drawer .pd-head{padding-right:56px}
#pd-drawer .pd-log{flex:1 1 auto;overflow-y:auto;min-height:0;overscroll-behavior:contain}
#pd-drawer .pd-row{max-width:95%}
body.pd-locked{overflow:hidden}
