/*  phpBB3 Style Sheet
    --------------------------------------------------------------
	Style name:			kronic
	Based on style:		prosilver (the default phpBB 3.3.x style)
	Original author:	Tom Beddard ( http://www.subblue.com/ )
	Modified by:		nextgen ( https://www.nextgen.gt/ )
    --------------------------------------------------------------
*/

@import url('https://fonts.googleapis.com/css2?family=Rajdhani:wght@300;400;500;600;700&display=swap');
@import url("../../prosilver/theme/normalize.css?hash=48eb3f89");
@import url("../../prosilver/theme/base.css?hash=7c5543be");
@import url("../../prosilver/theme/utilities.css?hash=d8f72c42");
@import url("../../prosilver/theme/common.css?hash=a9741ba1");
@import url("../../prosilver/theme/links.css?hash=18286e16");
@import url("../../prosilver/theme/content.css?hash=be57a41d");
@import url("../../prosilver/theme/buttons.css?hash=56f0d25f");
@import url("../../prosilver/theme/cp.css?hash=50d868ab");
@import url("../../prosilver/theme/forms.css?hash=b64464fb");
@import url("../../prosilver/theme/icons.css?hash=64da33ce");
@import url("responsive.css?hash=87b53e02");
@import url("kronic.css");

/* *********** Nuevo estilo para las listas de descargas ************* */
.dd_row {
	list-style: none;
	border-bottom: 1px solid var(--border01);
	line-height: 17px;
	/*background-color:#f3f3f3;*/
	background-color: var(--color14);
	padding: 0 10px;
	min-height: 45px;
}
        
.dd_rel {
	min-height: 28px;
}
		
.anime_list {
	min-height: 0;
}
		
.ars_row {
	min-height: 17px;
	color: var(--color13);
}
		
.dd_row a {
	color: var(--color13);;
}
		
.dd_row:hover {
	background-color: var(--color04);
}
		
.dd_row h5 {
	background-color: transparent;
	padding: 0;
	font-size: 11px;
	font-weight: normal;
}
		
.dd_header {
	font-weight: bold;
	color: var(--color13);
	background-color: var(--color03);
	font-size: 11px;
	min-height: 17px;
	margin-top: 2px;
}
			
.dd_header li {
	background-color: transparent !important;
}
				
.dd_header li.rating {
	padding: 5px 0 !important;
}
		
.dd_row li {
	padding: 5px 0;
}
			
.dd_row li.dd_type, .dd_row li.am_type {
	width: 25px;
	float: left;
	text-align: center;
}
			
.dd_row li.dd_anime img {
	background-image: url("/images/anime/icons/anime.gif");
}
				
.dd_row li.dd_manga img {
	background-image: url("/images/anime/icons/manga.gif");
}
            
.dd_row li.dd_epnum {
    width: 75px;
    float: left;
	text-align: right;
}
			
.dd_row li.am_type {
	padding: 3px 0;
}
			
.dd_row li.dd_type img, .dd_row li.am_type img {
	margin-top: 4px;
}
			
.dd_row li.rank {
	width: 40px;
	padding-left: 5px;
	color: var(--border03);
	float: left;
}
			
.dd_row li.favorite {
	float: right;
	width: 16px;
	padding: 4px 0 4px 10px;
}
			
.dd_row li.dd_title {
	/* margin-right: 365px; */
	min-width: 376px;
}
			
.dd_row li.dd_title i {
	color: var(--icon-gray);
	font-size: 10px;
}
			
.dd_row li.dd_title span a {
	/* color: #4497ff; */
	color: var(--color02);
}
			
.dd_row li.dd_update {
	width: 215px;
	padding-left: 10px;
	float: right;
	background-color: var(--color04);
			}
            
.dd_row li.dd_read {
	width: 26px;
	padding-left: 10px;
	float: right;
    padding-bottom: 0;
}
			
