/* ===== MODAL IMAGEN PRODUCTO ===== */

#modalImagenProducto .modal-dialog {
  max-width: 650px;          /* ancho del modal: súbelo o bájalo a tu gusto */
  margin: 30px auto;
}

#modalImagenProducto .modal-imagen-content {
  border-radius: 8px;
}

#modalImagenProducto .modal-body {
  padding: 10px;
  text-align: center;
}

#modalImagenProducto .img-zoom-center {
  max-width: 100%;
  max-height: calc(100vh - 250px); /* que no se salga de la pantalla */
  object-fit: contain;
  display: block;
  margin: 0 auto;
}

#modalImagenProducto .modal-footer {
  border-top: 0;
}

/* ===== DETALLE DE PRODUCTOS EN VENTAS ===== */
.encabezadoDetalleVenta {
  margin: 12px 0 4px;
  color: #4a5568;
  font-size: 12px;
  font-weight: 700;
  text-transform: uppercase;
  background: #f4f7fa;
  border: 1px solid #e2e8f0;
  border-radius: 6px;
}

.encabezadoDetalleVenta .col-xs-1,
.encabezadoDetalleVenta .col-xs-2 { text-align: center; }

.nuevoProducto { margin: 0 !important; }

.filaProductoVenta {
  display: flex;
  align-items: center;
  margin: 0 0 6px !important;
  padding: 6px 0;
  background: #fff;
  border: 1px solid #e6ebf1;
  border-radius: 6px;
  box-shadow: 0 1px 2px rgba(0, 0, 0, .035);
}

