/* ==================== CONTENEDOR PRINCIPAL EN PROGRESO ==================== */
.procom-proceso-container {
  position: relative;
  z-index: 1;
  padding: 20px;
  min-height: 100vh;
  background: linear-gradient(135deg, #f8f9fa 0%, #e9ecef 50%, #dee2e6 100%) !important;
  width: 100%;
  box-sizing: border-box;
}

.procom-proceso-container .resumen-metricas-container,
.procom-proceso-container .conteo-proyectos-card,
.procom-proceso-container .proyecto-enprogreso-item,
.procom-proceso-container .proyecto-enprogreso-columna,
.procom-proceso-container .procom-sort-button,
.procom-proceso-container .visualizacion-control-container,
.procom-proceso-container .proyecto-sin-tareas {
  background-color: initial !important;
}

.procom-proceso-container.procom-cargando {
  opacity: 0.7;
  pointer-events: none;
}

/* ==================== HEADER PRINCIPAL ==================== */
.procom-proceso-container .resumen-metricas-container {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 20px;
  padding: 15px 20px;
  background: linear-gradient(135deg, rgba(255, 255, 255, 0.98) 0%, rgba(248, 249, 250, 0.98) 100%) !important;
  border-radius: 10px;
  box-shadow:
    0 3px 10px rgba(0, 0, 0, 0.06),
    inset 0 1px 0 rgba(255, 255, 255, 0.6);
  border: 1px solid rgba(255, 255, 255, 0.8);
  min-height: auto;
  flex-wrap: nowrap;
}

/* ==================== CONTENEDOR IZQUIERDO (SOLO CONTADOR) ==================== */
.controles-izquierdo {
  display: flex;
  align-items: center;
  gap: 0;
}

/* ==================== CONTENEDOR DERECHO (VISUALIZACIÓN + ORDENAR) ==================== */
.controles-derecho {
  display: flex;
  align-items: center;
  gap: 8px;
}

/* ==================== BOTÓN DE VISUALIZACIÓN ==================== */
.visualizacion-control-container {
  height: 40px !important;
  min-height: 40px !important;
  max-height: 40px !important;
  min-width: 120px !important;
  padding: 0 12px !important;
  background: linear-gradient(135deg, #861542 0%, #9a1c4a 50%, #b32152 100%) !important;
  border: 1px solid rgba(255, 255, 255, 0.3) !important;
  border-radius: 8px;
  box-shadow:
    0 2px 6px rgba(134, 21, 66, 0.2),
    inset 0 1px 0 rgba(255, 255, 255, 0.3);
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  cursor: pointer;
  transition: all 0.2s ease;
  position: relative;
}

.visualizacion-control-container:hover {
  transform: translateY(-1px);
  box-shadow:
    0 3px 10px rgba(134, 21, 66, 0.3),
    inset 0 1px 0 rgba(255, 255, 255, 0.4) !important;
  background: linear-gradient(135deg, #9a1c4a 0%, #b32152 50%, #c4275a 100%) !important;
  border-color: rgba(255, 255, 255, 0.4) !important;
}

.visualizacion-control-container:active {
  transform: translateY(0);
}

.visualizacion-control-container.dropdown-open {
  box-shadow:
    0 3px 12px rgba(134, 21, 66, 0.4),
    inset 0 1px 0 rgba(255, 255, 255, 0.4) !important;
}

/* CONTENIDO DEL BOTÓN */
.visualizacion-contenido {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  width: 100%;
  gap: 8px !important;
}

/* GRUPO ICONO + TEXTO */
.visualizacion-icon-texto {
  display: flex !important;
  align-items: center !important;
  gap: 6px !important;
  flex: 1;
  min-width: 0;
}

/* CONTENEDOR DEL ICONO - TAMAÑO FIJO */
.visualizacion-icon-wrapper {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 16px !important;
  height: 16px !important;
  flex-shrink: 0 !important;
}

.visualizacion-icon {
  font-size: 13px !important;
  color: #ffffff !important;
  opacity: 0.95;
  width: 100% !important;
  height: 100% !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
}

/* TEXTO */
.visualizacion-texto {
  font-size: 0.75rem !important;
  color: #ffffff !important;
  font-weight: 700;
  white-space: nowrap;
  text-shadow: 0 1px 2px rgba(0, 0, 0, 0.3);
  margin: 0 !important;
  line-height: 1 !important;
  flex-shrink: 0 !important;
  /* Aplicado Mayúsculas */
  text-transform: uppercase !important;
}

/* CARET */
.visualizacion-caret {
  font-size: 10px !important;
  color: #ffffff !important;
  opacity: 0.8;
  transition: transform 0.2s ease;
  flex-shrink: 0 !important;
  margin-left: 2px !important;
}

.visualizacion-control-container:hover .visualizacion-caret {
  opacity: 1;
}

.visualizacion-control-container.dropdown-open .visualizacion-caret {
  transform: rotate(180deg);
  opacity: 1;
}

/* ==================== DROPDOWN DE VISUALIZACIÓN ==================== */
.visualizacion-dropdown-menu {
  position: absolute;
  top: calc(100% + 4px);
  left: 0;
  right: 0;
  width: 100% !important;
  background: linear-gradient(135deg, #ffffff 0%, #f8f9fa 100%) !important;
  border: 1px solid #e9ecef !important;
  border-radius: 6px;
  box-shadow:
    0 4px 12px rgba(0, 0, 0, 0.1);
  padding: 8px !important;
  z-index: 1001;
  animation: dropdownFadeIn 0.15s ease-out;
}

.visualizacion-dropdown-item {
  display: flex !important;
  align-items: center !important;
  width: 100%;
  padding: 12px 14px !important;
  border: none;
  background: none;
  border-radius: 5px;
  font-size: 0.75rem !important;
  color: #495057 !important;
  cursor: pointer;
  transition: all 0.15s ease;
  font-weight: 600;
  line-height: 1.2;
  min-height: 42px !important;
  box-sizing: border-box !important;
  margin-bottom: 2px !important;
}

.visualizacion-dropdown-item:last-child {
  margin-bottom: 0 !important;
}

/* CONTENEDOR PARA ICONOS */
.visualizacion-dropdown-icon-container {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 24px !important;
  height: 18px !important;
  flex-shrink: 0 !important;
  margin-right: 10px !important;
}

.visualizacion-dropdown-icon {
  font-size: 11px !important;
  width: 100% !important;
  height: 100% !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  opacity: 0.9;
  color: #495057;
  transition: all 0.15s ease;
  flex-shrink: 0 !important;
}

.visualizacion-dropdown-icon.fa-chart-pie {
  transform: scale(0.95) !important;
}

/* CONTENEDOR DE TEXTO */
.visualizacion-dropdown-texto {
  flex: 1;
  text-align: left;
  font-size: 0.75rem !important;
  font-weight: 600;
  line-height: 1.2;
  white-space: nowrap;
}

.visualizacion-dropdown-item:hover,
.visualizacion-dropdown-item.visualizacion-active {
  background: linear-gradient(135deg, #861542 0%, #9a1c4a 100%) !important;
  color: #ffffff !important;
  transform: translateX(1px);
}

.visualizacion-dropdown-item:hover .visualizacion-dropdown-icon,
.visualizacion-dropdown-item.visualizacion-active .visualizacion-dropdown-icon {
  color: #ffffff !important;
  opacity: 1;
}

@keyframes dropdownFadeIn {
  from {
    opacity: 0;
    transform: translateY(-6px) scale(0.98);
  }

  to {
    opacity: 1;
    transform: translateY(0) scale(1);
  }
}

/* ==================== CONTADOR DE PROYECTOS ==================== */
.conteo-proyectos-card {
  height: 60px !important;
  min-height: 60px !important;
  max-height: 60px !important;
  min-width: 80px !important;
  padding: 8px 12px !important;
  background: linear-gradient(135deg, #861542 0%, #9a1c4a 50%, #b32152 100%) !important;
  border: 1px solid rgba(255, 255, 255, 0.6);
  border-radius: 8px;
  box-shadow:
    0 3px 8px rgba(0, 0, 0, 0.12),
    inset 0 1px 0 rgba(255, 255, 255, 0.4);
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 2px;
}

.conteo-proyectos-card .conteo-valor {
  font-size: 1.4rem !important;
  font-weight: 900;
  color: #ffffff;
  line-height: 1 !important;
  text-shadow: 0 2px 4px rgba(0, 0, 0, 0.5);
  white-space: nowrap;
  margin: 0 !important;
}

.conteo-proyectos-card .conteo-label {
  font-size: 0.7rem !important;
  font-weight: 700;
  color: rgba(255, 255, 255, 0.95);
  text-transform: uppercase;
  letter-spacing: 0.03em;
  white-space: nowrap;
  margin: 0 !important;
  line-height: 1 !important;
}

/* ==================== ORDENAMIENTO ==================== */
.procom-sort-control-container {
  min-width: 130px !important;
  height: 40px !important;
}

.procom-sort-button-wrapper {
  position: relative;
  width: 100%;
  height: 100%;
}

.procom-sort-button {
  width: 100% !important;
  height: 40px !important;
  background: linear-gradient(135deg, #861542 0%, #9a1c4a 100%) !important;
  border: 1px solid #861542 !important;
  padding: 0 12px !important;
  border-radius: 8px !important;
  font-size: 0.75rem !important;
  font-weight: 700;
  color: #ffffff !important;
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 6px !important;
  box-shadow:
    0 2px 6px rgba(134, 21, 66, 0.15),
    inset 0 1px 0 rgba(255, 255, 255, 0.4) !important;
  cursor: pointer;
  transition: all 0.2s ease;
  /* Aplicado Mayúsculas */
  text-transform: uppercase !important;
}

.procom-sort-button:hover {
  transform: translateY(-1px);
  box-shadow:
    0 3px 8px rgba(134, 21, 66, 0.2),
    inset 0 1px 0 rgba(255, 255, 255, 0.5) !important;
}

.procom-sort-button:active {
  transform: translateY(0);
}

.procom-sort-button-icon {
  font-size: 10px !important;
  color: #ffffff !important;
  opacity: 0.9;
}

.procom-caret-icon {
  font-size: 8px !important;
  color: #ffffff !important;
  transition: transform 0.2s ease;
}

.procom-caret-icon.procom-rotate {
  transform: rotate(180deg);
}

/* ==================== DROPDOWN DE ORDENAMIENTO ==================== */
.procom-dropdown-menu-sort {
  position: absolute;
  top: calc(100% + 3px);
  left: 0;
  right: 0;
  width: 100% !important;
  background: linear-gradient(135deg, #ffffff 0%, #f8f9fa 100%) !important;
  border: 1px solid #e9ecef !important;
  border-radius: 6px;
  box-shadow:
    0 4px 12px rgba(0, 0, 0, 0.1);
  padding: 4px;
  z-index: 1000;
  animation: dropdownFadeIn 0.15s ease-out;
}

.procom-dropdown-item-sort {
  display: flex;
  align-items: center;
  gap: 6px;
  width: 100%;
  padding: 6px 8px;
  border: none;
  background: none;
  border-radius: 4px;
  font-size: 0.7rem !important;
  color: #495057 !important;
  cursor: pointer;
  transition: all 0.15s ease;
  font-weight: 600;
  line-height: 1.2;
  /* Aplicado Mayúsculas */
  text-transform: uppercase !important;
}

.procom-dropdown-item-sort:hover,
.procom-dropdown-item-sort.procom-active {
  background: linear-gradient(135deg, #861542 0%, #9a1c4a 100%) !important;
  color: #ffffff !important;
}

.procom-sort-icon {
  font-size: 11px !important;
  /* AUMENTADO */
  opacity: 0.8;
  color: #495057;
  transition: all 0.15s ease;
}

.procom-dropdown-item-sort:hover .procom-sort-icon,
.procom-dropdown-item-sort.procom-active .procom-sort-icon {
  color: #ffffff !important;
  opacity: 1;
}

/* ==================== PROYECTOS EN PROGRESO ==================== */
.proyecto-enprogreso-item {
  background: linear-gradient(135deg, #ffffff 0%, #fff5f5 50%, #ffe6e6 100%);
  padding: 24px;
  border-radius: 18px 18px 4px 18px;
  box-shadow:
    0 2px 8px rgba(0, 0, 0, 0.08),
    0 1px 4px rgba(0, 0, 0, 0.04);
  cursor: pointer;
  margin-bottom: 16px;
  border: 1px solid #ffe6e6;
  color: #333333;
  position: relative;
  transition: all 0.3s ease;
  min-height: auto;
  height: auto;
}

.proyecto-enprogreso-item:hover {
  transform: translateY(-2px);
  box-shadow:
    0 4px 16px rgba(0, 0, 0, 0.12),
    0 2px 8px rgba(0, 0, 0, 0.08);
}

/* Barra inferior ROJIZA */
.proyecto-enprogreso-item::before {
  content: '';
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 6px;
  background: linear-gradient(90deg, #b32152, #c4275a, #d42d62) !important;
  border-radius: 0 0 6px 6px;
  opacity: 1;
  transition: opacity 0.3s ease;
  box-shadow: 0 2px 4px rgba(196, 39, 90, 0.3);
}

.proyecto-enprogreso-item.procom-cargando {
  opacity: 0.6;
  pointer-events: none;
}

/* ==================== HEADER DEL PROYECTO EN PROGRESO ==================== */
.proyecto-enprogreso-header {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  margin-bottom: 14px;
  padding-bottom: 12px;
  border-bottom: 1px solid rgba(241, 243, 244, 0.8);
  position: relative;
  z-index: 11;
  gap: 12px;
  min-width: 0;
}

/* ==================== TÍTULO DEL PROYECTO - MOSTRAR COMPLETO ==================== */
.proyecto-enprogreso-nombre {
  flex: 1;
  min-width: 0;
  max-width: 100%;
}

.proyecto-enprogreso-nombre .proyecto-enprogreso-valor {
  font-size: 1.1rem;
  font-weight: 800;
  color: #b32152 !important;
  line-height: 1.3;
  display: block;
  text-shadow: 0 1px 2px rgba(179, 33, 82, 0.15);
  transition: all 0.2s ease;
  white-space: normal;
  overflow: visible;
  text-overflow: unset;
  max-width: 100%;
  word-wrap: break-word;
  word-break: break-word;
  max-height: none;
  /* Aplicado Mayúsculas */
  text-transform: uppercase;
}

/* ==================== BADGES DE ESTADO ==================== */
.proyecto-enprogreso-badges {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
  position: relative;
  z-index: 12;
  align-items: flex-start;
}

.badge-estado-enprogreso {
  padding: 6px 14px;
  border-radius: 20px;
  font-size: 0.75rem;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  backdrop-filter: blur(12px);
  border: 1.5px solid;
  transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
  box-shadow:
    0 2px 8px rgba(105, 38, 38, 0.08),
    inset 0 1px 0 rgba(255, 255, 255, 0.2);
  white-space: nowrap;
  position: relative;
  overflow: hidden;
  cursor: pointer;
}

/* Efecto de brillo al hover */
.badge-estado-enprogreso::before {
  content: '';
  position: absolute;
  top: 0;
  left: -100%;
  width: 100%;
  height: 100%;
  background: linear-gradient(
    90deg,
    transparent,
    rgb(255, 255, 255),
    transparent
  );
  transition: left 0.6s ease;
}

.badge-estado-enprogreso:hover::before {
  left: 100%;
}

.badge-estado-enprogreso:hover {
  transform: translateY(-2px) scale(1.05);
  box-shadow:
    0 4px 16px rgba(0, 0, 0, 0.12),
    inset 0 1px 0 rgba(255, 255, 255, 0.3);
}

.badge-estado-enprogreso:active {
  transform: translateY(0) scale(1);
  transition: all 0.1s ease;
}

/* 🌹 Badge específico para En Progreso (Fondo Suave, Texto Rojo Fuerte) 🌹 */
.badge-estado-enprogreso[data-estado="en-proceso"] {
  /* Fondo muy claro, rojo bajo/rosado con transparencia */
  background: linear-gradient(
    135deg,
    rgba(255, 230, 230, 0.8) 0%,
    /* Rosado muy claro */
    rgba(255, 200, 200, 0.7) 100%
    /* Rosado ligeramente más oscuro */
  ) !important;

  /* Letra roja fuerte */
  color: #b32152 !important;

  /* Borde en rojo fuerte */
  border-color: #dc3545 !important;
  border-width: 1.5px;
  /* Mantenemos el grosor original */

  font-weight: 900;
  /* Texto más audaz */
  text-shadow: 0 1px 1px rgba(255, 255, 255, 0.8);
  /* Sombra blanca para contraste con fondo rosado */
}

/* Ajuste de Hover para el nuevo diseño (el hover debe oscurecerlo) */
.badge-estado-enprogreso[data-estado="en-proceso"]:hover {
  transform: translateY(-2px) scale(1.05);
  /* Mantenemos el lift/scale original */
  box-shadow:
    0 4px 16px rgba(0, 0, 0, 0.12),
    inset 0 1px 0 rgba(255, 255, 255, 0.3);

  /* Al hacer hover, el fondo se puede volver un poco más visible, pero manteniendo el texto rojo */
  background: linear-gradient(
    135deg,
    rgba(255, 220, 220, 0.9) 0%,
    rgba(255, 180, 180, 0.8) 100%
  ) !important;
  color: #861542 !important;
  /* Rojo más oscuro al hacer hover */
  border-color: #c82333 !important;
  /* Borde más profundo al hacer hover */
}

/* ==================== GRID DE INFORMACIÓN ==================== */
.proyecto-enprogreso-columnas {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
  gap: 10px;
  margin-bottom: 14px;
  position: relative;
  z-index: 11;
}

.proyecto-enprogreso-columna {
  display: flex;
  flex-direction: column;
  gap: 4px;
  padding: 10px;
  background: linear-gradient(135deg, rgba(248, 249, 250, 0.8) 0%, rgba(233, 236, 239, 0.8) 100%) !important;
  border-radius: 8px;
  border: 1px solid rgba(255, 255, 255, 0.6);
  box-shadow:
    0 1px 4px rgba(0, 0, 0, 0.04),
    inset 0 1px 0 rgba(255, 255, 255, 0.8);
  transition: all 0.2s ease;
  position: relative;
  z-index: 12;
  backdrop-filter: blur(10px);
}

.proyecto-enprogreso-columna:hover {
  transform: translateY(-1px);
  box-shadow:
    0 3px 10px rgba(0, 0, 0, 0.08),
    inset 0 1px 0 rgba(255, 255, 255, 0.9);
  background: linear-gradient(135deg, rgba(255, 255, 255, 0.9) 0%, rgba(248, 249, 250, 0.9) 100%) !important;
}

.proyecto-enprogreso-columna:hover .proyecto-enprogreso-icon {
  transform: scale(1.1);
  transition: transform 0.2s ease;
}

.proyecto-enprogreso-label {
  font-size: 0.7rem;
  font-weight: 800;
  color: #6c757d;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  /* Aplicado Espaciado */
  display: flex;
  align-items: center;
  gap: 4px;
}

/* ICONOS */
.proyecto-enprogreso-icon {
  font-size: 12px;
  /* AUMENTADO */
  opacity: 0.9;
  color: #861542 !important;
  transition: transform 0.2s ease;
}

.proyecto-enprogreso-valor {
  font-size: 0.85rem;
  font-weight: 700;
  color: #2c3e50;
  line-height: 1.2;
  display: block;
  /* Aplicado Mayúsculas */
  text-transform: uppercase;
}

/* ==================== MENSAJE SIN PROYECTOS ==================== */
.proyecto-sin-tareas {
  text-align: center;
  padding: 60px 24px;
  color: #6c757d;
  font-size: 0.9rem;
  font-style: italic;
  background: linear-gradient(135deg, rgba(255, 255, 255, 0.95) 0%, rgba(248, 249, 250, 0.95) 100%) !important;
  border-radius: 16px;
  margin: 20px 0;
  border: 2px dashed rgba(196, 39, 90, 0.3);
  position: relative;
  z-index: 6;
  backdrop-filter: blur(20px);
  box-shadow: 0 4px 20px rgba(0, 0, 0, 0.08);
}

.proyecto-sin-tareas .sin-tareas-icon {
  margin-bottom: 20px;
  opacity: 0.6;
}

.proyecto-sin-tareas .no-data-icon {
  font-size: 48px;
  color: #c4275a;
  opacity: 0.5;
}

.proyecto-sin-tareas p {
  font-size: 1.1rem;
  font-weight: 600;
  color: #495057;
  margin-bottom: 8px;
}

.proyecto-sin-tareas small {
  font-size: 0.8rem;
  color: #6c757d;
  opacity: 0.8;
}

/* ==================== RESPONSIVE DESIGN ==================== */
@media (max-width: 768px) {
  .procom-proceso-container {
    padding: 12px;
  }

  .resumen-metricas-container {
    margin-bottom: 12px;
    padding: 8px 10px;
    gap: 8px;
    min-height: 48px;
    flex-wrap: wrap;
  }

  .controles-izquierdo,
  .controles-derecho {
    gap: 6px;
    width: 100%;
    height: 38px;
  }

  .conteo-proyectos-card,
  .visualizacion-control-container,
  .procom-sort-control-container {
    height: 38px !important;
    min-width: auto;
    flex: 1;
  }

  .conteo-proyectos-card {
    padding: 0 10px !important;
    min-width: 70px;
  }

  .visualizacion-control-container {
    padding: 0 8px !important;
    min-width: 100px;
  }

  .procom-sort-control-container {
    min-width: 120px;
  }

  .conteo-valor {
    font-size: 1.1rem;
  }

  .procom-sort-button {
    padding: 0 10px !important;
    font-size: 0.65rem !important;
    height: 38px !important;
  }

  .proyecto-enprogreso-header {
    flex-direction: column;
    align-items: flex-start;
    gap: 8px;
    margin-bottom: 12px;
    padding-bottom: 10px;
  }

  .proyecto-enprogreso-badges {
    width: 100%;
    justify-content: flex-start;
    margin-top: 8px;
  }

  .proyecto-enprogreso-columnas {
    grid-template-columns: 1fr;
    gap: 8px;
  }

  .proyecto-enprogreso-item {
    padding: 14px;
  }

  .proyecto-enprogreso-nombre .proyecto-enprogreso-valor {
    font-size: 1rem;
    white-space: normal;
    overflow: visible;
    text-overflow: unset;
    max-height: none;
  }
}

@media (max-width: 480px) {
  .procom-proceso-container {
    padding: 8px;
  }

  .controles-izquierdo,
  .controles-derecho {
    height: 36px;
  }

  .conteo-proyectos-card,
  .visualizacion-control-container,
  .procom-sort-control-container {
    height: 36px !important;
  }

  .conteo-valor {
    font-size: 1rem;
  }

  .proyecto-enprogreso-item {
    padding: 12px;
  }

  .proyecto-enprogreso-nombre .proyecto-enprogreso-valor {
    font-size: 1rem;
  }

  .badge-estado-enprogreso {
    padding: 4px 10px;
    font-size: 0.65rem;
  }
}
/* =================================================================
    AJUSTES PARA FORZAR MAYÚSCULAS EN EL DISEÑO COMPLETO
    (Aseguramos que todos los textos clave estén en mayúsculas)
    ================================================================= */

/* 1. Botones de Control (Visualización y Ordenamiento) - YA APLICADOS ARRIBA, PERO REITERADOS AQUÍ POR COMODIDAD */
.visualizacion-texto {
  text-transform: uppercase !important;
}

.procom-sort-button {
  text-transform: uppercase !important;
}

.procom-dropdown-item-sort {
  text-transform: uppercase !important;
}

/* 2. Proyectos Completados (Para cuando los necesites) */
.proyecto-completado-nombre .proyecto-completado-valor {
  text-transform: uppercase;
}

.proyecto-completado-label {
  text-transform: uppercase !important;
  letter-spacing: 0.08em;
}

.proyecto-completado-valor {
  text-transform: uppercase;
}

/* 3. >>> PROYECTOS EN PROCESO (Confirmado) <<< *

/* TÍTULO DEL PROYECTO */
.proyecto-enprogreso-nombre .proyecto-enprogreso-valor {
  text-transform: uppercase;
}

/* ETIQUETAS/LABELS (Inicio, Fin, Encargado, Progreso) */
.proyecto-enprogreso-label {
  text-transform: uppercase !important;
  letter-spacing: 0.08em;
}

/* VALORES DENTRO DE LAS COLUMNAS (Fechas, Responsable) */
.proyecto-enprogreso-columna .proyecto-enprogreso-valor {
  text-transform: uppercase;
}

/* ETIQUETA DEL CONTADOR DE PROYECTOS */
.conteo-proyectos-card .conteo-label {
  text-transform: uppercase;
}

.proyecto-proceso-sin-tareas {
    display: flex;
    align-items: center; 
    justify-content: center; 
    gap: 10px;
    padding: 10px 15px;
    background-color: #fff;
    border: 1px solid #eee;
    border-radius: 6px;
    color: #888;
}

.sin-tareas-mini-icon {
    font-size: 1.2rem;
    color: #aaa;
}

.proyecto-proceso-sin-tareas span {
    font-size: 0.85rem;
    font-style: italic;
}