/* Pappitas — Tienda master (onboarding del vendedor, submódulo MASTER, editor de portada Bento) */
.tm-loading{padding:48px 20px;text-align:center;color:var(--text-muted,#6b7280);font-size:14px}

/* ── Paso 1: una pregunta por pantalla ── */
.tm-flow{max-width:460px;margin:0 auto;display:flex;flex-direction:column;padding:4px 2px 24px}
.tm-flow__top{display:flex;align-items:center;gap:16px;height:44px}
.tm-round{width:40px;height:40px;flex-shrink:0;border-radius:50%;border:0;background:var(--bg-card,#fff);box-shadow:inset 0 0 0 1px var(--border,#e5e7eb);display:flex;align-items:center;justify-content:center;color:var(--text-primary,#111);cursor:pointer}
.tm-round .icon{width:18px;height:18px}
.tm-round--ghost{visibility:hidden}
.tm-bars{flex:1;display:flex;gap:6px}
.tm-bars span{flex:1;height:4px;border-radius:4px;background:var(--border,#e5e7eb);transition:background .3s}
.tm-bars span.is-on{background:var(--text-primary,#111)}
.tm-flow__body{padding-top:7vh}
.tm-flow__body h1{margin:0;font-size:34px;line-height:1.08;font-weight:700;letter-spacing:-.035em;color:var(--text-primary,#111)}
.tm-flow__body>p{margin:10px 0 28px;font-size:16px;line-height:1.45;color:var(--text-muted,#6b7280)}
.tm-flow .tm-field{display:block;width:100%;height:60px;box-sizing:border-box;border:0;border-radius:16px;background:var(--bg-card,#fff);box-shadow:inset 0 0 0 1.5px var(--border,#e5e7eb);padding:0 18px;font:inherit;font-size:20px;font-weight:700;color:var(--text-primary,#111);outline:none;transition:box-shadow .15s}
.tm-field:focus,.tm-field:focus-within{box-shadow:inset 0 0 0 2px var(--text-primary,#111)}
.tm-field::placeholder,.tm-field input::placeholder{color:var(--text-muted,#9ca3af);font-weight:600}
.tm-flow .tm-field--tel{display:flex;align-items:center;gap:8px}
.tm-field--tel span{font-size:20px;font-weight:700;color:var(--text-muted,#6b7280)}
.tm-field--tel input{flex:1;min-width:0;height:100%;border:0!important;background:none!important;box-shadow:none!important;outline:none;padding:0!important;border-radius:0!important;font:inherit;font-size:20px;font-weight:700;color:var(--text-primary,#111)}
.tm-list{background:var(--bg-card,#fff);border-radius:18px;box-shadow:inset 0 0 0 1px var(--border,#e5e7eb);max-height:46vh;overflow-y:auto;-webkit-overflow-scrolling:touch}
.tm-list__row{display:flex;align-items:center;justify-content:space-between;width:100%;height:54px;padding:0 18px;border:0;border-bottom:1px solid var(--border,#eef0f3);background:none;font:inherit;font-size:17px;font-weight:600;color:var(--text-primary,#111);text-align:left;cursor:pointer}
.tm-list__row:last-child{border-bottom:0}
.tm-list__row svg{width:20px;height:20px;color:#0071e3;opacity:0;flex-shrink:0}
.tm-list__row.is-on svg{opacity:1}
.tm-colors{display:flex;gap:14px;flex-wrap:wrap}
.tm-color{position:relative;width:48px;height:48px;border-radius:50%;border:0;padding:0;background:var(--c);box-shadow:inset 0 0 0 1px rgba(0,0,0,.08);cursor:pointer;transition:box-shadow .15s}
.tm-color.is-on{box-shadow:0 0 0 3px var(--bg-app,#f5f5f7),0 0 0 5px var(--c)}
.tm-color--custom{background:conic-gradient(#ef4444,#f59e0b,#22c55e,#06b6d4,#3b82f6,#a855f7,#ef4444)}
.tm-color--custom.is-on{background:var(--c)}
.tm-color--custom input{position:absolute;inset:0;width:100%;height:100%;opacity:0;cursor:pointer}
.tm-logo{display:flex;align-items:center;gap:14px;margin-top:32px}
.tm-logo__img{width:64px;height:64px;flex-shrink:0;border-radius:16px;overflow:hidden;background:var(--bg-card,#fff);box-shadow:inset 0 0 0 1px var(--border,#e5e7eb);display:flex;align-items:center;justify-content:center;color:var(--text-muted,#6b7280)}
.tm-logo__img img{width:100%;height:100%;object-fit:cover}
.tm-logo__img--empty{cursor:pointer;box-shadow:inset 0 0 0 1.5px var(--border,#d1d5db)}
.tm-logo__img .icon{width:22px;height:22px}
.tm-logo__t{flex:1;font-size:16px;font-weight:600;color:var(--text-primary,#111)}
.tm-logo__t span{font-weight:500;color:var(--text-muted,#6b7280)}
.tm-link{border:0;background:none;font:inherit;font-size:14px;font-weight:600;color:#0071e3;cursor:pointer;padding:4px 0}
.tm-link--danger{color:var(--c-danger,#dc2626)}
.tm-next{width:100%;height:56px;margin-top:28px;border:0;border-radius:16px;background:var(--text-primary,#1d1d1f);color:var(--bg-card,#fff);font:inherit;font-size:17px;font-weight:600;cursor:pointer;transition:opacity .2s}
.tm-next:disabled{opacity:.25;cursor:default}
@media(max-width:520px){
  .tm-flow{min-height:calc(100vh - 120px)}
  .tm-flow__body{flex:1;padding-top:4vh}
  .tm-flow__body h1{font-size:28px}
}

/* ── Paso 2: vista previa + elegir ── */
.tm-pv{max-width:100%;overflow-x:hidden;display:grid;grid-template-columns:340px minmax(0,420px);grid-template-areas:"phone head" "phone side";grid-template-rows:auto 1fr;column-gap:40px;justify-content:center;align-items:start;margin:8px auto 40px}
.tm-pv__head{grid-area:head;padding-top:24px}
.tm-pv__phone{grid-area:phone}
.tm-pv__side{grid-area:side}
.tm-pv__head h1{font-size:30px;font-weight:800;letter-spacing:-.035em;line-height:1.1;margin:0}
.tm-pv__lead{margin:10px 0 22px;font-size:15px;line-height:1.5;color:var(--text-muted,#6b7280)}

/* iPhone para la vista previa: pantalla real de 390×844, escalada con transform (ver fitPhones en tienda-master.js) */
.tm-phonefit{position:relative;flex-shrink:0;margin:0 auto}
.tm-phonefit>.tm-iphone{position:absolute;left:0;top:0;transform-origin:0 0}
.tm-iphone{width:414px;height:868px;padding:12px;box-sizing:border-box;border-radius:62px;background:#0b0b0c;box-shadow:0 0 0 2px #3a3a3c,0 0 0 4px #1a1a1c,0 40px 80px -30px rgba(0,0,0,.45);position:relative}
.tm-iphone__screen{position:relative;width:100%;height:100%;border-radius:50px;overflow:hidden;clip-path:inset(0 round 50px);isolation:isolate;background:#f5f5f7;display:flex;flex-direction:column}
.tm-iphone__status{position:relative;flex:0 0 50px;display:flex;align-items:center;justify-content:space-between;padding:4px 30px 0 40px;background:#f5f5f7;color:#000;font:600 16px/1 -apple-system,"SF Pro Text","Inter",system-ui,sans-serif;z-index:2}
.tm-iphone__island{position:absolute;left:50%;top:11px;width:122px;height:35px;margin-left:-61px;border-radius:20px;background:#000}
.tm-iphone__icons{display:flex;align-items:center;gap:6px}
.tm-iphone__icons svg{height:11px;fill:#000}
.tm-iphone__bat{width:25px;height:12px;border-radius:3.5px;box-shadow:inset 0 0 0 1px rgba(0,0,0,.4);padding:2px;box-sizing:border-box;position:relative}
.tm-iphone__bat:after{content:"";position:absolute;right:-3px;top:4px;width:1.5px;height:4px;border-radius:0 1px 1px 0;background:rgba(0,0,0,.4)}
.tm-iphone__bat span{display:block;width:80%;height:100%;border-radius:1.5px;background:#000}
.tm-iphone iframe{flex:1;width:100%;border:0;display:block;border-radius:0 0 50px 50px;clip-path:inset(0 round 0 0 50px 50px);-webkit-mask-image:-webkit-radial-gradient(white,black);background:#f5f5f7;transition:opacity .2s}
.tm-iphone iframe.is-loading{opacity:.5}
.tm-iphone__home{position:absolute;left:50%;bottom:8px;width:134px;height:5px;margin-left:-67px;border-radius:3px;background:#000;z-index:2;pointer-events:none}
.tm-done{width:48px;height:48px;border-radius:50%;background:#34c759;color:#fff;display:flex;align-items:center;justify-content:center;margin-bottom:16px}
.tm-done svg{width:24px;height:24px}
.tm-next--ghost{margin-top:10px;background:var(--bg-card,#fff);color:var(--text-primary,#111);box-shadow:inset 0 0 0 1.5px var(--border,#e5e7eb)}
.tm-pv__side .tm-next:first-child{margin-top:0}

@media(max-width:900px){
  .tm-pv{grid-template-columns:1fr;grid-template-areas:"head" "phone" "side";grid-template-rows:auto;row-gap:18px}
  .tm-pv__head{padding-top:0}
  .tm-pv__phone{display:flex;justify-content:center}
  .tm-pv__side{position:sticky;bottom:0;z-index:5;margin:0 -4px;padding:12px 4px calc(12px + env(safe-area-inset-bottom));background:linear-gradient(180deg,rgba(255,255,255,0),var(--bg-app,#f5f5f7) 22%)}
        }
@media(max-width:520px){
  .tm-pv__head h1{font-size:24px}
}


/* ── Submódulo MASTER ── */
.tm-mh{display:flex;justify-content:space-between;align-items:center;gap:16px;flex-wrap:wrap;margin-bottom:16px}
.tm-mh h1{margin:0}
.tm-mh p{margin:2px 0 0;max-width:560px}
.tm-mh__a{display:flex;gap:10px}
.tm-mh__a button{width:auto;padding:10px 20px}
.tm-mgrid{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:24px;align-items:start}
.tm-mcol{display:flex;flex-direction:column;gap:16px;min-width:0}
.tm-sec{padding:18px 22px 22px}
.tm-hint{margin:0 0 12px;font-size:13px;color:var(--text-muted,#6b7280);line-height:1.45}
.tm-sub{display:flex;align-items:center;gap:8px;margin:18px 0 10px;font-size:13.5px;font-weight:700}
.tm-sub span{font-weight:500;color:var(--text-muted,#6b7280)}
.tm-mpv{position:sticky;top:76px;width:340px}
.tm-mpv__lbl{font-size:12.5px;font-weight:700;color:var(--text-muted,#6b7280);margin-bottom:10px;text-align:center}
@media(max-width:1180px){.tm-mgrid{grid-template-columns:1fr}.tm-mpv{position:static;width:100%;display:flex;justify-content:center}.tm-mpv__in{width:100%;max-width:340px}}

/* Filas de foto (carrusel / productos de ejemplo) */
.tm-slide{display:grid;grid-template-columns:72px minmax(0,1fr) auto;gap:12px;align-items:center;padding:10px;border:1px solid var(--border,#e5e7eb);border-radius:14px;margin-bottom:8px;background:var(--bg-card,#fff)}
.tm-slide__img{width:72px;height:72px;border-radius:10px;overflow:hidden;cursor:pointer;background:var(--bg-hover,#f3f4f6)}
.tm-slide__img img{width:100%;height:100%;object-fit:cover;display:block}
.tm-slide__f{display:flex;flex-direction:column;gap:6px;min-width:0}
.tm-slide__f .form-input{height:36px;font-size:13.5px}
.tm-2{display:grid;grid-template-columns:1fr 1fr;gap:6px}
.tm-slide__a{display:flex;flex-direction:column;gap:4px}
.tm-add{display:flex;align-items:center;justify-content:center;gap:8px;height:46px;border:1.5px dashed var(--border,#d1d5db);border-radius:14px;font-size:13.5px;font-weight:600;color:var(--text-secondary,#4b5563);cursor:pointer}
.tm-add .icon{width:16px;height:16px}
.tm-pick{display:flex;align-items:center;gap:14px}
.tm-pick img{width:120px;height:72px;border-radius:10px;object-fit:cover}
.tm-pimg{margin-bottom:4px}

/* Modal de vista previa del workspace */
.tm-pvmodal{display:flex;align-items:center;justify-content:center}
.tm-pvmodal__box{position:relative;text-align:center}
.tm-pvmodal__box p{color:#fff;font-size:13px;margin:10px 0 0;opacity:.85}
.tm-pvmodal__x{position:absolute;top:-6px;right:-52px;background:#fff !important;color:#111}
@media(max-width:520px){.tm-pvmodal__x{right:8px;top:-48px}}

/* Insignia "Mi primera tienda" (listado de Tiendas, solo si hay una sola) */
.tm-first-badge{position:absolute;top:12px;right:12px;display:inline-flex;align-items:center;gap:6px;height:26px;padding:0 11px 0 9px;border-radius:999px;background:linear-gradient(135deg,#1d1d1f 0%,#3a3a3c 100%);color:#fff;font-size:12px;font-weight:700;letter-spacing:.01em;box-shadow:0 6px 14px -6px rgba(0,0,0,.45),inset 0 1px 0 rgba(255,255,255,.14)}
.tm-first-badge svg{width:13px;height:13px;fill:#f5c451}
