/* 
Theme Name: Madara-Child-LittleTyrant 
Description: A child theme for Madara - Manga WordPress Theme. 
Codename: LT 
Author: Little Tyrant 
Author URI: https://mangabooth.com/ 
Template: madara 
Tags: one-column, two-columns, right-sidebar, custom-header, custom-menu, editor-style, featured-images, microformats, post-formats, rtl-language-support, sticky-post, translation-ready 
Version: 1.0.4
*/
/* --- LITTLE TYRANT DESIGN SYSTEM (Color Schema Support) --- */
:root {
    /* Cores de Marca (Fixas) */
    /* Cores de Marca (Dinâmicas) */
    --primary: #9d1df2;
    --primary-rgb: 157, 29, 242;
    --primary-dark: #7c3aed;
    --accent-new: #06b6d4;
    --accent-hot: #f43f5e;

    /* --- LAYOUT CONFIG --- */
    --sidebar-w: 240px;
    --header-h: 70px;
    --card-radius: 12px;
    --transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    --bottom-nav-h: 60px;

    /* Cores Base (Dark Mode Default) */
    --bg-app: #0a0a0c;
    --bg-sidebar: #121214;
    --bg-card: #18181b;
    --bg-hover: #202024;
    --text-main: #ffffff;
    --text-muted: #a1a1aa;
    --border-color: rgba(255, 255, 255, 0.05);
}

/* --- LIGHT MODE SCHEMA --- */
body.wp-manga-light-mode {
    --bg-app: #f8fafc;
    --bg-sidebar: #ffffff;
    --bg-card: #ffffff;
}

/* --- RESET & LAYOUT BASE --- */
body,
html {
    background-color: var(--bg-app);
    color: var(--text-main);
    font-family: 'Inter', sans-serif;
    margin: 0;
    padding: 0;
}

#wpadminbar {
    z-index: 9999;
}

/* Remove containers antigos do Madara que quebram o flex */
.wrap,
.body-wrap,
.site-content {
    background: transparent;
    margin: 0;
    padding: 0;
}

body.modern-layout {
    margin: 0;
    padding: 0;
    overflow-x: hidden;
    background-color: var(--bg-app);
}

.modern-wrapper {
    display: flex;
    min-height: 100vh;
    width: 100vw;
    overflow-x: hidden;
}

.main-content {
    flex: 1;
    display: flex;
    flex-direction: column;
    min-width: 0;
    background-color: var(--bg-app);
    position: relative;
    min-height: 100vh;
}

/* --- TOP BAR (HEADER) --- */
.top-bar {
    height: var(--header-h);
    background: var(--bg-sidebar);
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0 40px;
    position: sticky;
    top: 0;
    z-index: 2000;
    border-bottom: 1px solid rgba(255, 255, 255, 0.05);
    backdrop-filter: blur(12px);
    transition: transform 0.3s ease;
    /* Para deslizar */
}

.top-bar.header-hidden {
    transform: translateY(-100%);
    /* Esconde ao descer */
}

.top-bar-left {
    display: flex;
    align-items: center;
    gap: 30px;
    flex: 1;
}

.user-actions {
    display: flex;
    align-items: center;
    gap: 20px;
    margin-left: 20px;
    flex-shrink: 0;
    /* Garante que o avatar nunca seja esmagado */
}

/* --- MODAIS DE AUTENTICAÇÃO (CORREÇÃO DE CENTRO E ESTILO) --- */
.wp-manga-section {
    display: none;
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.8);
    backdrop-filter: blur(10px);
    z-index: 10000;
    align-items: center;
    /* Centraliza Verticalmente */
    justify-content: center;
    /* Centraliza Horizontalmente */
}

.wp-manga-section.modal-open-custom {
    display: flex;
}

/* O container interno (Dialog) */
.wp-manga-section .modal-dialog {
    width: 100%;
    max-width: 400px;
    background: #18181b;
    border-radius: 24px;
    padding: 40px;
    position: relative;
    box-shadow: 0 25px 50px -12px rgba(0, 0, 0, 0.5);
    border: 1px solid rgba(255, 255, 255, 0.1);
    margin: 0;
    /* Remove margens do bootstrap */
}

/* Esconde modais internos e botões nativos */
.wp-manga-section .modal {
    display: none;
    background: transparent;
    padding: 0;
    position: relative;
}

/* Esconde botões de fechar nativos do Madara que são feios */
.wp-manga-section .close,
.wp-manga-section .modal-header button.close {
    display: none;
}

.wp-manga-section .modal.in,
.wp-manga-section .modal.active,
.wp-manga-section .modal:target {
    display: block;
}

/* Títulos */
.modal-header .modal-title {
    font-size: 26px;
    font-weight: 800;
    color: white;
    text-align: center;
    margin-bottom: 30px;
    display: block;
}

/* Labels e Inputs */
.modal-body label {
    display: block;
    font-size: 13px;
    color: #a1a1aa;
    margin-bottom: 8px;
    font-weight: 600;
}

.modal-body input[type="text"],
.modal-body input[type="password"],
.modal-body input[type="email"] {
    width: 100%;
    background: #09090b;
    border: 1px solid #27272a;
    padding: 14px 16px;
    border-radius: 12px;
    color: white;
    margin-bottom: 20px;
    outline: none;
    transition: 0.3s;
}

.modal-body input:focus {
    border-color: var(--primary);
}

/* Botão de Envio (Log In / Register) - Força Total */
.modal-footer,
.modal-body .submit {
    border: none;
    padding: 0;
    margin-top: 20px;
    background: transparent;
}

.modal-footer input[type="submit"],
.modal-footer button[type="submit"],
.modal-body input[type="submit"],
#wp-submit {
    width: 100%;
    background: var(--primary);
    color: white;
    border: none;
    padding: 16px;
    border-radius: 14px;
    font-weight: 700;
    font-size: 16px;
    cursor: pointer;
    transition: 0.3s;
    display: block;
    box-shadow: 0 4px 15px rgba(124, 58, 237, 0.3);
}

.modal-footer input[type="submit"]:hover,
#wp-submit:hover {
    background: var(--primary-dark);
    transform: translateY(-2px);
}

/* Esconde links inúteis (Back to, etc) - Agachamento Total */
.modal-body a[href*="action=lostpassword"] {
    display: block;
    margin-top: 25px;
    text-align: center;
    color: var(--primary);
}

/* Esconde qualquer link que contenha "Voltar" ou "Back to" ou aponte para a home/site raiz */
.wp-manga-section a[href$="/"],
.wp-manga-section a[href*="localhost"],
.wp-manga-section a[href*="http"],
.wp-manga-section #backtoblog,
.wp-manga-section #nav,
.wp-manga-section p#backtoblog,
.wp-manga-section p#nav {
    display: none;
}


/* Checkbox Lembrar-me - Alinhamento Perfeito */
.modal-body .forgetmenot,
.modal-body .checkbox {
    margin: 20px 0;
    color: #a1a1aa;
    font-size: 14px;
    display: flex;
    align-items: center;
    justify-content: flex-start;
    gap: 12px;
}

.modal-body .forgetmenot input,
.modal-body .checkbox input {
    margin: 0;
    width: 18px;
    height: 18px;
    accent-color: var(--primary);
    cursor: pointer;
}

/* Links de Esqueci Senha / Voltar - Limpeza Radical */
.modal-body a,
.modal-footer a {
    color: var(--primary);
    text-decoration: none;
    font-size: 13px;
    font-weight: 600;
}

/* Esconde links inúteis (Back to, etc) */
.modal-body a[href*="action=lostpassword"] {
    display: block;
    margin-top: 20px;
    text-align: center;
}

.modal-body a[href*="/"],
.modal-body a[href*=""],
.modal-body a:contains("Back to"),
#backtoblog,
#nav {
    display: none;
}

/* Estilo das Abas (Navegação interna do Madara) */
.wp-manga-section .nav-tabs {
    display: flex;
    justify-content: center;
    gap: 30px;
    border-bottom: 1px solid rgba(255, 255, 255, 0.05);
    margin-bottom: 30px;
}

.wp-manga-section .nav-tabs li a {
    padding-bottom: 15px;
    font-size: 15px;
    text-transform: uppercase;
}

/* Nosso Botão de Fechar Customizado */
.close-modal-custom {
    position: absolute;
    top: 24px;
    right: 24px;
    color: #52525b;
    cursor: pointer;
    font-size: 22px;
    transition: 0.2s;
}

.close-modal-custom:hover {
    color: white;
}

.main-navigation,
.main-navigation .container {
    width: 100%;
    max-width: none;
    padding: 0;
    background: transparent;
    border: none;
}

.main-navigation_wrap {
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 100%;
}

/* --- BUSCA --- */
.search-container {
    background: var(--bg-hover);
    padding: 8px 15px;
    border-radius: 10px;
    display: flex;
    align-items: center;
    gap: 12px;
    width: 400px;
    border: 1px solid transparent;
    transition: 0.3s;
}

.search-container:focus-within {
    border-color: var(--primary);
    background: var(--bg-card);
}

.search-container i {
    color: var(--text-muted);
}

.search-container input {
    background: transparent;
    border: none;
    color: white;
    width: 100%;
    outline: none;
    font-size: 14px;
}

/* --- SIDEBAR --- */
.sidebar {
    width: var(--sidebar-w);
    background: var(--bg-sidebar);
    display: flex;
    flex-direction: column;
    border-right: 1px solid var(--border-color);
    height: 100vh;
    position: fixed;
    /* Sempre fixa para sobrepor */
    top: 0;
    left: 0;
    transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1);
    z-index: 5000;
    overflow: hidden;
    transform: translateX(-100%);
    /* Escondida fora da tela por padrão */
}

body.sidebar-active .sidebar {
    transform: translateX(0);
    /* Mostra ao ativar */
}

/* Overlay para escurecer o fundo */
.sidebar-overlay {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.6);
    z-index: 4999;
    opacity: 0;
    visibility: hidden;
    transition: 0.4s;
    backdrop-filter: blur(4px);
}

body.sidebar-active .sidebar-overlay {
    opacity: 1;
    visibility: visible;
}

.sidebar .brand {
    height: var(--header-h);
    display: flex;
    align-items: center;
    padding: 0 25px;
    gap: 12px;
    font-weight: 800;
    font-size: 18px;
    color: white;
}

.sidebar .brand i {
    color: var(--primary);
    font-size: 24px;
}

.sidebar .menu {
    padding: 20px 15px;
    flex: 1;
}

.menu-label {
    color: var(--text-muted);
    font-size: 11px;
    text-transform: uppercase;
    font-weight: 800;
    margin: 25px 0 15px 10px;
    letter-spacing: 1px;
}

.nav-item {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 12px 15px;
    color: var(--text-muted);
    text-decoration: none;
    border-radius: 10px;
    transition: 0.3s;
    font-weight: 600;
    margin-bottom: 4px;
}

.nav-item:hover,
.nav-item.active {
    background: var(--bg-hover);
    color: white;
}

.nav-item i {
    font-size: 18px;
    width: 24px;
    text-align: center;
}

.nav-item.active i {
    color: var(--primary);
}

/* --- AÇÕES DO USUÁRIO --- */
.user-actions {
    display: flex;
    align-items: center;
    gap: 15px;
}

.user-avatar-wrap img {
    width: 35px;
    height: 35px;
    border-radius: 50%;
    border: 2px solid rgba(255, 255, 255, 0.1);
}

.modern-layout .sidebar {
    width: var(--sidebar-w);
    background: var(--bg-sidebar);
    display: flex;
    flex-direction: column;
    border-right: 1px solid var(--border-color);
    z-index: 5001;
    height: 100vh;
    position: fixed;
    left: 0;
    top: 0;
    transform: translateX(-100%);
    transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1);
    visibility: hidden;
}

/* Removido o espaço entre .sidebar-active e .modern-layout */
body.sidebar-active.modern-layout .sidebar {
    transform: translateX(0);
    visibility: visible;
}

.modern-layout .main-content {
    flex: 1;
    overflow-y: auto;
    overflow-x: hidden;
    position: relative;
    scroll-behavior: smooth;
    background: var(--bg-app);
}

/* --- SIDEBAR MENU --- */
.modern-layout .sidebar .brand {
    height: var(--header-h);
    display: flex;
    align-items: center;
    padding: 0 24px;
    font-family: 'Oswald', sans-serif;
    font-size: 22px;
    color: white;
    letter-spacing: 1px;
    border-bottom: 1px solid rgba(255, 255, 255, 0.05);
}

.modern-layout .sidebar .brand i {
    color: var(--primary);
    margin-right: 10px;
}

.modern-layout .sidebar .menu {
    padding: 20px 12px;
    flex: 1;
    overflow-y: auto;
}

.modern-layout .menu-label {
    font-size: 11px;
    text-transform: uppercase;
    color: #555;
    font-weight: 700;
    margin: 20px 12px 10px;
    letter-spacing: 1px;
}

.modern-layout .nav-menu-modern,
.modern-layout .nav-menu-modern ul {
    list-style: none;
    padding: 0;
    margin: 0;
}

.modern-layout .nav-menu-modern li a {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 12px;
    border-radius: 8px;
    color: var(--text-muted);
    font-size: 14px;
    font-weight: 500;
    margin-bottom: 2px;
    transition: 0.2s;
    text-decoration: none;
}

.modern-layout .nav-menu-modern li a:hover,
.modern-layout .nav-menu-modern li.current-menu-item>a {
    background: var(--bg-hover);
    color: white;
}

.modern-layout .nav-menu-modern li.current-menu-item>a {
    border-left: 3px solid var(--primary);
    padding-left: 9px;
}

/* --- TOP Bar (Espaçamento) --- */
.modern-layout .top-bar {
    margin-bottom: 0;
}

.top-bar-left {
    display: flex;
    align-items: center;
    gap: 20px;
    flex-shrink: 0;
}

.btn-toggle {
    background: transparent;
    border: none;
    color: var(--text-muted);
    font-size: 20px;
    cursor: pointer;
    padding: 10px;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: 0.3s;
}

.btn-toggle:hover {
    color: var(--primary);
}

.modern-layout .search-container {
    background: var(--bg-hover);
    border-radius: 20px;
    padding: 0 16px;
    display: flex;
    align-items: center;
    max-width: 350px;
    width: 100%;
    gap: 10px;
    color: var(--text-muted);
    height: 40px;
}

.modern-layout .search-container form {
    display: flex;
    align-items: center;
    width: 100%;
    gap: 10px;
}

.modern-layout .search-container input {
    background: transparent;
    border: none;
    color: white;
    width: 100%;
    font-size: 14px;
    outline: none;
}

.modern-layout .user-actions {
    display: flex;
    gap: 15px;
    align-items: center;
    flex-shrink: 0;
    margin-left: auto;
    /* Garante que fique na direita */
}

.header-auth-buttons {
    display: flex;
    gap: 12px;
    align-items: center;
}

.btn-login-modern {
    background: var(--primary);
    padding: 8px 18px;
    border-radius: 12px;
    display: flex;
    align-items: center;
    gap: 8px;
    color: white;
    text-decoration: none;
    font-size: 13px;
    font-weight: 700;
    transition: 0.3s;
    box-shadow: 0 4px 15px rgba(124, 58, 237, 0.3);
}

.btn-login-modern:hover {
    transform: translateY(-2px);
    background: var(--primary-dark);
    box-shadow: 0 6px 20px rgba(124, 58, 237, 0.4);
}

.btn-register-modern {
    padding: 8px 18px;
    border-radius: 12px;
    font-size: 13px;
    font-weight: 700;
    text-decoration: none;
    display: flex;
    align-items: center;
    gap: 8px;
    transition: 0.3s;
    cursor: pointer;
    background: rgba(255, 255, 255, 0.05);
    color: white;
    border: 1px solid var(--border-color);
}

.btn-register-modern:hover {
    background: var(--bg-hover);
    border-color: var(--primary);
    transform: translateY(-2px);
}

.user-avatar-link img {
    width: 35px;
    height: 35px;
    border-radius: 50%;
    border: 2px solid rgba(255, 255, 255, 0.1);
    transition: 0.3s;
    display: block;
    object-fit: cover;
    flex-shrink: 0;
}

.topbar-menu-wrapper {
    min-width: 0;
    overflow: hidden;
}

.user-avatar-link:hover img {
    border-color: var(--primary);
    transform: scale(1.1);
}



/* --- TOP BAR MENU DINÂMICO --- */
.user-avatar-wrap {
    flex-shrink: 0;
}

.topbar-nav-list {
    list-style: none;
    padding: 0;
    margin: 0;
    display: flex;
    gap: 12px;
}

.topbar-nav-list li a {
    background: var(--bg-hover);
    color: white;
    padding: 8px 18px;
    border-radius: 12px;
    font-size: 13px;
    font-weight: 700;
    text-decoration: none;
    display: flex;
    align-items: center;
    gap: 8px;
    transition: 0.3s;
    border: 1px solid var(--border-color);
}

.topbar-nav-list li a:hover {
    transform: translateY(-2px);
    border-color: var(--primary);
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.3);
}

.topbar-nav-list li.btn-vip a {
    background: linear-gradient(45deg, #7c3aed, #a78bfa);
    border: none;
}

.topbar-nav-list li.btn-gold a {
    background: linear-gradient(45deg, #FFD700, #FFA500);
    color: #000;
    border: none;
}

.topbar-nav-list li.btn-gold a i {
    color: #000;
}

.modern-layout .user-avatar img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

/* --- MANGA CARDS (LITTLE TYRANT PREMIUM) --- */
.manga-grit {
    display: grid;
    grid-template-columns: repeat(6, 1fr);
    /* Padrão 6 colunas (Madara Style) */
    gap: 25px;
    padding: 30px 0;
    width: 100%;
    margin: 0 auto;
}

/* Breakpoints para manter a grade organizada */
@media (max-width: 1400px) {
    .manga-grit {
        grid-template-columns: repeat(5, 1fr);
    }
}

@media (max-width: 1200px) {
    .manga-grit {
        grid-template-columns: repeat(4, 1fr);
    }
}

@media (max-width: 992px) {
    .manga-grit {
        grid-template-columns: repeat(3, 1fr);
        gap: 20px;
    }
}

@media (max-width: 768px) {
    .manga-grit {
        grid-template-columns: repeat(2, 1fr);
        gap: 15px;
    }
}

.hero-item.active {
    background-size: cover;
}

@media (max-width: 480px) {
    .manga-grit {
        grid-template-columns: repeat(2, 1fr);
        gap: 10px;
    }
}

@media (max-width: 380px) {
    .manga-grit {
        grid-template-columns: repeat(1, 1fr);
    }
}

.littletyrant-archive-item {
    margin-bottom: 20px;
}

.card-littletyrant {
    position: relative;
    background: var(--bg-card);
    border-radius: var(--card-radius);
    overflow: hidden;
    transition: var(--transition);
    border: 1px solid var(--border-color);
}

.card-littletyrant:hover {
    transform: translateY(-8px);
    border-color: var(--primary);
    box-shadow: 0 20px 40px rgba(0, 0, 0, 0.4), 0 0 20px rgba(var(--primary-rgb), 0.1);
}

.poster-wrapper {
    position: relative;
    aspect-ratio: 2/3;
    overflow: hidden;
    background: #000;
}

.poster-wrapper img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 0.6s cubic-bezier(0.4, 0, 0.2, 1);
}

.card-littletyrant:hover .poster-wrapper img {
    transform: scale(1.1) rotate(1deg);
}

.poster-overlay {
    position: absolute;
    inset: 0;
    background: linear-gradient(0deg, rgba(0, 0, 0, 0.9) 0%, transparent 50%);
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
    padding: 15px;
    opacity: 0;
    transition: 0.3s ease;
    z-index: 2;
}

.card-littletyrant:hover .poster-overlay {
    opacity: 1;
}

.manga-rating {
    font-size: 12px;
    color: #ffd700;
    text-shadow: 0 0 10px rgba(255, 215, 0, 0.5);
}

.card-info {
    padding: 15px;
}

.card-title {
    font-size: 15px;
    font-weight: 700;
    margin: 0 0 8px 0;
    line-height: 1.3;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    height: 40px;
    /* Garante alinhamento perfeito do grid */
}

.card-title a {
    color: var(--text-main);
    text-decoration: none;
    transition: 0.2s;
}

.card-title a:hover {
    color: var(--primary);
}

.card-meta {
    display: flex;
    align-items: center;
    justify-content: space-between;
    font-size: 12px;
}

.latest-chap {
    background: rgba(var(--primary-rgb), 0.1);
    color: var(--primary);
    padding: 4px 10px;
    border-radius: 6px;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    border: 1px solid rgba(var(--primary-rgb), 0.2);
    box-shadow: 0 0 10px rgba(var(--primary-rgb), 0.1);
}

.card-meta a {
    color: var(--text-muted);
    text-decoration: none;
}

/* Badge de "Novo" customizado */
.badge-littletyrant {
    position: absolute;
    top: 12px;
    right: 12px;
    z-index: 5;
    background: var(--primary);
    color: white;
    padding: 4px 12px;
    border-radius: 50px;
    font-size: 10px;
    font-weight: 900;
    text-transform: uppercase;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.3);
}


