/* ---------- Lugar, inversión y proforma (cambios de mayo) ---------- */
.place-box{display:grid;gap:8px;justify-items:start;border:1px dashed var(--line);border-radius:var(--r);padding:10px 12px;width:100%}
.place-view{display:grid;gap:2px;font-size:13px}.place-view .sub{color:var(--mute);font-size:12px}
.inv-ind{border-radius:var(--r);background:var(--brand-50);color:var(--ink);padding:9px 12px;font-size:13px}

/* botón de WhatsApp (verde de la marca) */
.btn-wa{background:#25D366;color:#fff;border-color:#25D366}
.btn-wa:hover{background:#1ebe5a;border-color:#1ebe5a;color:#fff}
.btn-wa .ic{stroke:#fff}

/* editor de proforma */
.pf-lines .c-prod{min-width:230px}
.pf-lines .c-d{width:84px}
.pf-lines .c-p .num,.pf-lines .c-s{white-space:nowrap}
.pf-sku{display:block;margin-top:3px;color:var(--mute);font-size:11.5px}
.pf-hist{display:grid;gap:8px;border-top:1px solid var(--line);padding-top:14px}
.pf-hist .tl{display:grid;gap:10px;max-height:320px;overflow:auto}

/* hoja de la proforma */
.paper .p-doc .p-unit{font:700 12px var(--f);color:var(--paper-brand);margin:2px 0 4px}
.paper .p-legal{font-size:11.5px;font-weight:700;color:var(--paper-brand);background:#f4eef3;border:1px solid var(--paper-brand);border-radius:8px;padding:9px 12px}
.paper .p-tbl td.mono{font-family:var(--f-mono);font-size:11.5px;white-space:nowrap}
.pf-lines .c-c{width:96px;white-space:nowrap;font-size:12.5px}
.pf-lines .c-prod{min-width:260px}
.note{margin:0;font-size:12.5px;line-height:1.5;color:var(--mute);max-width:980px}.note strong{color:var(--ink);font-weight:600}

/* proyección ≠ venta real: color propio (turquesa) y borde punteado, para que no se confunda con lo que ya se vendió */
.kpi[data-proj]{border:1.5px dashed var(--teal);background:var(--teal-50);position:relative}
.kpi[data-proj]>small:first-child{color:var(--teal);font-weight:700;text-transform:uppercase;letter-spacing:.05em;font-size:10.5px}
.t-proj{color:var(--teal)!important}
th.proj,td.proj{background:var(--teal-50);color:var(--teal)}
td.proj .sub{color:var(--teal);opacity:.8}
.chip{display:inline-block;padding:1px 8px;border-radius:99px;font-weight:700;font-size:11.5px;white-space:nowrap}
.chip.real{background:var(--brand-50);color:var(--brand)}
.chip.proj{background:var(--teal-50);color:var(--teal);border:1px dashed var(--teal)}

/* ---------- PWA: tarjeta "Instala la app" ---------- */
.pwa-bar{display:flex;align-items:center;gap:12px;margin:10px 16px 0;padding:10px 12px;border:1px solid var(--line);border-radius:var(--r-lg);background:var(--surface);box-shadow:var(--sh-2)}
.pwa-bar[hidden]{display:none!important}
.o-app.fill>.pwa-bar{flex:none}
.pwa-bar img{border-radius:10px;flex:none}
.pwa-t{flex:1;min-width:0;display:grid}.pwa-t small{color:var(--mute);font-size:12px;line-height:1.35}
.pwa-x{border:0;background:none;color:var(--mute);width:30px;height:30px;border-radius:50%;cursor:pointer;display:grid;place-items:center;flex:none}
.pwa-x:hover{background:var(--line-2);color:var(--ink)}
.install-steps{margin:0;padding-left:20px;display:grid;gap:10px}

/* ---------- Ayuda (manual) ---------- */
.ay{max-width:1100px;margin:0 auto;display:grid}
.ay-hero{display:grid;gap:12px;justify-items:center;text-align:center;padding:34px 16px 38px;border-radius:var(--r-xl);background:radial-gradient(700px 300px at 15% 0%,var(--brand-100),transparent),radial-gradient(600px 300px at 100% 100%,var(--teal-50),transparent),var(--surface);border:1px solid var(--line)}
.ay-hero h1{font-size:clamp(1.6rem,4.2vw,2.4rem);font-weight:800;letter-spacing:-.02em;max-width:20ch;margin:0}
.ay-hero p{max-width:56ch;margin:0;color:var(--ink-2)}
.ay-hrow{display:flex;flex-wrap:wrap;gap:10px;justify-content:center}
.ay-sec{padding:38px 0 6px;display:grid;gap:20px}
.ay-sec>header{display:grid;gap:8px}
.ay-sec h2{font-size:clamp(1.25rem,3vw,1.7rem);font-weight:800;letter-spacing:-.02em;margin:0}
.ay-sec>header p{max-width:66ch;margin:0}
.ay-ic{display:inline-grid;place-items:center}.ay-ic .ic{width:22px;height:22px}
.ay-steps{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}
@media (max-width:900px){.ay-steps{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:560px){.ay-steps{grid-template-columns:1fr}}
.ay-step{padding:16px;display:grid;gap:8px;align-content:start;border-top:3px solid var(--c);justify-items:start}
.ay-step-top{display:flex;justify-content:space-between;align-items:center;width:100%}
.ay-n{font:600 12px var(--f-mono);color:var(--ink);background:var(--line-2);border-radius:99px;padding:2px 9px}
.ay-step .ay-ic{color:var(--c)}.ay-step h3{font-size:15px;margin:0}.ay-step p{font-size:13px;margin:0}
.ay-grid{display:grid;gap:14px;grid-template-columns:repeat(auto-fit,minmax(240px,1fr))}
.ay-ind{display:flex;gap:12px;padding:12px 14px;border-left:3px solid var(--c);background:var(--surface);border-radius:var(--r);border-top:1px solid var(--line);border-right:1px solid var(--line);border-bottom:1px solid var(--line)}
.ay-ind .ay-ic{color:var(--c);flex:none}.ay-ind b{font-size:13.5px}.ay-ind p{font-size:12.5px;margin:2px 0 0;color:var(--ink-2)}
.ay-mini{display:flex;gap:12px;padding:12px 14px;border:1px dashed var(--line);border-radius:var(--r-lg);background:var(--surface)}
.ay-mini .ay-ic{color:var(--brand);flex:none;margin-top:2px}.ay-mini b{font-size:13.5px}.ay-mini p{font-size:12.5px;margin:2px 0 0}
.ay-role{padding:16px;display:grid;gap:8px;align-content:start;justify-items:start}.ay-role .ay-ic{color:var(--brand)}.ay-role h3{font-size:15px;margin:0}.ay-role p{font-size:13px;margin:0}
.ay-acciones{grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:0 28px}
.ay-card{display:grid;grid-template-columns:auto 1fr;gap:2px 14px;padding:16px 0;border-bottom:1px solid var(--line)}
.ay-card>.ay-ic{grid-row:1/3;width:38px;height:38px;border-radius:50%;background:var(--brand-50);color:var(--brand)}
.ay-card h3{font-size:14.5px;align-self:end;margin:0}.ay-card p{font-size:13px;grid-column:2;margin:0}
.ay-flow{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(auto-fit,minmax(190px,1fr))}
.ay-flow li{position:relative;display:grid;gap:6px;justify-items:start;padding:4px 16px 16px 0;align-content:start}
.ay-flow li:not(:last-child)::after{content:"";position:absolute;top:15px;left:38px;right:8px;border-top:2px dashed var(--line)}
.ay-flow .ay-n{background:var(--brand);color:var(--on-brand);position:relative;z-index:1}
.ay-flow li .ay-ic{color:var(--brand)}.ay-flow li b{font-size:14px}.ay-flow li>span:last-child{font-size:12.5px;color:var(--ink-2)}
.ay-tools{grid-template-columns:repeat(auto-fit,minmax(210px,1fr))}
.ay-tool{padding:16px;display:grid;gap:8px;align-content:start}.ay-tool kbd{justify-self:start;font:600 14px var(--f-mono);padding:4px 10px}.ay-tool h3{font-size:15px;margin:0}.ay-tool p{font-size:13px;margin:0}
.ay-tips{grid-template-columns:repeat(auto-fit,minmax(220px,1fr))}
.ay-tip{background:var(--surface);border:1px solid var(--line);border-radius:var(--r-lg);padding:14px;display:grid;gap:6px;align-content:start}
.ay-tip b{color:var(--brand)}.ay-tip b .ic{width:24px;height:24px}.ay-tip span{font-size:13px;color:var(--ink-2)}
.ay-faq{display:grid;gap:8px;max-width:820px}
.ay-foot{border-top:1px solid var(--line);margin-top:30px;padding:24px 0 8px;text-align:center;color:var(--mute);font-size:12.5px}
.ay-matrix-wrap{overflow-x:auto}
.ay-matrix{width:100%;border-collapse:collapse;font-size:13px;min-width:640px}
.ay-matrix th{padding:12px 8px;text-align:center;font-weight:600;font-size:12px;color:var(--ink-2);border-bottom:1px solid var(--line);vertical-align:bottom}
.ay-matrix th .ay-ic{display:block;color:var(--c);margin:0 auto 4px}
.ay-matrix th.ay-mx-t,.ay-matrix td.ay-mx-t{text-align:left;padding-left:16px}
.ay-matrix td{padding:10px 8px;text-align:center;border-bottom:1px solid var(--line-2)}
.ay-matrix td.ay-mx-t b{display:block;font-weight:600;color:var(--ink)}.ay-matrix td.ay-mx-t small{display:block;color:var(--mute);font-size:11.5px;margin-top:1px}
.ay-mx-g td{background:var(--line-2);font:700 11px var(--f);letter-spacing:.08em;text-transform:uppercase;color:var(--mute);text-align:left;padding:7px 16px}
.ay-dot{display:inline-block;width:14px;height:14px;border-radius:50%;background:var(--c)}
.ay-install{padding:16px 18px;display:grid;gap:16px}
.ay-install-top{display:flex;align-items:center;gap:14px;flex-wrap:wrap}.ay-install-top>div{flex:1;min-width:180px;display:grid}.ay-install-top small{color:var(--mute)}
.ay-install-top img{border-radius:14px}
.ay-os{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:18px}
.ay-os h4{margin:0 0 8px;font-size:14px}
.ay-ol{margin:0;padding-left:20px;display:grid;gap:7px;font-size:13px;color:var(--ink-2)}
@media (max-width:640px){.ay-flow li:not(:last-child)::after{display:none}.ay-acciones{grid-template-columns:1fr}.ay-hero{padding:26px 14px 30px}}

/* ---------- Teléfono (Android / iPhone) ---------- */
html{-webkit-text-size-adjust:100%;text-size-adjust:100%}
button,a,.btn,.tab,select,summary,[role=button]{touch-action:manipulation}
body{padding-left:env(safe-area-inset-left);padding-right:env(safe-area-inset-right)}
@media (max-width:767px){
  /* iPhone amplía la pantalla al enfocar un campo con letra menor de 16 px */
  input:not([type=checkbox]):not([type=radio]):not([type=range]),select,textarea,.inp-box{font-size:16px!important}
  dialog.modal{max-height:calc(100dvh - 24px)!important}
  dialog.modal .modal-b{max-height:calc(100dvh - 190px)}
  .modal-f{flex-wrap:wrap}
  .modal-f .btn{flex:1 1 auto}
  .btn{min-height:40px}
  .btn-sm{min-height:34px}
  /* proforma: cada producto es una tarjeta, no una tabla de 7 columnas */
  .pf-lines table,.pf-lines tbody{display:block;width:100%}
  .pf-lines thead{display:none}
  .pf-lines tr{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:6px 10px;padding:12px 0;border-bottom:1px solid var(--line)}
  .pf-lines td{display:block;border:0!important;padding:0!important;width:auto!important;min-width:0!important}
  .pf-lines td.c-prod{grid-column:1/-1;order:1}
  .pf-lines td.c-c{grid-column:1/-1;order:2}
  .pf-lines td.c-q{order:3}.pf-lines td.c-p{order:4}.pf-lines td.c-d{order:5}
  .pf-lines td.c-s{order:6;grid-column:1/3;text-align:left;font-weight:700}
  .pf-lines td.c-x{order:7;text-align:right}
  .pf-lines td.c-q::before,.pf-lines td.c-p::before,.pf-lines td.c-d::before{display:block;font-size:11px;color:var(--mute);margin-bottom:2px}
  .pf-lines td.c-q::before{content:"Cantidad"}.pf-lines td.c-p::before{content:"P. unit."}.pf-lines td.c-d::before{content:"Desc. %"}
  .pf-lines td.c-s::before{content:"Subtotal: ";font-weight:400;color:var(--mute)}
  .pf-lines td.c-c::before{content:"Código "}
  .pf-fg{grid-template-columns:1fr!important}
  .sheet-top .row{gap:8px}
  .pwa-bar{margin:8px 12px 0}
  .ay-hrow .btn{flex:1 1 100%}
  .toolbar{display:grid;grid-template-columns:minmax(0,1fr)}
  .toolbar>*,.card{min-width:0}
  .statusbar{overflow-x:auto;max-width:100%}
}
@media (hover:none){.cp-search kbd,.o-search .cp-k{display:none}}
@media (display-mode:standalone){ .pwa-bar{display:none!important} }

/* ---------- Teléfono: tablas como tarjetas, bloques solo-PC / solo-móvil ---------- */
.sm-only{display:none}
.mm{width:100%;border-collapse:collapse;font-size:13px}
.mm th{text-align:left;font-weight:600;font-size:12px;color:var(--ink-2);padding:8px 10px;border-bottom:1px solid var(--line)}
.mm td{padding:8px 10px;border-bottom:1px solid var(--line-2);white-space:nowrap}
.mm .r{text-align:right}
@media (max-width:767px){
  .sm-only{display:block}
  .pc-only{display:none!important}
  .o-list:has(table.tc),.card:has(table.tc){background:transparent;border:0;box-shadow:none;padding:0}
  .o-list:has(table.tc)>.card-head,.card:has(table.tc)>.card-head{padding:4px 2px 10px}
  table.tc,table.tc tbody,table.tc tfoot{display:block;width:100%}
  table.tc thead{display:none}
  table.tc tr{display:grid;gap:5px;padding:12px 14px;margin:0 0 10px;border:1px solid var(--line);border-radius:var(--r);background:var(--surface);box-shadow:var(--sh-1)}
  table.tc td{display:block;overflow:hidden;border:0!important;padding:0!important;text-align:right!important;min-width:0;background:none!important;font-size:13px}
  table.tc td::before{content:attr(data-l);float:left;margin-right:12px;color:var(--mute);font-size:12px;font-weight:500;text-align:left}
  table.tc td:first-child{display:block;text-align:left!important;font-size:14px;font-weight:600;padding-bottom:4px!important}
  table.tc td:first-child::before{display:none}
  table.tc td:empty,table.tc td[data-l=""]::before{display:none}
  table.tc td:empty{display:none}
  table.tc td .sub{display:inline;margin-left:8px;font-size:12px;font-weight:400;color:var(--mute)}
  table.tc td:first-child .sub{display:block;margin:0}
  table.tc td.acts{padding-top:4px!important}table.tc td.acts::before{display:none}
  table.tc tr.grp{background:none;border:0;box-shadow:none;padding:6px 2px 0}
  table.tc tr.grp td{display:block;text-align:left!important;font-size:12px}
  table.tc tr.click{cursor:pointer}
  table.tc tfoot tr{background:transparent;border:0;box-shadow:none;padding:2px 4px}
  table.tc tfoot td::before{font-size:11px}
  .card.pnl,.card.list-card{min-width:0}
  .rep-kpis{grid-template-columns:repeat(2,minmax(0,1fr))}
}

/* ---------- Teléfono: ajustes de orden ---------- */
@media (max-width:767px){
  .qa-row{display:flex;flex-wrap:wrap;gap:8px;width:100%}
  .qa-row .qa-lg{flex:1 1 auto;min-width:max-content;justify-content:center;padding:9px 12px;white-space:nowrap}
  .filters{justify-content:stretch!important;width:100%}
  .filters select,.filters .inp-box{flex:1 1 100%;width:100%;min-width:0}
  .toolbar .filters{display:grid;grid-template-columns:1fr 1fr;gap:8px}
  .kb{scroll-snap-type:x mandatory;scroll-padding-left:2px}
  .kb .col{scroll-snap-align:start;flex:0 0 86%;min-width:0}
  .sheet .smart{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
  .card-head{flex-wrap:wrap;gap:6px}
}