.dd_row li.dd_joined {
	width: 136px;
	padding-left: 10px;
	float:right;
}
			
.dd_row li.dd_publish {
	width: 50px;
	padding-left: 10px;
	float: right;
}
			
.dd_row li.no_rating {
	padding: 7px 2px 0 10px;
	width: 13px;
	float: right;
}
			
.dd_row li.uploads {
	width: 100px;
	text-align: center;
	float: right;
}
			
.dd_row li.rating {
	padding: 7px 0;
	width: 75px;
	float: right;
}
			
.dd_row li.edit {
	width: 37px;
	float: right;
	padding: 4px 0;
}
			
.dd_row li.edit a {
	outline: none;
}
				
.dd_row li.edit span {
	padding: 2px 0 1px 0
}
			
.dd_row li.edit a img, .dd_row li.edit span {
	border-left: 1px solid var(--icon-gray);
	padding-left: 10px;
	opacity: 0.5;
	filter: alpha(opacity=50);
}
				
.dd_row li.edit a:hover img, .dd_row li.edit span:hover {
	opacity: 1;
	filter: alpha(opacity=100);
}
			
div.full_content .dd_row li.dd_update {
	width:240px;
}
				
div#user_actions .dd_row {
	color: var(--color02);
}
				
div#user_actions .dd_row a {
	text-decoration: none;
}
					
div#user_actions .dd_row a:hover {
	text-decoration: underline;
}
				
div#user_actions .dd_row li.dd_update {
	width: 150px;
	background-color: transparent;
				}
#caja_de_bienvenida {
    margin: 10px 0;
	color: var(--color01);
    border: 1px solid rgba(211,17,65,0.2);
    background-color: rgba(211,17,65,0.2);
    padding: 5px 10px 8px 10px;
	border-radius: var(--kronic-border-radius-m);
}
        
#caja_de_bienvenida a {
	color: var(--color14);
	/*text-transform: uppercase;*/
	text-decoration: none;
            }
            
#caja_de_bienvenida a.new_r {
    font-weight: bold;
                }
            
#caja_de_bienvenida a:hover {
    text-decoration: underline;
}
        
/*#caja_de_bienvenida legend {
    background-color: #292F21;
    color: #BCE27F;
    padding: 3px 10px;
    margin-left: 5px;
    font-weight: bold;
}*/
            
#caja_de_bienvenida div.anime_box {
    margin-bottom: 5px;
}
            
#caja_de_bienvenida div.anime_box a {
    color: var(--color-link01);
}
                
#caja_de_bienvenida div.manga_box a {
    color: var(--color-link01);
}

div.rimg {
	float: left;
	width: 90px;
	padding-right: 15px;
}
	
div.rimg img {
	padding: 3px;
	border: 1px solid var(--color02);
}
	
div.rtext {
	float: left;
	width: 40%;
	max-width: 479px;
	padding-right: 30px;
		margin-top: -2px;
}
	
div.rfinfo {
	float: left;
	width: 102px;
	padding: 1px 9px 0 0;
	text-align: right;
    font-size: 10px;
    line-height: 13px,
}

div.rfinfo img {
	padding-left: 9px;
}
		
div.rfinfo span {
	display: block;
}
		
div.rfinfo span.pad {
	padding-bottom: 10px;
}
	
div.rflinks {
	float: left;
}
	
div.rflinks a {
	margin-right: 5px;
}
		
div.rflinks a.l {
	margin-right: 0;
}
	
div.rflinks span {
	display: block;
}
		
div.rflinks span.pad {
	padding-bottom: 5px;
}
    
div.rfline {
    font-size: 10px;
    height: 16px;
}
    
div.rfline span.pad {
    padding-right: 15px;
}
        
div.rfline span.pad img {
    margin-bottom:-3px;
}

/* BEGIN @include wiki_addon.css */ 
 .blg-wk-list-simple, .blg-wk-list-thumbnail, .blg-wk-list-full {
	list-style-type: none;
}

