/* ============================================================ ZIKPIC - TEMA OSCURO Activo cuando Sobrescribe variables de main.css + fixes hardcodeados ============================================================ */ /* ============================================================ 1. OVERRIDE DE VARIABLES CSS (main.css + comments.css) NOTA: Se usa html[data-theme="dark"] (especificidad 0-1-1) para superar a :root (0-1-0) de main.css aunque cargue después. ============================================================ */ html[data-theme="dark"] { /* Fondos principales */ --white: #1e1e2e; --light: #2d2d40; --bg-light: #1a2a1e; --light-bg: #1a2a1e; --card-bg: #252538; --card-hover: #2e2e45; /* Texto */ --dark: #e2e8f0; --dark-light: #cbd5e1; --text-dark: #e2e8f0; --text-light: #a7f3d0; --text-gray: #94a3b8; --text-muted: #94a3b8; --gray: #94a3b8; --gray-light: #475569; /* Bordes */ --border: #3a3a52; /* Colores brand - sin cambios */ --primary: #81d742; --primary-dark: #3ac403; --primary-light: #4a7a30; --zikpic-primary: #81d742; --zikpic-secondary: #3ac403; --zikpic-green: #81d742; --zikpic-green-dark: #2e9c02; --zikpic-dark-green: #6bb536; --zikpic-light-green: #9de45a; --zikpic-white: #1e1e2e; --zikpic-dark: #e2e8f0; --zikpic-light: #2d2d40; /* Sombras */ --shadow-sm: 0 1px 2px rgba(0, 0, 0, 0.4); --shadow: 0 1px 3px rgba(0, 0, 0, 0.5), 0 1px 2px rgba(0, 0, 0, 0.4); --shadow-md: 0 4px 6px rgba(0, 0, 0, 0.5), 0 2px 4px rgba(0, 0, 0, 0.4); --shadow-lg: 0 10px 15px rgba(0, 0, 0, 0.5), 0 4px 6px rgba(0, 0, 0, 0.4); --shadow-xl: 0 20px 25px rgba(0, 0, 0, 0.5), 0 10px 10px rgba(0, 0, 0, 0.3); --zikpic-shadow: 0 2px 10px rgba(0, 0, 0, 0.5); /* Variables de comentarios (comments.css tiene su propio :root) */ --comment-bg: #252538; --comment-border: #3a3a52; --comment-text: #e2e8f0; --comment-text-light: #94a3b8; --comment-shadow: 0 2px 8px rgba(0, 0, 0, 0.4); } /* ============================================================ 2. BODY Y BASE ============================================================ */ [data-theme="dark"] body { background-color: #1e1e2e !important; color: #e2e8f0 !important; } /* ============================================================ 3. HEADER (mainh.css) ============================================================ */ [data-theme="dark"] .zikpic-header { background: #16161e; border-bottom-color: #2d2d40; } [data-theme="dark"] .header { background: #16161e; } /* Logo: mostrar versión oscura en dark mode */ .header-logo-dark, .footer-logo-dark { display: none; } [data-theme="dark"] .header-logo-light, [data-theme="dark"] .footer-logo-light { display: none !important; } [data-theme="dark"] .header-logo-dark, [data-theme="dark"] .footer-logo-dark { display: inline-block !important; } /* Búsqueda en header */ [data-theme="dark"] .header-search input, [data-theme="dark"] .search-field, [data-theme="dark"] input[type="search"], [data-theme="dark"] .zikpic-search { background: #252538; border-color: #3a3a52; color: #e2e8f0; } [data-theme="dark"] .zikpic-search input { color: #e2e8f0; } [data-theme="dark"] .zikpic-search input::placeholder, [data-theme="dark"] .search-field::placeholder { color: #64748b; } /* Links de navegación */ [data-theme="dark"] .nav-link, [data-theme="dark"] .header-nav a { color: #cbd5e1 !important; } [data-theme="dark"] .nav-link:hover { background: var(--zikpic-green) !important; color: #1e1e2e !important; /* texto oscuro sobre verde */ } /* Estado activo en el header */ [data-theme="dark"] .nav-link.activeh, [data-theme="dark"] .activeh { background: rgba(129, 215, 66, 0.15) !important; color: #81d742 !important; } /* Botones del header (notificaciones, mensajes) */ [data-theme="dark"] .notification-trigger i, [data-theme="dark"] .messages-trigger i { color: #cbd5e1 !important; } /* Dropdown avatar menu */ [data-theme="dark"] .avatar-menu, [data-theme="dark"] .avatar-dropdown .avatar-menu { background: #252538; border-color: #3a3a52; box-shadow: 0 8px 24px rgba(0,0,0,0.5); } [data-theme="dark"] .dropdown-item { color: #e2e8f0; border-bottom-color: rgba(255,255,255,0.05) !important; } [data-theme="dark"] .dropdown-item:hover { background: #2d2d40; color: var(--primary); } /* Menú de notificaciones */ [data-theme="dark"] .notification-dropdown-menu, [data-theme="dark"] #userNotificationMenu { background: #252538 !important; border-color: #3a3a52 !important; box-shadow: 0 8px 30px rgba(0,0,0,0.5) !important; } [data-theme="dark"] .notification-dropdown-menu h6, [data-theme="dark"] #userNotificationMenu h6 { color: #e2e8f0 !important; } [data-theme="dark"] #userNotificationMenu [style*="border-bottom"], [data-theme="dark"] #userNotificationMenu [style*="border-top"] { border-color: #3a3a52 !important; } /* Items de notificación generados por JS */ [data-theme="dark"] .notification-item { background: #252538 !important; border-bottom-color: rgba(255,255,255,0.07) !important; color: #e2e8f0 !important; } [data-theme="dark"] .notification-item:hover { background: #2d2d40 !important; } [data-theme="dark"] .notification-item .notification-title { color: #e2e8f0 !important; } /* Hamburger menu */ [data-theme="dark"] .hamburger-button rect { fill: #e2e8f0; } /* ============================================================ 4. CARDS (main.css + components.css) ============================================================ */ [data-theme="dark"] .series-card, [data-theme="dark"] .category-card, [data-theme="dark"] .modal-content { background: var(--card-bg) !important; } /* Series card generado por PostCard.php — inline styles hardcodeados */ [data-theme="dark"] .series-card { border-color: #3a3a52 !important; } [data-theme="dark"] .series-card [style*="color: #2d3748"], [data-theme="dark"] .series-card [style*="color:#2d3748"] { color: #e2e8f0 !important; } [data-theme="dark"] .series-card [style*="color: #718096"], [data-theme="dark"] .series-card [style*="color:#718096"] { color: #94a3b8 !important; } [data-theme="dark"] .series-card [style*="color: #a0aec0"], [data-theme="dark"] .series-card [style*="color:#a0aec0"] { color: #64748b !important; } /* Series card generado por profile.php — clases CSS (sin inline styles) */ [data-theme="dark"] .series-card .series-title { color: #e2e8f0 !important; } [data-theme="dark"] .series-card .series-description { color: #94a3b8 !important; } [data-theme="dark"] .series-card .series-author { color: #64748b !important; } /* Divisor entre contenido del post y acciones (likes/comentarios) */ [data-theme="dark"] .post-actions { border-top-color: rgba(255, 255, 255, 0.06) !important; } [data-theme="dark"] .card-content { background: var(--card-bg); } /* Borde claro entre cards y fondo */ [data-theme="dark"] .series-card { border: 1px solid #2e2e45; } /* ============================================================ 5. FORMULARIOS E INPUTS ============================================================ */ [data-theme="dark"] input:not([type="checkbox"]):not([type="radio"]):not([type="range"]), [data-theme="dark"] textarea, [data-theme="dark"] select { background-color: #252538; border-color: #3a3a52; color: #e2e8f0; } [data-theme="dark"] input::placeholder, [data-theme="dark"] textarea::placeholder { color: #64748b; } [data-theme="dark"] input:focus, [data-theme="dark"] textarea:focus, [data-theme="dark"] select:focus { /* background-color: #2d2d40; */ border-color: var(--primary); color: #e2e8f0; } [data-theme="dark"] .search-input { background: #252538; border-color: #3a3a52; color: #e2e8f0; } /* ============================================================ 6. SECCIONES DE CONTENIDO (featured, etc.) ============================================================ */ [data-theme="dark"] .featured { background: #191926; } [data-theme="dark"] section { background-color: transparent; } /* ============================================================ 7. FOOTER (mainh.css — hardcodeados #f8f9fa, #e9ecef) ============================================================ */ [data-theme="dark"] .zikpic-footer { background: #16161e !important; border-top-color: #2d2d40 !important; } [data-theme="dark"] .footer-link { color: #94a3b8 !important; } [data-theme="dark"] .footer-link:hover { color: var(--primary) !important; } [data-theme="dark"] .footer-copyright { border-top-color: #2d2d40 !important; } [data-theme="dark"] .footer-copyright p { color: #94a3b8 !important; } [data-theme="dark"] .footer-tagline { color: #94a3b8 !important; } [data-theme="dark"] .social-icon { background: #2d2d40 !important; color: #94a3b8; } /* ============================================================ 8. MODALES (components.css usa var(--white) — ya cubierto) ============================================================ */ [data-theme="dark"] .modal-header { border-bottom-color: #3a3a52; } [data-theme="dark"] .modal-header h3 { color: #e2e8f0; } [data-theme="dark"] .modal-close { color: #94a3b8; } [data-theme="dark"] .modal-close:hover { background: #2d2d40; } /* ============================================================ 9. COMENTARIOS — fixes hardcodeados en comments.css ============================================================ */ [data-theme="dark"] .comment-input { background: #1e1e2e !important; color: #e2e8f0 !important; border-color: #3a3a52 !important; } [data-theme="dark"] .comment-input:focus { background: #252538 !important; } [data-theme="dark"] .tool-btn:hover { background: #2d2d40 !important; } [data-theme="dark"] .comment-sort { background: #252538; color: #e2e8f0; border-color: #3a3a52; } [data-theme="dark"] .comment-item { box-shadow: 0 2px 6px rgba(0,0,0,0.4); } [data-theme="dark"] .reply-item { background: #1e1e2e !important; border-left-color: #3a3a52 !important; } /* Fondo hardcodeado #f8f9fa en scrollbar comments */ [data-theme="dark"] .comments-scroll-inner::-webkit-scrollbar-track { background: #2d2d40 !important; } [data-theme="dark"] .loading-skeleton, [data-theme="dark"] .skeleton-line { background: #2d2d40 !important; } /* ============================================================ 10. ZIKPIC-CORE — fixes (tab-scroll-btn hardcodeado) ============================================================ */ [data-theme="dark"] .tab-scroll-btn { background: rgba(30, 30, 46, 0.97) !important; color: #e2e8f0 !important; } [data-theme="dark"] .tab-scroll-btn.right { background: rgba(30, 30, 46, 0.9) !important; } /* ============================================================ 11. TABS Y FILTROS ============================================================ */ /* series-tab-btn (series.css tiene #f5f5f5 hardcodeado en active) */ [data-theme="dark"] .series-tab-btn { color: #94a3b8 !important; } [data-theme="dark"] .series-tab-btn:hover { background: #2d2d40 !important; color: #e2e8f0 !important; } [data-theme="dark"] .series-tab-btn.active { background: #2d2d40 !important; color: #e2e8f0 !important; border-bottom-color: var(--primary) !important; box-shadow: 0 2px 8px rgba(0,0,0,0.4) !important; } [data-theme="dark"] .filter-btn { border-color: #3a3a52; color: #94a3b8; } [data-theme="dark"] .filter-btn:hover, [data-theme="dark"] .filter-btn.active { border-color: var(--primary); color: var(--primary); background: rgba(129, 215, 66, 0.1); } [data-theme="dark"] .series-tabs-scrollable, [data-theme="dark"] .content-filter-tabs { background: transparent; } /* Tabs estilo Bootstrap-like */ [data-theme="dark"] .nav-tabs { border-color: #3a3a52; } [data-theme="dark"] .nav-tabs .nav-link { color: #94a3b8; } [data-theme="dark"] .nav-tabs .nav-link.active, [data-theme="dark"] .nav-tabs .nav-link:hover { color: #e2e8f0; background: #252538; border-color: #3a3a52 #3a3a52 #252538; } /* ============================================================ 12. ZPMEDIA — banner de serie (zpmedia.css tiene #fff hardcodeado) ============================================================ */ [data-theme="dark"] .series-banner { background: #252538 !important; } /* ============================================================ 13. COMPONENTES VARIOS ============================================================ */ /* Badges y alertas */ [data-theme="dark"] .alert { border-color: #3a3a52; } [data-theme="dark"] .alert-success { background: rgba(46, 204, 113, 0.15); color: #a7f3d0; border-color: rgba(46, 204, 113, 0.3); } [data-theme="dark"] .alert-error, [data-theme="dark"] .alert-danger { background: rgba(231, 76, 60, 0.15); color: #fca5a5; border-color: rgba(231, 76, 60, 0.3); } /* Separadores */ [data-theme="dark"] hr, [data-theme="dark"] .divider { border-color: #3a3a52; } /* Tables */ [data-theme="dark"] table { color: #e2e8f0; } [data-theme="dark"] th { background: #252538; color: #94a3b8; border-color: #3a3a52; } [data-theme="dark"] td { border-color: #3a3a52; } [data-theme="dark"] tr:hover td { background: #2d2d40; } /* Scrollbar global */ [data-theme="dark"] ::-webkit-scrollbar-track { background: #1e1e2e; } [data-theme="dark"] ::-webkit-scrollbar-thumb { background: #3a3a52; } [data-theme="dark"] ::-webkit-scrollbar-thumb:hover { background: #4a4a65; } /* ============================================================ 14. DASHBOARD (userconfig, etc.) ============================================================ */ [data-theme="dark"] .userconfig-container, [data-theme="dark"] .dashboard-card, [data-theme="dark"] .config-section { background: transparent; } [data-theme="dark"] .config-section { border-bottom-color: #3a3a52; } [data-theme="dark"] .config-section h3 { color: #e2e8f0; } [data-theme="dark"] .config-section-description { color: #94a3b8; } [data-theme="dark"] .user-info-card { background: #252538; } [data-theme="dark"] .user-info-row { border-bottom-color: #3a3a52; } [data-theme="dark"] .user-info-label { color: #94a3b8; } [data-theme="dark"] .user-info-value { color: #e2e8f0; } /* Acordeones */ [data-theme="dark"] .accordion-section { background: #252538; border-color: #3a3a52; } [data-theme="dark"] .accordion-header { background: #252538; color: #e2e8f0; } [data-theme="dark"] .accordion-header:hover, [data-theme="dark"] .accordion-header.active { background: #2d2d40; } /* Cols picker (botones de columnas) */ [data-theme="dark"] .col-opt-btn { background: #2d2d40; border-color: #3a3a52; color: #e2e8f0; } [data-theme="dark"] .col-opt-btn:hover { border-color: var(--primary); } [data-theme="dark"] .col-opt-btn.active { background: rgba(129,215,66,0.15); border-color: var(--primary); color: var(--primary); } /* ============================================================ 15. GALERÍAS Y MASONRY ============================================================ */ [data-theme="dark"] .gal-masonry, [data-theme="dark"] .gal-grid { background: transparent; } [data-theme="dark"] .gal-item-inner { background: #252538; } /* Creator cards (FeaturedCreatorsModule.php — background: white hardcodeado) */ [data-theme="dark"] .gal-creator-card, [data-theme="dark"] .creator-card { background: #252538 !important; box-shadow: 0 2px 8px rgba(0,0,0,0.4) !important; } [data-theme="dark"] .gal-creator-card:hover, [data-theme="dark"] .creator-card:hover { box-shadow: 0 12px 24px rgba(0,0,0,0.5) !important; } [data-theme="dark"] .gal-creator-name, [data-theme="dark"] .creator-name { color: #e2e8f0 !important; } [data-theme="dark"] .gal-creator-stat, [data-theme="dark"] .creator-stat, [data-theme="dark"] .gal-creator-role { color: #94a3b8 !important; } /* ============================================================ 16. PROFILE ============================================================ */ [data-theme="dark"] .profile-header { background: #16161e; } [data-theme="dark"] .profile-stats-bar { background: #252538; border-color: #3a3a52; } /* ============================================================ 17. SOCIAL / POSTS ============================================================ */ [data-theme="dark"] .post-card, [data-theme="dark"] .social-post { background: #252538; border-color: #3a3a52; } /* ============================================================ 18. TOGGLE SWITCH — UI del tema en userconfig.php ============================================================ */ .theme-toggle-wrapper { display: flex; align-items: center; gap: 14px; } .theme-toggle-label { display: flex; align-items: center; gap: 8px; font-size: 0.95rem; font-weight: 600; color: var(--text-dark, #2c3e50); cursor: pointer; user-select: none; } .theme-toggle-switch { position: relative; width: 58px; height: 30px; flex-shrink: 0; } .theme-toggle-switch input { opacity: 0; width: 0; height: 0; position: absolute; } .theme-toggle-track { position: absolute; inset: 0; background: #c0c7d0; border-radius: 30px; cursor: pointer; transition: background 0.3s ease; display: flex; align-items: center; padding: 0 4px; } .theme-toggle-track::after { content: ''; width: 22px; height: 22px; border-radius: 50%; background: #fff; box-shadow: 0 2px 6px rgba(0,0,0,0.2); transition: transform 0.3s ease; } .theme-toggle-switch input:checked + .theme-toggle-track { background: var(--primary, #81d742); } .theme-toggle-switch input:checked + .theme-toggle-track::after { transform: translateX(28px); } .theme-toggle-icon { font-size: 1.1rem; line-height: 1; } [data-theme="dark"] .theme-toggle-label { color: #e2e8f0; } /* ============================================================ 19. BOTONES "VER TODOS..." (series-view-more) ============================================================ */ [data-theme="dark"] .series-view-more a { background: #2d2d40 !important; color: #e2e8f0 !important; box-shadow: 0 2px 8px rgba(0,0,0,0.3) !important; } [data-theme="dark"] .series-view-more a:hover { background: #3a3a52 !important; color: #e2e8f0 !important; } /* ============================================================ 20. MÓDULO AUTORES DESTACADOS — Avatar Stack (fcm-h3-card) ============================================================ */ [data-theme="dark"] .fcm-h3-card { background: #252538 !important; box-shadow: 0 2px 12px rgba(0,0,0,0.35) !important; } [data-theme="dark"] .fcm-h3-card:hover { box-shadow: 0 8px 24px rgba(0,0,0,0.5) !important; } [data-theme="dark"] .fcm-h3-link:hover { background: rgba(255,255,255,0.08) !important; } [data-theme="dark"] .fcm-h3-names { color: #94a3b8 !important; } [data-theme="dark"] .fcm-h3-name-link { color: #94a3b8 !important; } [data-theme="dark"] .fcm-h3-name-link:hover { color: #e2e8f0 !important; } /* Border del avatar en dark mode */ [data-theme="dark"] .fcm-h3-stack .av { border-color: #252538 !important; } /* ============================================================ 21. BOTONES "VER MÁS" DEL INDEX (header-zp-end, carousel-mobile-more) y BOTÓN "VER TODOS/MÁS" del módulo de creadores (gal-load-more, fcm-more-btn) ============================================================ */ [data-theme="dark"] .header-zp-end a, [data-theme="dark"] .carousel-mobile-more a, [data-theme="dark"] .gal-load-more, [data-theme="dark"] a.gal-load-more, [data-theme="dark"] .fcm-more-btn, [data-theme="dark"] a.fcm-more-btn { background: #2d2d40 !important; color: #e2e8f0 !important; box-shadow: 0 2px 8px rgba(0,0,0,0.3) !important; } [data-theme="dark"] .header-zp-end a:hover, [data-theme="dark"] .carousel-mobile-more a:hover, [data-theme="dark"] .gal-load-more:hover, [data-theme="dark"] .fcm-more-btn:hover { background: #3a3a52 !important; color: #e2e8f0 !important; } /* ============================================================ 22. BANNER HERO — texto claro en dark mode .hero-content usa color: var(--white) y en dark --white = #1e1e2e ============================================================ */ [data-theme="dark"] .hero-content { color: #ffffff !important; } [data-theme="dark"] .hero-content h1, [data-theme="dark"] .hero-content h2, [data-theme="dark"] .hero-content p { color: #ffffff !important; text-shadow: none !important; } [data-theme="dark"] .text-invitation-zikpic h2, [data-theme="dark"] .text-invitation-zikpic p { text-shadow: none !important; } [data-theme="dark"] .app-section { box-shadow: none !important; } [data-theme="dark"] .hero-carousel { box-shadow: none !important; } /* ============================================================ 23. CREATORS.PHP — stats box y botón de orden ============================================================ */ [data-theme="dark"] .creator-stats { background: #2d2d40 !important; border-color: #3a3a52 !important; } [data-theme="dark"] .creator-card:hover .creator-stats { background: #3a3a52 !important; border-color: #4a4a62 !important; } [data-theme="dark"] .order-toggle-btn { background: #2d2d40 !important; color: var(--primary) !important; } [data-theme="dark"] .order-toggle-btn:hover { background: var(--primary) !important; color: #1e1e2e !important; } /* ============================================================ 24. MODAL DE GALERÍA / VIÑETA (gallery-modal.css) ============================================================ */ /* Override variables del :root de gallery-modal.css */ html[data-theme="dark"] { --modal-content-bg: #252538; --modal-border: #3a3a52; --text-dark: #e2e8f0; --text-light: #94a3b8; } /* Borde visible para distinguir el modal del fondo oscuro */ [data-theme="dark"] .modal-container { background: #252538 !important; box-shadow: 0 20px 60px rgba(0,0,0,0.7), 0 0 0 1px rgba(255,255,255,0.08) !important; } [data-theme="dark"] .modal-sidebar { background: #252538 !important; border-left-color: #3a3a52 !important; } [data-theme="dark"] .modal-header { background: #252538 !important; border-bottom-color: #3a3a52 !important; } [data-theme="dark"] .modal-actions { background: #252538 !important; border-bottom-color: #3a3a52 !important; border-top-color: #3a3a52 !important; } [data-theme="dark"] .modal-title { color: #e2e8f0 !important; } [data-theme="dark"] .modal-description { color: #94a3b8 !important; } [data-theme="dark"] .modal-author-info h3 { color: #e2e8f0 !important; } [data-theme="dark"] .modal-author-info p { color: #94a3b8 !important; } [data-theme="dark"] .action-item { color: #94a3b8 !important; } [data-theme="dark"] .action-item:hover { color: var(--primary) !important; background: rgba(129,215,66,0.12) !important; } /* Flechas de navegación del modal */ [data-theme="dark"] .modal-nav-arrow { background: rgba(45,45,64,0.92) !important; color: #e2e8f0 !important; box-shadow: 0 4px 15px rgba(0,0,0,0.5) !important; } [data-theme="dark"] .modal-nav-arrow:hover { background: var(--primary) !important; color: #1e1e2e !important; } /* ============================================================ 25. COMIC-F — BARRA DEL AUTOR Y SEPARADORES DE EPISODIOS ============================================================ */ /* Franja blanca del autor en comic-f.php → oscurecer el gradiente */ [data-theme="dark"] .user-header-container-zp { background: linear-gradient(90deg, #1e1e2e 30%, transparent 100%) !important; } /* Lista de capítulos/episodios (series.php) */ [data-theme="dark"] .chapters-list { background: #252538 !important; box-shadow: 0 4px 15px rgba(0,0,0,0.4) !important; } /* Separadores entre episodios — muy atenuados */ [data-theme="dark"] .chapter-item { border-bottom-color: rgba(255,255,255,0.06) !important; } [data-theme="dark"] .chapter-item:last-child { border-bottom: none !important; } /* ============================================================ 26. MASONRY TABS (gal.php / vinetas.php) + SOCIAL MODAL ============================================================ */ /* Tabs de galería y viñetas: botón activo visible en dark mode */ [data-theme="dark"] .masonry-tab-btn { color: #94a3b8 !important; } [data-theme="dark"] .masonry-tab-btn:hover { background: #2d2d40 !important; color: #e2e8f0 !important; } [data-theme="dark"] .masonry-tab-btn.active { background: #2d2d40 !important; color: #e2e8f0 !important; border-bottom-color: var(--primary) !important; box-shadow: 0 2px 8px rgba(0,0,0,0.4) !important; } /* Borde inferior del bloque autor en modales (gal-masonry.css) */ [data-theme="dark"] .modal-author-info { border-bottom-color: #3a3a52 !important; } /* Texto de descripción del post en modal social (color visible) */ [data-theme="dark"] .modal-post-text { color: #94a3b8 !important; } /* Profile sidebar y card en comic-f.php / series.php */ [data-theme="dark"] .profile-sidebar { background: none !important; } [data-theme="dark"] .profile-card { background: none !important; } /* ============================================================ 27. PÁGINAS DE EVENTOS (eventos.php, evento-f.php, social.php carrusel) ============================================================ */ /* --- Carrusel de eventos en social.php --- */ [data-theme="dark"] .event-carousel-card { background: #252538 !important; box-shadow: 0 2px 8px rgba(0,0,0,0.4) !important; } [data-theme="dark"] .event-carousel-card h3 { color: #e2e8f0 !important; } /* Overrides para los colores inline hardcodeados en las tarjetas del carrusel */ [data-theme="dark"] .event-carousel-card [style*="color: #333"], [data-theme="dark"] .event-carousel-card [style*="color:#333"] { color: #e2e8f0 !important; } [data-theme="dark"] .event-carousel-card [style*="color: #666"], [data-theme="dark"] .event-carousel-card [style*="color:#666"] { color: #94a3b8 !important; } [data-theme="dark"] .event-carousel-card [style*="border-top: 1px solid #eee"], [data-theme="dark"] .event-carousel-card [style*="border-top:1px solid #eee"] { border-top-color: #3a3a52 !important; } /* Badge de categoría en carrusel social.php */ [data-theme="dark"] .event-carousel-card [style*="background: rgba(255,255,255,0.95)"], [data-theme="dark"] .event-carousel-card [style*="background:rgba(255,255,255,0.95)"] { background: rgba(45,45,64,0.95) !important; color: #e2e8f0 !important; } /* --- Cards de eventos.php --- */ [data-theme="dark"] .event-card { background: #252538 !important; color: #e2e8f0 !important; box-shadow: 0 2px 8px rgba(0,0,0,0.4) !important; } [data-theme="dark"] .event-card-title { color: #e2e8f0 !important; } [data-theme="dark"] .event-card-description { color: #94a3b8 !important; } [data-theme="dark"] .event-card-hashtag { background: #2d2d40 !important; } [data-theme="dark"] .event-card-footer { border-top-color: #3a3a52 !important; } [data-theme="dark"] .event-card-creator, [data-theme="dark"] .event-card-stats { color: #94a3b8 !important; } [data-theme="dark"] .badge-category { background: #1a3356 !important; color: #7ec8e3 !important; } [data-theme="dark"] .badge-type { background: #2d1b4e !important; color: #c084fc !important; } /* Stat badges del encabezado de eventos.php */ [data-theme="dark"] .stat-badge { background: #252538 !important; box-shadow: 0 2px 4px rgba(0,0,0,0.3) !important; } [data-theme="dark"] .stat-badge span { color: #e2e8f0 !important; } [data-theme="dark"] .stat-number { color: #e2e8f0 !important; } /* Título y subtítulo del header de autor en comic-f / gal-f / eventos */ [data-theme="dark"] .header-zp-title, [data-theme="dark"] .h1-title-autor { color: #e2e8f0 !important; text-shadow: none !important; } [data-theme="dark"] .header-zp-subtitle, [data-theme="dark"] .header-zp-p-subtitle, [data-theme="dark"] .subtitle-gal-autor-banner { color: #94a3b8 !important; text-shadow: none !important; } /* Empty state y paginación de eventos.php */ [data-theme="dark"] .empty-state { background: #252538 !important; } [data-theme="dark"] .empty-state h3 { color: #94a3b8 !important; } [data-theme="dark"] .pagination a, [data-theme="dark"] .pagination span { background: #252538 !important; color: #e2e8f0 !important; } [data-theme="dark"] .pagination a:hover { background: #667eea !important; color: #fff !important; } /* --- evento-f.php: tarjeta de información principal --- */ [data-theme="dark"] .event-info-card { background: #252538 !important; box-shadow: 0 2px 8px rgba(0,0,0,0.4) !important; } [data-theme="dark"] .event-detail-label { color: #94a3b8 !important; } [data-theme="dark"] .event-detail-value { color: #e2e8f0 !important; } [data-theme="dark"] .event-description h3 { color: #e2e8f0 !important; } [data-theme="dark"] .event-hashtag { background: #2d2d40 !important; } /* Título de sección "Participaciones" */ [data-theme="dark"] .section-title { color: #e2e8f0 !important; } /* Botones sociales Me gusta / Compartir (borde) */ [data-theme="dark"] .social-buttons-container { border-top-color: #3a3a52 !important; border-bottom-color: #3a3a52 !important; } /* Botón Compartir: estado normal más legible en dark */ [data-theme="dark"] .share-btn { border-color: #a78bfa !important; color: #a78bfa !important; } [data-theme="dark"] .share-btn:hover { color: #ffffff !important; } /* Empty state de participaciones */ [data-theme="dark"] .empty-participations { background: #252538 !important; } [data-theme="dark"] .empty-participations h3 { color: #94a3b8 !important; } /* Attachments border */ [data-theme="dark"] .event-attachments { border-top-color: #3a3a52 !important; } /* post-card-masonry: sombra clara en móvil → oscura en dark */ @media (max-width: 480px) { [data-theme="dark"] .post-card-masonry { box-shadow: var(--shadow-md) !important; } } /* ============================================================ 28. READER WIDGETS (reader.php / reader-novel.php) Sección social, info card, navegación, sidebar ============================================================ */ /* Tarjeta de información del episodio */ [data-theme="dark"] .episode-details-card { background: #252538 !important; box-shadow: 0 4px 20px rgba(0,0,0,0.4) !important; border-left-color: var(--primary) !important; } [data-theme="dark"] .episode-title-card { color: #e2e8f0 !important; } [data-theme="dark"] .info-label { color: #64748b !important; } [data-theme="dark"] .info-value { color: #e2e8f0 !important; } [data-theme="dark"] .author-name-card { color: #e2e8f0 !important; } [data-theme="dark"] .genre-tag-card { background: #1a3356 !important; color: #7ec8e3 !important; border-color: #2a4a6e !important; } /* Columna derecha: botones coloridos y reacciones */ [data-theme="dark"] .colorful-actions { background: #252538 !important; box-shadow: 0 4px 20px rgba(0,0,0,0.4) !important; } [data-theme="dark"] .reactions-label { color: #94a3b8 !important; } [data-theme="dark"] .reaction-btn-colorful { background: #2d2d40 !important; border-color: #3a3a52 !important; } [data-theme="dark"] .reaction-btn-colorful:hover { background: #353550 !important; border-color: var(--primary) !important; } [data-theme="dark"] .reaction-btn-colorful .count { background: #3a3a52 !important; color: #94a3b8 !important; } /* Separador de navegación */ [data-theme="dark"] .episode-navigation { border-top-color: #3a3a52 !important; } /* Widgets del sidebar */ [data-theme="dark"] .widget { background: #252538 !important; box-shadow: 0 2px 8px rgba(0,0,0,0.4) !important; } [data-theme="dark"] .widget h3 { color: #e2e8f0 !important; } [data-theme="dark"] .series-info h4, [data-theme="dark"] .original-info h4 { color: #e2e8f0 !important; } [data-theme="dark"] .series-info .author, [data-theme="dark"] .series-info .category, [data-theme="dark"] .original-info .author { color: #94a3b8 !important; } /* ======================================== SECTION 29 - HOME WIDGET CARDS (index) ======================================== */ [data-theme="dark"] .widget-card { background: #252538 !important; box-shadow: 0 4px 20px rgba(0,0,0,0.4) !important; } [data-theme="dark"] .widget-card h3 { color: #e2e8f0 !important; } [data-theme="dark"] .widget-card a { color: #e2e8f0 !important; } [data-theme="dark"] .widget-trend-item a, [data-theme="dark"] .widget-trend-link { color: #e2e8f0 !important; } [data-theme="dark"] .widget-trend-item a:hover, [data-theme="dark"] .widget-trend-link:hover { color: #81d742 !important; } [data-theme="dark"] .widget-trend-item:hover { background: rgba(255,255,255,0.06) !important; } /* ======================================== SECTION 30 - BLOG MODULE (blog-module-hero) ======================================== */ [data-theme="dark"] .blog-module-hero .blog-card { background: #252538 !important; box-shadow: 0 2px 10px rgba(0,0,0,0.4) !important; } [data-theme="dark"] .blog-module-hero .blog-card:hover { box-shadow: 0 6px 20px rgba(0,0,0,0.5) !important; } [data-theme="dark"] .blog-module-hero .blog-card-title { color: #e2e8f0 !important; } [data-theme="dark"] .blog-module-hero .blog-card-excerpt { color: #94a3b8 !important; } [data-theme="dark"] .blog-module-hero .blog-card-meta { color: #64748b !important; } [data-theme="dark"] .blog-module-hero .blog-view-more-btn { background: #2d2d40 !important; color: #e2e8f0 !important; box-shadow: 0 2px 8px rgba(0,0,0,0.3) !important; } [data-theme="dark"] .blog-module-hero .blog-view-more-btn:hover { background: #3a3a52 !important; color: #e2e8f0 !important; } [data-theme="dark"] .blog-module-hero .blog-module-title { color: #e2e8f0 !important; } /* ======================================== SECTION 31 - BLOG PAGE (blog.php) ======================================== */ [data-theme="dark"] .blog-card { background: #252538 !important; box-shadow: 0 2px 10px rgba(0,0,0,0.4) !important; } [data-theme="dark"] .blog-card:hover { box-shadow: 0 4px 20px rgba(0,0,0,0.5) !important; } [data-theme="dark"] .blog-card-title { color: #e2e8f0 !important; } [data-theme="dark"] .blog-card:hover .blog-card-title { color: var(--zikpic-dark-green) !important; } [data-theme="dark"] .blog-card-excerpt { color: #94a3b8 !important; } [data-theme="dark"] .blog-card-meta { color: #64748b !important; border-top-color: #3a3a52 !important; } /* ======================================== SECTION 32 - BLOG POST CONTENT TABLES ======================================== */ [data-theme="dark"] .content-section table { background: #252538 !important; border-color: #3a3a52 !important; } [data-theme="dark"] .content-section table td, [data-theme="dark"] .content-section table th { border-color: #3a3a52 !important; color: #e2e8f0 !important; } [data-theme="dark"] .content-section table th { background: #2d2d40 !important; color: #c8d6e5 !important; } [data-theme="dark"] .content-section table tr:nth-child(even) { background: rgba(255,255,255,0.03) !important; } /* ======================================== SECTION 33 - GLOBAL HEADER SEARCH RESULTS ======================================== */ [data-theme="dark"] .result-info h4 { color: #e2e8f0 !important; } [data-theme="dark"] .result-author, [data-theme="dark"] .result-genre, [data-theme="dark"] .result-count { color: #94a3b8 !important; } [data-theme="dark"] .search-result-item { border-bottom-color: rgba(255,255,255,0.07) !important; } [data-theme="dark"] .search-result-item:hover { background: #2d2d40 !important; } [data-theme="dark"] .search-section { border-bottom-color: rgba(255,255,255,0.07) !important; } /* Separador de episodio en móvil */ @media (max-width: 768px) { [data-theme="dark"] .episode-details-card { border-bottom-color: #3a3a52 !important; } } /* ======================================== SECTION 34 - DASHBOARD NOTIFICATIONS PAGE ======================================== */ [data-theme="dark"] .notification-card { background: #252538 !important; box-shadow: 0 2px 8px rgba(0,0,0,0.3) !important; } [data-theme="dark"] .notification-card:hover { box-shadow: 0 4px 15px rgba(0,0,0,0.45) !important; } [data-theme="dark"] .notification-card.unread { background: #2a2a40 !important; } [data-theme="dark"] .notification-content h5 { color: #e2e8f0 !important; } [data-theme="dark"] .notification-content p { color: #94a3b8 !important; } [data-theme="dark"] .notification-time { color: #64748b !important; } [data-theme="dark"] .btn-mark-read { background: #2d2d40 !important; color: #e2e8f0 !important; } [data-theme="dark"] .btn-mark-read:hover { background: #3a3a52 !important; } [data-theme="dark"] .bulk-actions { background: #252538 !important; border-color: #3a3a52 !important; } [data-theme="dark"] .pagination-controls { background: #252538 !important; box-shadow: 0 2px 8px rgba(0,0,0,0.3) !important; } [data-theme="dark"] .pagination-controls button:disabled { background: #2d2d40 !important; color: #64748b !important; } /* ======================================== SECTION 35 - MENSAJES PAGE ======================================== */ /* Ocultar imagen de fondo del banner en dark */ [data-theme="dark"] .messages-header { background-image: none !important; } /* Título y subtítulo del banner */ [data-theme="dark"] .messages-header h1 { text-shadow: none !important; } [data-theme="dark"] .messages-header p { text-shadow: none !important; } /* Textos del card de mensaje */ [data-theme="dark"] .message-from { color: #e2e8f0 !important; } [data-theme="dark"] .message-subject { color: #e2e8f0 !important; } [data-theme="dark"] .message-preview { color: #94a3b8 !important; } [data-theme="dark"] .message-date { color: #94a3b8 !important; } [data-theme="dark"] .message-card { background: #252538 !important; box-shadow: 0 2px 8px rgba(0,0,0,0.3) !important; } [data-theme="dark"] .message-card:hover { box-shadow: 0 4px 16px rgba(0,0,0,0.45) !important; } [data-theme="dark"] .message-card.unread { background: #2a2a40 !important; } [data-theme="dark"] .thread-message-content { background: #2d2d40 !important; border-color: #3a3a52 !important; color: #e2e8f0 !important; } /* Stat cards (mensajes y favoritos) — los no activos (gris claro) */ [data-theme="dark"] .messages-stats .stat-card, [data-theme="dark"] .favorites-stats .stat-card { background: #2d2d40 !important; border-color: rgba(255,255,255,0.07) !important; } [data-theme="dark"] .messages-stats .stat-card .stat-label, [data-theme="dark"] .favorites-stats .stat-card .stat-label { color: #94a3b8 !important; } /* ======================================== SECTION 36 - FAVORITES PAGE ======================================== */ /* Ocultar imagen de fondo del banner en dark */ [data-theme="dark"] .favorites-header { background-image: none !important; } /* Título y subtítulo del banner */ [data-theme="dark"] .favorites-header h1 { text-shadow: none !important; } [data-theme="dark"] .favorites-header p { text-shadow: none !important; } [data-theme="dark"] .section-header { border-bottom-color: rgba(255,255,255,0.07) !important; } [data-theme="dark"] .empty-favorites { background: #252538 !important; } [data-theme="dark"] .empty-favorites h3 { color: #94a3b8 !important; } [data-theme="dark"] .empty-favorites p { color: #64748b !important; } /* ======================================== SECTION 37 - USERCONFIG ACCORDION ======================================== */ [data-theme="dark"] .accordion-section { background: #252538 !important; box-shadow: 0 2px 8px rgba(0,0,0,0.3) !important; } [data-theme="dark"] .accordion-section:hover { box-shadow: 0 4px 16px rgba(0,0,0,0.45) !important; } [data-theme="dark"] .accordion-header { background: linear-gradient(135deg, #2d2d40 0%, #252538 100%) !important; border-bottom-color: rgba(255,255,255,0.07) !important; } [data-theme="dark"] .accordion-header:hover { background: linear-gradient(135deg, #3a3a52 0%, #2d2d40 100%) !important; } [data-theme="dark"] .accordion-header.active { background: linear-gradient(135deg, #2a3a2a 0%, #252538 100%) !important; border-bottom-color: rgba(113,234,102,0.2) !important; } [data-theme="dark"] .accordion-title { color: #e2e8f0 !important; } [data-theme="dark"] .accordion-content { background: #1e1e2e !important; } [data-theme="dark"] .resend-modal-content { background: #252538 !important; } [data-theme="dark"] .resend-modal-header { border-bottom-color: #3a3a52 !important; } [data-theme="dark"] .resend-modal-btn-cancel { background: #2d2d40 !important; color: #e2e8f0 !important; } /* ======================================== SECTION 38 - DASHBOARD PANEL TITLES + USERCONFIG INNER SECTIONS ======================================== */ /* Títulos h1 en el panel creador (todas las páginas del dashboard) */ [data-theme="dark"] .creator-panel-title h1 { color: #e2e8f0 !important; } [data-theme="dark"] .creator-panel-title > div > p { color: #94a3b8 !important; } /* Contenedor principal userconfig */ [data-theme="dark"] .userconfig-container { background: #1e1e2e !important; } [data-theme="dark"] .config-section { border-bottom-color: rgba(255,255,255,0.07) !important; } [data-theme="dark"] .config-section h3 { color: #e2e8f0 !important; } [data-theme="dark"] .config-section-description { color: #94a3b8 !important; } [data-theme="dark"] .user-info-card { background: #252538 !important; } [data-theme="dark"] .user-info-row { color: #e2e8f0 !important; } /* Caja de sesión persistente (fondo verde claro) */ [data-theme="dark"] .session-info-box { background: linear-gradient(135deg, #1a2e1a 0%, #1e3a1e 100%) !important; border-color: rgba(129,199,132,0.25) !important; box-shadow: 0 2px 8px rgba(0,0,0,0.3) !important; } [data-theme="dark"] .session-info-box h4 { color: #81c784 !important; } [data-theme="dark"] .session-info-item { background: rgba(255,255,255,0.05) !important; border-color: rgba(129,199,132,0.1) !important; } [data-theme="dark"] .session-info-item strong { color: #94a3b8 !important; } [data-theme="dark"] .session-info-item span { color: #e2e8f0 !important; } /* Alertas de sesiones múltiples */ [data-theme="dark"] [style*="background: #fff3cd"], [data-theme="dark"] [style*="background:#fff3cd"] { background: rgba(255, 193, 7, 0.1) !important; color: #ffd54f !important; border-color: rgba(255,193,7,0.2) !important; } /* ======================================== SECTION 39 - DEVICES PANEL ======================================== */ [data-theme="dark"] .devices-panel { background: #252538 !important; box-shadow: 0 2px 8px rgba(0,0,0,0.3) !important; } [data-theme="dark"] .devices-panel h3 { color: #e2e8f0 !important; } [data-theme="dark"] .device-item { background: #2d2d40 !important; border-color: #3a3a52 !important; } [data-theme="dark"] .device-item:hover { background: #3a3a52 !important; } [data-theme="dark"] .device-item.current { background: #1a2e1a !important; border-color: rgba(129,215,66,0.35) !important; } [data-theme="dark"] .device-name { color: #e2e8f0 !important; } [data-theme="dark"] .device-details { color: #94a3b8 !important; } [data-theme="dark"] .device-modal { background: #252538 !important; } [data-theme="dark"] .device-modal-header { border-bottom-color: #3a3a52 !important; } [data-theme="dark"] .device-modal-header h3 { color: #e2e8f0 !important; } /* Etiquetas de subsección dentro de acordeones (userconfig) */ [data-theme="dark"] .display-pref-label { color: #e2e8f0 !important; } [data-theme="dark"] .display-pref-desc { color: #94a3b8 !important; } /* ======================================== SECTION 40 - PROFILE EDIT PAGE ======================================== */ [data-theme="dark"] .profile-edit-container { background: #1e1e2e !important; } [data-theme="dark"] .modal-cropper { background: #252538 !important; } [data-theme="dark"] .modal-cropper-header, [data-theme="dark"] .modal-cropper-footer { background: #2d2d40 !important; border-color: #3a3a52 !important; } [data-theme="dark"] .modal-cropper-header span { color: #e2e8f0 !important; } [data-theme="dark"] .modal-cropper-body { background: #252538 !important; } [data-theme="dark"] .social-input-prefix { background: #2d2d40 !important; color: #94a3b8 !important; border-right-color: #3a3a52 !important; } [data-theme="dark"] .social-input-field { background: #252538 !important; } /* ======================================== SECTION 41 - INFO BOXES AZULES (inline #e3f2fd / #f0f8ff) ======================================== */ /* "Sesiones persistentes" box en userconfig */ [data-theme="dark"] [style*="background: #e3f2fd"] { background: rgba(33,150,243,0.08) !important; } [data-theme="dark"] [style*="background: #e3f2fd"] strong, [data-theme="dark"] [style*="background: #e3f2fd"] a { color: #60a5fa !important; } [data-theme="dark"] [style*="background: #e3f2fd"] p, [data-theme="dark"] [style*="background: #e3f2fd"] span { color: #94a3b8 !important; } /* "Información de Seguridad" box en devices-panel */ [data-theme="dark"] [style*="background: #f0f8ff"] { background: rgba(33,150,243,0.08) !important; } [data-theme="dark"] [style*="background: #f0f8ff"] strong { color: #e2e8f0 !important; } [data-theme="dark"] [style*="background: #f0f8ff"] li { color: #94a3b8 !important; } /* Badge reader (badge-reader usa #e3f2fd como clase) */ [data-theme="dark"] .badge-reader { background: rgba(33,150,243,0.12) !important; color: #60a5fa !important; border-color: rgba(33,150,243,0.25) !important; } [data-theme="dark"] .badge-creator { background: rgba(123,31,162,0.15) !important; color: #ce93d8 !important; border-color: rgba(123,31,162,0.3) !important; } /* ============================================================ */ /* SECCIÓN 42 — Dashboard index: modales, cards, badges, boxes */ /* ============================================================ */ /* Degradado del banner de series cards: blanco → dark en dark mode */ [data-theme="dark"] .mini-image-with-gradient::after { content: ''; position: absolute; bottom: 0; left: 0; right: 0; height: 45%; background: linear-gradient(transparent, #252538); pointer-events: none; border-radius: 0 0 0 0; } /* --- Modales de creación/edición (fondo blanco → dark) --- */ [data-theme="dark"] .modal-content { background: #252538 !important; color: #e2e8f0 !important; border-color: rgba(255,255,255,0.07) !important; } [data-theme="dark"] .modal-header { background: #252538 !important; border-bottom: 1px solid rgba(255,255,255,0.07) !important; } [data-theme="dark"] .modal-body { background: #252538 !important; } [data-theme="dark"] .modal-footer { background: #252538 !important; border-top: 1px solid rgba(255,255,255,0.07) !important; } [data-theme="dark"] .modal-title { color: inherit !important; } [data-theme="dark"] .modal-content .form-label, [data-theme="dark"] .modal-content .form-group label, [data-theme="dark"] .modal-content label { color: #e2e8f0 !important; } [data-theme="dark"] .modal-content .genre-option, [data-theme="dark"] .modal-content .comic-genre-option { color: #cbd5e1 !important; } [data-theme="dark"] .modal-content small, [data-theme="dark"] .modal-content .text-muted { color: #94a3b8 !important; } [data-theme="dark"] .modal-content [style*="color: #6c757d"], [data-theme="dark"] .modal-content [style*="color:#6c757d"] { color: #94a3b8 !important; } [data-theme="dark"] .modal-content p, [data-theme="dark"] .modal-content span:not(.badge) { color: #cbd5e1 !important; } [data-theme="dark"] .modal-content .form-control, [data-theme="dark"] .modal-content .form-select, [data-theme="dark"] .modal-content select, [data-theme="dark"] .modal-content textarea, [data-theme="dark"] .modal-content input[type="text"], [data-theme="dark"] .modal-content input[type="number"], [data-theme="dark"] .modal-content input[type="url"] { background: #2d2d40 !important; color: #e2e8f0 !important; border-color: #3a3a52 !important; } [data-theme="dark"] .modal-content .form-control::placeholder, [data-theme="dark"] .modal-content textarea::placeholder { color: #64748b !important; } [data-theme="dark"] .modal-content .close-modal { background: rgba(255,255,255,0.1) !important; color: #e2e8f0 !important; } /* --- Alertas dentro de modales --- */ [data-theme="dark"] .alert-danger { background-color: rgba(220,53,69,0.12) !important; color: #f1aeb5 !important; border-color: rgba(220,53,69,0.3) !important; } [data-theme="dark"] .alert-warning { background-color: rgba(255,193,7,0.12) !important; color: #ffd54f !important; border-color: rgba(255,193,7,0.3) !important; } [data-theme="dark"] .alert-info { background-color: rgba(13,202,240,0.1) !important; color: #67e8f9 !important; border-color: rgba(13,202,240,0.25) !important; } /* --- Botones sutiles (.btn-subtle) en cards del dashboard --- */ [data-theme="dark"] .btn-subtle { background: #2d2d40 !important; border-color: #3a3a52 !important; color: #94a3b8 !important; } [data-theme="dark"] .btn-subtle.gestionar:hover { background: #1e2d3d !important; border-color: #3182ce !important; color: #60a5fa !important; } [data-theme="dark"] .btn-subtle.editar:hover { background: #2a2515 !important; border-color: #d69e2e !important; color: #f6d860 !important; } [data-theme="dark"] .btn-subtle.imagen:hover { background: #252538 !important; border-color: #6b7280 !important; color: #e2e8f0 !important; } [data-theme="dark"] .btn-subtle.revisar:hover { background: #1a2e24 !important; border-color: #38a169 !important; color: #68d391 !important; } [data-theme="dark"] .btn-subtle.ver:hover { background: #0d2535 !important; border-color: #0891b2 !important; color: #38bdf8 !important; } [data-theme="dark"] .btn-subtle.eliminar:hover { background: #2d1515 !important; border-color: #e53e3e !important; color: #fc8181 !important; } /* --- Portada por defecto (sin imagen) --- */ [data-theme="dark"] .series-cover { background: linear-gradient(135deg, #2d2d40 0%, #252538 100%) !important; } /* --- Box estado: "Serie aprobada y publicada" (#f0fff4) --- */ [data-theme="dark"] [style*="background: #f0fff4"], [data-theme="dark"] [style*="background:#f0fff4"] { background: rgba(39,174,96,0.1) !important; border-color: rgba(39,174,96,0.25) !important; } [data-theme="dark"] [style*="background: #f0fff4"] div, [data-theme="dark"] [style*="background: #f0fff4"] strong, [data-theme="dark"] [style*="background: #f0fff4"] small, [data-theme="dark"] [style*="background:#f0fff4"] div, [data-theme="dark"] [style*="background:#f0fff4"] strong, [data-theme="dark"] [style*="background:#f0fff4"] small { color: #68d391 !important; } /* --- Box estado: "pendiente/enviada" (#fff3cd) — ya cubierto en sección 38 pero reforzamos --- */ [data-theme="dark"] [style*="background: #fff3cd"] div, [data-theme="dark"] [style*="background: #fff3cd"] strong, [data-theme="dark"] [style*="background: #fff3cd"] small { color: #ffd54f !important; } /* --- Box estado: rechazada (#f8d7da) --- */ [data-theme="dark"] [style*="background-color: #f8d7da"], [data-theme="dark"] [style*="background: #f8d7da"] { background: rgba(220,53,69,0.1) !important; border-color: rgba(220,53,69,0.25) !important; color: #f1aeb5 !important; } /* --- Box estado: advertencia amarilla (#fff3cd con background-color) --- */ [data-theme="dark"] [style*="background-color: #fff3cd"] { background-color: rgba(255,193,7,0.1) !important; border-color: rgba(255,193,7,0.25) !important; color: #ffd54f !important; } /* --- Control de Visibilidad: opciones de privacidad (.privacy-option) --- */ [data-theme="dark"] .privacy-option { background: #2d2d40 !important; border-color: #3a3a52 !important; color: #e2e8f0 !important; } [data-theme="dark"] .privacy-option span { color: inherit !important; } [data-theme="dark"] .privacy-info { color: #60a5fa !important; } /* ============================================================ */ /* SECCIÓN 43 — Página about.php (nosotros) */ /* ============================================================ */ /* --- Hero section (fondo blanco) --- */ [data-theme="dark"] .hero-section h1 { color: #e2e8f0 !important; } [data-theme="dark"] .hero-section .subtitle { color: #94a3b8 !important; } /* --- Highlight box (#f8fdf4 verde muy claro) --- */ [data-theme="dark"] .highlight-box { background: rgba(129,215,66,0.07) !important; border-left-color: var(--zikpic-primary, #81d742) !important; } [data-theme="dark"] .highlight-box p, [data-theme="dark"] .highlight-box strong { color: #cbd5e1 !important; } /* --- Feature cards (fondo blanco/gris claro) --- */ [data-theme="dark"] .feature-card { background: linear-gradient(135deg, #2d2d40 0%, #252538 100%) !important; } [data-theme="dark"] .feature-title { color: #e2e8f0 !important; } [data-theme="dark"] .feature-description { color: #94a3b8 !important; } /* --- Círculos de icono en feature cards (.box-zp-feature-bg) --- */ [data-theme="dark"] .box-zp-feature-bg { background: #3a3a52 !important; } /* --- Cards Zik/Pic (gradiente con #ececec abajo) --- */ [data-theme="dark"] .box-zikpic-z { background: linear-gradient(0deg, #2d2d40 0%, rgba(45,45,64,0) 60%) !important; } /* --- Tarjetas divisiones ZikStart / ZikPro (inline background: white) --- */ [data-theme="dark"] .about-main [style*="background: white"] { background: #252538 !important; } [data-theme="dark"] .about-main [style*="background: white"] h3[style*="color: #19547b"] { color: #60a5fa !important; } [data-theme="dark"] .about-main [style*="background: white"] li, [data-theme="dark"] .about-main [style*="background: white"] p { color: #94a3b8 !important; } /* --- Botón CTA (fondo blanco con texto verde) --- */ [data-theme="dark"] .cta-btn { background: rgba(255,255,255,0.1) !important; color: white !important; } [data-theme="dark"] .cta-btn:hover { background: rgba(255,255,255,0.2) !important; } /* ============================================================ */ /* SECCIÓN 44 — manage-series-images.php */ /* ============================================================ */ /* --- Tarjetas de imagen (Portada / Banner / Miniatura) --- */ [data-theme="dark"] .image-card { background: #252538 !important; box-shadow: 0 4px 24px rgba(0,0,0,0.35) !important; } [data-theme="dark"] .image-card .img-label { color: #e2e8f0 !important; } [data-theme="dark"] .image-card .img-size { color: #94a3b8 !important; } [data-theme="dark"] .image-card .img-desc { color: #94a3b8 !important; } /* --- Zona de subida (upload-zone) --- */ [data-theme="dark"] .upload-zone { background: #2d2d40 !important; border-color: #3a3a52 !important; color: #e2e8f0 !important; } [data-theme="dark"] .upload-zone:hover, [data-theme="dark"] .upload-zone.drag-over { background: rgba(129,215,66,0.08) !important; border-color: var(--zikpic-green, #81d742) !important; } [data-theme="dark"] .upload-zone i { color: #94a3b8 !important; } /* --- Sección colores y sus tarjetas internas --- */ [data-theme="dark"] .color-section { background: #1e1e2e !important; } [data-theme="dark"] .color-card, [data-theme="dark"] .color-controls { background: #252538 !important; box-shadow: 0 2px 12px rgba(0,0,0,0.3) !important; } /* --- Contenedor vista previa real --- */ [data-theme="dark"] .real-preview-container { background: #1e1e2e !important; } /* --- Títulos y etiquetas de sección --- */ [data-theme="dark"] .preview-section-title { color: #e2e8f0 !important; border-bottom-color: #3a3a52 !important; } [data-theme="dark"] .color-section .form-group label { color: #e2e8f0 !important; } [data-theme="dark"] .color-section h2, [data-theme="dark"] .color-section h3, [data-theme="dark"] .color-section h4, [data-theme="dark"] .color-section p { color: #cbd5e1 !important; } /* --- Inputs de texto de color --- */ [data-theme="dark"] .color-text { background: #2d2d40 !important; color: #e2e8f0 !important; border-color: #3a3a52 !important; } /* ============================================================ */ /* SECCIÓN 45 — edit-comic-episode.php */ /* ============================================================ */ /* --- Upload zone: textos (fondo ya cubierto en sección 44) --- */ [data-theme="dark"] .upload-zone h3 { color: #e2e8f0 !important; } [data-theme="dark"] .upload-zone p { color: #94a3b8 !important; } [data-theme="dark"] .upload-zone small, [data-theme="dark"] .upload-zone .text-muted { color: #94a3b8 !important; } [data-theme="dark"] .upload-zone small strong { color: #b8c8e0 !important; } /* --- Barra de acción (Páginas del Episodio) --- */ [data-theme="dark"] .action-buttons { background: #252538 !important; box-shadow: none !important; } [data-theme="dark"] .action-buttons h5 { color: #e2e8f0 !important; } [data-theme="dark"] .action-buttons .text-muted { color: #94a3b8 !important; } [data-theme="dark"] .action-buttons .form-check-label { color: #e2e8f0 !important; } [data-theme="dark"] .upload-progress { background: rgba(30,30,46,0.95) !important; color: #e2e8f0 !important; } /* --- Sección de páginas --- */ [data-theme="dark"] .pages-section { background: #252538 !important; } [data-theme="dark"] .pages-section h2 { color: #e2e8f0 !important; } [data-theme="dark"] .pages-preview-section { border-top-color: #3a3a52 !important; } [data-theme="dark"] .pages-preview-section h6 { color: #e2e8f0 !important; } /* --- Tarjeta de página individual (.page-card) --- */ [data-theme="dark"] .page-card { background: #2d2d40 !important; border-color: #3a3a52 !important; } [data-theme="dark"] .page-card.sortable-ghost { background: rgba(13,110,253,0.1) !important; } [data-theme="dark"] .page-thumb { background: #1e1e2e !important; } [data-theme="dark"] .page-meta { background: #1e1e2e !important; border-top-color: #3a3a52 !important; } [data-theme="dark"] .page-name { color: #cbd5e1 !important; } [data-theme="dark"] .page-date { color: #64748b !important; } /* --- Elemento de página en vista compacta (.page-item) --- */ [data-theme="dark"] .page-item { background: #2d2d40 !important; border-color: #3a3a52 !important; } [data-theme="dark"] .page-item:hover { background: #3a3a52 !important; } [data-theme="dark"] .page-item.sortable-chosen { background: rgba(39,174,96,0.12) !important; border-color: var(--zikpic-green, #81d742) !important; } /* --- Vista previa doble página --- */ [data-theme="dark"] .preview-double-page { background: #252538 !important; border-color: #3a3a52 !important; } [data-theme="dark"] .preview-double-page.is-cover { background: rgba(13,110,253,0.08) !important; } /* --- Handle de arrastre --- */ [data-theme="dark"] .drag-handle { background: rgba(45,45,64,0.9) !important; color: #94a3b8 !important; } [data-theme="dark"] .drag-handle:hover { background: rgba(129,215,66,0.15) !important; } /* --- Empty state --- */ [data-theme="dark"] .empty-state { color: #94a3b8 !important; } [data-theme="dark"] .empty-state h4 { color: #cbd5e1 !important; } [data-theme="dark"] .empty-state i { color: #3a3a52 !important; } /* ============================================== SECCIÓN 46 — Modal: Reader Config Card + Créditos Tom Select (dashboard/index.php — modales crear/editar serie) ============================================== */ /* Tarjeta "Configuración del Lector" dentro de modales */ [data-theme="dark"] .modal-content .card, [data-theme="dark"] .modal-content .card-body { background-color: #2d2d40 !important; border-color: #3a3a52 !important; color: #e2e8f0 !important; } [data-theme="dark"] .modal-content .card .form-label, [data-theme="dark"] .modal-content .card label { color: #e2e8f0 !important; } [data-theme="dark"] .modal-content .card .form-select, [data-theme="dark"] .modal-content .card .form-control, [data-theme="dark"] .modal-content .card input, [data-theme="dark"] .modal-content .card select { background-color: #252538 !important; color: #e2e8f0 !important; border-color: #3a3a52 !important; } [data-theme="dark"] .modal-content .card small, [data-theme="dark"] .modal-content .card .text-muted { color: #94a3b8 !important; } /* Botones de toggle (dirección, página doble, zoom, swipe, tema, 3D) dentro de modal */ [data-theme="dark"] .modal-content .card .btn-group .btn, [data-theme="dark"] .modal-content .card .btn-outline-secondary { color: #e2e8f0 !important; border-color: #3a3a52 !important; background-color: #252538 !important; } [data-theme="dark"] .modal-content .card .btn-group .btn.active, [data-theme="dark"] .modal-content .card .btn-group .btn:active { background-color: #3a3a52 !important; color: #e2e8f0 !important; } /* Tom Select (inputs de créditos / autor) dentro de modales */ [data-theme="dark"] .modal-content .ts-wrapper .ts-control, [data-theme="dark"] .modal-content .ts-wrapper .ts-control input { background-color: #252538 !important; color: #e2e8f0 !important; border-color: #3a3a52 !important; } [data-theme="dark"] .modal-content .ts-wrapper .ts-control .item { color: #e2e8f0 !important; background-color: #3a3a52 !important; } [data-theme="dark"] .modal-content .ts-wrapper .ts-dropdown { background-color: #2d2d40 !important; border-color: #3a3a52 !important; color: #e2e8f0 !important; } [data-theme="dark"] .modal-content .ts-wrapper .ts-dropdown .option, [data-theme="dark"] .modal-content .ts-wrapper .ts-dropdown .optgroup-header { color: #e2e8f0 !important; } [data-theme="dark"] .modal-content .ts-wrapper .ts-dropdown .option:hover, [data-theme="dark"] .modal-content .ts-wrapper .ts-dropdown .active { background-color: #3a3a52 !important; color: #e2e8f0 !important; } /* Botón quitar crédito */ [data-theme="dark"] .modal-content .remove-credito-btn { background: #252538 !important; border-color: #e74c3c !important; color: #e74c3c !important; } [data-theme="dark"] .modal-content .remove-credito-btn:hover { background: #3a3a52 !important; } /* Tom Select fuera de modal (manage-series.php standalone) */ [data-theme="dark"] .creditos-block .ts-wrapper .ts-control, [data-theme="dark"] .creditos-block .ts-wrapper .ts-control input { background-color: #252538 !important; color: #e2e8f0 !important; border-color: #3a3a52 !important; } [data-theme="dark"] .creditos-block .ts-wrapper .ts-control .item { color: #e2e8f0 !important; background-color: #3a3a52 !important; } [data-theme="dark"] .creditos-block .ts-wrapper .ts-dropdown { background-color: #2d2d40 !important; border-color: #3a3a52 !important; color: #e2e8f0 !important; } [data-theme="dark"] .creditos-block .ts-wrapper .ts-dropdown .option { color: #e2e8f0 !important; } [data-theme="dark"] .creditos-block .ts-wrapper .ts-dropdown .option:hover, [data-theme="dark"] .creditos-block .ts-wrapper .ts-dropdown .active { background-color: #3a3a52 !important; color: #e2e8f0 !important; } [data-theme="dark"] .creditos-block .remove-credito-btn { background: #252538 !important; color: #e74c3c !important; } /* ============================================== SECCIÓN 47 — Modal Guía del Creador (dashboard/index.php — .guide-modal) ============================================== */ [data-theme="dark"] .guide-modal-content { background: #1e1e2e !important; box-shadow: 0 20px 60px rgba(0,0,0,0.6) !important; } /* Botón cerrar */ [data-theme="dark"] .guide-close { background: #2d2d40 !important; color: #e2e8f0 !important; } [data-theme="dark"] .guide-close:hover { background: #3a3a52 !important; } /* Barra de tabs */ [data-theme="dark"] .guide-tabs { background: #252538 !important; border-bottom-color: #3a3a52 !important; } [data-theme="dark"] .guide-tab { color: #94a3b8 !important; } [data-theme="dark"] .guide-tab:hover { background: rgba(58,58,82,0.4) !important; color: #e2e8f0 !important; } [data-theme="dark"] .guide-tab.active { color: #e2e8f0 !important; background: #1e1e2e !important; } /* Cuerpo del contenido */ [data-theme="dark"] .guide-content { background: #1e1e2e !important; } [data-theme="dark"] .guide-tab-content h3 { color: #e2e8f0 !important; } [data-theme="dark"] .guide-step { border-bottom-color: #3a3a52 !important; } [data-theme="dark"] .step-content h4 { color: #e2e8f0 !important; } [data-theme="dark"] .step-content p, [data-theme="dark"] .step-content ul, [data-theme="dark"] .step-content li { color: #94a3b8 !important; } /* Nota informativa */ [data-theme="dark"] .guide-note { background: rgba(33,150,243,0.1) !important; border-left-color: #2196F3 !important; } [data-theme="dark"] .guide-note p, [data-theme="dark"] .guide-note span { color: #94a3b8 !important; } [data-theme="dark"] .guide-note strong { color: #90caf9 !important; } /* Tips */ [data-theme="dark"] .guide-tips { background: rgba(230,81,0,0.12) !important; } [data-theme="dark"] .guide-tips h4 { color: #ffb74d !important; } [data-theme="dark"] .guide-tips li { color: #94a3b8 !important; } /* Footer */ [data-theme="dark"] .guide-footer { background: #252538 !important; color: #94a3b8 !important; border-top: 1px solid #3a3a52 !important; } /* ============================================== SECCIÓN 48 — Imágenes duales dark/light (SeriesRenderer.php créditos + series.css episodios) ============================================== */ /* Manga Team logo: mostrar versión correcta según tema */ .credits-team-logo--dark { display: none; } [data-theme="dark"] .credits-team-logo--light { display: none !important; } [data-theme="dark"] .credits-team-logo--dark { display: inline-block !important; } /* Imagen episodios (zp-epi-mirada): versión dark */ [data-theme="dark"] .chapters-img-subtitle { background-image: url('/assets/img/zp-epi-mirada-dark.webp') !important; } /* ============================================== SECCIÓN 49 — social.php: modal "Nueva publicación" (.composer-modal y .post-modal) ============================================== */ /* Contenedor principal */ [data-theme="dark"] .composer-modal { background: #252538 !important; box-shadow: 0 10px 40px rgba(0,0,0,0.5) !important; } /* Header */ [data-theme="dark"] .composer-modal-header { border-bottom-color: #3a3a52 !important; } [data-theme="dark"] .composer-modal-title { color: #e2e8f0 !important; } [data-theme="dark"] .composer-modal-close { color: #94a3b8 !important; } [data-theme="dark"] .composer-modal-close:hover { background: #3a3a52 !important; color: #e2e8f0 !important; } /* Body / textarea */ [data-theme="dark"] .composer-modal-body { background: #252538 !important; } [data-theme="dark"] .modal-composer-textarea { /* background: #2d2d40 !important; */ color: #e2e8f0 !important; } [data-theme="dark"] .modal-composer-textarea::placeholder { color: #64748b !important; } /* Footer */ [data-theme="dark"] .composer-modal-footer { border-top-color: #3a3a52 !important; background: #252538 !important; } /* Preview serie adjunta */ [data-theme="dark"] .modal-series-preview-card { background: #2d2d40 !important; border-color: #3a3a52 !important; } [data-theme="dark"] .modal-series-preview-title { color: #e2e8f0 !important; } [data-theme="dark"] .modal-series-preview-description { color: #94a3b8 !important; } [data-theme="dark"] .modal-series-preview-author { color: #64748b !important; } [data-theme="dark"] .modal-image-preview img { border-color: #3a3a52 !important; } /* post-modal-container (modal de lectura de post) */ [data-theme="dark"] .post-modal-container { background: #252538 !important; } [data-theme="dark"] .post-modal-header { border-bottom-color: #3a3a52 !important; } [data-theme="dark"] .post-modal-user-details h4 { color: #e2e8f0 !important; } [data-theme="dark"] .post-modal-user-details span { color: #94a3b8 !important; } [data-theme="dark"] .post-modal-close:hover { background: #3a3a52 !important; color: #e2e8f0 !important; } [data-theme="dark"] .post-modal-content { color: #e2e8f0 !important; } [data-theme="dark"] .post-modal-actions, [data-theme="dark"] .post-modal-footer { border-color: #3a3a52 !important; background: #252538 !important; } /* ============================================== SECCIÓN 50 — dashboard/crear-evento.php ============================================== */ /* Contenedor principal */ [data-theme="dark"] .create-event-container { background: #1e1e2e !important; } /* Cabecera del formulario */ [data-theme="dark"] .form-header h1 { color: #e2e8f0 !important; } [data-theme="dark"] .form-header p { color: #94a3b8 !important; } /* Etiquetas y ayudas */ [data-theme="dark"] .form-label { color: #e2e8f0 !important; } [data-theme="dark"] .form-help { color: #64748b !important; } /* Inputs, textarea, select */ [data-theme="dark"] .form-input, [data-theme="dark"] .form-textarea, [data-theme="dark"] .form-select { background: #2d2d40 !important; border-color: #3a3a52 !important; color: #e2e8f0 !important; } [data-theme="dark"] .form-input:focus, [data-theme="dark"] .form-textarea:focus, [data-theme="dark"] .form-select:focus { border-color: #667eea !important; } /* Zona de upload del banner */ [data-theme="dark"] .banner-upload, [data-theme="dark"] .upload-zone { background: #2d2d40 !important; border-color: #3a3a52 !important; } [data-theme="dark"] .banner-upload:hover, [data-theme="dark"] .upload-zone:hover, [data-theme="dark"] .upload-zone.drag-over { background: #3a3a52 !important; border-color: #667eea !important; } /* Slots de archivos adjuntos */ [data-theme="dark"] .attachment-slot { background: #2d2d40 !important; border-color: #3a3a52 !important; } [data-theme="dark"] .attachment-slot:hover { background: #3a3a52 !important; } [data-theme="dark"] .attachment-slot .upload-text { color: #94a3b8 !important; } /* Separador inferior + botón cancelar */ [data-theme="dark"] .form-actions { border-top-color: #3a3a52 !important; } [data-theme="dark"] .btn-secondary { background: #2d2d40 !important; color: #e2e8f0 !important; } [data-theme="dark"] .btn-secondary:hover { background: #3a3a52 !important; } /* Alertas */ [data-theme="dark"] .alert-success { background: #1a2e1a !important; color: #86efac !important; border-color: #166534 !important; } [data-theme="dark"] .alert-error { background: #2e1a1a !important; color: #fca5a5 !important; border-color: #991b1b !important; } /* Contenedor del cropper */ [data-theme="dark"] #cropperContainer { background: #2d2d40 !important; } /* CKEditor 5 — área de texto de descripción en crear-evento.php */ [data-theme="dark"] .ck.ck-editor__main > .ck-editor__editable, [data-theme="dark"] .ck.ck-editor__editable:not(.ck-editor__nested-editable) { background: #2d2d40 !important; color: #e2e8f0 !important; border-color: #3a3a52 !important; } [data-theme="dark"] .ck.ck-editor__editable.ck-focused, [data-theme="dark"] .ck.ck-editor__editable:focus { border-color: #667eea !important; box-shadow: none !important; } [data-theme="dark"] .ck.ck-toolbar { background: #252538 !important; border-color: #3a3a52 !important; } [data-theme="dark"] .ck.ck-toolbar .ck-toolbar__items .ck-button, [data-theme="dark"] .ck.ck-button { color: #e2e8f0 !important; background: transparent !important; } [data-theme="dark"] .ck.ck-button:hover, [data-theme="dark"] .ck.ck-button.ck-on { background: #3a3a52 !important; } [data-theme="dark"] .ck.ck-editor { border-color: #3a3a52 !important; } [data-theme="dark"] .ck-reset_all :not(.ck-reset_all-excluded *).ck.ck-list__item .ck-button { background: #2d2d40 !important; color: #e2e8f0 !important; } [data-theme="dark"] .ck.ck-dropdown__panel, [data-theme="dark"] .ck.ck-list { background: #252538 !important; border-color: #3a3a52 !important; } [data-theme="dark"] .ck.ck-list__item .ck-button:hover { background: #3a3a52 !important; } /* ============================================== SECCIÓN 52 — blog.php: cabecera hero ============================================== */ /* Ocultar imagen de fondo del banner en dark */ [data-theme="dark"] .blog-hero { background-image: none !important; } /* Quitar text-shadow del título y subtítulo */ [data-theme="dark"] .blog-hero h1, [data-theme="dark"] .blog-hero p { text-shadow: none !important; } /* ============================================== SECCIÓN 51 — 404.php dark mode ============================================== */ [data-theme="dark"] .error-container, [data-theme="dark"] body { background: #1e1e2e !important; } [data-theme="dark"] .error-content { background: #252538 !important; box-shadow: 0 20px 60px rgba(0,0,0,0.4) !important; } [data-theme="dark"] .error-title { color: #e2e8f0 !important; } [data-theme="dark"] .error-message { color: #94a3b8 !important; } [data-theme="dark"] .error-image-placeholder { background: #2d2d40 !important; border-color: #3a3a52 !important; } [data-theme="dark"] .suggestions { border-top-color: #3a3a52 !important; } [data-theme="dark"] .suggestions h3 { color: #e2e8f0 !important; } [data-theme="dark"] .btn-back { background: #252538 !important; border-color: var(--zikpic-green) !important; color: var(--zikpic-green) !important; } [data-theme="dark"] .btn-back:hover { background: rgba(129,215,66,0.1) !important; } /* ============================================================ SECCIÓN 53 — profile.php: modal de visualización de post ============================================================ */ /* Contenedor principal del modal */ [data-theme="dark"] #postModal .modal-container, [data-theme="dark"] #postModalCompact .modal-container { background: #252538 !important; color: #e2e8f0 !important; } /* Header y separadores de bordes hardcodeados */ [data-theme="dark"] .post-modal-header { border-bottom-color: #3a3a52 !important; } [data-theme="dark"] .post-modal-close:hover { background: #2d2d40 !important; color: #e2e8f0 !important; } /* Acciones (likes, comentarios) */ [data-theme="dark"] .post-modal-actions { border-top-color: #3a3a52 !important; border-bottom-color: #3a3a52 !important; } /* Footer del modal */ [data-theme="dark"] .post-modal-footer { background: #252538 !important; border-top-color: #3a3a52 !important; } /* Cuerpo del modal */ [data-theme="dark"] .post-modal-body { background: #252538 !important; } [data-theme="dark"] .post-modal-content { color: #e2e8f0 !important; } /* Sección de comentarios dentro del modal */ [data-theme="dark"] .post-comments-section .zik-comment { background: #2d2d40 !important; color: #e2e8f0 !important; } [data-theme="dark"] .post-comments-section .comment-composer textarea { background: #1e1e2e !important; border-color: #3a3a52 !important; color: #e2e8f0 !important; } [data-theme="dark"] .post-comments-section .comment-meta { color: #94a3b8 !important; } [data-theme="dark"] .modal-comments-section { background: #252538 !important; } /* ================== Section 54: Modal búsqueda de series ================== */ [data-theme="dark"] .series-search-result { border-color: #3a3a52 !important; background: #2d2d40 !important; } [data-theme="dark"] .series-search-result:hover { background: #3a3a52 !important; border-color: #81d742 !important; } [data-theme="dark"] .series-result-title { color: #e2e8f0 !important; } [data-theme="dark"] .series-result-meta { color: #94a3b8 !important; } /* Input de búsqueda del modal */ [data-theme="dark"] #series-search-input { background: #2d2d40 !important; border-color: #3a3a52 !important; color: #e2e8f0 !important; } [data-theme="dark"] #series-search-input::placeholder { color: #64748b !important; }