*{box-sizing:border-box}body{margin:0;font-family:Inter,system-ui,Arial;background:#f3f6fb;color:#182033}.hidden{display:none!important}.login{min-height:100vh;display:grid;place-items:center;background:linear-gradient(145deg,#0b1220,#24334d)}.card{background:#fff;border-radius:20px;padding:22px;box-shadow:0 10px 35px #0002}.login .card{width:min(92%,390px)}input,select,button,textarea{font:inherit}input,select,textarea{width:100%;padding:12px;border:1px solid #d9e0ea;border-radius:12px;margin:5px 0 12px;background:#fff}button{border:0;border-radius:12px;padding:11px 14px;cursor:pointer}.primary{background:#2563eb;color:#fff}.danger{background:#fee2e2;color:#b91c1c}.good{background:#dcfce7;color:#166534}.top{height:64px;background:#111827;color:#fff;display:flex;align-items:center;padding:0 14px;gap:12px;position:sticky;top:0;z-index:5}.top .grow{flex:1}.icon{background:#ffffff14;color:#fff;font-size:20px;position:relative}.badge{position:absolute;right:-5px;top:-6px;background:#ef4444;color:white;border-radius:20px;padding:2px 6px;font-size:10px}.drawer{position:fixed;left:0;top:0;bottom:0;width:270px;background:#111827;color:#fff;z-index:10;padding:22px;transform:translateX(-100%);transition:.25s}.drawer.open{transform:none}.drawer button{display:block;width:100%;text-align:left;margin:7px 0;background:#ffffff10;color:#fff}.overlay{position:fixed;inset:0;background:#0006;z-index:9}.main{padding:18px;max-width:1200px;margin:auto}.grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(210px,1fr));gap:14px}.stat{background:#fff;border-radius:18px;padding:18px;box-shadow:0 4px 18px #10204010}.stat b{font-size:24px;display:block;margin-top:8px}.toolbar{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:12px}.table{width:100%;border-collapse:collapse;background:#fff;border-radius:14px;overflow:hidden}.table td,.table th{padding:11px;border-bottom:1px solid #edf0f4;text-align:left}.pill{padding:5px 9px;border-radius:99px;font-size:12px;background:#eef2ff}.overdue{background:#fee2e2;color:#b91c1c;font-weight:700}.soon{background:#fff7ed;color:#c2410c}.modal{position:fixed;inset:0;background:#0007;z-index:20;display:grid;place-items:center;padding:15px}.modal .card{width:min(96%,600px);max-height:90vh;overflow:auto}.ticket{width:300px;max-width:100%;margin:auto;background:white;color:#000;font-family:monospace;padding:14px}.ticket hr{border:0;border-top:1px dashed #000}.product{display:flex;gap:10px;align-items:center;background:#fff;padding:10px;border-radius:14px;margin:7px 0}.product img{width:52px;height:52px;object-fit:cover;border-radius:10px;background:#eee}.right{margin-left:auto;text-align:right}.install{position:fixed;bottom:15px;left:15px;right:15px;z-index:30;background:#111827;color:#fff;padding:14px;border-radius:16px;box-shadow:0 8px 30px #0005}.chart{height:180px;display:flex;align-items:end;gap:5px;background:#fff;padding:15px;border-radius:16px}.bar{flex:1;background:#93c5fd;min-height:2px;border-radius:5px 5px 0 0}@media(min-width:800px){.drawer{transform:none}.top,.main{margin-left:270px}.top #menuBtn{display:none}}

.homegrid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;max-width:720px;margin:auto}.homebtn{min-height:130px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:7px;font-size:17px}.homebtn span{font-size:34px}.homebtn small,.selectedbox small,.pickrow small,.pickproduct small,.cartrow small,.creditline small,.profileedit small{display:block}.selectedbox{padding:12px;border:1px solid #d8dee9;border-radius:12px;margin-bottom:10px}.pickrow{display:block;width:100%;text-align:left;margin:6px 0}.pickproduct,.cartrow,.creditline,.profileedit,.drawerbrand{display:flex;align-items:center;gap:12px}.pickproduct{padding:9px 0;border-bottom:1px solid #eee}.pickproduct img{width:48px;height:48px;object-fit:cover;border-radius:9px}.pickproduct>div,.creditline>div{flex:1}.qty{display:flex;align-items:center;gap:7px}.qty button{padding:7px 11px}.cartrow{padding:8px 0;border-bottom:1px solid #eee}.creditline{padding:10px 0;border-bottom:1px solid #ddd}.selected{background:#f59e0b!important;color:white!important}.localprofile,.profilewrap{width:54px;height:54px;border-radius:50%;overflow:hidden;display:flex;align-items:center;justify-content:center;background:#fff;font-size:25px;flex:0 0 auto}.localprofile img,.profilewrap img{width:100%;height:100%;object-fit:cover}.drawerbrand h2,.drawerbrand p{margin:0}.logoutbtn{width:100%;margin-top:16px}.profilewrap{position:relative;background:#eef2f7;cursor:pointer}.profilewrap span{position:absolute;right:0;bottom:0;background:#111827;color:#fff;border-radius:50%;font-size:12px;padding:3px}.profileplaceholder{width:100%;height:100%;display:flex;align-items:center;justify-content:center}.profileedit{margin-bottom:14px}
@media(min-width:700px){.homegrid{grid-template-columns:repeat(3,minmax(0,1fr))}}

.quickgrid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:9px;max-width:620px}.quickbtn{min-height:78px;padding:9px 6px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px}.quickbtn:first-child{grid-column:auto}.quickbtn span{font-size:12px}.quickbtn{font-size:23px}.mini{padding:5px 8px;font-size:12px;margin-top:5px}.grid{margin-bottom:18px}
@media(max-width:420px){.quickgrid{grid-template-columns:repeat(3,1fr)}.quickbtn{min-height:72px}}