.blg-wk-list-simple li {
	display: block;
	margin: 4px 0;
}

.blg-wk-list-thumbnail {
	text-align: center;
}

.blg-wk-list-thumbnail li {
	display: inline-block;
	height: 100px;
	margin: 4px;
	overflow: hidden;
	width: 100px;
}

.blg-wk-list-thumbnail li img {
	height: auto;
	max-width: 100%;
}

.blg-wk-list-full li {
    border-bottom: dashed 1px #CCC;	
	padding-bottom: 5px;
	display: block;
	margin-bottom: 7px;
	min-height: 60px;
	position: relative;
}

.blg-wk-list-full img {
	float: left;
	max-height: 60px;
	width: 12%;
}

.blg-wk-list-full .wk-row-title {
	font-size: 1.05em;
	font-weight: bold;
	margin-left: 5px;
	color: var(--color-link01);
}

.blg-wk-list-full .wk-row-text {
	display: block;
	margin: 2px 0 0 65px;
} 

.blg-wk-list-full li:last-child {
    border-bottom: none;
}

 /* END @include wiki_addon.css */ 


#g4-search-box {
	margin-top: -70px;
	position: relative;
}

.googlesearch h1 {
	color: #333333 !important;
}

/* User Ranks Custom */
.userbadge-anacre-admin dd.profile-rank:before, .userbadge-anacre-admin dl.custom-rank dd:before, .userbadge-anacre-mod dd.profile-rank:before, .userbadge-anacre-mod dl.custom-rank dd:before, 
.userbadge-anacre-enciclopedia dd.profile-rank:before, .userbadge-anacre-enciclopedia dl.custom-rank dd:before, .userbadge-anacre-rawh dd.profile-rank:before, .userbadge-anacre-rawh dl.custom-rank dd:before,
.userbadge-anacre-uploader dd.profile-rank:before, .userbadge-anacre-uploader dl.custom-rank dd:before {
	font-family: FontAwesome;
	font-size: 16px;	
}

.userbadge-anacre-admin .custom-rank dd, .userbadge-anacre-mod dl.custom-rank dd, .userbadge-anacre-enciclopedia dl.custom-rank dd, .userbadge-anacre-rawh dl.custom-rank dd, .userbadge-anacre-uploader dl.custom-rank dd {
	line-height: 23px !important;
}

.userbadge-anacre-admin dd.profile-rank, .userbadge-anacre-admin dl.custom-rank dd, .userbadge-anacre-mod dd.profile-rank, .userbadge-anacre-mod dl.custom-rank dd,
.userbadge-anacre-enciclopedia dd.profile-rank, .userbadge-anacre-enciclopedia dl.custom-rank dd, .userbadge-anacre-rawh dd.profile-rank, .userbadge-anacre-rawh dl.custom-rank dd,
.userbadge-anacre-uploader dd.profile-rank, .userbadge-anacre-uploader dl.custom-rank dd {
	background-color: var(--color01);
	color: var(--color14);
	text-align: center;
	width: 120px;
	max-width: 100%;
	height: 23px;
	line-height: 24px;
}

/* Admin Icon */
.userbadge-anacre-admin dd.profile-rank:before, .userbadge-anacre-admin dl.custom-rank dd:before {
	content: '\f084';
	background-color: var(--icon-orange);
	/*background-color: rgba(0,0,0,0.2);*/
	width: 24px;
	float: left;
}

/* Moderator Icon */
.userbadge-anacre-mod dd.profile-rank:before, .userbadge-anacre-mod dl.custom-rank dd:before {
	content: '\f132';
	background-color: var(--icon-green);
	/*background-color: rgba(0,0,0,0.2);*/
	width: 24px;
	float: left;
}

