:root {
  --color-primary: rgba(255, 0, 0, 0.746);
  --color-secondary: rgba(2, 40, 255, 0.863);
  --color-gray: #d6d6d6;
}
.bg-white {
  background-color: white;
}
.bg-red-gyt {
  background-color: var(--color-primary);
}
.bg-gray-gyt {
  background-color: var(--color-gray);
}
.bg-blue-gyt {
  background-color: var(--color-secondary);
}
.btn-blue-gyt {
  background-color: var(--color-secondary);
  color: white;
}
.btn-red-gyt {
  background-color: var(--color-primary);
  color: white;
}
.btn-gray-gyt {
  background-color: var(--color-gray);
  color: black;
}
.fondo-global {
  background-color: #e4e6e7;
}
.text-blue-gyt {
  color: var(--color-secondary);
}
.text-red-gyt {
  color: var(--color-primary);
}
/* quitar flechas del input type number */
input[type="number"]::-webkit-inner-spin-button,
input[type="number"]::-webkit-outer-spin-button {
  -webkit-appearance: none;
  margin: 0;
}

.row {
  --bs-gutter-x: 11px !important;
}
@media (min-width: 992px) {
  .modal-lg#CajaModalmodalPD {
    max-width: 775px !important;
  }
  .modal-lg#modalListaEEstilos {
    max-width: 900px !important;
  }
  .modal-xl#modactOtConfigSize {
    max-width: 920px !important;
  }
}
@media (min-width: 1200px) {
  .modal-xl#modactOtConfigSize {
    max-width: 1200px !important;
  }
}
.contenedor-pd-flex {
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  width: 100%;
  gap: 0.6rem;
  justify-content: center;
  align-items: flex-start;
}
#icon-left,
#icon-right {
  max-width: 5%;
  align-self: center;
}
#llegaInputsPDEPrimario,
#llegaInputsPDESecundario {
  padding: 0.5rem 0.7rem;
}

.item-pd-flex:nth-of-type(1) {
  min-width: 59%;
}
.item-pd-flex-version:nth-of-type(1) {
  max-width: 100%;
  padding: 0.5rem 1rem;
}
.item-pd-flex-version:nth-of-type(2) {
  max-width: 0;
  padding: 0;
}
@keyframes dragAnddrop {
  from {
    width: 100%;
    opacity: 1;
  }
  to {
    width: 90%;
    opacity: 0;
  }
}
.activeDrag {
  animation: dragAnddrop 0.5s ease-in infinite alternate;
  /*  animation: name duration timing-function delay iteration-count direction fill-mode; */
}
label.contenedorDragDrop {
  position: relative;
  width: 100%;
  height: 300px;
  overflow-y: scroll;
  cursor: pointer;
}
.contenedorDragDrop img {
  position: absolute;
  top: 50%;
  left: 50%;
  bottom: 0;
  right: 0;
  transform: translate(-50%, -50%);
}
#llegaImagenesOt {
  position: absolute;
  width: 95%;
  height: 100%;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  z-index: 1;
}
.bg-success-opacity {
  background-color: #19875463 !important;
}
.bg-secondary-opacity {
  background-color: #6c757d5e !important;
}
.bg-secondary-opacity-2 {
  background-color: #6c757d27 !important;
}
.bg-primary-opacity {
  background-color: rgba(2, 40, 255, 0.123) !important;
}
#formActordenesTrabajo label {
  font-weight: 500;
}

.container-img-ot {
  position: relative;
}
div.opciones-img-ot {
  position: absolute !important;
  left: 0;
  top: 0;
  right: 0;
  bottom: 0;
  display: flex;
  justify-content: center;
  align-items: center;
  background-color: red;
  opacity: 0;
}
div.opciones-img-ot:hover {
  opacity: 1;
  background-color: rgba(255, 255, 255, 0.359) !important;
}
div.opciones-img-ot i {
  cursor: pointer;
}
.cursor-pointer {
  cursor: pointer;
}
.z-index-9999 {
  z-index: 9999 !important;
}
.z-index-10000 {
  z-index: 10000 !important;
}
hr.modal-act {
  height: 2px;
  margin: 1.2rem 0;
}

/* subir imagenes de los equipos  */

.img_add_equipo {
  width: 100%;
  object-fit: cover;
  aspect-ratio: 16/10;
}
/* range object-position  */

input[type=range] {
  -webkit-appearance: none;
  margin: 10px 0;
  width: 100%;
}
input[type=range]:focus {
  outline: none;
}
input[type=range]::-webkit-slider-runnable-track {
  width: 100%;
  height: 12.8px;
  cursor: pointer;
  box-shadow: 0px 0px 0px #000000, 0px 0px 0px #0d0d0d;
  background: #b1b1b1;
  border-radius: 25px;
  border: 0px solid #000101;
}
input[type=range]::-webkit-slider-thumb {
  box-shadow: 0px 0px 0px #000000, 0px 0px 0px #0d0d0d;
  border: 0px solid #000000;
  height: 20px;
  width: 39px;
  border-radius: 7px;
  background: #000000;
  cursor: pointer;
  -webkit-appearance: none;
  margin-top: -3.6px;
}
input[type=range]:focus::-webkit-slider-runnable-track {
  background: #b1b1b1;
}
input[type=range]::-moz-range-track {
  width: 100%;
  height: 12.8px;
  cursor: pointer;
  animate: 0.2s;
  box-shadow: 0px 0px 0px #000000, 0px 0px 0px #0d0d0d;
  background: #e4e4e4;
  border-radius: 25px;
  border: 0px solid #000101;
}
input[type=range]::-moz-range-thumb {
  box-shadow: 0px 0px 0px #000000, 0px 0px 0px #0d0d0d;
  border: 0px solid #000000;
  height: 20px;
  width: 39px;
  border-radius: 7px;
  background: #e4e4e4;
  cursor: pointer;
}
input[type=range]::-ms-track {
  width: 100%;
  height: 12.8px;
  cursor: pointer;
  animate: 0.2s;
  background: transparent;
  border-color: transparent;
  border-width: 39px 0;
  color: transparent;
}
input[type=range]::-ms-fill-lower {
  background: #b1b1b1;
  border: 0px solid #000101;
  border-radius: 50px;
  box-shadow: 0px 0px 0px #000000, 0px 0px 0px #0d0d0d;
}
input[type=range]::-ms-fill-upper {
  background: #b1b1b1;
  border: 0px solid #000101;
  border-radius: 50px;
  box-shadow: 0px 0px 0px #000000, 0px 0px 0px #0d0d0d;
}
input[type=range]::-ms-thumb {
  box-shadow: 0px 0px 0px #000000, 0px 0px 0px #0d0d0d;
  border: 0px solid #000000;
  height: 20px;
  width: 39px;
  border-radius: 7px;
  background: #65001c;
  cursor: pointer;
}
input[type=range]:focus::-ms-fill-lower {
  background: #b1b1b1;
}
input[type=range]:focus::-ms-fill-upper {
  background: #b1b1b1;
}



/* fin subir imagenes de los equipos  */