:root{
  --bg:#f3f0eb;
  --panel:#fffdf9;
  --ink:#241d18;
  --muted:#766c63;
  --line:#ddd3c7;
  --accent:#8a7c70;
  --accent2:#5f554e;
  --dark:#171412;
  --soft:#eee7df;
  --good:#1f7a4d;
  --danger:#a03232;
  --shadow:0 12px 30px rgba(30,20,10,.08);
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;font-family:Inter,Arial,sans-serif;background:var(--bg);color:var(--ink)}
button,input,select,textarea{font:inherit}
button{border:0;border-radius:14px;padding:11px 16px;cursor:pointer;font-weight:700;transition:.18s ease}
button:hover{transform:translateY(-1px)}
.primary{background:var(--accent2);color:white}
.dark{background:var(--dark);color:white}
.secondary,.ghost{background:var(--soft);color:var(--ink);border:1px solid var(--line)}
.ghost{width:100%;margin-top:10px}
.full{width:100%}
.sidebar{position:fixed;left:0;top:0;bottom:0;width:270px;background:#181512;color:white;padding:22px;display:flex;flex-direction:column;gap:12px}
.brand{padding-bottom:8px;border-bottom:1px solid rgba(255,255,255,.08)}
.brand-logo{width:180px;max-width:100%;display:block;filter:brightness(1.12)}
.brand p{margin:10px 0 0;color:#cfc3b2;font-size:14px}
.side-nav{display:flex;flex-direction:column;gap:8px}
.nav{background:transparent;color:#d5c9ba;text-align:left;border-radius:14px;border:1px solid transparent}
.nav.active,.nav:hover{background:#33291f;color:white;border-color:rgba(255,255,255,.06)}
.side-actions{margin-top:auto}
.file-label{display:block;text-align:center}
main{margin-left:270px;padding:24px}
.view{display:none}
.view.active{display:block}
.top{display:flex;justify-content:space-between;gap:16px;align-items:flex-start;margin-bottom:18px}
.top h1{margin:0;font-size:30px}
.top p{margin:6px 0 0;color:var(--muted);max-width:740px}
.sticky-top{position:sticky;top:0;z-index:10;background:linear-gradient(180deg,var(--bg) 80%,rgba(243,240,235,0));padding-top:2px}
.top-actions{display:flex;gap:10px;flex-wrap:wrap}
.current-sale-cards{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin-bottom:18px}
.mini-card,.kpi{background:#fff;border:1px solid var(--line);border-radius:18px;padding:14px 16px;box-shadow:var(--shadow)}
.mini-card span,.kpi span{display:block;color:var(--muted);font-size:12px;margin-bottom:6px}
.mini-card strong,.kpi strong{font-size:20px}
.workgrid{display:grid;grid-template-columns:minmax(460px,560px) 1fr;gap:24px;align-items:start}
.form-stack{display:flex;flex-direction:column;gap:18px}
.panel{background:var(--panel);border:1px solid var(--line);border-radius:22px;padding:22px;box-shadow:var(--shadow)}
.form-card{padding:20px 20px 22px}
.section-head{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-bottom:8px}
.section-head>div{display:flex;align-items:center;gap:12px}
.section-head h2{margin:0;font-size:20px}
.section-head span:last-child{font-size:12px;background:#eadbca;color:#6f4a2f;padding:6px 10px;border-radius:999px}
.step-badge{width:34px;height:34px;border-radius:50%;display:grid;place-items:center;background:#efe4d7;color:#4f3b2a;font-weight:800;font-size:15px}
.help{margin:0 0 14px;color:var(--muted);font-size:13px;line-height:1.45}
h2{margin:18px 0 12px;font-size:18px}
label{display:block;color:var(--muted);font-size:13px;font-weight:700;margin-bottom:12px}
input,select,textarea{width:100%;padding:12px 13px;border:1px solid var(--line);border-radius:14px;background:#fff;color:var(--ink);margin-top:5px}
input:focus,select:focus,textarea:focus{outline:none;border-color:#bba894;box-shadow:0 0 0 4px rgba(187,168,148,.15)}
textarea{resize:vertical}
.grid{display:grid;gap:12px}
.two{grid-template-columns:1fr 1fr}
.three{grid-template-columns:1fr 1fr 1fr}
.four{grid-template-columns:1.2fr 2fr 1fr auto}
.search-row{grid-template-columns:1.4fr 180px;align-items:end}
.button-slot{display:flex;align-items:end}
.chips{display:flex;gap:8px;flex-wrap:wrap;margin:4px 0 14px}
.chip{border:1px solid var(--line);background:#fff;padding:8px 12px;border-radius:999px;font-size:12px;color:var(--ink);cursor:pointer}
.chip:hover{background:#f7f1ea}
.item{background:#fff;border:1px solid var(--line);border-radius:18px;padding:14px;margin-bottom:12px}
.item-grid{display:grid;grid-template-columns:1.15fr 1.5fr .55fr .8fr .8fr auto;gap:8px;align-items:end}
.item .remove{height:46px;border-radius:12px;background:#fff0ee;color:var(--danger);border:1px solid #efc5bd}
.totals-mini{display:grid;grid-template-columns:1fr 1fr 1fr;gap:10px;margin-top:16px}
.totals-mini div{background:#fff;border:1px solid var(--line);border-radius:16px;padding:14px}
.totals-mini span{display:block;color:var(--muted);font-size:12px}
.totals-mini strong{font-size:20px}
.preview-top{display:flex;justify-content:space-between;align-items:center;margin-bottom:12px}
.preview-top h2{margin:0;font-size:18px}
.paper-wrap{display:flex;flex-direction:column;align-items:center}
.paper{position:relative;background:#fff;width:840px;min-height:1080px;padding:40px;border-radius:14px;box-shadow:0 18px 50px rgba(0,0,0,.12);overflow:hidden}
.paper-watermark{position:absolute;right:-70px;top:350px;width:280px;opacity:.045;transform:rotate(-14deg)}
.paper-head{display:flex;justify-content:space-between;align-items:flex-start;border-bottom:3px solid #1e1a17;padding-bottom:18px;gap:16px}
.paper-brand{max-width:270px}
.paper-logo-img{width:100%;height:auto;display:block}
.paper-brand-right{display:flex;gap:14px;align-items:flex-start}
.paper-iso-img{width:88px;height:88px;object-fit:contain}
.title-block{text-align:right}
.title-block h2{font-size:28px;margin:0}
.title-block p{font-weight:bold;color:var(--accent2);font-size:18px;margin:8px 0}
.paper-info{display:grid;grid-template-columns:1fr 1.4fr 1fr;gap:18px;margin:22px 0}
.paper h4{font-size:12px;letter-spacing:.08em;margin:0 0 6px;color:#6e5540}
.paper p{margin:0;white-space:pre-line;line-height:1.45}
.items-table{width:100%;border-collapse:collapse;margin-top:8px}
.items-table th{background:#201a15;color:white;text-align:left;font-size:12px;padding:10px}
.items-table td{border-bottom:1px solid #ddd0c2;padding:12px 10px;vertical-align:top}
.items-table td:nth-child(3),.items-table td:nth-child(4),.items-table td:nth-child(5){text-align:right}
.paper-bottom{display:grid;grid-template-columns:1fr 290px;gap:30px;margin-top:24px}
.payment-block{background:#faf5ee;border:1px solid var(--line);border-radius:16px;padding:18px}
.total-card{border:1px solid var(--line);border-radius:16px;overflow:hidden}
.total-card div{display:flex;justify-content:space-between;padding:12px 16px;border-bottom:1px solid var(--line)}
.total-card .grand{background:#201a15;color:white;font-size:18px}
.terms{margin-top:24px;font-size:11px;color:#42372f;border-top:1px solid var(--line);padding-top:14px}
.signature{text-align:center;margin-top:24px}
.signature span{display:block;color:var(--muted);font-size:13px}
.footer{display:flex;justify-content:space-between;margin-top:28px;color:#6e5540;font-weight:700}
.toolbar{display:flex;gap:12px;margin-bottom:14px;align-items:center;flex-wrap:wrap}
.toolbar input{max-width:430px}
.tablebox{overflow:auto}
table{width:100%;border-collapse:collapse}
th,td{padding:12px;border-bottom:1px solid var(--line);text-align:left;font-size:14px}
th{background:#efe4d7;color:#493727}
.row-actions{display:flex;gap:6px;flex-wrap:wrap}.row-actions button{padding:7px 9px;font-size:12px}
.cards{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;margin-bottom:18px}
.danger{background:#fff0ee;color:var(--danger);border:1px solid #efc5bd}
.toast{position:fixed;right:24px;bottom:24px;background:#201a15;color:#fff;padding:14px 18px;border-radius:14px;box-shadow:0 18px 40px rgba(0,0,0,.2);opacity:0;transform:translateY(10px);pointer-events:none;transition:.22s ease;max-width:380px;z-index:1000}
.toast.show{opacity:1;transform:translateY(0)}
.toast.good{background:#285f45}
.toast.bad{background:#7d2f2f}
@media(max-width:1280px){
  .workgrid{grid-template-columns:1fr}
  .paper{width:100%}
}
@media(max-width:1100px){
  .sidebar{position:relative;width:auto}
  .side-actions{margin-top:10px}
  main{margin:0}
  .current-sale-cards,.cards{grid-template-columns:1fr 1fr}
  .four,.three,.two,.search-row{grid-template-columns:1fr}
  .item-grid{grid-template-columns:1fr 1fr}
}
@media(max-width:720px){
  .top{flex-direction:column}
  .top-actions{width:100%}
  .top-actions button{flex:1 1 100%}
  .current-sale-cards,.cards{grid-template-columns:1fr}
  .paper-head,.paper-bottom,.paper-info{grid-template-columns:1fr;display:grid}
  .paper-brand-right{justify-content:space-between}
}


.dashboard-filter{margin-bottom:16px}
.payment-status{display:inline-block;padding:5px 9px;border-radius:999px;font-size:12px;font-weight:800}
.payment-paid{background:#e5f4ec;color:#1f7a4d}
.payment-pending{background:#fff2d9;color:#8a5a00}


/* Ajuste visual de marca: logos con fondo transparente y color integrado a la app */
.brand-logo{
  width:190px;
  padding:10px 6px 6px;
  border-radius:18px;
  background:transparent;
  object-fit:contain;
}
.paper-logo-img{
  filter:none;
  max-height:92px;
  object-fit:contain;
}
.paper-iso-img{
  opacity:.9;
  mix-blend-mode:multiply;
}
.paper-watermark{
  mix-blend-mode:multiply;
}

.status-board{
  display:grid;
  grid-template-columns:repeat(7,1fr);
  gap:12px;
  margin-bottom:16px;
}
.status-card{
  background:#fff;
  border:1px solid var(--line);
  color:var(--ink);
  box-shadow:var(--shadow);
  padding:14px;
  text-align:left;
}
.status-card span{display:block;color:var(--muted);font-size:12px;margin-bottom:6px}
.status-card strong{font-size:20px}
.status-card.active,.status-card:hover{
  background:#201a15;
  color:#fff;
}
.status-card.active span,.status-card:hover span{color:#d8ccbf}
.status-select{
  min-width:155px;
  margin:0;
  padding:8px 10px;
  border-radius:10px;
  font-size:13px;
}
.status-pill{
  display:inline-block;
  margin-top:6px;
  padding:5px 8px;
  border-radius:999px;
  font-size:11px;
  font-weight:800;
}
.status-pill.saldo{background:#fff2d9;color:#8a5a00}
.status-pill.pagado{background:#e5f4ec;color:#1f7a4d}
.status-history-panel{margin-top:16px}
@media(max-width:1100px){
  .status-board{grid-template-columns:1fr 1fr}
}
@media(max-width:680px){
  .status-board{grid-template-columns:1fr}
}

/* V4: IVA opcional y encabezado tipo barra como la referencia */
.iva-box{
  display:grid;
  grid-template-columns:1fr 160px;
  gap:12px;
  align-items:end;
  background:#fff;
  border:1px dashed var(--line);
  border-radius:16px;
  padding:14px;
  margin:4px 0 12px;
}
.checkline{
  display:flex;
  align-items:center;
  gap:10px;
  color:var(--ink);
  margin:0 0 12px;
}
.checkline input{
  width:auto;
  margin:0;
  transform:scale(1.15);
}
.iva-box .help{
  grid-column:1/-1;
  margin:-4px 0 0;
}
#pvIvaRow.hidden{
  display:none;
}

/* Nota con barra superior elegante */
.paper{
  padding:0;
  background:#fff;
}
.paper-head{
  min-height:86px;
  background:#6c6259;
  background-image:linear-gradient(180deg,#70665d,#62584f);
  padding:16px 40px;
  border-bottom:0;
  align-items:center;
}
.paper-brand{
  max-width:205px;
}
.paper-logo-img{
  max-height:58px;
  width:205px;
  object-fit:contain;
}
.paper-brand-right{
  margin-left:auto;
}
.paper-iso-img{
  width:58px;
  height:58px;
  object-fit:contain;
  opacity:.95;
  mix-blend-mode:normal;
}
.title-block{
  position:absolute;
  top:122px;
  right:40px;
  text-align:right;
}
.title-block h2{
  font-size:19px;
  letter-spacing:.02em;
  margin:0;
}
.title-block p{
  font-size:11px;
  margin:5px 0 0;
  color:#6c6259;
  font-weight:700;
}
.paper-info{
  margin:62px 40px 22px;
}
.items-table{
  width:calc(100% - 80px);
  margin:8px 40px 0;
}
.paper-bottom{
  margin:24px 40px 0;
}
.terms{
  margin:24px 40px 0;
}
.signature{
  margin:24px 40px 0;
}
.footer{
  background:#6c6259;
  color:white;
  margin:28px 0 0;
  padding:14px 40px;
}
.paper-watermark{
  top:360px;
}

@media(max-width:720px){
  .iva-box{grid-template-columns:1fr}
  .title-block{position:static;text-align:left;margin-top:12px}
  .paper-info,.paper-bottom,.terms,.signature{margin-left:24px;margin-right:24px}
  .items-table{width:calc(100% - 48px);margin-left:24px;margin-right:24px}
}

/* V5: mejorar contraste del logo en la barra superior */
.paper-logo-img{filter: drop-shadow(0 1px 1px rgba(0,0,0,.12));}
.paper-iso-img{opacity:1; filter: drop-shadow(0 1px 1px rgba(0,0,0,.10));}

/* V6: indicador real de notas activas */
.status-board{grid-template-columns:repeat(8,1fr)}
.status-card.active-status{
  border-color:#c4a77f;
}
.five-cards{grid-template-columns:repeat(5,1fr)}
@media(max-width:1100px){
  .status-board{grid-template-columns:1fr 1fr}
  .five-cards{grid-template-columns:1fr 1fr}
}
@media(max-width:680px){
  .five-cards{grid-template-columns:1fr}
}

/* V7: corrección notas activas y controles de estatus */
.status-board{grid-template-columns:repeat(8,1fr)}
.status-card.active-status{border-color:#c4a77f}
.five-cards{grid-template-columns:repeat(5,1fr)}
.status-select{min-width:155px;margin:0;padding:8px 10px;border-radius:10px;font-size:13px}
.status-pill{display:inline-block;margin-top:6px;padding:5px 8px;border-radius:999px;font-size:11px;font-weight:800}
.status-pill.saldo{background:#fff2d9;color:#8a5a00}
.status-pill.pagado{background:#e5f4ec;color:#1f7a4d}
.status-history-panel{margin-top:16px}
@media(max-width:1100px){.status-board{grid-template-columns:1fr 1fr}.five-cards{grid-template-columns:1fr 1fr}}
@media(max-width:680px){.five-cards{grid-template-columns:1fr}}

/* V8: icono de Instagram junto al usuario */
.ig-footer{
  display:inline-flex;
  align-items:center;
  gap:8px;
  font-weight:700;
}
.ig-icon{
  width:16px;
  height:16px;
  flex:0 0 16px;
  display:block;
}


/* V11: cuentas fiscal/no fiscal automáticas */
#configForm h2{
  margin-top:22px;
  padding-top:12px;
  border-top:1px solid var(--line);
}

/* V12: controles profesionales tipo CRM/POS */
.six-cards{grid-template-columns:repeat(6,1fr)}
.control-grid{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:16px;
  margin-top:16px;
}
.alert-stack{display:flex;flex-direction:column;gap:5px;align-items:flex-start}
.badge{
  display:inline-flex;
  align-items:center;
  border-radius:999px;
  padding:5px 9px;
  font-size:11px;
  font-weight:800;
  white-space:nowrap;
}
.badge.info{background:#e8f0ff;color:#24529a}
.badge.warn{background:#fff2d9;color:#8a5a00}
.badge.danger{background:#fff0ee;color:#a03232}
.badge.good{background:#e5f4ec;color:#1f7a4d}
.badge.neutral{background:#eee7df;color:#5f554e}
.row-actions .success{background:#e5f4ec;color:#1f7a4d;border:1px solid #badfcb}
.row-actions .copy{background:#e8f0ff;color:#24529a;border:1px solid #c6d8ff}
@media(max-width:1250px){
  .six-cards{grid-template-columns:1fr 1fr 1fr}
  .control-grid{grid-template-columns:1fr}
}
@media(max-width:720px){
  .six-cards{grid-template-columns:1fr}
}

/* V13: fotos por producto en la nota */
.item-grid{
  grid-template-columns:1.05fr 1.35fr .48fr .75fr .78fr 104px auto;
}
.item-photo-label input{
  padding:8px;
  font-size:11px;
}
.photo-preview{
  width:92px;
  height:62px;
  border:1px solid var(--line);
  border-radius:12px;
  object-fit:cover;
  background:#f5f0ea;
  display:none;
  margin-top:6px;
}
.photo-preview.has-photo{
  display:block;
}
.pv-photo{
  width:82px;
  height:72px;
  object-fit:cover;
  border-radius:6px;
  display:block;
}
.items-table th:first-child,
.items-table td:first-child{
  width:92px;
  text-align:left;
}
.items-table td:nth-child(4),
.items-table td:nth-child(5),
.items-table td:nth-child(6){
  text-align:right;
}
.items-table td:nth-child(3){
  text-align:left;
}
@media(max-width:1100px){
  .item-grid{grid-template-columns:1fr 1fr}
}


/* V14: corrección para que las fotos salgan en PDF/impresión */
.items-table tr,
.items-table td{
  break-inside:avoid;
  page-break-inside:avoid;
}
.pv-photo{
  -webkit-print-color-adjust:exact;
  print-color-adjust:exact;
}


/* V15: fotos completas y paginación limpia en PDF/impresión */
.photo-preview{
  object-fit:contain !important;
  background:#fff !important;
}

.pv-photo{
  object-fit:contain !important;
  background:#fff !important;
  border:1px solid #eee7df;
}

.items-table tr,
.items-table td,
.items-table th{
  break-inside:avoid;
  page-break-inside:avoid;
}

.paper-bottom,
.payment-block,
.total-card,
.terms,
.signature,
.footer{
  break-inside:avoid;
  page-break-inside:avoid;
}



/* V16: ocultar completamente avisos flotantes en PDF */


/* V17: fotos de producto un poco más grandes en la nota y PDF */
.photo-preview{
  width:118px !important;
  height:84px !important;
}

.pv-photo{
  width:108px !important;
  height:84px !important;
  object-fit:contain !important;
  background:#fff !important;
}

.items-table th:first-child,
.items-table td:first-child{
  width:122px !important;
  min-width:122px !important;
}



/* V18: ajuste automático de nota según cantidad de productos */
.paper.density-spacious .pv-photo{
  width:132px !important;
  height:100px !important;
}
.paper.density-balanced .pv-photo{
  width:116px !important;
  height:88px !important;
}
.paper.density-compact .pv-photo{
  width:104px !important;
  height:76px !important;
}
.paper.density-dense .pv-photo{
  width:92px !important;
  height:66px !important;
}

.paper.density-spacious .items-table th:first-child,
.paper.density-spacious .items-table td:first-child{
  width:148px !important;
  min-width:148px !important;
}
.paper.density-balanced .items-table th:first-child,
.paper.density-balanced .items-table td:first-child{
  width:132px !important;
  min-width:132px !important;
}
.paper.density-compact .items-table th:first-child,
.paper.density-compact .items-table td:first-child{
  width:118px !important;
  min-width:118px !important;
}
.paper.density-dense .items-table th:first-child,
.paper.density-dense .items-table td:first-child{
  width:104px !important;
  min-width:104px !important;
}

.paper.density-compact .items-table td,
.paper.density-dense .items-table td{
  line-height:1.12 !important;
}
.paper.density-compact .items-table td{
  padding-top:7px !important;
  padding-bottom:7px !important;
}
.paper.density-dense .items-table td{
  padding-top:5px !important;
  padding-bottom:5px !important;
  font-size:12px !important;
}
.paper.density-dense .items-table th{
  padding-top:6px !important;
  padding-bottom:6px !important;
}



/* V19: prioridad a fotos visibles + salto de página para muchos muebles */


/* V20: encabezado en página de totales y pie fijo al fondo */
.continued-head{
  display:none;
}



/* V21: detección automática real de una o varias páginas */


/* V22: margen de seguridad para evitar una segunda hoja por redondeo */


/* V23: protecciones finales de impresión y datos */


/* V24: rediseño premium y navegación profesional */
:root{
  --bg:#f4f1ed;
  --panel:#fffdfa;
  --ink:#211b17;
  --muted:#756c64;
  --line:#ddd3c7;
  --accent:#8a796a;
  --accent2:#5c524a;
  --dark:#171412;
  --soft:#eee8e1;
  --good:#2f7656;
  --danger:#9e3f3f;
  --gold:#b79b72;
  --sidebar:#171411;
  --sidebar-soft:#211d19;
  --shadow:0 14px 35px rgba(40,31,24,.08);
  --shadow-strong:0 18px 55px rgba(35,27,20,.14);
}

body{
  background:
    radial-gradient(circle at top right, rgba(183,155,114,.10), transparent 28%),
    linear-gradient(180deg,#f6f3ef 0%,#f1ede8 100%);
}

.sidebar{
  width:286px;
  background:
    linear-gradient(180deg,rgba(255,255,255,.02),transparent 18%),
    var(--sidebar);
  border-right:1px solid rgba(255,255,255,.05);
  box-shadow:18px 0 45px rgba(25,20,16,.10);
  padding:22px 18px;
}

.brand{
  padding:4px 10px 20px;
  border-bottom:1px solid rgba(255,255,255,.08);
  margin-bottom:10px;
}
.brand-logo{
  width:178px;
  padding:0;
}
.brand p{
  font-size:12px;
  letter-spacing:.02em;
  margin-top:8px;
  color:#bfb4a7;
}
.brand-badge{
  display:inline-flex;
  margin-top:10px;
  padding:5px 9px;
  border:1px solid rgba(255,255,255,.12);
  border-radius:999px;
  color:#e9dfd3;
  font-size:9px;
  letter-spacing:.15em;
}

.nav-section-title{
  padding:12px 12px 8px;
  font-size:10px;
  font-weight:800;
  letter-spacing:.16em;
  color:#7f756c;
}
.nav-tools-title{margin-top:auto}

.side-nav{gap:6px}
.nav{
  display:grid;
  grid-template-columns:34px 1fr 18px;
  align-items:center;
  width:100%;
  min-height:48px;
  padding:8px 10px;
  color:#cfc5ba;
  border-radius:14px;
  transition:.18s ease;
}
.nav:hover{
  background:rgba(255,255,255,.055);
  color:#fff;
  transform:translateX(2px);
}
.nav.active{
  background:linear-gradient(135deg,#3b3027,#2b241e);
  color:#fff;
  border-color:rgba(183,155,114,.35);
  box-shadow:inset 3px 0 0 var(--gold),0 8px 18px rgba(0,0,0,.18);
}
.nav-icon{
  width:30px;
  height:30px;
  border-radius:10px;
  display:grid;
  place-items:center;
  background:rgba(255,255,255,.045);
}
.nav.active .nav-icon{background:rgba(183,155,114,.18)}
.nav-icon svg{
  width:17px;
  height:17px;
  fill:none;
  stroke:currentColor;
  stroke-width:1.7;
  stroke-linecap:round;
  stroke-linejoin:round;
}
.nav-label{
  font-size:14px;
  font-weight:700;
  text-align:left;
}
.nav-arrow{
  opacity:.35;
  font-size:20px;
  transition:.18s ease;
}
.nav.active .nav-arrow,.nav:hover .nav-arrow{
  opacity:1;
  transform:translateX(2px);
}

.side-actions{
  padding:0 8px 4px;
}
.side-actions .ghost{
  min-height:42px;
  background:rgba(255,255,255,.035);
  color:#d8cfc4;
  border-color:rgba(255,255,255,.09);
}
.side-actions .ghost:hover{
  background:rgba(255,255,255,.08);
  color:#fff;
}

main{
  margin-left:286px;
  padding:20px 28px 36px;
}

.app-utility{
  position:sticky;
  top:0;
  z-index:25;
  min-height:62px;
  margin:-20px -28px 20px;
  padding:0 28px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:16px;
  background:rgba(244,241,237,.88);
  backdrop-filter:blur(18px);
  border-bottom:1px solid rgba(120,102,86,.12);
}
.utility-left,.utility-right{
  display:flex;
  align-items:center;
  gap:12px;
}
.utility-left strong{
  display:block;
  font-size:15px;
}
.utility-left span{
  display:block;
  color:var(--muted);
  font-size:11px;
  margin-top:2px;
}
.utility-chip{
  display:inline-flex;
  align-items:center;
  gap:7px;
  padding:7px 10px;
  border-radius:999px;
  background:#fff;
  border:1px solid var(--line);
  color:var(--muted);
  font-size:11px;
  font-weight:700;
  box-shadow:0 5px 15px rgba(41,31,23,.04);
}
.live-dot{
  width:7px;
  height:7px;
  border-radius:50%;
  background:#4f9a72;
  box-shadow:0 0 0 4px rgba(79,154,114,.12);
}
.menu-toggle{
  display:none;
  width:40px;
  height:40px;
  padding:0;
  background:#fff;
  border:1px solid var(--line);
  color:var(--ink);
}

.top{
  padding:8px 2px 4px;
}
.top h1{
  font-size:31px;
  letter-spacing:-.035em;
}
.top p{
  font-size:14px;
}

.panel,.mini-card,.kpi{
  border-color:rgba(145,124,105,.20);
  box-shadow:var(--shadow);
}
.panel{
  background:rgba(255,253,250,.94);
}
.form-card{
  position:relative;
  overflow:hidden;
}
.form-card:before{
  content:"";
  position:absolute;
  left:0;
  top:0;
  bottom:0;
  width:3px;
  background:linear-gradient(180deg,var(--gold),transparent);
  opacity:.75;
}
.section-head h2{letter-spacing:-.015em}
.step-badge{
  background:linear-gradient(135deg,#eadfD3,#f6efe8);
  border:1px solid #dfd0c0;
  box-shadow:0 5px 12px rgba(95,77,62,.08);
}

.current-sale-cards{
  gap:12px;
}
.mini-card{
  position:relative;
  overflow:hidden;
  transition:.18s ease;
}
.mini-card:hover{
  transform:translateY(-2px);
  box-shadow:var(--shadow-strong);
}
.mini-card:after{
  content:"";
  position:absolute;
  right:-24px;
  bottom:-30px;
  width:80px;
  height:80px;
  border-radius:50%;
  background:rgba(183,155,114,.08);
}

.action-with-icon{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:8px;
}
.action-with-icon span{
  font-size:15px;
}

input,select,textarea{
  border-color:#ded3c7;
  background:#fffefc;
}
input:hover,select:hover,textarea:hover{
  border-color:#c8b5a2;
}
input:focus,select:focus,textarea:focus{
  border-color:#a98f77;
  box-shadow:0 0 0 4px rgba(169,143,119,.13);
}

.status-card{
  transition:.18s ease;
  border-radius:16px;
}
.status-card:hover{
  transform:translateY(-2px);
  box-shadow:var(--shadow-strong);
}

.tablebox{
  border:1px solid rgba(145,124,105,.16);
  border-radius:16px;
  background:#fff;
}
.tablebox table{min-width:100%}
th{
  background:#eee4d8;
  color:#493b30;
  font-size:12px;
  letter-spacing:.01em;
}
td{background:#fff}
tbody tr:hover td{background:#fcf8f3}

.nav-overlay{
  display:none;
}

@media(max-width:1100px){
  .sidebar{
    position:fixed;
    top:0;
    left:-304px;
    width:286px;
    z-index:100;
    transition:left .22s ease;
  }
  body.nav-open .sidebar{left:0}
  .nav-overlay{
    display:block;
    position:fixed;
    inset:0;
    z-index:90;
    background:rgba(15,12,10,.45);
    opacity:0;
    visibility:hidden;
    transition:.22s ease;
  }
  body.nav-open .nav-overlay{
    opacity:1;
    visibility:visible;
  }
  main{
    margin-left:0;
    padding:18px;
  }
  .app-utility{
    margin:-18px -18px 18px;
    padding:0 18px;
  }
  .menu-toggle{display:grid;place-items:center}
  .utility-right .utility-chip:first-child{display:none}
}

@media(max-width:620px){
  .app-utility{
    min-height:58px;
  }
  .utility-left span{display:none}
  .utility-right{gap:6px}
  .top h1{font-size:25px}
  .top-actions{
    display:grid;
    grid-template-columns:1fr 1fr;
    width:100%;
  }
  .top-actions button{
    width:100%;
  }
  .top-actions .dark{
    grid-column:1/-1;
  }
}



/* V25: diseño premium, navegación adaptable y catálogo visual */
:root{
  --sidebar-wide:286px;
  --sidebar-narrow:88px;
  --gold:#b79a72;
}

html,body{max-width:100%;overflow-x:hidden}

.sidebar{
  width:var(--sidebar-wide);
  transition:width .22s ease,left .22s ease;
}
.sidebar-collapse{
  position:absolute;
  top:20px;
  right:-15px;
  width:30px;
  height:30px;
  padding:0;
  display:grid;
  place-items:center;
  border-radius:50%;
  border:1px solid rgba(255,255,255,.13);
  background:#302923;
  color:#e8ded3;
  z-index:4;
  box-shadow:0 8px 20px rgba(0,0,0,.25);
}
.sidebar-collapse svg{
  width:15px;height:15px;fill:none;stroke:currentColor;stroke-width:2;
  stroke-linecap:round;stroke-linejoin:round;transition:transform .2s ease;
}
main{
  margin-left:var(--sidebar-wide);
  min-width:0;
  transition:margin-left .22s ease;
}

body.sidebar-collapsed .sidebar{width:var(--sidebar-narrow)}
body.sidebar-collapsed main{margin-left:var(--sidebar-narrow)}
body.sidebar-collapsed .sidebar-collapse svg{transform:rotate(180deg)}
body.sidebar-collapsed .brand{padding-left:0;padding-right:0;text-align:center}
body.sidebar-collapsed .brand-logo{width:56px;height:56px;object-fit:contain;object-position:left}
body.sidebar-collapsed .brand p,
body.sidebar-collapsed .brand-badge,
body.sidebar-collapsed .nav-section-title,
body.sidebar-collapsed .nav-label,
body.sidebar-collapsed .nav-arrow,
body.sidebar-collapsed .nav-count,
body.sidebar-collapsed .side-actions{display:none}
body.sidebar-collapsed .nav{grid-template-columns:1fr;justify-items:center;padding:7px}
body.sidebar-collapsed .nav-icon{width:40px;height:40px}
body.sidebar-collapsed .side-nav{margin-top:14px}

.nav{grid-template-columns:34px minmax(0,1fr) auto 18px}
.nav-count{
  min-width:22px;height:22px;padding:0 6px;border-radius:999px;display:inline-flex;
  align-items:center;justify-content:center;background:rgba(255,255,255,.08);
  color:#d9cfc5;font-size:10px;font-weight:800
}
.nav-count.accent{background:rgba(183,154,114,.22);color:#f2dfc7}

.section-context{min-width:0}
.breadcrumb{display:flex;align-items:center;gap:7px;white-space:nowrap}
.breadcrumb span{color:#998d82;font-size:12px}
.breadcrumb b{color:#c7bbb0;font-weight:400}
.breadcrumb strong{font-size:14px}
.section-context>span{display:block;color:var(--muted);font-size:11px;margin-top:3px}

.quick-new-sale{
  min-height:38px;padding:8px 14px;display:inline-flex;align-items:center;gap:8px;
  border-radius:12px;background:#211c18;color:#fff;box-shadow:0 8px 18px rgba(32,25,20,.14)
}
.quick-new-sale span{font-size:18px;font-weight:400}
.utility-avatar{
  width:36px;height:36px;border-radius:11px;display:grid;place-items:center;
  background:linear-gradient(135deg,#6e6258,#423a33);color:#fff;font-size:11px;
  font-weight:800;letter-spacing:.06em
}

.workgrid{
  grid-template-columns:minmax(470px,.82fr) minmax(690px,1.18fr);
  gap:20px;
}
.paper-wrap{min-width:0}
.paper{width:100%;max-width:870px}
.form-stack{min-width:0}

.catalog-kpis{
  display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;margin-bottom:18px
}
.catalog-layout{
  display:grid;grid-template-columns:340px minmax(0,1fr);gap:20px;align-items:start
}
.catalog-editor{position:sticky;top:84px}
.catalog-upload{margin-top:4px}
.catalog-upload>input{position:absolute;width:1px;height:1px;opacity:0;pointer-events:none}
.catalog-photo-drop{
  min-height:220px;margin-top:7px;border:1px dashed #cdbca9;border-radius:18px;
  background:linear-gradient(145deg,#f8f3ed,#fff);display:grid;place-items:center;
  overflow:hidden;cursor:pointer;transition:.18s ease
}
.catalog-photo-drop:hover{border-color:#a78d73;background:#faf5ef}
.catalog-photo-drop img{
  width:100%;height:220px;object-fit:contain;background:#fff;display:none
}
.catalog-photo-drop img.visible{display:block}
#prodPhotoPlaceholder{
  min-height:220px;padding:28px;display:flex;flex-direction:column;align-items:center;
  justify-content:center;text-align:center;color:#6d6258
}
#prodPhotoPlaceholder:before{
  content:"+";width:46px;height:46px;margin-bottom:12px;border-radius:50%;
  display:grid;place-items:center;background:#eee2d6;color:#66564a;font-size:26px
}
#prodPhotoPlaceholder strong{font-size:14px}
#prodPhotoPlaceholder small{max-width:210px;margin-top:6px;color:#95877b;line-height:1.4}
.catalog-form-actions{display:grid;grid-template-columns:1fr 1.3fr;gap:10px;margin-top:14px}

.catalog-library{
  min-width:0
}
.catalog-library-head{
  display:flex;justify-content:space-between;align-items:end;gap:16px;margin-bottom:14px
}
.catalog-library-head h2{margin:0 0 5px;font-size:20px}
.catalog-library-head p{margin:0;color:var(--muted);font-size:13px}
.catalog-library-head input{width:300px;margin:0}

.products-grid{
  display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px
}
.product-card{
  min-width:0;background:#fff;border:1px solid rgba(145,124,105,.2);border-radius:20px;
  overflow:hidden;box-shadow:0 10px 28px rgba(42,31,23,.07);transition:.18s ease
}
.product-card:hover{transform:translateY(-3px);box-shadow:0 18px 40px rgba(42,31,23,.12)}
.product-card-photo{
  position:relative;height:210px;background:linear-gradient(145deg,#f3ece4,#fff);
  border-bottom:1px solid rgba(145,124,105,.14);display:grid;place-items:center;overflow:hidden
}
.product-card-photo img{width:100%;height:100%;object-fit:contain;padding:12px}
.product-no-photo{
  width:100%;height:100%;display:flex;flex-direction:column;align-items:center;
  justify-content:center;color:#8f8175
}
.product-no-photo span{
  width:58px;height:58px;border-radius:17px;display:grid;place-items:center;
  background:#ece2d8;color:#6c5e52;font-weight:900;letter-spacing:.08em
}
.product-no-photo small{margin-top:9px}
.product-price{
  position:absolute;right:11px;bottom:11px;padding:7px 10px;border-radius:10px;
  background:rgba(30,24,20,.88);color:#fff;font-size:11px;font-weight:800;
  backdrop-filter:blur(8px)
}
.product-card-body{padding:15px}
.product-card-body h3{margin:0 0 7px;font-size:16px}
.product-card-body p{
  height:42px;margin:0;color:var(--muted);font-size:12px;line-height:1.45;
  overflow:hidden;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2
}
.product-card-actions{
  display:grid;grid-template-columns:1fr auto auto;gap:7px;margin-top:14px
}
.product-card-actions button{padding:8px 9px;font-size:11px}
.catalog-empty{
  grid-column:1/-1;min-height:260px;border:1px dashed #cdbca9;border-radius:20px;
  display:flex;flex-direction:column;align-items:center;justify-content:center;
  background:#fff;color:var(--muted)
}
.catalog-empty strong{color:var(--ink);margin-bottom:5px}

.mobile-bottom-nav{display:none}

@media(max-width:1600px) and (min-width:1101px){
  .products-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media(max-width:1450px) and (min-width:1101px){
  .workgrid{grid-template-columns:1fr}
  .paper{max-width:900px}
}

@media(max-width:1100px){
  .sidebar-collapse{display:none}
  body.sidebar-collapsed .sidebar{width:286px}
  body.sidebar-collapsed main{margin-left:0}
  body.sidebar-collapsed .brand p,
  body.sidebar-collapsed .brand-badge,
  body.sidebar-collapsed .nav-section-title,
  body.sidebar-collapsed .nav-label,
  body.sidebar-collapsed .nav-arrow,
  body.sidebar-collapsed .nav-count,
  body.sidebar-collapsed .side-actions{display:initial}
  body.sidebar-collapsed .nav{display:grid;grid-template-columns:34px minmax(0,1fr) auto 18px;justify-items:stretch}
  .catalog-layout{grid-template-columns:1fr}
  .catalog-editor{position:static}
  .products-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
}

@media(max-width:720px){
  main{padding-bottom:86px}
  .app-utility{min-height:58px}
  .section-context>span,.local-chip{display:none}
  .quick-new-sale{display:none}
  .utility-avatar{width:34px;height:34px}
  .catalog-kpis{grid-template-columns:1fr}
  .catalog-library-head{align-items:stretch;flex-direction:column}
  .catalog-library-head input{width:100%}
  .products-grid{grid-template-columns:1fr}
  .catalog-photo-drop,.catalog-photo-drop img,#prodPhotoPlaceholder{min-height:190px;height:190px}
  .mobile-bottom-nav{
    position:fixed;left:10px;right:10px;bottom:10px;z-index:80;
    display:grid;grid-template-columns:repeat(5,1fr);padding:7px;border-radius:18px;
    background:rgba(29,24,20,.94);backdrop-filter:blur(16px);
    box-shadow:0 14px 35px rgba(0,0,0,.28)
  }
  .mobile-nav-item{
    padding:5px 2px;background:transparent;color:#a99e94;border-radius:12px;
    display:flex;flex-direction:column;align-items:center;gap:3px;font-size:9px
  }
  .mobile-nav-item svg{
    width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:1.8;
    stroke-linecap:round;stroke-linejoin:round
  }
  .mobile-nav-item.active{background:rgba(183,154,114,.2);color:#fff}
}



/* V26: corrección de navegación y vista previa adaptable */
.sidebar{
  z-index:40 !important;
}

/* El antiguo botón lateral se oculta: quedaba debajo de la barra superior. */
.sidebar-collapse{
  display:none !important;
}

.desktop-sidebar-toggle{
  width:38px;
  height:38px;
  min-width:38px;
  padding:0;
  display:grid;
  place-items:center;
  border-radius:11px;
  background:#fff;
  color:#4c4138;
  border:1px solid var(--line);
  box-shadow:0 6px 16px rgba(42,31,23,.07);
}
.desktop-sidebar-toggle:hover{
  background:#f6efe8;
}
.desktop-sidebar-toggle svg{
  width:18px;
  height:18px;
  fill:none;
  stroke:currentColor;
  stroke-width:2;
  stroke-linecap:round;
  stroke-linejoin:round;
  transition:transform .2s ease;
}
body.sidebar-collapsed .desktop-sidebar-toggle svg{
  transform:rotate(180deg);
}

/* El formulario y la nota solo permanecen lado a lado cuando existe
   espacio suficiente de verdad. En ventanas normales la nota baja completa. */
.workgrid{
  grid-template-columns:minmax(440px,540px) minmax(0,1fr) !important;
  width:100%;
  max-width:100%;
}
.form-stack,
.paper-wrap{
  min-width:0 !important;
  width:100%;
}
.paper-wrap{
  overflow:visible !important;
}
.paper{
  width:min(840px,100%) !important;
  max-width:100% !important;
  min-width:0 !important;
  margin-inline:auto;
}
.preview-top{
  width:min(840px,100%);
  max-width:100%;
  margin-inline:auto;
}
.items-table{
  width:100%;
  table-layout:fixed;
}
.items-table th,
.items-table td{
  overflow-wrap:anywhere;
  word-break:normal;
}
.items-table th:nth-child(1),
.items-table td:nth-child(1){width:18%}
.items-table th:nth-child(2),
.items-table td:nth-child(2){width:22%}
.items-table th:nth-child(3),
.items-table td:nth-child(3){width:25%}
.items-table th:nth-child(4),
.items-table td:nth-child(4){width:8%}
.items-table th:nth-child(5),
.items-table td:nth-child(5){width:13%}
.items-table th:nth-child(6),
.items-table td:nth-child(6){width:14%}

/* A este ancho, dos columnas producían recorte horizontal.
   Ahora la vista previa aparece completa debajo del formulario. */
@media(max-width:1780px) and (min-width:1101px){
  .workgrid{
    grid-template-columns:1fr !important;
  }
  .form-stack,
  .paper-wrap{
    max-width:1000px;
    margin-inline:auto;
  }
  .paper,
  .preview-top{
    width:min(900px,100%) !important;
  }
}

/* En ventanas más pequeñas el menú funciona como panel deslizable
   y la nota conserva el ancho disponible sin salirse de la pantalla. */
@media(max-width:1100px){
  .desktop-sidebar-toggle{
    display:none !important;
  }
  .workgrid{
    grid-template-columns:1fr !important;
  }
  .paper-wrap{
    overflow:hidden !important;
  }
  .paper{
    width:100% !important;
  }
}

/* Adaptación adicional de la nota para tablet y ventanas estrechas. */
@media(max-width:820px){
  .paper{
    padding:26px !important;
  }
  .paper-head{
    gap:10px;
  }
  .paper-logo-img{
    max-width:210px;
  }
  .paper-iso-img{
    width:66px;
    height:66px;
  }
  .title-block h2{
    font-size:22px;
  }
  .paper-info{
    grid-template-columns:1fr 1.2fr !important;
  }
  .paper-info>div:last-child{
    grid-column:1/-1;
  }
  .paper-bottom{
    grid-template-columns:1fr !important;
  }
}

/* En celular se presenta cada producto como bloque legible,
   evitando una tabla diminuta o cortada. */
@media(max-width:620px){
  .paper{
    padding:20px 16px !important;
  }
  .paper-head{
    display:grid;
    grid-template-columns:1fr;
  }
  .paper-brand-right{
    justify-content:space-between;
  }
  .items-table,
  .items-table thead,
  .items-table tbody,
  .items-table tr,
  .items-table th,
  .items-table td{
    display:block;
    width:100% !important;
  }
  .items-table thead{
    display:none;
  }
  .items-table tr{
    margin-bottom:14px;
    padding:10px;
    border:1px solid var(--line);
    border-radius:14px;
  }
  .items-table td{
    border:0;
    padding:5px 4px;
    text-align:left !important;
  }
  .items-table td:empty{
    display:none;
  }
}



/* V27 - Auditoría minuciosa: correcciones finales */
html,body{width:100%;max-width:100%;overflow-x:hidden}
.sidebar{overflow-y:auto;overflow-x:hidden}
main,.utility-left,.section-context,.top>div,.form-stack,.paper-wrap{min-width:0}
.preview-top{display:flex;flex-wrap:wrap;gap:10px}.preview-top h2{margin-right:auto}

.item-grid{
  grid-template-columns:minmax(140px,1.05fr) minmax(170px,1.35fr) 70px 105px 120px 132px auto !important;
  align-items:end;
}
.item-photo-field{min-width:0;color:var(--muted);font-size:13px;font-weight:700}
.item-field-title{display:block;margin-bottom:5px}
.item-photo-label{display:block;margin:0}
.item-photo-label input{position:absolute;width:1px;height:1px;opacity:0;pointer-events:none}
.item-photo-pick{display:flex;min-height:42px;align-items:center;justify-content:center;padding:8px;border:1px solid var(--line);border-radius:12px;background:#fff;color:var(--ink);font-size:11px;cursor:pointer}
.item-photo-clear{width:100%;margin-top:6px;padding:6px 8px;border-radius:9px;background:#fff4f1;color:var(--danger);border:1px solid #efd1ca;font-size:10px}
.item-photo-clear.hidden{display:none}
.photo-preview{width:100% !important;max-width:128px;height:88px !important;object-fit:contain !important}
.item .remove{min-width:106px;white-space:nowrap}

/* Evitar que width 100% más márgenes recorte la tabla */
.items-table{width:calc(100% - 80px) !important;margin:8px 40px 0 !important;table-layout:fixed}
.summary-page{display:contents}

@media(max-width:1100px){
  main,body.sidebar-collapsed main{margin-left:0 !important;width:100% !important}
  .sidebar,body.sidebar-collapsed .sidebar{position:fixed !important;top:0;bottom:0;left:-304px;width:286px !important}
  body.nav-open .sidebar{left:0 !important}
  .item-grid{grid-template-columns:repeat(2,minmax(0,1fr)) !important}
  .item-photo-field,.item .remove{width:100%}
}
@media(max-width:820px){
  main{padding-left:16px !important;padding-right:16px !important}
  .app-utility{margin-left:-16px !important;margin-right:-16px !important;padding-left:16px !important;padding-right:16px !important}
  .paper-info,.paper-bottom,.terms,.signature{margin-left:20px !important;margin-right:20px !important}
  .items-table{width:calc(100% - 40px) !important;margin-left:20px !important;margin-right:20px !important}
}
@media(max-width:620px){
  main{padding:12px 12px 88px !important}
  .app-utility{margin:-12px -12px 14px !important;padding:0 12px !important}
  .item-grid{grid-template-columns:1fr !important}
  .items-table td{display:grid !important;grid-template-columns:112px minmax(0,1fr);gap:10px;align-items:center}
  .items-table td::before{content:attr(data-label);color:#756c64;font-size:10px;font-weight:800;text-transform:uppercase;letter-spacing:.04em}
  .items-table td[data-label="Foto"]{grid-template-columns:1fr}.items-table td[data-label="Foto"]::before{display:none}
  .pv-photo{width:100% !important;max-width:180px;height:120px !important}
}


/* V28: corrección crítica del menú lateral móvil/tablet */
@media(max-width:1100px){
  .sidebar,
  body.sidebar-collapsed .sidebar{
    z-index:120 !important;
    pointer-events:auto !important;
    opacity:1 !important;
    filter:none !important;
  }

  body.nav-open .sidebar,
  body.nav-open.sidebar-collapsed .sidebar{
    left:0 !important;
    visibility:visible !important;
    opacity:1 !important;
    pointer-events:auto !important;
  }

  .nav-overlay{
    z-index:110 !important;
    pointer-events:none !important;
  }

  body.nav-open .nav-overlay{
    visibility:visible !important;
    opacity:1 !important;
    pointer-events:auto !important;
  }

  .sidebar .nav,
  .sidebar .side-actions button,
  .sidebar button,
  .sidebar label{
    pointer-events:auto !important;
    position:relative;
    z-index:2;
  }
}

.sidebar{
  isolation:isolate;
}

/* V29: impresión profesional definitiva - independiente del tamaño de la ventana */




/* V30: escala de impresión legible y equilibrada */




/* Legacy print rules removed in Enterprise v31. PDF output is rendered by enterprise-pdf.js. */