/* Onboarding (js/onboarding.js), tour guiado (js/tour.js) y perfiles (js/perfiles.js) */

/* ── onboarding a pantalla completa */
.onb{position:fixed;inset:0;z-index:60;background:var(--crema);overflow:auto;animation:onbIn .25s ease}
@keyframes onbIn{from{opacity:0}to{opacity:1}}
.onb__slide{min-height:100%;max-width:520px;margin:0 auto;padding:calc(var(--sat) + 18px) 20px calc(20px + var(--sab));display:flex;flex-direction:column}
.onb__slide--form{padding-top:calc(var(--sat) + 26px)}
.onb__img{width:100%;aspect-ratio:4/3;object-fit:cover;border-radius:20px;background:#f2ecdf;box-shadow:0 10px 30px rgba(20,48,110,.12)}
.onb__kicker{margin-top:18px;font-size:.72rem;font-weight:900;letter-spacing:.08em;color:var(--ambar)}
.onb__t{font-size:1.55rem;font-weight:900;color:var(--marino);margin:4px 0 8px;line-height:1.2}
.onb__b{font-size:1rem;line-height:1.5;color:var(--ink)}
.onb__list{margin:0;padding-left:20px}.onb__list li{margin-bottom:6px}
.onb__dots{display:flex;gap:7px;justify-content:center;margin:18px 0 12px}
.onb__dots i{width:8px;height:8px;border-radius:50%;background:#d8d2c4;transition:background .2s,transform .2s}
.onb__dots i.on{background:var(--ambar);transform:scale(1.25)}
.onb__btns{display:flex;gap:10px;margin-top:auto;padding-top:6px}
.onb__btns .btn{flex:1;margin:0}
.onb__opts{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin:14px 0 4px}
.onb__opt{padding:14px 6px;border-radius:14px;background:#fff;border:2px solid var(--line);font-weight:800;color:var(--marino);font-size:.9rem;display:flex;flex-direction:column;align-items:center;gap:6px}
.onb__opt.is-on{background:var(--ambar);border-color:var(--ambar)}
.onb__emo{font-size:1.8rem}
.onb__lbl{display:block;font-size:.85rem;font-weight:800;color:var(--marino);margin:14px 0 6px}
.onb__in{width:100%;padding:12px 14px;border-radius:12px;border:2px solid var(--line);background:#fff;font:inherit;font-size:1rem}
.onb__in:focus{outline:none;border-color:var(--ambar)}
.onb__nino{background:#fff;border:2px solid var(--line);border-radius:16px;padding:12px;margin:10px 0}
.onb__nino .onb__in{border-width:1.5px}
.onb__x{width:38px;height:38px;border-radius:50%;background:var(--crema);color:var(--marino);font-size:1.3rem;font-weight:900;flex:none;margin-left:8px}
.grados--sm{grid-template-columns:repeat(6,1fr);gap:6px;margin:10px 0 0}
.grados--sm button{padding:10px 2px;font-size:1rem;border-radius:10px}
.onb__chips{display:flex;flex-wrap:wrap;gap:8px;margin:10px 0 4px}
.onb__chip{padding:10px 14px;border-radius:999px;background:#fff;border:2px solid var(--line);font-weight:800;color:var(--marino)}
.onb__chip.is-on{background:var(--ambar);border-color:var(--ambar)}
.onb__err{color:#b91c1c;font-weight:700;font-size:.9rem;margin:8px 0 0}

/* ── tour guiado: spotlight + flecha + tooltip */
.tour{position:fixed;inset:0;z-index:70;animation:onbIn .25s ease}
.tour__hole{position:fixed;border-radius:16px;box-shadow:0 0 0 200vmax rgba(10,22,52,.78);outline:2px solid rgba(251,191,36,.9);outline-offset:2px;transition:left .35s ease,top .35s ease,width .35s ease,height .35s ease;pointer-events:none}
.tour__arrow{position:fixed;inset:0;width:100%;height:100%;pointer-events:none;filter:drop-shadow(0 2px 6px rgba(0,0,0,.45))}
.tour__tip{position:fixed;background:#fff;color:var(--ink);border-radius:16px;padding:14px 16px 12px;box-shadow:0 14px 44px rgba(0,0,0,.4);animation:onbIn .25s ease}
.tour__t{font-size:1.05rem;font-weight:900;color:var(--marino);margin-bottom:5px}
.tour__b{font-size:.92rem;line-height:1.42}
.tour__tip .onb__dots{margin:10px 0 8px}
.tour__btns{display:flex;gap:10px}
.tour__btns .btn{flex:1;margin:0;padding:11px;font-size:.95rem}
.tour__btns .btn[disabled]{opacity:.35}

/* ── perfiles (hoja) */
.pf-lista{margin:12px 0}
.pf-row{display:flex;align-items:center;gap:12px;padding:12px;border-radius:14px;border:2px solid var(--line);background:#fff;margin-bottom:8px}
.pf-row.is-on{border-color:var(--ambar);background:#fffbeb}
.pf-av{width:42px;height:42px;border-radius:50%;background:var(--marino);color:#fff;font-weight:900;font-size:1.2rem;display:flex;align-items:center;justify-content:center;flex:none}
.pf-edit{width:38px;height:38px;border-radius:50%;background:var(--crema);color:var(--marino);font-size:1.1rem;flex:none}
