/* Nombrent Inventario · superficies bosque y navegación oscura. */
:root{color-scheme:dark;--lienzo:#071411;--sup:#0d1f1a;--sup-2:#142b21;--borde:#284535;--borde-fuerte:#355542;--tinta:#eef8f2;--tinta-media:#c6d8ce;--tinta-baja:#aac0b2;--lima:#dffb71;--rojo:#ff7a6b;--ambar:#f5c451;--verde:#7ee2a8}
body{background:var(--lienzo);-webkit-font-smoothing:antialiased}
.glow{background:var(--lienzo)}
button,input,select{transition:background-color .15s,border-color .15s,box-shadow .15s}
button:not(:disabled):active{transform:scale(.98)}
.btn{border-radius:11px;background:#143a25;color:#e5ff98;min-height:42px}
.btn.sec{background:#0d1f1a;color:#c6d8ce;border-color:#355542}
.btn.chico{min-height:34px}
.tarjeta,.item,.cuadro{background:#0d1f1a;border-color:#284535;box-shadow:0 2px 8px #153d2004}
.tarjeta{padding:24px;border-radius:18px}.item{padding:20px;border-radius:16px}
.item.bajo{border-color:#756331}.stock.bajo b{color:#f5c451}
.item .nombre{font-size:17px;letter-spacing:-.02em}.item .meta{margin-top:4px;line-height:1.6}
.item .abajo{padding-top:14px;margin-top:14px;border-top:1px solid #284535}
.stock b,.cuadro b,.venta-total b{font-variant-numeric:tabular-nums;color:#eef8f2}
.chip{background:#0d1f1a;color:#aac0b2;border-color:#355542;border-radius:10px;min-height:42px}
.chip[aria-pressed=true],.chips .chip[aria-pressed=true]{background:#203b29;color:#dffb71;border-color:#456a3a}
.barra{background:#071411f0;border-bottom-color:#284535;backdrop-filter:blur(16px);padding:16px 24px}
.barra b{letter-spacing:-.02em}.barra .tasa{color:#aac0b2}
.login{padding:36px;box-shadow:0 24px 70px #14332112;max-width:440px}
.login h1{font-size:30px;letter-spacing:-.04em}.n{background:#143a25;color:#dffb71;border:0}
.usuarios button{background:#142b21;border-color:#284535}.usuarios button:hover{border-color:#dffb71}
input,select{background:#0d1f1a;min-height:44px;border-color:#355542}
input:focus,select:focus{outline:2px solid #dffb71;outline-offset:2px}
.herramientas{gap:12px;margin-bottom:22px}.herramientas input{min-height:48px}
h2{font-size:30px;font-weight:650;letter-spacing:-.04em}h3{letter-spacing:-.02em}
.page-heading{margin-bottom:24px;display:flex;align-items:center;gap:12px;justify-content:space-between}.page-heading h2{margin:0 0 4px}.page-heading p{margin:0;color:#aac0b2;font-size:14px}
.page-heading .n{width:44px;height:44px;font-size:22px}
.cuadro{padding:22px}.cuadro b{font-size:30px;letter-spacing:-.04em;margin-top:8px}
.tabs{background:#071411;color:#b4cbbd;border-color:#244137}
.tabs button{color:#b4cbbd;min-height:52px}.tabs button[aria-current=page]{color:#dffb71}
.carrito-barra{background:#143a25;color:#dffb71;box-shadow:0 8px 30px #183d2520;border-radius:14px}
.fab{background:#143a25;color:#dffb71;border-radius:14px;box-shadow:0 8px 30px #183d2520}
dialog{background:#0d1f1a;border-color:#355542;padding:28px;box-shadow:0 28px 90px #07141130}
dialog::backdrop{background:#07141180;backdrop-filter:blur(3px)}
.linea{background:#142b21}.cant button{background:#0d1f1a}
.red{background:#332b16;color:#f5c451;border-color:#756331}
.red.error{background:#321c1a;color:#ff9b8d;border-color:#75443c}
.aviso-todas{background:#332b16;color:#f5c451;border-color:#756331}
.registro .tipo.venta{color:#dffb71}.registro .tipo.entrada{color:#7ee2a8}
.registro .tipo.traslado{color:#9fdcff}
:focus-visible{outline:3px solid #dffb71;outline-offset:3px}
.tabs button:focus-visible{outline-color:#dffb71;outline-offset:-4px}
@media(min-width:900px){
 #app:not([hidden]){display:grid;grid-template-columns:220px minmax(0,1fr);grid-template-rows:auto auto 1fr}
 #app>.barra{grid-column:2;grid-row:1}
 #app>.red{grid-column:2;grid-row:2;position:static}
 #app>.tabs{grid-column:1;grid-row:1/4;position:sticky;top:0;align-self:start;height:100vh;display:flex;flex-direction:column;justify-content:flex-start;gap:6px;padding:34px 16px;border:0;border-right:1px solid #244137}
 #app>.tabs::before{content:'nombrent';display:block;color:#dffb71;font-size:28px;font-weight:650;letter-spacing:-.055em;margin:0 12px 36px}
 #app>.tabs::after{content:'Inventario · tu negocio en orden';color:#88a494;font-size:12px;margin:auto 12px 12px;line-height:1.6}
 #app>.tabs button{width:100%;text-align:left;padding:13px 16px;flex:none;border-radius:10px;font-size:14px;font-weight:500}
 #app>.tabs button[aria-current=page]{background:#203b29;color:#dffb71;box-shadow:inset 3px 0 #dffb71}
 #app>.tabs button:not([aria-current=page]):hover{background:#152d21;color:#eef8f2}
 #app>main{grid-column:2;grid-row:3;max-width:1400px;padding:32px 36px 120px;margin:0 auto}
 #lista{grid-template-columns:repeat(auto-fill,minmax(290px,1fr));gap:18px}
 .carrito-barra{left:252px;right:32px;max-width:700px}
 #d-venta{margin-right:24px;width:min(440px,calc(100vw - 48px));height:calc(100vh - 48px);max-height:calc(100vh - 48px);border-radius:20px}
 #d-venta .venta-items{max-height:calc(100vh - 290px)}
}
@media(max-width:600px){.barra{padding:12px 16px}.herramientas{flex-wrap:wrap}.herramientas input{flex:1 0 100%}.item{padding:16px}.login{padding:26px}.tarjeta{padding:20px}.page-heading h2{font-size:28px}dialog{padding:22px}.acciones{flex-wrap:wrap}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{transition:none!important;animation:none!important}}

/* La lista y la venta tienen prioridad sobre la decoración. */
.page-heading{margin-bottom:14px}.page-heading h2{font-size:25px}.page-heading p{font-size:12px}
.herramientas{gap:8px;margin-bottom:14px}.item{padding:14px;border-radius:12px}.item .nombre{font-size:15px}.item .abajo{padding-top:10px;margin-top:10px}.item .meta{font-size:11px;line-height:1.4}.item .acciones .btn{min-height:40px;padding:8px 12px}
.estado-carga{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:12px;padding:12px;border:1px solid #756331;border-radius:10px;background:#332b16;color:#f5c451;font-size:12px}
@media(min-width:900px){#app>main{padding:22px 24px 120px;width:100%}#lista{gap:12px;grid-template-columns:repeat(auto-fill,minmax(260px,1fr))}}
@media(max-width:600px){.barra{padding:9px 12px}.page-heading h2{font-size:24px}.item{padding:13px}.herramientas input{min-height:42px}.herramientas .chip{min-height:38px}.estado-carga{flex-wrap:wrap}}