.card-title {
    font-size: 14px;
    font-weight: 700;
    margin: 0;
    line-height: 1.3;
}

.card-title a {
    color: white;
    text-decoration: none;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    min-height: 40px;
    /* Garante alinhamento mesmo com 1 linha */
}

.card-title a:hover {
    color: var(--primary);
}

.latest-chap {
    font-size: 12px;
}

.latest-chap-item {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 10px;
    margin-top: 4px;
}

.latest-chap-item .post-on {
    font-size: 11.5px;
    color: #aaa;
    font-style: italic;
    white-space: nowrap;
}

.latest-chap a {
    color: var(--accent-new);
    font-weight: 700;
    text-decoration: none;
}

/* --- BADGES (ESTILO HOME 6.2) --- */
.card-badge {
    position: absolute;
    top: 8px;
    left: 8px;
    padding: 3px 8px;
    border-radius: 4px;
    font-size: 10px;
    font-weight: 800;
    text-transform: uppercase;
    color: white;
    z-index: 5;
}

.badge-new {
    background: var(--accent-new);
}

.badge-hot {
    background: var(--accent-hot);
    color: white;
}

/* Barra de Capítulo no Rodapé da Imagem */
.badge-updated {
    background: var(--primary);
    color: white;
    bottom: 0;
    left: 0;
    width: 100%;
    border-radius: 0;
    top: auto;
    text-align: center;
    padding: 6px 0;
    font-size: 11px;
    font-weight: 800;
}

.card-badges-wrap.badge-pos-2 {
    position: absolute;
    top: 8px;
    right: 8px;
    z-index: 5;
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    gap: 5px;
}

/* --- HERO SLIDER (Home 6.2) --- */
/* --- HERO SLIDER PRO --- */
.hero-slider-container {
    height: 500px;
    position: relative;
    border-radius: 20px;
    overflow: hidden;
    background: #000;
}

.hero-slider-wrapper {
    display: flex;
    height: 100%;
    transition: transform 0.5s cubic-bezier(0.4, 0, 0.2, 1);
}

.hero-slider-container[data-effect="fade"] .hero-slider-wrapper {
    display: block;
    transform: none;
}

.hero-slider-container[data-effect="fade"] .hero-item {
    position: absolute;
    inset: 0;
    opacity: 0;
    transition: opacity 0.8s ease;
    visibility: hidden;
}

.hero-slider-container[data-effect="fade"] .hero-item.active {
    opacity: 1;
    visibility: visible;
    background-size: cover;
    background-repeat: no-repeat;
}

.hero-item {
    min-width: 100%;
    height: 100%;
    background-size: cover;
    background-position: center;
    position: relative;
    display: flex;
    align-items: center;
    /* Mudado de flex-end para center para não cortar os botões */
    padding: 60px;
}

/* Velocidades */
.hero-slider-container[data-speed="smooth"] .hero-slider-wrapper,
.hero-slider-container[data-speed="smooth"] .hero-item {
    transition-duration: 1s;
}

.hero-slider-container[data-speed="fast"] .hero-slider-wrapper,
.hero-slider-container[data-speed="fast"] .hero-item {
    transition-duration: 0.3s;
}

.hero-overlay {
    position: absolute;
    inset: 0;
    background: linear-gradient(to top, rgba(10, 10, 12, 1) 0%, rgba(10, 10, 12, 0.4) 60%, transparent 100%);
    z-index: 1;
}

.hero-content {
    position: relative;
    z-index: 2;
    max-width: 650px;
}

/* Navegação */
.slider-nav {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    background: rgba(255, 255, 255, 0.1);
    border: none;
    color: white;
    width: 45px;
    height: 45px;
    border-radius: 50%;
    cursor: pointer;
    z-index: 10;
    backdrop-filter: blur(5px);
    transition: 0.3s;
    display: flex;
    align-items: center;
    justify-content: center;
}

.slider-nav:hover {
    background: var(--primary);
}

.slider-nav.prev {
    left: 20px;
}

.slider-nav.next {
    right: 20px;
}

.slider-dots {
    position: absolute;
    bottom: 20px;
    left: 50%;
    transform: translateX(-50%);
    display: flex;
    gap: 8px;
    z-index: 10;
}

.dot {
    width: 10px;
    height: 10px;
    border-radius: 50%;
    background: rgba(255, 255, 255, 0.3);
    cursor: pointer;
    transition: 0.3s;
}

.dot.active {
    background: var(--primary);
    width: 30px;
    border-radius: 10px;
}

.badge-hot {
    background: var(--accent-hot);
    color: white;
    padding: 5px 12px;
    border-radius: 6px;
    font-size: 12px;
    font-weight: 800;
    text-transform: uppercase;
    display: inline-flex;
    align-items: center;
    gap: 6px;
    margin-bottom: 15px;
}

.hero-content h1 {
    font-size: 48px;
    font-family: 'Oswald', sans-serif;
    margin: 0 0 15px 0;
    line-height: 1.1;
    color: white;
}

.hero-content p {
    color: rgba(255, 255, 255, 0.7);
    font-size: 16px;
    margin-bottom: 30px;
    line-height: 1.6;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

/* --- HERO SLIDER --- */
.hero-slider-container {
    position: relative;
    width: 100%;
    height: 500px;
    background: #000;
    overflow: hidden;
}

.hero-item {
    position: relative;
    width: 100%;
    height: 100%;
    background-size: cover;
    background-position: center;
    display: flex;
    align-items: center;
}

.hero-overlay {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: linear-gradient(90deg, rgba(0, 0, 0, 0.9) 0%, rgba(0, 0, 0, 0.4) 50%, transparent 100%);
    z-index: 1;
}

.hero-content {
    position: relative;
    z-index: 2;
    padding: 0 80px;
    max-width: 800px;
}

.hero-content h1 {
    font-family: 'Oswald', sans-serif;
    font-size: 56px;
    font-weight: 900;
    color: #fff;
    margin: 15px 0;
    text-transform: uppercase;
    line-height: 1.1;
}

.hero-content p {
    font-size: 16px;
    color: var(--text-muted);
    margin-bottom: 30px;
    line-height: 1.6;
}

.hero-actions {
    display: flex;
    gap: 15px;
    align-items: center;
    margin-top: 25px;
}

.manga-bookmark-container {
    display: inline-block;
    vertical-align: top;
}

.manga-bookmark-container span {
    display: none;

}

.manga-bookmark-container.loading-opacity {
    opacity: 0.5;
}

.btn-primary {
    background: var(--primary);
    color: white;
    padding: 12px 35px;
    border-radius: 10px;
    font-weight: 700;
    text-decoration: none;
    transition: 0.3s;
    border: none;
    display: inline-block;
}

.btn-primary:hover {
    background: var(--primary-dark);
    transform: translateY(-2px);
}

.btn-secondary {
    background: rgba(255, 255, 255, 0.1);
    color: white;
    padding: 12px 35px;
    border-radius: 10px;
    font-weight: 700;
    text-decoration: none;
    backdrop-filter: blur(5px);
    transition: 0.3s;
    display: inline-block;
}

.btn-secondary:hover {
    background: rgba(255, 255, 255, 0.2);
}

/* --- SCHEDULE / AGENDA SECTION --- */
.schedule-container,
.release-calendar-container {
    padding: 0 40px 40px;
    max-width: 1400px;
    margin: 0 auto;
}

.schedule-header,
.calendar-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 30px;
    padding: 50px;
}

.calendar-header .header-right {
    display: flex;
    align-items: center;
    gap: 20px;
}


.schedule-header h2 {
    font-family: 'Oswald', sans-serif;
    font-size: 25px;
    margin: 0;
    display: flex;
    align-items: center;
    gap: 10px;
}

.schedule-header .view-all {
    font-size: 12px;
    color: var(--primary);
    text-decoration: none;
    font-weight: 700;
}

.days-row,
.calendar-days-wrapper {
    display: flex;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 30px;
    overflow-x: auto;
    padding-bottom: 5px;
}

.day-btn,
.day-item {
    background: rgba(255, 255, 255, 0.05);
    backdrop-filter: blur(10px);
    border: 1px solid rgba(255, 255, 255, 0.08);
    padding: 10px 20px;
    border-radius: 12px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    min-width: 80px;
    height: 90px;
    cursor: pointer;
    transition: 0.3s;
}

.day-btn span,
.day-item .day-name {
    font-size: 10px;
    color: var(--text-muted);
    font-weight: 800;
    margin-bottom: 4px;
    text-transform: uppercase;
}

.day-btn strong,
.day-item .day-number {
    font-size: 20px;
    font-weight: 900;
    color: white;
}

.day-btn.active,
.day-item.active {
    background: var(--primary);
    border-color: var(--primary);
    box-shadow: 0 8px 25px rgba(var(--primary-rgb), 0.4);
}

.day-btn.active span,
.day-btn.active strong,
.day-item.active .day-name,
.day-item.active .day-number {
    color: white;
    opacity: 1;
}

.schedule-grid,
.calendar-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
    gap: 25px;
    width: 100%;
}

.release-card,
.cal-manga-card {
    background: rgba(255, 255, 255, 0.03);
    backdrop-filter: blur(5px);
    border-radius: 15px;
    padding: 12px;
    display: flex;
    gap: 15px;
    align-items: center;
    transition: 0.3s;
    border: 1px solid rgba(255, 255, 255, 0.05);
    text-decoration: none;
}

.release-card:hover,
.cal-manga-card:hover {
    background: rgba(255, 255, 255, 0.08);
    border-color: var(--primary);
    transform: translateX(5px);
}

.release-card:hover {
    background: var(--bg-hover);
    border-color: var(--primary);
}

.release-thumb,
.cal-manga-thumb {
    width: 65px;
    height: 90px;
    border-radius: 10px;
    overflow: hidden;
    flex-shrink: 0;
}

.release-thumb img,
.cal-manga-thumb img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.release-info,
.cal-manga-info {
    flex: 1;
    min-width: 0;
}

.release-info h4,
.cal-manga-title {
    font-size: 15px;
    font-weight: 700;
    margin: 0 0 4px 0;
    color: white;
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.release-chap,
.cal-manga-chapter {
    font-size: 12px;
    color: var(--accent);
    font-weight: 800;
    margin-bottom: 3px;
    display: block;
}

.release-time,
.cal-manga-time {
    font-size: 11px;
    color: var(--text-muted);
    display: flex;
    align-items: center;
    gap: 5px;
}

/* Estilos Adicionais do Widget */
.fav-filter-btn {
    background: rgba(255, 255, 255, 0.05);
    border: 1px solid rgba(255, 255, 255, 0.1);
    color: #fff;
    padding: 8px 15px;
    border-radius: 12px;
    font-size: 13px;
    font-weight: 700;
    cursor: pointer;
    transition: 0.3s;
    display: flex;
    align-items: center;
    gap: 8px;
}

.fav-filter-btn.active {
    background: #f1c40f;
    color: #000;
    border-color: #f1c40f;
}

.lt-countdown {
    color: #f1c40f;
    font-weight: 800;
}

.calendar-loader .spinner {
    width: 40px;
    height: 40px;
    border: 3px solid rgba(255, 255, 255, 0.1);
    border-top: 3px solid var(--primary);
    border-radius: 50%;
    margin: 40px auto;
    animation: spin-load 1s linear infinite;
}

/* ==========================================================================
   PERFIL DA OBRA (SINGLE MANGA) - GAMER PREMIUM REDESIGN
   ========================================================================== */

/* Título Gigante e Itálico */
.manga-title-premium {
    font-size: 2.5rem;
    font-weight: 650;
    text-transform: uppercase;
    line-height: 0.9;
    color: #fff;
    margin: 10px 0 25px;
    text-shadow: 0 10px 30px rgba(0, 0, 0, 0.5);
    transform: skewX(-5deg);
    /* Leve inclinação para dinamismo */
}

/* Gêneros Minimalistas */
.manga-pills-minimal {
    display: flex;
    gap: 12px;
    margin-bottom: 30px;
}

.manga-pills-minimal a {
    background: rgba(255, 255, 255, 0.1);
    color: #fff;
    padding: 6px 18px;
    border-radius: 50px;
    font-size: 11px;
    font-weight: 700;
    text-transform: uppercase;
    transition: 0.3s;
    text-decoration: none;
    border: 1px solid rgba(255, 255, 255, 0.1);
}

.manga-pills-minimal a:hover {
    background: #fff;
    color: #000;
}

/* Sinopse Estilizada */
.manga-summary-premium {
    max-width: 800px;
    margin-bottom: 35px;
}

.manga-summary-premium p {
    font-size: 14px;
    line-height: 1.6;
    color: #bbb;
    margin-bottom: 10px;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.btn-read-more-link {
    color: var(--primary);
    font-size: 12px;
    font-weight: 800;
    text-transform: uppercase;
    text-decoration: none;
    display: flex;
    align-items: center;
    gap: 8px;
}

/* ==========================================================================
   PERFIL DO MANGÁ (LITTLE TYRANT PREMIUM STYLE)
   ========================================================================== */
.profile-manga {
    position: relative;
    padding: 80px 0;
    color: #fff;
    min-height: 500px;
    background: #0a0a0c;
    overflow: hidden;
}

.profile-manga .container {
    position: relative;
    z-index: 10;
}

/* Background com Imagem do Banner */
.detail-bg {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 1;
}

.detail-bg img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    opacity: 0.4;
}

/* Card Principal (Resumo) */
.tab-summary {
    padding: 40px;
    display: flex;
    gap: 40px;
    align-items: stretch;
    background: rgba(15, 15, 18, 0.95) !important;
    /* Fundo sólido para não 'vazar' */
    border: 1px solid rgba(171, 29, 254, 0.3);
    border-radius: 30px;
    margin-top: 20px;
    box-shadow: 0 30px 60px rgba(0, 0, 0, 0.8);
    position: relative;
}

.summary_image {
    flex: 0 0 280px;
    border-radius: 20px;
    overflow: hidden;
    box-shadow: 0 20px 50px rgba(0, 0, 0, 0.8);
    border: 1px solid rgba(255, 255, 255, 0.1);
}

.summary_content_wrap {
    flex: 1;
    display: flex;
    flex-direction: column;
}

/* Título Premium */
.manga-title-premium {
    font-size: 3rem;
    font-weight: 900;
    text-transform: uppercase;
    color: #fff;
    margin-bottom: 15px;
    letter-spacing: -1.5px;
    line-height: 1.1;
    word-break: break-word;
}

/* Sinopse com Scroll */
.manga-summary-premium {
    margin-bottom: 25px;
}

.summary-text-scroll {
    max-height: 120px;
    overflow-y: auto;
    font-size: 14px;
    line-height: 1.6;
    color: #ccc;
    padding-right: 10px;
}

.summary-text-scroll::-webkit-scrollbar {
    width: 3px;
}

.summary-text-scroll::-webkit-scrollbar-thumb {
    background: var(--primary);
}

/* Grade de Atributos */
.manga-attributes-grid {
    display: grid;
    grid-template-columns: repeat(7, 1fr);
    background: rgba(255, 255, 255, 0.03);
    border: 1px solid rgba(255, 255, 255, 0.05);
    border-radius: 15px;
    padding: 15px 0;
    margin-bottom: 25px;
}

.attr-item {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    border-right: 1px solid rgba(255, 255, 255, 0.05);
}

.attr-item:last-child {
    border-right: none;
}

.attr-label {
    font-size: 9px;
    font-weight: 800;
    color: #777;
    margin-bottom: 4px;
    text-transform: uppercase;
}

.attr-value {
    font-size: 13px;
    font-weight: 900;
    color: #fff;
}

/* Botões de Ação */
.manga-hero-actions {
    display: flex;
    gap: 15px;
    flex-wrap: wrap;
}

.manga-hero-actions .c-btn,
.manga-hero-actions .btn-read-now {
    background: var(--primary) !important;
    color: #fff !important;
    padding: 14px 30px !important;
    border-radius: 12px !important;
    font-weight: 800 !important;
    font-size: 12px !important;
    text-transform: uppercase !important;
    border: none !important;
    box-shadow: 0 10px 20px rgba(171, 29, 254, 0.4) !important;
    flex: 1;
    text-align: center;
}

.manga-action-premium {
    flex: 0 0 auto;
}

.add-bookmark a {
    background: rgba(255, 255, 255, 0.1) !important;
    border: 1px solid rgba(255, 255, 255, 0.1) !important;
    padding: 14px 20px !important;
    border-radius: 12px !important;
    color: #fff !important;
    font-size: 12px !important;
    font-weight: 800 !important;
}

/* Responsividade Mobile */
@media (max-width: 991px) {
    .profile-manga {
        padding: 40px 0 20px;
        min-height: auto;
    }

    .tab-summary {
        flex-direction: column;
        align-items: center;
        text-align: center;
        padding: 20px 15px;
        gap: 20px;
    }

    .summary_image {
        flex: 0 0 200px;
        width: 200px;
        margin-bottom: 10px;
    }

    .manga-title-premium {
        font-size: 1.6rem;
    }

    .manga-pills-minimal {
        justify-content: center;
    }

    .manga-attributes-grid {
        grid-template-columns: repeat(2, 1fr);
        gap: 10px;
        padding: 15px;
    }

    .attr-item {
        border-right: none;
        border-bottom: 1px solid rgba(255, 255, 255, 0.05);
        padding: 8px 0;
    }

    .attr-item:last-child {
        border-bottom: none;
    }

    .manga-hero-actions {
        display: grid !important;
        grid-template-columns: 1fr 1fr;
        width: 100%;
    }

    .manga-action-premium {
        grid-column: span 2;
    }

    .manga-hero-actions .c-btn {
        padding: 12px 10px !important;
        font-size: 11px !important;
    }
}

/* Cores dos Atributos */
.attr-value.pink-text {
    color: #ff4b82;
}

.attr-value.green-text {
    color: #00ff88;
}

/* Pills de Gênero */
.manga-pills-minimal {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-bottom: 20px;
}

.manga-pills-minimal a {
    background: rgba(255, 255, 255, 0.08);
    color: #ccc;
    padding: 5px 14px;
    border-radius: 50px;
    font-size: 11px;
    font-weight: 700;
    text-transform: uppercase;
    text-decoration: none;
    border: 1px solid rgba(255, 255, 255, 0.08);
    transition: 0.3s;
}

.manga-pills-minimal a:hover {
    background: var(--primary);
    color: #fff;
    border-color: var(--primary);
}

/* Imagem da capa dentro do resumo */
.summary_image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

/* ==========================================================================
   MODAL DE SINOPSE (GAMER PREMIUM)
   ========================================================================== */
#form-readmore {
    display: none;
}

#form-readmore.show {
    display: block;
}

#form-readmore .modal-content {
    background: rgba(10, 10, 10, 0.98);
    border: 1px solid rgba(255, 255, 255, 0.1);
    border-radius: 20px;
    backdrop-filter: blur(25px);
    color: #fff;
    box-shadow: 0 30px 60px rgba(0, 0, 0, 0.9);
}

#form-readmore .modal-header {
    border-bottom: none;
    padding: 25px 30px 0;
    display: flex;
    justify-content: flex-end;
    /* Garante o botão na direita */
}

#form-readmore .modal-header .close {
    color: #fff;
    opacity: 0.8;
    font-size: 35px;
    text-shadow: none;
    transition: 0.4s;
    outline: none;
}

#form-readmore .modal-header .close:hover {
    color: #ff4b82;
    transform: rotate(180deg);
}