/* Enciclopedia Icon */
.userbadge-anacre-enciclopedia dd.profile-rank:before, .userbadge-anacre-enciclopedia dl.custom-rank dd:before {
	content: '\f044';
	background-color: var(--color-link01);
	/*background-color: rgba(0,0,0,0.2);*/
	width: 24px;
	float: left;
}

/* Raw Hunter Icon */
.userbadge-anacre-rawh dd.profile-rank:before, .userbadge-anacre-rawh dl.custom-rank dd:before {
	content: '\f1e5';
	background-color: var(--icon-orange);
	/*background-color: rgba(0,0,0,0.2);*/
	width: 24px;
	float: left;
}

/* Uploader Icon */
.userbadge-anacre-uploader dd.profile-rank:before, .userbadge-anacre-uploader dl.custom-rank dd:before {
	content: '\f019';
	background-color: #9900FF;
	/*background-color: rgba(0,0,0,0.2);*/
	width: 24px;
	float: left;
}
/* Estilo general */
#home-wrap {
    width: 100%;
    box-sizing: border-box;
    padding: 0 10px 20px; /* Para no tocar los bordes de la página */
}

/* Barra lateral */
#extras {
    width: 30%;  /* Ocupa un 30% del ancho por defecto */
    flex-shrink: 0;  /* Asegura que la barra lateral no se reduzca */
    padding-left: 20px;  /* Espaciado a la izquierda */
    box-sizing: border-box; /* Asegura que el padding no afecte al tamaño total */
}

@media (max-width: 1220px) and (min-width: 992px) {
    #extras {
        display: grid; /* Cambia a un contenedor de cuadrícula */
        grid-template-columns: repeat(3, 1fr); /* Divide en 3 columnas iguales */
        gap: 10px; /* Espacio entre columnas */
        width: 100%; /* Asegura que ocupe todo el ancho disponible */
        padding: 10px 0; /* Elimina cualquier padding que pueda afectar el diseño */
    }
}


/* En pantallas medianas (menos de 992px) */
@media (max-width: 992px) {
    #extras {
        width: 100%;  /* En pantallas medianas, la barra lateral ocupa el 100% del ancho */
        padding-left: 0; /* Reducimos el padding izquierdo para dispositivos medianos */
        margin-top: 0;  /* Eliminamos el margin-top innecesario */
    }
}

/* En pantallas pequeñas (menos de 768px) */
@media (max-width: 768px) {
    #extras {
        width: 100%;  /* La barra lateral sigue ocupando el 100% del ancho */
        padding-left: 0; /* Reducimos aún más el padding en pantallas pequeñas */
    }
}

/* En pantallas muy pequeñas (menos de 480px) */
@media (max-width: 480px) {
    #extras {
        width: 100%;  /* La barra lateral sigue ocupando el 100% del ancho */
        padding-left: 0; /* Mantener el padding reducido */
    }
}


/* Sección principal que incluye la portada y la sección de noticias */
.main-layout {
    display: flex;
    flex-direction: row;  /* Mantiene en fila para pantallas grandes */
    flex-wrap: wrap;  /* Permite que los elementos se acomoden en nuevas filas si es necesario */
    box-sizing: border-box;
    width: 100%;
}

/* Portada en la parte superior */
.home-cover {
    width: 100%;
    height: 400px;  /* Ajusta la altura de la portada */
    background-size: cover;
    background-position: center;
    border-radius: 8px;
    margin-bottom: 20px; /* Separar la portada de las noticias */
}

/* Contenedor para noticias y barra lateral */
.news-wrapper {
    display: flex;
    gap: 20px;
    width: 100%;
    flex-wrap: wrap;
}

/* Sección de noticias */
.news-section-wrapper {
	width: 70%;
    box-sizing: border-box;  /* Para evitar que el padding afecte el tamaño del contenedor */
}

