/* INVENTARIO */

#pantallaInventario{
 color:#111827;
}

#pantallaInventario .caja{
 background:#fff !important;
 border:1px solid #edf1f7;
 border-radius:8px;
 box-shadow:0 10px 28px rgba(15,23,42,.08);
 padding:20px;
}

.inventario-top{
 display:grid;
 grid-template-columns:minmax(260px,360px) 150px 150px 1fr;
 gap:12px;
 align-items:center;
 margin-bottom:18px;
}

.buscador-con-limpiar{
 display:grid;
 grid-template-columns:1fr 38px;
 align-items:center;
 gap:8px;
}

.buscador-con-limpiar input{
 min-width:0;
}

.buscador-con-limpiar button{
 margin:0;
 width:38px;
 height:38px;
 border-radius:8px;
 padding:0;
 background:#f1f5f9;
 color:#334155;
 border:1px solid #d0d5dd;
 font-weight:900;
}

.pos-toolbar .pos-buscador{
 flex:1;
}

.inventario-top .buscador-con-limpiar{
 grid-column:1;
}

.inventario-top::after{
 content:"";
}

#buscarInventario{
 grid-column:1;
 width:100%;
 background:#fff;
 color:#111827;
 border:1px solid #d0d5dd;
 border-radius:8px;
 padding:12px 14px;
 font-size:14px;
}

.btn-agregar{
 grid-column:4;
 justify-self:end;
 width:min(100%,260px);
 margin:0;
 border-radius:8px;
 background:#be2f5f;
 padding:13px 18px;
}

/* CATEGORIAS - resumen de estadisticas */

#pantallaCategoriasInventario{
 padding:18px 24px;
}

.categorias-resumen{
 display:grid;
 grid-template-columns:repeat(4,minmax(180px,1fr));
 gap:14px;
 max-width:1220px;
 margin:0 auto 16px;
}

.categorias-resumen article{
 display:flex;
 align-items:center;
 gap:12px;
 padding:16px;
 background:#fff;
 border:1px solid #edf1f7;
 border-radius:14px;
 box-shadow:0 10px 28px rgba(15,23,42,.06);
}

.categorias-resumen article > span{
 width:42px;
 height:42px;
 min-width:42px;
 display:grid;
 place-items:center;
 border-radius:12px;
}

.categorias-resumen article > span .ui-icon{
 width:20px;
 height:20px;
}

