.Button__btnFont {
  /* Colores y Estilo Visual */
  background-color: #48D9C3 !important;
  color: #000 !important;
  font-weight: 700;
  font-size: 0.85rem;
  letter-spacing: 0.5px;
  
  /* Estructura y Forma */
  border: none !important; 
  border-radius: 20px !important;
  padding: 12px 25px !important;
  cursor: pointer;
  text-decoration: none;
  
  /* EL TRUCO PARA CENTRAR */
  display: block !important;    
  width: fit-content !important; 
  margin: 20px auto 0 !important; 
  
  /* Animación */
  transition: all 0.3s ease;
}

/* Efecto Hover (Cambio a color coral/rojizo) */
.Button__btnFont:hover {
  background-color: #ff7d6d !important;
  color: #fff !important; 
  transform: scale(1.05); 
  box-shadow: 0 5px 15px rgba(230, 114, 102, 0.4);
}

.AppContainer__backToTop {
  background-color: #FAE38E !important;
  color: #ffffff;
  width: 45px;
  height: 45px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: background-color 0.3s ease, transform 0.2s ease;
}

.AppContainer__backToTop:hover {
  background-color: #ff7d6d !important;
  
}

/*TITULO */
.LayoutListContainer__title,
.LayoutListContainer__description {
  padding: 1px 60px;
}
/*--------------------------*/
/* Contenedor principal */
.LayoutListContainer__layoutList{
  padding: 20px;
}

/* Contenedor principal para mantener simetría */

.DepartmentList__deptListItem{
  border: 1px solid #f1d87e !important; 
  border-radius: 20px !important;
}

.DepartmentList__deptList {
    display: grid !important;
    grid-template-columns: repeat(auto-fill, minmax(320px, 1fr));
    margin: 20px;
    padding: 20px 10px;
}

/* Tarjeta con degradado de Amarillo a Blanco */
.DepartmentList__listContent {
    /* Degradado lineal: empieza en el amarillo arriba y termina en blanco abajo */
    background: linear-gradient(135deg, #E8E8E8 0%, #ffffff 60%, #E0E0E0 100%) !important;
    
    border: 1px solid #48D9C3 !important; /* Un borde muy sutil para dar definición */
    border-radius: 20px !important;
    padding: 20px !important;
    
    /* Tamaño uniforme */
    min-height: 340px; 
    display: flex !important;
    flex-direction: column !important;
    
    transition: all 0.4s cubic-bezier(0.165, 0.84, 0.44, 1);
   	box-shadow: 0 4px 10px rgba(0, 0, 0, 0.03);
   
}



/* Títulos con mejor contraste */
.DepartmentList__deptName, 
.DepartmentList__deptListItem h3 {
    font-size: 1.25rem;
    font-weight: 700;
    color: #2c3e50;
    margin-bottom: 12px;
    min-height: 2.8em;
}

/* Descripción */
.DepartmentList__deptDesc {
    font-size: 0.92rem;
    color: #5d6d7e;
    line-height: 1.6;
    flex-grow: 1; /* Empuja el botón hacia abajo */
    margin-bottom: 25px;
}

/* Botón estilo "pill" con el verde de la marca */
.DepartmentList__submitTicketBtn,
.DepartmentList__deptListItem a {
    /* Usar Flexbox es la forma más segura de centrar texto */
    display: flex !important;
    align-items: center; /* Centrado vertical */
    justify-content: center; /* Centrado horizontal */
    
    color: black !important;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    font-size: 0.85rem;
    font-weight: 700;
    padding: 12px 25px;
    
}

.DepartmentList__submitTicketBtn:hover {
    background-color: #48D9C3 !important;
}

/* Efecto al pasar el mouse: se aclara un poco y se eleva */
.DepartmentList__deptListItem:hover {
    transform: translateY(-8px);
    box-shadow: 0 8px 20px rgba(72, 217, 95, 0.4); 
}


/*titulo_card*/
.Link__link {
    background-color: none !important;
    color: black !important;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    font-size: 0.85rem;
    font-weight: 700;
    padding: 12px 25px;
   
    text-align: center;
    text-decoration: none;
    align-self: none;
    box-shadow: none;
    transition: none;
}
 /*FORMULARIOS*/
/*Esconder Titulo Comunicaciones*/
h1.LayoutListContainer__title{
  display: none !important;
  Visibility:hidden !important;
} 

/*Ocultar titulo Diseño*/
#field_layoutId{
  Visibility:hidden !important;
  display: none !important;
}

/*Color */
.ScrollSticky__type2{
  background-color: transparent !important; 
}

/*Imagen de los tiempos de entrega*/
.docsimage{
	border-radius: 10px;
}

.overlay {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(0, 0, 0, 0.5); /* Fondo semitransparente */
  display: none; /* Inicialmente oculto */
}