.news-section {
    flex: 1;  /* Por defecto, la sección de noticias toma el 65% del ancho */
    display: grid;
    grid-template-columns: repeat(2, 1fr);  /* Dos columnas de noticias */
    gap: 10px 20px;
    box-sizing: border-box;  /* Para evitar que el padding afecte el tamaño del contenedor */
}

/* Noticias individuales */
.news-item {
    display: flex;
    flex-direction: column;  /* Por defecto, las noticias se apilan en vertical en pantallas pequeñas */
    background-color: var(--color14);
    border: 1px solid var(--border04);
	border-top: none;
    border-radius: 8px;
    overflow: hidden;
    margin-bottom: 10px;  /* Separar las noticias */
    width: 100%;  /* Asegura que ocupe todo el ancho disponible */
    box-sizing: border-box;
}

.news-cover {
    background-size: cover;
    background-position: center;
    min-height: 210px;
    width: 100%;  /* La imagen ocupa todo el ancho del contenedor */
	opacity: 0.8;
}

.news-content {
    padding: 16px;
    flex-grow: 1;
    font-size: larger;
}

.news-category {
    font-size: 14px;
    color: var(--icon-gray);
}

.news-title {
    font-size: 16px;
    margin-top: 10px;
}

.news-title a {
    color: var(--color13);
    text-decoration: none;
}

.news-title a:hover {
    color: var(--color-link01);
}

.news-info {
    margin-top: 10px;
    color: var(--icon-gray);
	font-size: 0.7rem;
}

.news-excerpt {
    margin-top: 5px;
    color: var(--color13);
    overflow: hidden; /* Oculta el texto que se desborda */
    text-overflow: ellipsis; /* Muestra los puntos suspensivos al final */
    white-space: nowrap; /* Impide que el texto se divida en varias líneas */
    display: block;
    width: 100%; /* Hace que el texto ocupe el contenedor completo */
    flex-grow: 1; /* Permite que el texto crezca si es necesario */	
}

.news-inner {
    line-height: 1.5em;
    font-size: 0.7rem;
}

/* Barra lateral */
.mini-panel {
    background-color: var(--color14);
    border: 1px solid var(--border04);
    border-radius: 8px;
    padding: 0 10px 10px;
    margin-bottom: 10px;
}

.mini-panel h3 {
    font-size: 14px;
    margin-bottom: 10px;
	margin-top: 10px;
    color: var(--color13);
}

.mini-panel p {
    font-size: 14px;
    color: var(--icon-gray);
}

/* Asegurarse de que los saltos de línea y espacios en blanco no afecten el diseño */
.news-excerpt br {
    display: none;
}

.news-excerpt p:empty,
.news-excerpt div:empty {
    display: none;
}

/* Responsividad: Ajustes para dispositivos móviles y tabletas */

/* En pantallas más grandes (más de 992px), las noticias se mantienen en 2 columnas */
@media only screen and (max-width: 1220px), only screen and (max-device-width: 1220px) {
    .main-layout {
        flex-direction: row; /* Los elementos se mantienen en fila */
    }

    .news-section-wrapper {
        width: 100%; /* Las noticias ocupan el 100% del ancho */
    }

    .news-section {
        grid-template-columns: repeat(2, 1fr); /* Dos columnas */
    }

    .news-item {
        flex-direction: column;  /* Asegura que el contenido se apile de arriba hacia abajo */
    }
	
    #extras {
		padding-left: 0;
    }	
}

/* En pantallas medianas (768px - 992px), las noticias y la barra lateral se reorganizan */
@media (max-width: 992px) {
    .main-layout {
        flex-direction: column; /* Los elementos se apilan en pantallas medianas */
    }

    #extras {
        width: 100%; /* Barra lateral en pantallas medianas ocupa 100% */
        margin-top: 20px;
    }

    .news-wrapper {
        flex-direction: column;  /* Apilar noticias y barra lateral */
    }

    .news-section {
        width: 100%; /* Las noticias ocupan el 100% del ancho */
        grid-template-columns: 1fr; /* Una sola columna */
    }

    .news-section-wrapper {
        width: 100%; /* Las noticias ocupan el 100% del ancho */
    }
	
    .news-item {
        width: 100%;  /* Asegura que las noticias ocupen todo el ancho */
    }

    .news-cover {
        height: 200px;
    }

    .news-title {
        font-size: 18px;
    }
}