#form-readmore .modal-body {
    padding: 10px 40px 50px;
}

#form-readmore .manga-about {
    font-size: 16px;
    line-height: 1.9;
    color: #ddd;
    margin-bottom: 40px;
    font-family: inherit;
}

#form-readmore .manga-genres h5 {
    font-size: 13px;
    font-weight: 900;
    text-transform: uppercase;
    color: #ff4b82;
    margin-bottom: 20px;
    letter-spacing: 3px;
    border-left: 4px solid #ff4b82;
    padding-left: 15px;
}

#form-readmore .genres-content a {
    background: rgba(255, 75, 130, 0.1);
    color: #ff4b82;
    padding: 7px 20px;
    border-radius: 50px;
    font-size: 12px;
    font-weight: 800;
    margin-right: 10px;
    margin-bottom: 12px;
    display: inline-block;
    border: 1px solid rgba(255, 75, 130, 0.2);
    transition: 0.3s;
}

#form-readmore .genres-content a:hover {
    background: #ff4b82;
    color: #fff;
}

#form-readmore .manga-banner img {
    border-radius: 15px;
    margin-bottom: 30px;
    width: 100%;
    box-shadow: 0 15px 40px rgba(0, 0, 0, 0.5);
}

/* Pílulas de Gêneros */
.manga-pills-genres {
    display: flex;
    gap: 10px;
    flex-wrap: wrap;
    margin-bottom: 20px;
}

.manga-pills-genres a {
    background: rgba(171, 29, 254, 0.15);
    /* Roxo suave transparente */
    color: var(--primary);
    padding: 5px 15px;
    border-radius: 50px;
    font-size: 11px;
    font-weight: 700;
    text-transform: uppercase;
    border: 1px solid rgba(171, 29, 254, 0.3);
    transition: var(--transition);
    text-decoration: none;
}

.manga-pills-genres a:hover {
    background: var(--primary);
    color: white;
    transform: translateY(-2px);
    box-shadow: 0 4px 15px rgba(171, 29, 254, 0.3);
}

/* Sub-Meta (Autor e Status) */
.manga-sub-meta {
    display: flex;
    gap: 30px;
    margin-bottom: 25px;
    color: var(--text-dim);
    font-size: 14px;
    font-weight: 500;
}

.manga-sub-meta i {
    color: var(--primary);
    margin-right: 8px;
    font-size: 16px;
}

.manga-sub-meta .author-item a {
    color: #fff;
    font-weight: 700;
    text-decoration: none;
}

/* Cápsula de Estatísticas (Streaming Style) */
.manga-stats-capsule {
    display: flex;
    gap: 35px;
    align-items: center;
    background: rgba(255, 255, 255, 0.05);
    padding: 12px 30px;
    border-radius: 100px;
    width: fit-content;
    margin-bottom: 35px;
    border: 1px solid rgba(255, 255, 255, 0.08);
    backdrop-filter: blur(5px);
}

.stat-item {
    font-size: 14px;
    font-weight: 700;
    display: flex;
    align-items: center;
    gap: 10px;
    color: #efefef;
}

.stat-item i {
    color: var(--primary);
    font-size: 18px;
}

/* Bookmark dentro da cápsula */
.stat-item.bookmark a {
    color: var(--text-dim);
    font-size: 18px;
    transition: 0.3s;
}

.stat-item.bookmark a:hover,
.stat-item.bookmark a.active {
    color: #ff4b2b;
}

/* Sinopse Curta */
.manga-summary {
    font-size: 16px;
    line-height: 1.8;
    color: #ccc;
    max-width: 900px;
    margin-bottom: 35px;
    font-style: italic;
}

/* Botões de Ação */
.manga-action-buttons {
    display: flex;
    gap: 25px;
    align-items: center;
    flex-wrap: wrap;
}

.btn-read-more-modal {
    color: var(--text-dim);
    font-size: 12px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 1.5px;
    text-decoration: none;
    border-bottom: 2px solid var(--primary);
    padding-bottom: 3px;
    transition: 0.3s;
}

.btn-read-more-modal:hover {
    color: #fff;
    border-color: #fff;
}

/* Ajustes para os Quick Buttons (Ler Primeiro/Último) */
.manga-action-buttons .btn-primary,
.manga-action-buttons .btn-secondary {
    padding: 12px 35px;
    border-radius: 12px;
    font-weight: 800;
    letter-spacing: 1px;
}



/* --- REFINAMENTO HEADER PADRÃO (Estilo Home 6.2) --- */
.site-header {
    background: var(--bg-app);
    border-bottom: 1px solid var(--border-color);
}

.c-togle__menu .menu_icon__open {
    background: transparent;
    border: none;
    display: flex;
    flex-direction: column;
    gap: 5px;
    cursor: pointer;
    padding: 10px;
}

.c-togle__menu .menu_icon__open span {
    display: block;
    width: 25px;
    height: 2px;
    background: var(--text-main);
    transition: 0.3s;
}

.c-togle__menu .menu_icon__open:hover span {
    background: var(--primary);
}

.main-navigation .main-menu ul li a {
    font-family: 'Inter', sans-serif;
    font-weight: 600;
    color: var(--text-muted);
    font-size: 14px;
    text-transform: none;
}

.main-navigation .main-menu ul li a:hover {
    color: var(--primary);
}

.search-navigation__wrap .menu-search a i {
    color: var(--text-muted);
    font-size: 20px;
}

.user-section.c-modal_item a {
    color: white;
    font-weight: 700;
    font-size: 13px;
    margin-left: 15px;
    text-transform: uppercase;
}

.user-section.c-modal_item .btn-active-modal:first-child {
    color: var(--primary);
}

/* --- REFINAMENTO CARDS --- */
.modern-layout .poster-overlay {
    position: absolute;
    inset: 0;
    background: linear-gradient(to top, rgba(0, 0, 0, 0.9) 0%, transparent 50%);
    opacity: 0;
    transition: 0.3s;
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
    padding: 15px;
}

.card-littletyrant:hover .poster-overlay {
    opacity: 1;
}

@media (max-width: 900px) {
    .modern-layout .hero-slider {
        margin: 10px;
        height: 300px;
    }

    .modern-layout .hero-content h1 {
        font-size: 28px;
    }

    .modern-layout .hero-content p {
        display: none;
    }

    .modern-layout .hero-item {
        padding: 30px;
    }
}


/* ESTILIZAÇÃO PERSONALIZADA - LITTLE TYRANT ENGINE
   Foco: Modernização dos Cards e Layout 
*/

:root {
    --primary: #ab1dfe;
    /* Roxo principal */
    --accent: #34e2e4;
    /* Ciano para detalhes */
    --bg-dark: #0f0f11;
    --card-bg: #1a1a1d;
    --text-main: #efefef;
    --text-dim: #b0b0b0;
    --transition: all 0.3s cubic-bezier(0.25, 0.8, 0.25, 1);
}

/* --- Layout Geral --- */
body {
    background-color: var(--bg-dark);
    color: var(--text-main);
    font-family: 'Poppins', sans-serif;
}

/* --- Cabeçalho (Header) --- */
.site-header {
    background: rgba(15, 15, 17, 0.9);
    backdrop-filter: blur(10px);
    border-bottom: 1px solid rgba(255, 255, 255, 0.05);
}

.search-container {
    background: #252529;
    border-radius: 20px;
    padding: 5px 15px;
    display: flex;
    align-items: center;
}

.search-container input {
    background: transparent;
    border: none;
    color: #fff;
    padding-left: 10px;
}


/* --- Grade de Mangás (Grid) --- */
.grid-manga {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
    gap: 30px;
    padding: 20px 0;
    position: relative;
    z-index: 10;
}

@media (max-width: 600px) {
    .grid-manga {
        grid-template-columns: repeat(auto-fill, minmax(140px, 1fr));
        gap: 15px;
    }
}

/* --- Estilização dos Cards (Manga Items) --- */
.card-littletyrant {
    background: var(--card-bg);
    border-radius: 15px;
    overflow: hidden;
    transition: var(--transition);
    border: 1px solid rgba(255, 255, 255, 0.05);
    margin-bottom: 30px;
}

.card-littletyrant:hover {
    transform: translateY(-5px);
    border-color: var(--primary);
    box-shadow: 0 10px 20px rgba(0, 0, 0, 0.5);
}

/* Badges e Tags nos Cards */
.poster-wrapper {
    position: relative;
    overflow: visible !important;
}

.poster-wrapper img,
.poster-wrapper .poster-overlay,
.poster-wrapper .adult-overlay {
    border-top-left-radius: inherit;
    border-top-right-radius: inherit;
}

.poster-wrapper img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: 0.5s ease;
}

.card-hunters:hover .poster-wrapper img {
    transform: scale(1.08);
}

.manga-badges {
    position: absolute;
    z-index: 10;
    display: flex;
    flex-direction: column;
    gap: 5px;
    pointer-events: none;
}

/* Definição das Posições do Madara */
.badge-pos-1 {
    top: 10px;
    left: 10px;
    align-items: flex-start;
}

/* Top Left */
.badge-pos-2 {
    top: 10px;
    right: 10px;
    align-items: flex-end;
}

/* Top Right */
.badge-pos-3 {
    bottom: 10px;
    left: 10px;
    align-items: flex-start;
}

/* Bottom Left */
.badge-pos-4 {
    bottom: 10px;
    right: 10px;
    align-items: flex-end;
}

/* Bottom Right */

.custom-badge {
    background: #f1c40f;
    color: #000;
    font-size: 10px;
    font-weight: 900;
    padding: 3px 8px;
    border-radius: 4px;
    text-transform: uppercase;
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.3);
}

.status-badge {
    position: absolute;
    top: 10px;
    left: 10px;
    z-index: 5;
    font-size: 10px;
    font-weight: 900;
    padding: 3px 8px;
    border-radius: 4px;
    color: #fff;
    text-transform: uppercase;
}

/* Se o badge dinâmico estiver no Top Left (pos-1), movemos o status-badge para baixo ou para o lado */
.badge-pos-1~.status-badge {
    top: 35px;
}

.manga-title-badges,
.manga-title-badges.adult,
.scrollbar-glass {
    background: #ff4b2b;
    color: #fff;
    padding: 3px 10px;
    border-radius: 4px;
    font-size: 10px;
    font-weight: 900;
    text-transform: uppercase;
    display: inline-block;
    box-shadow: 0 4px 10px rgba(0, 0, 0, 0.3);
    margin: 2px 0;
}

/* Cores específicas para tags do tags_cachorro */
.scrollbar-glass.hot {
    background: #ff4b2b;
}

.scrollbar-glass.new {
    background: #2ecc71;
}

.scrollbar-glass.custom {
    background: #f1c40f;
    color: #000;
}


/* Overlay de Estrelas/Rating */
.poster-overlay {
    background: linear-gradient(to top, rgba(0, 0, 0, 0.8), transparent);
    position: absolute;
    bottom: 0;
    width: 100%;
    padding: 20px 10px 10px;
}

/* --- BADGE POSITIONS (LOOP CARDS) --- */
.manga-badges {
    position: absolute;
    z-index: 5;
    display: flex;
    flex-direction: column;
    gap: 5px;
    padding: 10px;
    pointer-events: none;
}

.badge-pos-1 {
    top: 0;
    left: 0;
}

.badge-pos-2 {
    top: 0;
    right: 0;
}

.badge-pos-3 {
    bottom: 40px;
    left: 0;
}

/* Ajuste para não cobrir o rodapé do card */
.badge-pos-4 {
    bottom: 40px;
    right: 0;
}

.scrollbar-glass,
.manga-title-badges {
    pointer-events: auto;
}

/* --- MANGA CARDS (LOOP) --- */
.main-content {
    flex: 1;
    margin-left: 0;
    /* Conteúdo sempre ocupa a tela toda */
    min-height: 100vh;
    transition: var(--transition);
    display: flex;
    flex-direction: column;
}

.content-inner {
    flex: 1;
}

/* Força o container principal a ficar centralizado com margens laterais (Vácuo) */
.c-page-content .container,
.profile-manga .container {
    max-width: 1300px !important;
    margin: 0 auto !important;
    width: 95% !important;
    /* Margem mínima de segurança */
}

body.no-sidebar .content-inner {
    max-width: 1300px;
    margin: 0 auto;
}

.card-hunters .card-info {
    padding: 12px 0;
}

.card-hunters {
    border-radius: var(--card-radius);
    overflow: visible !important;
    transition: var(--transition);
}

/* Garante os cantos arredondados no topo do card-hunters */
.card-hunters .poster-wrapper,
.card-hunters .poster-wrapper img,
.card-hunters .poster-wrapper .adult-overlay {
    border-top-left-radius: var(--card-radius) !important;
    border-top-right-radius: var(--card-radius) !important;
}

.card-hunters .card-info {
    padding: 12px 0;
}

.card-hunters .card-title {
    margin-bottom: 5px;
    font-size: 14px;
    font-weight: 700;
}

/* --- ADULT CONTENT BLUR EFFECT --- */
.poster-wrapper.is-adult img {
    filter: blur(15px) grayscale(1);
    transition: var(--transition);
}

.poster-wrapper.is-adult:hover img {
    filter: blur(0) grayscale(0);
}

.adult-overlay {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.4);
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    color: white;
    z-index: 10;
    transition: var(--transition);
    pointer-events: none;
}

.adult-overlay i {
    font-size: 32px;
    margin-bottom: 10px;
    opacity: 0.8;
}

.adult-overlay span {
    font-weight: 900;
    font-size: 14px;
    letter-spacing: 1px;
    background: rgba(255, 0, 0, 0.8);
    padding: 5px 15px;
    border-radius: 5px;
}

.poster-wrapper.is-adult:hover .adult-overlay {
    opacity: 0;
    visibility: hidden;
}



.manga-grit-section {
    width: 100%;
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 20px;
}

@media (max-width: 1200px) {
    .manga-grit-section {
        max-width: 1000px;
    }
}

@media (max-width: 1024px) {
    .manga-grit-section {
        max-width: 900px;
    }
}

@media (max-width: 900px) {
    .manga-grit-section {
        max-width: 768px;
    }
}

@media (max-width: 768px) {
    .manga-grit-section {
        max-width: 600px;
    }
}

@media (max-width: 600px) {
    .manga-grit-section {
        max-width: 400px;
    }
}

@media (max-width: 420px) {
    .manga-grit-section {
        max-width: 100%;
        padding: 0 15px;
    }
}

.card-hunters .card-title a {
    color: var(--text-main);
    text-decoration: none;
}

