/* Fuentes (@font-face) — extraído de balitz-app.html */
/* Cormorant Garamond */
@font-face { font-family: 'Cormorant Garamond'; font-style: normal; font-weight: 300; src: url('fonts/cormorant-garamond-v21-latin-300.woff2') format('woff2'); }
@font-face { font-family: 'Cormorant Garamond'; font-style: italic; font-weight: 300; src: url('fonts/cormorant-garamond-v21-latin-300italic.woff2') format('woff2'); }
@font-face { font-family: 'Cormorant Garamond'; font-style: normal; font-weight: 400; src: url('fonts/cormorant-garamond-v21-latin-regular.woff2') format('woff2'); }
@font-face { font-family: 'Cormorant Garamond'; font-style: italic; font-weight: 400; src: url('fonts/cormorant-garamond-v21-latin-italic.woff2') format('woff2'); }
@font-face { font-family: 'Cormorant Garamond'; font-style: normal; font-weight: 500; src: url('fonts/cormorant-garamond-v21-latin-500.woff2') format('woff2'); }
@font-face { font-family: 'Cormorant Garamond'; font-style: italic; font-weight: 500; src: url('fonts/cormorant-garamond-v21-latin-500italic.woff2') format('woff2'); }
@font-face { font-family: 'Cormorant Garamond'; font-style: normal; font-weight: 600; src: url('fonts/cormorant-garamond-v21-latin-600.woff2') format('woff2'); }
@font-face { font-family: 'Cormorant Garamond'; font-style: italic; font-weight: 600; src: url('fonts/cormorant-garamond-v21-latin-600italic.woff2') format('woff2'); }
@font-face { font-family: 'Cormorant Garamond'; font-style: normal; font-weight: 700; src: url('fonts/cormorant-garamond-v21-latin-700.woff2') format('woff2'); }
/* Jost */
@font-face { font-family: 'Jost'; font-style: normal; font-weight: 300; src: url('fonts/jost-v20-latin-300.woff2') format('woff2'); }
@font-face { font-family: 'Jost'; font-style: normal; font-weight: 400; src: url('fonts/jost-v20-latin-regular.woff2') format('woff2'); }
@font-face { font-family: 'Jost'; font-style: normal; font-weight: 500; src: url('fonts/jost-v20-latin-500.woff2') format('woff2'); }
@font-face { font-family: 'Jost'; font-style: normal; font-weight: 600; src: url('fonts/jost-v20-latin-600.woff2') format('woff2'); }

/* ── Estilos principales ── */
:root {
  --black:#000;--charcoal:#1F1F21;--dark:#141416;--dark2:#0C0C0E;--dark3:#0A0A0C;
  --border:#252528;--border2:#1E1E21;--gold:#C8A96E;--gold-dark:#1C1508;--gold-border:#3D2E0A;
  --beige:#EDE8DF;--text-primary:#EDE8DF;--text-secondary:#C4BDB5;--text-muted:#9C948C;
  --text-dim:#787068;--text-vdim:#585048;--green:#68C97A;--green-dark:#0a1f0a;--green-border:#1a3a1a;
  --amber:#E8A832;--red:#D46060;--blue:#5B9BD5;--blue-dark:#0a1525;
}