/* En pantallas pequeñas (menos de 768px), las noticias y la barra lateral se apilan */
@media (max-width: 768px) {
    .news-section {
        grid-template-columns: 1fr; /* Una sola columna */
    }

    .news-item {
        width: 100%;  /* Asegura que las noticias ocupen todo el ancho */
    }

    .news-cover {
        height: 180px;
    }

    .news-title {
        font-size: 16px;
    }

    #extras {
        width: 100%;  /* La barra lateral ocupa todo el ancho */
    }

    .mini-panel h3 {
        font-size: 16px;
    }
}

/* En pantallas más pequeñas (menos de 480px), se ajustan tamaños de texto e imagen */
@media (max-width: 480px) {
    .news-item {
        width: 100%;  /* Asegura que las noticias ocupen todo el ancho */
    }

    .news-cover {
        height: 180px;
    }

    .news-title {
        font-size: 14px;
    }

    .page-link {
        padding: 8px 10px;
    }

    .global-notice {
        font-size: 12px;
    }

    .mini-panel h3 {
        font-size: 14px;
    }

    .mini-panel p {
        font-size: 12px;
    }
}

.news-section.grid-view {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
}

.news-section.list-view {
    display: block;
}

.news-section.list-view .news-item {
    display: flex;
    flex-direction: row;
    align-items: flex-start;
    margin-bottom: 15px; /* Espaciado entre noticias */
    box-sizing: border-box;  /* Evitar problemas con el tamaño */
    min-height: auto;  /* Permite que el contenedor se ajuste a la altura del contenido */
}

.news-section.list-view .news-cover {
    background-size: cover;
    background-position: center;
    min-height: 210px;  /* Altura mínima para la imagen */
    width: 25%;  /* La imagen ocupa un cuarto del contenedor */
    object-fit: cover; /* Escala la imagen para cubrir el área sin deformarse */
}

.news-section.list-view .news-content {
    width: 75%; /* El contenido ocupa el 75% del contenedor */
    display: flex;
    flex-direction: column;
    justify-content: flex-start; /* Alineación superior */
    padding: 10px 16px 0 16px; /* Agregar padding si es necesario */
    box-sizing: border-box;
}

.news-section.list-view .news-info {
	margin-top: 0;
}

.news-section.list-view .news-excerpt {
    overflow: hidden;
    text-overflow: ellipsis; /* Puntos suspensivos para el texto largo */
    white-space: nowrap; /* Evitar que el texto se divida */
    display: block;
    width: 100%; /* Hace que el texto ocupe el contenedor completo */
}

.news-content h2 {
    margin-bottom: 10px; /* Espaciado inferior */
}

/* Responsividad */
@media (max-width: 860px) {
    .news-section.list-view .news-cover {
        height: 180px; /* Mantiene proporciones */
        width: 100%;
    }

    .news-section.list-view .news-item {
		height: 100%;
        flex-direction: column;
    }

    .news-section.list-view .news-content {
        width: 95%;
		padding: 16px;
    }
}

@media (max-width: 768px) {
    .news-section.grid-view {
        grid-template-columns: 1fr;
    }

    .news-item {
        flex-direction: column;
    }
}

@media (max-width: 480px) {
    .news-section.list-view .news-cover {
        height: 180px;
    }

    .news-section.list-view .news-item {
        flex-direction: column;
        margin-bottom: 15px; /* Ajustamos el margen inferior */
    }
}