.card-hunters .card-meta {
    font-size: 11px;
    color: var(--text-muted);
    margin-bottom: 12px;
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.card-hunters .meta-rating,
.card-hunters .meta-views {
    display: flex;
    align-items: center;
    gap: 6px;
}

.card-hunters .meta-rating {
    color: #f1c40f;
}

.card-hunters .meta-views {
    color: var(--text-muted);
}

.card-hunters .latest-chapters-list {
    border-top: 1px solid var(--border-color);
    padding-top: 8px;
}

.card-hunters .chap-item {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 4px;
}

.card-hunters .chap-link {
    font-size: 12px;
    color: var(--primary);
    font-weight: 600;
    text-decoration: none;
}

.card-hunters .chap-date {
    font-size: 10px;
    color: #555;
}

/* Badges e Tags nos Cards */
.card-info {
    padding: 15px;
}

.card-title a {
    font-size: 16px;
    font-weight: 600;
    color: var(--text-main);
    text-decoration: none;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.card-meta a {
    color: var(--primary);
    font-size: 12px;
    text-transform: uppercase;
    font-weight: 700;
}

/* --- FOOTER --- */
.main-footer {
    padding: 60px 40px;
    border-top: 1px solid var(--border-color);
    margin-top: 40px;
}

.footer-content {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 20px;
    text-align: center;
}

.footer-brand {
    font-family: 'Oswald', sans-serif;
    font-size: 24px;
    font-weight: 700;
    color: white;
    display: flex;
    align-items: center;
    gap: 10px;
}

.footer-brand i {
    color: var(--primary);
}

.copyright {
    color: var(--text-muted);
    font-size: 14px;
    margin: 0;
}

.footer-links {
    display: flex;
    gap: 20px;
}

.footer-links a {
    color: var(--text-muted);
    text-decoration: none;
    font-size: 13px;
    font-weight: 600;
    transition: 0.3s;
}

.footer-links a:hover {
    color: var(--primary);
}

/* --- BOTTOM NAV (MOBILE) --- */
.bottom-nav {
    display: none;
    position: fixed;
    bottom: 0;
    left: 0;
    width: 100%;
    height: var(--bottom-nav-h);
    background: rgba(18, 18, 20, 0.9);
    backdrop-filter: blur(12px);
    border-top: 1px solid var(--border-color);
    z-index: 1000;
    justify-content: space-around;
    align-items: center;
    padding: 0 10px;
}

@media (max-width: 900px) {
    .bottom-nav {
        display: flex;
    }

    .main-footer {
        padding-bottom: 100px;
    }

    /* Espaço para a barra */
}

.b-nav-item {
    display: flex;
    flex-direction: column;
    align-items: center;
    color: var(--text-muted);
    text-decoration: none;
    font-size: 10px;
    gap: 4px;
    flex: 1;
}

.b-nav-item i {
    font-size: 20px;
    transition: 0.3s;
}

.b-nav-item.active {
    color: var(--primary);
}

.b-nav-item:hover {
    color: white;
}

/* --- Customização de Scrollbar --- */
::-webkit-scrollbar {
    width: 8px;
}

::-webkit-scrollbar-track {
    background: var(--bg-dark);
}

::-webkit-scrollbar-thumb {
    background: #333;
    border-radius: 10px;
}

::-webkit-scrollbar-thumb:hover {
    background: var(--primary);
}

/* --- BARRA DE FILTROS (ARCHIVE) --- */
.archive-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-wrap: wrap;
    gap: 20px;
    position: relative;
    z-index: 100;
    margin-bottom: 40px;
}

.archive-header h1 {
    font-family: 'Oswald', sans-serif;
    font-size: 32px;
    text-transform: uppercase;
    margin: 0;
}

/* --- MAIN FOOTER --- */
.main-footer {
    padding: 60px 40px;
    border-top: 1px solid var(--border-color);
    background: var(--bg-app);
    margin-top: auto;
}

.footer-content {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 20px;
    text-align: center;
}

.footer-brand {
    display: flex;
    align-items: center;
    gap: 12px;
    font-family: 'Oswald', sans-serif;
    font-size: 24px;
    color: white;
    text-transform: uppercase;
}

.footer-brand i {
    color: var(--primary);
}

.copyright-text {
    color: var(--text-muted);
    font-size: 14px;
    max-width: 600px;
    line-height: 1.6;
}

.footer-links {
    display: flex;
    gap: 20px;
}

.footer-links a,
.footer-nav-list li a {
    color: var(--text-muted);
    text-decoration: none;
    font-size: 13px;
    font-weight: 600;
    transition: 0.3s;
}

.footer-links a:hover,
.footer-nav-list li a:hover {
    color: var(--primary);
}

.footer-nav-list {
    list-style: none;
    padding: 0;
    margin: 0;
    display: flex;
    gap: 20px;
}

/* --- MOBILE NAVIGATION --- */
.bottom-nav {
    display: none;
    position: fixed;
    bottom: 0;
    left: 0;
    width: 100%;
    height: var(--bottom-nav-h);
    background: rgba(18, 18, 20, 0.95);
    backdrop-filter: blur(10px);
    border-top: 1px solid rgba(255, 255, 255, 0.05);
    z-index: 3000;
    justify-content: space-around;
    align-items: center;
}

@media (max-width: 900px) {
    .modern-layout .bottom-nav {
        display: flex;
    }

    .main-content {
        padding-bottom: var(--bottom-nav-h);
    }
}

.b-nav-item {
    display: flex;
    flex-direction: column;
    align-items: center;
    color: #777;
    font-size: 10px;
    text-decoration: none;
}

.b-nav-item.active {
    color: var(--primary);
}

.b-nav-item i {
    font-size: 20px;
    margin-bottom: 4px;
}

.archive-header h1 i {
    color: var(--primary);
    margin-right: 15px;
}

.archive-header .count-badge {
    font-size: 14px;
    color: var(--text-muted);
    font-family: 'Poppins', sans-serif;
    font-weight: 400;
    margin-left: 10px;
}

.modern-layout .container {
    padding-top: 40px;
    padding-bottom: 60px;
    padding-left: 20px;
    padding-right: 20px;
}

.no-results {
    text-align: center;
    grid-column: 1/-1;
    padding: 100px 0;
    color: var(--text-muted);
}

.c-nav-tabs {
    display: flex;
    align-items: center;
    gap: 15px;
}

.c-nav-tabs span {
    font-size: 13px;
    text-transform: uppercase;
    font-weight: 700;
    color: var(--text-muted);
    letter-spacing: 1px;
}

.c-tabs-content {
    display: flex;
    gap: 10px;
    list-style: none;
    padding: 0;
    margin: 0;
}

.c-tabs-content li a {
    display: block;
    padding: 6px 16px;
    background: rgba(255, 255, 255, 0.05);
    border: 1px solid var(--border-color);
    border-radius: 50px;
    color: var(--text-muted);
    font-size: 13px;
    font-weight: 600;
    text-decoration: none;
    transition: 0.3s;
}

.c-tabs-content li a:hover,
.c-tabs-content li.active a {
    background: var(--primary);
    color: white;
    border-color: var(--primary);
    box-shadow: 0 4px 15px rgba(124, 58, 237, 0.3);
}

@media (max-width: 768px) {
    .archive-header {
        flex-direction: column;
        align-items: flex-start;
    }

    .c-tabs-content {
        flex-wrap: wrap;
    }
}

/* --- BOTÃO CARREGAR MAIS (AJAX) UNIFICADO --- */
.archive-pagination,
.load-more-container {
    display: flex;
    justify-content: center;
    padding: 20px 0;
    margin: 40px auto;
    max-width: 1400px;
    width: 100%;
}

.navigation-ajax,
.load-more-container {
    text-align: center;
}

/* Classe principal para os botões de Load More */
.load-ajax,
.btn-load-more {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: rgba(255, 255, 255, 0.05);
    border: 1px solid rgba(255, 255, 255, 0.1);
    color: white;
    padding: 15px 60px;
    border-radius: 12px;
    font-family: 'Inter', sans-serif;
    font-size: 14px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 1px;
    text-decoration: none;
    transition: all 0.3s cubic-bezier(0.25, 0.8, 0.25, 1);
    cursor: pointer;
    gap: 12px;
    min-width: 280px;
}

.load-ajax:hover,
.btn-load-more:hover {
    background: var(--primary);
    border-color: var(--primary);
    transform: translateY(-3px);
    box-shadow: 0 10px 20px rgba(124, 58, 237, 0.2);
    color: white;
}

/* Spinner e Estados de Loading */
.load-ajax.show-loading,
.btn-load-more.loading {
    opacity: 0.7;
    pointer-events: none;
}

.load-ajax .load-title,
.btn-load-more span {
    display: flex;
    align-items: center;
    gap: 10px;
}

/* Esconde elementos nativos do Madara se existirem dentro do botão */
.load-ajax div:not(.load-title),
.btn-load-more .loader-spinner {
    display: none;
}

.load-ajax.show-loading::after,
.btn-load-more.loading::after {
    content: "";
    display: inline-block;
    width: 18px;
    height: 18px;
    border: 2px solid rgba(255, 255, 255, 0.3);
    border-top-color: white;
    border-radius: 50%;
    animation: spin-load 0.8s linear infinite;
}

@keyframes spin-load {
    to {
        transform: rotate(360deg);
    }
}

/* --- MIGRATED MENU (NO SIDEBAR MODE) --- */
.top-bar-left {
    display: flex;
    align-items: center;
    gap: 30px;
    flex: 1;
}

.migrated-sidebar-menu {
    display: block;
    min-width: 0;
}

.top-nav-migrated {
    list-style: none;
    display: flex;
    gap: 25px;
    padding: 0;
    margin: 0;
    align-items: center;
}

.top-nav-migrated li {
    white-space: nowrap;
}

.top-nav-migrated li a {
    color: var(--text-main);
    text-decoration: none;
    font-size: 13px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    opacity: 0.7;
    transition: var(--transition);
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 10px 0;
}

.top-nav-migrated li a:hover,
.top-nav-migrated li.current-menu-item a {
    opacity: 1;
    color: var(--primary);
}

.top-nav-migrated li a i {
    font-size: 15px;
    color: var(--primary);
}

/* Esconde ícones de edição do customizer para não quebrar o layout */
.top-nav-migrated .customize-partial-edit-shortcut {
    position: absolute;
    margin-left: -20px;
    margin-top: -15px;
}

@media (max-width: 1100px) {
    .top-nav-migrated {
        gap: 15px;
    }

    .top-nav-migrated li a span {
        display: none;
    }

    /* Mostra só ícones se apertar muito */
}

@media (max-width: 992px) {
    .migrated-sidebar-menu {
        display: none;
    }
}


/* --- MOBILE OPTIMIZATIONS (RESPONSIVE) --- */
@media (max-width: 768px) {
    :root {
        --header-h: 60px;
    }

    .top-bar {
        padding: 0 15px;
    }

    .search-container {
        flex: 1;
        max-width: 200px;
    }

    .search-container input {
        font-size: 12px;
        padding: 8px 10px 8px 30px;
    }

    .content-inner {
        padding: 20px 15px;
    }

    /* Grid de Cards Mobile */
    .manga-grit,
    .grid-manga {
        grid-template-columns: repeat(2, 1fr) !important;
        gap: 15px;
        padding: 10px 0;
    }

    .card-hunters .card-title {
        font-size: 13px;
    }

    .hero-item h1 {
        font-size: 24px;
    }

    .hero-item p {
        display: none;
        /* Esconde resumo longo no mobile */
    }

    .hero-item {
        background-position: center;
        padding: 40px 20px;
    }

    /* Ajustes do Calendário de Lançamentos */
    .release-calendar-container {
        padding: 10px 0;
    }

    .calendar-days {
        gap: 8px;
        overflow-x: auto;
        padding-bottom: 10px;
        justify-content: flex-start;
    }

    .day-item {
        min-width: 80px;
        flex: 0 0 80px;
    }

    .calendar-header h2 {
        font-size: 18px;
    }

    .calendar-header .view-all-link {
        font-size: 12px;
        color: var(--primary);
        /* Corrige o azul */
    }

    /* Segurança contra scroll lateral */
    html,
    body {
        overflow-x: hidden;
        width: 100%;
    }

    .hero-actions .btn-primary,
    .hero-actions .btn-secondary {
        padding: 8px 15px;
        font-size: 12px;
    }
}

@media (max-width: 480px) {

    .manga-grit,
    .grid-manga {
        gap: 10px;
    }

    .card-hunters .card-info {
        padding: 8px 5px;
    }

    .meta-genre {
        display: none;
        /* Esconde gênero no mobile muito pequeno para não encavalar */
    }
}

/* ==========================================================================
   LISTA DE CAPÍTULOS (GRID GAMER PREMIUM)
   ========================================================================== */
.premium-chapter-list {
    margin-top: 30px;
}

.premium-chapter-list ul.main {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
    gap: 12px;
    padding: 0;
    list-style: none;
}

.premium-chapter-list .wp-manga-chapter {
    background: rgba(255, 255, 255, 0.03);
    border: 1px solid rgba(255, 255, 255, 0.08);
    border-radius: 12px;
    padding: 12px 18px;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin: 0;
    position: relative;
    overflow: hidden;
}

.premium-chapter-list .wp-manga-chapter:hover {
    background: rgba(255, 255, 255, 0.07);
    border-color: #ff4b82;
    transform: translateY(-3px);
    box-shadow: 0 10px 25px rgba(0, 0, 0, 0.4);
}

.premium-chapter-list .wp-manga-chapter a {
    color: #efefef;
    font-weight: 700;
    font-size: 14px;
    text-decoration: none;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    flex: 1;
    z-index: 2;
}

.premium-chapter-list .wp-manga-chapter .chapter-release-date {
    font-size: 11px;
    color: #888;
    font-weight: 600;
    text-transform: uppercase;
    margin-left: 15px;
    white-space: nowrap;
    z-index: 2;
}

.premium-chapter-list .wp-manga-chapter .chapter-release-date i {
    font-style: normal;
}

.premium-chapter-list .wp-manga-chapter.unread {
    border-left: 3px solid #ff4b82;
}

/* Ajuste para volumes */
.premium-chapter-list li.parent.has-child>a {
    display: block;
    background: rgba(255, 75, 130, 0.05);
    color: #ff4b82;
    padding: 12px 20px;
    border-radius: 8px;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: 1px;
    margin-top: 20px;
    margin-bottom: 15px;
    grid-column: 1 / -1;
    border: 1px solid rgba(255, 75, 130, 0.1);
}

.premium-chapter-list .sub-chap-list {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
    gap: 12px;
    padding: 0;
    width: 100%;
    grid-column: 1 / -1;
    list-style: none;
}

.premium-chapter-list .sub-chap {
    padding: 0;
    margin-bottom: 25px;
    list-style: none;
}

/* Responsividade Mobile */
@media (max-width: 768px) {

    .premium-chapter-list ul.main,
    .premium-chapter-list .sub-chap-list {
        grid-template-columns: 1fr;
    }
}

/* ==========================================================================
   NAVEGAÇÃO POR ABAS (TABS GAMER VERTICAL)
   ========================================================================== */
.manga-tabs-vertical-wrapper {
    display: flex;
    gap: 30px;
    margin-top: 30px;
}

@media (max-width: 991px) {
    .manga-tabs-vertical-wrapper {
        flex-direction: column;
        gap: 20px;
    }
}

.nav-tabs#manga_content-navs {
    display: flex;
    flex-direction: column;
    border: none;
    gap: 10px;
    width: 240px;
    flex-shrink: 0;
    background: rgba(255, 255, 255, 0.02);
    padding: 15px;
    border-radius: 20px;
    border: 1px solid rgba(255, 255, 255, 0.05);
    backdrop-filter: blur(10px);
}

@media (max-width: 991px) {
    .nav-tabs#manga_content-navs {
        width: 100%;
        flex-direction: row;
        overflow-x: auto;
        padding: 10px;
        gap: 15px;
        border-radius: 15px;
        scrollbar-width: none;
        /* Firefox */
    }

    .nav-tabs#manga_content-navs::-webkit-scrollbar {
        display: none;
        /* Chrome/Safari */
    }
}

.nav-tabs#manga_content-navs .nav-item {
    margin: 0;
    width: 100%;
    background: transparent;
    border: none;
}

@media (max-width: 991px) {
    .nav-tabs#manga_content-navs .nav-item {
        width: auto;
        white-space: nowrap;
    }
}

.nav-tabs#manga_content-navs .nav-link {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 14px 18px;
    background: transparent;
    border: none;
    border-radius: 14px;
    color: #888;
    font-weight: 700;
    font-size: 13px;
    text-transform: uppercase;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    letter-spacing: 1px;
    text-decoration: none;
}

.nav-tabs#manga_content-navs .nav-link i {
    font-size: 16px;
    width: 20px;
    text-align: center;
}

.nav-tabs#manga_content-navs .nav-link:hover {
    color: #fff;
    background: rgba(255, 255, 255, 0.05);
}

.nav-tabs#manga_content-navs .nav-link.active {
    background: var(--primary);
    opacity: 0.9;
    color: #fff;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.2);
    border: 1px solid rgba(255, 255, 255, 0.1);
}

.nav-tabs#manga_content-navs .nav-link.active i {
    color: #fff;
}

.tab-content#manga-content-tabs {
    flex: 1;
    min-width: 0;
}

.tab-pane {
    display: none;
}

.tab-pane.active {
    display: block;
}

/* ==========================================================================
   BUSCA DE CAPÍTULOS (ESTILO GAMER)
   ========================================================================== */
.chapter-search-wrap {
    margin-bottom: 25px;
}

.chapter-search-inner {
    position: relative;
    max-width: 400px;
}

.chapter-search-inner i {
    position: absolute;
    left: 15px;
    top: 50%;
    transform: translateY(-50%);
    color: #666;
    font-size: 14px;
}

.chapter-search-inner input {
    width: 100%;
    background: rgba(255, 255, 255, 0.03);
    border: 1px solid rgba(255, 255, 255, 0.08);
    border-radius: 12px;
    padding: 12px 15px 12px 45px;
    color: #fff;
    font-size: 14px;
    outline: none;
    transition: 0.3s;
}

.chapter-search-inner input:focus {
    border-color: var(--primary);
    background: rgba(255, 255, 255, 0.06);
    box-shadow: 0 0 15px rgba(157, 29, 242, 0.2);
}

/* ==========================================================================
   GALERIA DE PERSONAGENS (PREMIUM)
   ========================================================================== */
.premium-characters-section {
    padding: 30px 0;
}

.premium-characters-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(130px, 1fr));
    gap: 25px;
}

.character-card-premium {
    text-align: center;
    transition: 0.3s;
}

.character-avatar-wrap {
    width: 110px;
    height: 110px;
    margin: 0 auto 15px;
    border-radius: 50%;
    padding: 4px;
    background: linear-gradient(45deg, rgba(255, 75, 130, 0.3), transparent);
    border: 1px solid rgba(255, 255, 255, 0.1);
    transition: 0.4s;
    overflow: hidden;
}

.character-card-premium:hover .character-avatar-wrap {
    transform: scale(1.1) rotate(5deg);
    border-color: #ff4b82;
    box-shadow: 0 0 20px rgba(255, 75, 130, 0.4);
    background: #ff4b82;
}

.character-avatar-wrap img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    border-radius: 50%;
}

.character-name-premium {
    font-size: 13px;
    font-weight: 700;
    color: #efefef;
    margin: 0;
    text-shadow: 0 2px 4px rgba(0, 0, 0, 0.5);
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.character-card-premium:hover .character-name-premium {
    color: var(--primary);
    text-shadow: 0 0 10px rgba(var(--primary-rgb), 0.5);
}

.empty-characters-state {
    padding: 50px;
    text-align: center;
    background: rgba(255, 255, 255, 0.02);
    border-radius: 15px;
    border: 1px dashed rgba(255, 255, 255, 0.1);
    color: #666;
}

/* ==========================================================================
   OBRAS RELACIONADAS (PREMIUM GRID)
   ========================================================================== */
.premium-related-section {
    max-width: 1200px;
    margin: auto;
    margin-top: 50px;
    padding-top: 30px;
    border-top: 1px solid rgba(255, 255, 255, 0.05);
}

.premium-related-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(180px, 1fr));
    gap: 20px;
    margin-top: 25px;
}

.related-item-premium {
    position: relative;
    transition: 0.3s;
}

.related-thumb-link {
    display: block;
    position: relative;
    border-radius: 12px;
    overflow: hidden;
    aspect-ratio: 2/3;
}

.related-thumb-link img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: 0.5s;
}

.related-overlay {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.5);
    display: flex;
    align-items: center;
    justify-content: center;
    opacity: 0;
    transition: 0.3s;
}

.related-overlay i {
    color: #fff;
    font-size: 30px;
    transform: scale(0.5);
    transition: 0.3s;
}

.related-item-premium:hover .related-overlay {
    opacity: 1;
}

.related-item-premium:hover .related-overlay i {
    transform: scale(1);
}

.related-item-premium:hover img {
    transform: scale(1.1);
}

.related-info-premium {
    margin-top: 12px;
}

.related-title {
    font-size: 13px;
    font-weight: 700;
    margin: 0 0 5px;
    line-height: 1.4;
}

.related-title a {
    color: #fff;
    text-decoration: none;
}

.related-type {
    font-size: 10px;
    color: #ff4b82;
    font-weight: 900;
    letter-spacing: 1px;
}

/* Responsividade Related */
@media (max-width: 600px) {
    .premium-related-grid {
        grid-template-columns: repeat(2, 1fr);
    }
}

/* ==========================================================================
   MODAL PREMIUM (GLASSMORPHISM)
   ========================================================================== */
.modal-content {
    background: rgba(15, 15, 18, 0.85);
    backdrop-filter: blur(20px);
    border: 1px solid rgba(255, 255, 255, 0.08);
    border-radius: 24px;
    box-shadow: 0 25px 50px -12px rgba(0, 0, 0, 0.6);
}

.modal-header {
    border: none;
    padding: 20px 30px 10px;
}

.modal-header .close {
    color: #fff;
    opacity: 0.5;
    text-shadow: none;
    transition: 0.3s;
}

.modal-header .close:hover {
    opacity: 1;
}

.modal-body {
    padding: 10px 30px 30px;
}

.manga-info h5 {
    font-family: 'Oswald', sans-serif;
    color: var(--primary);
    text-transform: uppercase;
    letter-spacing: 1px;
    margin-bottom: 15px;
}

/* ==========================================================================
   AJUSTES RESPONSIVOS FINAIS (MANGA SINGLE)
   ========================================================================== */
@media (max-width: 768px) {
    .manga-title-premium {
        font-size: 1.8rem;
        line-height: 1.1;
        text-align: center;
    }

    .premium-chapter-list ul.main {
        grid-template-columns: 1fr;
    }

    .premium-characters-grid {
        grid-template-columns: repeat(auto-fill, minmax(100px, 1fr));
        gap: 15px;
    }

    .character-avatar-wrap {
        width: 80px;
        height: 80px;
    }

    .premium-related-grid {
        grid-template-columns: repeat(2, 1fr);
        gap: 12px;
    }

    .tab-content#manga-content-tabs {
        padding: 0 5px;
    }
}

@media (max-width: 480px) {
    .manga-title-premium {
        font-size: 1.5rem;
    }

    .nav-tabs#manga_content-navs .nav-link {
        padding: 10px 14px;
        font-size: 11px;
    }
}

.manga-about {
    color: #ccc;
    line-height: 1.8;
    font-size: 15px;
    margin-bottom: 30px;
}

/* --- PREMIUM CHARACTERS SECTION --- */
.manga-summary-premium {
    font-size: 15px;
    line-height: 1.8;
    color: rgba(255, 255, 255, 0.7);
    margin: 25px 0;
    text-align: justify;
}

.manga-summary-premium p {
    margin-bottom: 15px;
}

.manga-summary-premium strong {
    color: var(--primary);
}

.premium-characters-section {
    padding: 30px 10px;
}

.premium-characters-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(140px, 1fr));
    gap: 25px;
    justify-items: center;
}

.character-card-premium {
    text-align: center;
    transition: 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275);
    cursor: pointer;
    width: 100%;
    max-width: 140px;
}

.character-avatar-wrap {
    position: relative;
    width: 120px;
    height: 120px;
    margin: 0 auto 15px;
    border-radius: 50%;
    padding: 4px;
    background: linear-gradient(45deg, rgba(124, 58, 237, 0.1), rgba(236, 72, 153, 0.1));
    border: 1px solid rgba(255, 255, 255, 0.05);
    transition: 0.3s;
}

.character-avatar-wrap img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    border-radius: 50%;
    background: #111;
    transition: 0.3s;
}

.character-name-premium {
    color: #fff;
    font-size: 14px;
    font-weight: 700;
    margin: 0;
    text-transform: uppercase;
    letter-spacing: 1px;
    opacity: 0.8;
    transition: 0.3s;
}

/* Hover Effects */
.character-card-premium:hover {
    transform: translateY(-8px);
}