.filaProductoVenta:hover { border-color: #b8d6ec; background: #fbfdff; }

.filaProductoVenta .col-xs-1,
.filaProductoVenta .col-xs-2,
.filaProductoVenta .col-xs-5 { padding-left: 4px; padding-right: 4px; }

.columnaIndiceProducto { text-align: center; }

.indiceProductoVenta {
  display: inline-block;
  min-width: 23px;
  padding: 3px 5px;
  color: #fff;
  font-size: 11px;
  font-weight: 700;
  line-height: 1.2;
  background: #3c8dbc;
  border-radius: 12px;
}

.filaProductoVenta .form-control { height: 32px; font-size: 12px; }
.filaProductoVenta .input-group-addon {
  padding: 3px 6px;
  background: #fff;
  border-right: 0;
}

.filaProductoVenta .btnQuitarProductoVenta {
  width: 23px;
  height: 23px;
  padding: 0;
  color: #d94b4b;
  font-size: 14px;
  line-height: 21px;
  background: #fff4f4;
  border: 1px solid #f2b8b8;
  border-radius: 50%;
  transition: all .16s ease;
}

.filaProductoVenta .btnQuitarProductoVenta:hover,
.filaProductoVenta .btnQuitarProductoVenta:focus {
  color: #fff;
  background: #dd4b39;
  border-color: #dd4b39;
  outline: none;
}
.filaProductoVenta .nuevaCantidadProducto,
.filaProductoVenta .nuevoPrecioProducto,
.filaProductoVenta .nuevoPrecioVentaProducto { text-align: center; }

/* ===== BREADCRUMBS ===== */
.content-header > .breadcrumb {
  top: 12px;
  padding: 8px 12px;
  font-size: 14px;
  font-weight: 600;
  background: rgba(255, 255, 255, .82);
  border-radius: 5px;
}

.content-header > .breadcrumb > li > a { color: #367fa9; }
.content-header > .breadcrumb > li.active { color: #4b5563; }
.content-header > .breadcrumb > li + li:before { padding: 0 7px; }

/* ===== GRÁFICOS DE VENTAS ===== */
#bar-chart-productos .morris-axis-label { font-size: 8px !important; }

.leyendaGraficoMetodos { margin-top: 4px; color: #4b5563; font-size: 12px; }
.leyendaGraficoMetodos span { display: inline-block; margin: 0 9px; }
.leyendaGraficoMetodos i { display: inline-block; width: 10px; height: 10px; margin-right: 4px; border-radius: 50%; }
.leyendaGraficoMetodos .leyendaDolar { background: #00a65a; }
.leyendaGraficoMetodos .leyendaSoles { background: #00c0ef; }

/* ===== CABEZOTE ===== */
.main-header .navbar .navbarPedidosPendientes > a { position: relative; padding: 11px 16px; font-size: 16px; font-weight: 600; }
.main-header .navbar .navbarPedidosPendientes > a > .fa-bell-o { font-size: 26px; vertical-align: -3px; }
.main-header .navbar .navbarPedidosPendientes .label { margin: 0 7px; padding: 5px 8px; font-size: 13px; }

.main-header .user-menu > .dropdown-menu { min-width: 210px; }
.main-header .user-menu .user-header { height: 135px; padding-top: 18px; }
.main-header .user-menu .user-header > p { font-size: 15px; }
.main-header .user-menu .user-header > p > small { display: block; margin-top: 5px; }
.main-header .user-menu .user-body { padding: 10px; }
.main-header .user-menu .user-footer { padding: 10px; background: #f7f9fb; }

/* ===== SALIDA EN MENÚ LATERAL ===== */
.main-sidebar .sidebar { padding-bottom: 58px; }

.sidebarCerrarSesion {
  position: absolute;
  right: 0;
  bottom: 0;
  left: 0;
  border-top: 1px solid rgba(255, 255, 255, .1);
}

.sidebarCerrarSesion a {
  display: block;
  padding: 14px 15px;
  color: #f5b7b1;
  font-size: 14px;
  font-weight: 600;
  background: rgba(0, 0, 0, .08);
  transition: background .16s ease, color .16s ease;
}

.sidebarCerrarSesion a:hover,
.sidebarCerrarSesion a:focus { color: #fff; background: #c0392b; }
.sidebarCerrarSesion i { width: 20px; margin-right: 4px; text-align: center; }

.sidebar-mini.sidebar-collapse .sidebarCerrarSesion a { padding-left: 15px; }
.sidebar-mini.sidebar-collapse .sidebarCerrarSesion a span { display: none; }
.sidebar-mini.sidebar-collapse .sidebarCerrarSesion i { margin-right: 0; }

/* ===== OPCIONES DEL MENÚ LATERAL ===== */
.main-sidebar .sidebar-menu > li > a {
  padding-top: 13px;
  padding-bottom: 13px;
  font-size: 16px;
  font-weight: 600;
}

.main-sidebar .sidebar-menu > li > a > .fa,
.main-sidebar .sidebar-menu > li > a > .ion { font-size: 17px; }

.main-sidebar .treeview-menu > li > a {
  padding-top: 10px;
  padding-bottom: 10px;
  font-size: 15px;
}

/* ===== PIE DE PÁGINA ===== */
.main-footer {
  padding: 13px 18px;
  color: #667085;
  font-size: 13px;
  background: #fbfcfe;
  border-top: 1px solid #e6ebf1;
}

.main-footer strong { color: #344054; }
.main-footer .footerSeparador { margin: 0 5px; color: #b0bac7; }

/* ===== INICIO DE SESIÓN ===== */
.login-page {
  min-height: 100vh;
  background: linear-gradient(135deg, #eaf3f9 0%, #d7e7f2 52%, #c5dceb 100%);
}

.loginYsanlu { width: 390px; }
.loginYsanlu .login-box-body {
  padding: 30px 34px 22px;
  background: rgba(255, 255, 255, .97);
  border-radius: 12px;
  box-shadow: 0 16px 38px rgba(40, 79, 107, .18);
}

.loginEncabezado { margin-bottom: 23px; }
.loginIcono {
  display: inline-block;
  width: 55px;
  height: 55px;
  margin-bottom: 9px;
  color: #fff;
  font-size: 25px;
  line-height: 55px;
  background: #3c8dbc;
  border-radius: 50%;
  box-shadow: 0 5px 12px rgba(60, 141, 188, .27);
}

.loginEncabezado h1 { margin: 0; color: #2d4152; font-size: 25px; }
.loginEncabezado p { margin: 5px 0 0; color: #7b8994; font-size: 13px; }
.loginYsanlu .login-box-msg { padding: 0 0 17px; color: #5c6b76; font-size: 14px; }
.loginYsanlu label { margin-bottom: 6px; color: #435260; font-size: 13px; font-weight: 600; }
.loginYsanlu .form-control { height: 42px; font-size: 14px; }
.loginYsanlu .input-group-addon { min-width: 40px; color: #61809a; background: #f5f8fa; }
.loginYsanlu #btnVerPassword { height: 42px; color: #61809a; }
.loginYsanlu .btnIngresarLogin { margin-top: 9px; padding: 11px; font-size: 14px; font-weight: 600; border-radius: 5px; }
.loginPie { margin-top: 24px; padding-top: 16px; color: #87939d; font-size: 11px; line-height: 1.8; border-top: 1px solid #edf1f4; }

@media (max-width: 420px) {
  .loginYsanlu { width: calc(100% - 28px); }
  .loginYsanlu .login-box-body { padding: 26px 22px 20px; }
}

/* Auditoría de ventas */
.auditoria-json {
  margin: 0;
  padding: 0;
  border: 0;
  background: transparent;
  white-space: pre-wrap;
  word-break: break-word;
  font-family: Menlo, Monaco, Consolas, "Courier New", monospace;
  font-size: 12px;
}

.auditoria-resumen dt { width: 125px; }
.auditoria-resumen dd { margin-left: 145px; }