/* Contenedor general de los botones y pestañas */
.news-controls-container {
    display: flex;
    justify-content: flex-end; /* Alinea los botones a la derecha */
    align-items: center; /* Alinea verticalmente con las pestañas */
    /*margin: 0 auto;*/
	background-color: var(--color14);
	margin: 10px 0 10px auto;
	border-radius: var(--kronic-border-radius-l);
    max-width: 100%; /* Ocupa el espacio total disponible */
    padding: 10px; /* Espaciado superior e inferior */
    gap: 10px; /* Espacio entre pestañas y controles */
}

/* Estilo de los botones */
.news-controls {
    display: flex;
    align-items: center;
    gap: 10px; /* Espaciado entre botones */
}

.toggle-view {
    background-color: transparent;
    border: 2px solid transparent;
    padding: 10px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    transition: all 0.3s ease;
}

.toggle-view i {
    font-size: 15px;
    color: var(--color02);
    transition: color 0.3s ease;
}

.toggle-view:hover {
    border-color: var(--color06);
}

.toggle-view.active {
    border-color: var(--color06);
    background-color: var(--color14);
}

.toggle-view.active i {
    color: var(--color06);
}

/* Responsivo */
@media (max-width: 480px) {
    .news-controls {
        gap: 5px; /* Menor espacio entre botones */
    }

    .toggle-view i {
        font-size: 18px; /* Tamaño reducido del ícono */
    }

    .toggle-view {
        padding: 8px; /* Tamaño reducido del botón */
    }
}

dl.forumrss dt {
	color: var(--color13);
}
			
dl.forumrss dt i {
	font-size: 10px;
}
			
dl.forumrss a {
	font-size: 11px;
	color: var(--color13) !important;
	text-decoration: none;
}
				
dl.forumrss a:hover {
	text-decoration: underline;
}
			
dl.forumrss dd {
	font-size: 10px;
	padding-left: 11px;
	margin: -1px 0 5px 0;
	font-style: italic;
}

.description {
	border: 1px solid var(--color08);
	background-color: var(--color14);
	color: var(--color01);
	padding: 10px;
	line-height: 16px;
}

.description h4 {
	border-style: solid;
	border-color: var(--border01);
	border-width: 0 0 1px 0;
	padding-top: 0;
	padding-left: 0;
	font-size: 14px;
}
			
.description p {
	margin: 2px 0 10px 0;
}

/* Estilo base para las pestañas */
.tabs-container {
    width: 70%;
}

.ddanime-tabs {
	font-size: 11px;
    list-style: none;
    display: flex;
    margin: 0;
    padding: 0 10px;
}

.ddanime-tab {
    margin-right: 5px;
    padding: 10px 30px;
    background: var(--kronic-header-bg);
	border-radius: 5px 5px 0 0;
    cursor: pointer;
}

.ddanime-tab.active-tab {
    font-weight: bold;
    border-bottom: 2px solid var(--color06);	
}

.ddanime-tab a {
    text-decoration: none;
    color: var(--color13);
}

.ddanime-tab a:hover {
    color: var(--color01);
}

.ddanime-tab-content {
    display: none;
    padding: 0;
}

.ddanime-tab-content.active-content {
    display: block;
}

ul.navlinks {
	border-top: none;
}

/*.icon::before, .steve-forum-icon {
	padding-right: 30px !important;
}*/

.profile-flair {
	padding: 5px 0 !important;
}
/* PUREZA TÉCNICA: Integración Wide Profile (Avatar Overlap + Ribbon) */
.wk-profile-integration {
	margin-bottom: var(--kronic-drag-padding);
	background: transparent;
	color: var(--color01);
}

/* Hero Banner Wide */
.wk-hero-wide {
	height: 200px;
	background-color: var(--color04);
	background-size: cover;
	background-position: center;
	border-radius: var(--kronic-border-radius-l) var(--kronic-border-radius-l) 0 0;
	border-bottom: none;
	position: relative;
}