.character-card-premium:hover .character-avatar-wrap {
    background: linear-gradient(45deg, var(--primary), #ec4899);
    box-shadow: 0 0 20px rgba(124, 58, 237, 0.4);
    border-color: rgba(255, 255, 255, 0.2);
}

.character-card-premium:hover .character-name-premium {
    color: var(--primary);
    opacity: 1;
    text-shadow: 0 0 10px rgba(124, 58, 237, 0.3);
}

.empty-characters-state {
    text-align: center;
    padding: 60px 20px;
    background: rgba(255, 255, 255, 0.02);
    border-radius: 20px;
    border: 1px dashed rgba(255, 255, 255, 0.1);
    color: rgba(255, 255, 255, 0.4);
    font-style: italic;
}



.upload-field-group {
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.field-label {
    font-size: 13px;
    font-weight: 700;
    color: var(--primary);
    text-transform: uppercase;
    letter-spacing: 1px;
}

.modern-input {
    width: 100%;
    background: rgba(255, 255, 255, 0.05);
    border: 1px solid rgba(255, 255, 255, 0.1);
    border-radius: 12px;
    padding: 12px 18px;
    color: #fff;
    font-size: 15px;
    transition: 0.3s;
}

.modern-input:focus {
    background: rgba(255, 255, 255, 0.08);
    border-color: var(--primary);
    box-shadow: 0 0 15px rgba(124, 58, 237, 0.2);
    outline: none;
}

/* Volume Wrap */
.volume-selector-wrap {
    display: flex;
    gap: 15px;
    align-items: center;
}

.volume-selector-wrap .select2-container {
    flex-grow: 1;
}

.checkbox-premium {
    display: flex;
    align-items: center;
    gap: 8px;
    cursor: pointer;
    font-size: 12px;
    font-weight: 700;
    color: #fff;
    white-space: nowrap;
}

.checkbox-premium input {
    display: none;
}

.checkbox-box {
    width: 18px;
    height: 18px;
    border: 2px solid rgba(255, 255, 255, 0.2);
    border-radius: 5px;
    position: relative;
    transition: 0.3s;
}

.checkbox-premium input:checked+.checkbox-box {
    background: var(--primary);
    border-color: var(--primary);
}

.checkbox-premium input:checked+.checkbox-box::after {
    content: '\f00c';
    font-family: 'Font Awesome 6 Free';
    font-weight: 900;
    font-size: 10px;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    color: #fff;
}



/* Image Items (Uploaded) */
.chapter-single-image {
    position: relative;
    aspect-ratio: 1;
    border-radius: 12px;
    overflow: hidden;
    border: 2px solid var(--primary);
}

.chapter-single-image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.remove-image {
    position: absolute;
    top: 5px;
    right: 5px;
    background: #ef4444;
    color: #fff;
    width: 24px;
    height: 24px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 14px;
    cursor: pointer;
    z-index: 10;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.4);
}

/* Submit Section */
.upload-submit-wrap {
    text-align: center;
}

.btn-premium-upload {
    background: linear-gradient(45deg, var(--primary), #ec4899);
    color: #fff;
    border: none;
    padding: 18px 40px;
    border-radius: 16px;
    font-size: 16px;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: 2px;
    cursor: pointer;
    transition: 0.3s;
    box-shadow: 0 10px 25px rgba(124, 58, 237, 0.4);
    display: flex;
    align-items: center;
    gap: 15px;
    margin: 0 auto;
}

.btn-premium-upload:hover {
    transform: translateY(-5px) scale(1.02);
    box-shadow: 0 15px 35px rgba(124, 58, 237, 0.5);
}

/* Fix Select2 for modern style */
.modern-upload-container select.modern-select {
    display: none;
}

.modern-upload-container .select2-container {
    width: 100%;
}

.modern-upload-container .select2-container--default .select2-selection--single {
    background: rgba(255, 255, 255, 0.05);
    border: 1px solid rgba(255, 255, 255, 0.1);
    border-radius: 12px;
    height: 54px;
    display: flex;
    align-items: center;
    transition: 0.3s;
}

.modern-upload-container .select2-container--default .select2-selection--single:focus,
.modern-upload-container .select2-container--default.select2-container--focus .select2-selection--single {
    border-color: var(--primary);
    background: rgba(255, 255, 255, 0.08);
    outline: none;
}

.modern-upload-container .select2-container--default .select2-selection--single .select2-selection__rendered {
    color: #fff;
    padding-left: 20px;
    font-size: 15px;
    font-weight: 500;
}

.modern-upload-container .select2-container--default .select2-selection--single .select2-selection__arrow {
    height: 54px;
    right: 15px;
}

.modern-upload-container .select2-container--default .select2-selection--single .select2-selection__arrow b {
    border-color: rgba(255, 255, 255, 0.4) transparent transparent transparent;
}

.modern-upload-container .select2-dropdown {
    background: #121212;
    border: 1px solid var(--primary);
    border-radius: 12px;
    overflow: hidden;
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.5);
}

.modern-upload-container .select2-results__options {
    list-style: none;
    padding: 0;
    margin: 0;
}

.modern-upload-container .select2-results__option {
    padding: 12px 20px;
    color: rgba(255, 255, 255, 0.7);
    list-style: none;
}

.modern-upload-container .select2-results__option--highlighted[aria-selected] {
    background-color: var(--primary);
    color: #fff;
}

.select2-container--default .select2-search--dropdown .select2-search__field {
    background: #1a1a1a;
    border: 1px solid rgba(255, 255, 255, 0.1);
    color: #fff;
    border-radius: 8px;
    padding: 10px;
}

/* Fix z-index for dropdown */
.select2-container--open {
    z-index: 999999;
}

/* Circular Chart Pink */
.circular-chart.pink .circle {
    stroke: #ec4899;
    filter: drop-shadow(0 0 5px rgba(236, 72, 153, 0.5));
}

.circular-chart.pink .circle-bg {
    stroke: rgba(255, 255, 255, 0.05);
}

.circular-chart.pink .percentage {
    fill: #fff;
    font-family: 'Outfit', sans-serif;
    font-weight: 800;
}

/* --- RESPONSIVE ADJUSTMENTS --- */
@media (max-width: 991px) {
    .manga-attributes-grid {
        grid-template-columns: repeat(2, 1fr);
        gap: 15px;
    }
}

@media (max-width: 768px) {
    .modern-upload-container {
        padding: 25px 20px;
        border-radius: 16px;
    }

    .btn-premium-upload {
        width: 100%;
        justify-content: center;
        padding: 15px;
        font-size: 14px;
    }

    .manga-title-premium {
        font-size: 24px;
        text-align: center;
    }

    .manga-pills-minimal {
        justify-content: center;
    }

    .manga-attributes-grid {
        grid-template-columns: 1fr;
        gap: 12px;
    }

    .premium-characters-grid {
        grid-template-columns: repeat(auto-fill, minmax(120px, 1fr));
        gap: 15px;
    }

    .character-card {
        height: 180px;
    }

    .manga-summary-premium {
        font-size: 14px;
        line-height: 1.6;
        text-align: left;
    }
}

@media (max-width: 480px) {
    .manga-hero-actions {
        flex-direction: column;
        gap: 10px;
    }

    .manga-hero-actions .btn,
    .manga-hero-actions .wp-manga-action-button {
        width: 100%;
        text-align: center;
        justify-content: center;
    }

    .volume-selector-wrap {
        flex-direction: column;
        align-items: flex-start;
    }

    .checkbox-premium {
        margin-top: 5px;
    }
}

/* --- ADULT CONTENT MODAL PREMIUM --- */
.adult-modal-overlay {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.85);
    backdrop-filter: blur(15px);
    z-index: 9999999;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 20px;
}

.adult-modal-glass {
    background: linear-gradient(135deg, rgba(255, 255, 255, 0.05) 0%, rgba(255, 255, 255, 0.02) 100%);
    border: 1px solid rgba(255, 255, 255, 0.1);
    border-radius: 30px;
    max-width: 500px;
    width: 100%;
    padding: 40px;
    text-align: center;
    box-shadow: 0 25px 50px rgba(0, 0, 0, 0.5);
    animation: modalSlideUp 0.6s cubic-bezier(0.4, 0, 0.2, 1);
}

@keyframes modalSlideUp {
    from {
        opacity: 0;
        transform: translateY(40px);
    }

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

.neon-icon {
    font-size: 60px;
    color: #ff3e81;
    text-shadow: 0 0 20px rgba(255, 62, 129, 0.5);
    margin-bottom: 25px;
}

.adult-modal-header h2 {
    font-size: 28px;
    font-weight: 900;
    letter-spacing: 2px;
    color: #fff;
    margin-bottom: 20px;
}

.adult-modal-body .manga-title {
    font-size: 20px;
    color: var(--primary);
    font-weight: 700;
    margin-bottom: 15px;
}

.adult-modal-body .warning-text {
    font-size: 15px;
    color: rgba(255, 255, 255, 0.7);
    line-height: 1.6;
    margin-bottom: 20px;
}

.adult-modal-body .question {
    font-size: 18px;
    font-weight: 700;
    color: #fff;
    margin-bottom: 30px;
}

.adult-modal-footer {
    display: flex;
    gap: 15px;
    justify-content: center;
}

.btn-adult {
    padding: 14px 25px;
    border-radius: 12px;
    font-weight: 800;
    font-size: 14px;
    text-transform: uppercase;
    transition: 0.3s;
    text-decoration: none;
    display: inline-flex;
    align-items: center;
    gap: 10px;
}

.btn-exit {
    background: rgba(255, 255, 255, 0.05);
    color: #fff;
    border: 1px solid rgba(255, 255, 255, 0.1);
}

.btn-exit:hover {
    background: rgba(255, 255, 255, 0.1);
}

.btn-confirm {
    background: var(--primary);
    color: #fff;
    border: none;
    box-shadow: 0 0 20px rgba(255, 62, 129, 0.3);
}

.btn-confirm:hover {
    transform: scale(1.05);
    box-shadow: 0 0 30px rgba(255, 62, 129, 0.5);
}

/* Substituindo o blur global (pesado) por uma camada escura (leve) */
body.body-censored .modern-wrapper {
    filter: brightness(0.2) grayscale(0.5);
    /* Muito mais leve que blur */
    pointer-events: none;
}

/* Instant hide if confirmed */
.adult-confirmed .adult-modal-overlay {
    display: none;
}

.adult-confirmed body.body-censored .modern-wrapper {
    filter: none;
    pointer-events: auto;
}

/* --- PREMIUM DASHBOARD SECTION --- */
.profile-premium-wrapper {
    margin-top: 40px;
    padding-bottom: 60px;
}

.profile-header-glass {
    background: linear-gradient(135deg, rgba(255, 255, 255, 0.05) 0%, rgba(255, 255, 255, 0.02) 100%);
    backdrop-filter: blur(15px);
    border: 1px solid rgba(255, 255, 255, 0.1);
    border-radius: 30px;
    padding: 50px;
    margin-bottom: 30px;
    position: relative;
    overflow: hidden;
}

.profile-header-glass::before {
    content: '';
    position: absolute;
    top: -50px;
    right: -50px;
    width: 200px;
    height: 200px;
    background: var(--primary);
    opacity: 0.1;
    z-index: 0;
}

.profile-main-info {
    position: relative;
    z-index: 1;
    display: flex;
    align-items: center;
    gap: 40px;
}

.avatar-premium-wrap {
    position: relative;
}

.avatar-premium-wrap .avatar {
    width: 140px;
    height: 140px;
    border-radius: 50%;
    border: 4px solid var(--primary);
    box-shadow: 0 0 25px rgba(255, 62, 129, 0.4);
    object-fit: cover;
}

.avatar-premium-wrap::after {
    content: '';
    position: absolute;
    top: -5px;
    left: -5px;
    right: -5px;
    bottom: -5px;
    border-radius: 50%;
    border: 2px solid rgba(255, 62, 129, 0.5);
    animation: avatarPulse 2s infinite;
}

.btn-premium {
    padding: 10px 20px;
    border-radius: 12px;
    font-weight: 700;
    font-size: 14px;
    text-transform: uppercase;
    transition: 0.3s;
    text-decoration: none;
    display: inline-flex;
    align-items: center;
    gap: 8px;
    background: var(--primary);
    color: #fff;
    border: none;
    cursor: pointer;
}

.btn-premium:hover {
    transform: translateY(-2px);
    box-shadow: 0 5px 15px rgba(255, 62, 129, 0.4);
    filter: brightness(1.1);
}

@keyframes avatarPulse {
    0% {
        transform: scale(1);
        opacity: 0.8;
    }

    50% {
        transform: scale(1.1);
        opacity: 0;
    }

    100% {
        transform: scale(1);
        opacity: 0;
    }
}

.user-premium-details h2 {
    font-size: 36px;
    font-weight: 900;
    margin: 0;
    color: #fff;
    letter-spacing: -1px;
}

.user-premium-details .user-email {
    color: rgba(255, 255, 255, 0.5);
    font-size: 16px;
    margin-top: 5px;
}

.profile-actions-premium {
    margin-top: 25px;
    display: flex;
    gap: 12px;
    flex-wrap: wrap;
}

/* Stats Cards */
.stats-premium-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
    gap: 20px;
    margin-top: 40px;
}

.stat-card-premium {
    background: rgba(255, 255, 255, 0.03);
    border: 1px solid rgba(255, 255, 255, 0.05);
    border-radius: 20px;
    padding: 25px;
    text-align: center;
    transition: 0.3s;
}

.stat-card-premium:hover {
    background: rgba(255, 255, 255, 0.06);
    transform: translateY(-5px);
    border-color: rgba(255, 62, 129, 0.3);
}

.stat-card-premium .stat-icon {
    font-size: 24px;
    color: var(--primary);
    margin-bottom: 15px;
    display: block;
}

.stat-card-premium span {
    display: block;
    font-size: 12px;
    color: rgba(255, 255, 255, 0.4);
    text-transform: uppercase;
    letter-spacing: 1px;
    margin-bottom: 5px;
}

.stat-card-premium strong {
    font-size: 18px;
    color: #fff;
    font-weight: 700;
}

/* Dashboard Tabs */
.dashboard-tabs-container {
    margin-top: 40px;
}

.tabs-header-premium {
    display: flex;
    gap: 10px;
    background: rgba(255, 255, 255, 0.03);
    padding: 10px;
    border-radius: 18px;
    margin-bottom: 30px;
    display: inline-flex;
}

.tab-btn-premium {
    padding: 12px 25px;
    border-radius: 12px;
    border: none;
    background: transparent;
    color: rgba(255, 255, 255, 0.5);
    font-weight: 700;
    cursor: pointer;
    transition: 0.3s;
    display: flex;
    align-items: center;
    gap: 10px;
}

.tab-btn-premium i {
    font-size: 16px;
}

/* --- ADVANCED SEARCH PREMIUM REFINEMENT --- */
.search-advanced-form {
    background: rgba(15, 15, 20, 0.8);
    backdrop-filter: blur(20px);
    border: 1px solid rgba(255, 255, 255, 0.08);
    box-shadow: 0 20px 50px rgba(0, 0, 0, 0.5);
}

.search-advanced-form .checkbox-group.row {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(150px, 1fr));
    gap: 10px;
    max-height: 300px;
    overflow-y: auto;
    padding: 20px;
    margin: 10px 0 25px 0;
    scrollbar-width: thin;
    scrollbar-color: var(--primary) rgba(255, 255, 255, 0.05);
}

.search-advanced-form .checkbox-group::-webkit-scrollbar {
    width: 6px;
}

.search-advanced-form .checkbox-group::-webkit-scrollbar-thumb {
    background: var(--primary);
    border-radius: 10px;
}

/* Custom Checkbox Styling */
.search-advanced-form .checkbox {
    position: relative;
    padding-left: 30px;
    margin-bottom: 8px;
    display: flex;
    align-items: center;
}

.search-advanced-form .checkbox input[type="checkbox"] {
    position: absolute;
    opacity: 0;
    cursor: pointer;
    height: 0;
    width: 0;
}

.search-advanced-form .checkbox label {
    position: relative;
    cursor: pointer;
    font-size: 13px;
    color: rgba(255, 255, 255, 0.5);
    padding-left: 5px;
    transition: 0.3s;
}

.search-advanced-form .checkbox label:before {
    content: '';
    position: absolute;
    left: -25px;
    top: 50%;
    transform: translateY(-50%);
    width: 18px;
    height: 18px;
    background: rgba(255, 255, 255, 0.05);
    border: 1px solid rgba(255, 255, 255, 0.1);
    border-radius: 4px;
    transition: 0.3s;
}

.search-advanced-form .checkbox input:checked+label:before {
    background: var(--primary);
    border-color: var(--primary);
    box-shadow: 0 0 10px rgba(255, 62, 129, 0.4);
}

.search-advanced-form .checkbox input:checked+label:after {
    content: '\f00c';
    font-family: 'Font Awesome 6 Free';
    font-weight: 900;
    position: absolute;
    left: -21px;
    top: 50%;
    transform: translateY(-50%);
    font-size: 10px;
    color: #fff;
}

.search-advanced-form .checkbox input:checked+label {
    color: #fff;
    font-weight: 700;
}

/* Estilo para Selects e Inputs */
.search-advanced-form select.form-control,
.search-advanced-form input.form-control {
    background: rgba(255, 255, 255, 0.03);
    border: 1px solid rgba(255, 255, 255, 0.1);
    color: #fff;
    height: 45px;
    padding: 0 15px;
}

.search-advanced-form select.form-control option {
    background: #111;
    color: #fff;
}

.tab-btn-premium.active {
    background: var(--primary);
    color: #fff;
    box-shadow: 0 5px 15px rgba(255, 62, 129, 0.3);
}

/* History List Premium */
.history-premium-list {
    display: grid;
    gap: 15px;
}

.history-card-premium {
    display: flex;
    align-items: center;
    gap: 20px;
    background: rgba(255, 255, 255, 0.02);
    border: 1px solid rgba(255, 255, 255, 0.05);
    padding: 15px;
    border-radius: 18px;
    transition: 0.3s;
}

.history-card-premium:hover {
    background: rgba(255, 255, 255, 0.05);
    border-color: rgba(255, 255, 255, 0.1);
    transform: translateX(10px);
}

.history-card-thumb img {
    width: 60px;
    height: 85px;
    object-fit: cover;
    border-radius: 12px;
    box-shadow: 0 5px 15px rgba(0, 0, 0, 0.3);
}

.history-card-content {
    flex-grow: 1;
}

.history-card-content h4 {
    margin: 0;
    font-size: 18px;
    font-weight: 700;
}

.history-card-content h4 a {
    color: #fff;
    text-decoration: none;
}

.history-card-content .chap-link {
    color: var(--primary);
    font-size: 14px;
    text-decoration: none;
    margin-top: 5px;
    display: inline-block;
}

.history-card-meta {
    text-align: right;
}

.history-card-meta .time-ago {
    font-size: 12px;
    color: rgba(255, 255, 255, 0.3);
}

.history-card-meta .btn-remove-premium {
    background: rgba(255, 77, 77, 0.1);
    color: #ff4d4d;
    border: none;
    width: 32px;
    height: 32px;
    border-radius: 10px;
    margin-top: 10px;
    cursor: pointer;
    transition: 0.3s;
}

.history-card-meta .btn-remove-premium:hover {
    background: #ff4d4d;
    color: #fff;
}

@media (max-width: 768px) {
    .profile-main-info {
        flex-direction: column;
        text-align: center;
    }

    .profile-header-glass {
        padding: 30px 20px;
    }

    .tabs-header-premium {
        width: 100%;
        overflow-x: auto;
        display: flex;
        white-space: nowrap;
    }

    .history-card-premium {
        flex-direction: column;
        text-align: center;
    }

    .history-card-meta {
        text-align: center;
        width: 100%;
    }

    /* Impedir que o slider de destaque atropele o painel */
    .profile-premium-wrapper {
        position: relative;
        z-index: 100;
        /* Forçar para frente */
        background: var(--bg-body);
        /* Garantir fundo opaco no mobile se necessário */
    }
}

/* Fix para cliques no fundo */
.profile-premium-wrapper,
.profile-header-glass,
.dashboard-tabs-container {
    position: relative;
    z-index: 10;
}

/* --- MUU PRO PREMIUM FORMS --- */
.madara-user-upload-pro-form {
    background: rgba(255, 255, 255, 0.02);
    border: 1px solid rgba(255, 255, 255, 0.05);
    border-radius: 25px;
    padding: 30px;
    margin-top: 20px;
}

.madara-user-upload-pro-form .form-group {
    margin-bottom: 25px;
}

.madara-user-upload-pro-form label {
    color: #fff;
    font-weight: 700;
    font-size: 14px;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    margin-bottom: 10px;
    display: block;
}

.madara-user-upload-pro-form .form-control {
    background: rgba(255, 255, 255, 0.05);
    border: 1px solid rgba(255, 255, 255, 0.1);
    border-radius: 12px;
    color: #fff;
    padding: 12px 15px;
    transition: 0.3s;
}

.madara-user-upload-pro-form .form-control:focus {
    background: rgba(255, 255, 255, 0.08);
    border-color: var(--primary);
    box-shadow: 0 0 15px rgba(255, 62, 129, 0.2);
    outline: none;
}