.categoria-resumen-blue > span{ background:#e7f0ff; color:#0d6efd; }
.categoria-resumen-green > span{ background:#e7f9ef; color:#16a34a; }
.categoria-resumen-orange > span{ background:#fff4e5; color:#f59e0b; }
.categoria-resumen-red > span{ background:#fdecec; color:#ef4444; }

.categorias-resumen small{
 display:block;
 color:#667085;
 font-size:12.5px;
 font-weight:700;
}

.categorias-resumen strong{
 display:block;
 margin-top:2px;
 color:#101828;
 font-size:20px;
 font-weight:900;
}

.categorias-resumen em{
 display:block;
 margin-top:2px;
 color:#12b76a;
 font-size:12px;
 font-style:normal;
 font-weight:700;
}

.categoria-resumen-alerta{
 color:#d92d20 !important;
}

body.oscuro .categorias-resumen article{
 background:#111827;
 border-color:#243044;
}

body.oscuro .categorias-resumen strong{
 color:#f8fafc;
}

/* CATEGORIAS - panel de dos columnas */

.categorias-shell{
 display:grid;
 grid-template-columns:minmax(260px,320px) 1fr;
 gap:16px;
 max-width:1220px;
 margin:0 auto;
 align-items:start;
}

.categorias-lista-panel{
 display:grid;
 gap:12px;
 background:#fff;
 border:1px solid #edf1f7;
 border-radius:14px;
 padding:16px;
 box-shadow:0 10px 28px rgba(15,23,42,.06);
}

.categorias-buscador{
 grid-template-columns:1fr;
}

.categorias-buscador input{
 min-height:40px;
 padding:0 12px;
 border:1px solid #e4e7ec;
 border-radius:8px;
 background:#f8fafc;
 font-size:13px;
}

.categorias-lista{
 display:grid;
 gap:8px;
 max-height:min(560px,60vh);
 overflow-y:auto;
}

.categoria-card{
 display:flex;
 align-items:center;
 gap:12px;
 width:100%;
 margin:0;
 padding:10px 12px;
 border:1px solid #edf1f7;
 border-radius:12px;
 background:#fff !important;
 color:#101828 !important;
 text-align:left;
 cursor:pointer;
}

.categoria-card-icono{
 width:38px;
 height:38px;
 min-width:38px;
 display:grid;
 place-items:center;
 border-radius:10px;
 background:color-mix(in srgb, var(--categoria-color,#0d6efd) 14%, white);
 color:var(--categoria-color,#0d6efd);
}

.categoria-card-icono .ui-icon{
 width:18px;
 height:18px;
}

.categoria-card-texto{
 display:grid;
 min-width:0;
}

.categoria-card-texto strong{
 overflow:hidden;
 text-overflow:ellipsis;
 white-space:nowrap;
 color:#101828;
 font-size:14px;
}

.categoria-card-texto small{
 color:#667085;
 font-size:12px;
}

.categoria-card.activa{
 border-color:var(--categoria-color,#0d6efd);
 background:color-mix(in srgb, var(--categoria-color,#0d6efd) 8%, white) !important;
}

.categorias-btn-nueva{
 grid-column:auto;
 justify-self:stretch;
 width:100%;
}

body.oscuro .categorias-lista-panel,
body.oscuro .categoria-card{
 background:#111827;
 border-color:#243044;
}

body.oscuro .categoria-card-texto strong{
 color:#f8fafc;
}

/* CATEGORIAS - panel de detalle */

.categoria-detalle-panel{
 display:grid;
 gap:14px;
 align-content:start;
 background:#fff;
 border:1px solid #edf1f7;
 border-radius:14px;
 padding:20px;
 box-shadow:0 10px 28px rgba(15,23,42,.06);
 min-height:420px;
}

.categoria-detalle-header{
 display:flex;
 align-items:center;
 gap:14px;
 padding-bottom:14px;
 border-bottom:1px solid #eef2f7;
}

.categoria-detalle-icono{
 width:52px;
 height:52px;
 min-width:52px;
 display:grid;
 place-items:center;
 border-radius:14px;
 background:color-mix(in srgb, var(--categoria-color,#0d6efd) 14%, white);
 color:var(--categoria-color,#0d6efd);
}

.categoria-detalle-icono .ui-icon{
 width:26px;
 height:26px;
}

.categoria-detalle-titulo{
 flex:1;
 min-width:0;
}

.categoria-detalle-nombre{
 display:flex;
 align-items:center;
 gap:10px;
}

.categoria-detalle-nombre h3{
 margin:0;
 font-size:20px;
 color:#101828;
}

.categoria-detalle-titulo small{
 display:block;
 margin-top:2px;
 color:#667085;
 font-size:13px;
}

.categoria-badge{
 padding:3px 10px;
 border-radius:999px;
 font-size:12px;
 font-weight:700;
}

.categoria-badge.activa{
 background:#ecfdf3;
 color:#027a48;
}

.categoria-badge.vacia{
 background:#f2f4f7;
 color:#667085;
}

.categoria-detalle-acciones{
 display:flex;
 gap:10px;
}

.categoria-detalle-acciones button{
 display:flex;
 align-items:center;
 gap:7px;
 width:auto;
 min-height:40px;
 margin:0;
 padding:0 16px;
 border-radius:10px;
 font-weight:800;
 font-size:13px;
 border:1px solid rgba(255,255,255,.38);
 backdrop-filter:blur(14px) saturate(1.3);
 -webkit-backdrop-filter:blur(14px) saturate(1.3);
 box-shadow:inset 0 1px 0 rgba(255,255,255,.35);
}

.categoria-detalle-acciones .ui-icon{
 width:16px;
 height:16px;
}

.btn-categoria-editar{
 background:linear-gradient(135deg, color-mix(in srgb, #667085 85%, white 15%), color-mix(in srgb, #667085 65%, #101828 35%)) !important;
 color:#fff !important;
}

.btn-categoria-eliminar{
 background:linear-gradient(135deg, color-mix(in srgb, #ef4444 88%, white 12%), color-mix(in srgb, #ef4444 65%, #450a0a 35%)) !important;
 color:#fff !important;
}

.categoria-tabs{
 display:flex;
 gap:8px;
 border-bottom:1px solid #eef2f7;
 padding-bottom:2px;
}

.categoria-tabs button{
 width:auto;
 margin:0;
 padding:9px 14px;
 border:0;
 border-radius:10px 10px 0 0;
 background:transparent !important;
 color:#667085 !important;
 font-weight:700;
 font-size:13px;
}

.categoria-tabs button.activo{
 background:linear-gradient(135deg, color-mix(in srgb, #0d6efd 90%, white 10%), color-mix(in srgb, #0d6efd 68%, #020617 32%)) !important;
 backdrop-filter:blur(14px) saturate(1.3);
 -webkit-backdrop-filter:blur(14px) saturate(1.3);
 color:#fff !important;
 box-shadow:inset 0 1px 0 rgba(255,255,255,.35);
}

.categoria-tab-cuerpo{
 display:grid;
 gap:14px;
}

.categoria-productos-toolbar{
 display:flex;
 align-items:end;
 gap:12px;
}

.categoria-productos-toolbar .buscador-con-limpiar{
 flex:1;
 grid-template-columns:1fr;
}

.categoria-productos-toolbar input{
 min-height:40px;
 padding:0 12px;
 border:1px solid #e4e7ec;
 border-radius:8px;
 background:#f8fafc;
 font-size:13px;
}

.categoria-productos-toolbar .inventario-filtro-campo select{
 min-height:40px;
}

.categoria-info-grid,
.categoria-stats-grid{
 display:grid;
 grid-template-columns:repeat(2,minmax(0,1fr));
 gap:12px;
}

.categoria-info-grid div,
.categoria-stats-grid div{
 padding:14px;
 border:1px solid #edf1f7;
 border-radius:12px;
 background:#f9fafb;
}

.categoria-info-grid span,
.categoria-stats-grid span{
 display:block;
 color:#667085;
 font-size:12.5px;
 font-weight:700;
}

.categoria-info-grid strong,
.categoria-stats-grid strong{
 display:block;
 margin-top:4px;
 color:#101828;
 font-size:18px;
}

.categoria-info-color{
 display:flex !important;
 align-items:center;
 gap:8px;
}

.categoria-info-color i{
 width:16px;
 height:16px;
 border-radius:4px;
 display:inline-block;
}

.categoria-producto-vacio{
 padding:24px;
 text-align:center;
 color:#667085;
}

body.oscuro .categoria-detalle-panel{
 background:#111827;
 border-color:#243044;
}

body.oscuro .categoria-detalle-nombre h3{
 color:#f8fafc;
}

body.oscuro .categoria-info-grid div,
body.oscuro .categoria-stats-grid div{
 background:#1f2937;
 border-color:#243044;
}

body.oscuro .categoria-info-grid strong,
body.oscuro .categoria-stats-grid strong{
 color:#f8fafc;
}

@media (max-width:980px){
 .categorias-shell{
 grid-template-columns:1fr;
 }
}

.tabla-inventario{
 width:100%;
 border-collapse:collapse;
 color:#111827 !important;
 background:#fff;
 font-size:14px;
}

.tabla-inventario th{
 color:#475467 !important;
 font-size:13px;
 font-weight:700;
 padding:14px 12px;
 border-bottom:1px solid #e5e7eb !important;
}

.tabla-inventario td{
 color:#344054 !important;
 padding:18px 12px;
 border-bottom:1px solid #eef2f7 !important;
 vertical-align:middle;
}

.tabla-inventario tr:hover{
 background:#f8fafc;
}

.estado-inventario{
 display:inline-flex;
 align-items:center;
 gap:7px;
 padding:4px 10px;
 border-radius:999px;
 font-weight:700;
 font-size:12px;
}

.estado-inventario::before{
 content:"";
 width:8px;
 height:8px;
 border-radius:50%;
 display:inline-block;
}

.estado-inventario.ok{
 color:#027a48;
 background:#ecfdf3;
}

.estado-inventario.ok::before{
 background:#12b76a;
}

.estado-inventario.bajo{
 color:#b54708;
 background:#fffaeb;
}

.estado-inventario.bajo::before{
 background:#f79009;
}

.estado-inventario.sin-stock{
 color:#b42318;
 background:#fef3f2;
}

.estado-inventario.sin-stock::before{
 background:#f04438;
}

.acciones-inventario{
 display:flex;
 gap:8px;
}

body.oscuro #pantallaInventario .caja,
body.oscuro .tabla-inventario{
 background:#111827 !important;
 border-color:#243044;
}

body.oscuro .tabla-inventario th,
body.oscuro .tabla-inventario td{
 color:#f8fafc !important;
 border-color:#243044 !important;
}

body.oscuro #buscarInventario{
 background:#1f2937 !important;
 color:#f8fafc !important;
 border-color:#374151 !important;
}

/* INVENTARIO - resumen de estadisticas */

.inventario-resumen{
 display:grid;
 grid-template-columns:repeat(4,minmax(180px,1fr));
 gap:14px;
 max-width:1120px;
 margin:0 auto 16px;
}

.inventario-resumen article{
 display:flex;
 align-items:center;
 gap:12px;
 padding:16px;
 background:#fff;
 border:1px solid #edf1f7;
 border-radius:14px;
 box-shadow:0 10px 28px rgba(15,23,42,.06);
}

.inventario-resumen article > span{
 width:42px;
 height:42px;
 min-width:42px;
 display:grid;
 place-items:center;
 border-radius:12px;
}

.inventario-resumen article > span .ui-icon{
 width:20px;
 height:20px;
}

.inventario-resumen-blue > span{
 background:#e7f0ff;
 color:#0d6efd;
}

.inventario-resumen-teal > span{
 background:#e3f8f6;
 color:#0891b2;
}

.inventario-resumen-orange > span{
 background:#fff4e5;
 color:#f59e0b;
}

.inventario-resumen-red > span{
 background:#fdecec;
 color:#ef4444;
}

.inventario-resumen small{
 display:block;
 color:#667085;
 font-size:12.5px;
 font-weight:700;
}

.inventario-resumen strong{
 display:block;
 margin-top:2px;
 color:#101828;
 font-size:20px;
 font-weight:900;
}

.inventario-resumen em{
 display:block;
 margin-top:2px;
 color:#12b76a;
 font-size:12px;
 font-style:normal;
 font-weight:700;
}

.inventario-resumen-alerta{
 color:#d92d20 !important;
}

body.oscuro .inventario-resumen article{
 background:#111827;
 border-color:#243044;
}

body.oscuro .inventario-resumen strong{
 color:#f8fafc;
}

/* INVENTARIO - PULIDO FINAL */

#pantallaInventario{
 padding:18px 24px;
}

#pantallaInventario .caja{
 max-width:1120px;
 margin:0 auto;
 overflow:hidden;
}

#pantallaInventario .inventario-top{
 display:flex;
 flex-wrap:wrap;
 align-items:end;
 padding-bottom:14px;
 border-bottom:1px solid #eef2f7;
}

#pantallaInventario .buscador-con-limpiar{
 flex:1 1 220px;
 min-width:200px;
}

#pantallaInventario .inventario-filtro-campo{
 flex:0 0 auto;
}

.btn-imprimir-codigos{
 grid-column:auto;
 align-self:end;
 width:auto;
 min-height:38px;
 padding:0 12px;
 white-space:nowrap;
 border:1px solid #e4e7ec;
 border-radius:8px;
 background:#fff;
 color:#344054;
 font-size:13px;
 font-weight:800;
}

body.oscuro .btn-imprimir-codigos{
 background:#111827;
 border-color:#243044;
 color:#f8fafc;
}

#pantallaInventario .inventario-top::after{
 display:none;
}

#pantallaInventario #buscarInventario{
 grid-column:1;
 min-height:38px;
 background:#f8fafc !important;
 border-color:#e4e7ec !important;
 box-shadow:inset 0 1px 0 rgba(255,255,255,.6);
}

.inventario-filtro-campo{
 display:grid;
 gap:4px;
}

.inventario-filtro-campo span{
 color:#667085;
 font-size:12px;
 font-weight:700;
}

.inventario-filtro-campo select{
 min-height:38px;
 min-width:110px;
 padding:0 10px;
 border:1px solid #e4e7ec;
 border-radius:8px;
 background:#f8fafc;
 color:#101828;
 font-size:13px;
 font-weight:700;
}

.btn-limpiar-inventario{
 align-self:end;
 width:auto;
 min-height:38px;
 margin:0;
 padding:0 12px;
 border:1px solid #e4e7ec;
 border-radius:8px;
 background:#fff;
 color:#344054;
 font-size:13px;
 font-weight:800;
}

#pantallaInventario .btn-agregar,
#pantallaCategoriasInventario .btn-agregar{
 grid-column:auto;
 align-self:end;
 width:auto;
 min-height:38px;
 padding:0 16px;
 white-space:nowrap;
 border:1px solid rgba(255,255,255,.38) !important;
 border-radius:10px;
 background:linear-gradient(135deg, color-mix(in srgb, #0d6efd 92%, white 8%), color-mix(in srgb, #0d6efd 68%, #020617 32%)) !important;
 backdrop-filter:blur(16px) saturate(1.3);
 -webkit-backdrop-filter:blur(16px) saturate(1.3);
 color:#fff !important;
 font-size:13px;
 font-weight:800;
 box-shadow:0 14px 26px rgba(13,110,253,.28), inset 0 1px 0 rgba(255,255,255,.4);
}

#pantallaInventario .tabla-inventario{
 table-layout:fixed;
}

#pantallaInventario .tabla-inventario th:nth-child(1),
#pantallaInventario .tabla-inventario td:nth-child(1){
 width:11%;
}

#pantallaInventario .tabla-inventario th:nth-child(2),
#pantallaInventario .tabla-inventario td:nth-child(2){
 width:28%;
}

#pantallaInventario .tabla-inventario th:nth-child(3),
#pantallaInventario .tabla-inventario td:nth-child(3){
 width:13%;
}

#pantallaInventario .tabla-inventario th:nth-child(4),
#pantallaInventario .tabla-inventario td:nth-child(4),
#pantallaInventario .tabla-inventario th:nth-child(5),
#pantallaInventario .tabla-inventario td:nth-child(5){
 width:11%;
}

#pantallaInventario .tabla-inventario th:nth-child(6),
#pantallaInventario .tabla-inventario td:nth-child(6){
 width:13%;
}

#pantallaInventario .tabla-inventario th:nth-child(7),
#pantallaInventario .tabla-inventario td:nth-child(7){
 width:13%;
}

#pantallaInventario .tabla-inventario th{
 background:#fff;
 text-transform:none;
}

#pantallaInventario .tabla-inventario td{
 height:58px;
}

#pantallaInventario .tabla-inventario td:nth-child(2){
 font-weight:700;
 color:#101828 !important;
}

.producto-inventario-celda{
 display:flex;
 align-items:center;
 gap:10px;
 min-width:0;
}

.producto-inventario-celda > div{
 min-width:0;
}

.producto-inventario-icono{
 width:40px;
 height:40px;
 min-width:40px;
 display:grid;
 place-items:center;
 border-radius:10px;
 background:#f2f4f7;
 font-size:20px;
 overflow:hidden;
}

.producto-inventario-icono-img{
 width:100%;
 height:100%;
 object-fit:cover;
 border-radius:inherit;
}

.producto-inventario-celda strong{
 display:block;
 overflow:hidden;
 text-overflow:ellipsis;
 white-space:nowrap;
 font-weight:700;
 color:#101828;
}

.producto-inventario-celda small{
 display:block;
 margin-top:2px;
 overflow:hidden;
 text-overflow:ellipsis;
 white-space:nowrap;
 color:#667085;
 font-size:12px;
 font-weight:600;
}

.inventario-vacio{
 text-align:center !important;
 color:#667085 !important;
 padding:36px 12px !important;
}

.acciones-inventario{
 justify-content:flex-start;
}

.acciones-inventario button{
 width:34px;
 height:34px;
 display:grid;
 place-items:center;
 background:#eaf1ff !important;
 color:#0d6efd !important;
 border:1px solid transparent;
 border-radius:8px;
 box-shadow:none;
}

.acciones-inventario button .ui-icon{
 width:16px;
 height:16px;
}

.acciones-inventario button.accion-peligro{
 background:#fef3f2 !important;
 color:#d92d20 !important;
}

body.oscuro .acciones-inventario button{
 background:rgba(13,110,253,.16) !important;
 color:#7cb0ff !important;
}

body.oscuro .acciones-inventario button.accion-peligro{
 background:rgba(217,45,32,.16) !important;
 color:#fca5a1 !important;
}

body.oscuro #pantallaInventario .tabla-inventario th{
 background:#111827;
}

body.oscuro #pantallaInventario .tabla-inventario td:nth-child(2){
 color:#f8fafc !important;
}