.wk-cam-btn {
	position: absolute;
	top: 15px;
	right: 15px;
	width: 32px;
	height: 32px;
	border-radius: 50%;
	background: rgba(0, 0, 0, 0.31);
	color: #FFF;
	display: flex;
	align-items: center;
	justify-content: center;
	cursor: pointer;
	font-size: 13px;
	transition: 0.2s;
	z-index: 10;
}
.wk-cam-btn:hover { background: var(--color06); color: #fff; }

/* Avatar superpuesto */
.wk-avatar-wrapper {
	position: absolute;
	bottom: -40px;
	left: 30px;
	z-index: 20;
}

.wk-avatar-circle {
	width: 140px;
	height: 140px;
	border-radius: 50%;
	background: var(--color03);
	border: 5px solid var(--color14);
	box-shadow: 0 4px 10px rgba(0,0,0,0.2);
	overflow: hidden;
	display: flex;
	align-items: center;
	justify-content: center;
}

.wk-avatar-circle img {
	width: 100% !important;
	height: 100% !important;
	max-width: none !important;
	max-height: none !important;
	object-fit: cover;
}

/* Ribbon de estadísticas integrado */
.wk-stats-ribbon {
	background: var(--color14);
	border-radius: 0 0 var(--kronic-border-radius-l) var(--kronic-border-radius-l);
	padding: 12px 25px 12px 190px; /* Espacio reservado para el avatar */
	display: flex;
	align-items: center;
	justify-content: space-between;
	margin-bottom: var(--kronic-drag-padding);
	min-height: 45px;
}

.wk-stats-left {
	display: flex;
	gap: 20px;
	font-size: 13px;
	color: var(--color02);
	align-items: center;
}
.wk-stats-left strong { color: var(--color01); }

.wk-dot { display: inline-block; width: 8px; height: 8px; border-radius: 50%; margin-right: 6px; }
.wk-dot.watching { background: var(--icon-green); }
.wk-dot.completed { background: var(--icon-blue); }
.wk-dot.total { background: var(--color05); }

.wk-stats-right {
	display: flex;
	align-items: center;
	gap: 8px;
	background: var(--color08);
	padding: 5px 15px;
	border-radius: var(--kronic-border-radius-m);
	border: 1px solid var(--border01);
}

.wk-mean-lbl { font-size: 11px; font-weight: 700; color: var(--color02); text-transform: uppercase; }
.wk-mean-val { font-size: 15px; font-weight: 800; color: var(--color01); }
.wk-star { color: #f1c40f; font-size: 11px; }

/* Grid de Posters */
.wk-recent-container {
	background: var(--color14);
	border-radius: var(--kronic-border-radius-l);
	padding: 20px;
}

.wk-recent-header {
	font-size: 13px;
	font-weight: 800;
	color: var(--color01);
	text-transform: uppercase;
	border-bottom: 1px solid var(--border01);
	padding-bottom: 12px;
	margin-bottom: 20px;
}

.wk-recent-grid-wide {
	display: flex;
	flex-wrap: wrap;
	gap: 12px;
}

.wk-poster-item {
	width: 90px;
	height: 130px;
	border-radius: var(--kronic-border-radius-m);
	overflow: hidden;
	position: relative;
	border: 1px solid var(--border04);
	display: block;
	transition: transform 0.2s;
}
.wk-poster-item:hover { transform: translateY(-5px); border-color: var(--color06); }

.wk-poster-item img { width: 100%; height: 100%; object-fit: cover; display: block; }

.wk-poster-score {
	position: absolute;
	bottom: 0; left: 0; right: 0;
	background: rgba(0,0,0,0.85);
	color: #f1c40f;
	font-size: 10px;
	font-weight: 800;
	text-align: center;
	padding: 4px 0;
}

.wk-hide { display: none; }

/* Ocultar el avatar nativo para evitar duplicidad si existe en el panel original */
.avatar-rank-container { display: none }