.madara-user-upload-pro-form .description {
    font-size: 12px;
    color: rgba(255, 255, 255, 0.4);
    margin-top: 5px;
}

/* Custom File Upload */
.madara-user-upload-pro-form .browser-file {
    display: inline-block;
    padding: 12px 25px;
    background: rgba(255, 255, 255, 0.05);
    border: 2px dashed rgba(255, 255, 255, 0.1);
    border-radius: 15px;
    cursor: pointer;
    transition: 0.3s;
    width: 100%;
    text-align: center;
    color: rgba(255, 255, 255, 0.6);
}

.madara-user-upload-pro-form .browser-file:hover {
    background: rgba(255, 255, 255, 0.1);
    border-color: var(--primary);
    color: #fff;
}

.madara-user-upload-pro-form .browser-file input[type="file"] {
    display: none;
}

/* Checkbox Styling */
.madara-user-upload-pro-form .checkbox-group {
    background: rgba(255, 255, 255, 0.02);
    padding: 20px;
    border-radius: 15px;
    border: 1px solid rgba(255, 255, 255, 0.05);
}

.madara-user-upload-pro-form .checkbox {
    margin-bottom: 10px;
    display: flex;
    align-items: center;
    gap: 10px;
}

.madara-user-upload-pro-form .checkbox input[type="checkbox"] {
    appearance: none;
    width: 18px;
    height: 18px;
    background: rgba(255, 255, 255, 0.1);
    border: 1px solid rgba(255, 255, 255, 0.2);
    border-radius: 4px;
    cursor: pointer;
    position: relative;
    transition: 0.3s;
}

.madara-user-upload-pro-form .checkbox input[type="checkbox"]:checked {
    background: var(--primary);
    border-color: var(--primary);
}

.madara-user-upload-pro-form .checkbox input[type="checkbox"]:checked::after {
    content: '\f00c';
    font-family: 'Font Awesome 6 Free';
    font-weight: 900;
    font-size: 10px;
    color: #fff;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}

.madara-user-upload-pro-form .checkbox label {
    margin-bottom: 0;
    text-transform: none;
    font-weight: 400;
    color: rgba(255, 255, 255, 0.7);
    cursor: pointer;
}

/* Submit Button */
.madara-user-upload-pro-form .submit-row button {
    background: linear-gradient(90deg, var(--primary), #ff1f7a);
    color: #fff;
    border: none;
    padding: 15px 40px;
    border-radius: 15px;
    font-weight: 800;
    font-size: 16px;
    text-transform: uppercase;
    letter-spacing: 1px;
    cursor: pointer;
    transition: 0.4s;
    box-shadow: 0 10px 25px rgba(255, 62, 129, 0.3);
    width: 100%;
}

.madara-user-upload-pro-form .submit-row button:hover {
    transform: translateY(-3px);
    box-shadow: 0 15px 35px rgba(255, 62, 129, 0.5);
    filter: brightness(1.1);
}

/* Select2 Custom Styling */
.select2-container--default .select2-selection--single,
.select2-container--default .select2-selection--multiple {
    background-color: rgba(255, 255, 255, 0.05);
    border: 1px solid rgba(255, 255, 255, 0.1);
    border-radius: 12px;
    color: #fff;
}

.select2-container--default .select2-selection--single .select2-selection__rendered {
    color: #fff;
}

.select2-dropdown {
    background-color: #1a1a1a;
    border: 1px solid rgba(255, 255, 255, 0.1);
    color: #fff;
}

/* --- PAID MEMBER SUBSCRIPTIONS PREMIUM --- */
.pms-premium-wrap {
    background: rgba(255, 255, 255, 0.02);
    padding: 30px;
    border-radius: 20px;
    border: 1px solid rgba(255, 255, 255, 0.05);
}

.pms-premium-wrap table {
    width: 100%;
    border-collapse: separate;
    border-spacing: 0 10px;
}

.pms-premium-wrap th {
    color: var(--primary);
    text-transform: uppercase;
    font-size: 12px;
    padding: 15px;
    text-align: left;
}

.pms-premium-wrap td {
    background: rgba(255, 255, 255, 0.03);
    padding: 15px;
    color: #fff;
}

.pms-premium-wrap td:first-child {
    border-radius: 12px 0 0 12px;
}

.pms-premium-wrap td:last-child {
    border-radius: 0 12px 12px 0;
}

.pms-premium-wrap a {
    color: var(--primary);
    text-decoration: none;
    font-weight: 700;
}

.pms-premium-wrap .pms-subscription-plan-name {
    font-size: 18px;
    font-weight: 800;
}

/* --- MADARA BOOKMARKS (FAVORITOS) PREMIUM --- */
.favorites-premium-wrap {
    margin-top: 20px;
    display: flex;
    flex-direction: column;
    gap: 20px;
}

/* Forçar cores dos links para evitar o roxo de visitado */
.favorites-premium-wrap a {
    color: #fff;
    text-decoration: none;
    transition: 0.3s;
}

.favorites-premium-wrap a:hover {
    color: var(--primary);
}

/* Estilizar imagens (thumbnails) */
.favorites-premium-wrap img {
    width: 100px;
    height: 140px;
    object-fit: cover;
    border-radius: 15px;
    box-shadow: 0 10px 20px rgba(0, 0, 0, 0.5);
    border: 1px solid rgba(255, 255, 255, 0.1);
    margin-bottom: 10px;
    display: block;
}

/* Títulos (Links que NÃO são botões de capítulo) */
.favorites-premium-wrap a:not(.btn-link) {
    font-size: 18px;
    font-weight: 800;
    display: block;
    margin-bottom: 5px;
    color: #fff;
}

/* Links de Capítulos (.btn-link) */
.favorites-premium-wrap a.btn-link {
    display: inline-block;
    background: rgba(255, 62, 129, 0.1);
    color: var(--primary);
    padding: 5px 12px;
    border-radius: 8px;
    font-size: 13px;
    font-weight: 700;
    margin-right: 10px;
    margin-bottom: 10px;
    border: 1px solid rgba(255, 62, 129, 0.2);
}

.favorites-premium-wrap a.btn-link:hover {
    background: var(--primary);
    color: #fff;
    box-shadow: 0 0 15px rgba(255, 62, 129, 0.4);
}

/* Tentativa de separar visualmente os blocos (já que não há um container por item) */
/* Como cada item começa com um link contendo uma imagem, vamos dar um espaçamento antes deles */
.favorites-premium-wrap a:has(img) {
    padding-top: 20px;
    border-top: 1px solid rgba(255, 255, 255, 0.05);
    display: block;
}

.favorites-premium-wrap a:has(img):first-child {
    border-top: none;
    padding-top: 0;
}

/* Estilo para o texto "X dias ago" que fica solto */
.favorites-premium-wrap {
    color: rgba(255, 255, 255, 0.4);
    font-size: 13px;
}







.btn-premium-upload {
    background: linear-gradient(90deg, #ff3e81, #ff1f7a);
    color: #fff;
    border: none;
    padding: 18px 40px;
    border-radius: 15px;
    font-weight: 900;
    font-size: 18px;
    text-transform: uppercase;
    letter-spacing: 1.5px;
    cursor: pointer;
    transition: 0.4s;
    width: 100%;
    margin-top: 30px;
    box-shadow: 0 10px 30px rgba(255, 62, 129, 0.4);
}

.btn-premium-upload:hover {
    transform: translateY(-4px);
    box-shadow: 0 15px 40px rgba(255, 62, 129, 0.6);
}

/* --- MODERN UPLOAD FORM SECTION --- */
.modern-upload-container {
    background: rgba(255, 255, 255, 0.03);
    border: 1px solid rgba(255, 255, 255, 0.05);
    border-radius: 24px;
    padding: 40px;
    margin-top: 20px;
}

.upload-form-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 30px;
    margin-bottom: 40px;
}

.upload-dropzone-section {
    margin-bottom: 40px;
}

.dropzone-area {
    background: rgba(0, 0, 0, 0.2);
    border: 2px dashed rgba(255, 255, 255, 0.1);
    border-radius: 20px;
    padding: 30px;
    transition: 0.3s;
}

.dropzone-area:hover {
    border-color: var(--primary);
    background: rgba(124, 58, 237, 0.05);
}

.images-preview-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(120px, 1fr));
    gap: 15px;
    list-style: none;
    padding: 0;
    margin: 0;
}

.dropzone-box {
    aspect-ratio: 1;
    background: rgba(255, 255, 255, 0.03);
    border-radius: 15px;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    position: relative;
    overflow: hidden;
    border: 1px solid rgba(255, 255, 255, 0.05);
    transition: 0.3s;
}

.dropzone-box:hover {
    background: rgba(255, 255, 255, 0.08);
    border-color: var(--primary);
}

.dropzone-inner {
    text-align: center;
    color: rgba(255, 255, 255, 0.4);
}

.dropzone-inner i {
    font-size: 32px;
    margin-bottom: 10px;
    display: block;
}

.dropzone-inner span {
    font-size: 11px;
    font-weight: 700;
    text-transform: uppercase;
}

.dropzone-inner input[type="file"] {
    position: absolute;
    inset: 0;
    opacity: 0;
    cursor: pointer;
}

.chapter-single-image {
    position: relative;
    border-radius: 15px;
    overflow: hidden;
    aspect-ratio: 1;
    border: 1px solid rgba(255, 255, 255, 0.1);
}

.chapter-single-image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

/* --- MUU PRO LOADING SCREEN (PREMIUM) --- */
#muu-loading-screen {
    position: fixed;
    inset: 0;
    background: rgba(0, 0, 0, 0.7);
    backdrop-filter: blur(15px);
    z-index: 999999;
    display: flex;
    align-items: center;
    justify-content: center;
}

.loading-screen-content {
    background: rgba(255, 255, 255, 0.03);
    padding: 50px;
    border-radius: 30px;
    border: 1px solid rgba(255, 255, 255, 0.1);
    box-shadow: 0 25px 50px rgba(0, 0, 0, 0.5);
    text-align: center;
}

/* Circular Progress Chart */
.circular-chart {
    display: block;
    margin: 10px auto;
    max-width: 120px;
    max-height: 120px;
}

.circle-bg {
    fill: none;
    stroke: rgba(255, 255, 255, 0.05);
    stroke-width: 2.8;
}

.circle {
    fill: none;
    stroke-width: 2.8;
    stroke-linecap: round;
    transition: stroke-dasharray 0.3s ease;
    stroke: var(--primary);
    filter: drop-shadow(0 0 8px var(--primary));
}

.percentage {
    fill: #fff;
    font-family: 'Oswald', sans-serif;
    font-size: 0.5em;
    text-anchor: middle;
    font-weight: 700;
}

/* --- SELECT2 MODERN INTEGRATION --- */
.select2-container--default .select2-selection--single,
.select2-container--default .select2-selection--multiple {
    background: rgba(255, 255, 255, 0.05) !important;
    border: 1px solid rgba(255, 255, 255, 0.1) !important;
    border-radius: 12px !important;
    height: 45px !important;
    display: flex !important;
    align-items: center !important;
    color: #fff !important;
    transition: 0.3s !important;
}

.select2-container--default .select2-selection--single .select2-selection__rendered {
    color: #fff !important;
    padding-left: 15px !important;
    font-size: 14px !important;
    font-weight: 600 !important;
}

.select2-container--default .select2-selection--single .select2-selection__arrow {
    height: 43px !important;
    right: 10px !important;
}

.select2-container--default .select2-selection--single .select2-selection__arrow b {
    border-color: #888 transparent transparent transparent !important;
}

.select2-container--default.select2-container--open .select2-selection--single {
    border-color: var(--primary) !important;
    box-shadow: 0 0 15px rgba(var(--primary-rgb), 0.3) !important;
    background: rgba(255, 255, 255, 0.08) !important;
}

.select2-dropdown {
    background: #121214 !important;
    border: 1px solid var(--primary) !important;
    border-radius: 12px !important;
    box-shadow: 0 15px 30px rgba(0, 0, 0, 0.5) !important;
    overflow: hidden !important;
    margin-top: 5px !important;
    z-index: 100002 !important;
}

.select2-results__option {
    padding: 10px 15px !important;
    font-size: 13px !important;
    color: rgba(255, 255, 255, 0.7) !important;
    transition: 0.2s !important;
}

.select2-results__option--highlighted[aria-selected],
.select2-results__option[aria-selected="true"] {
    background: var(--primary) !important;
    color: #fff !important;
}

.select2-search--dropdown {
    padding: 10px !important;
}

.select2-search--dropdown .select2-search__field {
    background: rgba(255, 255, 255, 0.03) !important;
    border: 1px solid rgba(255, 255, 255, 0.1) !important;
    border-radius: 8px !important;
    color: #fff !important;
    padding: 8px !important;
}

/* --- PREMIUM CHECKBOX/VOLUME TOGGLE --- */
.checkbox-premium {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    cursor: pointer;
    user-select: none;
    margin-left: 15px;
}

.checkbox-premium input {
    display: none;
}

.checkbox-box {
    width: 20px;
    height: 20px;
    background: rgba(255, 255, 255, 0.05);
    border: 1px solid rgba(255, 255, 255, 0.1);
    border-radius: 6px;
    position: relative;
    transition: 0.3s;
}

.checkbox-premium:hover .checkbox-box {
    border-color: var(--primary);
}

.checkbox-premium input:checked+.checkbox-box {
    background: var(--primary);
    border-color: var(--primary);
    box-shadow: 0 0 10px rgba(var(--primary-rgb), 0.5);
}

.checkbox-premium input:checked+.checkbox-box::after {
    content: '\f00c';
    font-family: 'Font Awesome 6 Free';
    font-weight: 900;
    font-size: 10px;
    color: #fff;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}

.volume-selector-wrap {
    display: flex;
    align-items: center;
    gap: 15px;
}

.volume-selector-wrap .select2-container {
    flex-grow: 1;
}

.chapter-single-image .remove-image {
    position: absolute;
    top: 8px;
    right: 8px;
    background: rgba(0, 0, 0, 0.5);
    color: #ff4d4d;
    width: 24px;
    height: 24px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    cursor: pointer;
    z-index: 10;
    transition: 0.3s;
}

.chapter-single-image .remove-image:hover {
    background: #ff4d4d;
    color: #fff;
    transform: scale(1.1);
}


/* --- CHAPTER THUMBNAILS PREMIUM --- */
.listing-chapters_wrap ul.main li.has-chapter-thumb {
    padding: 15px;
    background: rgba(255, 255, 255, 0.02);
    border: 1px solid rgba(255, 255, 255, 0.05);
    border-radius: 15px;
    margin-bottom: 12px;
    transition: var(--transition);
    display: flex;
    align-items: center;
    gap: 20px;
    min-height: 100px;
}

.listing-chapters_wrap ul.main li.has-chapter-thumb:hover {
    background: rgba(255, 255, 255, 0.05);
    border-color: var(--primary);
    transform: translateX(10px);
    box-shadow: 0 0 20px rgba(157, 29, 242, 0.1);
}

.chapter-thumbnail-wrap {
    flex-shrink: 0;
    width: 120px;
    height: 75px;
    border-radius: 10px;
    overflow: hidden;
    border: 1px solid rgba(255, 255, 255, 0.1);
    background: #000;
}

.chapter-thumbnail-wrap img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: 0.5s;
}

.listing-chapters_wrap ul.main li.has-chapter-thumb:hover .chapter-thumbnail-wrap img {
    transform: scale(1.2);
}

.listing-chapters_wrap ul.main li.has-chapter-thumb .wp-manga-chapter {
    margin: 0;
    display: flex;
    flex-direction: column;
    justify-content: center;
    flex: 1;
}

.listing-chapters_wrap ul.main li.has-chapter-thumb .chapter-release-date {
    position: static;
    margin-top: 5px;
    font-size: 11px;
    opacity: 0.6;
}

/* --- MODERN FILE INPUT STYLING --- */
.modern-input[type="file"] {
    background: rgba(255, 255, 255, 0.05);
    border: 1px solid rgba(255, 255, 255, 0.1);
    border-radius: 12px;
    color: rgba(255, 255, 255, 0.6);
    padding: 8px 12px;
    cursor: pointer;
    font-size: 13px;
    width: 100%;
    margin-top: 5px;
}

.modern-input[type="file"]::-webkit-file-upload-button {
    background: var(--primary);
    border: none;
    border-radius: 8px;
    color: #fff;
    padding: 8px 16px;
    margin-right: 15px;
    cursor: pointer;
    font-weight: 800;
    text-transform: uppercase;
    font-size: 10px;
    letter-spacing: 0.5px;
    transition: 0.3s;
}

/* --- DASHBOARD TABS STYLING --- */
.dashboard-tab-content,
.mini-dashboard-tab-content {
    display: none;
}

.dashboard-tab-content.active,
.mini-dashboard-tab-content.active {
    display: block;
    animation: dashboardFadeIn 0.5s cubic-bezier(0.4, 0, 0.2, 1);
}

@keyframes dashboardFadeIn {
    from {
        opacity: 0;
        transform: translateY(20px);
    }

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

.tabs-header-premium,
.upload-tabs-mini {
    display: flex;
    gap: 15px;
    margin-bottom: 30px;
    border-bottom: 1px solid rgba(255, 255, 255, 0.05);
    padding-bottom: 15px;
}

.tab-btn-premium {
    background: transparent;
    border: 1px solid rgba(255, 255, 255, 0.1);
    color: rgba(255, 255, 255, 0.6);
    padding: 12px 24px;
    border-radius: 12px;
    font-weight: 700;
    cursor: pointer;
    transition: 0.3s;
    display: flex;
    align-items: center;
    gap: 10px;
}

.tab-btn-premium i {
    font-size: 14px;
}

.tab-btn-premium:hover {
    background: rgba(255, 255, 255, 0.05);
    color: #fff;
    border-color: rgba(255, 255, 255, 0.2);
}

/* --- ADVANCED SEARCH PREMIUM --- */
#search-advanced {
    margin-top: 20px;
}

.search-advanced-form {
    background: rgba(15, 15, 20, 0.8);
    backdrop-filter: blur(20px);
    border: 1px solid rgba(255, 255, 255, 0.08);
    box-shadow: 0 20px 50px rgba(0, 0, 0, 0.5);
    padding: 30px;
    border-radius: 20px;
    text-align: left;
}

.search-advanced-form .label {
    display: block;
    color: var(--primary);
    font-weight: 800;
    text-transform: uppercase;
    font-size: 11px;
    margin-bottom: 15px;
    letter-spacing: 1px;
}

.search-advanced-form .form-group {
    margin-bottom: 25px;
}

.search-advanced-form .checkbox-group {
    background: rgba(0, 0, 0, 0.2);
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(150px, 1fr));
    gap: 10px;
    max-height: 300px;
    overflow-y: auto;
    padding: 20px;
    border-radius: 15px;
    border: 1px solid rgba(255, 255, 255, 0.05);
    scrollbar-width: thin;
    scrollbar-color: var(--primary) rgba(255, 255, 255, 0.05);
}

.search-advanced-form .checkbox-group::-webkit-scrollbar {
    width: 6px;
}

.search-advanced-form .checkbox-group::-webkit-scrollbar-thumb {
    background: var(--primary);
    border-radius: 10px;
}

/* Custom Checkbox Styling */
.search-advanced-form .checkbox {
    position: relative;
    padding-left: 30px;
    margin-bottom: 8px;
    display: flex;
    align-items: center;
}

.search-advanced-form .checkbox input[type="checkbox"] {
    position: absolute;
    opacity: 0;
    cursor: pointer;
    height: 0;
    width: 0;
}

.search-advanced-form .checkbox label {
    position: relative;
    cursor: pointer;
    font-size: 13px;
    color: rgba(255, 255, 255, 0.5);
    padding-left: 5px;
    transition: 0.3s;
}

.search-advanced-form .checkbox label:before {
    content: '';
    position: absolute;
    left: -25px;
    top: 50%;
    transform: translateY(-50%);
    width: 18px;
    height: 18px;
    background: rgba(255, 255, 255, 0.05);
    border: 1px solid rgba(255, 255, 255, 0.1);
    border-radius: 4px;
    transition: 0.3s;
}

.search-advanced-form .checkbox input:checked+label:before {
    background: var(--primary);
    border-color: var(--primary);
    box-shadow: 0 0 10px rgba(255, 62, 129, 0.4);
}