body.oscuro .producto-inventario-celda strong{
 color:#f8fafc;
}

body.oscuro .producto-inventario-celda small{
 color:#94a3b8;
}

.pieza-stock-info{
 display:inline-block;
 margin-top:2px;
 color:#667085;
 font-size:11px;
 font-weight:700;
}

body.oscuro .pieza-stock-info{
 color:#94a3b8;
}

body.oscuro .producto-inventario-icono{
 background:#1f2937;
}

body.oscuro .inventario-filtro-campo select,
body.oscuro .btn-limpiar-inventario{
 background:#1f2937;
 color:#f8fafc;
 border-color:#374151;
}

/* INVENTARIO - pie de paginacion */

.inventario-paginacion-footer{
 display:flex;
 align-items:center;
 justify-content:space-between;
 gap:16px;
 margin-top:16px;
 flex-wrap:wrap;
}

.inventario-paginacion-footer #inventarioPaginacionTexto{
 color:#667085;
 font-size:13px;
 font-weight:600;
}

.inventario-tamano-pagina{
 grid-template-columns:none;
 display:flex;
 align-items:center;
 gap:8px;
}

.inventario-tamano-pagina span{
 white-space:nowrap;
}

.inventario-tamano-pagina select{
 min-height:36px;
}

.paginacion-tabla{
 display:flex;
 align-items:center;
 gap:6px;
 flex-wrap:wrap;
}

.paginacion-tabla button{
 min-width:34px;
 width:auto;
 height:34px;
 margin:0;
 padding:0 10px;
 border:1px solid #e4e7ec;
 border-radius:8px;
 background:#fff !important;
 color:#344054 !important;
 font-size:13px;
 font-weight:700;
}

.paginacion-tabla button.activo{
 border-color:transparent;
 background:#0d6efd !important;
 color:#fff !important;
}

.paginacion-tabla-puntos{
 color:#98a2b3;
 font-weight:700;
 padding:0 2px;
}

body.oscuro .paginacion-tabla button{
 background:#1f2937 !important;
 color:#f8fafc !important;
 border-color:#374151;
}
