/* --- Estilo del Breadcrumb (Asumiendo que lo dejaste en scroll.css) --- */
.breadcrumb {
    /* Fondo blanco o muy claro */
    background-color:  #1c1c24  !important; /* Gris muy claro */
    border: 1px solid  #1c1c24 ; /* Borde sutil */
    border-radius: 0.25rem;
    padding: 0.5rem 1rem;
}
.breadcrumb-item a {
    color: #cfcfcf; /* Texto gris oscuro para enlaces */
}
.breadcrumb-item.active {
    color: #dfdfdf; /* Texto gris más claro para el activo */
}


/* --- Estilo de la barra de desplazamiento (Scrollbar) --- */

/* 1. Definición general de la barra (Visible, pero delgada) */
::-webkit-scrollbar {
    width: 6px; /* Hacemos la barra delgada (por defecto) */
    height: 6px; 
    opacity: 0.5; /* Propiedad que no siempre funciona directamente en este selector */
    transition: background-color 0.4s, opacity 0.4s, width 0.4s;
}

/* 2. El fondo de la pista/canal */
::-webkit-scrollbar-track {
    background: #2a2a33; /* Fondo oscuro del tema Corona */
}

/* 3. La barra (thumb/pulgar) - Aquí definimos la transparencia por defecto */
::-webkit-scrollbar-thumb {
    /* Color gris del tema */
    background: rgba(108, 117, 125, 0.3); /* Gris con 30% de opacidad (casi transparente) */
    border-radius: 10px;
    border: 1px solid rgba(108, 117, 125, 0.1);
}

/* 4. Muestra la barra completamente (100% visible) al hacer hover en el cuerpo del documento */
html:hover::-webkit-scrollbar-thumb {
    background: rgba(108, 117, 125, 1); /* Gris 100% opaco */
    width: 8px; /* Opcional: la hacemos ligeramente más gruesa al tocarla */
    border: 1px solid rgba(108, 117, 125, 1);
}

/* 5. Estilo al pasar el mouse directamente sobre la barra (opcional pero recomendado) */
::-webkit-scrollbar-thumb:hover {
    background: rgba(142, 148, 156, 1); /* Gris más claro al pasar el mouse */
}

/* Opcional: Para el cuerpo de la página si el desplazamiento es en el body/html */
html {
    overflow-y: scroll; /* Asegura que el scrollbar siempre exista (aunque delgado) */
}