.search-advanced-form .checkbox input:checked+label:after {
    content: '\f00c';
    font-family: 'Font Awesome 6 Free';
    font-weight: 900;
    position: absolute;
    left: -21px;
    top: 50%;
    transform: translateY(-50%);
    font-size: 10px;
    color: #fff;
}

.search-advanced-form .checkbox input:checked+label {
    color: #fff;
    font-weight: 700;
}

.search-advanced-form .form-control {
    background: rgba(255, 255, 255, 0.05);
    border: 1px solid rgba(255, 255, 255, 0.1);
    border-radius: 10px;
    color: #fff;
    padding: 12px;
}

.search-adv-submit {
    background: var(--primary);
    color: #fff;
    border: none;
    padding: 12px 30px;
    border-radius: 10px;
    font-weight: 800;
    text-transform: uppercase;
    cursor: pointer;
    transition: 0.3s;
}

.search-adv-reset {
    background: rgba(255, 255, 255, 0.1);
    color: #fff;
    border: none;
    padding: 12px 30px;
    border-radius: 10px;
    font-weight: 800;
    text-transform: uppercase;
    cursor: pointer;
    margin-left: 10px;
}

/* --- SEARCH LIST ITEMS MODERNIZATION --- */
.c-tabs-item__content {
    background: rgba(255, 255, 255, 0.03);
    backdrop-filter: blur(10px);
    margin-bottom: 25px;
    border-radius: 24px;
    padding: 25px;
    border: 1px solid rgba(255, 255, 255, 0.05);
    transition: all 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275);
    display: flex;
    align-items: flex-start;
    gap: 30px;
}

.c-tabs-item__content:hover {
    background: rgba(255, 255, 255, 0.06);
    border-color: var(--primary);
    transform: translateY(-8px) scale(1.01);
    box-shadow: 0 20px 40px rgba(0, 0, 0, 0.4), 0 0 20px rgba(255, 62, 129, 0.1);
}

/* Ajuste de colunas do Bootstrap para flex */
.c-tabs-item__content .col-4.col-md-2,
.c-tabs-item__content .col-8.col-md-10 {
    width: auto;
    flex: initial;
    padding: 0;
    max-width: none;
}

.tab-thumb {
    width: 160px;
    flex-shrink: 0;
}

.tab-thumb img {
    width: 100%;
    height: auto;
    border-radius: 16px;
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.5);
    transition: 0.3s;
}

.c-tabs-item__content:hover .tab-thumb img {
    transform: scale(1.05);
    box-shadow: 0 15px 35px rgba(255, 62, 129, 0.2);
}

.tab-summary {
    flex-grow: 1;
}

.tab-summary .post-title h3 {
    font-size: 24px;
    font-weight: 900;
    margin: 0 0 15px 0;
    line-height: 1.2;
    letter-spacing: -0.5px;
}

.tab-summary .post-title a {
    color: #fff;
    text-decoration: none;
    transition: 0.3s;
}

.tab-summary .post-title a:hover {
    color: var(--primary);
}

.post-content {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.post-content_item {
    display: flex;
    align-items: baseline;
    gap: 15px;
    margin: 0;
}

.post-content_item .summary-heading {
    min-width: 100px;
}

.post-content_item .summary-heading h5 {
    color: var(--primary);
    font-weight: 800;
    font-size: 10px;
    text-transform: uppercase;
    margin: 0;
    letter-spacing: 1px;
    opacity: 0.8;
}

.post-content_item .summary-content {
    color: rgba(255, 255, 255, 0.7);
    font-size: 13px;
    line-height: 1.5;
}

.post-content_item .summary-content a {
    color: #fff;
    background: rgba(255, 255, 255, 0.05);
    padding: 4px 12px;
    border-radius: 100px;
    margin-right: 5px;
    display: inline-block;
    margin-bottom: 5px;
    font-size: 11px;
    font-weight: 600;
    border: 1px solid rgba(255, 255, 255, 0.05);
    transition: 0.3s;
}

.post-content_item .summary-content a:hover {
    background: var(--primary);
    color: #fff;
    border-color: var(--primary);
    transform: translateY(-2px);
}

/* Status especial */
.mg_status .summary-content {
    color: #00ff88;
    font-weight: 800;
    text-transform: uppercase;
    font-size: 11px;
    letter-spacing: 1px;
}

/* Mobile Adjustments */
@media (max-width: 768px) {
    .c-tabs-item__content {
        flex-direction: column;
        align-items: center;
        text-align: center;
        gap: 20px;
    }

    .post-content_item {
        flex-direction: column;
        align-items: center;
        gap: 5px;
    }

    .post-content_item .summary-heading {
        min-width: auto;
    }

    .tab-thumb {
        width: 140px;
    }
}

/* --- SEARCH PAGE MODERNIZATION --- */
.search-premium-header {
    padding: 80px 0 40px;
    background: linear-gradient(180deg, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.5) 100%);
}

.search-header-inner {
    padding: 60px;
    text-align: center;
    border-radius: 30px;
}

.search-title {
    font-size: 32px;
    font-weight: 900;
    margin-bottom: 30px;
    color: #fff;
    text-transform: uppercase;
    letter-spacing: -1px;
}

.search-title span {
    color: var(--primary);
    text-shadow: 0 0 20px rgba(255, 62, 129, 0.4);
}

.search-premium-form {
    max-width: 600px;
    margin: 0 auto 30px;
}

.search-input-wrap {
    position: relative;
    display: flex;
    align-items: center;
}

.search-premium-form .search-field {
    width: 100%;
    background: rgba(255, 255, 255, 0.05);
    border: 1px solid rgba(255, 255, 255, 0.1);
    padding: 18px 70px 18px 30px;
    border-radius: 100px;
    color: #fff;
    font-size: 16px;
    transition: 0.3s;
}

.search-premium-form .search-field:focus {
    background: rgba(255, 255, 255, 0.1);
    border-color: var(--primary);
    box-shadow: 0 0 30px rgba(255, 62, 129, 0.2);
    outline: none;
}

.search-premium-form .search-submit {
    position: absolute;
    right: 8px;
    width: 50px;
    height: 50px;
    border-radius: 50%;
    background: var(--primary);
    border: none;
    color: #fff;
    cursor: pointer;
    transition: 0.3s;
    top: 50%;
    transform: translateY(-50%);
}

.search-premium-form .search-submit:hover {
    transform: translateY(-50%) scale(1.1);
    box-shadow: 0 0 20px var(--primary);
}

.results-count-badge {
    display: inline-block;
    background: rgba(255, 255, 255, 0.1);
    padding: 8px 20px;
    border-radius: 100px;
    font-size: 13px;
    font-weight: 700;
    color: rgba(255, 255, 255, 0.6);
    border: 1px solid rgba(255, 255, 255, 0.05);
}

/* No Results State */
.no-results-premium {
    padding: 80px 40px;
    text-align: center;
    max-width: 600px;
    margin: 40px auto;
    border-radius: 30px;
}

.no-results-icon {
    font-size: 80px;
    color: var(--primary);
    margin-bottom: 20px;
    opacity: 0.3;
}

.no-results-premium h3 {
    font-size: 24px;
    font-weight: 800;
    color: #fff;
    margin-bottom: 15px;
}

.no-results-premium p {
    color: rgba(255, 255, 255, 0.5);
    margin-bottom: 30px;
}

/* --- MODERN READER (LITTLE TYRANT) --- */
.reading-content-wrap {
    background-color: var(--bg-app);
}

.reading-content {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    width: 100%;
    margin: 0 auto;
    text-align: center;
}

.reading-content img {
    display: block;
    margin-left: auto;
    margin-right: auto;
    max-width: 100%;
    height: auto;
}

/* Cabeçalho Sticky com Glassmorphism */
#chapter-header-sticky {
    position: sticky;
    top: 0;
    z-index: 3000;
    background: rgba(10, 10, 12, 0.85);
    /* Fundo escuro com transparência */
    backdrop-filter: blur(12px);
    border-bottom: 1px solid var(--border-color);
    transition: transform 0.3s ease, background 0.3s ease;
    margin-bottom: 30px;
}

#chapter-header-sticky.is-sticky {
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.3);
}

#chapter-heading {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 15px 25px;
    margin: 0;
    font-size: 18px;
    font-weight: 700;
    color: white;
}

#chapter-heading a {
    color: var(--text-muted);
    transition: 0.2s;
}

#chapter-heading a:hover {
    color: var(--primary);
}

#chapter-heading .chap-name {
    flex: 1;
    text-align: center;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    margin: 0 20px;
}

/* Barra de Progresso */
#reading-progress-container {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 4px;
    z-index: 3001;
    background: transparent;
}

#reading-progress-bar {
    height: 100%;
    width: 0%;
    background: linear-gradient(to right, var(--primary), var(--accent-new));
    box-shadow: 0 0 10px rgba(157, 29, 242, 0.5);
    transition: width 0.1s ease;
}

/* Banner do Discord (Auto-hide) */
#banner-discord-reader {
    transition: opacity 0.4s ease, transform 0.4s ease;
    transition: all 0.5s cubic-bezier(0.4, 0, 0.2, 1);
    margin: 20px 0 40px 0;
}

#banner-discord-reader.hidden {
    opacity: 0;
    transform: translateY(-50px);
    height: 0;
    margin: 0;
    pointer-events: none;
    overflow: hidden;
}

/* Navegação Flutuante */
.floating-nav-btn {
    position: fixed;
    top: 50%;
    transform: translateY(-50%);
    width: 50px;
    height: 50px;
    background: rgba(20, 20, 20, 0.4);
    backdrop-filter: blur(5px);
    border: 1px solid rgba(255, 255, 255, 0.1);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    color: white;
    font-size: 20px;
    transition: 0.3s;
    z-index: 9999;
    text-decoration: none;
    opacity: 0.5;
}

.floating-nav-btn:hover {
    opacity: 1;
    background: var(--primary);
    transform: translateY(-50%) scale(1.2);
    box-shadow: 0 0 20px var(--primary);
}

.floating-nav-btn.prev {
    left: 30px;
}

.floating-nav-btn.next {
    right: 30px;
}

/* Utilidades */
.hidden {
    display: none;
}

/* Mobile */
@media (max-width: 768px) {
    .floating-nav-btn {
        display: none;
    }

    .admin-bar #chapter-header-sticky,
    .admin-bar #reading-progress-container {
        top: 46px;
    }

    #chapter-heading {
        font-size: 14px;
        padding: 10px;
    }

    #chapter-heading .chap-name {
        margin: 0 5px;
        font-size: 12px;
    }
}

/* --- NAVEGAÇÃO DO LEITOR PREMIUM (WP-MANGA-NAV) --- */
.wp-manga-nav {
    background: rgba(20, 20, 22, 0.95) !important;
    border: 1px solid rgba(255, 255, 255, 0.05);
    border-radius: 24px;
    padding: 30px;
    margin: 40px 0;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 25px;
    box-shadow: 0 20px 40px rgba(0, 0, 0, 0.4);
}

.wp-manga-nav .select-view {
    display: flex;
    gap: 20px;
    width: 100%;
    justify-content: center;
    flex-wrap: wrap;
}

/* Custom Selects */
.c-selectpicker label {
    margin: 0;
    width: 100%;
}

.wp-manga-nav select.selectpicker {
    appearance: none;
    background: rgba(255, 255, 255, 0.05);
    border: 1px solid rgba(255, 255, 255, 0.1);
    color: #fff;
    padding: 12px 40px 12px 20px;
    border-radius: 12px;
    font-size: 14px;
    font-weight: 600;
    cursor: pointer;
    transition: 0.3s;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' fill='white' viewBox='0 0 16 16'%3E%3Cpath d='M7.247 11.14 2.451 5.658C1.885 5.013 2.345 4 3.204 4h9.592a1 1 0 0 1 .753 1.659l-4.796 5.48a1 1 0 0 1-1.506 0z'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: right 15px center;
}

.wp-manga-nav select.selectpicker:hover {
    background-color: rgba(255, 255, 255, 0.1);
    border-color: var(--primary);
    box-shadow: 0 0 15px rgba(255, 62, 129, 0.2);
}

/* Forçar cores nas opções do Select (Dropdown) */
.wp-manga-nav select.selectpicker option {
    background: #1a1a1c !important;
    color: #fff !important;
    padding: 10px;
}

/* Estilo para Dropdowns Customizados (Bootstrap Select) */
.wp-manga-nav .dropdown-menu {
    background: #1a1a1c !important;
    border: 1px solid rgba(255, 255, 255, 0.1) !important;
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.5) !important;
    border-radius: 12px !important;
    padding: 10px !important;
}

.wp-manga-nav .dropdown-menu .dropdown-item {
    color: #fff !important;
    padding: 8px 15px !important;
    border-radius: 8px !important;
    transition: 0.2s !important;
}

.wp-manga-nav .dropdown-menu .dropdown-item:hover,
.wp-manga-nav .dropdown-menu .dropdown-item.active,
.wp-manga-nav .dropdown-menu .dropdown-item.selected {
    background: var(--primary) !important;
    color: #fff !important;
    box-shadow: 0 0 15px rgba(255, 62, 129, 0.3);
}

.wp-manga-nav .dropdown-menu .inner {
    background: transparent !important;
}

/* Ícones de Ação (Bookmark/Contraste) */
.action_list_icon {
    display: flex;
    gap: 15px;
    padding: 0;
    margin: 0;
    list-style: none;
}

.action_list_icon a {
    width: 45px;
    height: 45px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: rgba(255, 255, 255, 0.05);
    border: 1px solid rgba(255, 255, 255, 0.1);
    border-radius: 50%;
    color: #fff;
    font-size: 18px;
    transition: 0.3s;
}

.action_list_icon a:hover {
    background: var(--primary);
    border-color: var(--primary);
    color: #fff;
    transform: translateY(-3px);
    box-shadow: 0 5px 15px rgba(255, 62, 129, 0.4);
}

/* Paginação e Botões Nav */
.select-pagination {
    width: 100%;
}

.nav-links {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 15px;
}

.nav-links .btn {
    background: var(--primary);
    color: #fff !important;
    padding: 12px 30px;
    border-radius: 12px;
    font-weight: 800;
    text-transform: uppercase;
    font-size: 13px;
    letter-spacing: 1px;
    transition: 0.3s;
    border: none;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

.nav-links .btn:hover {
    filter: brightness(1.2);
    transform: translateY(-2px);
    box-shadow: 0 8px 25px rgba(255, 62, 129, 0.4);
}

.nav-links .btn.back {
    background: rgba(255, 255, 255, 0.1);
    border: 1px solid rgba(255, 255, 255, 0.1);
}

.nav-links .btn.back:hover {
    background: rgba(255, 255, 255, 0.2);
    box-shadow: 0 8px 25px rgba(0, 0, 0, 0.3);
}

@media (max-width: 600px) {
    .wp-manga-nav {
        padding: 20px;
        margin: 20px 0;
    }

    .wp-manga-nav .select-view {
        flex-direction: column;
        gap: 10px;
    }

    .wp-manga-nav select.selectpicker {
        width: 100%;
    }
}

/* Área de Comentários */

/* Área de Comentários */
.manga-discussion {
    background: var(--container-bg);
    margin-top: 40px;
    padding: 30px;
    border-radius: 8px;
    border-top: 4px solid var(--accent-color);
}

textarea#comment {
    width: 100%;
    background: #252525;
    border: 1px solid #444;
    color: white;
    padding: 15px;
    border-radius: 5px;
    margin-top: 10px;
    box-sizing: border-box;
}

input[type="submit"] {
    background: var(--accent-color);
    border: none;
    color: white;
    padding: 12px 30px;
    border-radius: 4px;
    cursor: pointer;
    margin-top: 10px;
    font-weight: bold;
}

/* Utilidades e Esconder Elementos Desnecessários */
.hidden {
    display: none;
}

.list-inline {
    display: flex;
    list-style: none;
    gap: 15px;
    padding: 0;
}

/* Responsividade para Celular */
@media (max-width: 600px) {
    #chapter-heading {
        font-size: 1rem;
    }

    .btn {
        padding: 8px 15px;
        font-size: 0.8rem;
    }

    .read-container {
        margin: auto;
    }
}


/* --- MODERN SETTINGS PANEL (FLUTUANTE) --- */
.comic-settings-panel {
    display: none;
    /* Ativado via JS */
    position: fixed;
    top: 80px;
    right: 20px;
    width: 300px;
    background: rgba(20, 20, 22, 0.9);
    backdrop-filter: blur(15px);
    -webkit-backdrop-filter: blur(15px);
    border: 1px solid rgba(255, 255, 255, 0.1);
    border-radius: 20px;
    padding: 20px;
    z-index: 100001;
    box-shadow: 0 15px 35px rgba(0, 0, 0, 0.5);
    animation: fadeInSlide 0.3s ease-out;
}

@keyframes fadeInSlide {
    from {
        opacity: 0;
        transform: translateY(-10px);
    }

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

.setting-row {
    margin-bottom: 20px;
}

.setting-row label {
    display: block;
    color: #fff;
    font-size: 13px;
    font-weight: 700;
    margin-bottom: 10px;
    text-transform: uppercase;
    letter-spacing: 1px;
}

/* Estilo para Sliders (Brilho e Largura) */
.comic-settings-panel input[type="range"] {
    width: 100%;
    accent-color: var(--primary);
    cursor: pointer;
}

/* Opções de Cor de Fundo */
.options {
    display: flex;
    gap: 10px;
}

.bg-color-btn {
    width: 35px;
    height: 35px;
    border-radius: 50%;
    border: 2px solid rgba(255, 255, 255, 0.1);
    cursor: pointer;
    transition: 0.2s;
}

.bg-color-btn:hover {
    transform: scale(1.1);
    border-color: var(--primary);
}

/* Botão Reset no Painel */
#reset-width-btn {
    background: rgba(255, 255, 255, 0.1);
    border: none;
    color: #fff;
    padding: 5px 12px;
    border-radius: 5px;
    font-size: 11px;
    margin-top: 10px;
    cursor: pointer;
}

/* --- REFINAMENTO DO MINI CABEÇALHO (#chapter-heading) --- */
#chapter-heading {
    background: transparent;
    border: none !important;
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 10px 0;
}

.heading-left,
.heading-right {
    display: flex;
    align-items: center;
    gap: 15px;
}

.quality-selector {
    display: flex;
    background: rgba(255, 255, 255, 0.05);
    padding: 3px;
    border-radius: 100px;
    border: 1px solid rgba(255, 255, 255, 0.1);
}

.quality-toggle-btn,
.quality-vip-lock {
    padding: 5px 15px;
    font-size: 11px;
    font-weight: 800;
    text-transform: uppercase;
    border-radius: 100px;
    transition: 0.3s;
    text-decoration: none;
}

.quality-toggle-btn.active {
    background: var(--primary);
    color: #fff;
    box-shadow: 0 0 15px rgba(255, 62, 129, 0.4);
}

.quality-vip-lock {
    color: #ffce2e;
}

/* Icones de Ação (Engrenagem, Home, Lista) */
#btn-custom-settings,
#view-chapters,
.heading-left .back,
.heading-right .home {
    width: 40px;
    height: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: rgba(255, 255, 255, 0.05);
    border-radius: 50%;
    color: #fff;
    transition: 0.3s;
    cursor: pointer;
}

#btn-custom-settings:hover,
#view-chapters:hover,
.heading-left .back:hover,
.heading-right .home:hover {
    background: var(--primary);
    color: #fff;
    transform: scale(1.1);
}

/* --- TOOLBAR MOBILE FIXED BOTTOM --- */
#mobile-reader-toolbar {
    display: none;
    /* Visível apenas em mobile */
    position: fixed;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 70px;
    background: rgba(15, 15, 18, 0.95);
    backdrop-filter: blur(15px);
    border-top: 1px solid rgba(255, 255, 255, 0.1);
    z-index: 100000;
    padding-bottom: env(safe-area-inset-bottom);
}

@media (max-width: 768px) {
    #mobile-reader-toolbar {
        display: flex;
        justify-content: space-around;
        align-items: center;
    }

    .toolbar-btn {
        display: flex;
        flex-direction: column;
        align-items: center;
        color: #888;
        text-decoration: none;
        font-size: 10px;
        gap: 5px;
    }

    .toolbar-btn i {
        font-size: 20px;
    }

    .toolbar-btn:hover,
    .toolbar-btn.active {
        color: var(--primary);
    }
}

