/**
* $Id: xtubestyle.css
* Module: XoopsTube
*/

/* --- MEJORA DE VISIBILIDAD SOFTOMIC --- */

.xoopstube_button {
    padding-right: 0.5em;
    padding-left: 0.5em;
    padding-bottom: 3px;
    padding-top: 2px;
    background-image: url(images/icon/backgnd.png);
    background-position: center center;
    background-repeat: repeat-x;
    color: #ffffff; /* Letras blancas */
    font-size: smaller;
    font-weight: bold;
    font-family: Verdana, Arial, Helvetica, sans-serif;
    cursor: pointer;
    border: outset 1px #333;
    white-space: nowrap;
}

.xoopstube_letters {
    margin-bottom: 8px;
    margin-top: 8px;
    padding-right: 0.5em;
    padding-left: 0.5em;
    padding-bottom: 1px;
    padding-top: 1px;
    background-color: #1a1a1a; /* Fondo oscuro */
    color: #ffffff;
    font-size: smaller;
    font-weight: bold;
    line-height: 16pt;
    cursor: pointer;
    border: 1px solid #000;
}

.xoopstube_itemTitle a {
    font-size: 130%;
    font-weight: bold;
    font-variant: small-caps;
    color: #FFFFFF !important;
    background-color: #1a1a1a !important; /* Fondo negro para el título */
    padding: 5px 10px;
    display: block;
}

/* Oscurecer los bloques grises de descripción e info */
.xoopstube_description {
    padding: 8px;
    margin: 4px;
    background-color: #222222 !important; /* Gris casi negro */
    border: 1px solid #444444;
    color: #ffffff !important; /* Texto blanco */
}

.xoopstube_infoblock {
    padding: 8px;
    margin-left: 10px;
    margin-right: 5px;
    background-color: #1a1a1a !important; /* Fondo negro */
    border: 1px solid #333;
    font-size: 85%;
    color: #ffffff !important; /* Texto blanco */
}

/* Forzar que los títulos de los paneles se vean oscuros */
.panel-heading, .xoopstube_legend1 {
    background-color: #1a1a1a !important;
    color: #ffffff !important;
    border-bottom: 1px solid #000;
}

div.xoopstube_socbookmark a img {
    opacity: .6;
    filter: alpha(opacity = 60);
}

div.xoopstube_socbookmark a:hover img {
    opacity: 1;
    filter: alpha(opacity = 100);
}
/* Oscurecer la barra de navegación (Breadcrumb) */
.breadcrumb {
    background-color: #1a1a1a !important; /* Fondo negro/gris oscuro */
    border: 1px solid #333 !important;
    padding: 10px 15px !important;
    margin-top: 10px !important;
}

/* Forzar que los enlaces de la navegación sean blancos */
.breadcrumb li, .breadcrumb li a {
    color: #ffffff !important;
    font-weight: bold !important;
}

/* Cambiar el color del separador ":" si es necesario */
.breadcrumb li + li::before {
    color: #888 !important;
}
/* Oscurecer el cuadro de las letras (orden alfabético) y paneles generales */
.panel-default > .panel-body, .itemPermaLink {
    background-color: #1a1a1a !important;
    color: #ffffff !important;
    border: 1px solid #333 !important;
}

/* Oscurecer la lista de categorías (Remember 80's, etc.) */
.list-group-item {
    background-color: #222222 !important;
    color: #ffffff !important;
    border: 1px solid #444 !important;
}

/* Forzar que los enlaces de las categorías sean blancos */
.list-group-item a, .list-group-item b {
    color: #ffffff !important;
}

/* Oscurecer el cuadro de aviso (Please report...) */
.alert-info {
    background-color: #0d3b66 !important; /* Azul muy oscuro */
    color: #ffffff !important;
    border-color: #000000 !important;
}

/* Efecto hover para las letras (que resalten al pasar el ratón) */
.xoopstube_letters:hover {
    background-color: #ffffff !important;
    color: #000000 !important;
}
/* Oscurecer el bloque de datos (Publicó, Fecha, Visitas, Tiempo) */
.panel-body span.glyphicon, .panel-body small, .panel-body b {
    color: #ffffff !important; /* Forzar texto blanco en los detalles */
}