.creditcard{cursor:pointer;transition:transform .12s ease,box-shadow .12s ease}.creditcard:active{transform:scale(.995)}.balance{color:#dc2626;font-size:1.18em;font-weight:800}.modalhead{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:8px}.modalhead h2{margin:0}.closex{background:#fee2e2!important;color:#b91c1c!important;border:0!important;width:38px;height:38px;border-radius:11px!important;padding:0!important;font-size:18px}.addproductrow{display:flex;justify-content:flex-end;margin-top:18px;margin-bottom:10px}.continueRow{display:flex;justify-content:flex-start;margin-top:20px}.photoPick{display:flex;align-items:center;gap:10px;margin:7px 0 16px}.photoBtn{display:inline-flex;align-items:center;gap:7px;background:#eef2ff!important}.photoBtn span{font-size:14px}
.logoutIcon span{display:inline-block;font-size:21px;font-weight:800;transform:rotate(180deg);line-height:1}.logoutIcon{color:#b91c1c!important}
.amountgreen{color:#16a34a!important;font-weight:800}.amountorange{color:#ea580c!important;font-weight:800}.historycard{cursor:pointer}.historycard:hover,.creditcard:hover{box-shadow:0 8px 24px rgba(15,23,42,.09)}#reportButtons button:nth-child(1){background:#dbeafe;color:#1d4ed8}#reportButtons button:nth-child(2){background:#dcfce7;color:#15803d}#reportButtons button:nth-child(3){background:#ede9fe;color:#6d28d9}#reportButtons button:nth-child(4){background:#ffedd5;color:#c2410c}#reportButtons button.selected{background:#f59e0b!important;color:#fff!important}.badge{align-items:center;justify-content:center}

.waBtn{background:#16a34a!important;color:white!important;border-color:#16a34a!important}.installConfigBtn{background:#2563eb!important;color:white!important;margin-bottom:6px}

.confirmCredit{display:flex;flex-direction:column;gap:6px;padding:14px;border-radius:14px;background:#f8fafc;margin:12px 0}.confirmCredit strong{font-size:1.35rem;color:#dc2626}.warningText{background:#fff7ed;border:1px solid #fed7aa;padding:10px;border-radius:10px;color:#9a3412}

.successToast{position:fixed;z-index:99999;left:50%;top:22px;transform:translateX(-50%);background:#16a34a;color:#fff;padding:12px 18px;border-radius:12px;font-weight:700;box-shadow:0 8px 28px #0003;animation:toastIn .15s ease-out}@keyframes toastIn{from{opacity:0;transform:translate(-50%,-8px)}to{opacity:1;transform:translate(-50%,0)}}

.drawer{display:flex;flex-direction:column}
.drawerCopyright{margin-top:auto;padding:14px 10px 4px;border-top:1px solid #ffffff20;font-size:11px;line-height:1.4;opacity:.7}
.configTabs{display:grid;grid-template-columns:repeat(3,1fr);gap:7px;margin:8px 0 18px}.configTabs button{padding:10px 6px}.configTabs button.selected{background:#2563eb;color:#fff;border-color:#2563eb}
.adminNotice.read{opacity:.68}.adminNotice{cursor:pointer}

.noticeDelete{position:absolute;right:12px;top:50%;transform:translateY(-50%);width:38px;height:38px;padding:0;border-radius:10px;background:#fee2e2;border:1px solid #fecaca;cursor:pointer;font-size:17px}.noticeDelete:hover{background:#fecaca}

.paymentline{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:12px 0;border-bottom:1px solid #d1d5db}.paymentline>div:first-child{flex:1}.paymentActions{display:flex;gap:6px;flex-wrap:wrap;justify-content:flex-end}.cancelledPay{display:block;color:#dc2626;font-weight:800;margin-top:4px}.waLogo{display:inline-flex;width:19px;height:19px;border-radius:50%;align-items:center;justify-content:center;background:#22c55e;color:#fff;font-size:13px;font-weight:900;vertical-align:-2px}.mini{padding:7px 10px;font-size:13px}

/* V1.20 - Tema oscuro elegante */
.themeToggle{font-size:20px}
html[data-theme="dark"] body{background:#0b1220;color:#e5e7eb}
html[data-theme="dark"] .card,html[data-theme="dark"] .stat,html[data-theme="dark"] .product,html[data-theme="dark"] .table,html[data-theme="dark"] .chart{background:#151f2f;color:#e5e7eb;box-shadow:0 8px 26px #0004}
html[data-theme="dark"] input,html[data-theme="dark"] select,html[data-theme="dark"] textarea{background:#0f172a;color:#f8fafc;border-color:#334155}
html[data-theme="dark"] input::placeholder,html[data-theme="dark"] textarea::placeholder{color:#94a3b8}
html[data-theme="dark"] button:not(.primary):not(.danger):not(.good):not(.closex):not(.waBtn){background:#263244;color:#f1f5f9}
html[data-theme="dark"] .creditline,html[data-theme="dark"] .paymentline,html[data-theme="dark"] .pickproduct,html[data-theme="dark"] .cartrow,html[data-theme="dark"] .table td,html[data-theme="dark"] .table th{border-color:#334155}
html[data-theme="dark"] .pill{background:#273449;color:#dbeafe}
html[data-theme="dark"] .confirmCredit{background:#0f172a}
html[data-theme="dark"] .warningText{background:#3a2515;border-color:#7c4a1d;color:#fed7aa}
html[data-theme="dark"] .modal{background:#000a}
html[data-theme="dark"] .install{background:#151f2f;border:1px solid #334155}
html[data-theme="dark"] .selectedbox{border-color:#334155}
html[data-theme="dark"] .profilewrap{background:#263244}
.elegantDialog{text-align:center;max-width:430px!important;padding:26px!important}.elegantDialog h3{margin:8px 0 10px;font-size:1.25rem}.elegantDialog p{line-height:1.5;opacity:.85}.dialogIcon{width:52px;height:52px;margin:0 auto 8px;border-radius:50%;display:grid;place-items:center;background:#dbeafe;color:#1d4ed8;font-size:26px;font-weight:800}.dialogIcon.warn{background:#fee2e2;color:#dc2626}.dialogActions{display:flex;justify-content:center;gap:10px;margin-top:22px}.dialogActions button{min-width:110px}

/* V1.21 - Ajuste móvil sin zoom/desplazamiento horizontal */
html,body{width:100%;max-width:100%;overflow-x:hidden;-webkit-text-size-adjust:100%}
#app{width:100%;max-width:100vw;overflow-x:hidden}
.top{width:100%;max-width:100vw;min-width:0;padding-left:max(10px,env(safe-area-inset-left));padding-right:max(10px,env(safe-area-inset-right));gap:7px}
.top .grow{min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.top .icon{flex:0 0 auto;padding:10px 11px;min-width:44px}
.main{width:100%;max-width:1200px;min-width:0;overflow-x:hidden;padding-left:max(14px,env(safe-area-inset-left));padding-right:max(14px,env(safe-area-inset-right))}
.card,.product,.stat,.modal .card{max-width:100%;min-width:0}
.product>div,.creditline>div,.paymentline>div{min-width:0}
img{max-width:100%}
.waLogoImg{width:22px;height:22px;object-fit:cover;border-radius:50%;vertical-align:-5px;margin-right:5px}
@media(max-width:480px){.top{gap:6px}.top .icon{min-width:42px;padding:9px 10px}.top #title{font-size:16px}.main{padding:14px}.creditcard{padding:18px}.paymentActions{max-width:58%}}
@media(max-width:380px){.top{gap:4px;padding-left:7px;padding-right:7px}.top .icon{min-width:39px;padding:8px 8px;font-size:18px}.top #title{font-size:15px}}

.waBtn{display:inline-flex!important;align-items:center;gap:8px}
.waBtn .waLogoImg{width:23px;height:23px;border-radius:50%;object-fit:cover}
.modalhead+.ticket{margin-top:-4px}
#am{text-align:left;font-variant-numeric:tabular-nums}

.listHeader{justify-content:space-between;align-items:center;margin-bottom:18px}
.countLabel{font-size:14px;opacity:.78;padding:8px 2px}
.clientAvatar{width:48px!important;height:48px!important;border-radius:50%!important;object-fit:cover;flex:0 0 48px}
.clientAvatar.placeholder{display:flex;align-items:center;justify-content:center;background:#eef2f7;font-size:23px}
.clientInfo{min-width:0;flex:1}
.clientActions{display:flex;gap:6px;align-items:center;flex-wrap:nowrap}
.waOnly{padding:5px!important;min-width:42px!important;width:42px;height:42px}
.waOnly .waLogoImg{width:30px!important;height:30px!important}
.editIcon{font-size:20px}
.deleteIcon{color:#dc2626!important;background:#fee2e2!important}
.clientPhotoBox{text-align:center;margin-bottom:12px}
.clientPhotoPreview,.profilePreview{width:82px;height:82px;border-radius:50%;object-fit:cover}

/* V1.27 - listas rápidas, visor y reportes compactos */
.zoomThumb{cursor:zoom-in}.photoViewer{display:flex;align-items:center;justify-content:center;min-height:260px;max-height:72vh;overflow:hidden;background:#0b1220;border-radius:16px}.photoViewer img{max-width:100%;max-height:72vh;width:auto;height:auto;object-fit:contain}.productThumbPlaceholder{width:48px;height:48px;display:grid;place-items:center;background:#eef2f7;border-radius:9px;flex:0 0 48px}.listSearch{margin:0 0 6px}.listShown{display:block;opacity:.65;margin:0 0 12px}.creditCount{margin:0 0 12px;font-size:14px;opacity:.8}.reportStats{grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:9px!important}.reportStats .stat{min-height:92px!important;padding:14px!important}.reportStats .stat b{font-size:1.25rem!important;margin-top:6px}.reportStats+.chart{height:150px!important}@media(max-width:380px){.reportStats .stat{padding:11px!important}.reportStats .stat b{font-size:1.08rem!important}}html[data-theme="dark"] .productThumbPlaceholder{background:#263244}

/* V1.28 - búsquedas y gráfico de reportes */
.listSearch{position:relative;display:block;width:100%;z-index:1;background:var(--surface,#fff);box-shadow:0 5px 16px #0000000d;padding:13px 15px;border-radius:15px;margin:0 0 18px;box-sizing:border-box}
.reportChart{background:#fff;border-radius:18px;padding:18px;margin-top:10px;box-shadow:0 4px 18px #10204010}
.reportBarRow{margin:0 0 16px}.reportBarRow:last-of-type{margin-bottom:8px}.reportBarHead{display:flex;justify-content:space-between;gap:12px;margin-bottom:7px}.reportBarHead b{font-size:.95rem}.reportBarTrack{height:18px;background:#e8edf5;border-radius:99px;overflow:hidden}.reportBarFill{height:100%;border-radius:99px;transition:width .3s ease}.reportBarFill.sales{background:#2563eb}.reportBarFill.cost{background:#f97316}.reportBarFill.profit{background:#16a34a}.reportChartLegend{text-align:center;font-size:12px;opacity:.65;margin-top:10px}
html[data-theme="dark"] .reportChart{background:#151f2f;color:#e5e7eb;box-shadow:0 8px 26px #0004}html[data-theme="dark"] .reportBarTrack{background:#263244}html[data-theme="dark"] .listSearch{background:#151f2f;color:#e5e7eb;border-color:#334155}

.backupStatus{margin-top:16px;padding:12px 14px;border:1px solid var(--border,#d8dee8);border-radius:14px;background:var(--surface,#fff);display:grid;gap:4px}.backupStatus small{opacity:.75}.backupStatus .backupError{color:#dc2626;opacity:1;word-break:break-word}

/* Consulta CI/RUC */
.ciLookupRow{display:flex;align-items:stretch;gap:7px}.ciLookupRow input{flex:1;min-width:0}.ciLookupBtn{margin:5px 0 12px;width:46px;min-width:46px;padding:0;background:#eef2ff;color:#1d4ed8;font-size:19px;border:1px solid #dbe4ff}.ciLookupBtn:disabled{opacity:.6;cursor:wait}

/* V1.37 - mensajes de validacion siempre por encima del formulario */
.confirmOverlay{position:fixed;inset:0;z-index:1000000;background:#0008;display:grid;place-items:center;padding:18px}
.confirmBox{width:min(92vw,420px);background:var(--surface,#fff);color:var(--text,#182033);border-radius:18px;padding:22px;box-shadow:0 18px 55px #0007;text-align:center}
.confirmBox h3{margin:0 0 10px}.confirmBox p{margin:0 0 18px;line-height:1.5}.confirmActions{display:flex;justify-content:center}.confirmActions .primary{min-width:110px}
html[data-theme="dark"] .confirmBox{background:#111827;color:#f8fafc}

.loginHelp{margin:14px 0 5px;color:#64748b;font-size:13px}.recoverLink{border:0;background:transparent;color:#2563eb;padding:6px 0;font-weight:600;text-decoration:underline}.recoverLink:hover{background:transparent}

.contactPickRow{display:flex;align-items:stretch;gap:7px}.contactPickRow input{flex:1;min-width:0}.contactPickBtn{margin:5px 0 12px;width:46px;min-width:46px;padding:0;font-size:24px;font-weight:700;background:#eef2ff;color:#1d4ed8;border:1px solid #dbe4ff}