.reader-banner-top {
    text-align: center;
}

/* --- CHAPTER CARD LINK (FULL CLICKABLE) --- */
.wp-manga-chapter {
    padding: 0 !important;
    overflow: hidden;
    margin-bottom: 10px !important;
    border-radius: 12px;
    background: rgba(255, 255, 255, 0.03);
    border: 1px solid rgba(255, 255, 255, 0.05);
    transition: 0.3s;
}

.wp-manga-chapter:hover {
    background: rgba(255, 255, 255, 0.07);
    border-color: var(--primary);
    transform: translateX(5px);
    box-shadow: 0 0 20px rgba(255, 62, 129, 0.2);
}

.chapter-card-link {
    display: block !important;
    padding: 15px 20px !important;
    text-decoration: none !important;
    width: 100%;
    position: relative;
    z-index: 10;
    cursor: pointer !important;
}

.chapter-info-container {
    display: flex;
    justify-content: space-between;
    align-items: center;
    pointer-events: none;
    /* Deixa o clique passar para o <a> pai */
}

.chapter-name {
    color: #fff !important;
    font-weight: 700;
    font-size: 15px;
    flex-grow: 1;
}

.chapter-release-date {
    font-size: 11px;
    color: #888;
    font-style: italic;
    white-space: nowrap;
    margin-left: 15px;
}

.wp-manga-chapter.reading {
    border-left: 4px solid var(--primary);
    background: rgba(255, 62, 129, 0.1);
}

.wp-manga-chapter.unread .chapter-name::after {
    content: 'NEW';
    font-size: 9px;
    background: var(--primary);
    color: #fff;
    padding: 2px 6px;
    border-radius: 4px;
    margin-left: 10px;
    vertical-align: middle;
}

/* --- CHAPTER LOAD MORE (GAMER PREMIUM) --- */
.tp-chapter-load-wrap,
.c-chapter-readmore {
    display: flex;
    justify-content: center;
    align-items: center;
    margin: 40px 0 20px;
}

#btn-load-more-chapters {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    padding: 12px 30px;
    background: var(--primary);
    border: none;
    color: #fff;
    border-radius: 12px;
    font-weight: 800;
    text-transform: uppercase;
    font-size: 13px;
    letter-spacing: 1px;
    cursor: pointer;
    transition: 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    box-shadow: 0 0 20px rgba(255, 62, 129, 0.3);
}

#btn-load-more-chapters:hover {
    transform: translateY(-3px) scale(1.02);
    box-shadow: 0 0 30px rgba(255, 62, 129, 0.6);
    filter: brightness(1.1);
}

.load-more-loader {
    color: var(--primary);
    font-size: 24px;
}

.chapter-pagination .prev,
.chapter-pagination .next {
    font-size: 12px;
}

/* --- BOTÃO DE FAVORITOS (GAMER PREMIUM) --- */
.manga-action-premium {
    display: inline-block;
    margin-left: 10px;
    vertical-align: middle;
}

.manga-action-premium .add-bookmark a {
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    width: 45px;
    height: 45px;
    background: rgba(255, 62, 129, 0.1) !important;
    border: 1px solid rgba(255, 62, 129, 0.3) !important;
    border-radius: 12px !important;
    color: var(--primary) !important;
    font-size: 20px !important;
    transition: 0.3s cubic-bezier(0.4, 0, 0.2, 1) !important;
    backdrop-filter: blur(5px);
    cursor: pointer;
    text-decoration: none !important;
}

.manga-action-premium .add-bookmark a:hover {
    background: var(--primary) !important;
    color: #fff !important;
    box-shadow: 0 0 20px rgba(255, 62, 129, 0.5);
    transform: translateY(-2px);
}

.manga-action-premium .add-bookmark a i {
    transition: transform 0.3s ease;
}

.manga-action-premium .add-bookmark a:hover i {
    transform: scale(1.2);
}

/* Quando já está favoritado */
.manga-action-premium .add-bookmark a.bookmarked {
    background: var(--primary) !important;
    color: #fff !important;
    border-color: var(--primary) !important;
}

.manga-action-premium .add-bookmark a .action-text {
    display: none !important;
}


/* --- CONTAINER PRINCIPAL --- */
.comments {
    background: var(--bg-app);
    color: var(--text-main);
    padding: 20px;
    font-family: 'Inter', sans-serif;
}

.comments h4 {
    color: var(--primary);
    text-transform: uppercase;
    letter-spacing: 1px;
    margin-bottom: 20px;
}

/* --- SEÇÃO DE DISCUSSÃO (Título) --- */
#manga-discussion {
    display: flex;
    align-items: center;
    padding: 15px;
    background: linear-gradient(90deg, rgba(157, 29, 242, 0.1) 0%, transparent 100%);
    border-left: 4px solid var(--primary);
    border-radius: 4px;
    margin-bottom: 30px;
}

#manga-discussion i {
    color: var(--accent-new);
    margin-right: 10px;
}

/* --- FORMULÁRIO DE COMENTÁRIO --- */
.comment-respond {
    background: var(--bg-card);
    padding: 25px;
    border-radius: var(--card-radius);
    border: 1px solid var(--border-color);
    margin-bottom: 40px;
}

.comment-form textarea {
    width: 100%;
    background: var(--bg-app);
    border: 1px solid var(--border-color);
    border-radius: 8px;
    color: var(--text-main);
    padding: 15px;
    transition: var(--transition);
    resize: vertical;
    min-height: 120px;
}

.comment-form textarea:focus {
    outline: none;
    border-color: var(--primary);
    box-shadow: 0 0 0 2px rgba(157, 29, 242, 0.2);
}

.submit {
    background: var(--primary);
    color: white;
    border: none;
    padding: 12px 25px;
    border-radius: 6px;
    font-weight: 600;
    cursor: pointer;
    transition: var(--transition);
    margin-top: 15px;
}

.submit:hover {
    background: var(--primary-dark);
    transform: translateY(-2px);
    box-shadow: 0 4px 12px rgba(157, 29, 242, 0.3);
}

/* --- LISTA DE COMENTÁRIOS --- */
.comment-list {
    list-style: none;
    padding: 0;
}

.comment-body {
    display: flex;
    gap: 15px;
    background: var(--bg-card);
    padding: 20px;
    border-radius: var(--card-radius);
    margin-bottom: 20px;
    border: 1px solid var(--border-color);
    transition: var(--transition);
}

.comment-body:hover {
    background: var(--bg-hover);
    border-color: rgba(157, 29, 242, 0.3);
}

/* Avatar */
.comment-avatar img {
    border-radius: 50%;
    border: 2px solid var(--primary);
    padding: 2px;
    background: var(--bg-app);
}

/* Autor e Texto */
.comment-author h6 {
    font-size: 1rem;
    color: var(--accent-new);
    margin: 0 0 5px 0;
}

.comment-content p {
    color: var(--text-main);
    line-height: 1.6;
    margin: 10px 0;
}

.comment-metadata a {
    font-size: 0.8rem;
    color: var(--text-muted);
    text-decoration: none;
}

/* --- BOTÕES DE AÇÃO --- */
.reply a,
.comment-edit-link {
    display: inline-block;
    font-size: 0.85rem;
    color: var(--primary);
    font-weight: 600;
    text-decoration: none;
    margin-top: 10px;
    padding: 5px 12px;
    border: 1px solid var(--primary);
    border-radius: 4px;
    transition: var(--transition);
}

.reply a:hover {
    background: var(--primary);
    color: #fff;
}

.comment-edit-link {
    color: var(--accent-hot);
    border-color: var(--accent-hot);
    margin-left: 10px;
}

/* --- RESPOSTAS (Children) --- */
.children {
    list-style: none;
    padding-left: 40px;
    border-left: 2px solid var(--border-color);
    margin-top: -10px;
    margin-bottom: 30px;
}



/* --- SYSTEM OF PARTNER SCANS (LITTLE TYRANT STYLE) --- */
.scan-profile-header-wrap {
    position: relative;
    padding-top: 180px;
    padding-bottom: 20px;
    margin-bottom: 30px;
}

.scan-profile-banner-bg {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 260px;
    background-size: cover;
    background-position: center;
    z-index: 1;
}

.scan-profile-banner-overlay {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: linear-gradient(to bottom, rgba(10, 10, 12, 0.4) 0%, #0a0a0c 100%);
    z-index: 2;
}

.scan-profile-card {
    position: relative;
    z-index: 10;
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 30px;
    border-radius: 20px;
    background: rgba(24, 24, 27, 0.7);
    backdrop-filter: blur(16px);
    -webkit-backdrop-filter: blur(16px);
    border: 1px solid rgba(255, 255, 255, 0.08);
    box-shadow: 0 20px 40px rgba(0, 0, 0, 0.5);
}

.scan-profile-identity {
    display: flex;
    align-items: center;
    gap: 25px;
    flex: 1;
}

.scan-profile-logo {
    width: 110px;
    height: 110px;
    border-radius: 50%;
    overflow: hidden;
    border: 3px solid var(--primary);
    box-shadow: 0 8px 20px rgba(0, 0, 0, 0.4);
    flex-shrink: 0;
    background: #18181b;
    display: flex;
    align-items: center;
    justify-content: center;
}

.scan-profile-logo img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.scan-profile-logo-placeholder {
    font-size: 2.5rem;
    color: var(--text-muted);
}

.scan-profile-details {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.scan-profile-name {
    font-size: 26px;
    font-weight: 800;
    color: #fff;
    margin: 0;
    display: flex;
    align-items: center;
    gap: 10px;
    letter-spacing: -0.5px;
}

.scan-verified-badge {
    background: rgba(157, 29, 242, 0.15);
    color: #c084fc;
    border: 1px solid rgba(157, 29, 242, 0.3);
    font-size: 11px;
    font-weight: 700;
    text-transform: uppercase;
    padding: 4px 10px;
    border-radius: 20px;
    display: inline-flex;
    align-items: center;
    gap: 5px;
    letter-spacing: 0.5px;
}

.scan-profile-description {
    font-size: 14px;
    color: var(--text-muted);
    line-height: 1.6;
    max-width: 650px;
}

.scan-profile-description p {
    margin: 0;
}

.scan-profile-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    justify-content: flex-end;
}

.scan-profile-actions a,
.scan-profile-actions button {
    padding: 10px 20px;
    border-radius: 12px;
    font-size: 13px;
    font-weight: 700;
    display: inline-flex;
    align-items: center;
    gap: 8px;
    text-decoration: none;
    border: none;
    cursor: pointer;
    transition: var(--transition);
}

.scan-btn-support {
    background: var(--primary);
    color: #fff !important;
    box-shadow: 0 4px 15px rgba(157, 29, 242, 0.3);
}

.scan-btn-support:hover {
    background: var(--primary-dark);
    transform: translateY(-2px);
    box-shadow: 0 6px 20px rgba(157, 29, 242, 0.4);
}

.scan-btn-pix {
    background: #32bcad;
    color: #000 !important;
    box-shadow: 0 4px 15px rgba(50, 188, 173, 0.25);
}

.scan-btn-pix:hover {
    background: #289d90;
    transform: translateY(-2px);
    box-shadow: 0 6px 20px rgba(50, 188, 173, 0.35);
}

.scan-btn-discord {
    background: #5865F2;
    color: #fff !important;
    box-shadow: 0 4px 15px rgba(88, 101, 242, 0.25);
}

.scan-btn-discord:hover {
    background: #4752c4;
    transform: translateY(-2px);
    box-shadow: 0 6px 20px rgba(88, 101, 242, 0.35);
}

.scan-btn-website {
    background: rgba(255, 255, 255, 0.05);
    color: #fff !important;
    border: 1px solid var(--border-color) !important;
}

.scan-btn-website:hover {
    background: rgba(255, 255, 255, 0.1);
    transform: translateY(-2px);
    border-color: var(--primary) !important;
}

/* Box de Recrutamento */
.scan-recruitment-box {
    display: flex;
    align-items: center;
    gap: 20px;
    padding: 20px 25px;
    border-radius: 16px;
    background: rgba(157, 29, 242, 0.04);
    border: 1px dashed rgba(157, 29, 242, 0.3);
    margin-bottom: 35px;
}

.recruitment-icon {
    font-size: 2.2rem;
    color: var(--primary);
    flex-shrink: 0;
}

.recruitment-content {
    flex: 1;
}

.recruitment-content h3 {
    font-size: 16px;
    font-weight: 800;
    color: #fff;
    margin: 0 0 5px 0;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.recruitment-content p {
    font-size: 13.5px;
    color: var(--text-muted);
    margin: 0;
    line-height: 1.5;
}

.recruitment-btn-apply {
    padding: 10px 20px;
    border-radius: 10px;
    font-size: 13px;
    font-weight: 700;
    color: #fff !important;
    background: var(--primary);
    text-decoration: none;
    transition: var(--transition);
    flex-shrink: 0;
    box-shadow: 0 4px 15px rgba(157, 29, 242, 0.2);
}

.recruitment-btn-apply:hover {
    background: var(--primary-dark);
    transform: translateX(3px);
}

/* Ajustes de responsividade para o perfil da Scan */
@media (max-width: 992px) {
    .scan-profile-card {
        flex-direction: column;
        align-items: stretch;
        gap: 25px;
        padding: 20px;
    }

    .scan-profile-actions {
        justify-content: flex-start;
    }
}

@media (max-width: 576px) {
    .scan-profile-header-wrap {
        padding-top: 120px;
    }

    .scan-profile-banner-bg {
        height: 180px;
    }

    .scan-profile-identity {
        flex-direction: column;
        align-items: center;
        text-align: center;
    }

    .scan-profile-logo {
        width: 90px;
        height: 90px;
    }

    .scan-profile-name {
        font-size: 22px;
        flex-direction: column;
        gap: 8px;
    }

    .scan-profile-actions {
        flex-direction: column;
    }

    .scan-profile-actions a,
    .scan-profile-actions button {
        width: 100%;
        justify-content: center;
    }

    .scan-recruitment-box {
        flex-direction: column;
        text-align: center;
        gap: 15px;
    }

    .recruitment-btn-apply {
        width: 100%;
        text-align: center;
    }
}

/* Estilo do botão de Scan no mangá single */
.btn-scan-partner:hover {
    background: var(--primary) !important;
    border-color: var(--primary) !important;
    transform: translateY(-2px);
    box-shadow: 0 6px 15px rgba(157, 29, 242, 0.2);
}

/* --- SCANS LIST TEMPLATE STYLES --- */
.scans-list-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
    gap: 30px;
    width: 100%;
}

.scan-card {
    display: flex;
    flex-direction: column;
    border-radius: 20px;
    background: rgba(24, 24, 27, 0.7);
    border: 1px solid rgba(255, 255, 255, 0.08);
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.4);
    overflow: hidden;
    transition: var(--transition);
}

.scan-card:hover {
    transform: translateY(-8px);
    border-color: var(--primary);
    box-shadow: 0 15px 40px rgba(0, 0, 0, 0.5), 0 0 20px rgba(157, 29, 242, 0.1);
}

.scan-card-banner {
    position: relative;
    height: 120px;
    background-size: cover;
    background-position: center;
}

.scan-card-banner-overlay {
    position: absolute;
    inset: 0;
    background: linear-gradient(to bottom, transparent 30%, #0a0a0c 100%);
}

.scan-card-badge-recruiting {
    position: absolute;
    top: 15px;
    right: 15px;
    background: #2ecc71;
    color: white;
    font-size: 10px;
    font-weight: 800;
    text-transform: uppercase;
    padding: 4px 10px;
    border-radius: 20px;
    display: inline-flex;
    align-items: center;
    gap: 5px;
    box-shadow: 0 4px 10px rgba(0, 0, 0, 0.3);
    z-index: 5;
}

.scan-card-logo-wrap {
    width: 80px;
    height: 80px;
    border-radius: 50%;
    overflow: hidden;
    border: 3px solid var(--primary);
    box-shadow: 0 5px 15px rgba(0, 0, 0, 0.4);
    margin: -40px auto 0;
    z-index: 10;
    position: relative;
    background: #18181b;
    display: flex;
    align-items: center;
    justify-content: center;
}

.scan-card-logo-wrap img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.scan-card-logo-placeholder {
    font-size: 2rem;
    color: var(--text-muted);
}

.scan-card-info {
    padding: 20px 25px 15px;
    flex: 1;
    text-align: center;
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.scan-card-name {
    font-size: 18px;
    font-weight: 800;
    color: #fff;
    margin: 0;
    letter-spacing: -0.5px;
}

.scan-card-description {
    font-size: 13px;
    color: var(--text-muted);
    line-height: 1.5;
    overflow: hidden;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    min-height: 58px;
}

.scan-card-description p {
    margin: 0;
}

.scan-card-footer {
    padding: 15px 25px 25px;
    text-align: center;
}

.scan-card-btn-view {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    width: 100%;
    padding: 12px;
    border-radius: 12px;
    font-size: 13px;
    font-weight: 700;
    color: #fff !important;
    background: rgba(255, 255, 255, 0.05);
    border: 1px solid var(--border-color);
    text-decoration: none;
    transition: var(--transition);
}

.scan-card-btn-view:hover {
    background: var(--primary);
    border-color: var(--primary);
    box-shadow: 0 4px 15px rgba(171, 29, 254, 0.3);
    transform: translateY(-2px);
}

/* Estilização do container do Breadcrumb */
.manga-breadcrumb {
    /* Fundo cinza claro (estilo Bootstrap moderno) */
    padding: 12px 0;
}

/* Remove margens e paddings padrões da lista */
.manga-breadcrumb .breadcrumb {
    background-color: transparent;
    /* Remove o fundo padrão do Bootstrap antigo */
    padding: 0;
    list-style: none;
    display: flex;
    flex-wrap: wrap;
}

/* Estilização dos itens da lista */
.manga-breadcrumb .breadcrumb li {
    font-size: 14px;
    display: inline-flex;
    align-items: center;
    color: #6c757d;
    /* Cor do texto do último item (ativo) */
}

/* Estilização dos links */
.manga-breadcrumb .breadcrumb li a {
    color: var(--primary);
    /* Cor azul padrão para links */
    text-decoration: none;
    transition: color 0.2s ease-in-out;
}

/* Efeito Hover nos links */
.manga-breadcrumb .breadcrumb li a:hover {
    color: var(--primary-dark);
    text-decoration: underline;
}

/* Adiciona o separador (/) automaticamente entre os itens */
.manga-breadcrumb .breadcrumb li+li::before {
    content: "/";
    padding: 0 10px;
    color: var(--text-muted);
    font-weight: normal;
}

/* Item ativo (onde o usuário está no momento) */
.manga-breadcrumb .breadcrumb li.active {
    color: var(--primary-dark);
    font-weight: 600;
    /* Deixa o nome do mangá em negrito leve */
}

/* Badge da Scan no topo do card do Mangá */
.poster-wrapper {
    position: relative;
}

.manga-scan-card-badge {
    position: absolute;
    top: -10px;
    left: 50%;
    transform: translateX(-50%);
    z-index: 10;
    color: #ffffff;
    font-size: 9.5px;
    font-weight: 800;
    letter-spacing: 0.8px;
    text-transform: uppercase;
    padding: 4px 12px;
    border-radius: 20px;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.4);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 5px;
    white-space: nowrap;
    transition: transform 0.3s ease, box-shadow 0.3s ease;
    border: 1px solid rgba(255, 255, 255, 0.15);
}

.mc-card-inner:hover .manga-scan-card-badge,
.card-hunters:hover .manga-scan-card-badge {
    transform: translateX(-50%) translateY(-2px);
    box-shadow: 0 6px 15px rgba(0, 0, 0, 0.5);
}

.manga-scan-card-badge i {
    font-size: 10px;
}

/* Badge de Parceria - Gradiente Destaque */
.manga-scan-card-badge.partnership {
    border: 1px solid rgba(255, 255, 255, 0.25);
}

/* Impedir corte de badges no mc-card-inner padrão do Madara */
.mc-card-inner {
    overflow: visible !important;
}
.mc-card-inner .poster-wrapper,
.mc-card-inner .poster-wrapper img,
.mc-card-inner .poster-wrapper .poster-overlay {
    border-top-left-radius: 12px !important;
    border-top-right-radius: 12px !important;
}