/* ── Date Picker ── */
#balitz-datepicker{position:fixed;z-index:9999;background:#0C0C0E;border:0.5px solid #252528;box-shadow:0 8px 24px rgba(0,0,0,0.6);width:252px;user-select:none;font-family:'Jost',sans-serif;}
#balitz-datepicker .dp-head{display:flex;align-items:center;justify-content:space-between;padding:7.2px 11.9px;border-bottom:0.5px solid #252528;background:#0A0A0C;}
#balitz-datepicker .dp-nav{background:transparent;border:none;color:#9C948C;cursor:pointer;font-size:13.6px;padding:1.4px 5.1px;line-height:1;}
#balitz-datepicker .dp-nav:hover{color:#C8A96E;}
#balitz-datepicker .dp-title{font-size:9.3px;letter-spacing:2px;color:#EDE8DF;font-weight:500;cursor:pointer;}
#balitz-datepicker .dp-title:hover{color:#C8A96E;}
#balitz-datepicker .dp-grid{display:grid;grid-template-columns:repeat(7,1fr);gap:0;padding:6.8px;}
#balitz-datepicker .dp-dow{font-size:7.6px;letter-spacing:1px;color:#787068;text-align:center;padding:3.4px 0;}
#balitz-datepicker .dp-day{font-size:10.2px;text-align:center;padding:3.6px 1.7px;cursor:pointer;color:#C4BDB5;border-radius:2px;}
#balitz-datepicker .dp-day:hover{background:#252528;color:#EDE8DF;}
#balitz-datepicker .dp-day.today{color:#C8A96E;}
#balitz-datepicker .dp-day.selected{background:#C8A96E;color:#0C0C0E;font-weight:600;}
#balitz-datepicker .dp-day.other-month{color:#35332F;}
#balitz-datepicker .dp-day.empty{cursor:default;}
#balitz-datepicker .dp-day.empty:hover{background:transparent;}
*{box-sizing:border-box;margin:0;padding:0;}
html,body{height:100%;overflow:hidden;}
body{font-family:'Jost',sans-serif;background:var(--charcoal);color:#F9F9F9;font-size:11.9px;}
.app{display:flex;height:100vh;}
.sidebar{width:200px;min-width:200px;background:var(--black);display:flex;flex-direction:column;border-right:0.5px solid var(--border);}
.sidebar-logo{padding:20.2px 18.7px 22px;border-bottom:0.5px solid var(--border2);overflow:visible;}
.logo-text{font-family:'Cormorant Garamond',serif;font-size:28px;letter-spacing:3px;color:var(--gold);white-space:nowrap;}
.logo-sub{font-size:7.6px;letter-spacing:4px;color:var(--text-dim);margin-top:4px;}
.sidebar-nav{flex:1;padding:11.9px 0;overflow-y:auto;}
.nav-section{padding:8.7px 18.7px 5px;font-size:11.4px;letter-spacing:3px;color:var(--gold);}
.nav-item{display:flex;align-items:center;gap:12px;padding:8.7px 18.7px;font-size:13.2px;color:var(--text-secondary);cursor:pointer;border-left:3px solid transparent;transition:all 0.15s;}
.nav-icon{width:16px;height:16px;stroke:currentColor;flex-shrink:0;opacity:0.55;}
.nav-item:hover .nav-icon,.nav-item.active .nav-icon{opacity:1;}
.nav-item:hover{color:var(--beige);background:#080808;}
.nav-item.active{color:var(--gold);border-left:3px solid var(--gold);background:var(--gold-dark);font-weight:500;}
.sidebar-bottom{padding:13.0px 18.7px;border-top:0.5px solid var(--border2);}
.avatar{width:32px;height:32px;border-radius:50%;background:var(--gold);display:flex;align-items:center;justify-content:center;font-size:9.3px;color:var(--black);font-weight:600;flex-shrink:0;}
.avatar.ventas{background:var(--gold-dark);color:var(--gold);border:0.5px solid var(--gold);}
.main{flex:1;display:flex;flex-direction:column;overflow:hidden;}
.topbar{display:flex;align-items:center;justify-content:space-between;padding:10.9px 25.5px;border-bottom:0.5px solid var(--border);flex-shrink:0;}
.ctx-bar{display:none;align-items:center;justify-content:space-between;padding:8.7px 25.5px;background:#0a0a0a;border-bottom:0.5px solid var(--gold-border);flex-shrink:0;}
.ctx-bar.visible{display:flex;}
.ctx-info{display:flex;align-items:center;gap:10px;font-size:14.4px;color:var(--text-dim);}
.ctx-info .ctx-sep{color:#333;}
.ctx-info .ctx-cliente{color:var(--text-secondary);}
.ctx-info .ctx-proyecto{color:var(--gold);font-weight:500;}
.ctx-info .ctx-version{color:var(--text-dim);font-size:12.8px;letter-spacing:1px;}
.ctx-nav{display:flex;align-items:center;gap:6px;}
.ctx-btn{background:transparent;border:0.5px solid var(--border);color:var(--text-secondary);padding:4.3px 13.6px;font-size:11.0px;letter-spacing:1.5px;cursor:pointer;font-family:'Jost',sans-serif;transition:all 0.15s;}
.ctx-btn-close{border-color:var(--red)!important;color:var(--red)!important;}
.ctx-btn-close:hover{background:var(--red)!important;color:#fff!important;}
.ctx-btn:hover{border-color:var(--gold);color:var(--gold);}
.ctx-btn.ctx-active{border-color:var(--gold);color:var(--gold);background:var(--gold-dark);}
.breadcrumb{display:flex;align-items:center;gap:6px;font-size:12.2px;color:var(--text-muted);}
.breadcrumb .crumb{color:var(--gold);cursor:pointer;}
.breadcrumb .crumb:hover{opacity:0.7;}
.breadcrumb .sep{color:#333;}
.breadcrumb .current{color:var(--text-primary);}
.topbar-right{display:flex;align-items:center;gap:10px;}
.btn-gold{background:var(--gold);color:var(--black);border:none;padding:5.8px 16.8px;font-size:8.4px;letter-spacing:2px;cursor:pointer;font-weight:600;font-family:'Jost',sans-serif;transition:opacity 0.15s;}
.btn-gold:hover{opacity:0.85;}
.btn-outline{background:transparent;color:var(--gold);border:0.5px solid var(--gold);padding:5.8px 16.8px;font-size:8.4px;letter-spacing:1.5px;cursor:pointer;font-family:'Jost',sans-serif;transition:all 0.15s;}
.btn-outline:hover{background:var(--gold-dark);}
.btn-sm{padding:3.9px 10.7px;font-size:8.4px;cursor:pointer;border:0.5px solid var(--border);background:transparent;color:var(--text-secondary);transition:all 0.15s;font-family:'Jost',sans-serif;}
.btn-sm:hover{border-color:var(--gold);color:var(--gold);}
.btn-sm.danger:hover{border-color:var(--red);color:var(--red);}
.page{display:none;flex:1;flex-direction:column;overflow:hidden;}.page.active{display:flex;flex:1;height:100%;}
.page.active{display:flex;flex:1;min-height:0;}
.scroll-area{flex:1;overflow-y:auto;padding:18.8px 25.5px;display:flex;flex-direction:column;gap:20px;}
.info-bar{display:flex;align-items:center;justify-content:space-between;background:var(--dark);border-bottom:0.5px solid var(--border);padding:10.1px 25.5px;flex-shrink:0;}
.ver-selector{position:relative;}
.ver-current{display:flex;align-items:center;gap:8px;background:var(--gold-dark);border:0.5px solid var(--gold);color:var(--gold);padding:5.1px 11.9px;font-size:10.2px;letter-spacing:2px;cursor:pointer;}
.ver-menu{display:none;position:absolute;left:0;top:110%;background:var(--dark2);border:0.5px solid var(--border);z-index:50;min-width:220px;box-shadow:0 8px 24px rgba(0,0,0,0.5);}
.ver-menu.open{display:block;}
.ver-opt{display:flex;align-items:center;justify-content:space-between;padding:7.9px 13.6px;font-size:11.0px;color:var(--text-secondary);cursor:pointer;border-bottom:0.5px solid var(--border2);}
.ver-opt:hover{background:var(--border2);color:var(--gold);}
.ver-opt.active-ver{color:var(--gold);background:var(--gold-dark);}
.ver-opt:last-child{border-bottom:none;}
.vob{font-size:8.5px;padding:1.4px 6.8px;letter-spacing:1px;}
.vob-aprobado{background:var(--green-dark);color:var(--green);border:0.5px solid var(--green-border);}
.vob-enviado{background:#1a0e00;color:#e87c2a;border:0.5px solid #7a4010;}
.vob-borrador{background:#1a1a1a;color:#666;border:0.5px solid var(--border);}.vob-activa{background:var(--gold-dark);color:var(--gold);border:0.5px solid var(--gold-border);}
.status-dropdown{position:relative;}
.status-badge{padding:5.1px 11.9px;font-size:9.3px;letter-spacing:1.5px;cursor:pointer;}
.status-enviado{background:#1a0e00;color:#e87c2a;border:0.5px solid #7a4010;}
.proy-propuesta{background:#1a1a1a;color:var(--text-secondary);border:0.5px solid var(--border);}
.proy-en-proceso{background:#1a0e00;color:#e87c2a;border:0.5px solid #7a4010;}
.proy-cerrado{background:var(--green-dark);color:var(--green);border:0.5px solid var(--green-border);}
.proy-retrasado{background:#2a0000;color:#cc4444;border:0.5px solid #5a1a1a;}
.status-aprobado{background:var(--green-dark);color:var(--green);border:0.5px solid var(--green-border);}
.status-borrador{background:#1a1a1a;color:var(--text-secondary);border:0.5px solid var(--border);}
.status-menu{display:none;position:absolute;right:0;top:110%;background:var(--dark2);border:0.5px solid var(--border);z-index:50;min-width:160px;}
.status-menu.open{display:block;}
.status-opt{padding:7.9px 13.6px;font-size:11.0px;color:var(--text-secondary);cursor:pointer;border-bottom:0.5px solid var(--border2);}
.status-opt:last-child{border-bottom:none;}
.status-opt:hover{background:var(--border2);color:var(--gold);}
.metrics-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px;}
.metric{background:var(--dark);border:0.5px solid var(--border);padding:17px;}
.metric-label{font-size:8.5px;letter-spacing:2.5px;color:var(--text-dim);margin-bottom:10px;}
.metric-value{font-family:'Jost',serif;font-size:23.8px;color:var(--text-primary);}
.metric-sub{font-size:9.3px;color:var(--gold);margin-top:6px;}
.panel{background:var(--dark);border:0.5px solid var(--border);padding:17px;}
.panel-title{font-size:9.3px;letter-spacing:2.5px;color:var(--text-muted);margin-bottom:16px;}
.two-col{display:grid;grid-template-columns:1.6fr 1fr;gap:16px;}
table{width:100%;border-collapse:collapse;}
thead{position:sticky;top:0;z-index:2;}
th{padding:9px 14px;text-align:left;font-size:10px;letter-spacing:2px;color:#BBB;border-bottom:1px solid var(--border);font-weight:600;background:var(--dark3);white-space:nowrap;}
th.right{text-align:right;}th.center{text-align:center;}
td{padding:10px 14px;border-bottom:0.5px solid var(--border2);vertical-align:middle;font-size:15.5px;}
tr:hover td{background:#161616;}
tr.group-row td{background:#080808;padding:6.5px 13.6px;border-top:1px solid var(--border);border-bottom:0.5px solid var(--border);}
tr.group-row:hover td{background:#080808;}
tr.subtotal-row td{background:#161410;padding:7.9px 13.6px;border-top:1px solid var(--gold-border);border-bottom:1px solid var(--gold-border);}
tr.subtotal-row:hover td{background:#161410;}
tr.total-row td{background:var(--gold-dark);padding:9.3px 13.6px;border-top:1px solid var(--gold);}
tr.total-row:hover td{background:var(--gold-dark);}
tr.grand-total td{background:#161410;border-top:1px solid var(--gold-border);color:var(--gold);font-size:11.0px;}
tr.grand-total:hover td{background:#161410;}
.group-label{font-size:10.2px;letter-spacing:3px;color:#999;font-weight:600;}
.group-count{font-size:11.0px;color:#E8A832;margin-left:8px;}
.subtotal-label{font-size:8.5px;color:#888;text-align:right;letter-spacing:2px;font-weight:600;}
.subtotal-val{font-size:11.0px;color:var(--gold);text-align:right;font-weight:700;}
.total-label{font-size:10.2px;color:var(--gold);text-align:right;letter-spacing:3px;font-weight:600;}
.total-val{font-family:'Jost',sans-serif;font-size:13.6px;color:var(--gold);text-align:right;font-weight:600;}
.td-code{color:var(--gold);letter-spacing:1px;white-space:nowrap;}
.td-product{color:var(--text-primary);}
.td-product-sub{font-size:11.2px;color:var(--amber);margin-top:2px;}
.td-name{color:var(--text-primary);}
.td-sub{color:var(--text-muted);font-size:10.2px;}
.td-num{text-align:right;color:#CCC;}
.td-num.highlight{color:var(--text-primary);font-weight:500;}
.td-gold{color:var(--gold);font-weight:700;text-align:right;}
.td-green{color:var(--green);font-weight:700;text-align:right;}
.td-pct{text-align:right;font-weight:600;}
.td-pct.good{color:var(--green);}
.td-pct.warn{color:var(--amber);}
.td-pct.bad{color:var(--red);}
.dot-on{width:8px;height:8px;border-radius:50%;background:var(--green);display:inline-block;}
.dot-off{width:8px;height:8px;border-radius:50%;background:#444;display:inline-block;}
.dot-perm{width:8px;height:8px;border-radius:50%;display:inline-block;cursor:pointer;transition:background 0.2s;}
.dot-perm.on{background:var(--green);}
.dot-perm.off{background:#444;}
.td-actions{display:flex;gap:6px;align-items:center;opacity:0;transition:opacity .15s;}
tr:hover .td-actions{opacity:1;}
.pill-mxn{background:#1a1a1a;color:rgba(255,255,255,0.9);border:0.5px solid var(--border);padding:1.4px 6.8px;font-size:15.5px;letter-spacing:1px;}
.pill-usd{background:var(--green-dark);color:var(--green);border:0.5px solid var(--green-border);padding:1.4px 6.8px;font-size:15.5px;letter-spacing:1px;}
.cat-badge{display:inline-block;padding:3px 10px;border-radius:20px;font-size:15.5px;font-weight:600;letter-spacing:.2px;white-space:nowrap;}
.spill-on{display:inline-flex;align-items:center;gap:3px;padding:2px 8px;border-radius:20px;font-size:15.5px;background:#0a2a0a;color:var(--green);border:0.5px solid #1a3a1a;}
.spill-off{display:inline-flex;align-items:center;gap:3px;padding:2px 8px;border-radius:20px;font-size:15.5px;background:#2a0a0a;color:var(--red);border:0.5px solid #4a1a1a;}
.cat-tag-row{display:flex;gap:6px;flex-wrap:wrap;padding:5px 25px;background:var(--dark3);border-bottom:0.5px solid var(--border);flex-shrink:0;min-height:0;}
.cat-tag-row:empty{display:none;}
.cat-tag{display:inline-flex;align-items:center;gap:4px;background:#111;border:0.5px solid var(--border);border-radius:20px;padding:3px 9px;font-size:9px;color:var(--text-secondary);cursor:pointer;letter-spacing:.3px;}
.cat-tag:hover{border-color:var(--gold);color:var(--gold);}
.prod-sub{font-size:13px;color:var(--green);margin-top:2px;}
.table-wrap{border:0.5px solid var(--border);overflow-y:auto;}
.filters-bar{display:flex;align-items:center;gap:10px;flex-wrap:wrap;flex-shrink:0;padding:10.1px 25.5px;border-bottom:0.5px solid var(--border);background:var(--dark3);}
.search-input{background:var(--dark);border:0.5px solid var(--border);color:var(--text-primary);padding:7.9px 13.6px;font-size:14.4px;outline:none;width:300px;font-family:'Jost',sans-serif;}
.search-input::placeholder{color:var(--text-vdim);}
.search-input:focus{border-color:var(--gold);}
.filter-select{background:var(--dark);border:0.5px solid var(--border);color:var(--text-secondary);padding:7.9px 13.6px;font-size:14.4px;outline:none;cursor:pointer;font-family:'Jost',sans-serif;}
.filter-select:focus{border-color:var(--gold);}
.clear-btn{background:transparent;border:none;color:#E8A832;font-size:11.9px;cursor:pointer;font-family:'Jost',sans-serif;}
.clear-btn:hover{color:var(--gold);}
.clients-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;}
.client-card{background:var(--dark);border:0.5px solid var(--border);padding:17px;cursor:pointer;transition:border-color 0.15s;}
.client-card:hover{border-color:var(--gold);}
.client-id{font-size:9.3px;letter-spacing:2px;color:#E8A832;margin-bottom:8px;}
.client-name{font-family:'Jost',sans-serif;font-size:16.1px;color:var(--text-primary);margin-bottom:12px;}
.client-meta{display:flex;align-items:center;justify-content:space-between;}
.client-projects{font-size:9.3px;color:var(--text-muted);}
.client-total{font-size:11.0px;color:var(--gold);font-weight:500;}
.card{background:var(--dark);border:0.5px solid var(--border);padding:20.4px;}
.card-title{font-size:9.3px;letter-spacing:2.5px;color:var(--text-muted);margin-bottom:18px;}
.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:18px;}
.form-grid-3{display:grid;grid-template-columns:1fr 1fr 1fr;gap:18px;}
.form-group{display:flex;flex-direction:column;gap:7px;}
.form-group.full{grid-column:1/-1;}
.form-label{font-size:10.2px;letter-spacing:2px;color:rgba(255,255,255,0.8);font-weight:500;}
#modal-cliente .form-label, #modal-cliente .card-title{color:rgba(255,255,255,0.8);font-size:10.2px;}
#modal-cliente .form-input{font-size:14.3px;padding:8.6px 14.3px;}
#modal-proyecto .form-label, #modal-proyecto .card-title{color:#ffffff;}
#modal-proveedor .form-label, #modal-proveedor .card-title{color:rgba(255,255,255,0.8);font-size:10.6px;}
#modal-proveedor .form-input{font-size:14.9px;padding:9px 14.9px;}
#panel-producto .form-label{color:rgba(255,255,255,0.8);}
.form-input{background:var(--dark2);border:0.5px solid var(--border);color:var(--text-primary);padding:7.2px 11.9px;font-size:11.9px;outline:none;font-family:'Jost',sans-serif;}
.fecha-wrap{position:relative;display:inline-block;width:100%;}
.fecha-wrap .form-input,.fecha-wrap .pp-input{padding-right:34px;width:100%;}
.fecha-wrap .cal-icon{position:absolute;right:10px;top:50%;transform:translateY(-50%);cursor:pointer;color:var(--text-dim);transition:color 0.15s;}
.fecha-wrap .cal-icon:hover{color:var(--gold);}
.form-input:focus{border-color:var(--gold);}
.form-input::placeholder{color:var(--text-vdim);}
.form-select{background:var(--dark2);border:0.5px solid var(--border);color:var(--text-secondary);padding:7.2px 30px 7.2px 11.9px;font-size:11.9px;outline:none;cursor:pointer;font-family:'Jost',sans-serif;appearance:none;-webkit-appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6' viewBox='0 0 10 6'%3E%3Cpath d='M0 0l5 6 5-6z' fill='%23C8A96E'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 10px center;}
.form-select:focus{border-color:var(--gold);color:var(--text-primary);}
.form-select option{background:#1a1a1c;color:var(--text-secondary);}
.form-select optgroup{background:#0C0C0E;color:var(--gold);font-style:normal;font-size:10px;letter-spacing:1.5px;text-transform:uppercase;font-weight:600;}
.form-select optgroup option{background:#141416;color:var(--text-secondary);padding-left:8px;font-size:11.9px;letter-spacing:0;text-transform:none;font-weight:400;}
.form-hint{font-size:9.3px;color:var(--text-vdim);margin-top:2px;}
.csel-wrap{position:relative;width:100%;}
.csel-trigger{background:var(--dark2);border:0.5px solid var(--border);color:var(--text-secondary);padding:7.2px 30px 7.2px 11.9px;font-size:11.9px;cursor:pointer;font-family:'Jost',sans-serif;display:flex;align-items:center;justify-content:space-between;user-select:none;transition:border-color 0.15s;}
.csel-trigger:hover,.csel-trigger.open{border-color:var(--gold);color:var(--text-primary);}
.csel-arrow{width:10px;height:6px;flex-shrink:0;margin-left:8px;transition:transform 0.15s;}
.csel-trigger.open .csel-arrow{transform:rotate(180deg);}
.csel-dropdown{display:none;position:absolute;top:100%;left:0;right:0;background:var(--dark);border:0.5px solid var(--gold-border);z-index:9999;max-height:240px;overflow-y:auto;box-shadow:0 8px 24px rgba(0,0,0,0.6);}
.csel-dropdown.open{display:block;}
.csel-group-label{padding:6px 12px 4px;font-size:9px;letter-spacing:2px;color:var(--gold);text-transform:uppercase;font-weight:600;background:var(--dark2);border-bottom:0.5px solid var(--border);position:sticky;top:0;}
.csel-option{padding:7px 12px 7px 20px;font-size:11.9px;color:var(--text-secondary);cursor:pointer;transition:background 0.1s;}
.csel-option:hover{background:var(--gold-dark);color:var(--text-primary);}
.csel-option.selected{color:var(--gold);background:var(--gold-dark);}
.csel-option-plain{padding:7px 12px;font-size:11.9px;color:var(--text-muted);cursor:pointer;transition:background 0.1s;font-style:italic;}
.csel-option-plain:hover{background:var(--gold-dark);color:var(--text-secondary);}
.form-actions{display:flex;justify-content:flex-end;gap:10px;}
.bloque{background:var(--dark);border:0.5px solid var(--border);}
.bloque-header{display:flex;align-items:center;justify-content:space-between;padding:10.1px 17px;border-bottom:1px solid #333;background:var(--dark3);}
.bloque-title{font-size:11.0px;letter-spacing:3px;color:var(--text-primary);font-weight:600;}
.bloque-subtitle{font-size:10.2px;color:var(--text-dim);}
.tabs{display:flex;border-bottom:0.5px solid var(--border);flex-shrink:0;background:var(--dark3);}
.tab{padding:9.3px 23.8px;font-size:11.0px;letter-spacing:2px;color:var(--text-dim);cursor:pointer;border-bottom:2px solid transparent;transition:all 0.15s;}
.tab:hover{color:var(--text-secondary);}
.tab.active{color:var(--gold);border-bottom:2px solid var(--gold);background:var(--dark);}
.content-area{flex:1;display:flex;overflow:hidden;}
.cot-content{flex:1;display:flex;flex-direction:column;padding:14.4px 25.5px;gap:14px;overflow:hidden;}
.add-panel{width:0;min-width:0;background:var(--dark2);border-left:0.5px solid var(--border);display:flex;flex-direction:column;overflow:hidden;transition:width 0.2s ease;flex-shrink:0;}
.add-panel.open{width:502px;min-width:502px;}

.panel-header{display:flex;align-items:center;justify-content:space-between;padding:11.6px 18.7px;border-bottom:0.5px solid var(--border);flex-shrink:0;}
.panel-title-txt{font-size:9.3px;letter-spacing:2px;color:var(--text-primary);font-weight:600;}
.panel-close{background:transparent;border:none;color:var(--text-dim);font-size:15.3px;cursor:pointer;}
.panel-close:hover{color:var(--gold);}
.panel-search{padding:10.1px 18.7px;border-bottom:0.5px solid var(--border2);flex-shrink:0;display:flex;flex-direction:column;gap:10px;}
.panel-input{background:var(--dark);border:0.5px solid var(--border);color:var(--text-primary);padding:7.2px 11.9px;font-size:11.9px;outline:none;width:100%;font-family:'Jost',sans-serif;}
.panel-input:focus{border-color:var(--gold);}
.panel-input::placeholder{color:var(--text-vdim);}
.panel-filters{display:flex;gap:8px;}
.panel-select{flex:1;background:var(--dark);border:0.5px solid var(--border);color:var(--text-secondary);padding:6.5px 8.5px;font-size:10.2px;outline:none;cursor:pointer;font-family:'Jost',sans-serif;}
.panel-results{flex:1;overflow-y:auto;}
.result-item{display:flex;align-items:center;gap:10px;padding:10.1px 18.7px;border-bottom:0.5px solid var(--border2);transition:background 0.12s;}
.result-item:hover{background:var(--dark);}
.result-info{flex:1;min-width:0;}
.result-name{font-size:11.0px;color:var(--text-primary);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.result-code{font-size:9.3px;color:var(--gold);margin-top:2px;letter-spacing:1px;}
.result-price{font-size:10.2px;color:var(--text-muted);margin-top:2px;}
.result-qty{width:56px;background:var(--dark3);border:0.5px solid var(--border);color:var(--text-primary);padding:5.1px 6.8px;font-size:11.0px;text-align:center;outline:none;font-family:'Jost',sans-serif;}
.result-qty:focus{border-color:var(--gold);}
.btn-add-item{background:var(--gold);border:none;color:var(--black);padding:5.8px 13.6px;font-size:9.3px;font-weight:600;cursor:pointer;white-space:nowrap;flex-shrink:0;font-family:'Jost',sans-serif;letter-spacing:1px;}
.panel-footer{padding:11.6px 18.7px;border-top:0.5px solid var(--border);flex-shrink:0;}
.result-item{position:relative;}

.added-count{font-size:10.2px;color:var(--text-dim);margin-bottom:10px;}
.added-count span{color:var(--gold);font-weight:600;}
.qty-input{background:var(--dark2);border:0.5px solid var(--border);color:var(--text-primary);padding:3.6px 6.8px;font-size:15.5px;width:90px;text-align:right;outline:none;font-family:'Jost',sans-serif;}
.btn-cot-excluir:hover{border-color:var(--amber)!important;color:var(--amber)!important;}
.qty-input:focus{border-color:var(--gold);}
.fv-input{background:var(--green-dark);border:0.5px solid var(--green-border);color:var(--green);padding:3.6px 6.8px;font-size:15.5px;width:60px;text-align:center;outline:none;font-family:'Jost',sans-serif;}
.fv-input:focus{border-color:var(--green);}
.iva-toggle{display:flex;align-items:center;justify-content:center;}
.toggle-btn{padding:2.9px 10.2px;font-size:9.3px;letter-spacing:1px;cursor:pointer;border:0.5px solid var(--border);background:transparent;transition:all 0.15s;font-family:'Jost',sans-serif;}
.toggle-btn.on{background:var(--green-dark);color:var(--green);border-color:var(--green-border);}
.toggle-btn.off{background:#1a1a1a;color:var(--text-dim);border-color:var(--border);}
.estado-wrap{position:relative;display:inline-block;}
.estado-btn{padding:3.6px 7px;font-size:15.5px;letter-spacing:.5px;cursor:pointer;border:none;white-space:nowrap;font-family:'Jost',sans-serif;}
.estado-menu{display:none;position:absolute;left:0;top:110%;background:var(--dark2);border:0.5px solid var(--border);z-index:30;min-width:140px;box-shadow:0 8px 20px rgba(0,0,0,0.5);}
.estado-menu.open{display:block;}
.estado-opt{padding:6.5px 11.9px;font-size:10.2px;color:var(--text-secondary);cursor:pointer;border-bottom:0.5px solid var(--border2);font-family:'Jost',sans-serif;}
.estado-opt:last-child{border-bottom:none;}
.estado-opt:hover{background:var(--border2);color:var(--gold);}
.e-pendiente{background:#1e1e1e;color:#9a9a9a;}
.e-pedido{background:#0f1c2e;color:#60a5fa;}
.e-anticipo{background:#1f1200;color:#f59e0b;}
.e-pagado{background:#001a14;color:#34d399;}
.e-entregado{background:#0a1f0a;color:#86efac;}
.e-despachado{background:#1a0d2e;color:#c084fc;}
.e-atrasado{background:#1f0a0a;color:#f87171;}
.e-cancelado{background:#111111;color:#555555;}
.metrics-bar-seg{display:grid;grid-template-columns:repeat(7,1fr);gap:1px;background:var(--border);border-bottom:0.5px solid var(--border);flex-shrink:0;}
.metric-cell{flex:1;background:var(--dark);padding:9.3px 15.3px;}
.m-label{font-size:10.2px;letter-spacing:2px;color:#ffffff;margin-bottom:6px;}
.m-value{font-size:18.7px;color:var(--text-primary);font-family:'Jost',serif;}
.m-sub{font-size:11.0px;color:#ffffff;margin-top:3px;}
.fin-kpis{display:grid;grid-template-columns:repeat(4,1fr);gap:1px;background:var(--border);border-bottom:0.5px solid var(--border);flex-shrink:0;}
.fin-kpi-card{background:var(--dark);padding:10.1px 15.3px;}
.fin-kpi-label{font-size:8.5px;letter-spacing:2px;color:#ffffff;margin-bottom:7px;}
.fin-kpi-value{font-size:17px;color:var(--text-primary);font-family:'Jost',sans-serif;font-weight:500;}
.fin-kpi-sub{font-size:9.3px;color:#ffffff;margin-top:3px;}
/* ── Panorama por rubro (gráfica maestro/detalle) ── */
.fin-chart-legend{display:flex;gap:18px;padding:14px 18px 4px;}
.fin-chart-legend-item{display:flex;align-items:center;gap:7px;font-size:11px;color:var(--text-secondary);}
.fin-chart-legend-dot{width:9px;height:9px;border-radius:2px;flex-shrink:0;}
.fin-chart-body-shell{position:relative;}
.fin-chart-body{padding:2px 18px 14px;max-height:246px;overflow-y:auto;scrollbar-width:thin;scrollbar-color:var(--border) transparent;}
.fin-chart-body.expanded{max-height:none;}
.fin-chart-body::-webkit-scrollbar{width:7px;}
.fin-chart-body::-webkit-scrollbar-track{background:transparent;}
.fin-chart-body::-webkit-scrollbar-thumb{background:var(--border);border-radius:4px;}
.fin-chart-fade{position:absolute;left:0;right:8px;bottom:0;height:34px;pointer-events:none;background:linear-gradient(to bottom, transparent, var(--dark) 88%);transition:opacity .15s;}
.fin-chart-fade.hidden{opacity:0;}
.fin-chart-footer{display:flex;justify-content:space-between;align-items:center;padding:9px 18px;border-top:0.5px solid var(--border2);background:var(--dark3);}
.fin-chart-footer-hint{font-size:11px;color:var(--text-vdim);letter-spacing:.5px;}
.fin-chart-expand-btn{background:none;border:none;color:var(--gold);font-family:'Jost',sans-serif;font-size:10.5px;letter-spacing:1.5px;cursor:pointer;padding:0;text-decoration:underline;text-underline-offset:3px;}
.fin-bar-row{margin:0 -8px;padding:8px;border-radius:2px;cursor:pointer;border-left:2px solid transparent;transition:background .12s,border-color .12s;}
.fin-bar-row:hover{background:var(--dark3);}
.fin-bar-row.sel{background:var(--gold-dark);border-left-color:var(--gold);}
.fin-bar-label{display:flex;justify-content:space-between;font-size:12px;margin-bottom:5px;}
.fin-bar-label .name{color:var(--text-primary);}
.fin-bar-row.sel .fin-bar-label .name{color:var(--gold);font-weight:600;}
.fin-bar-label .total{color:var(--text-dim);}
.fin-bar-track{height:20px;display:flex;background:var(--border2);border-radius:1px;overflow:hidden;min-width:3px;}
.fin-seg{height:100%;transition:filter .12s;}
.fin-seg:hover{filter:brightness(1.2);}
.fin-seg+.fin-seg{margin-left:1px;}
.fin-detail-identity{padding:16px 18px 14px;}
.fin-detail-controls{display:flex;align-items:center;gap:26px;flex-wrap:wrap;padding:13px 18px;background:var(--dark2);border-top:0.5px solid var(--border2);border-bottom:0.5px solid var(--border2);}
.fin-ctrl{display:flex;align-items:center;gap:10px;}
.fin-ctrl-lbl{font-size:10px;letter-spacing:1.8px;color:var(--text-dim);white-space:nowrap;}
.fin-ctrl-divider{width:0.5px;align-self:stretch;background:var(--border2);}
.fin-ctrl-static-note{font-size:11px;color:var(--text-vdim);}
.fin-headline{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--border2);}
.fin-headline-tile{background:var(--dark);padding:14px 18px 16px;}
.fin-headline-label{font-size:9.5px;letter-spacing:2.2px;color:var(--text-dim);margin-bottom:8px;}
.fin-headline-value{font-size:22px;font-weight:600;font-family:'Jost',sans-serif;}
.fin-detail-groups{display:grid;grid-template-columns:1fr 1fr 1fr;gap:0;margin:18px 18px 20px;border:0.5px solid var(--border2);}
.fin-detail-group{padding:14px 18px;border-right:0.5px solid var(--border2);}
.fin-detail-group:last-child{border-right:none;}
.fin-detail-group .gt{font-size:10.5px;letter-spacing:2.2px;margin-bottom:11px;padding-bottom:8px;border-bottom:0.5px solid var(--border2);font-weight:500;}
.fin-detail-group .row{display:flex;justify-content:space-between;align-items:baseline;font-size:14px;padding:6.5px 0;color:var(--text-secondary);}
.fin-detail-group .row b{color:var(--text-primary);font-weight:600;}
.fin-detail-toggle{display:flex;align-items:center;gap:9px;background:transparent;border:0.5px solid var(--border);color:var(--text-secondary);padding:8px 16px;font-size:11px;letter-spacing:2px;cursor:pointer;font-family:'Jost',sans-serif;transition:all .15s;}
.fin-detail-toggle:hover{border-color:var(--gold);color:var(--gold);}
.fin-detail-toggle .chev{display:inline-block;transition:transform .2s;font-size:9px;}
.fin-detail-toggle.open .chev{transform:rotate(180deg);}
.fin-full-table td.sep-l, .fin-full-table th.sep-l{border-left:0.5px solid var(--border2);}
.progress-bar{height:3px;background:#1a1a1a;margin-top:6px;}
.progress-fill{height:100%;transition:width 0.3s;}
.pagos-panel{width:0;min-width:0;background:var(--dark2);border-left:0.5px solid var(--border);display:flex;flex-direction:column;overflow:hidden;transition:width 0.25s ease;flex-shrink:0;height:100%;max-height:100vh;}
.pagos-panel.open{width:min(780px,45vw);min-width:340px;overflow-y:auto;}
.pp-header{display:flex;align-items:center;justify-content:space-between;padding:11.6px 17px;border-bottom:0.5px solid var(--border);flex-shrink:0;}
.pp-title{font-size:10.2px;letter-spacing:2px;color:var(--text-primary);font-weight:600;}
.pp-item-info{padding:10.1px 17px;border-bottom:0.5px solid var(--border2);flex-shrink:0;background:var(--dark);}
.pp-item-name{font-size:11.0px;color:var(--text-primary);margin-bottom:8px;}
.pp-item-stats{display:flex;gap:16px;}
.pp-stat{display:flex;flex-direction:column;gap:3px;}
.pp-stat-label{font-size:7.6px;letter-spacing:2px;color:#555;}
.pp-stat-value{font-size:11.0px;color:#CCC;font-weight:500;}
.pp-stat-value.gold{color:var(--gold);}
.pp-stat-value.green{color:var(--green);}
.pp-stat-value.red{color:var(--red);}
.pp-historial{flex:1;overflow-y:auto;}
.pp-pago-item{padding:10.1px 17px;border-bottom:0.5px solid var(--border2);display:flex;align-items:center;justify-content:space-between;}
.pp-pago-left{display:flex;flex-direction:column;gap:4px;}
.pp-pago-fecha{font-size:10.2px;color:#888;}
.pp-pago-monto{font-size:11.9px;color:var(--text-primary);font-weight:500;}
.pp-empty{padding:21.7px 17px;text-align:center;color:#444;font-size:11.0px;}
.pp-form{border-top:0.5px solid var(--border);flex-shrink:0;background:var(--dark);}
.pp-form-toggle{width:100%;background:transparent;border:none;border-bottom:0.5px solid var(--border2);color:var(--gold);padding:8.7px 17px;font-size:8.5px;letter-spacing:2px;cursor:pointer;font-weight:700;font-family:'Jost',sans-serif;text-align:left;}
.pp-form-toggle:hover{background:rgba(196,160,80,0.06);}
.pp-form-body{display:none;padding:11.6px 17px;}
.pp-form-body.open{display:block;}
.pp-form-title{font-size:8.5px;letter-spacing:2px;color:#777;margin-bottom:12px;}
.pp-form-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-bottom:12px;}
.pp-form-group{display:flex;flex-direction:column;gap:5px;}
.pp-form-group.full{grid-column:1/-1;}
.pp-label{font-size:8.5px;letter-spacing:1.5px;color:#666;}
.pp-input{background:var(--dark3);border:0.5px solid var(--border);color:var(--text-primary);padding:5.8px 10.2px;font-size:11.0px;outline:none;font-family:'Jost',sans-serif;}
.pp-input:focus{border-color:var(--gold);}
.pp-select{background:var(--dark3);border:0.5px solid var(--border);color:#CCC;padding:5.8px 10.2px;font-size:11.0px;outline:none;cursor:pointer;font-family:'Jost',sans-serif;}
.pp-select:focus{border-color:var(--gold);}
.btn-pago{width:100%;background:var(--gold);color:var(--black);border:none;padding:8.5px;font-size:9.3px;letter-spacing:2px;cursor:pointer;font-weight:700;font-family:'Jost',sans-serif;}
.medio-badge{font-size:15.5px;padding:1.4px 6.8px;letter-spacing:1px;}
.mb-transfer{background:var(--blue-dark);color:var(--blue);border:0.5px solid #1a2a3a;}
.mb-efectivo{background:var(--green-dark);color:var(--green);border:0.5px solid var(--green-border);}
.mb-deposito{background:#1a1200;color:var(--amber);border:0.5px solid #2a2200;}
.mb-credito{background:#1a0a0a;color:var(--red);border:0.5px solid #2a1010;}
.mb-debito{background:#0d0a1a;color:#9B7DD4;border:0.5px solid #1a1230;}
.mb-cheque{background:#0a1510;color:#5BC4B8;border:0.5px solid #1a2a28;}
.pago-icon{font-size:11.9px;cursor:pointer;color:#555;padding:2.9px 6.8px;transition:color 0.15s;}
.pago-icon:hover{color:var(--gold);}
.pago-icon.has-pagos{color:var(--gold);}
.adicional-tag{font-size:7.6px;color:var(--gold);border:0.5px solid var(--gold);padding:0.7px 5.1px;margin-left:6px;vertical-align:middle;}
.ver-badge-static{background:var(--gold-dark);border:0.5px solid var(--gold);color:var(--gold);padding:4.3px 11.9px;font-size:9.3px;letter-spacing:2px;}
.params-row{display:flex;align-items:center;gap:20px;background:var(--dark);border-bottom:0.5px solid var(--border);padding:10.1px 25.5px;flex-shrink:0;}
.param-group{display:flex;align-items:center;gap:10px;}
.param-label{font-size:9.3px;letter-spacing:1.5px;color:var(--text-muted);}
.param-input{background:var(--dark2);border:0.5px solid var(--border);color:var(--text-primary);padding:4.3px 10.2px;font-size:11.0px;width:80px;outline:none;text-align:right;font-family:'Jost',sans-serif;}
.param-input:focus{border-color:var(--gold);}
.param-divider{width:0.5px;height:24px;background:var(--border);}
.config-nav{width:200px;min-width:200px;background:var(--dark3);border-right:0.5px solid var(--border);display:flex;flex-direction:column;padding:17px 0;}
.config-nav-item{display:flex;align-items:center;gap:10px;padding:8.7px 17px;font-size:11.0px;color:var(--text-muted);cursor:pointer;border-left:3px solid transparent;transition:all 0.15s;}
.config-nav-item:hover{color:var(--text-secondary);background:var(--dark);}
.config-nav-item.active{color:var(--gold);border-left:3px solid var(--gold);background:var(--dark);}
.config-content{flex:1;display:flex;flex-direction:column;overflow-y:auto;}
.section-title-lg{font-family:'Jost',sans-serif;font-size:18.7px;color:var(--text-primary);margin-bottom:4px;}
.section-desc{font-size:11.0px;color:var(--text-dim);margin-bottom:20px;}
.section-title{font-size:8.5px;letter-spacing:2.5px;color:var(--text-muted);margin-bottom:14px;font-weight:600;}
.comp-btn{background:var(--amber);color:var(--dark);border:0.5px solid var(--amber);padding:3.6px 13.6px;font-size:9.3px;letter-spacing:1.5px;cursor:pointer;font-family:'Jost',sans-serif;font-weight:600;transition:all 0.15s;}
.comp-btn.active{background:var(--dark);color:var(--gold);border-color:var(--gold);}
.comp-btn:hover:not(.active){background:var(--gold);color:var(--dark);}
.section-title.dash-kpi-title{font-size:17px;letter-spacing:2.5px;color:#ffffff;margin-bottom:20px;margin-top:10px;}
.user-card-row{display:flex;align-items:center;justify-content:space-between;padding:11.6px 17px;border-bottom:0.5px solid var(--border2);}
.user-card-row:last-child{border-bottom:none;}
.user-info{flex:1;margin-left:14px;}
.user-name-txt{font-size:11.9px;color:var(--text-primary);}
.user-email{font-size:10.2px;color:var(--text-dim);margin-top:2px;}
.role-badge{font-size:8.5px;letter-spacing:1.5px;padding:2.1px 8.5px;}
.role-admin{background:var(--gold-dark);color:var(--gold);border:0.5px solid var(--gold);}
.role-ventas{background:#111;color:#888;border:0.5px solid var(--border);}
.logo-upload{border:1px dashed var(--border);padding:23.8px;text-align:center;cursor:pointer;transition:border-color 0.15s;}
.logo-upload:hover{border-color:var(--gold);}
.cat-toolbar{display:flex;align-items:center;justify-content:space-between;margin-bottom:14px;}
.cat-search{background:var(--dark2);border:0.5px solid var(--border);color:var(--text-primary);padding:5.8px 11.9px;font-size:11.0px;outline:none;width:220px;font-family:'Jost',sans-serif;}
.cat-search::placeholder{color:var(--text-vdim);}
.cat-search:focus{border-color:var(--gold);}
/* DASHBOARD GERENCIAL */
.kpis-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:1px;background:var(--border);}
.kpi{background:var(--dark);padding:13.0px 17px;}
.kpi-label{font-size:10.2px;letter-spacing:2px;color:#ffffff;margin-bottom:8px;}
.kpi-value{font-family:'Jost',serif;font-size:18.7px;color:var(--text-primary);}
.kpi-value.gold{color:var(--gold);}
.kpi-value.green{color:var(--green);}
.kpi-value.amber{color:var(--amber);}
.kpi-sub{font-size:11.0px;color:var(--amber);margin-top:4px;}
.kpi-bar{height:2px;background:#1a1a1a;margin-top:8px;}
.kpi-bar-fill{height:100%;background:var(--gold);transition:width 0.5s;}
.toast{position:fixed;bottom:28px;right:28px;padding:8.7px 17px;font-size:10.2px;letter-spacing:1px;color:#fff;z-index:9999;border-radius:2px;box-shadow:0 4px 20px rgba(0,0,0,0.5);animation:toastIn 0.3s ease;pointer-events:none;}
@keyframes toastIn{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}
.filters-section{background:var(--dark);border:0.5px solid var(--border);padding:11.6px 17px;}
.filters-title{font-size:17px;letter-spacing:3px;color:#ffffff;margin-bottom:16px;}
.filters-row{display:flex;align-items:center;gap:10px;flex-wrap:wrap;}
.filter-group{display:flex;flex-direction:column;gap:5px;}
.filter-lbl{font-size:9.3px;letter-spacing:2px;color:#ffffff;}
.f-select{background:var(--dark2);border:0.5px solid var(--border);color:#CCC;padding:6.5px 11.9px;font-size:11.9px;outline:none;cursor:pointer;min-width:120px;font-family:'Jost',sans-serif;}
.f-select:focus{border-color:var(--gold);}
.btn-reset{background:transparent;border:0.5px solid var(--amber);color:var(--amber);padding:6.5px 13.6px;font-size:11.0px;cursor:pointer;letter-spacing:1px;transition:all 0.15s;font-family:'Jost',sans-serif;}
.btn-reset:hover{background:var(--amber);color:var(--dark);}
.bar-chart-d{display:flex;flex-direction:column;gap:10px;}
.bar-row-d{display:flex;align-items:center;gap:8px;}
.bar-label-d{font-size:11.0px;color:#ffffff;width:160px;flex-shrink:0;text-align:right;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.bar-track-d{flex:1;height:26px;background:#1a1a1a;position:relative;}
.bar-presup-d{height:100%;background:var(--gold);opacity:0.4;position:absolute;top:0;left:0;}
.bar-gasto-d{height:60%;position:absolute;top:20%;left:0;}
.bar-val-d{font-size:11.0px;color:#ffffff;width:80px;flex-shrink:0;text-align:right;}
.trend-wrap{position:relative;height:234px;}
.canal-list{display:flex;flex-direction:column;gap:12px;}
.canal-row{display:flex;align-items:center;gap:10px;}
.canal-name{font-size:11.9px;color:#ffffff;width:120px;flex-shrink:0;}
.canal-track{flex:1;height:10px;background:#1a1a1a;}
.canal-fill{height:100%;}
.canal-val{font-size:11.9px;color:#ffffff;width:72px;text-align:right;flex-shrink:0;}
.canal-pct{font-size:11.0px;color:#ffffff;width:40px;text-align:right;flex-shrink:0;}
.top-client{display:flex;align-items:center;justify-content:space-between;padding:10.2px 0;border-bottom:0.5px solid var(--border2);}
.top-client:last-child{border-bottom:none;}
.tc-rank{font-size:11.0px;color:#888;width:20px;}
.tc-name{font-size:12.8px;color:#ffffff;flex:1;margin-left:8px;}
.tc-proyectos{font-size:11.0px;color:#888;margin-right:10px;}
.tc-monto{font-size:12.8px;color:var(--gold);font-weight:500;}
.tc-recompra{font-size:7.6px;color:var(--green);border:0.5px solid var(--green-border);background:var(--green-dark);padding:1.4px 5.1px;margin-left:6px;letter-spacing:1px;}
.sb-cerrado{background:var(--green-dark);color:var(--green);border:0.5px solid var(--green-border);font-size:8.5px;padding:1.4px 6.8px;letter-spacing:1px;}
.sb-abierto{background:var(--gold-dark);color:var(--gold);border:0.5px solid var(--gold-border);font-size:8.5px;padding:1.4px 6.8px;letter-spacing:1px;}
.table-filters{display:flex;align-items:center;gap:10px;padding:10.2px 0;margin-bottom:4px;border-bottom:0.5px solid var(--border);flex-wrap:wrap;}
.tf-select{background:var(--dark2);border:0.5px solid var(--border);color:#CCC;padding:5.8px 10.2px;font-size:11.0px;outline:none;cursor:pointer;font-family:'Jost',sans-serif;}
.tf-label{font-size:9.3px;letter-spacing:2px;color:#ffffff;margin-right:-4px;}
.table-stats{font-size:11.0px;color:#888;margin-left:auto;}
.table-stats span{color:var(--gold);font-weight:600;}
.td-pos{text-align:right;color:var(--green);font-weight:600;}
.td-neg{text-align:right;color:var(--red);font-weight:600;}
.pct-good{color:var(--green);text-align:right;font-weight:600;}
.pct-warn{color:var(--amber);text-align:right;font-weight:600;}
.pct-bad{color:var(--red);text-align:right;font-weight:600;}

/* ── RESPONSIVE — 1280px a 2560px ── */

/* Pantallas grandes (>1800px): más espacio, sidebar más ancho */
@media (min-width: 1800px) {
  .sidebar { width: 200px; min-width: 200px; }
  .nav-item { font-size: 14px; padding: 13px 24px; }
  .scroll-area { padding: 30px 40px; }
  .topbar { padding: 16px 40px; }
  .filters-bar { padding: 14px 40px; }
  .metrics-grid { grid-template-columns: repeat(4, minmax(0,1fr)); gap: 16px; }
  .kpis-grid { grid-template-columns: repeat(4, minmax(0,1fr)); }
  body { font-size: 15px; }
}

/* Pantallas medianas (1280px - 1599px): compactar sidebar y padding */
@media (max-width: 1599px) {
  .sidebar { width: 160px; min-width: 160px; }
  .sidebar-logo { padding: 20px 16px 16px; }
  .logo-text { font-size: 18px; letter-spacing: 5px; }
  .nav-item { padding: 10px 16px; font-size: 12px; gap: 8px; }
  .nav-section { padding: 10px 16px 4px; }
  .sidebar-bottom { padding: 14px 16px; }
  .scroll-area { padding: 18px 20px; gap: 14px; }
  .topbar { padding: 12px 20px; }
  .ctx-bar { padding: 7px 20px; }
  .filters-bar { padding: 10px 20px; }
  .info-bar { padding: 12px 20px; }
  .params-row { padding: 12px 20px; gap: 12px; }
  body { font-size: 13px; }
  th { padding: 10px 12px; font-size: 9px; }
  td { padding: 10px 12px; }
  .btn-gold { padding: 8px 16px; font-size: 10px; }
  .btn-outline { padding: 8px 16px; font-size: 10px; }
  .metrics-grid { grid-template-columns: repeat(4, minmax(0,1fr)); gap: 10px; }
  .metric { padding: 16px; }
  .metric-value { font-size: 22px; }
  .kpis-grid { grid-template-columns: repeat(4, minmax(0,1fr)); }
  .kpi { padding: 14px 16px; }
  .kpi-value { font-size: 18px; }
  .search-input { width: 200px; font-size: 12px; }
  .filter-select { font-size: 12px; padding: 8px 10px; }
  .clients-grid { grid-template-columns: repeat(3, minmax(0,1fr)); gap: 10px; }
  .add-panel.open { width: 420px; min-width: 420px; }
  .pagos-panel.open { width: min(680px, 42vw); }
  .config-nav { width: 180px; min-width: 180px; }
  .tab { padding: 11px 20px; font-size: 10px; }
  .form-input { padding: 8px 12px; font-size: 13px; }
  .form-select { padding: 8px 12px; font-size: 13px; }
}

/* Pantallas pequeñas (1280px - 1399px): máxima compactación */
@media (max-width: 1399px) {
  .sidebar { width: 150px; min-width: 150px; }
  .logo-text { font-size: 16px; letter-spacing: 4px; }
  .logo-sub { font-size: 8px; letter-spacing: 3px; }
  .nav-item { padding: 9px 14px; font-size: 11px; }
  .scroll-area { padding: 14px 16px; gap: 12px; }
  .topbar { padding: 10px 16px; }
  .ctx-bar { padding: 6px 16px; }
  .filters-bar { padding: 8px 16px; gap: 8px; }
  .metrics-grid { grid-template-columns: repeat(2, minmax(0,1fr)); gap: 8px; }
  .metric { padding: 14px; }
  .metric-value { font-size: 20px; }
  .metric-label { font-size: 9px; }
  .kpis-grid { grid-template-columns: repeat(4, minmax(0,1fr)); }
  .kpi { padding: 12px 14px; }
  .kpi-value { font-size: 16px; }
  .kpi-label { font-size: 9px; }
  .ctx-btn { padding: 3px 8px; font-size: 9px; }
  .btn-gold { padding: 7px 14px; font-size: 10px; letter-spacing: 1.5px; }
  .btn-outline { padding: 7px 14px; font-size: 10px; }
  .btn-sm { padding: 5px 10px; font-size: 10px; }
  th { padding: 9px 10px; font-size: 9px; letter-spacing: 1.5px; }
  td { padding: 9px 10px; font-size: 13px; }
  .search-input { width: 180px; padding: 7px 12px; font-size: 12px; }
  .filter-select { padding: 7px 8px; font-size: 11px; }
  .tab { padding: 10px 16px; font-size: 10px; letter-spacing: 1.5px; }
  .panel-title-txt { font-size: 10px; }
  .add-panel.open { width: 360px; min-width: 360px; }
  .pagos-panel.open { width: min(580px, 40vw); }
  .clients-grid { grid-template-columns: repeat(2, minmax(0,1fr)); gap: 10px; }
  .config-nav { width: 160px; min-width: 160px; }
  .two-col { grid-template-columns: 1.4fr 1fr; gap: 12px; }
  .form-grid { gap: 12px; }
  .form-input { padding: 7px 10px; font-size: 12px; }
  .form-select { padding: 7px 10px; font-size: 12px; }
  .params-row { padding: 10px 16px; gap: 10px; flex-wrap: wrap; }
  .param-input { width: 70px; font-size: 12px; padding: 5px 8px; }
  .metric-cell { padding: 10px 14px; }
  .m-value { font-size: 15px; }
  .m-label { font-size: 9px; }
}

/* Tablas con scroll horizontal en pantallas pequeñas */
@media (max-width: 1599px) {
  .table-wrap { overflow-x: auto; }
  .cot-content { padding: 14px 20px; }
}
@media print {
  body { background: #0a0a0c !important; -webkit-print-color-adjust: exact !important; print-color-adjust: exact !important; }
  .sidebar, .topbar, .filters-section, .ctx-bar, #login-screen, .no-print { display: none !important; }
  .app { display: block !important; }
  .main { display: block !important; width: 100% !important; }
  .page { display: block !important; height: auto !important; overflow: visible !important; }
  .scroll-area { overflow: visible !important; height: auto !important; padding: 0 !important; }
  .panel { break-inside: avoid; margin-bottom: 16px; }
  .two-col { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; break-inside: avoid; }
  .kpis-grid { grid-template-columns: repeat(4, 1fr) !important; }
  .kpi { break-inside: avoid; }
  table { width: 100%; border-collapse: collapse; font-size: 10px; }
  th, td { padding: 5px 8px !important; font-size: 10px !important; }
  .pdf-print-header { display: flex !important; }
  .pdf-hide { display: none !important; }
}