:root {
  --primario: #ff1f00;
  --secundario: #49241F;
  --primario-activo: #ff1f00;
  --bs-btn-color: #ff1f00 !important;
  --bs-btn-border-color: #ff1f00 !important;
  --bs-btn-hover-color: #fff;
  --bs-btn-hover-bg: #ff1f00 !important;
  --bs-btn-hover-border-color: #ff1f00 !important;
  --bs-btn-focus-shadow-rgb: 13, 110, 253;
  --bs-btn-active-color: #fff;
  --bs-btn-active-bg: #ff1f00 !important;
  --bs-btn-active-border-color: #ff1f00 !important;
  --bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
  --bs-btn-disabled-color: #ff1f00 !important;
  --bs-btn-disabled-bg: transparent;
  --bs-btn-disabled-border-color: #ff1f00 !important;
  --bs-gradient: none;

  --imt-primary-gradient-from: #482420;
  --imt-primary-gradient-to: #784f48;
}

body {
  min-height: 100vh;
  min-height: -webkit-fill-available;
  position: absolute;
  top: 0;
  overflow-x: hidden;
  /* font-family: 'Roboto', sans-serif !important; */
  font-family: 'Manrope', sans-serif;
}

html {
  height: -webkit-fill-available;
}

a {
  color: var(--primario);
}

hr {
  color: #a7abaf !important;
}

a:hover {
  color: var(--primario);
  opacity: .7;
}

main {
  position: absolute;
  width: 19vw;
}

textarea {
  resize: none;
}

label {
  font-size: .9em;
}

.btn {
  transition: all ease 300ms;
}

.page-link,
.page-link:hover {
  color: var(--primario);
}

.active>.page-link,
.page-link.active {
  background-color: var(--primario);
  border-color: var(--primario);
}

.active>.page-link:hover {
  color: #fff !important;
}

.nav-link:focus {
  background-color: #fff;
}

.tooltip.bs-tooltip-auto {
  z-index: 10;
  font-size: .8em;
}

.container-host-invalido {
  width: 100%;
  position: relative;
}

.dropdown-item {
  font-size: .92em !important;
}

table.table tr {
  height: 10px;
  overflow: hidden;
}

.cambiarestado {
  cursor: pointer;
}

.only-print {
  display: none;
}

.dropdown-toggle {
  outline: 0;
}

iframe {
  border: 1px solid #323639;
}

small {
  font-size: 11px;
}

main {
  width: 17vw;
}

table tbody td {
  color: #8b8b8b !important;
}

table thead th,
table tbody td {
  font-size: .8em !important;
}

table .td-sin-margen th {
  padding-bottom: 0;
  padding-top: 1em;
}

table .td-sin-margen td {
  padding-top: 0;
  padding-bottom: 1em;
}

table .filtro-especial input,
table .filtro-especial select {
  padding: 23px 1em;
}

#sidebar .nav-pills .collapse .nav-item a {
  width:90% !important;
}

#seccion {
  margin-left: 280px;
  width: calc(99vw - 280px);
}

.subtitulos h2 {
  font-weight: bold;
  font-size: 1.25em;
  margin-top: 1em;
}

.bg-light {
  background-color: #F9F9F9 !important;
}

.btn-regresar {
  font-size: .85em;
  font-weight: bold;
  margin-bottom: 1em;
}

#titulo-seccion h1 {
  color: #000;
  font-weight: 200;
  font-size: 2em;
  letter-spacing: .04em;
}

/* Bootstrap hack */
.nav {
  --bs-nav-pills-link-active-bg: var(--primario);
  --bs-link-hover-color: var(--primario);
  --bs-link-color: #fff;
}

.header-seccion .btn,
form:not(.form-inline) .btn {
  font-size: .85em;
  padding: .7em 1em;
  min-width: 10em;
}

.modal-content .modal-footer .btn {
  min-width: auto !important;
}

.header-seccion .btn:hover,
form .btn:hover {
  background: var(--primario-activo) !important;
  border-color: var(--primario-activo) !important;
}

.header-seccion .btn-secondary,
form .btn-secondary {
  background: #8b8b8b;
  border-color: #8b8b8b;
  border: 2px solid #8b8b8b;
}

.header-seccion .btn-secondary:hover,
form .btn-secondary:hover {
  background: #c1c1c1 !important;
  border-color: #c1c1c1 !important;
}

.bootstrap-input label,
.form-check-label {
  font-size: .85em;
  margin-bottom: .5em;
}

.bootstrap-input input,
textarea.form-control,
.bootstrap-input select {
  padding: 1em;
  color: #8b8b8b;
  border: 2px solid #707070;
}

.bootstrap-input input,
.bootstrap-input select {
  font-size: .7em;
}

textarea.form-control {
  font-size: .95em;
}

fieldset {
  border: 2px solid #707070;
  padding: .7em;
  border-radius: .5em;
}