/* Oscurecer el fondo de toda la caja de información del vídeo */
.panel.panel-default, .panel-body {
    background-color: #1a1a1a !important; /* Negro azulado */
    color: #ffffff !important;
    border: 1px solid #333 !important;
}

/* Oscurecer la zona de la descripción */
.label-danger {
    background-color: #8b0000 !important; /* Rojo oscuro para que no brille tanto */
    color: #ffffff !important;
}

/* Asegurar que el texto de la descripción sea blanco */
div[style*="padding:10px;"] {
    color: #ffffff !important;
}

/* Quitar líneas claras que separan los bloques (legend) */
.xoopstube_legend1 {
    border-bottom: 1px solid #333 !important;
    background-color: transparent !important;
}
/* Oscurecer el aviso de cantidad de categorías y vídeos (alert-warning) */
.alert-warning {
    background-color: #332b00 !important; /* Marrón/Dorado muy oscuro */
    color: #ffffff !important;
    border: 1px solid #665500 !important;
}

/* Oscurecer la leyenda inferior (Novedad de hoy, etc.) */
.xoopstube_legend {
    background-color: #1a1a1a !important;
    padding: 15px !important;
    border-radius: 4px;
    border: 1px solid #333;
    text-align: left !important;
}

/* Ajustar las etiquetas de colores para que no sean tan brillantes */
.label-primary {
    background-color: #003366 !important; /* Azul oscuro */
}
.label-success {
    background-color: #004d00 !important; /* Verde oscuro */
}

/* Forzar el texto en blanco para los contadores (b e i) */
.alert-warning b, .alert-warning i {
    color: #ffcc00 !important; /* Un amarillo suave para que resalte el número */
}
/* Oscurecer el contenedor principal del vídeo y alertas */
.panel, .panel-default, .well, .alert-info {
    background-color: #1a1a1a !important; /* Fondo negro */
    color: #ffffff !important;           /* Texto blanco */
    border: 1px solid #333 !important;
}

/* Forzar que los iconos (glyphicon) sean blancos */
.glyphicon {
    color: #ffffff !important;
}

/* Oscurecer el fondo de la zona de descripción */
.panel-body {
    background-color: #1a1a1a !important;
}
/* FORZADO TOTAL DE OSCURO PARA PANELES BOOTSTRAP */
.panel.panel-default, 
.panel-default > .panel-body, 
.img-thumbnail, 
div[style*="float: right; width: 250px;"] {
    background-color: #1a1a1a !important;
    color: #ffffff !important;
    border: 1px solid #333 !important;
}

/* Forzar que los textos dentro de esos paneles sean blancos */
.panel-body, .panel-body b, .panel-body span, .panel-body a {
    color: #ffffff !important;
}

/* Quitar el fondo blanco de la miniatura */
.img-thumbnail {
    padding: 2px !important;
    background-color: #000 !important;
}

/* Arreglar la leyenda que separa los bloques */
.xoopstube_legend1 {
    border-color: #444 !important;
    margin-top: 5px !important;
    margin-bottom: 5px !important;
}
/* Oscurecer la barra gris del Juego al Azar en MyLinks */
div[style*="background-color: #ccc"] {
    background-color: #1a1a1a !important; /* Negro/Gris oscuro */
    color: #ffffff !important;
    border: 1px solid #333 !important;
}

/* Forzar que el enlace (Arcade) sea blanco */
div[style*="background-color: #ccc"] a {
    color: #ffffff !important;
    text-shadow: 1px 1px 1px #000;
}

/* Ajustar el texto inferior (Pacman) para que se lea mejor */
div[style*="color: #456"] {
    color: #bbbbbb !important; /* Gris claro para el texto secundario */
}

div[style*="color: #456"] a {
    color: #ffffff !important; /* Blanco para el nombre del juego */
}
/* ARREGLO PARA LOS NÚMEROS DE CATEGORÍA (BADGES) */
.list-group-item .badge {
    background-color: #ff6600 !important; /* Fondo naranja Softomic */
    color: #ffffff !important;            /* Número en blanco */
    font-weight: bold !important;
    text-shadow: 1px 1px 1px #000;       /* Sombra para que se lea mejor */
    border: 1px solid #333;
}

/* Color del número al pasar el ratón por la categoría */
.list-group-item:hover .badge {
    background-color: #ffffff !important;
    color: #ff6600 !important;
}