.btn-primary {
  --bs-btn-color: #fff;
  --bs-btn-bg: #000;
  --bs-btn-border-color: #000;
  --bs-btn-hover-color: #fff;
  --bs-btn-hover-bg: var(--primario-activo);
  --bs-btn-hover-border-color: var(--primario-activo);
  --bs-btn-focus-shadow-rgb: 49, 132, 253;
  --bs-btn-active-color: #fff;
  --bs-btn-active-bg: var(--primario-activo);
  --bs-btn-active-border-color: var(--primario-activo);
  --bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
  --bs-btn-disabled-color: #fff;
  --bs-btn-disabled-bg: #000;
  --bs-btn-disabled-border-color: #000;
}

.btn-outline-primary {
  --bs-btn-color: var(--primario-activo);
  --bs-btn-bg: transparent;
  --bs-btn-border-color: var(--primario-activo);
  --bs-btn-hover-color: #fff;
  --bs-btn-hover-bg: var(--primario-activo);
  --bs-btn-hover-border-color: var(--primario-activo);
  --bs-btn-focus-shadow-rgb: 49, 132, 253;
}

.btn-outline-primary:hover {
  --bs-btn-hover-color: #fff;
  --bs-btn-hover-bg: var(--primario-activo);
  --bs-btn-hover-border-color: var(--primario-activo);
}

.btn-outline-primary:active {
  --bs-btn-active-color: #fff;
  --bs-btn-active-bg: var(--primario-activo);
  --bs-btn-active-border-color: var(--primario-activo);
}

.btn-outline-primary:focus {
  --bs-btn-focus-color: #fff;
  --bs-btn-focus-bg: var(--primario-activo);
  --bs-btn-focus-border-color: var(--primario-activo);
}

.btn-outline-primary:disabled {
  --bs-btn-disabled-color: #fff;
  --bs-btn-disabled-bg: transparent;
  --bs-btn-disabled-border-color: var(--primario-activo);
}

/* Badge alarma animada, usa rojo primario y animación de campana */
.alarma-badge {
  background-color: var(--bs-danger, #dc3545); /* Usa rojo primario Bootstrap, fallback rojo */
  color: var(--primario) !important;
  border-radius: 50%;
  width: 20px;
  height: 20px;
  display: inline-flex;
  justify-content: center;
  align-items: center;
  position: relative;
}

.bg-primary .alarma-badge,
.bg-primary .alarma-badge i {
  color: #fff !important;
  background: none !important;
}

/* Animar el icono de campana dentro de .alarma-badge */
.alarma-badge .material-icons-round,
.alarma-badge .fa,
.alarma-badge .fa-solid {
  animation: shake-campana 0.9s infinite cubic-bezier(.36,.07,.19,.97) both;
  transform-origin: 50% 0%;
  display: inline-block;
  color: var(--primario) !important;
}

/* Animación de 'campana agitándose' */
@keyframes shake-campana {
  0% { transform: rotate(0deg);}
  15% { transform: rotate(-15deg);}
  30% { transform: rotate(12deg);}
  45% { transform: rotate(-11deg);}
  60% { transform: rotate(9deg);}
  75% { transform: rotate(-6deg);}
  85% { transform: rotate(3deg);}
  100% { transform: rotate(0deg);}
}

.nav-pills .nav-link.active,
.nav-pills .show>.nav-link {
  background-color: #333;
}

.nav-pills .nav-link {
  font-size: 13px !important;
}

.table>:not(caption)>*>* {
  border: 0;
}

th,
td {
  vertical-align: middle;
  font-size: 1em !important;
}


/* Semáforos */
.light-led {
  background-color: #0B0C0F;
  display: inline-block;
  width: 24px;
  height: 24px;
  font-size: 13px;
  line-height: 1em;
  display: flex;
  justify-content: center;
  align-items: center;
  border-radius: 40%;
}

.light-led:after {
  content: "";
  display: block;
  border-radius: 100%;
  width: 16px;
  height: 16px;
}

/* Marcado contenido leído */
.archivo-descargado {
  opacity: .2 !important;
}

.led {
  height: 100%;
}

.bg-primary {
  background-color: var(--primario) !important;
}

.text-primary {
  color: var(--primario) !important;
}

.btn-success,
.led.bg-success,
.light-led.completado:after {
  background-color: #42EBB7 !important;
  border: 1px solid #42EBB7 !important;
  transition: all ease 500ms;
}


.light-led.completado:after {
  background-color: #4DC0EA !important;
  border: 1px solid #4DC0EA !important;
}

.light-led.finalizado:after {
  background-color: #42EBB7 !important;
  border: 1px solid #42EBB7 !important;
}

.light-led.sincotizaciones:after {
  background-color: #DDDDDD !important;
  border: 1px solid #DDDDDD !important;
}


.light-led.revision:after {
  background-color: #42EBB7 !important;
  border: 1px solid #42EBB7 !important;
  transition: all ease 500ms;
}

.btn-success:hover {
  background-color: #34C290 !important;
  border-color: #34C290 !important;
}

.light-led.atencion:after {
  background-color: #FD8E35;
}

.light-led.anulado:after {
  background-color: #f3ed59;
}

.light-led.noganado:after {
  background-color: #FF69B4;
}

.btn-danger,
.led.bg-danger,
.light-led.pendiente:after {
  background-color: var(--primario-activo) !important;
  border: 1px solid var(--primario-activo) !important;
}

.led .h3 {
  font-weight: 600;
}

.files {
  overflow: hidden;
}

.remover-adjunto {
  color: var(--primario-activo);
  text-decoration: underline;
  cursor: pointer;
  display: inline-block;
  margin-right: 2em;
  text-align: right;
  margin-top: 3px;
  -webkit-user-select: none;
  /* Safari */
  -ms-user-select: none;
  /* IE 10 and IE 11 */
  user-select: none;
  /* Standard syntax */
}

.remover-adjunto:hover {
  color: #000;
}

#dropdownUser1 strong {
  font-size: 12px;
}

#table-proveedores {
  height: 525px;
  margin-bottom: 1em;
}

#table-proveedores .td-corte {
  display: block;
  height: 1.7em;
  overflow: hidden;
}


.text-bg-success {
  background-color: #e3fcf4 !important;
  color: #000 !important;
  min-height: 4.7em !important;
  border: 0 !important;
}

.text-bg-danger {
  background-color: #ffe9e7 !important;
  color: #000 !important;
  min-height: 4.7em !important;
  border: 0 !important;
}

.text-bg-success i {
  color: #42ebb7;

}

.text-bg-danger i {
  color: var(--primario-activo);
}

.toast-body i.fa-solid {
  font-size: 3em;
  display: block;
  float: left;
  margin-right: 0.3em;
}

#contenedor-toast {
  width: 35vw;
  /* z-index: -11; */
  z-index: 9999;
}

#contenedor-toast #liveToast {
  width: 100%;
}

#contenedor-toast #toast-sms {
  padding-top: 7px;
}

/* Tablas */
.col-icon {
  width: 15px;
}

/* Sección contactos */
#contactos-info {
  font-size: .8em;
}


.toggle.btn {
  width: 220px !important;
  height: 38px !important;
}

.toggle.btn .btn {
  font-size: 13px !important;
  padding-top: 8px !important;
}

.no-break {
  white-space: nowrap;
}

.eliminar-tarea {
  cursor: pointer;
}

.eliminar-tarea:hover {
  color: #000;
}

/* Taskmanager en la portada  */
#taskmanager {
  height: 90vh;
  position: relative;
  margin-top: 2vh;
}

#nuevas-tareas {
  position: absolute;
  bottom: 0;
  width: 100%;
  left: 0;
  padding: .5em;
  -webkit-border-bottom-right-radius: 20px;
  -webkit-border-bottom-left-radius: 20px;
  -moz-border-radius-bottomright: 20px;
  -moz-border-radius-bottomleft: 20px;
  border-bottom-right-radius: 20px;
  border-bottom-left-radius: 20px;

}

#sin-tareas-pendientes {
  opacity: 1;
  text-align: center;
  position: absolute;
  width: 100%;
  margin-top: 10%;
}

.status-respuesta {
  margin-right: 2em;
  display: inline-block;
  font-weight: bold;
}

#titulo-periodos {
  font-weight: bold;
  font-size: 1em;
  text-align: center;
}

.parpadeo {
  animation: blink 2s ease infinite;
}

.accordion-button {
  font-size: .45em;
}

.accordion-button:hover {
  background-color: #e1e1e1;
}

.accordion-button {
  background-color: #333 !important;
  color: #fff !important;
}

.accordion-button::after {
  filter: invert(99%) sepia(1%) saturate(2%) hue-rotate(248deg) brightness(116%) contrast(100%);
}



/* Cargando */
.lightbox {
  display: none;
  position: fixed;
  z-index: 9999;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(0, 0, 0, 0.5);
}

.lightbox-content {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  height: 100%;
  color: #fff;
}


#table-clientes {
  min-height: 500px;
}

textarea.textarea-right-float {
  padding-bottom: 3.6em !important;
}

.btn-right-float {
  position: absolute;
  margin-top: -3.6em;
  right: 10px;
}

.toggle-handle.btn-default {
  margin-left: -200%;
}

label.toggle-on.btn {
  padding-right: 0;
  padding-left: 0;
}

label.toggle-off.btn {
  padding-left: 0;
  padding-right: 0;
}

.table-hover>tbody>tr>*,
.row-task-agenda .btn {
  transition: all ease 500ms;
}

.row-task-agenda:hover .btn {
  opacity: 1 !important;
}

#accion-adjuntos button {
  border: 2px solid #707070;
  margin-top: -2px;
}

.tooltip {
  z-index: 9999 !important;
}


#container-jornada-laboral .estado-activo #btn-todos-empleados .btn {
  padding: 11px 14px !important;
}


#container-jornada-laboral #btn-todos-empleados .btn {
  padding: 15px 14px !important;
  margin-left: -.5em !important;
  margin-top: 1px !important;
}

.btn-link.text-danger:hover {
  color: #fff !important;
  background-color: #dc3545 !important;
  border-color: #dc3545 !important;
  text-decoration: none !important;
}


@keyframes blink {
  0% {
    opacity: 1;
  }

  50% {
    opacity: 0.5;
  }

  100% {
    opacity: 1;
  }
}